/* 9.14.6 layout: full-bleed map, docked station panel, thin legend, one slim timeline row. Loaded last. */
@media (min-width: 901px){
  html body.v9-map-first{--side:0px;--dockh:78px}
  html body.v9-map-first:has(#inspectSheet:not([hidden])){--side:400px}
  /* map resizes instead of being covered */
  html body.v9-map-first #marineMap,html body.v9-map-first #particleCanvas{right:var(--side)!important;width:auto!important;left:0!important}
  /* docked right panel */
  html body.v9-map-first #inspectSheet#inspectSheet{position:fixed!important;top:58px!important;right:0!important;bottom:0!important;left:auto!important;width:400px!important;max-width:400px!important;min-width:400px!important;height:auto!important;max-height:none!important;border-radius:0!important;border-width:0 0 0 1px!important;margin:0!important;transform:none!important;overflow:auto!important;z-index:60!important}
  html body.v9-map-first #inspectSheet .sc-hero{grid-template-columns:1fr!important;justify-items:center}
  html body.v9-map-first #inspectSheet .sc-hero > :not(:first-child){width:100%}
  html body.v9-map-first #inspectSheet [class*=metric]{min-width:0}
  /* slim single bottom row */
  html body.v9-map-first:not(:has(#weatherGraphSystem[data-dock-mode="half"])):not(:has(#weatherGraphSystem[data-dock-mode="full"])) #weatherGraphSystem#weatherGraphSystem{left:0!important;right:var(--side)!important;width:auto!important;max-width:none!important;bottom:0!important;transform:none!important;border-radius:0!important;display:flex!important;flex-direction:row!important;align-items:center!important;height:var(--dockh)!important;min-height:0!important;padding:0 8px!important;gap:8px!important;margin:0!important}
  html body.v9-map-first:not(:has(#weatherGraphSystem[data-dock-mode="half"])):not(:has(#weatherGraphSystem[data-dock-mode="full"])) #graphDockHandle{display:none!important}
  html body.v9-map-first:not(:has(#weatherGraphSystem[data-dock-mode="half"])):not(:has(#weatherGraphSystem[data-dock-mode="full"])) #mapLayoutBar{order:2;width:auto!important;flex:0 0 auto!important;padding:0!important;border:0!important;gap:4px!important;height:auto!important}
  html body.v9-map-first:not(:has(#weatherGraphSystem[data-dock-mode="half"])):not(:has(#weatherGraphSystem[data-dock-mode="full"])) #mapLayoutBar button{width:auto!important;min-width:0!important;flex:0 0 auto!important;height:34px!important;padding:0 10px!important;font-size:12px!important}
  html body.v9-map-first:not(:has(#weatherGraphSystem[data-dock-mode="half"])):not(:has(#weatherGraphSystem[data-dock-mode="full"])) #timeDock{order:1;flex:1 1 auto!important;width:auto!important;height:var(--dockh)!important;min-height:0!important;padding:0!important;border:0!important}
  html body.v9-map-first:not(:has(#weatherGraphSystem[data-dock-mode="half"])):not(:has(#weatherGraphSystem[data-dock-mode="full"])) #timeDock .timeline-main{height:var(--dockh)!important;display:grid!important;grid-template-rows:24px 52px!important;gap:0!important;padding:1px 0!important}
  html body.v9-map-first #timeDock .timeline-head{height:24px!important;min-height:0!important}
  html body.v9-map-first #timeDock .timeline-live-label{position:static!important;height:24px!important;padding:0 8px!important;display:flex!important;align-items:center!important;gap:8px!important;background:none!important;width:auto!important;transform:none!important}
  html body.v9-map-first #timeDock #timeLabel{font-size:14px!important;line-height:1!important;white-space:nowrap}
  html body.v9-map-first #timeDock .timeline-live-label small,html body.v9-map-first #timeDock .timeline-live-label span{font-size:11px!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  html body.v9-map-first #timeDock .timeline-actions{height:24px!important}
  html body.v9-map-first #timeDock .timeline-actions button,html body.v9-map-first #timeDock .timeline-actions select{height:22px!important;font-size:11px!important}
  html body.v9-map-first #timelineTouch{height:52px!important;min-height:0!important}
  /* thin horizontal legend bar, bottom-left above the dock */
  html body.v9-map-first #mapLegend#mapLegend{position:fixed!important;left:12px!important;top:auto!important;bottom:calc(var(--dockh) + 10px)!important;width:340px!important;height:auto!important;max-height:34px!important;padding:5px 10px!important;display:grid!important;grid-template-columns:auto 1fr!important;grid-template-rows:auto auto!important;column-gap:10px!important;row-gap:1px!important;align-items:center!important;overflow:hidden!important;border-radius:8px!important}
  html body.v9-map-first #mapLegend#mapLegend header{grid-row:1/3;margin:0!important;font-size:11px!important;display:flex;flex-direction:column;gap:0}
  html body.v9-map-first #mapLegend#mapLegend header b{font-size:12px!important}
  html body.v9-map-first #mapLegend#mapLegend #closeDetailedLegend,html body.v9-map-first #mapLegend .legend-values,html body.v9-map-first #mapLegend .legend-meaning,html body.v9-map-first #mapLegend .legend-model-note{display:none!important}
  html body.v9-map-first #mapLegend#mapLegend #legendGradient{height:8px!important;margin:0!important}
  html body.v9-map-first #mapLegend#mapLegend > div{font-size:10px!important;margin:0!important;line-height:1.1}
  /* top layer rail stays within the map */
  html body.v9-map-first .layer-rail{left:12px!important;right:auto!important;transform:none!important;max-width:calc(100vw - var(--side) - 84px)!important;overflow:hidden}
  html body.v9-map-first .maplibregl-ctrl-attrib{max-width:calc(100vw - var(--side) - 400px)!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  html body.v9-map-first .maplibregl-ctrl-bottom-right,html body.v9-map-first .maplibregl-ctrl-bottom-left{bottom:calc(var(--dockh) + 4px)!important}
}
@media (min-width: 901px){
  html body.v9-map-first #inspectSheet#inspectSheet{box-sizing:border-box!important}
  html body.v9-map-first .maplibregl-ctrl-attrib ~ .maplibregl-ctrl-attrib{display:none!important}
  html body.v9-map-first #timelineBubble:not(.dragging):not(.active){display:none!important}
  html body.v9-map-first #mapLegend#mapLegend{bottom:calc(var(--dockh) + 30px)!important}
  html body.v9-map-first #timeDock .timeline-head{display:flex!important;justify-content:space-between!important;gap:6px!important}
  html body.v9-map-first #timeDock .timeline-live-label{flex:1 1 auto!important;min-width:0!important;overflow:hidden}
  html body.v9-map-first #timeDock .timeline-actions{flex:0 0 auto!important;position:static!important}
}
/* phone: station card is a bottom sheet above the tab bar, map stays visible on top */
@media (max-width: 900px){
  html body.v9-map-first #inspectSheet#inspectSheet:not([hidden]){top:auto!important;bottom:calc(50px + env(safe-area-inset-bottom))!important;left:0!important;right:0!important;height:auto!important;max-height:68vh!important;border-radius:16px 16px 0 0!important;overflow:auto!important}
}
@media (min-width:901px){html body.v9-map-first .maplibregl-ctrl-top-right{right:12px!important}}
@media (min-width: 901px){
  html body.v9-map-first #toolsMenu#toolsMenu:not([hidden]){position:fixed!important;top:auto!important;bottom:calc(var(--dockh) + 8px)!important;max-height:calc(100vh - 58px - var(--dockh) - 16px)!important;overflow-y:auto!important;overscroll-behavior:contain}
}
/* measure chip must never swallow map taps: only its buttons are clickable; on phone it sits above the tab bar */
html body .atlas-measure-chip{pointer-events:none!important}
html body .atlas-measure-chip button{pointer-events:auto!important}
@media (max-width: 900px){html body .atlas-measure-chip{top:auto!important;bottom:calc(60px + env(safe-area-inset-bottom))!important}}
/* status pills over the map are information only and never swallow map taps */
html body #surfaceFrameTrust,html body #viImageStatus,html body #pastFrameNote,html body #layerStateNote{pointer-events:none!important}
html body #frameTrustHide{position:fixed;z-index:16;width:18px;height:18px;margin:0;padding:0;border:0;border-radius:9px;background:transparent;color:#d7e7ef;font:700 15px/16px system-ui,sans-serif;cursor:pointer;pointer-events:auto!important}
html body #frameTrustHide[hidden]{display:none!important}
html body #surfaceFrameTrust{padding-right:22px!important}
html body[data-frame-trust="hidden"] #surfaceFrameTrust{display:none!important}
@media (min-width: 901px){
  /* with the station panel open the bottom row keeps only the essentials */
  html body.v9-map-first:has(#inspectSheet:not([hidden])) #layoutStationsToggle,html body.v9-map-first:has(#inspectSheet:not([hidden])) #layoutInsightToggle,html body.v9-map-first:has(#inspectSheet:not([hidden])) #mapLayoutBar [id*=xpand],html body.v9-map-first:has(#inspectSheet:not([hidden])) #mapLayoutBar [aria-label*=tækka]{display:none!important}
  html body.v9-map-first #mapLayoutBar{overflow:hidden}
}
/* phone sheet never scrolls sideways (a sideways pan cancelled graph scrubbing) */
@media (max-width: 900px){html body.v9-map-first #inspectSheet#inspectSheet{overflow-x:hidden!important;overscroll-behavior:contain}}
/* past note replaces the generic source pill instead of stacking on it */
html body[data-past-frame="1"] #surfaceFrameTrust,html body[data-past-frame="1"] #measuredMapNote,html body[data-past-frame="1"] #pastMeasureHint{display:none!important}
/* station card tabs: wrap so every tab is reachable (no hidden tab off the edge) */
html body #stationCard .sc-tabs{display:flex!important;flex-wrap:wrap!important;overflow:visible!important;gap:6px!important}
html body #stationCard .sc-tabs>*{flex:0 0 auto!important}
@media (min-width: 901px){
  /* full-map toggle as a compact icon so the slim row never clips */
  html body.v9-map-first:not(:has(#weatherGraphSystem[data-dock-mode="half"])):not(:has(#weatherGraphSystem[data-dock-mode="full"])) #mapLayoutBar button#layoutFocusToggle{font-size:0!important;width:36px!important;padding:0!important}
  html body.v9-map-first #layoutFocusToggle::after{content:'⤢';font-size:16px}
  html body.v9-map-first #weatherGraphSystem#weatherGraphSystem #mapLayoutBar{flex-shrink:0!important}
  html body.v9-map-first #weatherGraphSystem#weatherGraphSystem #timeDock{min-width:0!important}
}
@media (max-width: 900px){
  html body.v9-map-first #mapLegend#mapLegend{top:auto!important;bottom:calc(var(--dock-top-gap,330px) + 8px)!important}
}
/* Land mode: the light OpenFreeMap style reads as an empty grey island; warm/green tint the land map only */
html body.land-mode #landMap .maplibregl-canvas{filter:sepia(.1) saturate(1.3) contrast(1.04)}
html body.land-mode #viImageStatus,html body.land-mode #surfaceFrameTrust{display:none!important}
html body.land-mode #openReferencePlayer,html body.land-mode #mapLegend,html body.land-mode #pastFrameNote{display:none!important}
html body.v9-map-first.land-mode #mapLegend#mapLegend#mapLegend{display:none!important}
/* desktop: Veðuryfirlit opens as a floating panel above the dock instead of a flex child that pushed timeline + Valmynd off-screen (persisted open across reloads) */
@media (min-width:900px){
  html body.v9-map-first:not(:has(#weatherGraphSystem[data-dock-mode="half"])):not(:has(#weatherGraphSystem[data-dock-mode="full"])) #weatherGraphSystem#weatherGraphSystem #officialInsight:not([hidden]){position:fixed!important;left:12px!important;right:auto!important;bottom:calc(var(--dockh) + 10px)!important;top:auto!important;width:min(820px,calc(100vw - var(--side) - 24px))!important;max-height:min(46vh,380px)!important;overflow:auto!important;z-index:130!important;flex:none!important;border-radius:12px;box-shadow:0 10px 30px #0008}
}
/* 9.14.6: docked desktop card header: × clear of the scrollbar, title/kind never run under the action buttons, no drag grip on a docked panel */
@media (min-width:901px){
  html body.v9-map-first #inspectSheet#inspectSheet{scrollbar-gutter:stable;scrollbar-width:thin}
  html body.v9-map-first #inspectSheet #inspectClose{right:10px!important;top:10px!important}
  html body.v9-map-first #inspectSheet .panel-grip{display:none!important}
  html body.v9-map-first #stationCard .sc-kind,html body.v9-map-first #stationCard .sc-head h2{display:block;max-width:218px!important;white-space:normal!important;overflow-wrap:anywhere}
}
/* 9.14.6: with graphs open (dock half/full) the menu was squeezed to ~80px and covered by the graph header: float it full-height on top */
@media (min-width:901px){
  html body.v9-map-first:has(#weatherGraphSystem[data-dock-mode="half"]) #toolsMenu#toolsMenu:not([hidden]),html body.v9-map-first:has(#weatherGraphSystem[data-dock-mode="full"]) #toolsMenu#toolsMenu:not([hidden]){top:58px!important;bottom:12px!important;max-height:none!important;z-index:400!important}
}
/* 9.14.6 (Sindri): sleek markers — buoys = small dot + tiny value, harbours = mini anchor glyph. No boxes/circles. */
html body .buoy-marker.buoy-marker{display:inline-flex!important;align-items:center;gap:3px;background:none!important;border:0!important;box-shadow:none!important;border-radius:0!important;padding:4px 5px!important;width:auto!important;height:auto!important;min-width:0!important;cursor:pointer}
html body .buoy-marker.buoy-marker svg{display:none!important}
html body .buoy-marker.buoy-marker::before{content:none;display:none!important}
html body .buoy-marker.buoy-marker .buoy-dot{width:6px;height:6px;border-radius:50%;background:rgba(255,255,255,.5);box-shadow:0 0 0 1px rgba(0,0,0,.28);flex:none}
html body .buoy-marker.buoy-marker b{font:500 10px/1 system-ui;color:rgba(226,234,238,.66);padding:0!important;text-shadow:0 1px 1px rgba(0,0,0,.4);white-space:nowrap;background:none!important}
html body .buoy-marker.buoy-marker .buoy-more{font-size:9px!important;color:#ffd166;text-shadow:0 0 2px #000}
html body .buoy-marker.is-stale::before{background:#9aa6ad;box-shadow:none}
html body .harbour-marker.harbour-marker{width:22px!important;height:22px!important;background:none!important;border:0!important;box-shadow:none!important;border-radius:0!important;display:grid!important;place-items:center;padding:0!important}
html body .harbour-marker.harbour-marker svg{width:12px!important;height:12px!important;color:#e9f6ff;filter:drop-shadow(0 0 1.5px #000) drop-shadow(0 0 1px #000)}
html body .harbour-marker.harbour-marker>*:not(svg){display:none!important}
/* declutter by zoom (body[data-zoomband] set in layout-v914.js) */
html body[data-zoomband="lo"] .buoy-marker .buoy-more{display:none!important}
html body[data-zoomband="lo"] .harbour-marker.harbour-marker svg{width:9px!important;height:9px!important;opacity:.85}
/* top source line: one short line */
html body #viImageStatus,html body #surfaceFrameTrust{white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;max-width:min(62vw,560px)!important;line-height:1.3!important}
@media (max-width:900px){
  /* phone: map first. Button row collapsed into one ☰ next to Kortaspilari; Hæstu/Lægstu panel closed by default; compact time card */
  html body.v9-map-first #mapLayoutBar#mapLayoutBar{height:0!important;min-height:0!important;padding:0!important;margin:0!important;border:0!important;overflow:visible!important}
  html body.v9-map-first #mapLayoutBar#mapLayoutBar>*:not(#phoneMenuButton){display:none!important}
  html body.v9-map-first>#phoneMenuButton#phoneMenuButton{position:fixed!important;top:calc(12px + env(safe-area-inset-top));left:150px;z-index:120;height:40px!important;min-width:40px!important;width:auto!important;padding:0 12px!important;border-radius:10px!important;background:#1d2328!important;border:1px solid #3d4850!important;color:#eef3f5!important;font-size:14px!important;box-shadow:0 2px 8px #0006!important}
  html body.v9-map-first #timeDock#timeDock #timeLabel#timeLabel{font-size:17px!important;line-height:1.15!important}
  html body.v9-map-first #timeDock#timeDock .timeline-live-label{padding:5px 10px!important;min-height:0!important}
  html body.v9-map-first #timeDock #timelineMeta,html body.v9-map-first #timeDock #timeKind{font-size:11px!important}
  html body #viImageStatus,html body #surfaceFrameTrust{top:60px!important;max-width:calc(100vw - 90px)!important}
}
.graph-shift-nav{display:inline-flex;align-items:center;gap:4px;margin-right:6px}
.graph-shift-nav button{min-width:30px;height:28px;border-radius:7px;border:1px solid #3d4850;background:#1d2328;color:#eef3f5;font-size:15px}
.graph-shift-nav b{font:600 11px system-ui;color:#a9b8c0;min-width:44px;text-align:center}
@media(max-width:899px){html body.v9-map-first #inspectSheet#inspectSheet.camera-sheet:not([hidden]):not(.station-sheet):not(.forecast-sheet):not(.point-sheet){bottom:var(--cam-sheet-bottom,240px)!important;max-height:var(--cam-sheet-max,50dvh)!important;overflow-y:auto!important}}

/* 9.18.0: history provenance occupies the source row, above chips and toggles. */
html body #pastFrameNote{position:fixed;top:130px;left:12px;right:auto;z-index:15;box-sizing:border-box;max-width:calc(100vw - 90px);margin:0;padding:3px 8px;font:600 10.5px/14px system-ui;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;border:0;border-radius:7px;background:rgba(12,16,20,.62);color:#dff7ea}
html.atlas-pro-phone body #pastFrameNote{top:calc(50px + env(safe-area-inset-top));left:8px;max-width:calc(100% - 78px)}