/* Keep readable panel widths on large monitors without stretching SVG labels. */
.side > * {max-width:800px;margin-left:auto;margin-right:auto;}
.side > .panels,.side > .chips,.side > .grid {width:100%;}
.panels {gap:28px;}
.panels .chart {width:100%;max-width:720px;height:auto;}
.panels .chart.sea {max-width:640px;margin-top:12px;margin-bottom:8px;}
.panel .fine {line-height:1.65;}
.side .fine,.side .stamp {color:#a9afb9;}
.site-navigation {position:relative;z-index:5;margin-bottom:24px;padding-bottom:16px;border-bottom:1px solid var(--hair);font-size:13px;}
.site-shortcuts {display:flex;align-items:flex-start;flex-wrap:wrap;gap:8px;}
.site-navigation a,.site-navigation summary {box-sizing:border-box;display:flex;align-items:center;min-height:44px;padding:10px 12px;color:var(--ink);text-decoration:none;border:1px solid var(--hair);border-radius:6px;background:var(--tile-fill);cursor:pointer;line-height:1.4;}
.site-navigation a:hover,.site-navigation summary:hover {background:var(--tile-fill-hover);border-color:var(--accent);}
.site-navigation a:focus-visible,.site-navigation summary:focus-visible {outline:2px solid var(--accent);outline-offset:3px;}
.site-more {position:relative;}
.site-more summary::after {content:'⌄';margin-left:10px;}
.site-more[open] summary::after {content:'⌃';}
.site-more summary::-webkit-details-marker {display:none;}
.site-menu {position:absolute;top:calc(100% + 8px);right:0;width:270px;box-sizing:border-box;padding:8px;background:var(--bg);border:1px solid var(--hair);border-radius:8px;box-shadow:0 12px 30px #0005;max-height:65vh;overflow:auto;}
.site-menu a {border:0;background:transparent;}
@media(max-width:900px){
 .layout {grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(520px,62vh) minmax(300px,1fr);overflow:auto;scrollbar-width:thin;scrollbar-color:#3a3f47 var(--bg);}
 .side {overflow:visible;min-width:0;}
 .stage,.side > *,.panel {min-width:0;}
 .maplibregl-ctrl-bottom-right {top:54px!important;bottom:auto!important;right:8px;}
 .site-navigation {margin-bottom:18px;}
 .side > * {max-width:720px;}
 .foot,.colour-basemap .foot {padding:12px 16px;}
 .tools button,.tools .seg button,#wcolour button {min-width:44px;min-height:44px;height:auto;}
 .tools {gap:6px;}
 #legendDir > span:last-child,#legendWind > span:last-child {display:none;}
 #legendWindRow {flex-wrap:wrap;gap:8px;}
 #legendDir {flex-wrap:nowrap;gap:8px;}
 #status {font-size:12px;line-height:1.45;max-height:4.35em;overflow:auto;color:#c4c9d1;}
 .legend {color:#c4c9d1;}
 body:not(.wind) #streaks {display:none;}
}
@media(max-width:440px){
 .site-shortcuts {display:grid;grid-template-columns:1fr 1fr;}
 .site-more summary {justify-content:space-between;}
 .site-menu {width:min(280px,calc(100vw - 36px));}
 .side {padding:20px 16px 32px;}
 .chips button {min-height:44px;}
 .panels {gap:24px;}
}