/* Card headers with controls: controls and legend on one wrapping row */
.map-controls { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem 1rem; }
.map-controls .form-group, .map-controls .shiny-input-container { margin-bottom: 0; }
.map-controls .checkbox { margin: 0; }
.map-card .card-body { min-height: 420px; }

/* Layer legend (stops match the tiles) */
.legend-slot { flex: 1 1 260px; max-width: 380px; }
.layer-legend { width: 100%; font-size: .78rem; line-height: 1.25; }
.legend-title { font-weight: 600; }
.legend-bar { height: 10px; border-radius: 2px; margin: 2px 0; }
.legend-labels { display: flex; justify-content: space-between; color: #5b5b57; font-variant-numeric: tabular-nums; }
.legend-note { color: #5b5b57; font-size: .72rem; }

/* Pixel panel */
.pixel-stats { display: flex; gap: 1.4rem; margin-bottom: .3rem; }
.stat-value { display: block; font-size: 1.35rem; font-weight: 600; font-variant-numeric: tabular-nums; }
.stat-label { font-size: .75rem; color: #5b5b57; }
.cov-table { font-size: .8rem; }
.cov-table .num { text-align: right; font-variant-numeric: tabular-nums; }
.cov-table tr.other-sum td { font-weight: 600; border-top: 1px solid #c9c8c3; }
.cov-table tr.other td { color: #5b5b57; }
details > summary { cursor: pointer; color: #2a78d6; font-size: .85rem; }

/* Priority species table (same layout as the static site) */
.priority-card { max-width: 980px; }
.priority-card .intro { color: #5b5b57; line-height: 1.5; }
.priority-table { width: 100%; border-collapse: collapse; font-size: .88rem; }
.priority-table th { position: sticky; top: 0; background: #fff; border-bottom: 1px solid #c9c8c3; padding: 0; text-align: left; }
.priority-table th.num { text-align: right; }
.priority-table th button { border: 0; background: none; font: inherit; font-weight: 600; padding: .45rem .5rem;
  cursor: pointer; width: 100%; text-align: inherit; }
.priority-table td { padding: .32rem .5rem; border-bottom: 1px solid #f0efec; }
.priority-table td.num { text-align: right; font-variant-numeric: tabular-nums; }
.priority-table tbody tr:hover { background: #f6f6f4; }
.priority-table tr.unmodeled td { color: #5b5b57; }
.priority-table a { text-decoration: none; font-weight: 500; }
.priority-table a:hover { text-decoration: underline; }

.species-info > div { margin-bottom: .2rem; }
.about h6 { margin-top: .6rem; font-size: .8rem; font-weight: 600; }
.about p { color: #5b5b57; margin-bottom: .4rem; }
.maplibregl-popup-content { font-size: .78rem; }
.maplibregl-popup-content td { padding: 0 .3rem; }