@font-face{font-family:"Newsreader";font-style:normal;font-weight:200 800;font-display:swap;src:url(fonts/newsreader-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Newsreader";font-style:normal;font-weight:200 800;font-display:swap;src:url(fonts/newsreader-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Newsreader";font-style:italic;font-weight:400;font-display:swap;src:url(fonts/newsreader-italic-400-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Newsreader";font-style:italic;font-weight:400;font-display:swap;src:url(fonts/newsreader-italic-400-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Plex Sans";font-weight:400 600;font-display:swap;src:url(fonts/IBMPlexSans-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Plex Sans";font-weight:400 600;font-display:swap;src:url(fonts/IBMPlexSans-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Plex Mono";font-weight:400;font-display:swap;src:url(fonts/IBMPlexMono-Regular.woff2) format("woff2")}

:root{
  --bg:#050a13;--bg2:#0a1422;--ink:#e9eef3;--muted:#b3c0cc;--faint:#9aa9b7;--line:#24364a;--line-soft:#17263a;
  --amber:#f2b65e;--fibre:#7fe1ff;--fibre-ink:#a6ebff;--on:#ffd28a;--card:#0c1726;
  --water:#0b1d33;--z-ro:#f2b65e;--z-bg:#9fd38b;--z-tr:#e98a7a;--z-ge:#c9a2f2;--z-ab:#ff6f91;--z-ua:#8fb7ff;--z-ru:#d1d6dc;
  --serif:"Newsreader",Georgia,"Times New Roman",serif;--sans:"Plex Sans",system-ui,-apple-system,"Segoe UI",sans-serif;--mono:"Plex Mono",ui-monospace,Menlo,monospace;
  color-scheme:dark;
}
@media (prefers-color-scheme:light){:root:not([data-theme="dark"]){
  --bg:#f4f0e7;--bg2:#ebe5d8;--ink:#14202b;--muted:#3b4955;--faint:#3e4a54;--line:#c9c0ae;--line-soft:#ddd5c4;
  --amber:#7a3410;--fibre:#0b6a86;--fibre-ink:#074b5f;--on:#7a2e08;--card:#fbf8f1;
  --water:#d6e4ec;--z-ro:#b5651d;--z-bg:#3f7d2e;--z-tr:#b03a2a;--z-ge:#6b3fa0;--z-ab:#b0154a;--z-ua:#2f5fb3;--z-ru:#5a6168;color-scheme:light}}
:root[data-theme="light"]{
  --bg:#f4f0e7;--bg2:#ebe5d8;--ink:#14202b;--muted:#3b4955;--faint:#3e4a54;--line:#c9c0ae;--line-soft:#ddd5c4;
  --amber:#7a3410;--fibre:#0b6a86;--fibre-ink:#074b5f;--on:#7a2e08;--card:#fbf8f1;
  --water:#d6e4ec;--z-ro:#b5651d;--z-bg:#3f7d2e;--z-tr:#b03a2a;--z-ge:#6b3fa0;--z-ab:#b0154a;--z-ua:#2f5fb3;--z-ru:#5a6168;color-scheme:light}

*{box-sizing:border-box}
[hidden]{display:none!important}
svg[hidden]{display:none}
html{-webkit-text-size-adjust:100%;scroll-padding-top:56px}
body{margin:0;background:var(--bg);color:var(--ink);font:400 1.0625rem/1.6 var(--sans)}
a{color:var(--fibre-ink)}
a:focus-visible,button:focus-visible,input:focus-visible{outline:2px solid var(--fibre);outline-offset:2px}
.skip-link{position:absolute;left:-999px;top:8px;background:var(--card);color:var(--ink);padding:8px 12px;z-index:50}
.skip-link:focus{left:8px}

/* topbar */
.topbar{position:sticky;top:0;z-index:20;height:44px;display:flex;align-items:center;gap:14px;padding:0 max(14px,env(safe-area-inset-right)) 0 max(14px,env(safe-area-inset-left));background:color-mix(in srgb,var(--bg) 92%,transparent);border-bottom:1px solid var(--line-soft);font:500 .84rem/1 var(--sans)}
.brand{display:flex;align-items:center;gap:8px;color:var(--ink);text-decoration:none;white-space:nowrap}
.brand-mark{color:var(--fibre)}
.topnav{display:flex;gap:14px;overflow:hidden}
.topnav a{color:var(--muted);text-decoration:none;white-space:nowrap}
.topnav a:hover{color:var(--ink)}
.spacer{flex:1}
.chip{color:var(--muted);text-decoration:none;font:500 .78rem var(--mono);padding:4px 6px;border-radius:4px}
.chip[aria-current]{color:var(--ink);background:var(--line-soft)}
.icon-btn{background:none;border:1px solid var(--line);color:var(--ink);border-radius:50%;width:32px;height:32px;display:grid;place-items:center;cursor:pointer}
.progress{position:fixed;top:44px;left:0;right:0;height:2px;z-index:19;pointer-events:none}
.progress span{display:block;height:100%;background:linear-gradient(90deg,transparent,var(--fibre));transform-origin:0 50%;transform:scaleX(0)}
@media (max-width:760px){.topnav{display:none}.brand span{max-width:44vw;overflow:hidden;text-overflow:ellipsis}}

/* rail */
.rail{position:fixed;right:10px;top:50%;transform:translateY(-50%);z-index:15;display:flex;flex-direction:column;gap:12px;opacity:0;transition:opacity .4s}
.past-hero .rail{opacity:1}
.rail a{position:relative;display:block;width:14px;height:14px}
.rail .dot{position:absolute;inset:4px;border-radius:50%;background:var(--faint)}
.rail a[aria-current] .dot{background:var(--fibre);inset:2px}
.rail-label{position:absolute;right:22px;top:50%;transform:translateY(-50%);white-space:nowrap;font:500 .78rem var(--sans);color:var(--ink);background:var(--card);border:1px solid var(--line);padding:3px 8px;border-radius:4px;opacity:0;pointer-events:none}
.rail a:hover .rail-label,.rail a:focus-visible .rail-label{opacity:1}
@media (max-width:1180px){.rail{display:none}}

/* hero */
.hero{max-width:980px;margin:0 auto;padding:40px 20px 18px}
.kicker{font:500 .8rem/1.3 var(--mono);letter-spacing:.04em;text-transform:uppercase;color:var(--amber);margin:0 0 14px}
h1{font:500 clamp(1.9rem,4.2vw,3.1rem)/1.08 var(--serif);letter-spacing:-.01em;margin:0 0 18px;text-wrap:balance}
.deck{font:400 clamp(1.06rem,1.6vw,1.24rem)/1.55 var(--serif);color:var(--muted);margin:0;max-width:62ch}

/* explorer */
.explorer{max-width:1440px;margin:0 auto;padding:10px 20px 30px;display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:22px;align-items:start}
@media (max-width:1060px){.explorer{grid-template-columns:1fr}}
.mapwrap{margin:0}
.map{position:relative;aspect-ratio:2400/1341;border-radius:10px;overflow:hidden;background:var(--bg2);border:1px solid var(--line-soft)}
.map-still,.map-svg{position:absolute;inset:0;width:100%;height:100%}
.map-still.gone{display:none}
.map-labels{display:none}
.zone{fill:transparent;stroke:none;transition:fill .35s}
.zone.on{fill:color-mix(in srgb,var(--on) 15%,transparent)}
.zone.z-AB.on{fill:color-mix(in srgb,var(--z-ab) 34%,transparent)}
.zone.z-UA.on,.zone.z-RU.on{fill:color-mix(in srgb,var(--z-ua) 22%,transparent)}
.border{fill:none;stroke:var(--muted);stroke-opacity:.55;stroke-width:1;vector-effect:non-scaling-stroke;stroke-dasharray:4 4}
.border.control{stroke:var(--z-ab);stroke-opacity:.9;stroke-dasharray:2 3}
.route{fill:none;stroke:var(--fibre);stroke-width:1.4;vector-effect:non-scaling-stroke;stroke-linejoin:round}
.tube-p{fill:none;stroke:var(--fibre);stroke-opacity:.38;stroke-linecap:round;stroke-linejoin:round}
.glow-p{fill:none;stroke:var(--fibre);stroke-opacity:.5;stroke-width:6;vector-effect:non-scaling-stroke;stroke-linecap:round;filter:blur(1.5px)}
.site{fill:var(--muted)}
.site.land,.end{fill:var(--fibre)}
.end{stroke:var(--bg);stroke-width:1.5;vector-effect:non-scaling-stroke}
.site-t{font:500 var(--fs,10px) var(--sans);fill:var(--muted);paint-order:stroke;stroke:var(--bg);stroke-width:3px;stroke-linejoin:round;vector-effect:non-scaling-stroke}
.zl{font:600 var(--zs,11px) var(--sans);fill:var(--faint);letter-spacing:.05em;text-transform:uppercase;paint-order:stroke;stroke:var(--bg);stroke-width:3px;vector-effect:non-scaling-stroke;transition:fill .3s}
.zl.on{fill:var(--on)}
.zl.z-AB.on{fill:var(--z-ab)}
.zoom{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px}
.zb{font:500 .8rem var(--sans);color:var(--ink);background:color-mix(in srgb,var(--card) 88%,transparent);border:1px solid var(--line);border-radius:999px;padding:7px 12px;min-height:36px;cursor:pointer}
.zb[aria-pressed="true"]{border-color:var(--fibre);color:var(--fibre-ink)}
@media (pointer:coarse){.zb{min-height:44px}}
.legend{display:flex;flex-wrap:wrap;gap:6px 18px;margin-top:10px;font:400 .82rem/1.4 var(--sans);color:var(--muted)}
.legend span::before{content:"";display:inline-block;width:18px;height:3px;margin-right:6px;vertical-align:middle;border-radius:2px}
.lg-traffic::before{background:linear-gradient(90deg,transparent,var(--amber))}
.lg-route::before{background:var(--fibre)}
.lg-reach::before{background:var(--fibre);opacity:.4;height:9px!important}
.lg-zone::before{border-top:1px dashed var(--muted);height:0!important}

.panel{background:var(--card);border:1px solid var(--line-soft);border-radius:10px;padding:18px 18px 16px}
.ctl-h{font:500 1.35rem/1.2 var(--serif);margin:0 0 6px}
.ctl-note{font-size:.9rem;color:var(--muted);margin:0 0 16px}
.slider{position:relative;padding:30px 0 6px}
.slider input{width:100%;margin:0;accent-color:var(--fibre);height:28px}
.obs-row,.th-row{position:absolute;left:10px;right:10px;height:26px;pointer-events:none}
.obs-row{top:0}.th-row{top:56px;height:12px}
.obs,.thr{position:absolute;transform:translateX(-50%);font:400 .72rem/1 var(--mono);white-space:nowrap}
.obs{color:var(--muted);top:0}
.obs i{display:block;width:1px;height:8px;background:var(--muted);margin:14px auto 0}
.obs em{position:absolute;top:0;left:50%;transform:translateX(-50%);font-style:normal}
.thr{color:var(--faint);top:0}
.thr i{display:block;width:7px;height:7px;border-radius:50%;border:1.5px solid currentColor;margin:0 auto 4px}
.thr em{font-style:normal}
.thr.on{color:var(--on)}
.thr-list{font:400 .76rem/1.5 var(--mono);color:var(--faint);margin:2px 0 0}.thr-list .on{color:var(--on)}
.dval{position:absolute;right:0;top:-2px;font:500 1.05rem var(--mono);color:var(--fibre-ink)}
.modes{border:0;margin:6px 0 12px;padding:0;display:grid;gap:8px}
.modes legend{font:500 .82rem var(--sans);color:var(--muted);margin-bottom:6px}
.mode{display:flex;gap:10px;align-items:flex-start;border:1px solid var(--line);border-radius:8px;padding:9px 10px;cursor:pointer}
.mode:has(input:checked){border-color:var(--fibre)}
.mode input{margin-top:4px;accent-color:var(--fibre)}
.mode b{display:block;font-weight:600;font-size:.95rem}
.mode small{display:block;color:var(--muted);font-size:.82rem;line-height:1.35}
.answer{border-top:1px solid var(--line-soft);padding-top:12px}
.ans{font:500 1.12rem/1.42 var(--serif);margin:0 0 8px}
.test{margin:0 0 6px;font-size:.93rem}
.note{margin:0 0 6px;font-size:.88rem;color:var(--muted)}
.note:empty,.next:empty{display:none}
.next{margin:0;font:400 .8rem var(--mono);color:var(--faint)}
.share{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:14px}
.share-label{font:500 .8rem var(--sans);color:var(--muted)}
.share-row{display:flex;gap:8px}
.sbtn{width:40px;height:40px;border-radius:50%;border:1px solid var(--line-soft);background:transparent;color:var(--ink);display:grid;place-items:center;cursor:pointer;text-decoration:none}
.sbtn:hover,.sbtn:focus-visible{color:var(--fibre-ink);border-color:var(--fibre)}
@media (pointer:coarse){.sbtn{width:44px;height:44px}}
.btn.reset{font:500 .82rem var(--sans);color:var(--ink);background:none;border:1px solid var(--line);border-radius:999px;padding:8px 12px;min-height:40px;cursor:pointer}
.share-msg{font-size:.82rem;color:var(--muted);min-height:1em;margin:6px 0 0}

/* prose */
.prose{max-width:720px;margin:0 auto;padding:10px 20px 40px;font-family:var(--serif);font-size:1.16rem;line-height:1.62}
.sec{padding-top:26px}
.prose h2{font:500 clamp(1.55rem,2.6vw,2rem)/1.15 var(--serif);margin:28px 0 14px;text-wrap:balance}
.prose h3{font:600 1rem var(--sans);margin:26px 0 8px}
.anchor{margin-left:8px;font-size:.7em;color:var(--faint);text-decoration:none;opacity:0}
h2:hover .anchor,.anchor:focus{opacity:1}
.prose p{margin:0 0 1em}
.prose q{quotes:"“" "”" "‘" "’"}
:lang(ro) .prose q{quotes:"„" "”" "«" "»"}
.spec,.qs{padding-left:1.1em}
.spec li,.qs li{margin:0 0 .7em}
.spec b,.qs b{font-family:var(--sans);font-weight:600;font-size:.95em}
.cases{list-style:none;padding:0;margin:0 0 1.2em;border-left:2px solid var(--line);}
.cases li{padding:0 0 14px 16px;position:relative}
.cases li::before{content:"";position:absolute;left:-6px;top:.55em;width:10px;height:10px;border-radius:50%;background:var(--bg);border:2px solid var(--fibre)}
.cases .d{display:block;font:500 .8rem var(--mono);color:var(--amber);margin-bottom:2px}
.fig{margin:1.4em 0}
.fig img{width:100%;height:auto;border-radius:6px;background:#fff;display:block}
.fig.wide{margin-left:-60px;margin-right:-60px}
@media (max-width:860px){.fig.wide{margin-left:0;margin-right:0}}
.fig figcaption,.profile figcaption{font:400 .86rem/1.45 var(--sans);color:var(--muted);margin-top:8px}
.diagram{margin:1.4em 0}
.diagram svg{width:100%;height:auto;display:block}
.dg-box{fill:var(--card);stroke:var(--fibre)}
.dg-fibre{stroke:var(--fibre);stroke-width:2}
.dg-ticks line{stroke:var(--fibre);stroke-width:1}
.dg-rep{fill:var(--bg);stroke:var(--amber);stroke-width:2}
.dg-span{fill:none;stroke:var(--amber);stroke-width:1.5;stroke-dasharray:4 3}
.dg-t{font:500 13px var(--sans);fill:var(--ink)}
.dg-s{font:400 12px var(--sans);fill:var(--muted)}
.profile{margin:1.6em -60px}
@media (max-width:860px){.profile{margin:1.6em 0}}
.profile svg{width:100%;height:220px;display:block;background:var(--water);border-radius:8px;touch-action:pan-y}
.p-floor{fill:color-mix(in srgb,var(--muted) 30%,var(--bg2))}
.p-sea{stroke:var(--fibre);stroke-width:1;vector-effect:non-scaling-stroke}
.p-reach{fill:var(--fibre);fill-opacity:.12}
.p-pas{stroke:var(--amber);stroke-width:1;vector-effect:non-scaling-stroke}
.p-cur{stroke:var(--ink);stroke-width:1;vector-effect:non-scaling-stroke}
.p-ax{font:400 11px var(--mono);fill:var(--muted)}
.prof-read{font:400 .86rem var(--mono);color:var(--ink);min-height:1.4em;margin:6px 0 0}
.method{font-size:1.02rem}
.sources{font:400 .9rem/1.5 var(--sans);padding-left:1.1em}
.sources li{margin-bottom:4px}
.site-footer{max-width:720px;margin:0 auto;padding:24px 20px 70px;display:flex;gap:18px;flex-wrap:wrap;font:400 .86rem var(--sans);color:var(--muted);border-top:1px solid var(--line-soft)}
.site-footer a{color:var(--muted)}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}
@media print{.topbar,.rail,.progress,.share,.zoom{display:none}}

.narrow .minor{display:none}
.narrow .zl{font-size:calc(var(--zs) * .85)}
@media (max-width:700px){
  .zoom{position:static;margin-top:8px}
  .map{border-radius:8px}
  .hero{padding:24px 16px 12px}
  .deck{font-size:1.02rem}
  .explorer{padding:6px 16px 24px}
  .legend{font-size:.76rem;gap:4px 14px}
  .prose{font-size:1.08rem;padding:6px 16px 30px}
}

.diagram .dg-narrow{display:none}
@media (max-width:600px){.diagram .dg-wide{display:none}.diagram .dg-narrow{display:block}}
.dg-narrow .dg-t{font-size:14px}.dg-narrow .dg-s{font-size:13px}
.dg-k{fill:var(--fibre)}.dg-r{fill:var(--amber)}.dg-a{fill:var(--amber)}
.prof-wrap{position:relative}
.p-axis{position:absolute;inset:0;pointer-events:none}
.p-axis span{position:absolute;left:6px;transform:translateY(-110%);font:400 .72rem var(--mono);color:var(--muted)}