/* Crophalo: the Field tab: "Your land" as a tiled list beside the outline. Only the tokens of css/app.css. */
.land-wrap { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: var(--space-16); align-items: start; margin-top: var(--space-12); }
@media (max-width: 700px) { .land-wrap { grid-template-columns: minmax(0, 1fr); } }
.land-fig { margin: 0; padding: var(--space-12); border-radius: var(--r1); background: var(--card); box-shadow: var(--shadow); text-align: center; max-width: 220px; }
.outline { display: block; margin: 0 auto; max-width: 100%; height: auto; }
.outline-shape { fill: #e3eedf; stroke: #1b5e20; stroke-width: 2; stroke-linejoin: round; }
.outline.is-estimated .outline-shape { stroke-dasharray: 5 4; }   /* an estimate is dashed: it is not a measurement */
.outline-n { fill: none; stroke: var(--ink2); stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; } .outline-t { fill: var(--ink2); font-size: 10px; }
.land-list { margin: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(220px, 100%), 1fr)); gap: 1px; border-radius: var(--r1); background: var(--sep); box-shadow: var(--shadow); overflow: hidden; }
.land-tile { padding: var(--space-12) 14px; background: var(--card); min-width: 0; }
.land-tile dt { font-size: var(--fs-caption); color: var(--ink2); font-weight: var(--fw-semi); }
.land-tile dd { margin: 2px 0 0; display: grid; gap: 2px; }
.land-val { font-size: 15.5px; font-weight: var(--fw-bold); overflow-wrap: anywhere; }
@media print { .land-list { box-shadow: none; } }