:root{
  --bg:#0A0B10;
  --bg-elevated:#10121A;
  --card:#141722;
  --card-2:#181B26;
  --line:#232735;
  --accent:#D6FF3F;
  --accent-dim:#4A5A16;
  --accent-glow: rgba(214,255,63,0.14);
  --cream:#EDEFF5;
  --cream-dim:#5C6272;
  --radius:18px;
  --radius-sm:12px;
  --font-display:'Unbounded', sans-serif;
  --font-body:'Space Grotesk', sans-serif;
  --font-mono:'Space Mono', monospace;
}
*{ box-sizing:border-box; }
html,body{ margin:0; padding:0; }
body{
  background:
    radial-gradient(ellipse 900px 500px at 50% -10%, rgba(214,255,63,0.06), transparent 60%),
    var(--bg);
  color:var(--cream);
  font-family:var(--font-body);
  min-height:100vh;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
a{ color:var(--accent); }
.wrap{ max-width:720px; margin:0 auto; padding:20px 18px 60px; }

header{
  display:flex; align-items:center; justify-content:space-between;
  padding:6px 2px 22px; border-bottom:1px solid var(--line); margin-bottom:26px;
}
.brand-eyebrow{
  font-family:var(--font-mono); font-size:9.5px; letter-spacing:0.22em;
  color:var(--cream-dim); text-transform:uppercase; margin-bottom:3px;
}
.brand-wordmark{
  font-family:var(--font-display); font-weight:900; font-size:20px; color:var(--cream); line-height:1;
  text-decoration:none;
}
.brand-wordmark span{ color:var(--accent); }
nav a{
  font-family:var(--font-mono); font-size:11px; letter-spacing:0.06em;
  text-transform:uppercase; text-decoration:none; color:var(--cream-dim);
  margin-left:18px;
}
nav a:hover{ color:var(--accent); }

h1{
  font-family:var(--font-display); font-weight:700; font-size:clamp(26px,6vw,38px); line-height:1.2;
  margin:0 0 14px;
}
h2{
  font-family:var(--font-display); font-weight:700; font-size:19px; margin:36px 0 12px; color:var(--cream);
}
p{ color:var(--cream-dim); margin:0 0 14px; }
p.lede{ color:var(--cream); font-size:17px; }
ul.steps{ padding-left:0; list-style:none; margin:0 0 20px; }
ul.steps li{
  background:var(--card); border:1px solid var(--line); border-radius:var(--radius-sm);
  padding:12px 16px; margin-bottom:8px; color:var(--cream); font-size:14.5px;
}
ul.steps li b{ color:var(--accent); font-family:var(--font-mono); margin-right:8px; }

.cta{
  display:inline-block; background:var(--accent); border:1px solid var(--accent);
  color:var(--bg); font-weight:700; font-family:var(--font-display); font-size:14px;
  padding:14px 26px; border-radius:var(--radius-sm); text-decoration:none; margin:12px 0 8px;
}
.cta:hover{ filter:brightness(1.08); }

details{
  background:var(--bg-elevated); border:1px solid var(--line); border-radius:var(--radius-sm);
  padding:14px 16px; margin-bottom:10px;
}
summary{
  font-family:var(--font-mono); font-size:12px; letter-spacing:0.03em; cursor:pointer;
  color:var(--cream); font-weight:700;
}
details p{ margin:10px 0 0; font-size:14px; }

.hazard{
  height:1px; margin:30px 0; background:var(--line);
}

footer{
  margin-top:40px; text-align:center; font-family:var(--font-mono);
  font-size:10px; color:var(--cream-dim); line-height:1.7;
}
footer a{ color:var(--cream-dim); }