/* Figurene øverst på de egne sidene (inc/parts/fig.php, inc/figure.php). Lastes bare når siden har figur.
   Animasjonene illustrerer innholdet og står stille ved redusert bevegelse; fig.js pauser dem utenfor skjermen. */
.page-head.has-fig{max-width:none;display:grid;gap:1.4rem 2.6rem;align-items:start}
.page-head.has-fig .ph-text{max-width:68ch;min-width:0}
.page-sun .grid.two,.page-aurora .grid.two,.page-avalanche .grid.two{align-items:start}
@media (min-width:980px){.page-head.has-fig{grid-template-columns:minmax(0,1fr) minmax(0,460px)}.page-head.has-fig .fig{margin-top:2.3rem}}
.fig{margin:0;min-width:0}
.fig figcaption{display:flex;flex-wrap:wrap;gap:.35rem .9rem;margin-top:.6rem;font-size:.8rem;color:var(--muted);line-height:1.45}
.fig .lg{display:flex;flex-wrap:wrap;gap:.3rem .9rem;color:var(--ink);flex:1 1 100%}
.fig .lg small{color:var(--muted);font-size:inherit}
.fig .li{display:inline-flex;align-items:center;gap:.4rem;white-space:nowrap}
.fig .fc{flex:1 1 auto}
.fig .cr{opacity:.65}
.sw{display:inline-block;width:9px;height:9px;border-radius:50%;flex:none;background:var(--gold)}
.sw.k-quay{background:none;border:1.5px solid var(--gold)}
.sw.k-ves{width:8px;height:11px;border-radius:0;background:var(--veh);clip-path:polygon(50% 0,100% 100%,50% 78%,0 100%)}
.sw.k-ves.k-pax{background:var(--gold)}
.sw.k-still{width:6px;height:6px;background:color-mix(in srgb,var(--veh) 55%,transparent)}
.sw.k-best{background:none;border:1.5px solid var(--gold);box-shadow:0 0 6px rgba(212,169,79,.7)}
.sw.k-steep{border-radius:3px;background:#ff7a45}
.sw.k-rd-closed,.sw.k-rd-msg{width:16px;height:3px;border-radius:2px;background:var(--red)}
.sw.k-rd-msg{background:var(--amber)}
.sw.k-s-au{background:var(--c-au)}.sw.k-s-po{background:var(--c-po)}.sw.k-s-mi{background:var(--c-mi)}.sw.k-s-fe{background:var(--c-fe)}.sw.k-s-ar{background:var(--c-ar)}.sw.k-s-sd{background:var(--c-sd)}.sw.k-s-wh{background:var(--c-fjord)}.sw.k-s-sk{background:var(--c-ember)}
.sw.k-hp-health{background:#ff8a8a}.sw.k-hp-pharmacy{background:#5ee3a1}.sw.k-hp-police{background:#8fb2ff}.sw.k-hp-aed{background:#f0b24a}

/* ---------- Kart ---------- */
.fmap{position:relative;border-radius:var(--r);overflow:hidden;border:1px solid var(--line);background:radial-gradient(120% 90% at 60% 45%,var(--m-sea1),var(--m-sea2));isolation:isolate}
.fmap>svg{position:absolute;inset:0;width:100%;height:100%;display:block}
.fmap .terr{animation:fig-in 1.2s var(--ease) both}
.fmap .rd{fill:none;stroke:rgb(var(--m-ink) / .38);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.fmap .rd.b{stroke-width:1;stroke-opacity:.55}
.fmap .pin,.fmap .tn{position:absolute;width:0;height:0}
.fmap .tn i{position:absolute;left:-2px;top:-2px;width:4px;height:4px;border-radius:50%;background:rgb(var(--m-ink) / .65)}
.fmap .tn b,.fmap .pin .lb,.fmap .pin>b{position:absolute;white-space:nowrap;line-height:1.1;text-shadow:0 0 3px rgb(var(--m-halo)),0 0 8px rgb(var(--m-halo)),0 0 14px rgb(var(--m-halo))}
.fmap .tn b{font-size:10px;font-weight:500;letter-spacing:.14em;color:rgb(var(--m-ink) / .62)}
.fmap .s-r>b,.fmap .s-r>.lb{left:8px;top:50%;transform:translateY(-50%)}
.fmap .s-l>b,.fmap .s-l>.lb{right:8px;top:50%;transform:translateY(-50%);text-align:right;align-items:flex-end}
.fmap .s-t>b,.fmap .s-t>.lb{left:50%;bottom:8px;transform:translateX(-50%);text-align:center;align-items:center}
.fmap .s-b>b,.fmap .s-b>.lb{left:50%;top:8px;transform:translateX(-50%);text-align:center;align-items:center}
.fmap .s-tr>b,.fmap .s-tr>.lb{left:3px;bottom:3px}
.fmap .s-tl>b,.fmap .s-tl>.lb{right:3px;bottom:3px;text-align:right;align-items:flex-end}
.fmap .s-br>b,.fmap .s-br>.lb{left:3px;top:3px}
.fmap .s-bl>b,.fmap .s-bl>.lb{right:3px;top:3px;text-align:right;align-items:flex-end}
.fmap .c .lb small{display:none}
.fmap .lb{display:flex;flex-direction:column;gap:2px}
.fmap .lb b{font-weight:600}
.fmap .lb small{font-size:10px;font-weight:500;letter-spacing:.14em;color:rgb(var(--m-ink) / .72)}
.fmap .lb em{font-style:normal;font-weight:600;font-size:.82rem;color:var(--gold);letter-spacing:.01em}
.fmap .lb em.off{color:var(--muted);font-weight:500}
.fmap .dot{position:absolute;left:-4px;top:-4px;width:8px;height:8px;border-radius:50%;background:var(--gold);box-shadow:0 0 0 2px rgb(var(--m-halo) / .75)}
.fmap .ring{position:absolute;left:-4px;top:-4px;width:8px;height:8px;border-radius:50%;border:1.5px solid var(--gold);animation:fig-ring 2.8s var(--ease) infinite}
.fmap .pin{animation:fig-pop .7s var(--ease) both;animation-delay:calc(.5s + var(--i,0) * .08s)}
@keyframes fig-in{from{opacity:0}}
@keyframes fig-pop{from{opacity:0;transform:scale(.4)}}
@keyframes fig-ring{from{transform:scale(1);opacity:.9}to{transform:scale(4.4);opacity:0}}
@keyframes fig-draw{to{stroke-dashoffset:0}}

/* Ferge: kaier som pulserer, samband som strømmer mot kanten */
.fmap .quay .ring{animation-duration:3.2s}
.fmap .quay.soon .ring,.fmap .quay.soon .dot{border-color:var(--status);background:var(--status)}
.fmap .quay.soon .ring{background:none;animation-duration:1.4s}
.fmap .quay.bad .dot{background:var(--red)}.fmap .quay.bad .ring{border-color:var(--red)}
.fmap .route{fill:none;stroke:var(--gold);stroke-width:2.4;stroke-linecap:round;stroke-dasharray:7 10;animation:fig-flow 1.5s linear infinite}
.fmap .route.off{stroke-opacity:.3;animation:none}
@keyframes fig-flow{to{stroke-dashoffset:-17}}
.fmap .edge{color:var(--gold)}
.fmap .edge.off{opacity:.45}
.fmap .edge .ar{position:absolute;left:-8px;top:-8px;width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.fmap .edge>b{font-size:10px;font-weight:600;letter-spacing:.14em;color:var(--gold)}
.fmap .edge.s-b>b{top:10px}.fmap .edge.s-tr>b{left:6px;bottom:6px}

/* Fartøy (fig.js): glir mellom posisjonene, kjølvann bak dem som er underveis */
.vl{position:absolute;inset:0;pointer-events:none}
.ves{position:absolute;width:0;height:0;transition:left 20s linear,top 20s linear;animation:fig-pop .8s var(--ease) both}
.ves.nt{transition:none}
.ves .rot{position:absolute;left:0;top:0;transform:rotate(var(--r,0deg));transition:transform 2s var(--ease)}
.ves svg{position:absolute;width:var(--s);height:calc(var(--s) * 1.5);left:calc(var(--s) / -2);top:calc(var(--s) * -.75);fill:rgb(var(--m-veh));filter:drop-shadow(0 0 3px rgb(var(--m-halo) / .9))}
.ves.pax svg{fill:var(--gold)}
.ves .wk{position:absolute;left:-1px;top:calc(var(--s) * .45);width:2px;height:var(--wk,0);border-radius:2px;background:linear-gradient(rgb(var(--m-veh) / .6),transparent);transform-origin:top;animation:fig-wake 2.6s ease-in-out infinite}
.ves.pax .wk{background:linear-gradient(rgba(243,201,105,.6),transparent)}
@keyframes fig-wake{50%{transform:scaleY(.65);opacity:.6}}
.ves .pt{display:none;position:absolute;left:-3px;top:-3px;width:6px;height:6px;border-radius:50%;background:rgb(var(--m-veh) / .55)}
.ves.still svg,.ves.still .wk{display:none}
.ves.still .pt{display:block}
.ves.still.pax .pt{background:var(--gold)}
.ves .vn{position:absolute;left:9px;top:-7px;font-size:11px;font-weight:500;white-space:nowrap;color:rgb(var(--m-ink));text-shadow:0 0 3px rgb(var(--m-halo)),0 0 8px rgb(var(--m-halo))}
.ves .vn:empty{display:none}

/* Vær: vindstreker i vindretningen, fart etter vindstyrke; nedbør faller */
.fmap .wx .dot{background:rgb(var(--m-ink));width:6px;height:6px;left:-3px;top:-3px}
.fmap .wx .lb b{display:flex;align-items:center;gap:3px;font-size:1rem;color:var(--ink)}
.fmap .wx .wicon{width:16px;height:16px}
.wx .wind{position:absolute;left:0;top:0;transform:rotate(var(--r))}
.wx .wind i{position:absolute;left:calc(var(--l) / -2);top:-1px;width:var(--l);height:1.6px;border-radius:2px;background:linear-gradient(90deg,transparent,rgb(var(--m-ink) / .9));opacity:0;animation:fig-gust var(--d) linear infinite}
.wx .wind i:nth-child(1){top:-8px;animation-delay:calc(var(--d) * -.35)}
.wx .wind i:nth-child(3){top:6px;animation-delay:calc(var(--d) * -.7)}
@keyframes fig-gust{0%{transform:translateX(-22px);opacity:0}30%,70%{opacity:.9}100%{transform:translateX(22px);opacity:0}}
.wx .fall{position:absolute;left:-14px;top:-18px;width:28px;height:30px;overflow:hidden}
.wx .fall i{position:absolute;top:-6px;width:1.4px;height:6px;border-radius:1px;background:rgb(var(--m-rain) / .85);animation:fig-rain .9s linear infinite}
.wx .fall.snow i{width:3px;height:3px;border-radius:50%;background:rgb(var(--m-flake));animation-duration:2.6s}
.wx .fall i:nth-child(1){left:3px}.wx .fall i:nth-child(2){left:9px;animation-delay:-.3s}.wx .fall i:nth-child(3){left:15px;animation-delay:-.6s}.wx .fall i:nth-child(4){left:21px;animation-delay:-.45s}.wx .fall i:nth-child(5){left:26px;animation-delay:-.15s}
.wx .fall.snow i:nth-child(2){animation-delay:-1s}.wx .fall.snow i:nth-child(3){animation-delay:-1.8s}.wx .fall.snow i:nth-child(4){animation-delay:-.6s}.wx .fall.snow i:nth-child(5){animation-delay:-2.2s}
@keyframes fig-rain{to{transform:translateY(36px)}}

/* Nordlys: buer i nord etter Kp, stjerner, skyer over hvert sted etter skydekket */
.fmap.night .terr{filter:var(--m-night)}
.fmap .stars{visibility:var(--m-stars)}
.fmap .stars circle{fill:#fff;opacity:.8;animation:fig-tw var(--tw) ease-in-out infinite var(--td)}
@keyframes fig-tw{50%{opacity:.18}}
.fmap .au{mix-blend-mode:var(--m-blend);opacity:var(--au);animation:fig-in 2.4s ease-out .3s both}
.fmap .au path{fill:url(#au-g);transform-box:fill-box;transform-origin:50% 0}
.fmap .au .c1{animation:fig-au1 9s ease-in-out infinite alternate}
.fmap .au .c2{opacity:.7;animation:fig-au2 13s ease-in-out infinite alternate}
.fmap .au .c3{opacity:.45;animation:fig-au3 7s ease-in-out infinite alternate}
@keyframes fig-au1{0%{transform:translateX(-24px) scaleY(.9);opacity:.75}50%{opacity:1}100%{transform:translateX(26px) scaleY(1.12);opacity:.85}}
@keyframes fig-au2{0%{transform:translateX(30px) scaleY(1.1)}100%{transform:translateX(-30px) scaleY(.85)}}
@keyframes fig-au3{0%{transform:translateX(-10px);opacity:.25}100%{transform:translateX(18px) scaleY(1.2);opacity:.6}}
.fmap .cl{opacity:var(--o);animation:fig-drift var(--cd) ease-in-out infinite alternate}
.fmap .cl ellipse{fill:url(#cl-g)}
@keyframes fig-drift{to{transform:translateX(var(--cx))}}
.fmap .cloudpin .dot{background:rgb(var(--m-ink));width:6px;height:6px;left:-3px;top:-3px}
.fmap .cloudpin .lb>b{font-size:.92rem;color:var(--ink)}
.fmap .cloudpin.best .lb>b{color:var(--gold)}
.fmap .cloudpin.best .dot{background:var(--gold);box-shadow:0 0 0 3px rgba(212,169,79,.3),0 0 12px rgba(212,169,79,.8);animation:fig-glow 2.4s ease-in-out infinite}
@keyframes fig-glow{50%{box-shadow:0 0 0 6px rgba(212,169,79,.12),0 0 18px rgba(212,169,79,.9)}}

/* Snøskred: bratt terreng og snø som faller når det varsles */
.fmap .steep{opacity:.85;animation:fig-in 1.6s ease-out .4s both,fig-breathe 7s ease-in-out 2s infinite}
@keyframes fig-breathe{50%{opacity:.6}}
.flakes{position:absolute;inset:0;overflow:hidden;pointer-events:none;container-type:size}
.flakes i{position:absolute;top:-6px;width:var(--s);height:var(--s);border-radius:50%;background:rgb(var(--m-flake));opacity:.7;animation:fig-fall var(--d) linear infinite var(--dl)}
@keyframes fig-fall{to{transform:translate(var(--dx),calc(100cqh + 10px))}}
.avgauge{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem .9rem;margin-top:.7rem}
.avgauge b{font-weight:600;font-size:.92rem}
.lvs{display:flex;gap:3px}
.lv{width:28px;height:20px;border-radius:4px;display:grid;place-items:center;font-size:.72rem;font-weight:700;color:rgba(7,17,31,.85);opacity:.2}
.lv-1{background:#56b849}.lv-2{background:#f5d742}.lv-3{background:#f7941e}.lv-4{background:#e3242b}.lv-5{background:#1b1b1f;color:#fff;box-shadow:inset 0 0 0 1.5px #e3242b}
.lv.past,.lv.on{opacity:1;animation:fig-lv .5s var(--ease) both;animation-delay:calc(.4s + var(--i) * .14s)}
.lv.on{animation:fig-lv .5s var(--ease) calc(.4s + var(--i) * .14s) both,fig-lvglow 2.8s ease-in-out 1.6s infinite}
@keyframes fig-lv{from{opacity:.2;transform:scaleY(.6)}}
@keyframes fig-lvglow{50%{box-shadow:0 0 0 3px rgba(255,255,255,.15)}}

/* Veier: veier med meldinger tegnes inn og gløder; stengt = rød */
.road-map .rd{stroke:rgb(var(--m-ink) / .26)}
.fmap .rd.hi{stroke:var(--amber);stroke-width:3.4;stroke-opacity:1;stroke-dasharray:1;stroke-dashoffset:1;animation:fig-draw 1.8s var(--ease) .4s forwards,fig-roadglow 2.8s ease-in-out 2.2s infinite}
.fmap .rd.hi.closed{stroke:var(--red)}
@keyframes fig-roadglow{50%{stroke-opacity:.5}}
.fmap .rdl .dot{display:none}
.fmap .rdl>b{display:inline-flex;align-items:center;gap:.35rem;padding:2px 7px;border-radius:999px;background:rgb(var(--m-halo) / .85);border:1px solid var(--amber);font-size:.72rem;font-weight:600;letter-spacing:.02em;color:var(--ink);text-shadow:none}
.fmap .rdl.closed>b{border-color:var(--red)}
.fmap .rdl em{display:none}
.fmap .msg .dot{background:var(--amber)}.fmap .msg .ring{border-color:var(--amber)}
.fmap .msg.closed .dot{background:var(--red)}.fmap .msg.closed .ring{border-color:var(--red);animation-duration:1.6s}

/* Kamera og hjelp */
.fmap .cam .cg{position:absolute;left:-12px;top:-12px;width:24px;height:24px;border-radius:50%;background:var(--panel);border:1px solid var(--gold);display:grid;place-items:center;overflow:hidden}
.fmap .cam .cg svg{width:14px;height:14px;fill:none;stroke:var(--gold);stroke-width:1.8}
.fmap .cam .cg::after{content:"";position:absolute;inset:0;border-radius:50%;background:#fff;opacity:0;animation:fig-flash 6s ease-out infinite;animation-delay:calc(1.5s + var(--i,0) * 2.6s)}
@keyframes fig-flash{0%,88%{opacity:0}90%{opacity:.85}100%{opacity:0}}
.fmap .cam .ring{left:-12px;top:-12px;width:24px;height:24px;animation-duration:3.4s}
.fmap .cam.s-l>b{right:18px}.fmap .cam.s-t>b{bottom:18px}
.fmap .cam>b{font-size:10px;font-weight:600;letter-spacing:.14em;color:var(--gold)}
.fmap .hp .dot{width:7px;height:7px;left:-3.5px;top:-3.5px;box-shadow:0 0 0 1.5px rgb(var(--m-halo) / .8)}
.fmap .hp.health .dot{background:#ff8a8a}.fmap .hp.pharmacy .dot{background:#5ee3a1}.fmap .hp.police .dot{background:#8fb2ff}
.fmap .hp.aed .dot{background:#f0b24a;animation:fig-beat 1.6s ease-in-out infinite;animation-delay:calc(var(--i) * -.23s)}
@keyframes fig-beat{0%,45%,100%{transform:scale(1)}12%{transform:scale(1.7)}22%{transform:scale(1.1)}30%{transform:scale(1.55)}}

/* ---------- Diagrammer ---------- */
.chart{position:relative;aspect-ratio:600/260;border:1px solid var(--line);border-radius:var(--r);background:linear-gradient(var(--bg2),var(--bg));overflow:hidden}
.chart>svg{position:absolute;inset:0;width:100%;height:100%}
.chart .gl{stroke:var(--line);stroke-width:1}
.chart .nowl{stroke:var(--gold);stroke-width:1.4;stroke-dasharray:4 5;opacity:.75}
.chart .tick{position:absolute;bottom:5px;transform:translateX(-50%);font-size:.72rem;color:var(--muted);white-space:nowrap}
.chart .tick small{font-size:inherit;opacity:.8}
.tide-chart .water{fill:url(#td-g);animation:fig-in 1.4s ease-out .8s both}
.tide-chart .waves{animation:fig-waves 3.4s linear infinite}
@keyframes fig-waves{to{transform:translateX(48px)}}
.tide-chart .tline{fill:none;stroke:var(--sea-line);stroke-width:2.4;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:1;animation:fig-draw 2.4s var(--ease) .2s forwards}
.chart .ext{position:absolute;display:flex;align-items:center;gap:2px;transform:translate(-50%,-150%);font-size:.76rem;color:var(--muted);white-space:nowrap;animation:fig-in .8s ease-out 1.8s both}
.chart .ext.low{transform:translate(-50%,55%)}
.chart .ext b{color:var(--ink);font-weight:600}
.chart .ext .ic{width:.9em;height:.9em;color:var(--sea-line)}
.chart .buoy{position:absolute;width:0;height:0;animation:fig-pop .7s var(--ease) 2.2s both}
.chart .buoy i{position:absolute;left:-6px;top:-6px;width:12px;height:12px;border-radius:50%;background:var(--gold);box-shadow:0 0 0 3px rgba(212,169,79,.25);animation:fig-bob 2.8s ease-in-out infinite}
.chart .buoy em{position:absolute;left:50%;bottom:12px;transform:translateX(-50%);font-style:normal;font-size:.76rem;font-weight:600;color:var(--gold);white-space:nowrap;padding:1px 6px;border-radius:999px;background:color-mix(in srgb,var(--bg) 82%,transparent)}
@keyframes fig-bob{50%{transform:translateY(-3px) rotate(-8deg)}}
.day-chart .dfill{fill:url(#dl-g);animation:fig-in 1.4s ease-out 1s both}
.day-chart .dline{fill:none;stroke:var(--sun-line);stroke-width:2.4;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:1;animation:fig-draw 2.6s var(--ease) .2s forwards}
.day-chart .band.mid{fill:rgba(243,201,105,.09)}
.day-chart .band.pol{fill:rgba(111,143,214,.16)}
.day-chart .bandl{position:absolute;top:6px;transform:translateX(-50%);font-size:.7rem;letter-spacing:.06em;white-space:nowrap}
.day-chart .bandl.end{transform:translateX(calc(-100% - 6px))}.day-chart .bandl.start{transform:translateX(6px)}
.day-chart .bandl.mid{color:var(--sun-line)}.day-chart .bandl.pol{color:var(--polar)}
.day-chart .ytick{position:absolute;left:6px;transform:translateY(-120%);font-size:.68rem;color:var(--muted)}
.day-chart .sundot{position:absolute;width:0;height:0;animation:fig-pop .7s var(--ease) 2.3s both}
.day-chart .sundot i{position:absolute;left:-7px;top:-7px;width:14px;height:14px;border-radius:50%;background:#f3c969;box-shadow:0 0 12px 3px rgba(243,201,105,.5);animation:fig-sun 3.2s ease-in-out infinite}
@keyframes fig-sun{50%{box-shadow:0 0 22px 8px rgba(243,201,105,.35)}}
.day-chart .sundot em{position:absolute;left:12px;bottom:8px;font-style:normal;font-size:.78rem;font-weight:600;color:var(--gold);white-space:nowrap;padding:1px 6px;border-radius:999px;background:color-mix(in srgb,var(--bg) 82%,transparent)}
.day-chart .sundot.l em{left:auto;right:12px}

/* Året som hjul: sesongene tegnes inn, viseren sveiper fram til i dag */
.wheel{position:relative;aspect-ratio:1;max-width:420px;margin:0 auto}
.wheel>svg{width:100%;height:100%;display:block;overflow:visible}
.wheel .rim{fill:none;stroke:var(--line2)}
.wheel .mt{stroke:var(--line2)}
.wheel .sa{fill:none;stroke-width:9;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1;animation:fig-draw 1.5s var(--ease) forwards;animation-delay:calc(.3s + var(--i) * .16s)}
.wheel .sa.au{stroke:var(--c-au)}.wheel .sa.po{stroke:var(--c-po)}.wheel .sa.mi{stroke:var(--c-mi)}.wheel .sa.fe{stroke:var(--c-fe)}.wheel .sa.ar{stroke:var(--c-ar)}.wheel .sa.sd{stroke:var(--c-sd)}.wheel .sa.wh{stroke:var(--c-fjord)}.wheel .sa.sk{stroke:var(--c-ember)}
.wheel .sa:not(.now){stroke-opacity:.55}
.wheel .needle{transform:rotate(var(--a));animation:fig-sweep 2.8s var(--ease) .3s both}
@keyframes fig-sweep{from{transform:rotate(0deg)}}
.wheel .needle line{stroke:var(--ink);stroke-width:1.6;stroke-linecap:round}
.wheel .needle circle{fill:var(--gold);animation:fig-glowc 2.6s ease-in-out 3s infinite}
@keyframes fig-glowc{50%{r:7px}}
.wheel .hub{fill:var(--ink)}
.wheel .mn{position:absolute;transform:translate(-50%,-50%);font-size:.7rem;color:var(--muted);letter-spacing:.04em}

/* Tidslinje (buss, fly): kjøretøyet kjører fram til neste avgang */
.timeline{--lw:9.5rem;border:1px solid var(--line);border-radius:var(--r);background:linear-gradient(var(--bg2),var(--bg));padding:.5rem .9rem .7rem}
.tl-axis{position:relative;height:1.5rem;margin-left:var(--lw)}
.tl-axis .tick,.tl-axis .nowm{position:absolute;top:.2rem;transform:translateX(-50%);font-size:.7rem;color:var(--muted);white-space:nowrap}
.tl-axis .nowm{color:var(--gold);font-weight:600}
.tl-axis .tick small{font-size:inherit;opacity:.8}
.tl-row{display:grid;grid-template-columns:var(--lw) minmax(0,1fr);align-items:center;border-top:1px solid var(--line)}
.tl-lbl{display:flex;align-items:center;gap:.4rem;font-size:.8rem;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding-right:.5rem}
.tl-lbl .ic{width:1.05em;height:1.05em;color:var(--gold)}
.tl-lbl .lineno{flex:none}
.lineno.air{border-color:var(--gold);color:var(--gold)}
.tl-track{position:relative;height:2.6rem}
.tl-track::before{content:"";position:absolute;left:var(--now);top:0;bottom:0;border-left:1px dashed rgba(212,169,79,.55)}
.tl-track::after{content:"";position:absolute;left:0;right:0;top:62%;border-top:1px solid var(--line2)}
.dep{position:absolute;top:62%;width:0;height:0;z-index:1}
.dep i{position:absolute;left:-3.5px;top:-3.5px;width:7px;height:7px;border-radius:50%;background:var(--ink);opacity:.5}
.dep.first i{background:var(--gold);opacity:1;animation:fig-pop .5s var(--ease) 2s both}
.dep.bad i{background:var(--red);opacity:1}
.dep b{position:absolute;left:-1px;bottom:10px;font-size:.74rem;font-weight:600;white-space:nowrap;color:var(--ink)}
.dep b small{font-weight:500;color:var(--muted)}
.dep.r b{left:auto;right:-1px}
.veh{position:absolute;top:62%;left:var(--x1);width:22px;height:16px;margin:-8px 0 0 -28px;color:var(--veh);animation:fig-drive 2.2s var(--ease) both;animation-delay:calc(.3s + var(--i) * .14s);z-index:2}
.veh svg{width:100%;height:100%;display:block;fill:currentColor}
.veh.bus svg .win{fill:var(--panel)}
.veh.bus svg circle{fill:var(--panel);stroke:currentColor;stroke-width:1.2}
.veh.dep,.veh.arr{width:20px;height:20px;margin:-10px 0 0 -26px;color:var(--gold)}
.veh.dep svg{animation:fig-takeoff 6s ease-in 3s infinite}
.veh.arr svg{animation:fig-land 6s ease-out 3s infinite}
@keyframes fig-drive{from{left:var(--x0);opacity:0}15%{opacity:1}}
@keyframes fig-takeoff{0%,55%{transform:none;opacity:1}80%{transform:translate(22px,-16px) rotate(-22deg);opacity:0}81%{transform:none;opacity:0}100%{opacity:1}}
@keyframes fig-land{0%{transform:translate(-22px,-16px) rotate(18deg);opacity:0}25%,100%{transform:none;opacity:1}}
.tl-empty{margin:.6rem 0 0;color:var(--muted);font-size:.86rem}
@media (max-width:520px){.timeline{--lw:6.4rem;padding:.4rem .6rem .6rem}.tl-lbl{font-size:.74rem}.tl-axis .tick.alt,.tl-axis .tick small{display:none}
  .fmap .tn b,.fmap .lb small{font-size:9px;letter-spacing:.1em}.fmap .wx .lb b,.fmap .cloudpin .lb>b{font-size:.84rem}.fmap .wx .wicon{width:13px;height:13px}}

/* Utenfor skjermen og redusert bevegelse */
.fig.off *,.fig.off *::before,.fig.off *::after{animation-play-state:paused!important}
@media (prefers-reduced-motion:reduce){
  .fig *,.fig *::before,.fig *::after{animation:none!important;transition:none!important}
  .tline,.dline,.wheel .sa,.fmap .rd.hi{stroke-dashoffset:0!important}
  .fmap .ring,.flakes,.wx .fall{display:none}
  .wx .wind i{opacity:.75}
}

/* Topptur (0.14.0) */
.sw.k-hk-good{background:var(--green)}.sw.k-hk-caution{background:var(--amber)}.sw.k-hk-no{background:var(--red)}
.fmap .hk .dot{width:9px;height:9px;left:-4.5px;top:-4.5px;background:var(--muted);box-shadow:0 0 0 2px rgb(var(--m-halo) / .8),0 0 10px rgb(var(--m-halo) / .6)}
.fmap .hk.v-good .dot{background:var(--green)}.fmap .hk.v-caution .dot{background:var(--amber)}.fmap .hk.v-no .dot{background:var(--red)}
.fmap .hk .lb b{font-size:.92rem;color:var(--ink)}
.fmap .hk .dot{animation:hk-pulse 3.2s ease-in-out infinite;animation-delay:calc(var(--i,0) * .4s)}
@keyframes hk-pulse{0%,100%{box-shadow:0 0 0 2px rgb(var(--m-halo) / .8),0 0 10px rgb(var(--m-halo) / .6)}50%{box-shadow:0 0 0 4px rgb(var(--m-halo) / .9),0 0 16px rgb(var(--m-halo) / .8)}}
@media (prefers-reduced-motion:reduce){.fmap .hk .dot{animation:none}}