/* ==========================================================================
   Dep Proxy v4 — "Relay" theme
   Graphite-navy base, cyan → violet → pink signal gradient.
   Sections: fonts · tokens · base · background · topbar · logo · buttons ·
   forms · cards · motion fx · hero · band · process · maps · flow · scene ·
   quick links · doc pages · ts3 · download · auth · panel · business card ·
   admin · modal/welcome/toast · footer · responsive · reduced motion
   ========================================================================== */

/* ---------- fonts (local files, no Google Fonts) ---------- */
@font-face{font-family:"Mona Sans";font-style:normal;font-display:swap;font-weight:200 900;src:url("../fonts/mona-sans-latin-ext-wght-normal.woff2") format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1E00-1EFF}
@font-face{font-family:"Mona Sans";font-style:normal;font-display:swap;font-weight:200 900;src:url("../fonts/mona-sans-latin-wght-normal.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}
@font-face{font-family:"Geist Mono";font-style:normal;font-display:swap;font-weight:100 900;src:url("../fonts/geist-mono-latin-ext-wght-normal.woff2") format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1E00-1EFF}
@font-face{font-family:"Geist Mono";font-style:normal;font-display:swap;font-weight:100 900;src:url("../fonts/geist-mono-latin-wght-normal.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+2000-206F}

/* ---------- tokens ---------- */
@property --fx-a{syntax:"<angle>";inherits:false;initial-value:0deg}
@property --neon-a{syntax:"<angle>";inherits:false;initial-value:0deg}
@property --rgb{syntax:"<angle>";inherits:false;initial-value:0deg}
:root{
  --bg:#05060d;--bg2:#090b17;
  --glass:rgba(15,17,33,.62);--glass2:rgba(22,25,46,.7);--solid:#10122a;
  --line:rgba(255,255,255,.08);--line2:rgba(255,255,255,.14);
  --text:#eef0ff;--muted:#9ba3c7;--faint:#666d93;
  --cyan:#22d3ee;--violet:#8b5cf6;--pink:#f43f5e;--green:#34d399;--amber:#fbbf24;
  --c-y:#facc15;--c-r:#f43f5e;--c-g:#34d399;--c-c:#22d3ee;--c-v:#a78bfa;--c-p:#f472b6;--c-o:#fb923c;
  --grad:linear-gradient(100deg,#22d3ee,#8b5cf6 55%,#f43f5e);
  --grad-soft:linear-gradient(135deg,rgba(34,211,238,.16),rgba(139,92,246,.14) 55%,rgba(244,63,94,.12));
  --font:"Mona Sans",ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --mono:"Geist Mono",ui-monospace,Consolas,monospace;
  --r:18px;--r-sm:12px;
  --ease:cubic-bezier(.2,.7,.2,1);--ease-out:cubic-bezier(.16,1,.3,1);--ease-io:cubic-bezier(.45,.05,.25,1);
  --container:1240px;--gutter:clamp(16px,3.4vw,32px);
}

/* ---------- base ---------- */
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:90px}
html,body{margin:0;padding:0}
body{font-family:var(--font);color:var(--text);background:var(--bg);min-height:100vh;overflow-x:hidden;line-height:1.6;-webkit-font-smoothing:antialiased;animation:pageIn .6s var(--ease-out)}
@keyframes pageIn{from{opacity:0}to{opacity:1}}
a{color:var(--cyan);text-decoration:none}
a:hover{color:#67e8f9}
img{max-width:100%}
h1,h2,h3,h4{line-height:1.15;letter-spacing:-.02em;margin:0 0 .5em}
p{margin:0 0 1em}
code{font-family:var(--mono);font-size:.88em;padding:2px 7px;border-radius:6px;background:rgba(139,92,246,.14);color:#c4b5fd}
::selection{background:rgba(139,92,246,.45)}
.mono{font-family:var(--mono)}
.muted{color:var(--muted)}.tiny{font-size:.82rem}.center{text-align:center}
.ok-txt{color:var(--green)}.err-txt{color:var(--pink)}
.sm-top{margin-top:16px}.nowrap{white-space:nowrap}.inl{display:inline}
.ell{display:block;max-width:220px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.grad{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.grad--anim{background-size:220% 100%;animation:gradMove 6s ease-in-out infinite}
@keyframes gradMove{0%,100%{background-position:0 50%}50%{background-position:100% 50%}}
.live-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--green);margin-right:8px;vertical-align:middle;box-shadow:0 0 0 0 rgba(52,211,153,.6);animation:live 2s infinite}
@keyframes live{0%{box-shadow:0 0 0 0 rgba(52,211,153,.55)}70%{box-shadow:0 0 0 9px rgba(52,211,153,0)}100%{box-shadow:0 0 0 0 rgba(52,211,153,0)}}
.eyebrow{font-family:var(--mono);font-size:.76rem;letter-spacing:.18em;text-transform:uppercase;color:var(--cyan);margin:0 0 14px;display:inline-flex;align-items:center}
.cap{font-family:var(--mono);font-size:.72rem;color:var(--faint);text-align:center;letter-spacing:.06em;margin:12px 0 0}
.wrap{max-width:var(--container);margin:0 auto;padding:0 var(--gutter)}

/* ---------- background ---------- */
.bg{position:fixed;inset:0;z-index:-1;pointer-events:none;overflow:hidden;background:radial-gradient(1400px 900px at 85% -10%,#1a1145 0,transparent 60%),radial-gradient(1100px 800px at -10% 20%,#062638 0,transparent 55%),var(--bg)}
.bg-grid{position:absolute;inset:-50px;background:linear-gradient(rgba(139,92,246,.07) 1px,transparent 1px) 0 0/56px 56px,linear-gradient(90deg,rgba(34,211,238,.06) 1px,transparent 1px) 0 0/56px 56px;-webkit-mask:radial-gradient(ellipse 70% 60% at 50% 30%,#000 30%,transparent 80%);mask:radial-gradient(ellipse 70% 60% at 50% 30%,#000 30%,transparent 80%);animation:gridMove 30s linear infinite}
@keyframes gridMove{to{transform:translate(56px,56px)}}
.bg-blob{position:absolute;border-radius:50%;filter:blur(90px);opacity:.35;animation:blob 22s ease-in-out infinite}
.bg-blob--a{width:520px;height:520px;background:#22d3ee;top:-140px;left:-120px;opacity:.16}
.bg-blob--b{width:620px;height:620px;background:#8b5cf6;top:30%;right:-200px;opacity:.18;animation-delay:-7s}
.bg-blob--c{width:480px;height:480px;background:#f43f5e;bottom:-200px;left:30%;opacity:.12;animation-delay:-14s}
@keyframes blob{0%,100%{transform:translate(0,0) scale(1)}33%{transform:translate(60px,-40px) scale(1.1)}66%{transform:translate(-40px,50px) scale(.95)}}
#starfield{position:absolute;inset:0;width:100%;height:100%}
.scroll-bar{position:fixed;top:0;left:0;right:0;height:2px;z-index:60;pointer-events:none}
.scroll-bar i{display:block;height:100%;width:100%;transform-origin:0 50%;transform:scaleX(var(--sp,0));background:var(--grad);box-shadow:0 0 12px rgba(139,92,246,.8)}

/* ---------- topbar ---------- */
.topbar{position:sticky;top:0;z-index:50;transition:background .3s,border-color .3s,backdrop-filter .3s;border-bottom:1px solid transparent}
.topbar.is-stuck{background:rgba(6,7,16,.72);backdrop-filter:blur(16px) saturate(140%);border-color:var(--line)}
.topbar-in{max-width:var(--container);margin:0 auto;padding:12px var(--gutter);display:flex;align-items:center;gap:22px}
.topbar-logo{display:flex;align-items:center;color:var(--text)}
.nav{position:relative;display:flex;align-items:center;gap:2px;flex:1}
.nav-a{position:relative;z-index:1;color:var(--muted);font-weight:600;font-size:.92rem;padding:8px 13px;border-radius:10px;transition:color .25s;white-space:nowrap}
.hero-facts b{white-space:nowrap}
.nav-a:hover,.nav-a.is-active{color:var(--text)}
.nav-a--out{color:#fb7185}.nav-a--out:hover{color:#fda4af}
.nav-ind{position:absolute;z-index:0;top:50%;height:36px;left:0;width:0;border-radius:10px;background:rgba(255,255,255,.07);border:1px solid var(--line);transform:translateY(-50%);transition:left .35s var(--ease-out),width .35s var(--ease-out),opacity .25s;opacity:0}
.nav-sep{width:1px;height:20px;background:var(--line2);margin:0 8px}
.topbar-right{display:flex;align-items:center;gap:10px}
.ver-chip{display:inline-flex;align-items:center;gap:7px;font-family:var(--mono);font-size:.74rem;color:var(--muted);padding:5px 10px;border:1px solid var(--line);border-radius:999px;background:rgba(255,255,255,.03)}
.ver-chip i{width:6px;height:6px;border-radius:50%;background:var(--green);box-shadow:0 0 8px var(--green)}
.lang-pill{font-weight:700;font-size:.78rem;color:var(--muted);padding:6px 11px;border:1px solid var(--line);border-radius:999px}
.lang-pill:hover{color:var(--text);border-color:var(--line2)}
.menu-btn{display:none;margin-left:auto;width:42px;height:42px;border-radius:12px;border:1px solid var(--line);background:rgba(255,255,255,.04);cursor:pointer;flex-direction:column;justify-content:center;align-items:center;gap:5px}
.menu-btn span{width:18px;height:2px;border-radius:2px;background:var(--text);transition:transform .3s,opacity .3s}
.menu-btn[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.menu-btn[aria-expanded="true"] span:nth-child(2){opacity:0}
.menu-btn[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

/* ---------- logo ---------- */
.logo{display:inline-flex;align-items:center;gap:11px}
.lg-mark{display:block;overflow:visible}
.lg-d{stroke-dasharray:90;stroke-dashoffset:90;animation:lgDraw 1.4s var(--ease-out) .2s forwards}
@keyframes lgDraw{to{stroke-dashoffset:0}}
.lg-hex{transition:filter .3s}
.logo:hover .lg-hex{filter:drop-shadow(0 0 8px rgba(139,92,246,.9))}
.lg-node{fill:#fff}
.lg-node--hot{fill:#22d3ee;transform-box:fill-box;transform-origin:center;animation:lgPulse 2.4s ease-in-out infinite}
@keyframes lgPulse{50%{transform:scale(1.5);fill:#f43f5e}}
.lg-pkt{fill:#fff;filter:drop-shadow(0 0 3px #22d3ee) drop-shadow(0 0 6px #8b5cf6)}
.lg-glow{opacity:.8;animation:lgGlow 3s ease-in-out infinite}
@keyframes lgGlow{50%{opacity:.35}}
.lg-orbits{transform-origin:32px 32px;animation:spin 18s linear infinite}
.lg-orbit{fill:none;stroke:rgba(139,92,246,.35);stroke-width:.6;stroke-dasharray:2 4}
.lg-orbit--2{stroke:rgba(34,211,238,.22);stroke-dasharray:1 6}
.lg-sat{fill:#22d3ee;filter:drop-shadow(0 0 4px #22d3ee)}
@keyframes spin{to{transform:rotate(360deg)}}
.logo-word{display:flex;flex-direction:column;line-height:1}
.logo-word b{font-weight:900;font-size:1.22rem;letter-spacing:.04em;background:var(--grad);background-size:200% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:gradMove 6s ease-in-out infinite}
.logo-word span{font-family:var(--mono);font-size:.62rem;letter-spacing:.42em;color:var(--muted);margin-top:4px;position:relative}
.logo-tag{font-family:var(--mono);font-size:.6rem;font-weight:800;letter-spacing:.08em;padding:3px 7px;border-radius:6px;color:#05060d;background:var(--grad);align-self:flex-start;margin-top:2px}
.logo--hero{flex-direction:column;gap:18px}
.logo--hero .logo-word{align-items:center}
.logo--hero .logo-word b{font-size:2.6rem;letter-spacing:.08em}
.logo--hero .logo-word span{font-size:.9rem;letter-spacing:.7em;margin-left:.7em}
.logo--hero .lg-mark{filter:drop-shadow(0 20px 50px rgba(139,92,246,.45))}

/* ---------- buttons ---------- */
.btn{position:relative;isolation:isolate;overflow:hidden;display:inline-flex;align-items:center;justify-content:center;gap:10px;cursor:pointer;border:0;font-family:var(--font);font-weight:800;font-size:.95rem;letter-spacing:.01em;color:#05060d;padding:12px 20px;border-radius:12px;background:var(--grad);background-size:200% 100%;box-shadow:0 10px 30px -8px rgba(139,92,246,.6),inset 0 1px 0 rgba(255,255,255,.35);transition:transform .2s var(--ease-out),box-shadow .3s,background-position .6s;text-decoration:none}
.btn:hover{color:#05060d;transform:translateY(-2px);background-position:100% 0;box-shadow:0 16px 40px -10px rgba(34,211,238,.7),inset 0 1px 0 rgba(255,255,255,.35)}
.btn:active{transform:translateY(0) scale(.98)}
.btn::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.55) 50%,transparent 70%);transform:translateX(-120%);transition:transform .7s var(--ease-out)}
.btn:hover::after{transform:translateX(120%)}
.btn--sm{padding:8px 13px;font-size:.82rem;border-radius:10px}
.btn--lg{padding:15px 26px;font-size:1.02rem;border-radius:14px}
.btn--full{width:100%}
.btn--ghost{background:rgba(255,255,255,.04);color:var(--text);border:1px solid var(--line2);box-shadow:none}
.btn--ghost:hover{color:var(--text);background:rgba(255,255,255,.08);box-shadow:0 10px 30px -12px rgba(139,92,246,.5)}
.btn--danger{background:linear-gradient(100deg,#f43f5e,#be123c);color:#fff;box-shadow:0 10px 26px -10px rgba(244,63,94,.7)}
.btn--danger:hover{color:#fff}
.btn-arrow{display:inline-block;transition:transform .3s var(--ease-out)}
.btn:hover .btn-arrow{transform:translateX(4px)}
.btn.is-busy{pointer-events:none;opacity:.85}
.btn.is-busy::before{content:"";width:16px;height:16px;border-radius:50%;border:2px solid rgba(5,6,13,.3);border-top-color:#05060d;animation:spin .7s linear infinite}
/* neon: rotating light around the border + breathing glow */
.is-neon{border:2px solid transparent;background:linear-gradient(#0e1024,#0e1024) padding-box,conic-gradient(from var(--neon-a),#22d3ee,#8b5cf6 25%,#fff 30%,#8b5cf6 35%,#f43f5e 60%,#22d3ee 100%) border-box;color:var(--text);animation:neonSpin 3.4s linear infinite,neonBreathe 2.6s ease-in-out infinite}
.is-neon:hover{color:#fff;background:linear-gradient(#171a3a,#171a3a) padding-box,conic-gradient(from var(--neon-a),#22d3ee,#8b5cf6 25%,#fff 30%,#8b5cf6 35%,#f43f5e 60%,#22d3ee 100%) border-box;animation-duration:1.6s,2.6s}
@keyframes neonSpin{to{--neon-a:360deg}}
@keyframes neonBreathe{0%,100%{box-shadow:0 0 0 1px rgba(139,92,246,.25),0 0 12px rgba(139,92,246,.45),0 0 28px rgba(34,211,238,.18)}50%{box-shadow:0 0 0 1px rgba(34,211,238,.45),0 0 20px rgba(139,92,246,.7),0 0 46px rgba(34,211,238,.3)}}
.icon-btn{display:inline-grid;place-items:center;width:38px;height:38px;border-radius:11px;border:1px solid var(--line);background:rgba(255,255,255,.04);color:var(--muted);cursor:pointer;transition:.2s}
.icon-btn svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.icon-btn:hover{color:var(--text);border-color:var(--line2);transform:translateY(-1px)}
.icon-btn--danger:hover{color:#fff;background:rgba(244,63,94,.85);border-color:transparent}
.link-strong{font-weight:700;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}

/* ---------- forms ---------- */
.fld{display:flex;flex-direction:column;gap:7px;margin:0 0 16px}
.fld>span{font-size:.8rem;font-weight:700;color:var(--muted);letter-spacing:.02em}
.fld--grow{flex:1;min-width:160px}
input,select,textarea{width:100%;font:inherit;font-size:.96rem;color:var(--text);background:rgba(5,6,16,.65);border:1px solid var(--line2);border-radius:12px;padding:12px 14px;outline:none;transition:border-color .2s,box-shadow .2s,background .2s}
input::placeholder{color:var(--faint)}
input:focus,select:focus{border-color:rgba(34,211,238,.7);box-shadow:0 0 0 4px rgba(34,211,238,.12),0 0 24px -6px rgba(34,211,238,.5);background:rgba(5,6,16,.85)}
select{appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--muted) 50%),linear-gradient(135deg,var(--muted) 50%,transparent 50%);background-position:calc(100% - 18px) 52%,calc(100% - 13px) 52%;background-size:5px 5px;background-repeat:no-repeat;padding-right:34px}
select option{background:#10122a}
.row{display:flex;gap:14px;flex-wrap:wrap}
.row--mid{align-items:center;gap:20px}
.switch{position:relative;display:inline-flex;align-items:center;gap:11px;cursor:pointer;user-select:none;margin:6px 0}
.switch input{position:absolute;opacity:0;width:0;height:0}
.track{width:46px;height:26px;border-radius:999px;background:#262a46;border:1px solid var(--line);position:relative;transition:background .3s}
.track::after{content:"";position:absolute;top:2px;left:2px;width:20px;height:20px;border-radius:50%;background:#fff;box-shadow:0 2px 6px rgba(0,0,0,.4);transition:transform .35s var(--ease-out)}
.switch input:checked+.track{background:var(--grad)}
.switch input:checked+.track::after{transform:translateX(20px)}
.switch input:focus-visible+.track{box-shadow:0 0 0 3px rgba(34,211,238,.35)}
.onlbl{font-weight:600;font-size:.9rem;color:var(--muted)}
.search{max-width:240px;padding:9px 14px;font-size:.88rem}
.pw-meter{display:grid;grid-template-columns:repeat(4,1fr);gap:5px;margin:-8px 0 16px}
.pw-meter i{height:4px;border-radius:4px;background:rgba(255,255,255,.08);transition:background .3s}
.pw-meter[data-lvl="1"] i:nth-child(-n+1){background:var(--pink)}
.pw-meter[data-lvl="2"] i:nth-child(-n+2){background:var(--amber)}
.pw-meter[data-lvl="3"] i:nth-child(-n+3){background:var(--cyan)}
.pw-meter[data-lvl="4"] i{background:var(--green)}
.captcha{margin:6px 0 18px;padding:14px 16px;border-radius:14px;border:1px dashed rgba(34,211,238,.35);background:rgba(34,211,238,.04);position:relative;overflow:hidden}
.captcha::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(34,211,238,.08),transparent);transform:translateX(-100%);animation:scan 3.2s ease-in-out infinite}
@keyframes scan{to{transform:translateX(100%)}}
.captcha-q{font-size:.82rem;font-weight:700;color:var(--muted)}
.captcha-row{display:flex;align-items:center;gap:14px;margin-top:8px;position:relative}
.captcha-sum{font-family:var(--mono);font-size:1.6rem;font-weight:800;white-space:nowrap;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.captcha-sum i{font-style:normal;color:var(--faint);-webkit-text-fill-color:var(--faint);margin:0 4px}
.captcha-row input{max-width:110px;text-align:center;font-family:var(--mono);font-size:1.15rem;font-weight:700}

/* ---------- cards ---------- */
.card{position:relative;border-radius:var(--r);padding:24px;margin:0 0 20px;background:var(--glass);border:1px solid var(--line);backdrop-filter:blur(18px) saturate(130%)}
.glass{background:linear-gradient(180deg,rgba(22,25,48,.72),rgba(12,14,30,.62));box-shadow:0 30px 60px -30px rgba(0,0,0,.7),inset 0 1px 0 rgba(255,255,255,.06)}
.card h2{font-size:1.25rem}.card h3{font-size:1.05rem}
.card-head{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:8px}
.card-head h2{margin:0}
.widget{padding:20px}
.widget h3{font-size:.95rem;margin-bottom:12px;display:flex;align-items:center;gap:8px}
.widget h3::before{content:"";width:6px;height:6px;border-radius:2px;background:var(--grad);box-shadow:0 0 10px rgba(139,92,246,.8)}
.kv{list-style:none;margin:0;padding:0}
.kv li{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:9px 0;border-bottom:1px solid var(--line);font-size:.88rem}
.kv li:last-child{border-bottom:0}
.kv span{color:var(--muted)}.kv b{font-family:var(--mono);font-weight:600}
.note-x{font-size:.88rem;color:var(--muted);background:rgba(34,211,238,.05);border:1px solid rgba(34,211,238,.2);border-radius:12px;padding:13px 15px;margin:14px 0}
.note-x--warn{border-color:rgba(251,191,36,.35);background:rgba(251,191,36,.06);color:var(--amber)}
.cmd{margin-top:10px;font-family:var(--mono);font-size:.8rem;color:#c4b5fd;background:#04050c;border:1px solid var(--line);border-radius:10px;padding:12px;overflow-x:auto;white-space:pre;cursor:copy}
.empty{display:flex;flex-direction:column;align-items:center;gap:10px;padding:26px 10px;text-align:center;color:var(--muted)}
.empty svg{width:46px;height:46px;fill:none;stroke:url(#psg);stroke:var(--violet);stroke-width:1.4;opacity:.8;animation:floaty 4s ease-in-out infinite}
@keyframes floaty{50%{transform:translateY(-6px)}}
.pill{display:inline-block;padding:4px 10px;border-radius:999px;font-size:.72rem;font-weight:800;letter-spacing:.02em;white-space:nowrap}
.pill.on{background:rgba(52,211,153,.13);color:var(--green);box-shadow:inset 0 0 0 1px rgba(52,211,153,.25)}
.pill.off{background:rgba(244,63,94,.13);color:#fb7185;box-shadow:inset 0 0 0 1px rgba(244,63,94,.25)}
.pill--brand{background:rgba(139,92,246,.16);color:#c4b5fd;box-shadow:inset 0 0 0 1px rgba(139,92,246,.3)}
.quota{font-family:var(--mono);font-size:.78rem;font-weight:700;padding:5px 11px;border-radius:999px;color:var(--green);background:rgba(52,211,153,.1);border:1px solid rgba(52,211,153,.28)}
.quota.full{color:var(--amber);background:rgba(251,191,36,.1);border-color:rgba(251,191,36,.3)}
.addr{font-family:var(--mono);font-weight:700;font-size:1.06rem;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;cursor:copy}
.addr--sm{font-size:.86rem}
.table-scroll{overflow-x:auto}
table{width:100%;border-collapse:collapse}
th,td{text-align:left;padding:12px 10px;border-bottom:1px solid var(--line);font-size:.88rem;vertical-align:middle}
th{font-family:var(--mono);font-size:.68rem;font-weight:600;color:var(--faint);text-transform:uppercase;letter-spacing:.1em}
tr{transition:background .2s}
tbody tr:hover,table tr:hover td{background:rgba(255,255,255,.02)}
.flag{display:inline-block;width:22px;height:16px;border-radius:3px;object-fit:cover;vertical-align:middle;box-shadow:0 0 0 1px rgba(255,255,255,.18),0 2px 8px rgba(0,0,0,.4)}
.flag--lg{width:30px;height:22px;border-radius:4px}
.flag--xl{width:44px;height:32px;border-radius:6px}
.flag--none{display:inline-grid;place-items:center;font-family:var(--mono);font-size:.62rem;font-weight:800;color:var(--muted);background:rgba(255,255,255,.06)}
.place{display:inline-flex;align-items:center;gap:7px}
.place small{color:var(--faint);margin-left:4px}
.place--none{color:var(--faint)}

/* ---------- motion fx: frame, corners, spotlight ---------- */
.fx-host{position:relative;isolation:isolate}
.fx{position:absolute;inset:0;z-index:2;border-radius:inherit;pointer-events:none}
.fx>i{position:absolute;inset:0;border-radius:inherit}
.fx-frame,.fx-frame-hover{padding:1.4px;background:conic-gradient(from var(--fx-a),transparent 0 270deg,rgba(139,92,246,.25) 300deg,#8b5cf6 330deg,#22d3ee 350deg,#e0f2fe 355deg,transparent 360deg);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);animation:fxSpin var(--fx-dur,8s) linear infinite}
.fx-frame-hover{opacity:0;transition:opacity .45s var(--ease);animation-duration:3.4s}
.fx-host:hover>.fx>.fx-frame-hover,.fx-host:focus-within>.fx>.fx-frame-hover{opacity:1}
@keyframes fxSpin{to{--fx-a:360deg}}
.fx-corners{inset:-7px!important;border-radius:0!important}
.fx-corners i{position:absolute;width:12px;height:12px;border:0 solid var(--cyan);opacity:0;transition:opacity .3s var(--ease),transform .5s var(--ease-out)}
.fx-corners i:nth-child(1){top:0;left:0;border-width:1.5px 0 0 1.5px;transform:translate(-6px,-6px)}
.fx-corners i:nth-child(2){top:0;right:0;border-width:1.5px 1.5px 0 0;transform:translate(6px,-6px);transition-delay:.04s}
.fx-corners i:nth-child(3){right:0;bottom:0;border-width:0 1.5px 1.5px 0;transform:translate(6px,6px);transition-delay:.08s}
.fx-corners i:nth-child(4){bottom:0;left:0;border-width:0 0 1.5px 1.5px;transform:translate(-6px,6px);transition-delay:.12s}
.fx-host:hover>.fx>.fx-corners i,.fx-host:focus-within>.fx>.fx-corners i{opacity:1;transform:none}
.fx-spot{background:radial-gradient(420px circle at var(--mx,50%) var(--my,50%),rgba(139,92,246,.14),transparent 45%);opacity:0;transition:opacity .4s}
.fx-host:hover>.fx>.fx-spot{opacity:1}
/* reveal */
.js [data-reveal]{opacity:0;transform:translateY(22px);filter:blur(6px);transition:opacity .8s var(--ease-out),transform .9s var(--ease-out),filter .8s var(--ease-out);transition-delay:var(--rd,0s)}
.js [data-reveal="fade"]{transform:scale(.97)}
.js [data-reveal].is-in{opacity:1;transform:none;filter:none}
.split .w{display:inline-block;white-space:nowrap}
.split .ch{display:inline-block;opacity:0;transform:translateY(.5em) rotate(4deg);animation:chIn .7s var(--ease-out) forwards;animation-delay:calc(var(--ci) * 28ms + .15s)}
@keyframes chIn{to{opacity:1;transform:none}}

/* ---------- sections ---------- */
.sec{padding:clamp(56px,8vw,110px) 0 0}
.sec--tight{padding-top:20px}
.sec-head{max-width:760px;margin:0 auto 42px;text-align:center}
.sec-title{font-size:clamp(1.8rem,3.6vw,2.8rem);font-weight:850;letter-spacing:-.03em}
.sec-intro{color:var(--muted);font-size:1.06rem;max-width:640px;margin:0 auto}
.sub-h{font-size:1.15rem;margin:34px 0 16px;display:flex;align-items:center;gap:10px}
.sub-h::before{content:"";width:22px;height:2px;background:var(--grad)}

/* ---------- hero ---------- */
.hero{display:grid;grid-template-columns:1.05fr .95fr;gap:40px;align-items:center;min-height:calc(100vh - 80px);padding:30px 0 40px}
.hero-title{font-size:clamp(2.6rem,6vw,4.6rem);font-weight:900;letter-spacing:-.045em;line-height:1.02;margin-bottom:22px}
.hero-title .split{display:block;color:var(--text)}
.hero-desc{font-size:1.14rem;color:var(--muted);max-width:560px}
.hero-cta{display:flex;flex-wrap:wrap;gap:12px;margin:28px 0 34px}
.hero-facts{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,auto);gap:10px 28px;justify-content:start}
.hero-facts li{display:flex;flex-direction:column;padding-left:14px;border-left:2px solid transparent;border-image:var(--grad) 1}
.hero-facts b{font-family:var(--mono);font-size:1.05rem}
.hero-facts span{font-size:.78rem;color:var(--faint)}
.hero-art{position:relative;height:min(600px,72vh);display:grid;place-items:center}
.net-canvas{position:absolute;inset:0;width:100%;height:100%}
.hero-logo{position:relative;z-index:2;animation:floaty 6s ease-in-out infinite}
.hero-logo::before{content:"";position:absolute;inset:-60px;border-radius:50%;background:radial-gradient(circle,rgba(139,92,246,.35),transparent 65%);z-index:-1;animation:lgGlow 4s ease-in-out infinite}
.hero-float{position:absolute;z-index:3;display:flex;align-items:center;gap:8px;font-size:.82rem;font-weight:700;padding:9px 14px;border-radius:12px;background:rgba(14,16,34,.78);border:1px solid var(--line2);backdrop-filter:blur(12px);box-shadow:0 18px 40px -16px rgba(0,0,0,.8);animation:bob 5s ease-in-out infinite}
.hero-float--a{top:12%;left:4%}
.hero-float--b{bottom:16%;left:0;color:#c4b5fd;animation-delay:-1.6s}
.hero-float--c{top:22%;right:0;animation-delay:-3.1s}
@keyframes bob{50%{transform:translateY(-10px)}}

/* ---------- band ---------- */
.band{margin:30px calc(var(--gutter) * -1) 0;overflow:hidden;-webkit-mask:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);padding:18px 0}
.band-track{display:flex;width:max-content;animation:band 46s linear infinite}
.band:hover .band-track{animation-play-state:paused}
@keyframes band{to{transform:translateX(-50%)}}
.band-list{display:flex;list-style:none;margin:0;padding:0}
.band-item{position:relative;display:flex;align-items:center;gap:11px;margin-right:46px;padding:12px 18px;border-radius:14px;background:linear-gradient(180deg,rgba(24,27,52,.85),rgba(12,14,30,.85));border:1px solid var(--line);white-space:nowrap;transition:border-color .3s,transform .3s}
.band-item:hover{border-color:rgba(139,92,246,.5);transform:translateY(-3px)}
.band-item::after{content:"";position:absolute;left:100%;top:50%;width:46px;height:1px;background:repeating-linear-gradient(90deg,var(--line2) 0 4px,transparent 4px 8px)}
.band-item::before{content:"";position:absolute;left:100%;top:50%;width:8px;height:8px;margin:-4px 0 0;border-radius:50%;background:var(--cyan);box-shadow:0 0 10px var(--cyan);animation:sig 2.4s linear infinite;animation-delay:calc(var(--i,0) * -.37s);z-index:1}
@keyframes sig{0%{transform:translateX(0);opacity:0}15%{opacity:1}85%{opacity:1}100%{transform:translateX(38px);opacity:0}}
.band-ico{display:grid;place-items:center;width:30px;height:30px;border-radius:9px;background:rgba(139,92,246,.12);color:#c4b5fd}
.band-ico svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.band-name{font-weight:700;font-size:.9rem}

/* ---------- process ---------- */
.proc-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:36px;align-items:center}
.proc-steps{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
.proc-step button{width:100%;display:grid;grid-template-columns:auto 1fr;gap:16px;align-items:center;text-align:left;cursor:pointer;font:inherit;color:inherit;padding:18px 18px 22px;border-radius:16px;border:1px solid var(--line);background:rgba(255,255,255,.02);position:relative;overflow:hidden;transition:background .35s,border-color .35s,transform .35s var(--ease-out)}
.proc-step button:hover{border-color:var(--line2);transform:translateX(4px)}
.proc-num{font-family:var(--mono);font-weight:800;font-size:.95rem;width:44px;height:44px;display:grid;place-items:center;border-radius:12px;color:var(--muted);background:rgba(255,255,255,.04);border:1px solid var(--line);transition:.35s}
.proc-txt b{display:block;font-size:1.02rem}
.proc-txt small{color:var(--muted);font-size:.86rem}
.proc-bar{position:absolute;left:18px;right:18px;bottom:10px;height:2px;border-radius:2px;background:rgba(255,255,255,.06);overflow:hidden}
.proc-bar i{display:block;height:100%;width:0;background:var(--grad)}
.proc-step.is-on button{background:var(--grad-soft);border-color:rgba(139,92,246,.45);box-shadow:0 20px 40px -24px rgba(139,92,246,.7)}
.proc-step.is-on .proc-num{color:#05060d;background:var(--grad);border-color:transparent;box-shadow:0 0 22px rgba(139,92,246,.6)}
.proc-step.is-on .proc-bar i{animation:procBar var(--proc-dur,5s) linear forwards}
@keyframes procBar{to{width:100%}}
.proc-win{position:relative;border-radius:20px;background:linear-gradient(180deg,#121430,#0a0b1c);border:1px solid var(--line2);box-shadow:0 40px 90px -40px rgba(139,92,246,.55),0 0 0 1px rgba(0,0,0,.4);overflow:hidden}
.win-bar{display:flex;align-items:center;gap:7px;padding:13px 16px;border-bottom:1px solid var(--line);background:rgba(255,255,255,.02)}
.win-bar>i{width:11px;height:11px;border-radius:50%;background:#2a2e4d}
.win-bar>i:nth-child(1){background:#f43f5e}.win-bar>i:nth-child(2){background:#fbbf24}.win-bar>i:nth-child(3){background:#34d399}
.win-url{margin:0 auto;display:flex;align-items:center;gap:7px;font-family:var(--mono);font-size:.74rem;color:var(--muted);padding:5px 14px;border-radius:999px;background:rgba(0,0,0,.35);border:1px solid var(--line)}
.win-url svg{width:12px;height:12px;fill:none;stroke:var(--green);stroke-width:2}
.win-body{position:relative;height:360px}
.pl{position:absolute;inset:0;padding:26px 28px;opacity:0;visibility:hidden;transform:translateY(14px) scale(.985);transition:opacity .5s var(--ease-out),transform .6s var(--ease-out),visibility 0s .5s}
.proc-win[data-step="1"] .pl-1,.proc-win[data-step="2"] .pl-2,.proc-win[data-step="3"] .pl-3,.proc-win[data-step="4"] .pl-4{opacity:1;visibility:visible;transform:none;transition-delay:0s}
.mk-label{font-size:.74rem;font-weight:700;color:var(--muted);margin:0 0 7px;letter-spacing:.03em}
.mk-input{display:flex;align-items:center;height:44px;padding:0 14px;border-radius:11px;background:rgba(5,6,16,.75);border:1px solid rgba(34,211,238,.5);box-shadow:0 0 0 4px rgba(34,211,238,.08);font-family:var(--mono);font-size:.95rem;margin-bottom:16px}
.mk-input--static{border-color:var(--line2);box-shadow:none;color:var(--muted)}
.mk-caret{display:inline-block;width:2px;height:18px;background:var(--cyan);margin-left:2px;animation:blink 1s steps(1) infinite}
@keyframes blink{50%{opacity:0}}
.mk-row{display:flex;gap:10px;margin-bottom:16px}
.mk-chip{display:flex;align-items:center;gap:8px;font-size:.82rem;font-weight:700;padding:9px 13px;border-radius:10px;background:rgba(139,92,246,.12);border:1px solid rgba(139,92,246,.3)}
.mk-dot{width:7px;height:7px;border-radius:50%;background:var(--green);box-shadow:0 0 8px var(--green)}
.mk-cap{display:inline-flex;gap:12px;align-items:center;font-family:var(--mono);font-size:1.05rem;padding:9px 14px;border-radius:10px;border:1px dashed rgba(34,211,238,.35);margin-bottom:18px}
.mk-cap b{color:var(--green)}
.mk-btn{position:relative;overflow:hidden;display:grid;place-items:center;height:48px;border-radius:12px;font-weight:800;color:#05060d;background:var(--grad)}
.proc-win[data-step="1"] .mk-btn{animation:mkPress .35s 3.15s}
@keyframes mkPress{50%{transform:scale(.96)}}
.mk-ripple{position:absolute;width:20px;height:20px;border-radius:50%;background:rgba(255,255,255,.65);opacity:0;left:62%;top:50%;transform:translate(-50%,-50%)}
.proc-win[data-step="1"] .mk-ripple{animation:ripple .7s 3.15s var(--ease-out)}
@keyframes ripple{0%{opacity:.8;transform:translate(-50%,-50%) scale(0)}100%{opacity:0;transform:translate(-50%,-50%) scale(18)}}
.mk-cursor{position:absolute;width:24px;height:24px;fill:#fff;stroke:#05060d;stroke-width:1.2;left:85%;top:20%;opacity:0;filter:drop-shadow(0 4px 8px rgba(0,0,0,.6))}
.proc-win[data-step="1"] .mk-cursor{animation:cur 3.4s var(--ease-io) forwards}
@keyframes cur{0%,30%{opacity:0;left:85%;top:20%}40%{opacity:1}88%{left:60%;top:80%;transform:scale(1)}92%{transform:scale(.85)}100%{left:60%;top:80%;opacity:1;transform:scale(1)}}
.mk-locs{display:grid;gap:9px}
.mk-loc{display:flex;align-items:center;gap:12px;padding:11px 14px;border-radius:12px;border:1px solid var(--line);background:rgba(255,255,255,.02);font-size:.9rem;opacity:0;transform:translateX(-10px)}
.proc-win[data-step="2"] .mk-loc{animation:locIn .5s var(--ease-out) forwards}
.proc-win[data-step="2"] .mk-loc:nth-child(2){animation-delay:.1s}.proc-win[data-step="2"] .mk-loc:nth-child(3){animation-delay:.2s}.proc-win[data-step="2"] .mk-loc:nth-child(4){animation-delay:.3s}.proc-win[data-step="2"] .mk-loc:nth-child(5){animation-delay:.4s}
@keyframes locIn{to{opacity:1;transform:none}}
.mk-loc img{width:24px;height:17px;border-radius:3px;object-fit:cover;box-shadow:0 0 0 1px rgba(255,255,255,.2)}
.mk-loc small{margin-left:auto;color:var(--faint);font-family:var(--mono);font-size:.74rem}
.mk-auto{width:24px;text-align:center;color:var(--cyan);font-weight:900}
.proc-win[data-step="2"] .mk-loc--pick{animation:locIn .5s var(--ease-out) .1s forwards,locPick .6s var(--ease-out) 1.4s forwards}
@keyframes locPick{to{border-color:rgba(34,211,238,.7);background:rgba(34,211,238,.1);box-shadow:0 0 0 3px rgba(34,211,238,.12),0 0 30px -8px rgba(34,211,238,.7);opacity:1;transform:none}}
.mk-geo{display:flex;align-items:center;gap:9px;margin-top:16px;font-family:var(--mono);font-size:.76rem;color:var(--muted);opacity:0}
.proc-win[data-step="2"] .mk-geo{animation:locIn .5s 2s forwards}
.mk-geo img{border-radius:2px}
.mk-scan{width:14px;height:14px;border-radius:50%;border:2px solid rgba(34,211,238,.25);border-top-color:var(--cyan);animation:spin .8s linear infinite}
.term{font-family:var(--mono);font-size:.8rem;line-height:1.75;color:#cbd5e1;background:#04050b;border:1px solid var(--line);border-radius:12px;padding:16px 18px;height:100%;overflow:hidden}
.term-l{opacity:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.proc-win[data-step="3"] .term-l{animation:termIn .35s steps(8) forwards}
.proc-win[data-step="3"] .term-l:nth-child(2){animation-delay:.6s}.proc-win[data-step="3"] .term-l:nth-child(3){animation-delay:1.2s}.proc-win[data-step="3"] .term-l:nth-child(4){animation-delay:1.8s}.proc-win[data-step="3"] .term-l:nth-child(5){animation-delay:2.4s}.proc-win[data-step="3"] .term-l:nth-child(6){animation-delay:2.9s}
@keyframes termIn{from{opacity:0;clip-path:inset(0 100% 0 0)}to{opacity:1;clip-path:inset(0 0 0 0)}}
.t-p{color:var(--green)}.t-k{color:#67e8f9}.t-h{color:#f0abfc;font-weight:700}.t-ok{color:var(--green)}
.ts-dlg{border-radius:14px;border:1px solid var(--line2);background:#0e1022;padding:16px 18px;box-shadow:0 20px 50px -20px rgba(0,0,0,.8)}
.ts-head{display:flex;align-items:center;gap:9px;font-weight:700;font-size:.86rem;margin:-2px 0 14px;padding-bottom:12px;border-bottom:1px solid var(--line)}
.ts-logo{width:18px;height:18px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#7dd3fc,#2563eb 70%);box-shadow:0 0 10px rgba(37,99,235,.7)}
.mk-btn--ts{height:40px;background:linear-gradient(100deg,#2563eb,#22d3ee)}
.ts-ok{position:absolute;right:28px;bottom:24px;display:flex;align-items:center;gap:12px;padding:12px 16px;border-radius:14px;background:rgba(10,30,24,.92);border:1px solid rgba(52,211,153,.45);box-shadow:0 20px 40px -14px rgba(52,211,153,.5);opacity:0;transform:translateY(16px) scale(.95)}
.proc-win[data-step="4"] .ts-ok{animation:okIn .6s var(--ease-out) 2.6s forwards}
@keyframes okIn{to{opacity:1;transform:none}}
.ts-ok-ico{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:var(--green);color:#05060d;font-weight:900}
.ts-ok b{display:block;font-size:.9rem}.ts-ok small{font-family:var(--mono);color:var(--muted);font-size:.72rem}
.ts-wave{display:flex;align-items:center;gap:3px;height:22px}
.ts-wave i{width:3px;border-radius:2px;background:var(--green);animation:wave 1s ease-in-out infinite}
.ts-wave i:nth-child(1){height:8px}.ts-wave i:nth-child(2){height:16px;animation-delay:.1s}.ts-wave i:nth-child(3){height:22px;animation-delay:.2s}.ts-wave i:nth-child(4){height:14px;animation-delay:.3s}.ts-wave i:nth-child(5){height:9px;animation-delay:.4s}
@keyframes wave{50%{transform:scaleY(.35)}}

/* ---------- geo maps ---------- */
.geo-stage{position:relative;max-width:1100px;margin:0 auto;perspective:1400px}
.geo{position:relative;width:100%;aspect-ratio:1200/463}
.geo--tr{aspect-ratio:903/406;max-width:980px;margin:0 auto}
.geo-layer{position:absolute;inset:0;transition:transform .5s var(--ease-out);will-change:transform}
.geo-dots,.geo-aurora{position:absolute;inset:0}
.geo-dots{-webkit-mask:url("../img/world-dots.svg") center/100% 100% no-repeat;mask:url("../img/world-dots.svg") center/100% 100% no-repeat;background:linear-gradient(180deg,rgba(170,180,255,.32),rgba(120,130,200,.22))}
.geo--tr .geo-dots{-webkit-mask-image:url("../img/turkiye-dots.svg");mask-image:url("../img/turkiye-dots.svg");background:linear-gradient(100deg,rgba(34,211,238,.55),rgba(139,92,246,.6) 55%,rgba(244,63,94,.5))}
.geo-aurora{overflow:hidden;opacity:.6;-webkit-mask:url("../img/world-dots.svg") center/100% 100% no-repeat;mask:url("../img/world-dots.svg") center/100% 100% no-repeat}
.geo--tr .geo-aurora{-webkit-mask-image:url("../img/turkiye-dots.svg");mask-image:url("../img/turkiye-dots.svg");opacity:.9}
.geo-aurora i{position:absolute;inset:0 auto 0 0;width:300%;background:linear-gradient(100deg,transparent 0 18%,var(--c-y) 24%,var(--c-c) 28%,var(--c-v) 32%,transparent 38% 52%,var(--c-p) 58%,var(--c-g) 62%,transparent 68%);animation:aurora 16s linear infinite}
@keyframes aurora{from{transform:translateX(-66.66%)}to{transform:translateX(0)}}
.js .geo .geo-dots{clip-path:inset(0 100% 0 0);transition:clip-path 1.8s var(--ease-out)}
.js .geo.is-in .geo-dots{clip-path:inset(0 0 0 0)}
.geo-svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.g-route{--rc:var(--c-c)}
.g-c-y{--rc:var(--c-y)}.g-c-r{--rc:var(--c-r)}.g-c-g{--rc:var(--c-g)}.g-c-c{--rc:var(--c-c)}.g-c-v{--rc:var(--c-v)}.g-c-p{--rc:var(--c-p)}.g-c-o{--rc:var(--c-o)}
.g-route path{fill:none;stroke-linecap:round}
.g-base{stroke:color-mix(in srgb,var(--rc) 34%,transparent);stroke-width:1.1;stroke-dasharray:1 1;stroke-dashoffset:1;transition:stroke-dashoffset 1.6s var(--ease-out);transition-delay:calc(var(--k,0) * .06s)}
.geo.is-in .g-base{stroke-dashoffset:0}
.g-head,.g-glow{stroke:var(--rc);stroke-dasharray:.09 3;stroke-dashoffset:.09;opacity:0}
.g-head{stroke-width:2.4}
.g-glow{stroke-width:8;stroke-dasharray:.06 3;stroke-dashoffset:.06;filter:blur(2px)}
.geo.is-in .g-head{animation:gRun 5.2s cubic-bezier(.45,0,.25,1) infinite;animation-delay:calc(1.2s + var(--k,0) * .43s)}
.geo.is-in .g-glow{animation:gRunGlow 5.2s cubic-bezier(.45,0,.25,1) infinite;animation-delay:calc(1.2s + var(--k,0) * .43s)}
@keyframes gRun{0%{stroke-dashoffset:.09;opacity:0}6%{opacity:1}62%{opacity:1}70%,100%{stroke-dashoffset:-1;opacity:0}}
@keyframes gRunGlow{0%{stroke-dashoffset:.06;opacity:0}6%{opacity:.35}62%{opacity:.35}70%,100%{stroke-dashoffset:-1;opacity:0}}
.g-hit{fill:none;stroke:var(--rc);stroke-width:1.4;opacity:0;transform-box:fill-box;transform-origin:center}
.geo.is-in .g-hit{animation:gHit 5.2s ease-out infinite;animation-delay:calc(1.2s + var(--k,0) * .43s)}
@keyframes gHit{0%,64%{opacity:0;transform:scale(.4)}68%{opacity:1;transform:scale(.8)}90%,100%{opacity:0;transform:scale(3)}}
.g-route.is-spot .g-base{stroke:var(--rc);stroke-width:2;stroke-dasharray:none}
.g-route.is-spot .g-head{stroke-width:3.4}
.g-city-pt{fill:var(--text);opacity:.85;transform-box:fill-box;transform-origin:center;transition:transform .35s var(--ease-out),fill .3s}
.g-city.is-spot .g-city-pt{fill:var(--spot,#22d3ee);transform:scale(2.4)}
.g-city-name{font:600 11px var(--font);fill:var(--muted);paint-order:stroke;stroke:#05060d;stroke-width:3px;stroke-linejoin:round}
.geo--tr .g-city-name{font-size:13px}
.g-hub-core{fill:#22d3ee;stroke:#05060d;stroke-width:2}
.g-hub-wave{fill:none;stroke:#8b5cf6;stroke-width:1.4;opacity:0;transform-box:fill-box;transform-origin:center;animation:gWave 3.6s ease-out infinite}
.g-hub-wave.w2{animation-delay:1.2s}.g-hub-wave.w3{animation-delay:2.4s}
@keyframes gWave{0%{opacity:.9;transform:scale(.5)}100%{opacity:0;transform:scale(4.4)}}
.g-hub-tag{animation:bob 4s ease-in-out infinite}
.g-hub-tag rect{fill:url(#ggrad);filter:drop-shadow(0 6px 14px rgba(139,92,246,.6))}
.g-hub-tag text{font:800 12.5px var(--font);fill:#05060d;letter-spacing:.03em}
.g-node-ring{fill:none;stroke:#34d399;stroke-width:1.6;transform-box:fill-box;transform-origin:center;animation:gWave 2.6s ease-out infinite}
.g-node-core{fill:#34d399;stroke:#05060d;stroke-width:2}
.g-node-flag{filter:drop-shadow(0 3px 6px rgba(0,0,0,.7))}
.g-node-lbl{font:700 11px var(--font);fill:var(--text);paint-order:stroke;stroke:#05060d;stroke-width:3px}
.geo-spot{position:absolute;left:0;top:0;z-index:4;display:flex;align-items:center;gap:8px;font-size:.78rem;font-weight:700;white-space:nowrap;padding:7px 12px;border-radius:999px;background:rgba(10,11,24,.85);border:1px solid color-mix(in srgb,var(--spot,#22d3ee) 60%,transparent);box-shadow:0 10px 30px -10px var(--spot,#22d3ee);transform:translate(calc(var(--sx,0px) - 50%),calc(var(--sy,0px) - 130%));opacity:0;pointer-events:none}
.geo-spot.is-on{animation:spot 3s var(--ease-out) forwards}
@keyframes spot{0%{opacity:0;transform:translate(calc(var(--sx,0px) - 50%),calc(var(--sy,0px) - 100%)) scale(.9)}12%,82%{opacity:1;transform:translate(calc(var(--sx,0px) - 50%),calc(var(--sy,0px) - 135%)) scale(1)}100%{opacity:0;transform:translate(calc(var(--sx,0px) - 50%),calc(var(--sy,0px) - 150%))}}
.geo-spot-dot{width:7px;height:7px;border-radius:50%;background:var(--spot,#22d3ee);box-shadow:0 0 8px var(--spot,#22d3ee)}
.geo-spot-arrow{color:var(--faint)}
.js .geo-stage[data-reveal]{transform:perspective(1400px) rotateX(16deg) scale(.94);transform-origin:50% 0}
.js .geo-stage[data-reveal].is-in{transform:none}
.geo.is-paused *,.geo.is-paused{animation-play-state:paused!important}
.chips-row{list-style:none;padding:0;margin:30px auto 0;display:flex;flex-wrap:wrap;justify-content:center;gap:10px}
.chip-x{display:flex;align-items:center;gap:9px;padding:10px 15px;border-radius:999px;border:1px solid var(--line);background:rgba(255,255,255,.03);font-size:.86rem;font-weight:600;transition:border-color .3s,transform .3s}
.chip-x:hover{border-color:rgba(139,92,246,.5);transform:translateY(-2px)}
.chip-x svg{width:17px;height:17px;fill:none;stroke:var(--cyan);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.node-strip{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin:22px 0 0}
.node-strip:empty{display:none}
.ns-item{display:flex;align-items:center;gap:10px;padding:9px 14px;border-radius:12px;background:rgba(52,211,153,.06);border:1px solid rgba(52,211,153,.25);font-size:.86rem;font-weight:700;animation:locIn .5s var(--ease-out) both}
.ns-item small{color:var(--muted);font-weight:500}
.ns-empty{color:var(--faint);font-size:.86rem}
.clocks{list-style:none;padding:0;margin:26px auto 0;display:grid;grid-template-columns:repeat(6,1fr);gap:10px;max-width:1100px}
.clock{display:flex;flex-direction:column;gap:2px;padding:14px;border-radius:14px;border:1px solid var(--line);background:rgba(255,255,255,.025);transition:border-color .3s,transform .3s}
.clock:hover{border-color:rgba(34,211,238,.4);transform:translateY(-2px)}
.clock--home{border-color:rgba(139,92,246,.4);background:var(--grad-soft)}
.clock-city{font-size:.76rem;color:var(--muted);font-weight:600}
.clock-time{font-family:var(--mono);font-size:1.3rem;font-weight:700}

/* ---------- packet flow ---------- */
.flow{max-width:980px;margin:0 auto;padding:26px;border-radius:22px;border:1px solid var(--line);background:linear-gradient(180deg,rgba(18,20,42,.75),rgba(9,10,22,.7));box-shadow:0 40px 80px -40px rgba(0,0,0,.8)}
.flow-track{position:relative;height:250px}
.flow-node{position:absolute;top:18px;width:150px;display:flex;flex-direction:column;align-items:center;text-align:center;gap:4px;z-index:2}
.flow-node--client{left:0}.flow-node--proxy{left:50%;transform:translateX(-50%)}.flow-node--server{right:0}
.flow-node b{font-size:.92rem}.flow-node small{font-size:.72rem;color:var(--faint)}
.flow-ico{position:relative;width:64px;height:64px;border-radius:18px;display:grid;place-items:center;background:rgba(255,255,255,.04);border:1px solid var(--line2);margin-bottom:6px;transition:.35s}
.flow-ico svg{width:28px;height:28px;fill:none;stroke:var(--text);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.flow-ico--brand{background:var(--grad-soft);border-color:rgba(139,92,246,.5);box-shadow:0 0 30px -6px rgba(139,92,246,.7)}
.flow-ico--brand svg{stroke:#c4b5fd}
.flow-ring{position:absolute;inset:-8px;border-radius:22px;border:1px solid rgba(34,211,238,.6);opacity:0}
.flow.is-rewrite .flow-ring{animation:ringPop .9s var(--ease-out)}
@keyframes ringPop{0%{opacity:1;transform:scale(.9)}100%{opacity:0;transform:scale(1.35)}}
.flow-node.is-hot .flow-ico{border-color:rgba(34,211,238,.7);box-shadow:0 0 30px -4px rgba(34,211,238,.7);transform:translateY(-3px)}
.flow-line{position:absolute;top:50px;height:2px;background:repeating-linear-gradient(90deg,var(--line2) 0 6px,transparent 6px 12px);overflow:hidden}
.flow-line--a{left:110px;right:calc(50% + 50px)}.flow-line--b{left:calc(50% + 50px);right:110px}
.flow-line i{position:absolute;inset:0;background:linear-gradient(90deg,transparent,var(--cyan),transparent);width:30%;animation:lineRun 1.8s linear infinite}
.flow.is-back .flow-line i{animation-direction:reverse;background:linear-gradient(90deg,transparent,var(--violet),transparent)}
@keyframes lineRun{from{transform:translateX(-100%)}to{transform:translateX(340%)}}
.pkt{position:absolute;top:110px;left:0;width:230px;padding:12px 14px;border-radius:14px;background:rgba(8,10,24,.95);border:1px solid rgba(34,211,238,.55);box-shadow:0 18px 40px -14px rgba(34,211,238,.55);transform:translateX(-50%);transition:left 1.25s var(--ease-io),border-color .4s,box-shadow .4s;z-index:3}
.pkt.is-back{border-color:rgba(139,92,246,.6);box-shadow:0 18px 40px -14px rgba(139,92,246,.6)}
.pkt-head{display:flex;align-items:center;gap:8px;font-family:var(--mono);font-size:.7rem;color:var(--muted);margin-bottom:8px;letter-spacing:.08em}
.pkt-dot{width:8px;height:8px;border-radius:50%;background:var(--cyan);box-shadow:0 0 10px var(--cyan)}
.pkt.is-back .pkt-dot{background:var(--violet);box-shadow:0 0 10px var(--violet)}
.pkt-row{display:flex;justify-content:space-between;gap:10px;padding:5px 8px;border-radius:8px;font-size:.78rem;transition:background .4s}
.pkt-row span{color:var(--faint)}
.pkt-row b{font-family:var(--mono);font-weight:600}
.pkt-row.is-flip{background:rgba(244,63,94,.14)}
.pkt-row.is-flip b{color:#fda4af;animation:flip .55s var(--ease-out)}
@keyframes flip{0%{transform:rotateX(90deg);opacity:0}100%{transform:none;opacity:1}}
.flow-caps{display:none}
.flow-cap{display:flex;align-items:center;gap:12px;margin-top:6px;padding:13px 16px;border-radius:12px;background:rgba(255,255,255,.03);border:1px solid var(--line);font-size:.92rem;min-height:50px}
.flow-step{font-family:var(--mono);font-size:.72rem;font-weight:800;color:#05060d;background:var(--grad);padding:4px 8px;border-radius:7px;flex:none}
.flow-cap [data-flow-cap]{animation:capIn .4s var(--ease-out)}
@keyframes capIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}

/* ---------- compact relay scene ---------- */
.pscene svg{width:100%;height:auto;display:block;overflow:visible}
.ps-link{fill:none;stroke:rgba(255,255,255,.14);stroke-width:2;stroke-dasharray:6 8;animation:psDash 1.2s linear infinite}
.ps-link--back{stroke:rgba(139,92,246,.22);animation-direction:reverse}
@keyframes psDash{to{stroke-dashoffset:-14}}
.ps-pkt{opacity:0}
.ps-go{fill:#22d3ee;filter:drop-shadow(0 0 6px #22d3ee);animation:psGo 3.2s linear infinite}
.ps-back{fill:#a78bfa;filter:drop-shadow(0 0 6px #a78bfa);animation:psBack 3.2s linear infinite;animation-delay:1.6s}
.ps-d2{animation-delay:1.07s}.ps-back.ps-d2{animation-delay:2.7s}.ps-d3{animation-delay:2.14s}
@keyframes psGo{0%{transform:translate(120px,96px);opacity:0}8%{opacity:1}92%{opacity:1}100%{transform:translate(480px,96px);opacity:0}}
@keyframes psBack{0%{transform:translate(480px,124px);opacity:0}8%{opacity:1}92%{opacity:1}100%{transform:translate(120px,124px);opacity:0}}
.ps-node circle{fill:rgba(12,13,30,.95);stroke:rgba(255,255,255,.16);stroke-width:2}
.ps-node--brand circle:nth-of-type(2){stroke:#8b5cf6;filter:drop-shadow(0 0 10px rgba(139,92,246,.75))}
.ps-halo{fill:none!important;stroke:#22d3ee!important;opacity:.35;transform-box:fill-box;transform-origin:center;animation:halo 2.6s ease-in-out infinite}
@keyframes halo{50%{opacity:.85;transform:scale(1.08)}}
.ps-glyph{fill:none;stroke:#e2e8f0;stroke-width:3;stroke-linejoin:round;stroke-linecap:round}
.ps-glyph--brand{stroke:url(#psg)}
.ps-lbl{font:700 15px var(--mono);fill:var(--muted);text-anchor:middle}
.ps-lbl--brand{fill:#67e8f9}

/* ---------- quick links ---------- */
.qgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.qcard{position:relative;display:flex;flex-direction:column;gap:10px;padding:26px;border-radius:20px;border:1px solid var(--line);background:linear-gradient(180deg,rgba(22,25,48,.7),rgba(12,14,30,.6));color:var(--text);overflow:hidden;transition:transform .45s var(--ease-out),border-color .3s}
.qcard:hover{color:var(--text);transform:translateY(-6px);border-color:transparent}
.qcard-ico{width:52px;height:52px;border-radius:15px;display:grid;place-items:center;background:var(--grad-soft);border:1px solid rgba(139,92,246,.35);transition:transform .5s var(--ease-out)}
.qcard:hover .qcard-ico{transform:rotate(-8deg) scale(1.08)}
.qcard-ico svg{width:24px;height:24px;fill:none;stroke:#c4b5fd;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.qcard b{font-size:1.15rem}.qcard p{color:var(--muted);font-size:.92rem;margin:0}
.qcard-go{margin-top:auto;padding-top:8px;font-weight:700;font-size:.88rem;color:var(--cyan)}

/* ---------- doc pages ---------- */
.page-head{padding:60px 0 20px;max-width:820px}
.crumbs{display:flex;gap:8px;font-size:.82rem;color:var(--faint);margin-bottom:18px}
.crumbs a{color:var(--muted)}
.page-title{font-size:clamp(2.3rem,5vw,3.8rem);font-weight:900;letter-spacing:-.04em}
.page-intro{font-size:1.12rem;color:var(--muted)}
.doc{display:grid;grid-template-columns:240px 1fr;gap:44px;align-items:start;margin-top:30px}
.toc{position:sticky;top:96px;display:flex;flex-direction:column;gap:3px;padding:18px;border-radius:18px;border:1px solid var(--line);background:rgba(12,14,30,.55);backdrop-filter:blur(12px)}
.toc-h{font-family:var(--mono);font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;color:var(--faint);margin:0 0 8px}
.toc a{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:10px;color:var(--muted);font-size:.88rem;font-weight:600;transition:.25s;position:relative}
.toc a span{font-family:var(--mono);font-size:.7rem;color:var(--faint);transition:.25s}
.toc a:hover{color:var(--text);background:rgba(255,255,255,.04)}
.toc a.is-active{color:var(--text);background:var(--grad-soft)}
.toc a.is-active span{color:var(--cyan)}
.toc a.is-active::before{content:"";position:absolute;left:-18px;top:50%;width:3px;height:60%;transform:translateY(-50%);border-radius:3px;background:var(--grad)}
.toc-progress{height:3px;border-radius:3px;background:rgba(255,255,255,.06);margin-top:12px;overflow:hidden}
.toc-progress i{display:block;height:100%;width:100%;transform-origin:0 50%;transform:scaleX(var(--tp,0));background:var(--grad)}
.doc-sec{position:relative;padding:10px 0 56px}
.doc-sec h2{font-size:clamp(1.5rem,2.6vw,2rem);font-weight:850}
.doc-sec>p{color:#c7cbe6;font-size:1.03rem;max-width:760px}
.doc-num{font-family:var(--mono);font-size:.76rem;font-weight:800;color:var(--cyan);display:block;margin-bottom:6px;letter-spacing:.1em}
.compare{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:20px}
.cmp{position:relative;padding:22px;border-radius:18px;border:1px solid var(--line);background:rgba(255,255,255,.02)}
.cmp--on{background:var(--grad-soft);border-color:rgba(139,92,246,.35)}
.cmp-h{font-weight:800;margin-bottom:18px}
.cmp-line{display:flex;align-items:center;gap:8px}
.cmp-n{flex:none;font-family:var(--mono);font-size:.74rem;font-weight:800;padding:8px 10px;border-radius:10px;background:rgba(255,255,255,.06);border:1px solid var(--line2)}
.cmp-n--px{color:#05060d;background:var(--grad);border-color:transparent}
.cmp-n--srv{color:#67e8f9}
.cmp-wire{position:relative;flex:1;height:2px;background:repeating-linear-gradient(90deg,var(--line2) 0 5px,transparent 5px 10px)}
.cmp-wire b{position:absolute;top:50%;width:9px;height:9px;margin-top:-4.5px;border-radius:50%;background:var(--cyan);box-shadow:0 0 10px var(--cyan);animation:wireRun 2.2s linear infinite}
.cmp-wire--2 b{animation-delay:1.1s;background:var(--pink);box-shadow:0 0 10px var(--pink)}
@keyframes wireRun{from{left:0}to{left:calc(100% - 9px)}}
.cmp-note{color:var(--muted);font-size:.86rem;margin:16px 0 0}
.fgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:20px}
.fgrid--2{grid-template-columns:repeat(2,1fr)}
.fcard{position:relative;padding:20px;border-radius:16px;border:1px solid var(--line);background:rgba(255,255,255,.025);transition:transform .4s var(--ease-out),border-color .3s,background .3s}
.fcard:hover{transform:translateY(-4px);background:rgba(255,255,255,.04)}
.fcard b{display:block;font-size:1rem;margin-bottom:6px}
.fcard p{color:var(--muted);font-size:.88rem;margin:0}
.fcard-ico{display:grid;place-items:center;width:42px;height:42px;border-radius:12px;margin-bottom:14px;background:var(--grad-soft);border:1px solid rgba(139,92,246,.3)}
.fcard-ico svg{width:21px;height:21px;fill:none;stroke:#c4b5fd;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.vsteps{list-style:none;counter-reset:vs;margin:20px 0;padding:0;position:relative}
.vsteps::before{content:"";position:absolute;left:19px;top:10px;bottom:10px;width:2px;background:linear-gradient(var(--cyan),var(--violet),var(--pink));opacity:.35}
.vsteps li{counter-increment:vs;position:relative;padding:4px 0 22px 58px}
.vsteps li::before{content:counter(vs,decimal-leading-zero);position:absolute;left:0;top:0;width:40px;height:40px;border-radius:12px;display:grid;place-items:center;font-family:var(--mono);font-size:.8rem;font-weight:800;color:#05060d;background:var(--grad);box-shadow:0 0 20px rgba(139,92,246,.5)}
.vsteps b{display:block;font-size:1.02rem;margin-bottom:3px}
.vsteps p{color:var(--muted);font-size:.92rem;margin:0}
.code{font-family:var(--mono);font-size:.82rem;line-height:1.8;color:#cbd5e1;background:#04050b;border:1px solid var(--line);border-radius:14px;padding:18px 20px;overflow-x:auto;margin:10px 0 0}
.code code{background:none;padding:0;color:inherit}
.c-c{color:var(--faint)}.c-k{color:#67e8f9}.c-n{color:#fcd34d}.c-h{color:#f0abfc;font-weight:700}
.faq{display:flex;flex-direction:column;gap:10px;margin-top:16px}
.faq details{border-radius:14px;border:1px solid var(--line);background:rgba(255,255,255,.025);transition:border-color .3s,background .3s;overflow:hidden}
.faq details[open]{border-color:rgba(139,92,246,.4);background:var(--grad-soft)}
.faq summary{cursor:pointer;list-style:none;padding:16px 50px 16px 18px;font-weight:700;position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";position:absolute;right:20px;top:50%;width:9px;height:9px;border-right:2px solid var(--cyan);border-bottom:2px solid var(--cyan);transform:translateY(-70%) rotate(45deg);transition:transform .35s var(--ease-out)}
.faq details[open] summary::after{transform:translateY(-30%) rotate(-135deg)}
.faq details p{padding:0 18px 16px;margin:0;color:var(--muted);animation:capIn .4s var(--ease-out)}
.doc-cta{position:relative;display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;padding:26px 28px;border-radius:20px;border:1px solid rgba(139,92,246,.35);background:var(--grad-soft);margin-top:10px}
.doc-cta b{font-size:1.2rem}.doc-cta p{margin:2px 0 0;color:var(--muted)}

/* ---------- ts3 page ---------- */
.ts-hero{margin-top:22px}
.ts-mock{position:relative;border-radius:18px;border:1px solid var(--line2);background:#0c0e20;overflow:hidden;box-shadow:0 40px 80px -40px rgba(37,99,235,.5)}
.ts-mock-bar{display:flex;align-items:center;gap:7px;padding:11px 14px;border-bottom:1px solid var(--line);font-size:.78rem;color:var(--muted)}
.ts-mock-bar i{width:10px;height:10px;border-radius:50%;background:#2a2e4d}
.ts-mock-bar span{margin-left:8px}
.ts-mock-body{display:grid;grid-template-columns:1.4fr 1fr}
.ts-tree{list-style:none;margin:0;padding:16px 18px;font-size:.88rem;border-right:1px solid var(--line)}
.ts-tree ul{list-style:none;margin:4px 0 8px;padding:0 0 0 24px}
.ts-srv{display:flex;align-items:center;gap:9px;font-weight:800;margin-bottom:8px}
.ts-srv-ico{width:16px;height:16px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#7dd3fc,#2563eb 70%)}
.ts-ch{padding:4px 0;color:#cbd5e1;font-weight:600}
.ts-u{display:flex;align-items:center;gap:9px;padding:3px 0;color:var(--muted);font-weight:500}
.ts-u i{width:10px;height:10px;border-radius:50%;background:#3b4166;flex:none}
.ts-u--talk{color:var(--text)}
.ts-u--talk i{background:#2563eb;box-shadow:0 0 0 0 rgba(37,99,235,.6);animation:talk 1.4s ease-out infinite}
.ts-d2 i{animation-delay:.5s}.ts-d3 i{animation-delay:.9s}
@keyframes talk{0%{box-shadow:0 0 0 0 rgba(96,165,250,.8);background:#60a5fa}70%{box-shadow:0 0 0 7px rgba(96,165,250,0)}100%{background:#2563eb}}
.ts-side{padding:16px 18px;display:flex;flex-direction:column;gap:10px}
.ts-info{display:flex;flex-direction:column;font-size:.8rem}
.ts-info b{color:var(--faint);font-weight:600;font-size:.72rem;text-transform:uppercase;letter-spacing:.06em}
.ts-meter{display:flex;align-items:flex-end;gap:4px;height:54px;margin-top:auto}
.ts-meter i{flex:1;border-radius:3px;background:linear-gradient(0deg,#22d3ee,#8b5cf6);animation:meter 1.2s ease-in-out infinite}
.ts-meter i:nth-child(odd){animation-delay:.2s}.ts-meter i:nth-child(3n){animation-delay:.45s}.ts-meter i:nth-child(4n){animation-delay:.7s}
@keyframes meter{0%,100%{height:20%}50%{height:95%}}
.howto{display:grid;grid-template-columns:1fr 1fr;gap:30px;align-items:center}
.ts-dlg--solo{position:relative;padding-bottom:84px}
.ts-ok--solo{right:18px;bottom:18px}
.ts-dlg--solo.is-done .ts-ok--solo{animation:okIn .6s var(--ease-out) forwards}

/* ---------- download ---------- */
.dl-ver{display:flex;flex-wrap:wrap;gap:10px;align-items:center;font-size:.9rem;color:var(--muted);margin-top:4px}
.dl-ver b{font-family:var(--mono);color:var(--text)}
.dl-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:14px}
.dl-grid--srv{grid-template-columns:repeat(2,1fr)}
.dl-card{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:4px;padding:22px 20px;border-radius:18px;border:1px solid var(--line);background:linear-gradient(180deg,rgba(22,25,48,.7),rgba(12,14,30,.6));color:var(--text);transition:transform .45s var(--ease-out),border-color .3s}
.dl-card:hover{color:var(--text);transform:translateY(-6px)}
.dl-ico{width:50px;height:50px;border-radius:14px;display:grid;place-items:center;background:var(--grad-soft);border:1px solid rgba(139,92,246,.3);margin-bottom:12px;transition:transform .5s var(--ease-out)}
.dl-card:hover .dl-ico{transform:translateY(-3px) rotate(-6deg)}
.dl-ico svg{width:24px;height:24px;fill:none;stroke:#c4b5fd;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.dl-card b{font-size:1.08rem}.dl-card small{color:var(--faint);font-size:.8rem}
.dl-go{margin-top:14px;font-size:.84rem;font-weight:700;color:var(--cyan)}
.dl-you{position:absolute;top:14px;right:14px;font-family:var(--mono);font-size:.62rem;font-weight:800;letter-spacing:.06em;padding:4px 8px;border-radius:7px;color:#05060d;background:var(--green);opacity:0;transform:scale(.8);transition:.4s var(--ease-out)}
.dl-card.is-you{border-color:rgba(52,211,153,.55);box-shadow:0 0 0 1px rgba(52,211,153,.2),0 24px 50px -24px rgba(52,211,153,.6)}
.dl-card.is-you .dl-you{opacity:1;transform:none}
.dl-card--wide{flex-direction:row;flex-wrap:wrap;align-items:center;column-gap:14px}
.dl-card--wide .dl-ico{margin:0}
.dl-card--wide .dl-go{margin:0 0 0 auto}
.steps3{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.step3{position:relative;padding:26px 22px;border-radius:18px;border:1px solid var(--line);background:rgba(255,255,255,.025)}
.step3-n{display:grid;place-items:center;width:44px;height:44px;border-radius:13px;font-family:var(--mono);font-weight:900;color:#05060d;background:var(--grad);margin-bottom:14px;box-shadow:0 0 22px rgba(139,92,246,.5)}
.step3 b{display:block;font-size:1.05rem;margin-bottom:4px}.step3 p{color:var(--muted);font-size:.9rem;margin:0}
.note-x.center,.sec>.note-x{max-width:640px;margin:22px auto 0;text-align:center}

/* ---------- auth ---------- */
.auth-sec{padding-bottom:30px}
.auth-grid{display:grid;grid-template-columns:1fr 440px;gap:50px;align-items:center}
.ticks{list-style:none;padding:0;margin:20px 0 0;display:flex;flex-direction:column;gap:12px}
.ticks li{display:flex;align-items:center;gap:12px;color:#c7cbe6}
.ticks li::before{content:"✓";display:grid;place-items:center;width:24px;height:24px;border-radius:8px;font-size:.78rem;font-weight:900;color:#05060d;background:var(--grad);flex:none}
.auth-box .card{margin:0}
.auth-box h3{font-size:1.3rem}
.auth-solo{display:grid;grid-template-columns:1fr 460px;gap:50px;align-items:center;min-height:calc(100vh - 220px);padding:40px 0}
.auth-solo-art{display:grid;place-items:center}
.auth-solo-art .logo--hero{animation:floaty 6s ease-in-out infinite}
.auth-card{margin:0;padding:30px}
.auth-h{font-size:1.9rem;font-weight:900}

/* ---------- panel ---------- */
.panel-head{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;flex-wrap:wrap;padding:34px 0 22px}
.panel-title{font-size:clamp(1.8rem,3.4vw,2.5rem);font-weight:900;margin:0}
.panel-meter{display:flex;align-items:center;gap:12px;padding:10px 16px;border-radius:14px;border:1px solid var(--line);background:rgba(255,255,255,.03);font-size:.84rem;color:var(--muted)}
.panel-meter b{font-family:var(--mono);color:var(--text)}
.meter{display:flex;gap:5px}
.meter i{width:26px;height:8px;border-radius:4px;background:rgba(255,255,255,.08)}
.meter i.on{background:var(--grad);box-shadow:0 0 10px rgba(139,92,246,.6);animation:meterOn .6s var(--ease-out) both}
@keyframes meterOn{from{transform:scaleX(0)}}
.panel-grid{display:grid;grid-template-columns:280px minmax(0,1fr) 300px;gap:22px;align-items:start}
.panel-rail,.panel-side{position:sticky;top:90px}
.panel-rail .card,.panel-side .card{margin-bottom:18px}
.geo-form{display:flex;gap:8px;margin-top:6px}
.geo-form input{font-family:var(--mono);font-size:.86rem;padding:10px 12px}
.geo-res{margin-top:14px;padding:14px;border-radius:12px;background:rgba(5,6,16,.6);border:1px solid var(--line);animation:capIn .4s var(--ease-out)}
.geo-res .gr-top{display:flex;align-items:center;gap:10px;margin-bottom:10px;font-weight:800}
.geo-res .gr-top .flag{width:34px;height:24px}
.geo-res .gr-row{display:flex;justify-content:space-between;gap:10px;font-size:.82rem;padding:5px 0;border-top:1px solid var(--line)}
.geo-res .gr-row span{color:var(--faint)}
.geo-res .gr-err{color:#fb7185;font-size:.85rem}
.geo-res .gr-load{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:.85rem}
.locs{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:10px;margin:-6px 0 18px}
.loc{cursor:pointer}
.loc input{position:absolute;opacity:0;pointer-events:none}
.loc-in{display:flex;align-items:center;gap:11px;padding:12px 14px;border-radius:14px;border:1px solid var(--line2);background:rgba(255,255,255,.025);transition:border-color .3s,background .3s,transform .3s var(--ease-out),box-shadow .3s}
.loc-in b{display:block;font-size:.9rem}.loc-in small{font-size:.74rem;color:var(--faint)}
.loc:hover .loc-in{transform:translateY(-2px);border-color:rgba(139,92,246,.45)}
.loc input:checked+.loc-in{border-color:rgba(34,211,238,.7);background:rgba(34,211,238,.08);box-shadow:0 0 0 3px rgba(34,211,238,.12),0 14px 30px -14px rgba(34,211,238,.7)}
.loc input:focus-visible+.loc-in{outline:2px solid var(--cyan);outline-offset:2px}
.loc-auto{width:30px;height:22px;display:grid;place-items:center;font-weight:900;color:var(--cyan)}
.loc input:checked+.loc-in .loc-auto{animation:spin 2.4s linear infinite}
.fwd-list{display:flex;flex-direction:column;gap:10px;margin-top:6px}
.fwd{display:grid;grid-template-columns:auto 1fr auto auto;gap:14px;align-items:center;padding:14px 16px;border-radius:16px;border:1px solid var(--line);background:rgba(255,255,255,.02);transition:border-color .3s,transform .3s var(--ease-out),background .3s}
.fwd:hover{border-color:rgba(139,92,246,.4);background:rgba(255,255,255,.035);transform:translateX(3px)}
.fwd-node{display:grid;place-items:center;width:46px;height:46px;border-radius:13px;background:rgba(255,255,255,.04);border:1px solid var(--line)}
.fwd-main{min-width:0}
.fwd-main small{display:flex;flex-wrap:wrap;align-items:center;gap:6px;color:var(--faint);font-size:.78rem;margin-top:4px}
.fwd-arrow{color:var(--cyan)}
.nodes{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.nodes li{display:flex;align-items:center;gap:11px;padding:9px 11px;border-radius:12px;background:rgba(255,255,255,.025);border:1px solid var(--line);font-size:.88rem;font-weight:600}
.nodes li span{display:flex;flex-direction:column;line-height:1.2}
.nodes li small{color:var(--faint);font-weight:500;font-size:.74rem}
.nodes li b{margin-left:auto;font-family:var(--mono);font-size:.78rem;color:var(--green);background:rgba(52,211,153,.1);padding:2px 8px;border-radius:7px}

/* ---------- business card (RGB, fixed GIF) ---------- */
.vcard{position:relative;border-radius:22px;padding:2.5px;margin-bottom:18px;background:conic-gradient(from var(--rgb),#ff004c,#ffb800,#22d3ee,#8b5cf6,#ff004c);animation:rgbSpin 5s linear infinite;box-shadow:0 30px 60px -24px rgba(139,92,246,.55)}
@keyframes rgbSpin{to{--rgb:360deg}}
.vcard::after{content:"";position:absolute;inset:-10px;z-index:-1;border-radius:30px;background:inherit;filter:blur(24px);opacity:.45}
.vcard-inner{position:relative;overflow:hidden;border-radius:20px;padding:20px 20px 22px;text-align:center;background:radial-gradient(130% 90% at 50% 0,#191a3c,#08091a)}
.vcard-inner::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(115deg,transparent 40%,rgba(255,255,255,.13) 50%,transparent 60%);transform:translateX(-130%);animation:vShine 4.6s ease-in-out infinite}
@keyframes vShine{0%,70%{transform:translateX(-130%)}85%,100%{transform:translateX(130%)}}
.vcard-top{display:flex;align-items:center;justify-content:space-between;font-family:var(--mono);font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;color:var(--faint);margin-bottom:14px}
.vcard-top .lg-mark{width:28px;height:28px}
.vcard-ava{width:118px;height:118px;margin:0 auto 14px;border-radius:50%;padding:3px;background:conic-gradient(from var(--rgb),#22d3ee,#8b5cf6,#f43f5e,#ffb800,#22d3ee);animation:rgbSpin 3.4s linear infinite;box-shadow:0 0 40px -6px rgba(139,92,246,.8)}
.vcard-ava img{width:100%;height:100%;border-radius:50%;object-fit:cover;display:block;background:#08091a;border:3px solid #08091a}
.vcard-nick{display:inline-block;font-size:1.75rem;font-weight:900;letter-spacing:.01em;background:linear-gradient(90deg,#ff004c,#ffb800,#22d3ee,#8b5cf6,#ff004c);background-size:300% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:rgbText 4s linear infinite,nickSway 3.2s ease-in-out infinite;transform-origin:50% 80%;filter:drop-shadow(0 0 14px rgba(139,92,246,.45))}
@keyframes rgbText{to{background-position:300% 0}}
@keyframes nickSway{0%,100%{transform:rotate(-5deg) translateY(0)}50%{transform:rotate(5deg) translateY(-2px)}}
.vcard-role{color:var(--muted);font-size:.8rem;margin-top:6px}
.vcard-kv{list-style:none;padding:0;margin:16px 0 0;display:grid;grid-template-columns:1fr 1fr;gap:8px}
.vcard-kv li{padding:9px;border-radius:11px;background:rgba(255,255,255,.04);border:1px solid var(--line);display:flex;flex-direction:column;gap:2px}
.vcard-kv span{font-size:.64rem;text-transform:uppercase;letter-spacing:.08em;color:var(--faint)}
.vcard-kv b{font-family:var(--mono);font-size:.84rem}
.vcard-mark{margin-top:14px;font-family:var(--mono);font-weight:800;font-size:1.25rem;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 0 10px rgba(34,211,238,.6))}
.vcard-bolt{position:absolute;width:40px;height:90px;opacity:0;pointer-events:none;background:linear-gradient(#fff,#a5f3fc 40%,#8b5cf6);clip-path:polygon(55% 0,20% 52%,48% 52%,30% 100%,82% 40%,52% 40%,72% 0);filter:drop-shadow(0 0 10px #67e8f9)}
.vcard-bolt--a{top:8px;left:10px;animation:bolt 7s infinite}
.vcard-bolt--b{top:40px;right:8px;transform:scaleX(-1) scale(.8);animation:bolt 9s 3.2s infinite}
@keyframes bolt{0%,93%,100%{opacity:0}94%{opacity:1}95%{opacity:.2}96%{opacity:1}97.5%{opacity:0}}

/* ---------- admin ---------- */
.admin{display:grid;grid-template-columns:230px 1fr;gap:28px;align-items:start}
.admin-nav{position:sticky;top:90px;display:flex;flex-direction:column;gap:3px;padding:14px;border-radius:18px;border:1px solid var(--line);background:rgba(12,14,30,.6);backdrop-filter:blur(12px)}
.admin-nav a{position:relative;display:flex;align-items:center;gap:11px;padding:10px 12px;border-radius:11px;color:var(--muted);font-weight:600;font-size:.9rem;transition:.25s}
.admin-nav a:hover{color:var(--text);background:rgba(255,255,255,.04)}
.admin-nav a.is-active{color:var(--text);background:var(--grad-soft)}
.admin-nav a.is-active::before{content:"";position:absolute;left:-14px;top:50%;width:3px;height:60%;transform:translateY(-50%);border-radius:3px;background:var(--grad)}
.an-ico{width:22px;text-align:center;color:var(--cyan)}
.admin-nav em{margin-left:auto;font-style:normal;font-family:var(--mono);font-size:.7rem;padding:2px 7px;border-radius:7px;background:rgba(255,255,255,.07)}
.admin-nav em.em-warn{background:rgba(251,191,36,.18);color:var(--amber)}
.admin-meta{font-size:.78rem;color:var(--faint);padding:8px 12px;border:1px solid var(--line);border-radius:10px}
.adm-h{font-size:1.4rem;font-weight:850;margin-bottom:16px}
.doc-sec>.card-head{margin-bottom:16px}
.card-head .adm-h{margin:0}
.admin-body .doc-sec{padding-bottom:40px}
.stat-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:14px;margin-bottom:20px}
.stat{position:relative;overflow:hidden;display:flex;flex-direction:column;gap:3px;padding:18px;border-radius:16px;border:1px solid var(--line);background:linear-gradient(180deg,rgba(22,25,48,.72),rgba(12,14,30,.6));transition:transform .35s var(--ease-out),box-shadow .3s}
.stat:hover{transform:translateY(-4px);box-shadow:0 20px 40px -20px rgba(34,211,238,.45)}
.stat::before{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:var(--grad)}
.stat::after{content:"";position:absolute;right:-30px;top:-30px;width:90px;height:90px;border-radius:50%;background:radial-gradient(circle,rgba(139,92,246,.25),transparent 70%)}
.stat-ico{font-size:1.2rem;color:var(--cyan)}
.stat-n{font-size:2.1rem;font-weight:900;line-height:1.05;font-variant-numeric:tabular-nums;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.stat-l{font-size:.78rem;color:var(--muted)}
.geo--admin{margin-top:6px}
.sys-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}
.sys-item{padding:14px;border-radius:13px;border:1px solid var(--line);background:rgba(255,255,255,.025)}
.sys-item span{display:block;font-family:var(--mono);font-size:.64rem;letter-spacing:.08em;text-transform:uppercase;color:var(--faint);margin-bottom:5px}
.sys-item b{font-family:var(--mono);font-size:.9rem;word-break:break-word}
.node-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:16px;margin-bottom:20px}
.node-card{position:relative;padding:18px;border-radius:18px;border:1px solid var(--line);background:linear-gradient(180deg,rgba(22,25,48,.72),rgba(12,14,30,.6));transition:transform .4s var(--ease-out)}
.node-card:hover{transform:translateY(-4px)}
.node-card.is-off{opacity:.62;filter:saturate(.5)}
.nc-top{display:flex;align-items:center;gap:14px;margin-bottom:14px}
.nc-flag{position:relative}
.nc-flag::after{content:"";position:absolute;right:-4px;bottom:-4px;width:12px;height:12px;border-radius:50%;background:var(--green);border:2px solid #0c0e20;box-shadow:0 0 8px var(--green)}
.node-card.is-off .nc-flag::after{background:var(--pink);box-shadow:none}
.nc-id{flex:1;min-width:0}
.nc-id b{display:block;font-size:1.05rem}.nc-id small{color:var(--muted);font-size:.8rem}
.nc-kv{list-style:none;margin:0 0 14px;padding:0}
.nc-kv li{display:flex;justify-content:space-between;gap:10px;padding:7px 0;border-bottom:1px solid var(--line);font-size:.82rem}
.nc-kv span{color:var(--faint)}
.nc-actions{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:10px}
.nc-cc select{font-size:.8rem;padding:8px 32px 8px 10px}
.head-tools{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.u-ava{display:inline-grid;place-items:center;width:28px;height:28px;border-radius:9px;margin-right:10px;font-weight:900;font-size:.8rem;color:#05060d;background:var(--grad);vertical-align:middle}
.settings .set-grid{display:grid;grid-template-columns:1fr 1fr;gap:26px;margin-bottom:18px}
.set-group h4{font-family:var(--mono);font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--cyan);margin-bottom:14px}
.set-group .switch{display:flex}
.log-chips{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:14px}
.lchip{font:inherit;font-family:var(--mono);font-size:.74rem;font-weight:700;cursor:pointer;padding:6px 11px;border-radius:999px;color:var(--muted);background:rgba(255,255,255,.04);border:1px solid var(--line);transition:.2s}
.lchip:hover{color:var(--text)}
.lchip.is-on{color:#05060d;background:var(--grad);border-color:transparent}
.ev{font-family:var(--mono);font-size:.74rem;font-weight:700;padding:3px 8px;border-radius:7px;background:rgba(255,255,255,.06)}
.ev--create{color:var(--green);background:rgba(52,211,153,.12)}
.ev--delete{color:#fb7185;background:rgba(244,63,94,.12)}
.ev--create_rejected{color:var(--amber);background:rgba(251,191,36,.12)}
.ev--agent_create_failed{color:#fb7185;background:rgba(244,63,94,.18)}

/* ---------- modal / welcome / toast ---------- */
#modal-root:empty{display:none}
.modal-back{position:fixed;inset:0;z-index:100;display:grid;place-items:center;padding:16px;background:rgba(3,4,10,.75);backdrop-filter:blur(8px);animation:pageIn .25s}
.modal{position:relative;width:min(460px,100%);border-radius:24px;padding:2.5px;background:conic-gradient(from var(--rgb),#22d3ee,#8b5cf6,#f43f5e,#ffb800,#22d3ee);animation:rgbSpin 4s linear infinite,pop .5s var(--ease-out)}
@keyframes pop{from{transform:scale(.8) translateY(20px);opacity:0}to{transform:none;opacity:1}}
.modal-body{position:relative;overflow:hidden;border-radius:22px;padding:32px 28px;text-align:center;background:radial-gradient(130% 100% at 50% 0,#1a1b40,#08091a)}
.modal-body::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 50% 0,rgba(52,211,153,.18),transparent 55%);pointer-events:none}
.modal-ico{position:relative;width:76px;height:76px;margin:0 auto 14px;border-radius:50%;display:grid;place-items:center;font-size:2.2rem;background:rgba(52,211,153,.12);border:1px solid rgba(52,211,153,.4);animation:bounce .7s var(--ease-out)}
.modal-ico::after{content:"";position:absolute;inset:-8px;border-radius:50%;border:1px solid rgba(52,211,153,.5);animation:gWave 2.2s ease-out infinite}
@keyframes bounce{0%{transform:scale(0)}60%{transform:scale(1.2)}100%{transform:scale(1)}}
.modal h3{font-size:1.5rem;margin:.2em 0}
.modal p{color:var(--muted);margin:.35em 0}
.modal-place{display:inline-flex;align-items:center;gap:10px;margin:14px 0 4px;padding:9px 14px;border-radius:12px;background:rgba(255,255,255,.05);border:1px solid var(--line2);font-weight:700}
.modal-place small{color:var(--faint);font-weight:500}
.modal-place img{width:30px;height:22px;border-radius:4px;object-fit:cover;box-shadow:0 0 0 1px rgba(255,255,255,.2)}
.modal-addr{display:flex;flex-direction:column;align-items:center;gap:2px;margin:12px 0 18px;padding:12px;border-radius:12px;background:rgba(0,0,0,.35);border:1px dashed rgba(139,92,246,.45);cursor:copy;transition:border-color .25s,background .25s}
.modal-addr:hover{border-color:rgba(34,211,238,.7);background:rgba(34,211,238,.06)}
.modal-addr .addr{font-size:1.4rem}
.modal-addr small{font-size:.72rem;color:var(--faint)}
.confetti{position:fixed;top:0;left:0;width:9px;height:14px;z-index:130;pointer-events:none;border-radius:2px;animation:confFall linear forwards}
@keyframes confFall{to{transform:translate(var(--dx,0),105vh) rotate(var(--rot,720deg));opacity:0}}
.welcome{position:fixed;inset:0;z-index:120;display:flex;flex-direction:column;align-items:center;justify-content:center;background:radial-gradient(1000px 700px at 50% 40%,rgba(22,22,52,.94),rgba(3,4,10,.97));backdrop-filter:blur(10px);animation:pageIn .4s,wOut .6s var(--ease-out) 2.3s forwards}
@keyframes wOut{to{opacity:0;visibility:hidden}}
.welcome .lg-mark{width:130px;height:130px;filter:drop-shadow(0 20px 50px rgba(139,92,246,.6));animation:bounce .8s var(--ease-out)}
.w-hi{font-family:var(--mono);font-size:.9rem;letter-spacing:.4em;text-transform:uppercase;color:var(--muted);margin-top:20px;opacity:0;animation:wUp .5s var(--ease-out) .25s forwards}
.w-name{font-size:clamp(2.4rem,6vw,3.6rem);font-weight:900;background:linear-gradient(90deg,#ff004c,#ffb800,#22d3ee,#8b5cf6,#ff004c);background-size:300% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:rgbText 4s linear infinite,wUp .6s var(--ease-out) .4s both}
.w-sub{color:var(--muted);opacity:0;animation:wUp .5s var(--ease-out) .55s forwards}
@keyframes wUp{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
#toasts{position:fixed;right:20px;bottom:20px;z-index:140;display:flex;flex-direction:column;gap:10px}
.toast{position:relative;overflow:hidden;min-width:260px;max-width:380px;padding:14px 16px 16px;border-radius:14px;background:rgba(14,16,34,.95);border:1px solid var(--line2);box-shadow:0 20px 50px -20px rgba(0,0,0,.9);font-size:.9rem;animation:toastIn .45s var(--ease-out);transition:opacity .3s,transform .3s}
.toast::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--green)}
.toast.err::before{background:var(--pink)}
.toast::after{content:"";position:absolute;left:0;bottom:0;height:2px;width:100%;background:var(--grad);transform-origin:0 50%;animation:toastBar 3.6s linear forwards}
@keyframes toastIn{from{opacity:0;transform:translateX(30px)}to{opacity:1;transform:none}}
@keyframes toastBar{to{transform:scaleX(0)}}

/* ---------- footer ---------- */
.foot{position:relative;margin-top:100px;border-top:1px solid var(--line);background:linear-gradient(180deg,rgba(8,9,20,.4),rgba(4,5,12,.9));overflow:hidden}
.foot-glow{position:absolute;left:50%;top:-1px;width:min(900px,90%);height:1px;transform:translateX(-50%);background:linear-gradient(90deg,transparent,#8b5cf6,#22d3ee,transparent);box-shadow:0 0 30px 4px rgba(139,92,246,.5)}
.foot-in{max-width:var(--container);margin:0 auto;padding:54px var(--gutter) 30px;display:grid;grid-template-columns:1.6fr 1fr 1fr 1.2fr;gap:36px}
.foot-brand p{color:var(--muted);font-size:.9rem;margin-top:16px;max-width:340px}
.foot-col{display:flex;flex-direction:column;gap:9px}
.foot-col h4{font-family:var(--mono);font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;color:var(--faint);margin-bottom:6px}
.foot-col a{color:var(--muted);font-size:.9rem;transition:color .2s,transform .2s;width:max-content}
.foot-col a:hover{color:var(--text);transform:translateX(3px)}
.foot-sys div{display:flex;justify-content:space-between;gap:12px;font-size:.86rem;padding:4px 0;border-bottom:1px dashed var(--line)}
.foot-sys span{color:var(--faint)}.foot-sys b{font-family:var(--mono);font-weight:600}
.foot-bar{max-width:var(--container);margin:0 auto;padding:18px var(--gutter) 26px;display:flex;flex-wrap:wrap;gap:10px;align-items:center;justify-content:center;font-size:.8rem;color:var(--faint);border-top:1px solid var(--line)}
.foot-dot{opacity:.4}

/* ---------- responsive ---------- */
@media (max-width:1180px){
  .panel-grid{grid-template-columns:260px minmax(0,1fr)}
  .panel-side{grid-column:1/-1;position:static;display:grid;grid-template-columns:1fr 1fr;gap:18px}
  .dl-grid{grid-template-columns:repeat(3,1fr)}
  .stat-grid,.sys-grid{grid-template-columns:repeat(3,1fr)}
}
@media (max-width:1140px){
  .menu-btn{display:flex;order:3;margin-left:0}
  .topbar-right{margin-left:auto}
  .nav{position:fixed;left:12px;right:12px;top:70px;flex-direction:column;align-items:stretch;gap:2px;padding:12px;border-radius:18px;background:rgba(8,9,20,.97);border:1px solid var(--line2);box-shadow:0 30px 60px -20px rgba(0,0,0,.9);opacity:0;visibility:hidden;transform:translateY(-10px);transition:.3s var(--ease-out)}
  .nav.is-open{opacity:1;visibility:visible;transform:none}
  .nav-a{padding:12px 14px}
  .nav-sep{width:auto;height:1px;margin:6px 0}
  .nav-ind{display:none}
}
@media (max-width:980px){
  .topbar-right .ver-chip{display:none}
  .hero,.proc-grid,.auth-grid,.auth-solo,.howto{grid-template-columns:1fr}
  .hero{min-height:auto;padding-top:20px}
  .hero-art{height:420px;order:-1}
  .doc,.admin{grid-template-columns:1fr}
  .toc,.admin-nav{position:static;flex-direction:row;flex-wrap:wrap}
  .toc-progress,.toc-h{display:none}
  .toc a.is-active::before,.admin-nav a.is-active::before{display:none}
  .panel-grid{grid-template-columns:1fr}
  .panel-rail{position:static}
  .qgrid,.fgrid,.steps3{grid-template-columns:1fr 1fr}
  .clocks{grid-template-columns:repeat(3,1fr)}
  .foot-in{grid-template-columns:1fr 1fr}
  .settings .set-grid{grid-template-columns:1fr}
}
@media (max-width:640px){
  .hero-facts{grid-template-columns:1fr 1fr}
  .qgrid,.fgrid,.fgrid--2,.steps3,.compare,.dl-grid,.dl-grid--srv{grid-template-columns:1fr}
  .panel-side{grid-template-columns:1fr}
  .stat-grid,.sys-grid{grid-template-columns:1fr 1fr}
  .clocks{grid-template-columns:repeat(2,1fr)}
  .foot-in{grid-template-columns:1fr}
  .flow-track{height:300px}
  .flow-node{width:96px}.flow-node small{display:none}
  .flow-line--a{left:80px}.flow-line--b{right:80px}
  .pkt{width:190px;top:120px}
  .win-body{height:390px}
  .pl{padding:18px}
  .term{font-size:.68rem}
  .fwd{grid-template-columns:auto 1fr auto}
  .fwd .pill{display:none}
  .ts-mock-body{grid-template-columns:1fr}
  .ts-tree{border-right:0;border-bottom:1px solid var(--line)}
  .hero-float--b{display:none}
  .topbar-right .btn{display:none}
}

/* ---------- reduced motion ---------- */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}
  .js [data-reveal]{opacity:1;transform:none;filter:none}
}

/* ==========================================================================
   v4.1 — legal pages, cookie consent, free badge, UDP-only, account zone
   ========================================================================== */
.logo-word span{letter-spacing:.28em}
.free-badge{display:inline-flex;align-items:center;gap:8px;margin-top:14px;font-size:.78rem;font-weight:700;color:var(--green);padding:6px 12px;border-radius:999px;background:rgba(52,211,153,.08);border:1px solid rgba(52,211,153,.28)}
.free-badge i{width:7px;height:7px;border-radius:50%;background:var(--green);box-shadow:0 0 8px var(--green)}
.foot-link{all:unset;cursor:pointer;color:var(--muted);font-size:.9rem;transition:color .2s,transform .2s;width:max-content}
.foot-link:hover{color:var(--text);transform:translateX(3px)}
.foot-link:focus-visible{outline:2px solid var(--cyan);outline-offset:3px;border-radius:4px}
.foot-in{grid-template-columns:1.5fr 1fr 1fr 1.1fr 1.1fr}

/* cookie consent bar */
.consent{position:fixed;left:50%;bottom:18px;z-index:150;width:min(920px,calc(100% - 24px));transform:translateX(-50%);display:flex;align-items:center;gap:16px;padding:16px 18px;border-radius:18px;background:rgba(10,11,26,.96);border:1px solid var(--line2);box-shadow:0 30px 70px -20px rgba(0,0,0,.9),0 0 0 1px rgba(139,92,246,.18);backdrop-filter:blur(16px);animation:consentIn .6s var(--ease-out)}
.consent[hidden]{display:none}
.consent.is-out{animation:consentOut .4s var(--ease) forwards}
@keyframes consentIn{from{opacity:0;transform:translate(-50%,30px)}to{opacity:1;transform:translate(-50%,0)}}
@keyframes consentOut{to{opacity:0;transform:translate(-50%,30px)}}
.consent-ico{font-size:1.8rem;flex:none;animation:floaty 4s ease-in-out infinite}
.consent-txt{flex:1;min-width:0}
.consent-txt b{display:block;font-size:.95rem;margin-bottom:2px}
.consent-txt p{margin:0;font-size:.84rem;color:var(--muted)}
.consent-act{display:flex;gap:8px;flex:none}
@media (max-width:720px){.consent{flex-direction:column;align-items:stretch;text-align:left}.consent-ico{display:none}.consent-act{justify-content:flex-end}}

/* legal pages */
.legal-date{font-family:var(--mono);font-size:.78rem;color:var(--faint);margin-top:10px}
.legal .doc-sec>p{font-size:.98rem}
.ltable{border:1px solid var(--line);border-radius:16px;overflow:hidden;margin:16px 0}
.lrow{display:grid;grid-template-columns:200px 1fr;gap:16px;padding:13px 16px;border-top:1px solid var(--line);font-size:.9rem}
.lrow:first-child{border-top:0}
.lrow>span:first-child{font-weight:700}
.lrow>span:not(:first-child){color:#c7cbe6}
.lrow--h{background:rgba(255,255,255,.03);font-family:var(--mono);font-size:.68rem;letter-spacing:.1em;text-transform:uppercase}
.lrow--h>span{color:var(--faint)!important;font-weight:600!important}
.ltable--4 .lrow{grid-template-columns:140px 120px 1fr 150px}
.lbul{margin:12px 0 16px;padding-left:0;list-style:none;display:flex;flex-direction:column;gap:9px}
.lbul li{position:relative;padding-left:24px;color:#c7cbe6;font-size:.95rem}
.lbul li::before{content:"";position:absolute;left:4px;top:.6em;width:8px;height:8px;border-radius:2px;background:var(--grad);transform:rotate(45deg)}
.lbul--abc{counter-reset:abc}
.lbul--abc li{counter-increment:abc;padding-left:32px}
.lbul--abc li::before{content:counter(abc,lower-alpha) ")";width:auto;height:auto;background:none;transform:none;top:0;left:0;font-family:var(--mono);font-weight:800;font-size:.85rem;color:var(--cyan)}
.tag{display:inline-block;font-size:.7rem;font-weight:800;padding:3px 8px;border-radius:7px}
.tag--need{color:var(--green);background:rgba(52,211,153,.12)}
.tag--func{color:#c4b5fd;background:rgba(139,92,246,.16)}
.consent-now{display:flex;flex-wrap:wrap;align-items:center;gap:10px;padding:16px;border-radius:14px;border:1px solid var(--line);background:rgba(255,255,255,.025);margin:12px 0 16px}
.consent-now b{margin-right:auto;color:var(--cyan)}
@media (max-width:760px){.lrow,.ltable--4 .lrow{grid-template-columns:1fr;gap:4px}.lrow--h{display:none}}

/* register: KVKK checkbox */
.check{display:flex;align-items:flex-start;gap:11px;margin:4px 0 18px;font-size:.86rem;color:var(--muted);cursor:pointer;line-height:1.45}
.check input{position:absolute;opacity:0;width:0;height:0}
.check-box{flex:none;width:20px;height:20px;margin-top:1px;border-radius:6px;border:1.5px solid var(--line2);background:rgba(5,6,16,.65);display:grid;place-items:center;transition:.2s}
.check-box::after{content:"";width:9px;height:5px;border-left:2px solid #05060d;border-bottom:2px solid #05060d;transform:rotate(-45deg) scale(0);margin-top:-2px;transition:transform .25s var(--ease-out)}
.check input:checked+.check-box{background:var(--grad);border-color:transparent}
.check input:checked+.check-box::after{transform:rotate(-45deg) scale(1)}
.check input:focus-visible+.check-box{box-shadow:0 0 0 3px rgba(34,211,238,.35)}

/* panel: fixed UDP chip, danger zone */
.proto-fixed{display:flex;align-items:center;gap:9px;height:47px;padding:0 16px;border-radius:12px;border:1px solid rgba(52,211,153,.35);background:rgba(52,211,153,.06);font-family:var(--mono);font-weight:800;color:var(--green);cursor:help}
.proto-fixed i{width:8px;height:8px;border-radius:50%;background:var(--green);box-shadow:0 0 8px var(--green);animation:live 2s infinite}
.danger-zone{margin-top:10px;border-radius:12px;border:1px solid rgba(244,63,94,.25);background:rgba(244,63,94,.04)}
.danger-zone summary{cursor:pointer;list-style:none;padding:10px 12px;font-size:.84rem;font-weight:700;color:#fb7185}
.danger-zone summary::-webkit-details-marker{display:none}
.danger-zone form{padding:0 12px 12px}

/* censored commands */
.t-x,.c-x{color:#64748b;letter-spacing:.02em;filter:blur(.4px)}
.t-mut{color:var(--faint);font-style:italic}
.code-note{font-size:.82rem;color:var(--faint);margin-top:8px}
@media (max-width:1180px){.foot-in{grid-template-columns:1fr 1fr 1fr}}@media (max-width:980px){.foot-in{grid-template-columns:1fr 1fr}}
@media (max-width:640px){.foot-in{grid-template-columns:1fr}}

/* ==========================================================================
   v4.2 — responsive hardening (phone / tablet / desktop)
   ========================================================================== */
:root{--topbar-h:64px}
html,body{overflow-x:hidden}
@supports (overflow:clip){html,body{overflow-x:clip}}
img,svg,video,canvas{max-width:100%}

/* maps stay crisp: no blur / tilt on reveal, no rasterising layer */
.js .geo-stage[data-reveal],.js .geo-stage[data-reveal].is-in{transform:none;filter:none}
.geo-layer{will-change:auto}
.geo--admin .geo-dots{background:linear-gradient(180deg,rgba(190,200,255,.5),rgba(140,150,220,.38))}
.geo-stage--admin{margin-top:6px}

/* member panel side columns scroll with the page (tall columns were cut off) */
.panel-rail,.panel-side{position:static}

/* admin header actions */
.admin-head-act{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.admin-head-act form{margin:0}
.set-h{font-family:var(--mono);font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--cyan);margin:0 0 14px}
.settings + .settings{margin-top:18px}

/* lists and cards never overflow narrow screens */
.node-cards{grid-template-columns:repeat(auto-fill,minmax(min(320px,100%),1fr))}
.locs{grid-template-columns:repeat(auto-fill,minmax(min(170px,100%),1fr))}
.fwd-main .addr{word-break:break-all}
.card{min-width:0}
.panel-main,.admin-body,.doc-body{min-width:0}

/* tablet & phone: section menus become a sticky, swipeable tab strip */
@media (max-width:980px){
  html{scroll-padding-top:136px}
  .toc,.admin-nav{position:sticky;top:var(--topbar-h);z-index:40;display:flex;flex-direction:row;flex-wrap:nowrap;align-items:center;gap:4px;
    overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:none;padding:8px var(--gutter);margin:0 calc(var(--gutter) * -1) 20px;
    border-radius:0;border-left:0;border-right:0;background:rgba(6,7,16,.94);backdrop-filter:blur(14px);box-shadow:0 12px 30px -18px rgba(0,0,0,.9)}
  .toc::-webkit-scrollbar,.admin-nav::-webkit-scrollbar{display:none}
  .toc a,.admin-nav a{flex:none;white-space:nowrap;padding:8px 12px;font-size:.84rem}
  .toc-h,.toc-progress,.admin-nav .toc-progress{display:none}
  .topbar{background:rgba(6,7,16,.9);backdrop-filter:blur(16px);border-color:var(--line)}
  .admin,.doc{gap:0}
  .head-tools{width:100%}
  .head-tools .search{max-width:none;flex:1}
  .stat-grid,.sys-grid{grid-template-columns:repeat(3,1fr)}
}
@media (max-width:700px){
  .geo-stage{overflow-x:auto;overflow-y:hidden;padding:40px 0 8px;-webkit-overflow-scrolling:touch;scrollbar-width:thin}
  .geo--tr{min-width:640px}
  .geo--world{min-width:720px}
  .geo-stage::after{content:"⟷";position:sticky;left:50%;display:block;width:max-content;margin:6px auto 0;font-size:.8rem;color:var(--faint)}
}
@media (max-width:640px){
  :root{--topbar-h:62px}
  .card{padding:18px}
  .widget{padding:16px}
  .stat-grid,.sys-grid{grid-template-columns:repeat(2,1fr)}
  .stat{padding:14px}.stat-n{font-size:1.7rem}
  .flow{padding:16px}
  .panel-head{padding:22px 0 14px}
  .panel-meter{width:100%;justify-content:space-between}
  .admin-head-act{width:100%;justify-content:space-between}
  .sec-head{margin-bottom:28px}
  .hero-title{font-size:clamp(2.2rem,10vw,3rem)}
  .hero-art{height:340px}
  .logo--hero .lg-mark{width:120px;height:120px}
  .logo--hero .logo-word b{font-size:2rem}
  .page-head{padding:34px 0 12px}
  .auth-solo{padding:20px 0;min-height:auto}
  .auth-solo-art{display:none}
  .modal-body{padding:24px 18px}
  .consent{bottom:10px;padding:14px}
  .consent-act .btn{flex:1}
  table th,table td{padding:10px 8px}
  .nc-actions .btn{flex:1 1 auto}
  .kv li{font-size:.84rem}
}
@media (max-width:380px){
  .logo--nav .logo-tag{display:none}
  .stat-grid,.sys-grid{grid-template-columns:1fr 1fr}
  .locs{grid-template-columns:1fr}
}.geo-stage{scrollbar-color:rgba(139,92,246,.55) transparent}
.geo-stage::-webkit-scrollbar{height:6px}
.geo-stage::-webkit-scrollbar-track{background:transparent}
.geo-stage::-webkit-scrollbar-thumb{background:rgba(139,92,246,.55);border-radius:6px}@media (max-width:640px){.hero-float{font-size:.74rem;padding:7px 10px}.hero-float--a{top:4%;left:0}.hero-float--c{top:auto;bottom:4%;right:0}}
@media (max-width:700px){.geo-stage>.cap{position:sticky;left:0;width:100%;max-width:calc(100vw - 2 * var(--gutter))}.geo-stage::after{left:0;margin:6px 0 0;width:calc(100vw - 2 * var(--gutter));text-align:center}}