:root{--ink:#f3efe4;--ink-dim:#9a9386;--ink-mute:#6e685c;--ochre:#d4a054;--ochre-hot:#e8b86a;--panel:#12100ec7;--panel-border:#f3efe414;--line:#f3efe41a;--field:#00000059;--shadow:0 24px 80px #00000073;--sans:"IBM Plex Sans", "Segoe UI", sans-serif;--mono:"IBM Plex Mono", ui-monospace, monospace}html,body,#root{height:100%;margin:0}body{font-family:var(--sans);color:var(--ink);-webkit-font-smoothing:antialiased;background:radial-gradient(1200px 600px at 50% -10%,#d4a05414,#0000 55%),#12100e}.gate{place-items:center;min-height:100%;padding:24px;display:grid}.gate-card{background:var(--panel);border:1px solid var(--panel-border);width:min(440px,100%);box-shadow:var(--shadow);-webkit-backdrop-filter:blur(22px)saturate(1.2);backdrop-filter:blur(22px)saturate(1.2);border-radius:20px;padding:28px 24px 22px}.gate-kicker{font-family:var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--ochre);margin:0 0 8px;font-size:11px;font-weight:500}.gate-card h1{letter-spacing:-.03em;margin:0 0 10px;font-size:22px;font-weight:600;line-height:1.2}.gate-lead{color:var(--ink-dim);margin:0 0 16px;font-size:13px;line-height:1.5}.gate-lead strong{color:var(--ink);font-weight:500}.gate-card form{flex-direction:column;gap:14px;display:flex}.gate-field{flex-direction:column;gap:6px;display:flex}.gate-field-head{justify-content:flex-start;align-items:center;gap:8px;display:flex}.gate-field-head label{color:var(--ink-dim);font-size:12px}.gate-badge{font-family:var(--mono);letter-spacing:.04em;color:var(--ochre);background:#d4a0541f;border-radius:99px;padding:2px 8px;font-size:10px;font-weight:500}.gate-field-hint{color:var(--ink-mute);margin:0;font-size:12px;line-height:1.45}.gate-card input:not(.code-boxes-input){background:var(--field);border:1px solid var(--line);color:var(--ink);font:500 14px/1.3 var(--sans);border-radius:10px;padding:10px 12px}.gate-card input:not(.code-boxes-input):focus{border-color:#d4a05473;outline:none;box-shadow:0 0 0 3px #d4a0541f}.gate-card button[type=submit]{background:var(--ochre);color:#12100e;font:600 14px/1.2 var(--sans);cursor:pointer;border:none;border-radius:10px;margin-top:2px;padding:11px 12px}.gate-card button[type=submit]:hover:not(:disabled){background:var(--ochre-hot)}.gate-card button[type=submit]:disabled{opacity:.55;cursor:default}.gate-error{color:var(--ochre-hot);margin:0;font-size:13px;line-height:1.4}.gate-nav{gap:14px;margin-top:16px;display:flex}.gate-nav a{color:var(--ink-dim);font-size:13px;text-decoration:none}.gate-nav a:hover{color:var(--ochre)}.code-legend{grid-template-columns:1fr 1fr;gap:8px;margin:0 0 14px;display:grid}.code-legend>div{background:var(--field);border:1px solid var(--line);border-radius:12px;flex-direction:column;gap:4px;min-width:0;padding:10px 12px 11px 14px;display:flex}.code-legend>div.is-on{background:#d4a05414;border-color:#d4a05459}.code-legend-kicker{font-family:var(--mono);letter-spacing:.04em;text-transform:uppercase;color:var(--ochre);font-size:10px}.code-legend-kicker.is-muted{color:var(--ink-mute)}.code-legend strong{font-size:13px;font-weight:600}.code-legend span:last-child{color:var(--ink-dim);font-size:11px;line-height:1.35}.code-boxes{justify-content:stretch;gap:8px;width:100%;display:flex;position:relative}.code-slot{box-sizing:border-box;background:var(--field);border:1px solid var(--line);color:var(--ink);font-family:var(--mono);pointer-events:none;border-radius:10px;justify-content:center;align-items:center;height:52px;font-weight:500;display:flex}.code-boxes-invite .code-slot{letter-spacing:.02em;flex:1;font-size:20px}.code-boxes-totp .code-slot{font-variant-numeric:tabular-nums;flex:1;font-size:22px}.code-slot.is-filled{border-color:#f3efe433}.code-slot.is-active{border-color:#d4a054a3;box-shadow:0 0 0 3px #d4a0541f}.code-slot.is-complete{border-color:#d4a05473}.code-boxes-input{caret-color:var(--ochre);color:#0000;letter-spacing:0;opacity:.02;background:0 0;border:none;width:100%;height:100%;margin:0;padding:0;font-size:20px;position:absolute;inset:0}.code-boxes-input:focus{outline:none}.gate-howto{color:var(--ink-dim);flex-direction:column;gap:8px;margin:0 0 14px;padding:0;font-size:13px;line-height:1.4;list-style:none;display:flex}.gate-howto li{align-items:flex-start;gap:10px;display:flex}.gate-howto span{color:var(--ochre);font-family:var(--mono);background:#d4a05424;border-radius:99px;flex:0 0 22px;justify-content:center;align-items:center;width:22px;height:22px;font-size:11px;font-weight:500;display:flex}.gate-qr{background:#fff;border-radius:12px;width:196px;margin:0 auto 16px;padding:10px}.gate-qr svg{width:100%;height:auto;display:block}@media (width<=420px){.gate-card{padding:24px 18px 18px}.code-slot{height:48px}.code-legend{gap:6px}}