:root { --bg:#fafaf7; --fg:#1d1d1b; --muted:#5d5d58; --line:#d9d8d0; --accent:#1f4e79; --warn:#8a2b2b; }
@media (prefers-color-scheme: dark) { :root { --bg:#161614; --fg:#f1f0ea; --muted:#a8a79f; --line:#34342f; --accent:#7db3e0; --warn:#e59a9a; } }
* { box-sizing: border-box; }
body { margin:0; background:var(--bg); color:var(--fg); font:16px/1.5 system-ui,-apple-system,"Segoe UI",sans-serif; }
main { max-width:30rem; margin:0 auto; padding:2.5rem 16px; }
h1 { font-size:1.4rem; margin:0 0 .25rem; }
p { margin:.75rem 0; }
.muted { color:var(--muted); font-size:.95rem; }
label { display:block; margin:1.25rem 0 .35rem; font-weight:600; }
input[type=email] { width:100%; padding:.7rem .8rem; font:inherit; color:var(--fg); background:transparent; border:1px solid var(--line); border-radius:8px; }
button { margin-top:1rem; padding:.7rem 1.1rem; font:inherit; font-weight:600; color:#fff; background:var(--accent); border:0; border-radius:8px; cursor:pointer; }
@media (prefers-color-scheme: dark) { button { color:#10202e; } }
button[disabled] { opacity:.55; cursor:default; }
.msg { margin-top:1rem; padding:.75rem .9rem; border:1px solid var(--line); border-radius:8px; }
.err { color:var(--warn); }
:focus-visible { outline:3px solid var(--accent); outline-offset:2px; }
main { max-width:44rem; }
h2 { font-size:1.15rem; margin:0 0 .25rem; }
.card { margin:1.5rem 0; padding:1rem; border:1px solid var(--line); border-radius:10px; }
fieldset { border:0; margin:1rem 0 0; padding:0; min-width:0; }
legend { font-weight:600; padding:0; margin-bottom:.4rem; }
.slots { display:grid; grid-template-columns:repeat(auto-fill,minmax(5.6rem,1fr)); gap:.4rem; }
button.slot { margin:0; padding:.45rem .3rem; font-weight:500; font-size:.9rem; color:var(--fg); background:transparent; border:1px solid var(--line); border-radius:8px; display:flex; flex-direction:column; align-items:center; min-height:3rem; }
button.slot .st { font-size:.72rem; min-height:1em; }
button.slot.yes { background:var(--accent); color:#fff; border-color:var(--accent); font-weight:700; }
button.slot.if_needed { border:2px dashed var(--accent); font-weight:700; }
@media (prefers-color-scheme: dark) { button.slot.yes { color:#10202e; } }
button.slot[disabled] { opacity:.35; }
button.quiet { color:var(--fg); background:transparent; border:1px solid var(--line); }