:root{--bg:#f5f6f8;--sf:#fff;--sf2:#f9fafb;--ink:#0f172a;--ink2:#334155;--mute:#64748b;--line:#e2e8f0;--acc:#e8590c;--acci:#c2410c;--accs:#fff1e8;--ok:#16a34a;--mid:#d97706;--bad:#dc2626;--info:#2563eb;--hero1:#0b1220;--hero2:#1c2740;--sh:0 1px 2px rgba(15,23,42,.05),0 4px 16px rgba(15,23,42,.06);--sh2:0 2px 4px rgba(15,23,42,.06),0 12px 32px rgba(15,23,42,.12);--r:14px}
@media(prefers-color-scheme:dark){:root{--bg:#0a0e16;--sf:#121826;--sf2:#0f1521;--ink:#e6eaf2;--ink2:#c3cad6;--mute:#8b97ab;--line:#222c3d;--acc:#ff8a4c;--acci:#ff9d66;--accs:#2a1a10;--hero1:#070b13;--hero2:#141d31;--sh:0 1px 2px rgba(0,0,0,.4);--sh2:0 8px 30px rgba(0,0,0,.5)}}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
html,body{overflow-x:clip}body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.65 Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Noto Sans","Helvetica Neue",Arial,sans-serif;-webkit-font-smoothing:antialiased}
a{color:var(--acci);text-decoration:none}a:hover{text-decoration:underline}
svg{width:20px;height:20px;flex:none}
:focus-visible{outline:3px solid var(--acc);outline-offset:2px;border-radius:6px}
.skip{position:absolute;inset-inline-start:8px;top:-80px;background:var(--acc);color:#fff;padding:8px 14px;border-radius:8px;z-index:99}.skip:focus{top:8px}
.w{max-width:1160px;margin:0 auto;padding:0 20px}
/* header */
.hd{position:sticky;top:0;z-index:50;background:color-mix(in srgb,var(--sf) 88%,transparent);backdrop-filter:saturate(180%) blur(12px);-webkit-backdrop-filter:saturate(180%) blur(12px);border-bottom:1px solid var(--line)}
.hd .w{display:flex;align-items:center;gap:20px;height:64px}
.logo{display:inline-flex;align-items:center;gap:10px;font-weight:800;font-size:17px;color:var(--ink);letter-spacing:-.02em;white-space:nowrap}.logo:hover{text-decoration:none}.logo svg{width:32px;height:32px}.logo b{color:var(--acc);font-weight:800}
nav.top{display:flex;gap:2px;flex:1;min-width:0;align-items:center}.nd>summary{font-size:14px;color:var(--ink2)}.nd>summary[aria-current]{color:var(--acci);background:var(--accs)}.nd .ddp{inset-inline-end:auto;inset-inline-start:0;min-width:240px}.nd .ddp a{display:flex;align-items:center;gap:10px;font-weight:600}.nd .ddp svg{color:var(--acc)}
nav.top a{color:var(--ink2);font-size:14px;font-weight:600;padding:7px 10px;border-radius:8px;white-space:nowrap}nav.top a:hover{background:var(--sf2);color:var(--ink);text-decoration:none}nav.top a[aria-current]{color:var(--acci);background:var(--accs)}
form.hs{display:flex;align-items:center;gap:6px;background:var(--sf2);border:1px solid var(--line);border-radius:10px;padding:0 10px;height:38px;width:210px;color:var(--mute)}
form.hs input{border:0;background:none;font:inherit;font-size:14px;color:var(--ink);width:100%;outline:0;min-width:0}form.hs:focus-within{border-color:var(--acc)}
details.dd{position:relative}details.dd>summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:6px;color:var(--ink2);font-size:14px;font-weight:600;padding:8px 10px;border-radius:8px;white-space:nowrap}details.dd>summary::-webkit-details-marker{display:none}details.dd>summary:hover{background:var(--sf2)}
.ddp{position:absolute;inset-inline-end:0;top:calc(100% + 8px);background:var(--sf);border:1px solid var(--line);border-radius:14px;box-shadow:var(--sh2);padding:8px;z-index:60}
.lngp{display:grid;grid-template-columns:repeat(3,minmax(110px,1fr));gap:2px;max-height:70vh;overflow:auto;width:min(420px,92vw)}
.ddp a{display:block;padding:7px 10px;border-radius:8px;font-size:14px;color:var(--ink)}.ddp a:hover{background:var(--sf2);text-decoration:none}.ddp a[aria-current]{background:var(--accs);color:var(--acci);font-weight:700}
.mm{display:none}.mmp{width:min(320px,92vw);display:flex;flex-direction:column}.mmp a{display:flex;align-items:center;gap:10px;font-weight:600;padding:10px 12px}.mmp a svg{color:var(--acc)}
.mmp form{display:flex;gap:6px;margin:4px 4px 8px;border:1px solid var(--line);border-radius:10px;padding:0 10px;height:42px;align-items:center;color:var(--mute)}.mmp form input{border:0;background:none;font:inherit;color:var(--ink);width:100%;outline:0}
@media(max-width:1440px){form.hs{display:none}}@media(max-width:1180px){nav.top a{padding:7px 7px;font-size:13.5px}}
@media(max-width:980px){nav.top{display:none}.mm{display:block}.hd .w{justify-content:space-between}.spacer{flex:1}}
/* hero */
.hero{background:radial-gradient(1200px 400px at 80% -10%,rgba(232,89,12,.35),transparent 60%),linear-gradient(160deg,var(--hero1),var(--hero2));color:#fff;padding:64px 0 96px;position:relative;overflow:hidden}
.hero:after{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);background-size:44px 44px;mask-image:linear-gradient(180deg,#000,transparent);pointer-events:none}
.hero .w{position:relative;z-index:1;max-width:880px;text-align:center}
.eyebrow{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:600;color:#ffd8c2;background:rgba(232,89,12,.18);border:1px solid rgba(255,138,76,.35);padding:5px 12px;border-radius:99px}
.hero h1{font-size:clamp(32px,5.6vw,56px);line-height:1.08;letter-spacing:-.035em;margin:18px 0 14px;color:#fff}
.hero p.lead{color:#c8d1df;font-size:clamp(16px,2.2vw,19px);max-width:680px;margin:0 auto}
form.s{display:flex;align-items:center;gap:8px;margin:30px auto 0;max-width:680px;background:var(--sf);border-radius:16px;padding:8px;box-shadow:0 20px 50px rgba(0,0,0,.35)}
form.s>svg{margin-inline-start:10px;color:var(--mute);width:22px;height:22px}
form.s input{flex:1;min-width:0;border:0;outline:0;background:none;font:inherit;font-size:18px;padding:10px 6px;color:var(--ink)}
form.s button{font:inherit;font-weight:700;font-size:16px;padding:12px 22px;border:0;border-radius:11px;background:var(--acc);color:#fff;cursor:pointer;white-space:nowrap}form.s button:hover{background:var(--acci)}
.tries{margin:16px 0 0;font-size:14px;color:#9fb0c7;display:flex;gap:8px;justify-content:center;flex-wrap:wrap;align-items:center}.tries a{color:#fff;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);padding:3px 10px;border-radius:8px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:13px}.tries a:hover{background:rgba(255,255,255,.16);text-decoration:none}
#res{max-width:680px;margin:10px auto 0;text-align:start}#res:empty{display:none}
#res .rl{background:var(--sf);color:var(--ink);border-radius:14px;box-shadow:var(--sh2);overflow:hidden;max-height:420px;overflow-y:auto}
#res a{display:flex;gap:12px;align-items:baseline;padding:11px 16px;border-bottom:1px solid var(--line);color:var(--ink)}#res a:hover{background:var(--sf2);text-decoration:none}#res a b{color:var(--acci);font-family:ui-monospace,Menlo,monospace;min-width:64px}#res a span{color:var(--ink2);font-size:14px}
#res p{background:var(--sf);color:var(--ink);padding:14px 16px;border-radius:14px;margin:0}
.stats{display:flex;justify-content:center;gap:clamp(20px,6vw,56px);margin-top:34px;flex-wrap:wrap}.stats div{display:flex;flex-direction:column}.stats b{font-size:28px;letter-spacing:-.02em}.stats span{font-size:13px;color:#9fb0c7}
/* sections */
.sec{padding:56px 0 8px}.sec h2,.sh{font-size:clamp(22px,3vw,28px);letter-spacing:-.025em;line-height:1.2;margin:0 0 6px}.sec .sub{color:var(--mute);margin:0 0 22px}
.lift{margin-top:-56px;position:relative;z-index:2}
.cats{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:14px}
.cat{position:relative;display:flex;flex-direction:column;gap:6px;background:var(--sf);border:1px solid var(--line);border-radius:var(--r);padding:20px;color:var(--ink);box-shadow:var(--sh);transition:transform .18s,box-shadow .18s,border-color .18s}
.cat:hover{transform:translateY(-3px);box-shadow:var(--sh2);border-color:color-mix(in srgb,var(--acc) 40%,var(--line));text-decoration:none}
.ic{width:46px;height:46px;border-radius:12px;background:var(--accs);color:var(--acc);display:grid;place-items:center;margin-bottom:8px}.ic svg{width:26px;height:26px}
.cat b{font-size:16px;line-height:1.3}.cat span{font-size:13px;color:var(--mute)}.cat .ar{position:absolute;top:20px;inset-inline-end:18px;color:var(--mute);width:18px;height:18px;transition:transform .18s}.cat:hover .ar{color:var(--acc);transform:translateX(3px)}
[dir=rtl] .ar{transform:scaleX(-1)}[dir=rtl] .cat:hover .ar{transform:scaleX(-1) translateX(3px)}
.brand{flex-direction:row;align-items:center;gap:14px;padding:16px}.cat.brand .ar{position:static;margin-inline-start:auto}.brand .av{flex:none}.brand div{display:flex;flex-direction:column;min-width:0}
.av{width:44px;height:44px;border-radius:12px;background:linear-gradient(135deg,var(--accs),color-mix(in srgb,var(--accs) 60%,var(--sf)));color:var(--acci);display:grid;place-items:center;font-weight:800;font-size:18px;border:1px solid color-mix(in srgb,var(--acc) 18%,transparent)}
.steps3{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px}.step{background:var(--sf);border:1px solid var(--line);border-radius:var(--r);padding:22px;box-shadow:var(--sh)}.step .n{width:34px;height:34px;border-radius:10px;background:var(--ink);color:var(--sf);display:grid;place-items:center;font-weight:800;margin-bottom:12px}.step b{display:block;font-size:17px;margin-bottom:4px}.step p{margin:0;color:var(--mute);font-size:15px}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:10px}
.chip{display:flex;flex-direction:column;gap:2px;background:var(--sf);border:1px solid var(--line);border-radius:12px;padding:12px 14px;color:var(--ink);transition:border-color .15s,box-shadow .15s,transform .15s}
.chip:hover{border-color:color-mix(in srgb,var(--acc) 45%,var(--line));box-shadow:var(--sh);transform:translateY(-1px);text-decoration:none}
.chip b{color:var(--ink);font-size:15px}.chip b em{font-style:normal;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--acci)}.chip span{font-size:13px;color:var(--mute);line-height:1.4}
/* page head */
.ph{background:linear-gradient(180deg,var(--sf),var(--bg));border-bottom:1px solid var(--line);padding:22px 0 30px}
.ph h1{overflow-wrap:anywhere;font-size:clamp(28px,4.4vw,42px);line-height:1.12;letter-spacing:-.03em;margin:14px 0 10px}.ph .lead{color:var(--ink2);font-size:18px;max-width:760px;margin:0}
.ph .hrow{display:flex;gap:18px;align-items:flex-start}.ph .hrow .ic{width:56px;height:56px;margin-top:14px}.ph .hrow .ic svg{width:30px;height:30px}
ol.bc{display:flex;flex-wrap:wrap;gap:6px;list-style:none;padding:0;margin:0;font-size:13px;color:var(--mute)}ol.bc li+li:before{content:"/";margin-inline-end:6px;color:var(--line)}ol.bc a{color:var(--mute)}ol.bc a:hover{color:var(--acci)}
.badge{display:inline-flex;align-items:center;gap:8px;margin-top:16px}.code{font:800 15px/1 ui-monospace,SFMono-Regular,Menlo,monospace;background:var(--ink);color:var(--sf);padding:7px 11px;border-radius:9px;letter-spacing:.02em}
.pill{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:700;padding:5px 10px;border-radius:99px;background:var(--sf2);border:1px solid var(--line)}.pill .dot{width:8px;height:8px;border-radius:50%}
.s0 .dot{background:var(--info)}.s1 .dot{background:var(--ok)}.s2 .dot{background:var(--mid)}.s3 .dot{background:var(--bad)}
.alt{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin:10px 0 0;font-size:14px;color:var(--mute)}.alt code{background:var(--sf);border:1px solid var(--line);border-radius:6px;padding:2px 8px;font-size:13px;color:var(--ink)}
/* layout */
.lay{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:48px;padding-top:32px;padding-bottom:24px;align-items:start}
@media(max-width:980px){.lay{grid-template-columns:1fr;gap:8px}}
article{min-width:0;max-width:760px}article h2{font-size:22px;letter-spacing:-.02em;margin:38px 0 14px;display:flex;align-items:center;gap:10px}article h2 svg{color:var(--acc);width:22px;height:22px}
article p{color:var(--ink2)}
.card{background:var(--sf);border:1px solid var(--line);border-radius:var(--r);padding:20px 22px;margin:16px 0;box-shadow:var(--sh)}
.qa{border:1px solid color-mix(in srgb,var(--acc) 30%,var(--line));background:linear-gradient(135deg,var(--accs),var(--sf) 75%);position:relative}
.qa strong{display:flex;align-items:center;gap:8px;font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:var(--acci);margin-bottom:6px}.qa strong svg{width:16px;height:16px}.qa p{margin:0;font-size:17px;color:var(--ink);line-height:1.6}
.warn{border-color:color-mix(in srgb,var(--bad) 35%,var(--line));background:color-mix(in srgb,var(--bad) 7%,var(--sf));display:flex;gap:12px;color:var(--ink)}.warn svg{color:var(--bad);margin-top:2px}
.note{display:flex;gap:12px;border-color:color-mix(in srgb,var(--mid) 35%,var(--line))}.note svg{color:var(--mid);margin-top:2px}
.use{display:flex;flex-direction:column;gap:8px;align-items:flex-start}.use .meter{width:100%}.use p{margin:4px 0 0;color:var(--ink2)}
.meter{display:flex;gap:5px;max-width:260px}.meter i{flex:1;height:8px;border-radius:4px;background:var(--line)}
.m1 i:nth-child(1){background:var(--ok)}.m2 i:nth-child(-n+2){background:var(--mid)}.m3 i{background:var(--bad)}.m0 i:nth-child(1){background:var(--info)}
ul.ck{list-style:none;padding:0;margin:0;display:grid;gap:8px}ul.ck li{display:flex;gap:12px;align-items:flex-start;background:var(--sf);border:1px solid var(--line);border-radius:12px;padding:12px 14px;color:var(--ink2)}ul.ck li svg{color:var(--acc);margin-top:2px}
ol.st{list-style:none;padding:0;margin:0;counter-reset:s}ol.st li{counter-increment:s;position:relative;padding:2px 0 18px;padding-inline-start:48px;color:var(--ink2)}
ol.st li:before{content:counter(s);position:absolute;inset-inline-start:0;top:0;width:32px;height:32px;border-radius:50%;background:var(--ink);color:var(--sf);display:grid;place-items:center;font-weight:800;font-size:14px}
ol.st li:not(:last-child):after{content:"";position:absolute;inset-inline-start:15px;top:36px;bottom:2px;width:2px;background:var(--line)}
details.f{background:var(--sf);border:1px solid var(--line);border-radius:12px;margin:8px 0;padding:0 18px}details.f summary{cursor:pointer;font-weight:650;padding:14px 0;list-style:none;display:flex;justify-content:space-between;gap:12px}details.f summary::-webkit-details-marker{display:none}
details.f summary:after{content:"+";font-size:22px;line-height:1;color:var(--mute);transition:transform .2s}details.f[open] summary:after{transform:rotate(45deg)}details.f p{margin:0 0 16px;color:var(--ink2)}
aside{position:sticky;top:84px;display:flex;flex-direction:column;gap:14px}@media(max-width:980px){aside{position:static}}
.gl{background:var(--sf);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh);overflow:hidden}.gl h3{margin:0;font-size:13px;text-transform:uppercase;letter-spacing:.08em;color:var(--mute);padding:14px 18px;border-bottom:1px solid var(--line);background:var(--sf2)}
.gl dl{margin:0;padding:6px 18px 12px}.gl dl div{display:flex;justify-content:space-between;gap:14px;padding:9px 0;border-bottom:1px dashed var(--line);font-size:14px}.gl dl div:last-child{border:0}.gl dt{color:var(--mute)}.gl dd{margin:0;font-weight:650;text-align:end}
.gl .src{padding:12px 18px;border-top:1px solid var(--line);font-size:13px;display:flex;flex-direction:column;gap:6px}.gl .src a{display:flex;align-items:center;gap:6px;word-break:break-all}.gl .src svg{width:14px;height:14px}
.rep{font-size:14px;color:var(--mute);display:flex;gap:8px;align-items:center;padding:0 4px}.rep svg{width:16px;height:16px}
.meta{font-size:13px;color:var(--mute)}
.prose{max-width:760px;padding:28px 0 8px}.prose p,.prose li{color:var(--ink2)}.prose h2{font-size:22px;margin:32px 0 10px}
.srcl{list-style:none;padding:0;margin:0 0 8px;display:grid;gap:6px}.srcl li{background:var(--sf);border:1px solid var(--line);border-radius:10px;padding:10px 14px;font-size:14px}.srcl b{display:inline-block;min-width:150px}
.sevs{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:8px;margin:10px 0 0}
/* footer */
footer{margin-top:72px;background:var(--hero1);color:#b4bfd0;padding:52px 0 28px;font-size:14px}
footer .cols{display:grid;grid-template-columns:1.6fr repeat(3,1fr);gap:32px}@media(max-width:800px){footer .cols{grid-template-columns:1fr 1fr}footer .cols>div:first-child{grid-column:1/-1}}
footer h4{color:#fff;font-size:13px;text-transform:uppercase;letter-spacing:.08em;margin:0 0 12px}footer ul{list-style:none;padding:0;margin:0;display:grid;gap:8px}footer a{color:#b4bfd0}footer a:hover{color:#fff}
footer .logo{color:#fff}footer p{margin:12px 0 0;max-width:420px;line-height:1.6}
footer .bot{border-top:1px solid rgba(255,255,255,.08);margin-top:36px;padding-top:20px;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;font-size:13px;color:#7f8ba0}
.vid{margin:16px 0}.yt,.vid iframe{position:relative;display:block;width:100%;aspect-ratio:16/9;border:0;border-radius:var(--r);background:#000 center/cover no-repeat;cursor:pointer;overflow:hidden}.yt span{position:absolute;inset:0;margin:auto;width:72px;height:50px;border-radius:14px;background:rgba(220,38,38,.92);color:#fff;font-size:24px;display:grid;place-items:center}
@media print{.hd,footer,aside,.rep,#res{display:none}.lay{display:block}body{background:#fff}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}