.measurements-page { display: grid; gap: 1rem; min-width: 0; }
.measurement-toolbar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .75rem; }
.measurement-presets, .measurement-export { display: flex; flex-wrap: wrap; gap: .4rem; }
.measurement-presets button, .measurement-tabs button { min-height: 42px; border: 1px solid var(--line); border-radius: 8px; padding: .5rem .85rem; color: var(--ink); background: var(--paper); font: inherit; font-size: var(--text-control); cursor: pointer; }
.measurement-presets button[aria-pressed="true"] { color: #fff; background: var(--forest); border-color: var(--forest); }
.measurement-export a { display: inline-flex; align-items: center; text-decoration: none; }
.measurement-range { display: flex; flex-wrap: wrap; align-items: end; gap: .7rem; padding: 1rem; border-radius: 12px; background: var(--paper); border: 1px solid var(--line); }
.measurement-range label { flex: 1 1 150px; max-width: 220px; margin: 0; }
.measurement-range small { flex-basis: 100%; color: var(--muted); }
.measurement-coverage { display: flex; flex-wrap: wrap; gap: .3rem 1rem; color: var(--muted); font-size: var(--text-small); }
.measurement-coverage strong { color: var(--ink); }
.measurement-tabs { display: flex; gap: .3rem; overflow-x: auto; padding: .3rem .1rem .55rem; border-bottom: 1px solid var(--line); }
.measurement-tabs button { flex: 0 0 auto; border-color: transparent; background: transparent; border-radius: 6px; }
.measurement-tabs button[aria-selected="true"] { color: var(--forest-dark); background: #dfece4; font-weight: var(--weight-action); }
#measurement-panel { display: grid; gap: 1rem; min-width: 0; }
.measurement-section { min-width: 0; padding: clamp(1rem, 2.5vw, 1.6rem); border: 1px solid var(--line); border-radius: 16px; background: var(--paper); }
.measurement-section h2 { margin: 0 0 .6rem; }
.measurement-intro, .measurement-note, .measurement-empty { color: var(--muted); font-size: var(--text-small); line-height: 1.6; }
.measurement-intro { max-width: 86ch; margin: 0 0 1rem; }
.measurement-note { margin: 1rem 0 0; max-width: 105ch; }
#measurement-panel > .measurement-note { margin: 0; }
.measurement-empty { padding: .8rem 0; margin: 0; }
.measurement-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 155px), 1fr)); gap: .65rem; margin: .75rem 0; }
.measurement-card { display: flex; flex-direction: column; align-items: flex-start; gap: .3rem; border: 1px solid var(--line); padding: .9rem; border-radius: 9px; background: #fff; }
.measurement-card > span { font-size: var(--text-small); }
.measurement-card > strong { font-size: var(--number-large); line-height: 1.25; font-weight: var(--weight-value); font-variant-numeric: tabular-nums; }
.measurement-card > small { color: var(--muted); line-height: 1.4; }
.measurement-chart { margin: 1rem 0; }
.measurement-chart figcaption { display: flex; flex-wrap: wrap; justify-content: space-between; gap: .25rem .8rem; margin: .5rem 0; font-size: var(--text-control); font-weight: var(--weight-action); }
.measurement-chart figcaption span { color: var(--muted); font-size: var(--text-small); font-weight: var(--weight-body); }
.measurement-chart svg { display: block; width: 100%; min-height: 100px; max-height: 230px; overflow: visible; }
.measurement-chart svg text { fill: var(--muted); font: 11px Inter, system-ui, sans-serif; }
.measurement-grid { stroke: var(--line); stroke-width: 1; }
.measurement-line { fill: none; stroke: var(--forest); stroke-width: 2; vector-effect: non-scaling-stroke; }
.measurement-dot { fill: var(--forest); }
.measurement-dot.is-partial { fill: var(--paper); stroke: var(--warning); stroke-width: 2; }
.measurement-chart-note { margin: .35rem 0; color: var(--muted); font-size: var(--text-meta); }
.measurement-band-key { display: inline-flex; gap: .25rem; align-items: center; margin: .2rem .7rem .2rem 0; }
.measurement-band-key i { display: inline-block; width: .65rem; height: .65rem; }
.measurement-table-wrap { width: 100%; overflow-x: auto; margin-top: .7rem; }
.measurement-table-wrap table { width: 100%; border-collapse: collapse; font-size: var(--text-small); }
.measurement-table-wrap th, .measurement-table-wrap td { padding: .65rem .6rem; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; min-width: 5rem; }
.measurement-table-wrap th:first-child { padding-left: 0; min-width: 9rem; }
.measurement-table-wrap thead th { font-size: var(--text-meta); color: var(--muted); font-weight: var(--weight-action); }
.measurement-table-wrap tbody th { font-weight: var(--weight-action); text-transform: none; letter-spacing: normal; font-size: var(--text-small); }
.measurement-table-wrap td { font-variant-numeric: tabular-nums; }
.measurement-table-wrap small { display: block; margin-top: .25rem; color: var(--muted); font-weight: var(--weight-body); min-width: 13rem; }
.measurement-section details { margin-top: 1rem; }
.measurement-section summary, .measurement-footnotes summary { cursor: pointer; color: var(--forest-dark); font-size: var(--text-small); padding: .5rem 0; }
.measurement-category { max-width: 320px; margin: .7rem 0; }
.measurement-station-meta { display: flex; flex-wrap: wrap; gap: .5rem 1rem; align-items: center; color: var(--muted); font-size: var(--text-small); }
.measurement-station-meta a { color: var(--forest-dark); }
.measurement-badge { display: inline-block; border-radius: 5px; padding: .1rem .45rem; color: var(--forest-dark); background: #e5eee7; font-size: var(--text-meta); white-space: nowrap; }
.measurement-comparison-gaps { display: grid; gap: .8rem; }
.measurement-comparison-gaps p { display: grid; gap: .3rem; margin: 0; padding-bottom: .8rem; border-bottom: 1px solid var(--line); font-size: var(--text-small); }
.measurement-comparison-gaps p:last-child { border-bottom: 0; padding: 0; }
.measurement-comparison-gaps span { color: var(--muted); max-width: 100ch; }
.measurement-error { padding: .8rem 1rem; border: 1px solid #d9aaa5; background: #fff0ed; color: var(--danger); border-radius: 9px; font-size: var(--text-small); }
.measurement-footnotes { color: var(--muted); font-size: var(--text-small); }
.measurement-comparison-details > summary { cursor: pointer; color: var(--forest); padding: .7rem 0; }
.measurement-comparison-details[open] { display: grid; gap: 1rem; }
@media (max-width: 600px) {
  .measurement-toolbar { align-items: flex-start; }
  .measurement-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .measurement-card { padding: .65rem; }
  .measurement-tabs { flex-wrap: wrap; overflow-x: visible; }
  .measurement-tabs button { min-height: 44px; }
  .measurement-presets button { min-height: 44px; padding-inline: .7rem; }
  .measurement-chart svg { min-height: 120px; }
  .measurement-chart svg text { font-size: 22px; }
  .measurement-range label { max-width: none; }
  .measurement-range input { font-size: 16px; }
}