/* نویان ابر نیوار — طراحی بر پایهٔ قالب Earth Limb Landing، راست‌به‌چپ و تیره */

@font-face{font-family:"Vazirmatn";font-style:normal;font-weight:100 900;font-display:swap;src:url(/assets/vazirmatn-arabic.84a382e46c30.woff2) format("woff2");unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC}
@font-face{font-family:"Vazirmatn";font-style:normal;font-weight:100 900;font-display:swap;src:url(/assets/vazirmatn-latin.d29c041cd429.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-200B,U+200F-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

:root{
  --space:#04060a;--navy:#061429;--bg:#05070b;--sheet:#0b1017;--ink:#e8edf4;--soft:#c4ccd8;--muted:#97a2b2;
  --rule:rgba(232,237,244,.12);--rule2:rgba(232,237,244,.3);--faint:rgba(232,237,244,.045);
  --face2:#131a24;--face3:#192230;--panel:#1b2944;--mapbg:#08101b;--err:#ff8f80;
  --accent:#ffa23a;--accent-ink:#ffa23a;--on-accent:#120c03;
  --gut:clamp(16px,4vw,48px);--headh:99px;
  --sans:"Vazirmatn",Tahoma,"Segoe UI",Arial,sans-serif;
  --mono:ui-monospace,"SF Mono","JetBrains Mono",Menlo,Consolas,"Liberation Mono","Vazirmatn",monospace;
  --ease:cubic-bezier(.23,1,.32,1);
  color-scheme:dark
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:calc(var(--headh) + 8px)}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--sans);font-size:16px;line-height:1.75;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:clip}
h1,h2,h3,p,ul,ol,dl,dd,figure{margin:0;padding:0}
ul,ol{list-style:none}
a{color:inherit;text-decoration:none}
img,svg,canvas{max-width:100%}
button,input,select,textarea{font:inherit;color:inherit;letter-spacing:inherit}
button{background:none;border:0;padding:0;cursor:pointer}
::selection{background:var(--accent);color:var(--on-accent)}
:where(a,button,input,select,textarea,summary,[tabindex]):focus-visible{outline:2px solid var(--accent);outline-offset:3px}
[hidden]{display:none!important}

.wrap{width:100%;max-width:1400px;margin:0 auto;padding-inline:var(--gut)}
.mono{font-family:var(--mono);font-variant-numeric:tabular-nums;letter-spacing:0}
.ltr{direction:ltr;unicode-bidi:isolate}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;right:12px;top:-60px;z-index:60;background:var(--accent);color:var(--on-accent);padding:10px 14px;font-weight:700}
.skip:focus{top:12px}
main:focus{outline:none}
.label{font-size:13px;line-height:1.3;font-weight:750;color:var(--accent-ink)}
.meta{font-size:13.5px;color:var(--muted);margin-top:6px}
.h2{font-size:clamp(1.9rem,1.2rem + 2.2vw,3.2rem);line-height:1.22;font-weight:720;text-wrap:balance}
.body{font-size:17px;line-height:1.85;color:var(--soft);max-width:56ch}
.arrow{flex:none;transition:transform .3s var(--ease)}

/* ---------- سرصفحه ---------- */
.head{position:sticky;top:0;z-index:40;color:#e9eef5;transition:background-color .3s var(--ease),border-color .3s;border-bottom:1px solid transparent}
.head[data-solid]{background:rgba(4,6,10,.88);border-bottom-color:rgba(255,255,255,.08);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}
.util{height:34px;display:flex;align-items:center;justify-content:space-between;gap:20px;font-size:12.5px;border-bottom:1px solid rgba(255,255,255,.08)}
.util nav{display:flex;gap:22px}
.util a,.util span{color:rgba(233,238,245,.7);transition:color .2s}
.util a:hover{color:#fff}
.bar{height:64px;display:flex;align-items:center;gap:28px}
.brand{display:inline-flex;align-items:center;gap:11px;margin-inline-end:auto}
.brand b{display:block;font-size:18px;font-weight:780;line-height:1.1}
.brand small{display:block;font-size:12px;color:rgba(233,238,245,.62);margin-top:3px;line-height:1.1}
.mark{flex:none;display:block;width:34px;height:34px}
.mainnav{display:flex;gap:28px;font-size:15px}
.mainnav a{position:relative;padding:8px 0;color:rgba(233,238,245,.86);transition:color .2s}
.mainnav a span{background:linear-gradient(var(--accent),var(--accent)) 100% 100%/0 1.5px no-repeat;padding-bottom:4px;transition:background-size .3s var(--ease)}
.mainnav a:hover{color:#fff}
.mainnav a:hover span{background-size:100% 1.5px}
.menubtn{display:none;width:44px;height:44px;align-items:center;justify-content:center;color:#fff}
.burger{position:relative;width:20px;height:1.6px;background:currentColor;transition:background .2s}
.burger::before,.burger::after{content:"";position:absolute;right:0;width:20px;height:1.6px;background:currentColor;transition:transform .25s var(--ease)}
.burger::before{transform:translateY(-6px)}
.burger::after{transform:translateY(6px)}
[aria-expanded="true"] .burger{background:transparent}
[aria-expanded="true"] .burger::before{transform:rotate(45deg)}
[aria-expanded="true"] .burger::after{transform:rotate(-45deg)}
.sheet{position:fixed;inset:var(--headh) 0 0 0;z-index:39;color:#eef2f7;background:#04060a;overflow-y:auto;animation:in .28s var(--ease)}
.sheetnav{display:flex;flex-direction:column;align-items:flex-start;gap:6px;padding-top:28px;padding-bottom:40px}
.sheetnav>a:not(.btn){font-size:28px;font-weight:700;padding:6px 0;color:#eef2f7}
.sheetnav>.btn{margin-top:18px}
.sheetutil{display:flex;flex-wrap:wrap;gap:12px 22px;margin-top:34px;font-size:15px;color:rgba(233,238,245,.7)}
.sheetutil a{padding:6px 0}

/* ---------- دکمه‌ها ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:12px;height:50px;padding:0 24px;border-radius:2px;font-size:15px;font-weight:720;white-space:nowrap;transition:transform .16s var(--ease),background-color .2s,color .2s,box-shadow .2s;position:relative}
.btn:active,.tabs button:active,.railbtns button:active,.more:active,.pillars a:active{transform:scale(.97)}
.btn:hover .arrow,.link:hover .arrow{transform:translateX(-5px)}
.solid{background:var(--accent);color:var(--on-accent)}
.solid:hover{background:#fff}
.ghost{color:#fff;box-shadow:inset 0 0 0 1px rgba(255,255,255,.45)}
.ghost:hover{background:#fff;color:#05070b;box-shadow:inset 0 0 0 1px #fff}
.line{color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}
.line:hover{background:var(--ink);color:var(--sheet)}
.btn:disabled{opacity:.55;cursor:not-allowed}
.btn:disabled:hover{background:var(--accent)}
.headcta{height:40px;padding:0 18px;font-size:14px}
.link{display:inline-flex;align-items:center;gap:10px;font-weight:720;color:var(--ink);margin-top:18px}
.link span{background:linear-gradient(currentColor,currentColor) 0 100%/100% 1px no-repeat;padding-bottom:3px}
.link:hover{color:var(--accent-ink)}

/* ---------- قهرمان (کرهٔ زمین) ---------- */
.hero{position:relative;margin-top:calc(-1 * var(--headh));min-height:clamp(660px,100svh,1100px);background:var(--space);color:#eef2f7;display:flex;flex-direction:column;justify-content:flex-end;isolation:isolate;overflow:hidden}
.sky{position:absolute;inset:0;z-index:0;background:radial-gradient(circle at 34% 178%,#0f2c50 0,#0b2342 61%,#5d97f4 61.4%,rgba(93,151,244,.22) 62.2%,transparent 64%)}
.sky[data-painted]{background:none}
.sky-canvas{position:absolute;left:0;top:0;display:block;max-width:none;opacity:0;transition:opacity 1.2s ease}
.sky[data-painted] .sky-canvas{opacity:1}
.orbit{position:absolute;left:0;top:0;z-index:1;overflow:visible;pointer-events:none;max-width:none}
.track{fill:none;stroke:var(--accent);stroke-width:1.2;stroke-dasharray:2 7;stroke-linecap:round;opacity:.9}
.nadir{stroke:var(--accent);stroke-width:1;opacity:.7}
.sat{position:absolute;left:0;top:0;z-index:2;will-change:transform;visibility:hidden;pointer-events:none}
.satdot{position:absolute;left:-4.5px;top:-4.5px;width:9px;height:9px;background:var(--accent);transform:rotate(45deg);box-shadow:0 0 0 4px rgba(4,6,10,.45)}
.sat::after{content:"";position:absolute;left:-10px;top:-10px;width:20px;height:20px;border-radius:50%;border:1px solid var(--accent);animation:ping 2.8s var(--ease) infinite}
.satname{position:absolute;left:14px;top:-32px;direction:ltr;font:500 11px/1 var(--mono);letter-spacing:.04em;color:#fff;background:rgba(4,6,10,.62);padding:6px 8px;white-space:nowrap}
.satname em{font-style:normal;color:rgba(255,255,255,.7);margin-left:8px}
.sat[data-flip] .satname{left:auto;right:14px}
.sat[data-quiet]{opacity:.35}
.sat[data-quiet] .satname{display:none}
.scrim{position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(180deg,rgba(4,6,10,0) 38%,rgba(4,6,10,.5) 70%,rgba(4,6,10,.84) 100%),linear-gradient(270deg,rgba(4,6,10,.6),rgba(4,6,10,0) 62%)}
@media (max-width:1100px){.scrim{background:linear-gradient(180deg,rgba(4,6,10,.35) 0,rgba(4,6,10,.5) 45%,rgba(4,6,10,.62) 70%,rgba(4,6,10,.84) 100%),linear-gradient(270deg,rgba(4,6,10,.6),rgba(4,6,10,0) 62%)}}
.herocopy{position:relative;z-index:3;padding-top:calc(var(--headh) + 18vh);padding-bottom:clamp(30px,5.5vh,64px)}
.kicker{color:var(--accent);font-size:14px;font-weight:750;margin-bottom:16px;width:fit-content}
.hero h1{font-size:clamp(2.3rem,1rem + 3.3vw,4.3rem);line-height:1.22;font-weight:760;max-width:17ch;text-wrap:balance}
.lede{font-size:clamp(1.02rem,.94rem + .32vw,1.2rem);line-height:1.9;color:rgba(233,238,245,.82);max-width:48ch;margin-top:22px}
.ctas{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}
.heronote{font-size:13px;color:rgba(233,238,245,.6);margin-top:18px;width:fit-content}
.herocopy>*{animation:rise .9s var(--ease) both}
.herocopy>:nth-child(2){animation-delay:.06s}
.herocopy>:nth-child(3){animation-delay:.12s}
.herocopy>:nth-child(4){animation-delay:.18s}
.herocopy>:nth-child(5){animation-delay:.24s}
.pillars{position:relative;z-index:3;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));border-top:1px solid rgba(255,255,255,.12);background:rgba(8,12,18,.5);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.pillars li+li a{box-shadow:inset -1px 0 0 rgba(255,255,255,.1)}
.pillars a{position:relative;display:grid;align-content:start;gap:4px;width:100%;height:100%;min-height:108px;padding:20px clamp(16px,2vw,28px) 22px;color:#eef2f7;transition:background-color .25s}
.pillars b{font-size:13px;font-weight:750;color:var(--accent)}
.pillars span{font-size:15px;line-height:1.6;color:rgba(238,242,247,.86);max-width:26ch}
.pillars .arrow{position:absolute;left:18px;top:22px;opacity:0;transform:translateX(6px);transition:opacity .25s,transform .3s var(--ease)}
.pillars a:hover{background:rgba(255,255,255,.06)}
.pillars a:hover .arrow,.pillars a:focus-visible .arrow{opacity:1;transform:none}
.pillars a:focus-visible{outline-offset:-3px}

/* ---------- آمار ---------- */
.live{background:var(--sheet);border-bottom:1px solid var(--rule)}
.livegrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}
.cell{padding:36px 28px 40px;box-shadow:inset -1px 0 0 var(--rule)}
.cell:first-child{box-shadow:none;padding-inline-start:0}
.sub{font-size:15px;color:var(--muted);margin-top:8px}
.big{font-size:clamp(2rem,1.3rem + 1.8vw,3.1rem);font-weight:720;line-height:1.15;margin-top:12px;font-variant-numeric:tabular-nums;white-space:nowrap}

/* ---------- روش‌های دریافت کد ---------- */
.methods{padding:clamp(72px,9vw,130px) 0 clamp(48px,6vw,80px)}
.methodshead{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:20px clamp(32px,6vw,100px);align-items:end;margin-bottom:40px}
.methodshead .h2{margin-top:14px}
.methodgrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));box-shadow:inset 0 1px 0 var(--rule),inset 0 -1px 0 var(--rule)}
.method{padding:26px 26px 30px;box-shadow:inset -1px 0 0 var(--rule)}
.method:first-child{box-shadow:none;padding-inline-start:0}
.mnum{display:block;font-size:12px;color:var(--accent-ink)}
.micon{display:block;width:44px;height:44px;margin:18px 0 16px}
.micon .s{fill:none;stroke:var(--ink);stroke-width:1.6;stroke-linejoin:round;stroke-linecap:round}
.micon .ac-f{fill:var(--accent)}
.micon .ac-s{fill:none;stroke:var(--accent);stroke-width:1.6;stroke-linejoin:round}
.method h3{font-size:19px;font-weight:720;line-height:1.5}
.method p{font-size:15px;line-height:1.85;color:var(--soft);margin-top:6px}
.methodnote{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 18px;margin-top:22px;font-size:14px;color:var(--muted)}
.methodnote .link{margin-top:0;font-size:15px}

/* ---------- معرفی ---------- */
.intro{padding:clamp(72px,10vw,150px) 0}
.introgrid{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(0,1fr);gap:clamp(32px,6vw,110px);align-items:start}
.statewrap{display:grid;gap:clamp(36px,5vw,72px)}
.statement{font-size:clamp(1.45rem,1rem + 1.45vw,2.35rem);line-height:1.6;font-weight:560;text-wrap:pretty;max-width:34ch}
.rhythm{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;max-width:720px}
.rhythm>div{box-shadow:inset 0 1px 0 var(--rule2);padding-top:14px}
.rhythm dt{font-size:13px;color:var(--muted)}
.rhythm dd{font-size:clamp(1.1rem,.95rem + .5vw,1.4rem);font-weight:700;margin-top:4px}
.card{background:var(--sheet);box-shadow:inset 0 0 0 1px var(--rule);padding:0 0 26px}
.cardimg{overflow:hidden;margin-bottom:22px;position:relative}
.card>*:not(.cardimg){margin-inline:24px}
.card h3{font-size:21px;font-weight:720;margin-top:8px}
.card p:not(.label){font-size:15px;color:var(--soft);margin-top:8px}
.tile{display:block;width:100%;max-width:none;height:auto;aspect-ratio:var(--ar,16/10);object-fit:cover;background:#1a1f26}
.tag{position:absolute;right:12px;bottom:12px;font-size:11px;color:#fff;background:rgba(6,20,41,.66);padding:4px 7px;direction:ltr}

/* ---------- نمای راهکار (تب‌ها و مقایسه) ---------- */
.uses{padding:0 0 clamp(80px,10vw,140px);scroll-margin-top:22px}
.useshead{display:flex;flex-direction:column;gap:26px;margin-bottom:34px}
.tabs{display:flex;gap:4px 16px;margin-inline-start:-8px;box-shadow:inset 0 -1px 0 var(--rule);overflow-x:auto;scrollbar-width:none}
.tabs::-webkit-scrollbar{display:none}
.tabs button{position:relative;flex:none;white-space:nowrap;padding:12px 8px 14px;font-size:15.5px;font-weight:650;color:var(--muted);transition:color .2s}
.tabs button::after{content:"";position:absolute;inset-inline:8px;bottom:0;height:2px;background:var(--accent);transform:scaleX(0);transform-origin:right;transition:transform .25s var(--ease)}
.tabs button:hover,.tabs button[aria-selected="true"]{color:var(--ink)}
.tabs button:focus-visible{outline-offset:-2px}
.tabs button[aria-selected="true"]::after{transform:none}
.panel+.panel{margin-top:72px}
.js .panel+.panel{margin-top:0}
.usegrid{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);gap:clamp(28px,4.5vw,72px);align-items:center}
.compare{min-width:0}
.cbox{--pos:50%;position:relative;overflow:hidden;aspect-ratio:2/1;background:#0e131a;touch-action:pan-y;user-select:none;-webkit-user-select:none;container-type:inline-size}
.js .cbox{cursor:ew-resize}
.scene{position:absolute;inset:0;display:grid;place-items:center;padding:4cqw;font-size:clamp(6px,1.75cqw,14px);line-height:1.5;background-color:#0d1219;background-image:linear-gradient(var(--faint) 1px,transparent 1px),linear-gradient(90deg,var(--faint) 1px,transparent 1px);background-size:5cqw 5cqw}
.scene.after{background-color:#0b1424}
.scene.before{clip-path:inset(0 0 0 var(--pos))}
.cline{position:absolute;top:0;bottom:0;left:var(--pos);width:1.5px;margin-left:-.75px;background:#fff;pointer-events:none}
.handle{position:absolute;top:50%;left:clamp(23px,var(--pos),calc(100% - 23px));width:46px;height:46px;margin:-23px 0 0 -23px;border-radius:50%;background:var(--accent);color:var(--on-accent);display:grid;place-items:center;cursor:grab;box-shadow:0 8px 22px rgba(0,0,0,.28);transition:transform .16s var(--ease)}
.handle:active{cursor:grabbing;transform:scale(.94)}
.brk{position:absolute;width:20px;height:20px;pointer-events:none;border:0 solid rgba(255,255,255,.9)}
.brk-tl{left:12px;top:12px;border-top-width:1.5px;border-left-width:1.5px}
.brk-br{right:12px;bottom:12px;border-bottom-width:1.5px;border-right-width:1.5px}
.ccap{display:grid;grid-template-columns:auto 1fr auto;gap:16px;align-items:center;padding-top:14px;font-size:13.5px;font-weight:700}
.ccap i{font-style:normal;color:var(--accent-ink);font-size:11px}
.cplace{text-align:center;font-size:12px;font-weight:400;color:var(--muted)}
.usecopy{animation:rise .5s var(--ease) both}
.usecopy h3{font-size:clamp(1.5rem,1.05rem + 1.3vw,2.25rem);line-height:1.35;font-weight:720;text-wrap:balance}
.usecopy p{font-size:17px;line-height:1.85;color:var(--soft);margin-top:18px;max-width:48ch}
.facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin:28px 0 30px;box-shadow:inset 0 1px 0 var(--rule);padding-top:18px}
.facts dt,.specs dt{font-size:12.5px;color:var(--muted)}
.facts dd{font-size:15.5px;font-weight:720;margin-top:4px}

/* اجزای نمای مفهومی داخل مقایسه */
.m-win{width:58%;background:#141b26;box-shadow:0 0 0 1px var(--rule2),0 2em 4em rgba(0,0,0,.35)}
.m-bar{display:flex;align-items:center;gap:.5em;padding:.7em 1em;border-bottom:1px solid var(--rule);color:var(--muted)}
.m-bar i{width:.7em;height:.7em;border-radius:50%;background:var(--rule2)}
.m-bar span{order:-1;margin-inline-end:auto}
.m-rows{display:grid}
.m-rows>div{display:grid;grid-template-columns:6em 1fr;gap:1em;align-items:center;padding:.7em 1.2em;border-bottom:1px solid var(--rule)}
.m-rows dt{color:var(--muted)}
.m-rows dd{font-family:var(--mono);direction:ltr;text-align:right;color:var(--soft)}
.m-rows mark{background:none;color:var(--accent);box-shadow:inset 0 0 0 1.5px var(--accent);padding:.05em .3em}
.m-lines{display:grid;gap:.6em;padding:1em 1.2em 1.3em}
.m-lines i{display:block;height:.55em;background:var(--rule);border-radius:1px}
.m-lines i:nth-child(1){width:92%}.m-lines i:nth-child(2){width:74%}.m-lines i:nth-child(3){width:56%}
.m-phone{height:41cqw;aspect-ratio:9/17;background:#0a0f17;border-radius:1.6em;box-shadow:0 0 0 .35em #1c2533,0 0 0 calc(.35em + 1px) var(--rule2),0 2em 4em rgba(0,0,0,.4);padding:2.2em 1em 1em;display:flex;flex-direction:column;gap:.6em;position:relative}
.m-phone::before{content:"";position:absolute;top:.7em;left:50%;width:30%;height:.5em;margin-left:-15%;border-radius:1em;background:#1c2533}
.m-from{font-size:.85em;color:var(--muted);text-align:center;padding-bottom:.5em;border-bottom:1px solid var(--rule)}
.m-chathead{display:flex;align-items:center;gap:.5em;font-size:.9em;padding-bottom:.5em;border-bottom:1px solid var(--rule)}
.m-chathead i{width:1.7em;height:1.7em;border-radius:50%;background:var(--face3);box-shadow:inset 0 0 0 1px var(--rule2)}
.m-bubble{align-self:flex-start;max-width:92%;background:#1d2a3f;padding:.6em .8em;border-radius:.9em .9em .2em .9em;color:var(--ink)}
.m-bubble b{display:block;font-family:var(--mono);font-size:1.3em;letter-spacing:.06em;color:var(--accent);direction:ltr;text-align:right}
.m-time{font-size:.8em;color:var(--muted);direction:ltr;text-align:left}
.m-list{width:80%;display:grid;background:#141b26;box-shadow:0 0 0 1px var(--rule2)}
.m-list>div{display:grid;grid-template-columns:2.2em minmax(0,1fr) auto auto;gap:1em;align-items:center;padding:.75em 1.1em;border-bottom:1px solid var(--rule)}
.m-list>div:last-child{border-bottom:0}
.m-av{width:2.2em;height:2.2em;border-radius:50%;background:var(--face3);box-shadow:inset 0 0 0 1px var(--rule2)}
.m-who b{display:block;font-weight:700}
.m-who span{display:block;font-family:var(--mono);direction:ltr;text-align:right;color:var(--muted);font-size:.9em}
.m-who span.fa{font-family:inherit;direction:rtl}
.m-val{font-family:var(--mono);direction:ltr;color:var(--soft)}
.chip{display:inline-flex;align-items:center;gap:.4em;padding:.25em .7em;font-size:.85em;font-weight:700;white-space:nowrap;box-shadow:inset 0 0 0 1px var(--rule2);color:var(--muted)}
.chip::before{content:"";width:.5em;height:.5em;border-radius:50%;background:currentColor}
.chip.ok{color:var(--accent);box-shadow:inset 0 0 0 1px rgba(255,162,58,.5)}
.chip.bad{color:var(--err);box-shadow:inset 0 0 0 1px rgba(255,143,128,.45)}
.chip.info{color:#9fc3ff;box-shadow:inset 0 0 0 1px rgba(159,195,255,.45)}
.m-login{width:40%;background:#141b26;box-shadow:0 0 0 1px var(--rule2),0 2em 4em rgba(0,0,0,.35);padding:1.6em;display:grid;gap:.9em}
.m-login h4{margin:0;font-size:1.25em;font-weight:720}
.m-field{display:grid;gap:.3em;font-size:.9em;color:var(--muted)}
.m-field i{display:block;height:2.4em;background:#0d1219;box-shadow:inset 0 0 0 1px var(--rule2);font-style:normal;color:var(--soft);font-family:var(--mono);direction:ltr;text-align:right;padding:.55em .8em;font-size:1.1em}
.m-btn{height:2.6em;display:grid;place-items:center;background:var(--accent);color:var(--on-accent);font-weight:750}
.m-code{display:grid;grid-template-columns:repeat(6,1fr);gap:.4em;direction:ltr}
.m-code i{height:2.6em;display:grid;place-items:center;background:#0d1219;box-shadow:inset 0 0 0 1px var(--rule2);font-style:normal;font-family:var(--mono);font-size:1.2em;color:var(--ink)}
.m-code i.on{box-shadow:inset 0 0 0 1.5px var(--accent)}
.m-note{font-size:.85em;color:var(--muted)}
.m-badge{justify-self:start}
.scene.before>.m-win,.scene.before>.m-login{justify-self:start;margin-inline-start:2cqw}
.scene.after>.m-phone,.scene.after>.m-login{justify-self:end;margin-inline-end:6cqw}
.scene.before>.m-phone{justify-self:start;margin-inline-start:12cqw}
.scene.after>.m-phone{margin-inline-end:12cqw}

/* ---------- نوار ابر ---------- */
.band{position:relative;overflow:hidden;background:linear-gradient(180deg,#0c1420,#1b2a3d 45%,#0c1420)}
.band .tile{width:max(100%,1000px);aspect-ratio:auto;height:clamp(140px,16vw,240px);background:transparent}
.band::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,var(--bg) 0,rgba(0,0,0,0) 28%,rgba(0,0,0,0) 72%,var(--sheet) 100%)}
.foot .band::after{background:linear-gradient(180deg,var(--sheet) 0,rgba(6,20,41,0) 24%,rgba(6,20,41,0) 32%,var(--navy) 100%)}
.bandtag{position:absolute;right:var(--gut);bottom:16px;z-index:1;font-size:11px;color:#fff;background:rgba(6,20,41,.6);padding:4px 7px;direction:ltr}
.foot .bandtag{bottom:auto;top:14px}

/* ---------- معماری درگاه ---------- */
.fleet{background:var(--sheet);box-shadow:inset 0 1px 0 var(--rule),inset 0 -1px 0 var(--rule);padding:clamp(72px,9vw,130px) 0 clamp(56px,7vw,96px)}
.fleetgrid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:clamp(32px,5vw,88px);align-items:center}
.plate{position:relative;background:var(--bg);box-shadow:inset 0 0 0 1px var(--rule);padding:clamp(16px,3vw,36px) clamp(16px,3vw,36px) 26px}
.plate .brk{border-color:var(--rule2)}
.craft{display:block;width:100%;height:auto;max-width:none;overflow:visible}
.f1{fill:var(--sheet);stroke:var(--ink);stroke-width:1.05;stroke-linejoin:round}
.f2{fill:var(--face2);stroke:var(--ink);stroke-width:1.05;stroke-linejoin:round}
.f3{fill:var(--face3);stroke:var(--ink);stroke-width:1.05;stroke-linejoin:round}
.f4{fill:var(--panel);stroke:var(--ink);stroke-width:1.05;stroke-linejoin:round}
.f5{fill:var(--ink);opacity:.88}
.f5.accent{fill:var(--accent);opacity:1}
.led{fill:var(--accent)}
.hair{fill:none;stroke:var(--ink);stroke-width:.75;opacity:.55}
.wl{fill:none;stroke:#9fb6dd;stroke-width:.7;opacity:.55}
.dim{stroke-dasharray:2 3}
.callout polyline{fill:none;stroke:var(--accent-ink);stroke-width:.9}
.callout circle{fill:var(--accent-ink)}
.callout .tagc{fill:var(--bg);stroke:var(--accent-ink);stroke-width:1}
.callout text{font:700 12px var(--sans);fill:var(--ink)}
.parts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 22px;margin-top:14px;counter-reset:p;font-size:14px;color:var(--soft)}
.parts li{counter-increment:p;display:flex;gap:10px;align-items:baseline}
.parts li::before{content:counter(p,persian);font:700 12px var(--sans);color:var(--accent-ink);min-width:14px}
.craftcopy .h2{margin-top:14px}
.craftcopy .body{margin-top:18px}
.specs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 28px;margin:30px 0 32px}
.specs>div{box-shadow:inset 0 1px 0 var(--rule);padding:13px 0 14px}
.specs dd{font-size:16.5px;font-weight:720;margin-top:3px}
.rostertitle{font-size:19px;font-weight:720}
.maphead{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:10px 28px;margin:clamp(56px,7vw,96px) 0 16px;scroll-margin-top:72px}
.legend{display:flex;flex-wrap:wrap;gap:6px 20px;font-size:13px;color:var(--muted)}
.legend li{display:flex;align-items:center;gap:8px}
.legend i{width:18px;height:0;border-top:1.5px dashed var(--soft)}
.legend li[data-on] i{border-top-color:var(--accent)}
.legend .lg-ring i{width:10px;height:10px;border:1.4px solid var(--accent-ink);border-radius:50%}
.map{position:relative;margin:0;box-shadow:inset 0 0 0 1px var(--rule);background:var(--mapbg)}
.mapsvg{display:block;width:100%;height:auto;max-width:none}
.grat{stroke:var(--rule);stroke-width:1;vector-effect:non-scaling-stroke}
.grat.eq{stroke:var(--rule2)}
.shade{fill:rgba(0,0,0,.45)}
.tk-past{fill:none;stroke:var(--muted);stroke-width:1;opacity:.35;vector-effect:non-scaling-stroke}
.tk{fill:none;stroke:var(--soft);stroke-width:1.2;stroke-dasharray:3 4;opacity:.8;vector-effect:non-scaling-stroke}
.tk.on{stroke:var(--accent);stroke-width:1.6;opacity:1}
.tk.route:not(.on){opacity:.4}
.node circle{fill:var(--soft)}
.node text{font:500 13px var(--sans);fill:var(--muted);paint-order:stroke;stroke:var(--mapbg);stroke-width:4px;stroke-linejoin:round}
.node.here circle{fill:var(--accent-ink)}
.node.here .ring{fill:none;stroke:var(--accent-ink);stroke-width:1.2}
.node.here text,.node.key text{fill:var(--ink);font-weight:700}
.node.panel .ring{fill:none;stroke:var(--accent-ink);stroke-width:1.2}
@media (max-width:900px){.node text{font-size:20px;stroke-width:5px}}
@media (max-width:640px){.node text{font-size:34px;stroke-width:8px}}
.pulse{fill:none;stroke:var(--accent);stroke-width:1;transform-box:fill-box;transform-origin:center;animation:ping 2.8s var(--ease) infinite}
.mk{fill:var(--ink)}
.mk.on{fill:var(--accent)}
.more{display:inline-flex;align-items:center;margin-top:16px;height:44px;padding:0 18px;font-size:14px;font-weight:720;box-shadow:inset 0 0 0 1px var(--rule2)}
.more:hover{background:var(--ink);color:var(--bg)}
.roster{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 22px;margin-top:18px}
.js .roster:not([data-all]){display:none}
.roster li{display:grid;gap:3px;padding:13px 0 15px;box-shadow:inset 0 1px 0 var(--rule);font-size:14px;color:var(--soft)}
.roster b{font-size:15px;color:var(--ink)}
.roster .mono{font-size:12px;color:var(--accent-ink)}

/* ---------- آماده‌سازی جلسه (ریل کارت‌ها) ---------- */
.archive{padding:clamp(80px,10vw,140px) 0 clamp(64px,8vw,110px)}
.archhead{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:30px}
.archhead .body{margin-top:14px}
.railbtns{display:flex;gap:8px;flex:none}
.railbtns button{width:46px;height:46px;display:grid;place-items:center;box-shadow:inset 0 0 0 1px var(--rule2);color:var(--ink);transition:background-color .2s,color .2s,opacity .2s}
.railbtns button:hover:not(:disabled){background:var(--ink);color:var(--bg)}
.railbtns button:disabled{opacity:.3;cursor:default}
.rail{display:grid;grid-auto-flow:column;grid-auto-columns:clamp(260px,29vw,400px);gap:22px;overflow-x:auto;scroll-snap-type:x mandatory;padding:0 max(var(--gut),calc(50% - 700px + var(--gut))) 18px;scroll-padding:0 max(var(--gut),calc(50% - 700px + var(--gut)));scrollbar-width:thin;scrollbar-color:var(--rule2) transparent}
.story{scroll-snap-align:start;display:block;min-width:0}
.storyimg{overflow:hidden;margin-bottom:16px;background:var(--sheet);box-shadow:inset 0 0 0 1px var(--rule)}
.storyimg svg{display:block;width:100%;height:auto;transition:transform .7s var(--ease)}
.story:hover .storyimg svg{transform:scale(1.045)}
.story h3{font-size:18.5px;line-height:1.55;font-weight:720;margin-top:6px;text-wrap:pretty}
.railnote{font-size:13.5px;color:var(--muted);margin-top:22px;padding-inline-start:14px;box-shadow:inset -2px 0 0 var(--accent)}
.art{--a:var(--accent)}
.art .bgp{fill:var(--sheet)}
.art .gr{stroke:var(--faint);stroke-width:1}
.art .s{fill:none;stroke:var(--ink);stroke-width:1.2;stroke-linejoin:round;stroke-linecap:round}
.art .s2{fill:none;stroke:var(--ink);stroke-width:.8;opacity:.5}
.art .d{fill:none;stroke:var(--soft);stroke-width:1.1;stroke-dasharray:3 4}
.art .fa{fill:var(--face2);stroke:var(--ink);stroke-width:1.1;stroke-linejoin:round}
.art .fb{fill:var(--face3);stroke:var(--ink);stroke-width:1.1;stroke-linejoin:round}
.art .fp{fill:var(--panel);stroke:var(--ink);stroke-width:1.1;stroke-linejoin:round}
.art .ac{fill:var(--a)}
.art .acs{fill:none;stroke:var(--a);stroke-width:1.4}
.art text{font:500 11px var(--mono);fill:var(--muted);direction:ltr}
.art text.hi{fill:var(--a)}

/* ---------- پرسش‌ها ---------- */
.faq{box-shadow:inset 0 1px 0 var(--rule);padding:clamp(72px,9vw,130px) 0}
.faqgrid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.5fr);gap:clamp(32px,6vw,100px);align-items:start}
.faqgrid .h2{margin-top:14px}
.faqgrid .body{margin-top:18px}
.faqlist details{box-shadow:inset 0 1px 0 var(--rule)}
.faqlist details:last-child{box-shadow:inset 0 1px 0 var(--rule),inset 0 -1px 0 var(--rule)}
.faqlist summary{display:grid;grid-template-columns:40px 1fr 24px;align-items:baseline;gap:0;padding:20px 0;font-size:17px;font-weight:700;cursor:pointer;list-style:none}
.faqlist summary::-webkit-details-marker{display:none}
.faqlist summary .mono{font-size:13px;color:var(--accent-ink);font-weight:600}
.faqlist summary::after{content:"+";font:400 22px/1 var(--mono);color:var(--accent);justify-self:end;transition:transform .25s var(--ease)}
.faqlist details[open] summary::after{transform:rotate(45deg)}
.faqlist summary:hover{color:#fff}
.faqlist details p{padding:0 40px 22px 24px;color:var(--soft);font-size:16px;max-width:62ch;animation:rise .4s var(--ease) both}

/* ---------- درخواست دمو ---------- */
.task{background:var(--sheet);box-shadow:inset 0 1px 0 var(--rule);padding:clamp(72px,9vw,130px) 0}
.taskgrid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.25fr);gap:clamp(32px,6vw,100px);align-items:start}
.taskcopy .h2{margin-top:14px}
.taskcopy .body{margin-top:18px}
.steps{margin-top:34px;counter-reset:s;display:grid}
.steps li{counter-increment:s;display:grid;grid-template-columns:40px 1fr;gap:2px 0;padding:16px 0;box-shadow:inset 0 1px 0 var(--rule)}
.steps li::before{content:counter(s,persian);grid-row:span 2;font:700 14px var(--sans);color:var(--accent-ink);padding-top:2px}
.steps b{font-size:16px;font-weight:720}
.steps span{font-size:15px;color:var(--muted)}
.note{margin-top:26px;padding:14px 18px;font-size:14px;line-height:1.85;color:var(--soft);background:var(--faint);box-shadow:inset -2px 0 0 var(--accent)}
.formwrap{background:var(--bg);box-shadow:inset 0 0 0 1px var(--rule);padding:clamp(20px,3vw,36px)}
.form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.form h3{font-size:20px;font-weight:720}
.span2{grid-column:1/-1}
.field{display:grid;gap:7px;align-content:start}
.field label{font-size:13.5px;font-weight:700}
.field input,.field select,.field textarea{width:100%;height:48px;padding:0 14px;background:var(--sheet);border:1px solid var(--rule2);border-radius:2px;color:var(--ink)}
.field textarea{height:auto;min-height:96px;padding:12px 14px;resize:none}
.field :disabled{opacity:.6;cursor:not-allowed}
.selectw{position:relative;display:block}
.selectw::after{content:"";position:absolute;left:18px;top:50%;width:7px;height:7px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:translateY(-70%) rotate(45deg);pointer-events:none;opacity:.6}
.selectw select{appearance:none;-webkit-appearance:none;padding-left:40px}
.earliest{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:6px 16px;padding:14px 0 2px;box-shadow:inset 0 1px 0 var(--rule);font-family:var(--mono);font-size:13.5px}
.earliest .label{font-family:var(--sans)}
.formfoot{display:flex;flex-wrap:wrap;align-items:center;gap:14px 20px;margin-top:4px}
.formnote{font-size:13px;color:var(--muted)}
.field [aria-invalid="true"]{border-color:var(--err)}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--accent)}
.note .mail{color:var(--accent);font-weight:700;unicode-bidi:isolate}
.note .mail:hover{text-decoration:underline;text-underline-offset:4px}
.formfoot .formnote{flex:1 1 260px}
.hp{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.formstatus{font-size:14.5px;padding:12px 14px;background:var(--faint);box-shadow:inset -2px 0 0 var(--muted)}
.formstatus[data-tone="ok"]{box-shadow:inset -2px 0 0 var(--accent);color:var(--ink)}
.formstatus[data-tone="bad"]{box-shadow:inset -2px 0 0 var(--err)}

/* ---------- پاصفحه ---------- */
.foot{background:var(--navy);color:#c3cede}
.footgrid{display:grid;grid-template-columns:minmax(0,1.6fr) repeat(3,minmax(0,1fr));gap:40px clamp(24px,3vw,48px);padding-top:44px;padding-bottom:56px}
.footbrand,.footcol{min-width:0}
.footbrand .brand{margin-bottom:22px}
.foottext{font-size:14.5px;line-height:1.9;color:#a9b6c9;max-width:40ch}
.footcol h2{font-size:13px;font-weight:750;color:#fff;margin-bottom:16px}
.footcol ul{display:grid;gap:10px}
.footcol a{font-size:15px;color:#b6c3d5;transition:color .2s}
.footcol a:hover{color:#fff;text-decoration:underline;text-underline-offset:6px}
.legal{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px 24px;padding-top:22px;padding-bottom:30px;box-shadow:inset 0 1px 0 rgba(255,255,255,.1);font-size:13px;color:#9aa8bc}

/* ---------- صفحه‌های فرعی ---------- */
.subhero{position:relative;margin-top:calc(-1 * var(--headh));min-height:clamp(420px,58vh,560px);background:var(--space);color:#eef2f7;display:flex;flex-direction:column;justify-content:flex-end;isolation:isolate;overflow:hidden}
.subhero .sky{background:radial-gradient(ellipse at 50% 260%,#0f2c50 0,#0b2342 70%,#5d97f4 70.4%,rgba(93,151,244,.22) 71%,transparent 73%)}
.subhero .sky[data-painted]{background:none}
.subhero .scrim{background:linear-gradient(180deg,rgba(4,6,10,.2),rgba(4,6,10,.75) 100%)}
.subcopy{position:relative;z-index:3;padding-top:calc(var(--headh) + 70px);padding-bottom:clamp(40px,7vh,80px)}
.subcopy h1{font-size:clamp(2.1rem,1rem + 2.8vw,3.8rem);line-height:1.25;font-weight:760;text-wrap:balance}
.subcopy p:not(.kicker){font-size:clamp(1rem,.94rem + .3vw,1.18rem);color:rgba(233,238,245,.82);max-width:56ch;margin-top:18px}
.subcopy>*{animation:rise .9s var(--ease) both}
.subcopy>:nth-child(2){animation-delay:.06s}
.subcopy>:nth-child(3){animation-delay:.12s}
.doc{padding:clamp(64px,8vw,120px) 0}
.docgrid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2.4fr);gap:clamp(32px,6vw,100px);align-items:start}
.toc{position:sticky;top:120px;display:grid;gap:2px}
.toc a{display:grid;grid-template-columns:32px 1fr;padding:10px 0;box-shadow:inset 0 1px 0 var(--rule);color:var(--soft);font-size:15px;transition:color .2s}
.toc a:hover{color:#fff}
.toc .mono{font-size:12px;color:var(--accent-ink);padding-top:3px}
.docsec{padding:0 0 clamp(40px,5vw,64px);scroll-margin-top:82px}
.docsec+.docsec{box-shadow:inset 0 1px 0 var(--rule);padding-top:clamp(36px,4vw,56px)}
.docsec h2{font-size:clamp(1.5rem,1.1rem + 1.1vw,2.2rem);line-height:1.35;font-weight:720;margin-top:10px}
.docsec p{font-size:17px;line-height:1.95;color:var(--soft);margin-top:18px;max-width:64ch}
.checks{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 28px;margin-top:24px}
.checks li{display:grid;grid-template-columns:28px 1fr;padding:14px 0 16px;box-shadow:inset 0 1px 0 var(--rule);font-size:15.5px;line-height:1.8;color:var(--soft)}
.checks li::before{content:"";width:9px;height:9px;margin-top:9px;background:var(--accent);transform:rotate(45deg)}
.docend{display:flex;flex-wrap:wrap;gap:12px;margin-top:8px}
.errpage .subhero{min-height:100svh}

/* ---------- حرکت ---------- */
@keyframes rise{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@keyframes in{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
@keyframes ping{0%{transform:scale(.6);opacity:.9}70%{transform:scale(2.1);opacity:0}100%{transform:scale(2.1);opacity:0}}

/* ---------- واکنش‌گرا ---------- */
@media (max-width:1100px){
  .mainnav,.headcta{display:none}
  .menubtn{display:inline-flex}
  .usegrid,.fleetgrid{grid-template-columns:minmax(0,1fr)}
  .footgrid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .footbrand{grid-column:1/-1}
}
@media (max-width:900px){
  .livegrid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cell{padding:26px 18px 28px}
  .cell:nth-child(odd){box-shadow:none;padding-inline-start:0}
  .cell:nth-child(n+3){border-top:1px solid var(--rule)}
  .introgrid,.taskgrid,.faqgrid,.docgrid{grid-template-columns:minmax(0,1fr)}
  .card{max-width:520px}
  .toc{position:static}
  .pillars{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}
  .pillars::-webkit-scrollbar{display:none}
  .pillars li{flex:0 0 min(70vw,300px);scroll-snap-align:start}
  .pillars .arrow{opacity:.7;transform:none}
  .roster{grid-template-columns:repeat(2,minmax(0,1fr))}
  .methodshead{grid-template-columns:minmax(0,1fr)}
  .methodgrid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .method:nth-child(odd){box-shadow:none;padding-inline-start:0}
  .method:nth-child(n+3){border-top:1px solid var(--rule)}
}
@media (max-width:640px){
  :root{--headh:65px}
  .util{display:none}
  .hero{min-height:clamp(620px,100svh,900px)}
  .herocopy{padding-top:calc(var(--headh) + 30vh)}
  .hero h1{font-size:clamp(2.2rem,8vw + .4rem,3rem)}
  .ctas .btn{flex:1 1 auto}
  .big{font-size:clamp(1.6rem,7vw,2.1rem)}
  .sub{font-size:14px}
  .rhythm{grid-template-columns:minmax(0,1fr)}
  .facts{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cbox{aspect-ratio:4/3}
  .scene{font-size:clamp(6px,2.3cqw,14px)}
  .m-list{width:94%}
  .m-win{width:66%}
  .m-login{width:46%;padding:1em}
  .scene.after>.m-phone,.scene.after>.m-login{margin-inline-end:2cqw}
  .scene.before>.m-phone{margin-inline-start:5cqw}
  .scene.after>.m-phone{margin-inline-end:5cqw}
  .methodgrid{grid-template-columns:minmax(0,1fr)}
  .method,.method:nth-child(odd){box-shadow:none;padding-inline:0}
  .method+.method{border-top:1px solid var(--rule)}
  .m-phone{height:62cqw}
  .ccap{grid-template-columns:1fr auto}
  .cplace{grid-column:1/-1;grid-row:2;text-align:start}
  .specs,.parts,.checks{grid-template-columns:minmax(0,1fr)}
  .legend{font-size:12px}
  .roster{grid-template-columns:minmax(0,1fr)}
  .archhead{flex-direction:column;align-items:flex-start}
  .form{grid-template-columns:minmax(0,1fr)}
  .rail{grid-auto-columns:78vw}
  .footgrid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .faqlist details p{padding-inline:40px 0}
}
@media (max-width:1100px) and (max-height:500px){
  :root{--headh:65px}
  .util{display:none}
}
/* مرورگرهای بدون واحدهای container query (Safari 15، Chromium قدیمی) */
@supports not (width:1cqw){
  .scene{padding:16px;font-size:clamp(6px,.9vw,14px)}
  .m-phone{height:21vw}
  @media (max-width:1100px){.scene{font-size:clamp(6px,1.6vw,14px)}.m-phone{height:38vw}}
  @media (max-width:640px){.scene{padding:8px;font-size:clamp(6px,2.1vw,14px)}.m-phone{height:57vw}}
}
/* بدون JavaScript، کنترل‌هایی که کار نمی‌کنند پنهان می‌شوند */
html:not(.js) :is(.menubtn,.tabs,.more,.railbtns,.handle){display:none!important}
@media (forced-colors:active){
  .tabs button[aria-selected="true"]::after{background:Highlight}
  .cline{background:CanvasText}
  .handle{border:2px solid ButtonText}
  .ghost,.line,.more,.railbtns button{border:1px solid ButtonText}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important}
}