/* sctools.maysky.com tool pages (/kr/tool/, /en/tool/, /cn/tool/). Built by gen/buildcss.py from gen/css/. */
:root{
  --bg:#07090d;--bg-2:#0a0e14;--panel:#0f141c;--panel-2:#131a24;--panel-3:#18212d;
  --line:rgba(148,163,184,.12);--line-2:rgba(148,163,184,.2);
  --text:#e9eef5;--muted:#9ca8b9;--faint:#6d798b;
  --blue:#4d8dff;--blue-2:#2f6bea;--cyan:#62d4ff;
  --red:#f0525b;--red-2:#c93540;--green:#3ecf7a;--amber:#f6b940;
  --r:18px;--wrap:1160px;
  --sans:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei UI","Microsoft YaHei","HarmonyOS Sans SC","Noto Sans CJK SC","Source Han Sans SC",system-ui,sans-serif;
  --mono:"SF Mono","Cascadia Mono",Consolas,"JetBrains Mono",Menlo,"Liberation Mono",monospace;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:80px}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}}
body{margin:0;background:var(--bg);color:var(--text);font:16px/1.7 var(--sans);-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit;text-decoration:none}
img,svg{display:block}
h1,h2,h3,h4,p{margin:0}
button{font:inherit;color:inherit}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 24px}
@media (max-width:560px){.wrap{padding:0 16px}}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.mono{font-family:var(--mono)}
.ico{width:1em;height:1em;flex:none}

/* ---------- nav ---------- */
.nav{position:sticky;top:0;z-index:50;border-bottom:1px solid transparent;transition:background .25s,border-color .25s}
.nav.scrolled{background:rgba(7,9,13,.78);-webkit-backdrop-filter:saturate(1.4) blur(14px);backdrop-filter:saturate(1.4) blur(14px);border-color:var(--line)}
.nav .wrap{display:flex;align-items:center;height:64px;gap:28px}
.brand{display:flex;align-items:center;gap:10px;font-weight:700;letter-spacing:.2px}
.brand svg{width:30px;height:30px}
.brand small{font-weight:500;color:var(--muted);font-size:13px;padding-left:10px;border-left:1px solid var(--line-2)}
.nav-links{display:flex;gap:26px;margin-left:auto;font-size:14.5px;color:var(--muted)}
.nav-links a{transition:color .2s}
.nav-links a:hover{color:var(--text)}
.nav-cta{display:inline-flex;align-items:center;gap:8px;height:36px;padding:0 16px;border-radius:10px;font-size:14px;font-weight:600;background:rgba(77,141,255,.14);color:#cfe0ff;border:1px solid rgba(77,141,255,.35);transition:background .2s,border-color .2s}
.nav-cta:hover{background:rgba(77,141,255,.24);border-color:rgba(77,141,255,.6)}
@media (max-width:880px){.nav-links{display:none}.nav-cta{margin-left:auto}}
@media (max-width:420px){.brand small{display:none}}

/* ---------- hero ---------- */
.hero{position:relative;overflow:hidden;padding:56px 0 40px;margin-top:-64px;padding-top:120px}
.hero::before{content:"";position:absolute;inset:0;pointer-events:none;
  background:
   radial-gradient(900px 520px at 18% 8%,rgba(47,107,234,.22),transparent 60%),
   radial-gradient(700px 480px at 88% 30%,rgba(240,82,91,.12),transparent 60%),
   linear-gradient(rgba(148,163,184,.055) 1px,transparent 1px) 0 0/56px 56px,
   linear-gradient(90deg,rgba(148,163,184,.055) 1px,transparent 1px) 0 0/56px 56px;
  -webkit-mask-image:linear-gradient(#000 55%,transparent);mask-image:linear-gradient(#000 55%,transparent)}
.hero-grid{position:relative;display:grid;grid-template-columns:1.02fr 1fr;gap:56px;align-items:center}
@media (max-width:980px){.hero-grid{grid-template-columns:1fr;gap:48px}}
.eyebrow{display:inline-flex;align-items:center;gap:10px;padding:6px 14px 6px 10px;border-radius:999px;font-size:13px;color:#c8d6ea;background:rgba(148,163,184,.08);border:1px solid var(--line-2)}
.pulse{position:relative;width:8px;height:8px;border-radius:50%;background:var(--green)}
.pulse::after{content:"";position:absolute;inset:-4px;border-radius:50%;border:2px solid var(--green);opacity:0;animation:ping 2s ease-out infinite}
@keyframes ping{0%{transform:scale(.5);opacity:.8}100%{transform:scale(1.6);opacity:0}}
.hero h1{margin-top:22px;font-size:clamp(38px,5.6vw,64px);line-height:1.12;font-weight:800;letter-spacing:-.5px}
.hero h1 .hl{background:linear-gradient(100deg,#ff7a80 0%,var(--red) 45%,#ff9f5a 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.hero .lead{margin-top:20px;font-size:clamp(16px,1.6vw,18.5px);color:var(--muted);max-width:34em}
.hero .lead b{color:var(--text);font-weight:600}
.cta-row{display:flex;flex-wrap:wrap;gap:14px;margin-top:32px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;height:54px;padding:0 24px;border-radius:14px;font-weight:650;font-size:16px;border:0;cursor:pointer;transition:transform .15s,box-shadow .2s,background .2s,border-color .2s}
.btn:active{transform:translateY(1px)}
.btn-primary{color:#fff;background:linear-gradient(180deg,#5b98ff,var(--blue-2));box-shadow:0 10px 30px -8px rgba(47,107,234,.65),inset 0 1px 0 rgba(255,255,255,.25)}
.btn-primary:hover{box-shadow:0 14px 38px -8px rgba(47,107,234,.85),inset 0 1px 0 rgba(255,255,255,.3);transform:translateY(-1px)}
.btn-primary .meta{font-weight:500;font-size:13px;opacity:.8;padding-left:12px;margin-left:2px;border-left:1px solid rgba(255,255,255,.3)}
.btn-ghost{color:var(--text);background:rgba(148,163,184,.06);border:1px solid var(--line-2)}
.btn-ghost:hover{background:rgba(148,163,184,.12);border-color:rgba(148,163,184,.35)}
.btn .ico{width:20px;height:20px}
@media (max-width:480px){.cta-row .btn{width:100%}}
.checks{display:flex;flex-wrap:wrap;gap:10px 22px;margin-top:26px;font-size:14px;color:var(--muted)}
.checks span{display:inline-flex;align-items:center;gap:7px}
.checks .ico{color:var(--green);width:16px;height:16px}
.win-only{display:flex;gap:12px;align-items:flex-start;margin-top:26px;padding:14px 16px;border-radius:14px;background:linear-gradient(90deg,rgba(246,185,64,.12),rgba(246,185,64,.04));border:1px solid rgba(246,185,64,.35);font-size:14.5px;color:#f3dfb4;max-width:560px}
.win-only .ico{width:20px;height:20px;color:var(--amber);margin-top:2px}
.win-only b{color:#ffe7b0}
.plat{display:none;margin-top:12px;padding:14px 16px;border-radius:14px;font-size:14.5px;max-width:560px;line-height:1.6}
.plat.show{display:flex;gap:12px;align-items:flex-start}
.plat .ico{width:20px;height:20px;margin-top:2px}
.plat.bad{background:rgba(240,82,91,.1);border:1px solid rgba(240,82,91,.4);color:#ffd0d3}
.plat.bad .ico{color:var(--red)}
.plat.ok{background:rgba(62,207,122,.08);border:1px solid rgba(62,207,122,.3);color:#c9f2d9}
.plat.ok .ico{color:var(--green)}
.plat b{color:#fff}
.plat .copy{margin-top:10px;display:inline-flex;align-items:center;gap:6px;height:34px;padding:0 12px;border-radius:9px;font-size:13.5px;font-weight:600;cursor:pointer;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.18)}
.plat .copy:hover{background:rgba(255,255,255,.14)}

/* ---------- hero visual: app mock ---------- */
.visual{position:relative;padding-top:34px;min-width:0}
.radar{position:absolute;left:50%;top:52%;width:760px;height:760px;transform:translate(-50%,-50%);border-radius:50%;pointer-events:none;opacity:.55;
  background:repeating-radial-gradient(circle,transparent 0 79px,rgba(77,141,255,.16) 79px 80px);
  -webkit-mask-image:radial-gradient(circle,#000 30%,transparent 70%);mask-image:radial-gradient(circle,#000 30%,transparent 70%)}
.radar::after{content:"";position:absolute;inset:0;border-radius:50%;background:conic-gradient(from 0deg,rgba(77,141,255,.28),transparent 18%);animation:sweep 7s linear infinite}
@keyframes sweep{to{transform:rotate(1turn)}}
.win{position:relative;font-size:clamp(11px,1.12vw,14px);background:#0f1217;border:1px solid rgba(255,255,255,.1);border-radius:12px;overflow:hidden;
  box-shadow:0 50px 100px -30px rgba(0,0,0,.85),0 0 0 1px rgba(0,0,0,.5),0 0 140px -40px rgba(77,141,255,.45)}
@media (max-width:980px){.win{font-size:clamp(10.5px,2.5vw,14px);max-width:620px;margin:0 auto}}
.win-bar{display:flex;align-items:center;gap:.6em;height:2.6em;padding:0 0 0 1em;background:#0b0d11;border-bottom:1px solid rgba(255,255,255,.06);font-size:.86em;color:#9aa3af}
.win-bar svg.app{width:1.2em;height:1.2em}
.win-bar .ctl{margin-left:auto;display:flex;height:100%}
.win-bar .ctl i{width:3.4em;display:grid;place-items:center}
.win-bar .ctl i svg{width:.9em;height:.9em;stroke:#9aa3af;stroke-width:1.2;fill:none}
.win-body{padding:1.6em 1.7em 1.2em}
.app-head{display:flex;justify-content:space-between;align-items:flex-start}
.app-head h4{font-size:1.5em;font-weight:700;line-height:1.3}
.app-head p{font-size:.86em;color:#8f99a8;margin-top:.15em}
.app-head .ver{font-size:.82em;color:#6f7a89;white-space:nowrap;padding-top:.5em}
.live{position:relative;margin-top:1.2em;padding:1.05em 1.3em 1.15em;border-radius:.8em;border:1.5px solid #e5484d;background:linear-gradient(180deg,#2a1216,#231015)}
.live .lab{font-size:.84em;color:#ff8a8f}
.live .row{display:flex;align-items:center;gap:.75em;margin-top:.35em}
.live .dot{position:relative;width:.95em;height:.95em;border-radius:50%;background:#e5484d;box-shadow:0 0 0 .28em rgba(229,72,77,.28);flex:none}
.live .t{font-size:1.28em;font-weight:700;white-space:nowrap}
.live .s{font-size:.84em;color:#d49da0;margin-top:.25em;padding-left:1.7em}
.live .pct{position:absolute;right:1.3em;top:50%;transform:translateY(-50%);text-align:right}
.live .pct b{display:block;font-size:2.35em;line-height:1;color:#ff6b72;font-weight:700;font-family:var(--sans)}
.live .pct span{font-size:.84em;color:#d7b3b5}
.app-btns{display:flex;gap:.85em;margin-top:1.3em}
.app-btns span{display:inline-flex;align-items:center;gap:.5em;height:2.9em;padding:0 1.25em;border-radius:.45em;font-size:.95em;font-weight:600}
.app-btns span svg{width:1.05em;height:1.05em;stroke:currentColor;fill:none;stroke-width:1.6}
.app-btns .b1{background:#3b7cf6;color:#fff}
.app-btns .b2{background:#171b22;border:1px solid #2a303a;color:#e5e7eb}
.list-head{display:flex;justify-content:space-between;align-items:baseline;margin-top:1.4em;font-size:.95em;font-weight:700}
.list-head span{font-size:.82em;color:#6f7a89;font-weight:400}
.rep{margin-top:.8em;padding:.85em 1.2em;border-radius:.65em;background:#161b22;border:1px solid #242a33}
.rep-top{display:flex;align-items:center;gap:.6em;font-weight:700;font-size:1em}
.rep-top svg{width:1em;height:1em;stroke:#9aa3af;fill:none;stroke-width:1.5}
.rep-top .when{margin-left:auto;font-weight:400;font-size:.86em;color:#6f7a89}
.rep-top .when em{font-style:normal;color:#9aa3af;margin-left:1em}
.pl{display:flex;align-items:center;gap:.7em;margin-top:.6em;font-size:.93em}
.pl i{width:.5em;height:.5em;border-radius:50%;flex:none}
.pl .race{color:#7c8594;font-size:.92em}
.pl .res{margin-left:auto;font-size:.88em;white-space:nowrap}
.pl .ok{color:#3fbf6f}
.pl .bad{background:#e5484d;color:#fff;font-weight:700;padding:.12em .7em;border-radius:1em}
.app-foot{display:flex;align-items:center;gap:.5em;margin-top:1.2em;padding-top:.9em;border-top:1px solid rgba(255,255,255,.06);font-size:.82em;color:#6f7a89}
.app-foot svg{width:1em;height:1em;stroke:currentColor;fill:none;stroke-width:1.6}
.toast{position:absolute;z-index:3;top:0;right:-18px;display:flex;align-items:center;gap:.7em;padding:.7em .8em .7em 1em;font-size:clamp(11.5px,1.15vw,15px);white-space:nowrap;border-radius:.7em;background:rgba(22,12,15,.94);border:1.5px solid rgba(240,82,91,.85);
  box-shadow:0 20px 50px -12px rgba(0,0,0,.8),0 0 40px -6px rgba(240,82,91,.45);animation:toast-in .7s cubic-bezier(.2,.9,.3,1.2) .6s both}
@keyframes toast-in{from{opacity:0;transform:translateY(-10px) scale(.96)}to{opacity:1;transform:none}}
.toast .bang{width:1.55em;height:1.55em;border-radius:50%;background:#e5484d;display:grid;place-items:center;font-weight:800;color:#fff;font-size:.95em}
.toast .n{color:#ffd166;font-weight:700}
.toast .p{background:#e5484d;color:#fff;font-weight:700;padding:.15em .75em;border-radius:1em;font-size:.95em}
.toast-cap{position:absolute;z-index:3;top:-1.9em;right:-18px;font-size:12px;color:var(--faint);white-space:nowrap}
@media (max-width:980px){.toast,.toast-cap{right:50%;transform:translateX(50%)}.toast{font-size:clamp(11px,3.2vw,15px);animation:none}}
.vis-note{text-align:center;margin-top:14px;font-size:12.5px;color:var(--faint)}

/* ---------- stats ---------- */
.stats{position:relative;margin-top:64px;display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--line);border-radius:var(--r);background:rgba(15,20,28,.6);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.stat{padding:24px 26px}
.stat+.stat{border-left:1px solid var(--line)}
.stat b{display:block;white-space:nowrap;font-size:clamp(28px,3.2vw,38px);line-height:1.1;font-weight:800;letter-spacing:-.5px;background:linear-gradient(180deg,#fff,#a9c3ec);-webkit-background-clip:text;background-clip:text;color:transparent}
.stat span{display:block;margin-top:8px;font-size:14px;color:var(--muted)}
@media (max-width:860px){.stats{grid-template-columns:1fr 1fr}.stat:nth-child(3){border-left:0}.stat:nth-child(n+3){border-top:1px solid var(--line)}}
@media (max-width:380px){.stat{padding:18px 16px}}

/* ---------- sections ---------- */
section{position:relative}
.sec{padding:112px 0 0}
@media (max-width:700px){.sec{padding-top:80px}}
.kicker{display:inline-flex;align-items:center;gap:10px;font-size:13px;font-weight:700;letter-spacing:2px;color:var(--blue);text-transform:uppercase}
.kicker::before{content:"";width:22px;height:2px;border-radius:2px;background:currentColor}
.sec h2{margin-top:14px;font-size:clamp(28px,3.6vw,42px);line-height:1.2;font-weight:800;letter-spacing:-.3px}
.sec .sub{margin-top:14px;color:var(--muted);font-size:clamp(15px,1.4vw,17px);max-width:40em}
.center{text-align:center}.center .sub{margin-left:auto;margin-right:auto}

/* features */
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:48px}
@media (max-width:980px){.grid3{grid-template-columns:1fr 1fr}}
@media (max-width:620px){.grid3{grid-template-columns:1fr}}
.card{position:relative;padding:28px 26px;border-radius:var(--r);background:linear-gradient(180deg,var(--panel-2),var(--panel));border:1px solid var(--line);transition:transform .25s,border-color .25s,box-shadow .25s}
.card:hover{transform:translateY(-3px);border-color:var(--line-2);box-shadow:0 20px 40px -24px rgba(0,0,0,.8)}
.fi{width:46px;height:46px;border-radius:13px;display:grid;place-items:center;background:linear-gradient(145deg,rgba(77,141,255,.22),rgba(77,141,255,.05));border:1px solid rgba(77,141,255,.3);color:#9fc1ff}
.fi svg{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.fi.red{background:linear-gradient(145deg,rgba(240,82,91,.22),rgba(240,82,91,.05));border-color:rgba(240,82,91,.35);color:#ff9ea4}
.fi.green{background:linear-gradient(145deg,rgba(62,207,122,.2),rgba(62,207,122,.04));border-color:rgba(62,207,122,.3);color:#8ee6b3}
.card h3{margin-top:18px;font-size:18.5px;font-weight:700}
.card p{margin-top:8px;color:var(--muted);font-size:15px}

/* principle */
.how{display:grid;grid-template-columns:1fr 1.08fr;gap:40px;margin-top:48px;align-items:start}
@media (max-width:980px){.how{grid-template-columns:1fr}}
.rule{display:flex;gap:18px;padding:22px 22px 22px 20px;border-radius:var(--r);background:var(--panel);border:1px solid var(--line)}
.rule+.rule{margin-top:14px}
.rule .tag{flex:none;width:40px;height:40px;border-radius:11px;display:grid;place-items:center;font-weight:800;font-family:var(--mono);color:#fff;background:linear-gradient(145deg,#ff6b72,var(--red-2));box-shadow:0 8px 20px -8px rgba(240,82,91,.7)}
.rule h3{font-size:17px;font-weight:700}
.rule p{margin-top:6px;color:var(--muted);font-size:15px}
.thres{margin-top:14px;padding:18px 20px;border-radius:var(--r);border:1px dashed var(--line-2);color:var(--muted);font-size:14.5px}
.thres b{color:var(--text);font-weight:600}
.timeline{padding:26px 24px 22px;border-radius:var(--r);background:linear-gradient(180deg,var(--panel-2),var(--panel));border:1px solid var(--line)}
.tl-title{display:flex;justify-content:space-between;align-items:baseline;gap:12px;font-weight:700;font-size:15.5px}
.tl-title span{font-weight:400;font-size:12.5px;color:var(--faint)}
.tl-row{margin-top:20px}
.tl-row h5{margin:0 0 10px;font-size:13.5px;font-weight:600;color:var(--muted);display:flex;align-items:center;gap:8px}
.tl-row h5 i{width:8px;height:8px;border-radius:50%}
.frames{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:6px}
.fr{min-height:128px;border-radius:10px;background:rgba(148,163,184,.05);border:1px solid var(--line);padding:6px 5px;display:flex;flex-direction:column;gap:4px}
.fr .no{font-family:var(--mono);font-size:10.5px;color:var(--faint);text-align:center;margin-bottom:2px}
.ev{font-size:11.5px;line-height:1;padding:6px 0;border-radius:6px;text-align:center;font-weight:600;white-space:nowrap}
.ev.sel{background:rgba(77,141,255,.14);color:#a9c7ff;border:1px solid rgba(77,141,255,.35)}
.ev.ord{background:rgba(148,163,184,.14);color:#dde3ea;border:1px solid rgba(148,163,184,.3)}
.fr.hot{background:rgba(240,82,91,.1);border-color:rgba(240,82,91,.7);box-shadow:0 0 0 3px rgba(240,82,91,.12),0 0 24px -6px rgba(240,82,91,.55)}
.fr.hot .no{color:#ff9ea4}
.fr.hot .ev.sel{background:rgba(240,82,91,.16);color:#ffc2c6;border-color:rgba(240,82,91,.45)}
.fr.hot .ev.ord{background:rgba(240,82,91,.32);color:#fff;border-color:rgba(240,82,91,.6)}
.tl-legend{display:flex;flex-wrap:wrap;gap:8px 18px;margin-top:18px;padding-top:16px;border-top:1px solid var(--line);font-size:13px;color:var(--muted)}
.tl-legend span{display:inline-flex;align-items:center;gap:7px}
.tl-legend i{width:12px;height:12px;border-radius:4px}
@media (max-width:420px){.timeline{padding:20px 14px 18px}.frames{gap:4px}.fr{padding:5px 3px;min-height:118px}.ev{font-size:10.5px;padding:5px 0}}
.tiers{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:40px}
@media (max-width:860px){.tiers{grid-template-columns:1fr}}
.tier{padding:22px 22px 20px;border-radius:var(--r);background:var(--panel);border:1px solid var(--line)}
.tier .pc{display:inline-flex;align-items:center;height:30px;padding:0 12px;border-radius:999px;font-weight:800;font-size:14px}
.tier.t99 .pc{background:rgba(240,82,91,.16);color:#ff8d93;border:1px solid rgba(240,82,91,.45)}
.tier.t90 .pc{background:rgba(246,185,64,.14);color:#ffd27a;border:1px solid rgba(246,185,64,.4)}
.tier.t0 .pc{background:rgba(148,163,184,.1);color:#c2cad6;border:1px solid var(--line-2)}
.tier h3{margin-top:14px;font-size:16.5px}
.tier p{margin-top:6px;color:var(--muted);font-size:14.5px}

/* data */
.data{margin-top:44px;border-radius:var(--r);border:1px solid var(--line);overflow:hidden;background:var(--panel)}
.data table{width:100%;border-collapse:collapse;font-size:15px}
.data th{text-align:left;font-size:13px;font-weight:600;color:var(--faint);padding:14px 22px;background:rgba(148,163,184,.04);border-bottom:1px solid var(--line)}
.data td{padding:18px 22px;border-bottom:1px solid var(--line);vertical-align:top}
.data tr:last-child td{border-bottom:0}
.data td:first-child{font-weight:650}
.data td .note{display:block;font-weight:400;color:var(--faint);font-size:13px;margin-top:2px}
.data .num{font-family:var(--mono);font-size:14.5px;white-space:nowrap}
.pill{display:inline-flex;align-items:center;gap:6px;height:26px;padding:0 10px;border-radius:999px;font-size:13px;font-weight:700;white-space:nowrap}
.pill.g{background:rgba(62,207,122,.12);color:#7fe0a8;border:1px solid rgba(62,207,122,.3)}
.pill.r{background:rgba(240,82,91,.12);color:#ff9ea4;border:1px solid rgba(240,82,91,.35)}
.pill.a{background:rgba(246,185,64,.12);color:#ffd27a;border:1px solid rgba(246,185,64,.35)}
.data .desc{color:var(--muted);font-size:14px;margin-top:6px}
@media (max-width:720px){
  .data thead{display:none}
  .data table,.data tbody,.data tr,.data td{display:block;width:100%}
  .data tr{padding:18px 18px 16px;border-bottom:1px solid var(--line)}
  .data tr:last-child{border-bottom:0}
  .data td{padding:0;border:0}
  .data td+td{margin-top:8px}
  .data td[data-l]::before{content:attr(data-l);display:inline-block;min-width:4.5em;color:var(--faint);font-size:13px;font-family:var(--sans)}
}
.data-foot{margin-top:14px;font-size:13px;color:var(--faint)}

/* steps */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:48px;counter-reset:s}
@media (max-width:980px){.steps{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.steps{grid-template-columns:1fr}}
.step{position:relative;padding:26px 22px 24px;border-radius:var(--r);background:var(--panel);border:1px solid var(--line)}
.step::before{counter-increment:s;content:"0" counter(s);font-family:var(--mono);font-size:13px;font-weight:700;color:var(--blue);letter-spacing:1px}
.step h3{margin-top:10px;font-size:17px}
.step p{margin-top:8px;color:var(--muted);font-size:14.5px}
.step code,.faq code{font-family:var(--mono);font-size:.9em;padding:1px 6px;border-radius:6px;background:rgba(148,163,184,.12);color:#dbe4ef;word-break:break-all}
.also{margin-top:18px;display:grid;grid-template-columns:auto 1fr;gap:18px;align-items:center;padding:22px 24px;border-radius:var(--r);border:1px solid rgba(77,141,255,.25);background:linear-gradient(90deg,rgba(77,141,255,.1),rgba(77,141,255,.02))}
.also h3{font-size:17px}
.also p{margin-top:4px;color:var(--muted);font-size:14.5px}
.inline-link{color:#9fc1ff;font-weight:600;white-space:nowrap}.inline-link:hover{color:#cfe0ff;text-decoration:underline}
@media (max-width:560px){.also{grid-template-columns:1fr}}

/* download */
.dl{display:grid;grid-template-columns:1.15fr 1fr;gap:22px;margin-top:48px}
@media (max-width:900px){.dl{grid-template-columns:1fr}}
.dl-card{position:relative;overflow:hidden;padding:32px 30px 30px;border-radius:22px;border:1px solid rgba(77,141,255,.35);background:radial-gradient(600px 300px at 0% 0%,rgba(47,107,234,.25),transparent 70%),linear-gradient(180deg,#121a27,#0e141d)}
@media (max-width:480px){.dl-card{padding:24px 18px}}
.dl-head{display:flex;gap:16px;align-items:center}
.dl-head svg{width:56px;height:56px;flex:none}
.dl-head h3{font-size:21px;font-weight:800}
.dl-head p{color:var(--muted);font-size:14px}
.dl-warn{display:flex;gap:12px;align-items:flex-start;margin-top:24px;padding:14px 16px;border-radius:14px;background:rgba(246,185,64,.1);border:1px solid rgba(246,185,64,.4);color:#f3dfb4;font-size:14.5px}
.dl-warn .ico{width:20px;height:20px;color:var(--amber);margin-top:2px}
.dl-warn b{color:#ffe7b0}
.dl-card .btn{width:100%;margin-top:18px;height:58px;font-size:17px}
.dl-meta{margin-top:20px;display:grid;grid-template-columns:auto 1fr;gap:10px 18px;font-size:14px}
.dl-meta dt{color:var(--faint)}
.dl-meta dd{margin:0;color:#d5dde8;min-width:0}
.hash{display:flex;align-items:center;gap:8px;min-width:0}
.hash code{font-family:var(--mono);font-size:12.5px;color:#b9c6d8;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.hash button{flex:none;height:26px;padding:0 9px;border-radius:7px;font-size:12px;cursor:pointer;background:rgba(148,163,184,.1);border:1px solid var(--line-2);color:var(--muted)}
.hash button:hover{color:var(--text);background:rgba(148,163,184,.18)}
.req{padding:30px 28px;border-radius:22px;background:var(--panel);border:1px solid var(--line)}
@media (max-width:480px){.req{padding:24px 18px}}
.req h3{font-size:18px}
.req ul{list-style:none;margin:18px 0 0;padding:0}
.req li{display:grid;grid-template-columns:22px 1fr;gap:12px;padding:14px 0;border-top:1px solid var(--line);font-size:14.5px}
.req li:first-child{border-top:0;padding-top:4px}
.req li .ico{width:20px;height:20px;margin-top:2px}
.req li b{display:block;font-weight:650}
.req li span{color:var(--muted)}
.req .y{color:var(--green)}.req .n{color:var(--red)}

/* faq */
.faq{max-width:860px;margin:44px auto 0}
.faq details{border-bottom:1px solid var(--line)}
.faq details:first-child{border-top:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:16px;padding:22px 4px;font-size:17px;font-weight:650}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";margin-left:auto;flex:none;width:12px;height:12px;background:linear-gradient(currentColor,currentColor) center/12px 2px no-repeat,linear-gradient(currentColor,currentColor) center/2px 12px no-repeat;color:var(--muted);transition:transform .25s}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq summary:hover{color:#fff}
.faq .a{padding:0 4px 24px;color:var(--muted);font-size:15.5px}
.faq .a p+p{margin-top:8px}

/* author seal: 当哥作品 */
.seal{flex:none;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;width:76px;height:76px;padding:6px;border:3px solid #e5484d;border-radius:9px;background:rgba(229,72,77,.1);color:#ff5c63;font:700 27px/1 "Kaiti SC","STKaiti","KaiTi","楷体","Songti SC","SimSun",serif;transform:rotate(-8deg);box-shadow:inset 0 0 0 2px rgba(229,72,77,.3),0 10px 30px -12px rgba(229,72,77,.6)}
.seal i{font-style:normal;display:grid;place-items:center}
.seal.sm{width:44px;height:44px;padding:3px;border-width:2px;border-radius:6px;font-size:15px;transform:rotate(-6deg);box-shadow:inset 0 0 0 1.5px rgba(229,72,77,.3)}
.seal.xs{width:30px;height:30px;padding:2px;border-width:1.5px;border-radius:5px;font-size:10.5px;transform:rotate(-6deg);box-shadow:none}
@media (max-width:560px){.seal:not(.sm):not(.xs){width:58px;height:58px;font-size:20px;padding:4px;border-width:2.5px}}
.author{color:#ff8d93;font-weight:700}
.title-row{display:flex;align-items:flex-end;gap:20px;margin-top:22px}
.title-row h1{margin-top:0!important}
.title-row .seal{margin-bottom:12px}
.tagline{margin-top:16px;font-size:clamp(20px,2.3vw,27px);font-weight:750;line-height:1.35}
.tagline .hl{background:linear-gradient(100deg,#ff7a80 0%,var(--red) 45%,#ff9f5a 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.sign span{white-space:nowrap}
@media (max-width:560px){.sign{font-size:16px!important;letter-spacing:1px!important}}
.sign{margin-top:14px;font:700 18px/1.4 "Kaiti SC","STKaiti","KaiTi","楷体","Songti SC",serif;color:#ff8d93;letter-spacing:2px}
/* closing + footer */
.closing{margin-top:112px;padding:56px 32px;border-radius:26px;text-align:center;position:relative;overflow:hidden;border:1px solid var(--line-2);
  background:radial-gradient(700px 300px at 50% 0%,rgba(47,107,234,.3),transparent 70%),linear-gradient(180deg,#101723,#0b1017)}
.closing h2{font-size:clamp(26px,3.4vw,38px);font-weight:800}
.closing p{margin-top:12px;color:var(--muted)}
.closing .cta-row{justify-content:center}
@media (max-width:560px){.closing{padding:40px 18px;margin-top:80px}}
footer{margin-top:80px;border-top:1px solid var(--line);padding:32px 0 calc(40px + env(safe-area-inset-bottom));font-size:13.5px;color:var(--faint)}
footer .wrap{display:flex;flex-wrap:wrap;gap:12px 28px;justify-content:space-between;align-items:center}
footer .brand{color:var(--muted);font-size:15px}
footer .brand svg{width:24px;height:24px}

/* reveal */
.js .reveal{opacity:0;transform:translateY(18px);transition:opacity .7s ease,transform .7s ease}
.js .reveal.in{opacity:1;transform:none}
.toast-flash{position:fixed;left:50%;bottom:28px;transform:translate(-50%,20px);opacity:0;z-index:99;padding:10px 18px;border-radius:12px;background:#1b2330;border:1px solid var(--line-2);font-size:14px;transition:opacity .25s,transform .25s;pointer-events:none}
.toast-flash.on{opacity:1;transform:translate(-50%,0)}

/* ---------- shared by all pages (kr / en / cn): type, language menu, footer links ---------- */
html[lang="ko"]{--sans:-apple-system,BlinkMacSystemFont,"Apple SD Gothic Neo","Segoe UI","Malgun Gothic","맑은 고딕","Noto Sans KR","Noto Sans CJK KR",system-ui,"PingFang SC","Microsoft YaHei",sans-serif}
html[lang="ko"] body{word-break:keep-all;overflow-wrap:break-word}
html[lang="en"]{--sans:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,system-ui,"PingFang SC","Microsoft YaHei",sans-serif}
.lang{position:relative;flex:none}
.lang summary{list-style:none;display:inline-flex;align-items:center;gap:7px;height:36px;padding:0 11px;border-radius:10px;font-size:14px;color:var(--muted);border:1px solid var(--line-2);background:rgba(148,163,184,.06);cursor:pointer;white-space:nowrap;-webkit-user-select:none;user-select:none;transition:color .2s,background .2s,border-color .2s}
.lang summary::-webkit-details-marker{display:none}
.lang summary:hover,.lang[open] summary{color:var(--text);background:rgba(148,163,184,.12);border-color:rgba(148,163,184,.35)}
.lang summary .ico{width:16px;height:16px}
.lang summary::after{content:"";width:6px;height:6px;margin:-4px 1px 0 1px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg);opacity:.7}
.lang-list{position:absolute;right:0;top:calc(100% + 8px);z-index:60;min-width:156px;padding:6px;border-radius:12px;background:#121924;border:1px solid var(--line-2);box-shadow:0 20px 50px -14px rgba(0,0,0,.85)}
.lang-list a{display:flex;align-items:center;justify-content:space-between;gap:12px;height:42px;padding:0 12px;border-radius:8px;font-size:14.5px;color:var(--muted)}
.lang-list a:hover{background:rgba(148,163,184,.1);color:var(--text)}
.lang-list a[aria-current]{color:#fff;font-weight:650}
.lang-list a[aria-current]::after{content:"";width:10px;height:5px;margin-top:-3px;border-left:2px solid var(--blue);border-bottom:2px solid var(--blue);transform:rotate(-45deg)}
@media (max-width:1100px){.brand small{display:none}}
@media (max-width:1020px){.nav-links{display:none}.nav .wrap{gap:10px}.lang{margin-left:auto}.lang+.nav-cta{margin-left:0}}
.nav-cta{white-space:nowrap}
@media (max-width:400px){.lang summary{padding:0 9px;gap:5px}.lang summary span{display:none}.nav-cta{padding:0 11px}}
@media (max-width:360px){.nav-cta .ico{display:none}}
footer .wrap{row-gap:16px}
.foot-links{flex-basis:100%;display:flex;flex-wrap:wrap;gap:8px 22px;padding-top:16px;border-top:1px solid var(--line)}
.foot-links a{color:var(--muted)}
.foot-links a:hover{color:var(--text)}
/* tool page notes: fair use, SmartScreen, full SHA-256 values */
.fair{margin-top:18px;display:flex;gap:14px;align-items:flex-start;padding:18px 20px;border-radius:var(--r);background:linear-gradient(90deg,rgba(246,185,64,.1),rgba(246,185,64,.03));border:1px solid rgba(246,185,64,.35);color:#f3dfb4;font-size:15px}
.fair .ico{width:22px;height:22px;flex:none;color:var(--amber);margin-top:2px}
.fair b{color:#ffe7b0}
.dl-note{display:flex;gap:12px;align-items:flex-start;margin-top:14px;padding:13px 16px;border-radius:14px;background:rgba(77,141,255,.08);border:1px solid rgba(77,141,255,.3);color:#cfe0ff;font-size:14px}
.dl-note .ico{width:20px;height:20px;flex:none;color:#9fc1ff;margin-top:2px}
.dl-note b{color:#fff}
.hash{align-items:flex-start}
.hash code{white-space:normal;word-break:break-all;overflow:visible;line-height:1.55}
.card .new{display:inline-flex;align-items:center;height:22px;margin-left:8px;padding:0 8px;border-radius:999px;font-size:12px;font-weight:750;vertical-align:3px;color:#fff;background:linear-gradient(180deg,#ff7a80,var(--red-2))}
@media (max-width:560px){.dl-meta{grid-template-columns:1fr;gap:0}.dl-meta dt{margin-top:12px}.dl-meta dt:first-child{margin-top:0}}