/* Kart for kommunen (overlays.html og kapittelet «Kart» på index/arkitektur). Bygger på studio.css + arkitektur.css. */
:root{--ov-ok:#2f6b45;--ov-warn:#9a4d24;--ov-map-bg:#1d2320;--ov-chip:#e7e9e1}
@media(prefers-color-scheme:dark){:root:not([data-theme="light"]){--ov-ok:#8fc9a0;--ov-warn:#e2a47e;--ov-chip:#262d2b}}
:root[data-theme="dark"]{--ov-ok:#8fc9a0;--ov-warn:#e2a47e;--ov-chip:#262d2b}

code{overflow-wrap:anywhere}
.masthead .site-nav{overflow-x:auto;scrollbar-width:none}
.masthead .site-nav::-webkit-scrollbar{display:none}

/* ---- intro --------------------------------------------------------------- */
.ov-intro{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:40px;padding:30px 0 22px;align-items:end}
.ov-intro h1{font-size:clamp(30px,3.6vw,50px)}
.ov-intro .lede{font-size:15px;line-height:1.65;max-width:640px;margin-top:12px}
.key{display:grid;gap:9px;font-size:12px;border-left:1px solid var(--border);padding-left:24px}
.key p{display:flex;gap:10px;align-items:baseline;margin:0}
.key .fine{display:block;margin-top:4px}
.tag{display:inline-block;font-size:10px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;padding:2px 7px;border-radius:2px;white-space:nowrap;line-height:1.5;border:1px solid var(--border-accent);color:var(--muted)}
.tag.verified{border-color:var(--ov-ok);color:var(--ov-ok)}
.tag.judgement{border-color:var(--ov-warn);color:var(--ov-warn)}
.tag.assumption{border-style:dashed}

/* ---- toolbar -------------------------------------------------------------- */
.ov-app{border:1px solid var(--border);background:var(--white)}
.ov-toolbar{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:10px 12px;border-bottom:1px solid var(--border);background:var(--panel);flex-wrap:wrap;position:sticky;top:0;z-index:15}
.ov-tabs{display:flex;gap:2px;overflow-x:auto;scrollbar-width:thin;max-width:100%}
.ov-tabs button{display:flex;align-items:baseline;gap:6px;background:transparent;border:1px solid transparent;border-radius:2px;padding:8px 11px;font-size:12.5px;white-space:nowrap;color:var(--text)}
.ov-tabs button small{font-size:9.5px;letter-spacing:.08em;color:var(--muted)}
.ov-tabs button:hover{background:var(--panel-hover)}
.ov-tabs button[aria-selected=true]{background:var(--accent);color:var(--accent-fg);border-color:var(--accent)}
.ov-tabs button[aria-selected=true] small{color:inherit;opacity:.75}
.ov-controls{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.ov-seg{display:inline-flex;border:1px solid var(--border-accent);border-radius:2px;overflow:hidden}
.ov-seg button{background:transparent;border:0;border-left:1px solid var(--border);padding:7px 13px;font-size:12px;color:var(--text)}
.ov-seg button:first-child{border-left:0}
.ov-seg button:hover{background:var(--panel-hover)}
.ov-seg button[aria-pressed=true]{background:var(--text);color:var(--bg)}
.ov-check{display:inline-flex;align-items:center;gap:6px;font-size:12px;cursor:pointer;white-space:nowrap}
.ov-check input{accent-color:var(--accent);margin:0}

/* ---- stage ---------------------------------------------------------------- */
.ov-body{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:start}
.ov-stage{position:relative;margin:0;background:var(--ov-map-bg);height:min(84vh,900px);aspect-ratio:.62;max-width:calc(100vw - 460px);overflow:hidden;user-select:none;-webkit-user-select:none;touch-action:pan-y}
.ov-stage.is-zoomed{touch-action:none;cursor:grab}
.ov-stage.is-panning{cursor:grabbing}
.ov-stage.is-compare{cursor:ew-resize}
.ov-stage svg{display:block;width:100%;height:100%}
.ov-tip{position:absolute;z-index:6;pointer-events:none;max-width:280px;background:var(--overlay);color:var(--text);border:1px solid var(--border);box-shadow:0 4px 18px rgba(0,0,0,.18);font-size:12px;line-height:1.5;padding:7px 10px;border-radius:2px;opacity:0;transform:translateY(4px);transition:opacity .15s,transform .15s}
.ov-tip.is-on{opacity:1;transform:none}
.ov-tip b{display:block;font-size:10px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-bottom:2px}
.ov-mapbar{position:absolute;right:10px;bottom:44px;display:flex;flex-direction:column;gap:1px;z-index:5;box-shadow:0 1px 6px rgba(0,0,0,.3)}
.ov-mapbar button{width:34px;height:34px;border:0;background:var(--overlay);color:var(--text);font-size:17px;line-height:1}
.ov-mapbar button:hover{background:var(--panel-hover)}
.ov-caption{position:absolute;left:0;right:0;bottom:0;padding:6px 10px;font-size:10.5px;line-height:1.4;color:#e8e6df;background:linear-gradient(transparent,rgba(0,0,0,.55));pointer-events:none}
.ov-divider{position:absolute;top:0;bottom:0;left:50%;width:0;z-index:4;pointer-events:none}
.ov-divider::before{content:"";position:absolute;top:0;bottom:0;left:-1px;width:2px;background:#fff;box-shadow:0 0 0 1px rgba(0,0,0,.35)}
.ov-handle{position:absolute;top:50%;left:0;transform:translate(-50%,-50%);width:40px;height:40px;border-radius:50%;border:0;background:#fff;color:#26332e;box-shadow:0 1px 6px rgba(0,0,0,.45);font-size:13px;letter-spacing:-.1em;pointer-events:auto;cursor:ew-resize;touch-action:none}

/* ---- panel ---------------------------------------------------------------- */
.ov-panel{padding:22px 24px 24px;min-width:0;font-size:13px}
.ov-panel .eyebrow{margin-bottom:6px}
.ov-panel h2{font-size:clamp(24px,2.3vw,32px);margin-bottom:12px}
.ov-why{font-size:14px;line-height:1.7;max-width:62ch}
.ov-before-note{font-size:12px;color:var(--warning);border-left:2px solid var(--warning);padding-left:10px;margin-bottom:10px}
.ov-facts{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:0;margin:18px 0 6px;border-top:1px solid var(--border);border-left:1px solid var(--border)}
.ov-facts div{background:var(--white);padding:9px 11px;display:flex;flex-direction:column;gap:2px;border-right:1px solid var(--border);border-bottom:1px solid var(--border)}
.ov-facts dt{font-size:10.5px;color:var(--muted);letter-spacing:.02em;display:flex;justify-content:space-between;gap:6px;align-items:baseline}
.ov-facts dd{margin:0;font-size:15px;font-variant-numeric:tabular-nums;font-weight:600}
.ov-facts .tag{font-size:8.5px;padding:0 5px}
.ov-layers{margin-top:20px}
.ov-layers-head{display:flex;justify-content:space-between;align-items:baseline;gap:10px;flex-wrap:wrap;border-bottom:1px solid var(--border);padding-bottom:6px;margin-bottom:6px}
.ov-layers-head h3{font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);font-weight:600}
.ov-view-opts{display:flex;gap:14px}
.ov-legend{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));column-gap:18px}
.ov-legend li{display:flex;align-items:center;gap:9px;padding:4px 0;font-size:12.5px;line-height:1.35}
.ov-legend label{display:flex;align-items:center;gap:9px;cursor:pointer;min-width:0}
.ov-legend input{accent-color:var(--accent);margin:0;flex:none}
.ov-legend svg{flex:none;width:26px;height:16px;border-radius:1px;background:#6f766c}
.ov-legend .when{font-size:10px;color:var(--muted);white-space:nowrap}
.ov-legend li.is-other{opacity:.55}
.ov-note{font-size:11.5px;color:var(--muted-2);line-height:1.6;margin-top:16px;max-width:70ch}
.ov-actions{display:flex;align-items:center;gap:12px;margin-top:18px;flex-wrap:wrap}
.ov-download{background:var(--accent);color:var(--accent-fg);border:0;border-radius:2px;padding:9px 16px;font-size:12px;letter-spacing:.04em}
.ov-download:hover{filter:brightness(1.1)}
.ov-hint{font-size:11px;color:var(--muted)}

/* ---- BGF block ------------------------------------------------------------ */
.ov-bgf{margin:18px 0 4px;border:1px solid var(--border);padding:14px 16px;background:var(--bg)}
.ov-bgf-top{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap}
.ov-bgf-top span{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.ov-bgf-top strong{font:400 44px/1 Georgia,serif;font-variant-numeric:tabular-nums;letter-spacing:-.02em}
.ov-bgf-top strong.ok{color:var(--ov-ok)}
.ov-bgf-top strong.below{color:var(--warning)}
.ov-bgf-top em{font-style:normal;font-size:12px;color:var(--muted)}
.ov-bgf-bar{position:relative;height:8px;background:var(--ov-chip);margin:14px 0 22px;border-radius:4px}
.ov-bgf-bar i{position:absolute;left:0;top:0;bottom:0;border-radius:4px;background:var(--accent);transition:width .6s cubic-bezier(.2,.7,.2,1)}
.ov-bgf-bar i.ghost{background:transparent;border:1px dashed var(--muted);transition:none}
.ov-bgf-bar b{position:absolute;top:-4px;bottom:-4px;width:2px;background:var(--text)}
.ov-bgf-bar b::after{content:attr(data-label);position:absolute;top:18px;left:50%;transform:translateX(-50%);font-size:10px;font-weight:500;white-space:nowrap;color:var(--muted)}
.ov-bgf table{width:100%;border-collapse:collapse;font-size:12px;font-variant-numeric:tabular-nums}
.ov-bgf th{font-size:10px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);font-weight:600;text-align:left;border-bottom:1px solid var(--border);padding:4px 6px 4px 0}
.ov-bgf td{padding:3px 6px 3px 0;border-bottom:1px solid color-mix(in srgb,var(--border) 60%,transparent)}
.ov-bgf td:nth-child(n+3),.ov-bgf th:nth-child(n+3){text-align:right}
.ov-bgf tr.sum td{font-weight:600;border-bottom:1px solid var(--border)}
.ov-bgf tr.sub td{color:var(--muted);font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;padding-top:10px}
.ov-bgf tr.new td:nth-child(2)::after{content:" ny";font-size:9.5px;color:var(--ov-ok);font-weight:600}
.ov-bgf .formula{font-size:12px;margin-top:10px;color:var(--muted)}
.ov-bgf .formula b{color:var(--text)}
.ov-bgf details{margin-top:10px}
.ov-bgf summary{font-size:12px;cursor:pointer}

/* ---- sources -------------------------------------------------------------- */
.sources ol{columns:2;column-gap:44px;font-size:12.5px;line-height:1.6;padding-left:20px}
.sources li{break-inside:avoid;margin-bottom:8px}

/* ---- responsive ----------------------------------------------------------- */
@media(max-width:1000px){
 .ov-intro{grid-template-columns:1fr;gap:20px;padding:28px 0 20px}
 .key{border-left:0;padding-left:0;border-top:1px solid var(--border);padding-top:14px}
 .ov-body{grid-template-columns:1fr}
 .ov-stage{height:auto;width:100%;max-width:none;aspect-ratio:.82;max-height:82vh}
 .ov-toolbar{position:static}
 .ov-panel{padding:18px 16px}
 .sources ol{columns:1}
}
@media(max-width:650px){
 .ov-stage{aspect-ratio:.72}
 .ov-tabs button{padding:7px 9px;font-size:12px}
 .ov-tabs button small{display:none}
 .ov-controls{width:100%;justify-content:space-between}
 .ov-seg button{padding:7px 10px}
 .ov-facts{grid-template-columns:1fr 1fr}
 .ov-facts dd{font-size:14px}
 .ov-bgf-top strong{font-size:36px}
 .ov-tip{max-width:230px}
}
@media(prefers-reduced-motion:reduce){
 .ov-tip,.ov-bgf-bar i{transition:none}
}

/* ---- kartets lag og tilstander (SVG) --------------------------------------- */
#ov-svg .ov-f{transition:opacity .45s ease}
#ov-svg .ov-f.is-off{opacity:0;pointer-events:none}
#ov-svg .ov-layer{transition:opacity .3s ease}
#ov-svg .ov-layer.is-hidden,#ov-svg .ov-labels-root.is-hidden{opacity:0;pointer-events:none}
#ov-svg.no-anim .ov-f,#ov-svg.no-anim .ov-layer{transition:none}
#ov-svg .ov-root.is-entering .ov-copy>.ov-layer{animation:ov-in .35s ease both;animation-delay:calc(var(--i,0) * 15ms)}
@keyframes ov-in{from{opacity:0}}
#ov-svg .has-tip{cursor:help}
#ov-svg .has-tip:hover>path:not(.halo),#ov-svg .has-tip:hover>circle{filter:brightness(1.15) saturate(1.1)}
#ov-svg .pulse>path:not(.halo){animation:ov-pulse 1.8s ease-in-out infinite}
@keyframes ov-pulse{50%{fill-opacity:.25}}
#ov-svg .ov-veil{transition:fill-opacity .3s ease;pointer-events:none}
@media(prefers-reduced-motion:reduce){
 #ov-svg .ov-f,#ov-svg .ov-layer,#ov-svg .ov-veil{transition:none}
 #ov-svg .ov-root.is-entering .ov-copy>.ov-layer,#ov-svg .pulse>path{animation:none}
}
@media(min-width:1001px){.ov-stage{position:sticky;top:var(--ov-tb,58px)}}

/* ---- konseptvelger og punktlister (kart for kommunen) --------------------- */
.ov-concept{display:inline-flex;border:1px solid var(--accent);border-radius:2px;overflow:hidden;flex-shrink:0}
.ov-concept button{background:transparent;border:0;border-left:1px solid var(--border);padding:7px 12px;font-size:12.5px;font-weight:600;color:var(--text);white-space:nowrap}
.ov-concept button:first-child{border-left:0}
.ov-concept button:hover{background:var(--panel-hover)}
.ov-concept button[aria-pressed=true]{background:var(--accent);color:var(--accent-fg)}
.ov-concept button small{font-weight:400;opacity:.8;margin-left:4px}
.ov-concept-note{margin:0;padding:8px 12px;font-size:12.5px;color:var(--muted);border-bottom:1px solid var(--border);background:var(--panel)}
.ov-points{margin:0 0 14px;padding-left:18px;font-size:13.5px;line-height:1.6}
.ov-points li{margin-bottom:7px}
.ov-points li::marker{color:var(--accent)}
.ov-stage{cursor:grab}
.ov-stage.is-compare{cursor:ew-resize}
.chapter .ov-app{margin-top:14px}
@media(max-width:650px){.ov-concept button small{display:none}}

/* Avstander (kort i panelet, situasjonstemaet) */
.ov-avstander{margin:14px 0 4px;padding:12px 14px;border:1px solid var(--border,#d9d6cc);border-radius:10px;background:var(--panel,#f6f5f0)}
.ov-avstander h3{margin:0 0 6px;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted,#6b6b64)}
.ov-avstander table{width:100%;border-collapse:collapse;font-size:13px}
.ov-avstander th{font-weight:500;text-align:left;padding:4px 0;color:inherit}
.ov-avstander td{text-align:right;padding:4px 0;white-space:nowrap;font-variant-numeric:tabular-nums}
.ov-avstander tr+tr th,.ov-avstander tr+tr td{border-top:1px solid var(--border,#e4e1d6)}
.ov-avstander .ov-hint{margin:8px 0 0;font-size:11.5px;color:var(--muted,#6b6b64)}