body{background:radial-gradient(circle at 15% 10%, color-mix(in srgb, var(--accent) 35%, transparent) 0 120px, transparent 121px), radial-gradient(circle at 92% 88%, color-mix(in srgb, var(--brand) 22%, transparent) 0 180px, transparent 181px), var(--bg);min-height:100dvh}.stage{align-content:center;place-items:center;gap:1.25rem;min-height:100dvh;padding:24px 16px;display:grid}.card{background:var(--surface);border:1px solid var(--line);width:min(560px,100%);box-shadow:var(--shadow);text-align:center;border-radius:24px;padding:clamp(18px,5vw,44px)}.eyebrow{letter-spacing:.12em;text-transform:uppercase;color:var(--brand);margin:0 0 .5rem;font-size:.8rem;font-weight:600}h1{margin:0 0 1.75rem;font-size:clamp(1.4rem,5vw,2rem);font-weight:800;line-height:1.15}.boxes{justify-content:center;align-items:center;gap:clamp(4px,1.5vw,12px);display:flex}.boxes input{aspect-ratio:4/5;text-align:center;border:2px solid var(--line);background:var(--bg);width:clamp(34px,10vw,64px);caret-color:var(--brand);border-radius:12px;font-family:JetBrains Mono,ui-monospace,monospace;font-size:clamp(1.5rem,7vw,2.4rem);font-weight:700;transition:border-color .15s,transform .15s,background .15s}.boxes input:focus{border-color:var(--brand);background:var(--surface);outline:none;transform:translateY(-2px)}.boxes input.filled{border-color:color-mix(in srgb, var(--brand) 45%, var(--line))}.dash{background:var(--line);border-radius:2px;width:clamp(8px,2.5vw,14px);height:3px}.status{min-height:1.5em;color:var(--muted);margin:1.5rem 0 0}.status.ok{color:var(--ok);font-weight:600}.status.bad{color:var(--bad);font-weight:600}.card.success .boxes input{border-color:var(--ok)}.card.error .boxes input{border-color:var(--bad)}.card.error .boxes{animation:.4s shake}.card.busy .boxes input{opacity:.6}@keyframes shake{20%,60%{transform:translate(-8px)}40%,80%{transform:translate(8px)}}@media (prefers-reduced-motion:reduce){.card.error .boxes{animation:none}}.teacher-link{color:var(--muted);font-size:.85rem;text-decoration:none}.teacher-link:hover{text-decoration:underline}.card-logo{width:64px;height:64px;margin:0 auto 1rem;display:block}
