:root { color-scheme: light dark; --bg:#f7f5f0; --card:#ffffff; --ink:#1d1d1f; --muted:#5f6368; --accent:#0a7c66; --warn:#b3261e; }
@media (prefers-color-scheme: dark) { :root { --bg:#121212; --card:#1e1e1e; --ink:#f1f1f1; --muted:#a8a8a8; --accent:#3fbf9f; --warn:#f28b82; } }
* { box-sizing: border-box; }
body { margin:0; background:var(--bg); color:var(--ink); font:16px/1.55 -apple-system, "Segoe UI", Roboto, Arial, sans-serif; }
main { max-width: 560px; margin: 0 auto; padding: 32px 16px 48px; }
.card { background:var(--card); border-radius:18px; padding:24px 20px; box-shadow:0 1px 3px rgba(0,0,0,.08); margin-bottom:16px; }
h1 { font-size: 1.35rem; margin: 0 0 12px; }
h2 { font-size: 1.05rem; margin: 0 0 8px; }
p { margin: 0 0 12px; }
.muted { color: var(--muted); font-size: .92rem; }
.warn { color: var(--warn); }
button, .store { display:block; width:100%; margin-top:8px; padding:14px 16px; border:0; border-radius:12px; background:var(--accent); color:#fff; font-size:1rem; font-weight:700; text-align:center; text-decoration:none; cursor:pointer; }
a { color: var(--accent); }
[hidden] { display:none !important; }