:root{--bg:#101114;--surface:#1A1C21;--raised:#222630;--text:#F3F4F7;--text2:#A8AFBC;--muted:#8E98A8;--divider:#2B2F38;--action:#2067B5;--accent:#69B2F3;--warn-fg:#E9BE74;--warn-bg:#352C1E;--focus:#8AC3F5}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--text);font:16px/1.6 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif}
.wrap{max-width:720px;margin:0 auto;padding:24px 16px 48px}
header.top{border-bottom:1px solid var(--divider);background:var(--surface)}
header.top .wrap{padding:14px 16px;display:flex;justify-content:space-between;align-items:center;gap:12px}
.brand{color:var(--text);font-weight:700;text-decoration:none}
h1{font-size:1.75rem;line-height:1.25;margin:8px 0 4px}
h2{font-size:1.2rem;margin:32px 0 8px}
p,li{color:var(--text2)}
ul{padding-left:20px}
a{color:var(--accent)}
a:focus-visible{outline:2px solid var(--focus);outline-offset:2px;border-radius:4px}
.meta{color:var(--muted);font-size:.9rem}
.note{background:var(--warn-bg);color:var(--warn-fg);border-radius:12px;padding:10px 14px;margin:16px 0;font-size:.95rem}
.cards{display:grid;gap:12px;margin:24px 0}
.card{display:block;background:var(--surface);border:1px solid var(--divider);border-radius:16px;padding:16px;text-decoration:none;color:var(--text);min-height:48px}
.card span{display:block;color:var(--text2);font-size:.9rem}
.btn{display:inline-block;background:var(--action);color:#fff;border-radius:999px;padding:10px 20px;text-decoration:none;min-height:44px}
footer{border-top:1px solid var(--divider);color:var(--muted);font-size:.9rem}
footer .wrap{padding:16px}
footer a{margin-right:12px}