
:root{--bg:#1a1f2e;--ink:#f5f7fa;--muted:#aab3c6;--panel:#22293b;--line:#2f374d;--brand:#ef4444;--brand2:#3b82f6}
[data-theme="light"]{--bg:#f7f9fe;--ink:#111827;--muted:#606b80;--panel:#ffffff;--line:#d0d7e6;--brand:#2563eb;--brand2:#16a34a}

body{margin:0;font-family:ui-sans-serif,system-ui;line-height:1.6;background:var(--bg);color:var(--ink)}
.banner{position:sticky;top:0;background:var(--panel);border-bottom:1px solid var(--line);z-index:10}
.banner .inner{display:flex;align-items:center;justify-content:space-between;padding:.6rem 0;width:min(1100px,92%);margin:0 auto}
.logo{text-decoration:none;font-weight:700;color:var(--ink)}
.menu ul{list-style:none;display:flex;gap:.8rem;margin:0;padding:0}
.menu a{color:var(--muted);text-decoration:none}
.menu a:hover{color:var(--ink)}
.btn{background:linear-gradient(135deg,var(--brand),var(--brand2));color:#fff;border:none;padding:.5rem .9rem;border-radius:.5rem;cursor:pointer}
.btn.ghost{background:transparent;border:1px solid var(--line);color:var(--ink)}
.hero{padding:4rem 0;text-align:center;background:linear-gradient(160deg,var(--brand)20%,transparent)}
.panels{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin:2rem 0}
.panel{background:var(--panel);padding:1rem;border:1px solid var(--line);border-radius:.6rem}
.timeline ul{list-style:none;padding:0}
.timeline li{margin:.4rem 0}
.wrap{width:min(1100px,92%);margin:0 auto}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}
.grid.form{grid-template-columns:1fr 1fr}
.grid.form .full{grid-column:1/-1}
.form input,.form textarea{background:var(--panel);border:1px solid var(--line);color:var(--ink);padding:.6rem;border-radius:.5rem;width:100%}
.footer{margin-top:2rem;padding:2rem 0;border-top:1px solid var(--line)}
.plain{list-style:none;padding:0}
.note{color:var(--muted)}
.tiny{font-size:.9rem;color:var(--muted)}
.hidden{display:none}
