:root { --bg:#0f1b2d; --surface:#17263d; --border:#2a3b57; --text:#eef3fa; --muted:#9fb0c8; --teal:#14b8a6; --warn:#f59e0b; }
* { box-sizing: border-box; }
body { margin:0; background:var(--bg); color:var(--text); font:16px/1.5 -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
main { max-width:560px; margin:0 auto; padding:48px 16px 64px; }
h1 { font-size:28px; margin:0 0 6px; }
h2 { font-size:15px; margin:0 0 12px; color:var(--muted); text-transform:uppercase; letter-spacing:.04em; }
.lead { color:var(--muted); margin:0 0 28px; }
section { background:var(--surface); border:1px solid var(--border); border-radius:14px; padding:20px; }
.button { display:block; width:100%; text-align:center; border:0; border-radius:999px; padding:12px 18px; margin-top:10px; font:inherit; font-weight:600; text-decoration:none; cursor:pointer; }
.apple { background:#fff; color:#000; }
.google { background:var(--teal); color:#04201c; }
.secondary { background:transparent; color:var(--text); border:1px solid var(--border); }
dl { display:grid; grid-template-columns:max-content 1fr; gap:8px 16px; margin:0 0 8px; }
dt { color:var(--muted); }
dd { margin:0; word-break:break-all; }
code { font-size:13px; }
.notice { background:rgba(245,158,11,.12); color:var(--warn); border-radius:10px; padding:10px 12px; }
[hidden] { display:none !important; }
