:root{--ink:#0F2621;--paper:#F5F2E9;--card:#FFFDF7;--signal:#17B981;--signal-dk:#0E9268;--line:#E2DCCB;--muted:#5B6B63}
*{margin:0;padding:0;box-sizing:border-box}
body{background:var(--paper);color:var(--ink);font-family:Inter,-apple-system,Segoe UI,Roboto,Arial,sans-serif;line-height:1.55;padding:24px 16px 64px}
.wrap{max-width:560px;margin:0 auto}
h1{font-family:'Bricolage Grotesque',Inter,sans-serif;font-weight:800;font-size:clamp(26px,5vw,38px);line-height:1.15;margin-bottom:6px}
.sub{color:var(--muted);margin-bottom:24px}
.card{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:20px;margin-bottom:16px}
label{display:block;font-weight:600;font-size:14px;margin-bottom:6px}
input,select{width:100%;padding:12px 14px;border:1px solid var(--line);border-radius:12px;background:#fff;font:inherit;color:var(--ink)}
input:focus,select:focus{outline:2px solid var(--signal);outline-offset:1px}
.row{margin-bottom:14px}
.btn{display:inline-block;width:100%;text-align:center;padding:14px 18px;border:0;border-radius:999px;background:var(--signal);color:#fff;font-weight:700;font-size:16px;cursor:pointer;font-family:inherit}
.btn:hover{background:var(--signal-dk)}
.btn[disabled]{opacity:.5;cursor:not-allowed}
.slots{display:flex;flex-wrap:wrap;gap:8px;margin-top:4px}
.slot{padding:10px 14px;border:1px solid var(--line);border-radius:999px;background:#fff;cursor:pointer;font-weight:600;font-size:15px}
.slot.on{background:var(--signal);color:#fff;border-color:var(--signal)}
.msg{padding:12px 14px;border-radius:12px;margin-bottom:14px;font-size:15px}
.msg.bad{background:#FDECEC;color:#8A1C1C}
.msg.good{background:#E6F7F0;color:#0E5C43}
.hide{display:none}
.trap{position:absolute;left:-9999px}
.code{font-family:'Bricolage Grotesque',monospace;font-weight:800;font-size:22px;letter-spacing:1px}
.foot{text-align:center;color:var(--muted);font-size:13px;margin-top:24px}
.foot a{color:var(--muted)}