:root{
  --noturno:#001621;--surface:#05202B;--raise:#0A2A37;--line:#1B3340;--line2:#37525F;--gangue:#7E96A1;--rime:#E4ECEF;--vul:#FF4103;--vulh:#F03C00;
  --bg:var(--noturno);--fg:var(--rime);--mut:var(--gangue);--dim:#5C7581;
  --f:'Plus Jakarta Sans','Poppins',system-ui,-apple-system,'Segoe UI',sans-serif;--m:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  --eo:cubic-bezier(.16,1,.3,1);--eio:cubic-bezier(.76,0,.24,1);--g:clamp(16px,4vw,64px);
  color-scheme:dark;
}
*,*::before,*::after{box-sizing:border-box}
html{background:var(--bg);scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--fg);font:400 17px/1.55 var(--f);-webkit-font-smoothing:antialiased}
a{color:inherit}
:focus-visible{outline:2px solid var(--vul);outline-offset:2px}
::selection{background:var(--vul);color:var(--noturno)}
h1,h2,h3,h4{margin:0;text-wrap:balance}
p{margin:0;text-wrap:pretty}
code,.mono{font-family:var(--m)}
.label{font:600 12px/1.2 var(--f);letter-spacing:.16em;text-transform:uppercase;color:var(--mut)}
.acc{color:var(--vul)}
.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* top bar */
.top{position:sticky;top:0;z-index:30;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:calc(env(safe-area-inset-top,0px) + 14px) var(--g) 14px;background:color-mix(in srgb,var(--noturno) 92%,transparent);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.top-l{display:flex;align-items:center;gap:18px}
.top-l svg{display:block;width:124px;height:auto;color:var(--rime)}
.top-l .label{color:var(--dim)}.top-l .label b{color:var(--vul);font-weight:600}
.top-r{display:flex;align-items:center;gap:10px}
.pill{display:inline-flex;align-items:center;gap:8px;height:36px;padding:0 14px;border:0;background:transparent;box-shadow:inset 0 0 0 1px var(--line2);color:var(--rime);font:700 13px/1 var(--f);text-decoration:none;cursor:pointer;transition:box-shadow .25s,color .25s}
.pill:hover{box-shadow:inset 0 0 0 1px var(--vul);color:var(--vul)}
.prog{position:absolute;left:0;right:0;bottom:-1px;height:2px}.prog i{display:block;height:100%;background:var(--vul);transform-origin:left;transform:scaleX(0)}

/* layout */
.shell{display:grid;grid-template-columns:220px minmax(0,1fr);gap:clamp(32px,4vw,72px);max-width:1480px;margin:0 auto;padding-inline:var(--g)}
.rail{position:sticky;top:84px;align-self:start;padding-block:48px;max-height:calc(100vh - 84px);overflow:auto;scrollbar-width:none}
.rail::-webkit-scrollbar{display:none}
.rail ol{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:18px}
.rail li>span{display:block;font:500 11.5px/1 var(--m);color:var(--dim);margin-bottom:8px}
.rail ul{list-style:none;margin:0;padding:0 0 0 12px;border-left:1px solid var(--line)}
.rail ul a{display:block;padding:5px 0 5px 10px;margin-left:-13px;border-left:1.5px solid transparent;font:600 13.5px/1.3 var(--f);color:var(--mut);text-decoration:none;transition:color .2s,border-color .2s}
.rail ul a:hover{color:var(--rime)}
.rail ul a.on{color:var(--rime);border-left-color:var(--vul)}
main{min-width:0;padding-bottom:120px}

/* cover */
.cover{position:relative;padding-block:clamp(64px,9vw,130px) 56px;border-bottom:1px solid var(--line);overflow:hidden;isolation:isolate}
.cover-sym{position:absolute;right:-6%;top:6%;width:min(520px,48%);height:auto;color:var(--rime);opacity:.9;z-index:-1}
.cover-sym .a1,.cover-sym .a2{transform-origin:200px 200px;transform-box:view-box}
.cover .k{display:flex;flex-wrap:wrap;gap:8px 22px}
.cover h1{font-size:clamp(56px,9vw,150px);font-weight:800;letter-spacing:-.06em;line-height:.86;margin-top:26px;max-width:9ch}
.cover h1 em{font-style:normal;color:var(--vul)}
.cover .lead{font-size:clamp(18px,1.5vw,22px);line-height:1.5;color:var(--mut);max-width:42ch;margin-top:28px}
.meta{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin-top:56px;border-top:1px solid var(--line)}
.meta div{padding:16px 16px 0 0;display:flex;flex-direction:column;gap:6px}
.meta div+div{padding-left:16px;border-left:1px solid var(--line)}
.meta b{font:500 13px/1.4 var(--m);color:var(--rime);font-weight:500}
.meta span{font:500 11.5px/1 var(--m);color:var(--dim)}
.toc{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;margin-top:56px;border-top:1px solid var(--line)}
.toc a{display:flex;flex-direction:column;gap:8px;padding:18px 18px 18px 0;border-bottom:1px solid var(--line);text-decoration:none;transition:padding .5s var(--eo)}
.toc a:nth-child(3n+2),.toc a:nth-child(3n+3){padding-left:18px;border-left:1px solid var(--line)}
.toc a:hover{padding-left:12px}.toc a:nth-child(3n+2):hover,.toc a:nth-child(3n+3):hover{padding-left:30px}
.toc span{font:500 12px/1 var(--m);color:var(--vul)}
.toc b{font:800 22px/1.1 var(--f);letter-spacing:-.03em}
.toc i{font-style:normal;font-size:14px;color:var(--mut)}

/* chapter + section */
.chap{padding-top:96px}
.chap-h{display:flex;align-items:baseline;gap:18px;padding-bottom:18px;border-bottom:2px solid var(--vul)}
.chap-h span{font:500 13px/1 var(--m);color:var(--vul)}
.chap-h h2{font-size:clamp(34px,3.6vw,56px);font-weight:800;letter-spacing:-.045em;line-height:1}
.sec{padding-top:64px;scroll-margin-top:84px}
.sec-h{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:18px 48px;align-items:end;margin-bottom:34px}
.sec-h h3{font-size:clamp(30px,3vw,46px);font-weight:800;letter-spacing:-.04em;line-height:1}
.sec-h h3 small{display:block;font:500 12px/1 var(--m);letter-spacing:0;color:var(--dim);margin-bottom:12px}
.sec-h p{color:var(--mut);max-width:56ch}
.prose p{max-width:64ch;color:#C2CFD5}.prose p+p{margin-top:1em}
.prose b,.prose strong{color:var(--rime);font-weight:700}
.two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px}
.three{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.panel{background:var(--surface);box-shadow:inset 0 0 0 1px var(--line);padding:24px}
.panel h4{font:800 20px/1.15 var(--f);letter-spacing:-.025em;margin-bottom:10px}
.panel p{font-size:15px;line-height:1.55;color:var(--mut)}
.panel p b{color:var(--rime)}

/* tables */
.tw{overflow-x:auto}
table{width:100%;border-collapse:collapse;font-size:15px}
th{text-align:left;font:600 11.5px/1.2 var(--f);letter-spacing:.14em;text-transform:uppercase;color:var(--dim);padding:0 16px 12px 0;border-bottom:1px solid var(--line2)}
td{padding:14px 16px 14px 0;border-bottom:1px solid var(--line);vertical-align:top;color:#C2CFD5}
td:first-child{color:var(--rime);font-weight:700}
td code{font-size:13px;color:var(--rime);background:var(--raise);padding:2px 6px}

/* name */
.vg{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0;box-shadow:inset 0 0 0 1px var(--line)}
.vg>div{padding:28px}
.vg>div+div{border-left:1px solid var(--line)}
.vg .w{font:800 clamp(56px,7vw,110px)/.85 var(--f);letter-spacing:-.06em}
.vg .w2{color:var(--vul)}
.vg dl{display:grid;grid-template-columns:auto minmax(0,1fr);gap:8px 18px;margin:24px 0 0;font-size:15px}
.vg dt{font:500 12px/1.6 var(--m);color:var(--dim)}.vg dd{margin:0;color:#C2CFD5}
.quote{font:800 clamp(28px,3vw,46px)/1.08 var(--f);letter-spacing:-.04em;max-width:22ch}
.quote em{font-style:normal;color:var(--vul)}

/* dumbbell */
.db{background:var(--surface);box-shadow:inset 0 0 0 1px var(--line);padding:22px 24px 18px;position:relative}
.db-h{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;margin-bottom:12px}
.lg{display:flex;gap:18px;font:500 12.5px/1 var(--m);color:var(--mut)}
.lg span{display:inline-flex;align-items:center;gap:8px}
.lg i{width:11px;height:11px;display:inline-block}
.lg .c{border:2px solid var(--gangue);border-radius:50%}
.lg .v{background:var(--vul)}
.db svg{display:block;width:100%;height:auto;overflow:visible}
.db .tip{position:absolute;pointer-events:none;background:var(--rime);color:var(--noturno);font:500 12.5px/1.45 var(--m);padding:8px 10px;opacity:0;transform:translate(-50%,-110%);transition:opacity .15s;white-space:nowrap}
.db .tip.on{opacity:1}

/* logo */
.lv{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.lcard{display:flex;flex-direction:column;box-shadow:inset 0 0 0 1px var(--line)}
.lstage{position:relative;display:grid;place-items:center;min-height:240px;padding:40px;background:var(--noturno);transition:background-color .35s}
.lstage svg{display:block;max-width:100%;height:auto;transition:color .35s}
.lstage[data-g="rime"]{background:var(--rime)}.lstage[data-g="vul"]{background:var(--vul)}
.lfoot{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;padding:14px 16px;border-top:1px solid var(--line);background:var(--surface)}
.lfoot b{font:800 16px/1.2 var(--f);letter-spacing:-.02em}
.lfoot small{display:block;font:500 12px/1.4 var(--m);color:var(--dim);margin-top:4px}
.lacts{display:flex;gap:6px;flex-wrap:wrap}
.grounds{display:flex;gap:6px;align-items:center}
.gbtn{width:28px;height:28px;border:0;padding:0;cursor:pointer;box-shadow:inset 0 0 0 1px var(--line2)}
.gbtn[aria-pressed="true"]{box-shadow:0 0 0 2px var(--vul)}
.gbtn[data-g="noturno"]{background:var(--noturno)}.gbtn[data-g="rime"]{background:var(--rime)}.gbtn[data-g="vul"]{background:var(--vul)}
.mbtn{height:32px;padding:0 12px;border:0;background:transparent;box-shadow:inset 0 0 0 1px var(--line2);color:var(--rime);font:700 12.5px/1 var(--f);cursor:pointer;transition:box-shadow .2s,color .2s}
.mbtn:hover{box-shadow:inset 0 0 0 1px var(--vul);color:var(--vul)}
.dl-only{display:none}body.can-dl .dl-only{display:inline-flex;align-items:center}
.cs{position:relative;display:grid;place-items:center;padding:56px 24px;background:var(--noturno);box-shadow:inset 0 0 0 1px var(--line)}
.cs .box{position:relative;padding:var(--pad);outline:1px dashed rgba(255,65,3,.7)}
.cs .box svg{display:block;width:min(420px,60vw);height:auto;color:var(--rime);outline:1px solid rgba(228,236,239,.2)}
.cs .tag{position:absolute;font:500 11px/1 var(--m);color:var(--vul);background:var(--noturno);padding:2px 4px}
.cs .t1{top:-7px;left:50%;transform:translateX(-50%)}.cs .t2{left:-8px;top:50%;transform:translate(-100%,-50%)}
.mins{display:flex;align-items:flex-end;gap:36px;flex-wrap:wrap;padding:28px;background:var(--noturno);box-shadow:inset 0 0 0 1px var(--line)}
.mins div{display:flex;flex-direction:column;gap:12px;align-items:flex-start}
.mins span{font:500 11.5px/1.3 var(--m);color:var(--dim)}
.donts{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}
.dn{display:flex;flex-direction:column;gap:10px}
.dn .st{position:relative;display:grid;place-items:center;aspect-ratio:1;max-width:100%;background:var(--noturno);box-shadow:inset 0 0 0 1px var(--line);overflow:hidden}
.dn .st::after{content:"";position:absolute;left:-10%;right:-10%;top:50%;height:3px;background:var(--vul);transform:rotate(-45deg)}
.dn .st svg{width:62%;height:auto}
.dn b{font:700 13.5px/1.3 var(--f)}.dn span{font-size:13px;color:var(--mut);line-height:1.4}

/* color */
.sw4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.sw{position:relative;display:flex;flex-direction:column;justify-content:space-between;min-height:250px;padding:18px;border:0;text-align:left;cursor:pointer;font:inherit;transition:transform .5s var(--eo)}
.sw:hover{transform:translateY(-4px)}
.sw .nm{font:800 26px/1 var(--f);letter-spacing:-.03em}
.sw .rl{font:600 11.5px/1.2 var(--f);letter-spacing:.14em;text-transform:uppercase;opacity:.8}
.sw .hx{display:flex;justify-content:space-between;align-items:center;gap:8px;font:500 13px/1 var(--m)}
.sw .hx i{font-style:normal;font-size:11px;opacity:.7}
.sw4 .sw:nth-child(1){background:var(--vul);color:var(--noturno)}
.sw4 .sw:nth-child(2){background:var(--noturno);color:var(--vul);box-shadow:inset 0 0 0 1px var(--line2)}
.sw4 .sw:nth-child(3){background:var(--rime);color:var(--noturno)}
.sw4 .sw:nth-child(4){background:var(--gangue);color:var(--noturno)}
.sws{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-top:14px}
.sws .sw{min-height:120px;background:var(--surface);color:var(--rime);box-shadow:inset 0 0 0 1px var(--line)}
.sws .sw .chip{height:34px;margin-bottom:12px;box-shadow:inset 0 0 0 1px var(--line)}
.sws .sw .nm{font-size:17px}
.share{display:flex;height:48px;margin-top:28px;box-shadow:inset 0 0 0 1px var(--line)}
.share div{display:flex;align-items:center;padding-left:12px;font:500 12px/1 var(--m)}
.share .s1{width:85%;background:var(--noturno);color:var(--mut)}.share .s2{width:10%;background:var(--rime);color:var(--noturno)}.share .s3{width:5%;background:var(--vul)}
.ctr{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:0;margin-top:28px;border-top:1px solid var(--line)}
.ctr div{padding:14px 12px 0 0;display:flex;flex-direction:column;gap:8px}
.ctr div+div{padding-left:12px;border-left:1px solid var(--line)}
.ctr b{font:800 28px/1 var(--f);letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.ctr span{font:500 11.5px/1.35 var(--m);color:var(--dim)}
.ctr i{display:inline-block;width:10px;height:10px;margin-right:4px;vertical-align:-1px;box-shadow:inset 0 0 0 1px var(--line2)}

/* type */
.tsp{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:16px}
.tsp .panel{min-height:280px;display:flex;flex-direction:column;justify-content:space-between}
.panel .aa{font:800 clamp(110px,12vw,190px)/.8 var(--f);letter-spacing:-.06em;color:var(--rime)}
.panel .aa.m{font:400 clamp(80px,8vw,130px)/.85 var(--m);letter-spacing:-.04em}
.wts{display:flex;gap:18px;flex-wrap:wrap;font-size:20px}
.wts span:nth-child(1){font-weight:400}.wts span:nth-child(2){font-weight:500}.wts span:nth-child(3){font-weight:600}.wts span:nth-child(4){font-weight:700}.wts span:nth-child(5){font-weight:800}
.try{display:flex;gap:12px;align-items:center;margin:28px 0 8px}
.try input{flex:1;min-width:0;height:44px;border:0;border-radius:0;background:transparent;box-shadow:inset 0 -1.5px 0 var(--line2);color:var(--rime);font:600 16px/1 var(--f);padding:0 2px}
.try input:focus{outline:none;box-shadow:inset 0 -2px 0 var(--vul)}
.scale{border-top:1px solid var(--line)}
.srow{display:grid;grid-template-columns:120px minmax(0,1fr) 240px;gap:20px;align-items:baseline;padding:18px 0;border-bottom:1px solid var(--line)}
.srow .k{font:500 12px/1.4 var(--m);color:var(--vul)}
.srow .spec{font:500 12px/1.5 var(--m);color:var(--dim);text-align:right}
.srow .smp{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--rime)}

/* spacing */
.sp{display:flex;flex-direction:column;gap:8px}
.sp div{display:grid;grid-template-columns:56px minmax(0,1fr);gap:14px;align-items:center;font:500 12px/1 var(--m);color:var(--dim)}
.sp i{display:block;height:14px;background:var(--vul)}
.gridv{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:6px;padding:14px;background:var(--noturno);box-shadow:inset 0 0 0 1px var(--line);height:170px}
.gridv i{background:rgba(255,65,3,.14);box-shadow:inset 0 0 0 1px rgba(255,65,3,.35)}

/* components */
.cmp{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.cmp .panel{display:flex;flex-direction:column;gap:18px}
.row{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.b{display:inline-flex;align-items:center;gap:10px;height:48px;padding:0 24px;border:0;border-radius:0;font:700 15px/1 var(--f);cursor:pointer;transition:background-color .2s,color .2s,box-shadow .2s,transform .08s}
.b:active{transform:scale(.97)}
.b-p{background:var(--vul);color:var(--noturno)}.b-p:hover{background:var(--vulh)}
.b-s{background:transparent;color:var(--rime);box-shadow:inset 0 0 0 1px var(--line2)}.b-s:hover{box-shadow:inset 0 0 0 1px var(--rime)}
.b-g{background:transparent;color:var(--vul);padding:0 4px}.b-g:hover{color:var(--rime)}
.b[disabled]{background:var(--line);color:var(--gangue);cursor:not-allowed;box-shadow:none}
.fld{display:flex;flex-direction:column;gap:8px;max-width:360px}
.fld label{font:600 12px/1 var(--f);letter-spacing:.14em;text-transform:uppercase;color:var(--mut)}
.fld input{height:48px;background:var(--surface);border:0;box-shadow:inset 0 0 0 1px var(--line2);color:var(--rime);font:500 16px/1 var(--f);padding:0 14px;border-radius:0}
.fld input:focus{outline:none;box-shadow:inset 0 0 0 1px var(--vul)}
.fld.err input{box-shadow:inset 0 0 0 1px var(--vul)}
.fld .msg{font-size:13px;color:var(--vul)}
.tg{display:inline-flex;align-items:center;height:28px;padding:0 12px;border-radius:999px;box-shadow:inset 0 0 0 1px var(--line2);font:600 12px/1 var(--f);color:var(--rime)}
.tg.hot{box-shadow:inset 0 0 0 1px var(--vul);color:var(--vul)}
.kard{box-shadow:inset 0 0 0 1px var(--line);padding:24px;display:flex;flex-direction:column;gap:10px}
.kard b{font:800 22px/1.15 var(--f);letter-spacing:-.025em}.kard p{font-size:15px;color:var(--mut)}
.stat{border-top:2px solid var(--vul);padding-top:12px;display:flex;flex-direction:column;gap:6px}
.stat b{font:800 40px/1 var(--f);letter-spacing:-.04em;font-variant-numeric:tabular-nums}.stat span{font-size:13px;color:var(--mut)}
.con{background:var(--surface);box-shadow:inset 0 0 0 1px var(--line);font:400 13px/1.7 var(--m);padding:16px 18px;color:var(--rime);white-space:pre-wrap;overflow-x:auto}
.con .d{color:var(--gangue)}.con .x{color:var(--vul)}

/* voice */
.claims{display:grid;grid-template-columns:minmax(0,1.2fr) repeat(3,minmax(0,1fr));gap:14px}
.cl{padding:22px;box-shadow:inset 0 0 0 1px var(--line);display:flex;flex-direction:column;gap:12px;justify-content:space-between}
.cl.hero{background:var(--vul);color:var(--noturno);box-shadow:none}
.cl .label{color:inherit;opacity:.75}
.cl q{quotes:none;font:800 24px/1.12 var(--f);letter-spacing:-.03em}
.cl.hero q{font-size:clamp(40px,4vw,62px);line-height:.95;letter-spacing:-.05em}
.cl p{font-size:14px;line-height:1.5;color:var(--mut)}.cl.hero p{color:#4A1400}
.retired{margin-top:18px;font-size:15px;color:var(--mut)}
.retired s{text-decoration-color:var(--vul);text-decoration-thickness:2px;color:var(--gangue)}
.top10{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.top10 li{display:grid;grid-template-columns:56px minmax(0,1fr) auto;gap:18px;align-items:baseline;padding:18px 0;border-bottom:1px solid var(--line)}
.top10 .n{font:500 13px/1 var(--m);color:var(--vul)}
.top10 b{font:800 clamp(24px,2.4vw,36px)/1.05 var(--f);letter-spacing:-.04em}
.top10 li:first-child b{color:var(--vul)}
.top10 span{font:500 12px/1.3 var(--m);color:var(--dim);text-align:right}
.proofs{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px}
.proofs span{font-size:14px;color:#C2CFD5;box-shadow:inset 0 0 0 1px var(--line);padding:8px 12px}
.ins{border-top:1px solid var(--line)}
.ins>div{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,.9fr);gap:20px;padding:16px 0;border-bottom:1px solid var(--line);font-size:15.5px}
.ins s{color:var(--gangue);text-decoration-color:var(--vul);text-decoration-thickness:1.5px}
.ins b{color:var(--rime)}.ins span{color:var(--mut);font-size:14px}
.banned{display:flex;flex-wrap:wrap;gap:8px}
.banned span{font:600 14px/1 var(--f);padding:9px 12px;box-shadow:inset 0 0 0 1px var(--line);color:var(--gangue);text-decoration:line-through;text-decoration-color:var(--vul);text-decoration-thickness:2px}

/* motion */
.demo{position:relative;height:190px;background:var(--noturno);box-shadow:inset 0 0 0 1px var(--line);overflow:hidden;display:grid;place-items:center}
.demo .blk{width:120px;height:56px;background:var(--vul);transform:translateX(-160px);opacity:0}
.demo.go .blk{transform:none;opacity:1;transition:transform .24s cubic-bezier(.16,1,.3,1),opacity .24s}
.demo .sy{width:120px;height:120px;color:var(--rime)}
.demo .sy .a1,.demo .sy .a2{transform-origin:200px 200px;transform-box:view-box}
.demo.go .sy .a1{animation:arcA .6s cubic-bezier(.16,1,.3,1) both}
.demo.go .sy .a2{animation:arcB .6s cubic-bezier(.16,1,.3,1) both}
@keyframes arcA{from{transform:rotate(-180deg)}to{transform:none}}
@keyframes arcB{from{transform:rotate(180deg)}to{transform:none}}
.demo .word{position:relative;font:800 46px/1 var(--f);letter-spacing:-.05em;color:var(--gangue)}
.demo .word i{position:absolute;left:-.04em;right:-.03em;top:.5em;height:.085em;background:var(--vul);transform-origin:left;transform:scaleX(0)}
.demo.go .word i{transform:scaleX(1);transition:transform .34s var(--eio) .1s}
.demo .wipe{position:absolute;left:50%;top:50%;width:300%;height:300%;background:var(--vul);transform:translate(-50%,-50%) rotate(-45deg) translateY(-70%)}
.demo.go .wipe{transform:translate(-50%,-50%) rotate(-45deg) translateY(70%);transition:transform 1.1s var(--eio)}
.demo .wipe-t{position:relative;font:800 34px/1 var(--f);letter-spacing:-.04em}
.demo .fr i{position:absolute;width:16px;height:16px;border-color:var(--rime);border-style:solid;opacity:.6;transition:all .5s var(--eo)}
.demo .fr .tl{left:14px;top:14px;border-width:1.5px 0 0 1.5px}.demo .fr .tr{right:14px;top:14px;border-width:1.5px 1.5px 0 0}.demo .fr .bl{left:14px;bottom:14px;border-width:0 0 1.5px 1.5px}.demo .fr .br{right:14px;bottom:14px;border-width:0 1.5px 1.5px 0}
.demo.go .fr .tl{left:34px;top:30px}.demo.go .fr .tr{right:34px;top:30px}.demo.go .fr .bl{left:34px;bottom:30px}.demo.go .fr .br{right:34px;bottom:30px}
.demo .hudt{font:500 12px/1 var(--m);color:var(--mut);display:flex;gap:10px;align-items:center}
.demo .hudt b{width:7px;height:7px;border-radius:50%;background:var(--vul)}
.dcap{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 0 0}
.dcap b{font:800 17px/1.2 var(--f);letter-spacing:-.02em}.dcap span{display:block;font-size:13.5px;color:var(--mut);margin-top:3px}
.cvr{position:relative;aspect-ratio:4/3;max-width:100%;background:var(--vul);color:var(--noturno);overflow:hidden;container-type:inline-size}
.cvr .g{position:absolute;left:-.03em;bottom:-.2em;font:800 46cqw/.9 var(--f);letter-spacing:-.075em}
.cvr .ct{position:absolute;left:50%;top:50%;width:190%;height:15%;background:var(--noturno);transform:translate(-50%,-50%) rotate(-45deg) translateY(-120%)}
.cvr .cp{position:absolute;left:5cqw;top:5cqw;font:500 max(10px,3cqw)/1 var(--m)}

/* applications */
.appl{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:16px}
.mockh{background:var(--noturno);box-shadow:inset 0 0 0 1px var(--line);padding:26px;display:flex;flex-direction:column;gap:16px}
.mockh .label{color:var(--vul)}
.mockh h4{font:800 clamp(44px,5vw,72px)/.9 var(--f);letter-spacing:-.06em}
.mockh p{color:var(--mut);font-size:15px;max-width:40ch}
.li{aspect-ratio:1200/627;max-width:100%;background:var(--noturno);box-shadow:inset 0 0 0 1px var(--line);position:relative;padding:6%;display:flex;flex-direction:column;justify-content:space-between;container-type:inline-size}
.li b{font:800 9cqw/.95 var(--f);letter-spacing:-.05em;color:var(--rime)}
.li b em{font-style:normal;color:var(--vul)}
.li svg{width:28cqw;height:auto;color:var(--rime)}
.mail{background:var(--surface);box-shadow:inset 0 0 0 1px var(--line);padding:20px 22px;font-size:15.5px;line-height:1.6;color:#C2CFD5}
.mail .label{display:block;margin-bottom:10px}

/* appendix */
.links{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.links a{display:flex;flex-direction:column;gap:6px;padding:18px;box-shadow:inset 0 0 0 1px var(--line);text-decoration:none;transition:box-shadow .25s}
.links a:hover{box-shadow:inset 0 0 0 1px var(--vul)}
.links b{font:800 17px/1.2 var(--f);letter-spacing:-.02em}.links span{font-size:13.5px;color:var(--mut)}
.links i{font:500 11.5px/1 var(--m);font-style:normal;color:var(--vul)}
.foot{margin-top:120px;padding-top:28px;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;font:500 12px/1.5 var(--m);color:var(--dim)}
.toast{position:fixed;left:50%;bottom:calc(env(safe-area-inset-bottom,0px) + 22px);z-index:50;transform:translate(-50%,14px);opacity:0;pointer-events:none;background:var(--rime);color:var(--noturno);font:500 13px/1.45 var(--m);padding:11px 15px;max-width:min(92vw,520px);transition:opacity .25s,transform .45s var(--eo)}
.toast.on{opacity:1;transform:translate(-50%,0)}

@media (max-width:1100px){.shell{grid-template-columns:1fr}.rail{display:none}.claims{grid-template-columns:1fr 1fr}.cl.hero{grid-column:1/-1}.donts{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:820px){.sec-h,.two,.three,.lv,.tsp,.cmp,.appl,.vg{grid-template-columns:minmax(0,1fr)}.vg>div+div{border-left:0;border-top:1px solid var(--line)}.sw4,.sws{grid-template-columns:1fr 1fr}.ctr{grid-template-columns:1fr 1fr}.ctr div:nth-child(odd){padding-left:0;border-left:0}.ctr div{padding-bottom:14px}.meta{grid-template-columns:1fr 1fr}.meta div:nth-child(3){padding-left:0;border-left:0}.meta div{padding-bottom:14px}.toc{grid-template-columns:1fr}.toc a,.toc a:nth-child(3n+2),.toc a:nth-child(3n+3){padding-left:0;border-left:0}.srow{grid-template-columns:1fr}.srow .spec{text-align:left}.links{grid-template-columns:1fr}.ins>div{grid-template-columns:1fr;gap:6px}.top10 li{grid-template-columns:40px minmax(0,1fr)}.top10 span{grid-column:2;text-align:left}.top-l .label{display:none}.cover-sym{opacity:.25;width:70%}}
@media (max-width:520px){.donts{grid-template-columns:1fr 1fr}.claims{grid-template-columns:1fr}.top-r .pill:first-child{display:none}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}html{scroll-behavior:auto}}