:root{--bg:#06070B;--elev:#0C0F16;--surface:#12161F;--stroke:rgba(255,255,255,.08);--text:#EEF1F7;--dim:#98A2B3;--faint:#7A8494;--gold:#F2C14E;--goldb:#FFD97A;--ink:#1C1403}
*{box-sizing:border-box}html{color-scheme:dark}
body{margin:0;background:var(--bg);color:var(--text);font:16px/1.5 Inter,system-ui,"Segoe UI",Roboto,sans-serif;-webkit-font-smoothing:antialiased}
main{max-width:760px;margin:0 auto;padding:56px 24px 80px;position:relative}
main::before{content:"";position:absolute;left:-40px;right:-40px;top:-60px;height:320px;background:radial-gradient(60% 60% at 30% 20%,rgba(242,193,78,.10),transparent 70%);pointer-events:none;z-index:-1}
header{display:flex;align-items:center;gap:16px;margin-bottom:40px}
header img{width:56px;height:56px}
header .word{font-size:28px;font-weight:700;letter-spacing:-.5px}
h1{font-size:40px;line-height:1.08;letter-spacing:-.8px;margin:0 0 16px}
h2{font-size:22px;letter-spacing:-.3px;margin:40px 0 10px}
p{margin:0 0 14px}.dim{color:var(--dim)}
a{color:var(--gold)}a:hover{color:var(--goldb)}
.btns{display:flex;flex-wrap:wrap;gap:12px;margin:24px 0 8px}
.btn{display:inline-block;padding:12px 18px;border-radius:12px;font-weight:600;text-decoration:none;border:1px solid var(--stroke);background:var(--surface);color:var(--text)}
.btn:hover{background:#1A2030;color:var(--text)}
.btn.primary{background:var(--gold);color:var(--ink);border-color:transparent}.btn.primary:hover{background:var(--goldb);color:var(--ink)}
code{font:14px ui-monospace,Consolas,monospace;background:var(--elev);border:1px solid var(--stroke);border-radius:6px;padding:1px 6px;word-break:break-all}
footer{margin-top:56px;padding-top:20px;border-top:1px solid var(--stroke);color:var(--faint);font-size:14px}
footer a{color:var(--dim)}
ul{padding-left:20px}li{margin:4px 0}
@media (prefers-reduced-motion:no-preference){main{animation:rise .6s ease-out both}@keyframes rise{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}}