:root { --ink:#111; --muted:#666; --line:#ddd; --accent:#111; --bg:#fff; }
* { box-sizing:border-box; }
body { margin:0; padding:1.25rem; font:16px/1.5 -apple-system,Segoe UI,Roboto,sans-serif;
       color:var(--ink); background:var(--bg); max-width:38rem; margin-inline:auto; }
h1 { font-size:1.4rem; } h2 { font-size:1.1rem; margin-top:1.5rem; }
label { display:block; margin:.75rem 0 .25rem; font-weight:600; }
input, select, textarea { width:100%; padding:.6rem; border:1px solid var(--line); border-radius:6px; font:inherit; }
button { padding:.7rem 1.1rem; border:0; border-radius:6px; background:var(--accent); color:#fff;
         font:inherit; font-weight:600; cursor:pointer; }
button.secondary { background:#fff; color:var(--ink); border:1px solid var(--line); }
.slots { display:flex; flex-wrap:wrap; gap:.5rem; margin:.5rem 0 1rem; }
.slot { flex:0 0 auto; }
.slot input { position:absolute; opacity:0; }
.slot label { display:inline-block; margin:0; padding:.5rem .75rem; border:1px solid var(--line);
              border-radius:6px; font-weight:500; cursor:pointer; }
.slot input:checked + label { background:var(--accent); color:#fff; border-color:var(--accent); }
.muted { color:var(--muted); font-size:.9rem; }
.error { padding:.75rem; border:1px solid #d33; border-radius:6px; color:#d33; margin-bottom:1rem; }
table { width:100%; border-collapse:collapse; } td, th { padding:.4rem; border-bottom:1px solid var(--line); text-align:left; }