:root{
  --surface:#12121d;--surface-container:#1f1e2a;--surface-high:#292935;
  --on-surface:#e3e0f1;--on-surface-variant:#b5aec9;
  --pink-soft:#ffaede;--pink-deep:#ff34cd;--cyan-soft:#74f5ff;--violet:#a078ff;
  --font-head:'Plus Jakarta Sans',system-ui,sans-serif;--font-body:'Inter',system-ui,sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
body{background:var(--surface);color:var(--on-surface);font-family:var(--font-body);line-height:1.7;font-size:16px}
.wrap{max-width:820px;margin:0 auto;padding:0 clamp(16px,5vw,64px)}
header.topbar{position:sticky;top:0;z-index:100;display:flex;align-items:center;justify-content:space-between;padding:14px clamp(16px,5vw,64px);background:rgba(18,18,29,.9);backdrop-filter:blur(18px);border-bottom:1px solid rgba(88,63,78,.35)}
.brandlogo{height:40px;width:auto}
.back{font-size:13px;color:var(--cyan-soft)}
main{padding:56px 0 80px}
h1{font-family:var(--font-head);font-weight:800;font-size:clamp(28px,4vw,38px);margin-bottom:28px;background:linear-gradient(90deg,var(--pink-soft),var(--cyan-soft));-webkit-background-clip:text;background-clip:text;color:transparent}
h2{font-family:var(--font-head);font-weight:700;font-size:1.25rem;margin:36px 0 12px}
p,li{color:var(--on-surface-variant);margin-bottom:12px}
a{color:var(--cyan-soft)}
ul{padding-left:20px;margin-bottom:12px}
.note{margin-top:48px;padding:18px 20px;border-radius:12px;background:rgba(255,95,208,.08);border:1px solid rgba(255,95,208,.2);font-size:.88rem}
footer{padding:32px 0;border-top:1px solid rgba(255,255,255,.08);text-align:center;font-size:.82rem;color:var(--on-surface-variant)}