:root { --bg:#0f1012; --panel:#17181c; --panel-2:#1f2026; --line:#2a2c33; --text:#e8e8ea; --muted:#8b8d96; --accent:#7c8cff; --danger:#ff6961;
  font-family:-apple-system,BlinkMacSystemFont,'SF Pro Text','Helvetica Neue',sans-serif; font-size:16px; color:var(--text); background:var(--bg); color-scheme:dark; }
* { box-sizing:border-box; }
body { margin:0; min-height:100vh; }
a { color:var(--accent); }
button { font:inherit; color:inherit; cursor:pointer; }
.btn { background:var(--panel-2); border:1px solid var(--line); border-radius:8px; padding:8px 14px; }
.btn:hover:not(:disabled) { border-color:var(--muted); }
.btn.primary { background:var(--accent); border-color:var(--accent); color:#0e0f14; font-weight:600; }
.btn.danger { color:var(--danger); }
.btn.danger:hover:not(:disabled) { border-color:var(--danger); }
.btn.solid-danger { background:#d93a31; border-color:#d93a31; color:#fff; font-weight:600; }
.corner { position:absolute; top:14px; right:18px; font-size:13px; color:var(--muted); text-decoration:none; }
.corner:hover { color:var(--text); }
.hero { max-width:640px; margin:0 auto; padding:72px 20px 40px; text-align:center; }
.hero img { width:96px; height:96px; border-radius:22px; }
.hero h1 { font-size:40px; margin:18px 0 12px; }
.hero p { color:var(--muted); line-height:1.55; margin:0 0 10px; }
.dl { display:inline-block; margin-top:22px; padding:16px 30px; font-size:19px; border-radius:12px; text-decoration:none; background:var(--accent); color:#0e0f14; font-weight:700; }
.dl:hover { filter:brightness(1.1); }
.ver { color:var(--muted); font-size:13px; margin-top:10px; min-height:18px; }
.card { max-width:640px; margin:24px auto; padding:22px 24px; background:var(--panel); border:1px solid var(--line); border-radius:12px; line-height:1.55; }
.card h2 { margin:0 0 10px; font-size:19px; }
.card ol { padding-left:20px; margin:0 0 12px; }
.card code { background:var(--panel-2); border:1px solid var(--line); border-radius:6px; padding:3px 7px; font-size:13px; word-break:break-all; }
.cmd { display:flex; gap:8px; align-items:center; flex-wrap:wrap; margin:8px 0; }
.small { color:var(--muted); font-size:14px; }
@media (max-width:480px) { .hero { padding-top:64px; } .hero h1 { font-size:32px; } .dl { display:block; } }
