/* yBoost — the app's tokens, as CSS. Keep in sync with app/lib/theme/tokens.dart */
:root{
  --bg:#08080B; --surface:#141419; --border:rgba(255,255,255,.07);
  --accent:#FF3B47; --accent-bright:#FF5A64; --accent-deep:#D0101C;
  --coin:#FFCB45; --success:#34D27B;
  --text:#fff; --muted:#9A9AA6; --dim:#8B8B94; --ghost:#63636E;
  --radius:20px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0; background:var(--bg); color:var(--text);
  font-family:Inter,system-ui,-apple-system,sans-serif; line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,.display{font-family:'Space Grotesk',Inter,sans-serif;font-weight:700;line-height:1.2}
a{color:var(--accent-bright);text-decoration:none}
a:hover{color:var(--accent);text-decoration:underline}
.wrap{max-width:860px;margin:0 auto;padding:0 20px}
header{padding:28px 0;border-bottom:1px solid var(--border)}
.bar{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
.brand{display:flex;align-items:center;gap:12px}
.mark{width:40px;height:40px;border-radius:12px;background:linear-gradient(135deg,#FF4551,var(--accent-deep));
  display:grid;place-items:center;box-shadow:0 8px 20px rgba(255,59,71,.35);flex:none}
.wordmark{font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:22px;letter-spacing:-.5px}
nav{display:flex;gap:20px;font-size:14px}
nav a{color:var(--muted)}
.hero{padding:76px 0 56px;text-align:center;position:relative;overflow:hidden}
.hero::before{content:"";position:absolute;top:-180px;left:50%;transform:translateX(-50%);
  width:520px;height:520px;background:radial-gradient(circle,rgba(255,59,71,.20),transparent 68%);
  filter:blur(24px);pointer-events:none}
.hero h1{font-size:clamp(34px,7vw,54px);letter-spacing:-1.5px;margin:0 0 16px;position:relative}
.hero p{color:var(--muted);font-size:clamp(16px,2.4vw,19px);max-width:560px;margin:0 auto;position:relative}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:16px;margin:44px 0}
.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:24px}
.card h3{margin:0 0 8px;font-size:17px}
.card p{margin:0;color:var(--dim);font-size:14.5px}
.step{color:var(--coin);font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:13px;letter-spacing:1.2px}
main.doc{padding:44px 0 80px}
main.doc h1{font-size:34px;margin:0 0 6px}
.updated{color:var(--ghost);font-size:13.5px;margin-bottom:34px}
main.doc h2{font-size:20px;margin:36px 0 10px}
main.doc p,main.doc li{color:var(--dim);font-size:15px}
main.doc ul{padding-left:20px}
main.doc strong{color:var(--text)}
.notice{background:rgba(255,203,69,.08);border:1px solid rgba(255,203,69,.3);
  border-radius:14px;padding:16px 18px;margin:28px 0}
.notice p{color:var(--coin);margin:0;font-size:14px}
footer{border-top:1px solid var(--border);padding:28px 0 46px;color:var(--ghost);font-size:13.5px}
footer a{color:var(--muted)}
.foot{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
