:root{--bg:#fafaf7;--surface:#fff;--text:#1c1b22;--muted:#6e6b78;--border:#d9d7de;--tile:#fff;--changed:#0f8a7e;--changed-text:#fff;--preview:#9fd8d1;--key:#e6e4ea;--overlay:#14121a73;--error:#c0392b;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;color:var(--text);background:var(--bg);-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent;font:16px/1.45 system-ui,-apple-system,Segoe UI,Roboto,sans-serif}:root[data-theme=dark]{--bg:#131217;--surface:#1d1c23;--text:#f0eff4;--muted:#9c99a7;--border:#3a3842;--tile:#1d1c23;--changed:#1fa99a;--changed-text:#fff;--preview:#1d5a54;--key:#3a3842;--overlay:#0009;--error:#ff7b6b;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}body{background:var(--bg);margin:0}button{font:inherit;color:inherit;cursor:pointer}.app{max-width:500px;min-height:100dvh;padding:0 16px env(safe-area-inset-bottom);flex-direction:column;margin:0 auto;display:flex}header{border-bottom:1px solid var(--border);grid-template-columns:1fr auto 1fr;align-items:center;padding:10px 0;display:grid}.title{text-align:center}.title h1{letter-spacing:.08em;text-transform:uppercase;margin:0;font-size:1.6rem}.title span{color:var(--muted);font-size:.85rem}.icon{border:1px solid var(--border);background:0 0;border-radius:50%;place-items:center;width:36px;height:36px;font-weight:700;display:grid}.header-actions{justify-content:end;gap:8px;display:flex}main{flex-direction:column;flex:1;justify-content:space-between;gap:12px;padding:14px 0;display:flex}.board{justify-content:center;gap:6px;display:grid}.row{--size:min(13vw, 52px);grid-template-columns:repeat(5, var(--size));align-items:center;gap:6px;display:grid;position:relative}.tile{width:var(--size);height:var(--size);border:2px solid var(--border);background:var(--tile);font-size:calc(var(--size) * .5);text-transform:uppercase;border-radius:6px;place-items:center;font-weight:700;display:grid}.row:first-child .tile,.tile.filled{border-color:var(--muted)}.tile.changed{border-color:var(--changed);background:var(--changed);color:var(--changed-text)}.row.active .tile.changed{background:var(--preview);border-color:var(--preview);color:var(--text)}.row.active .tile:not(.filled){border-style:dashed}.points{color:var(--muted);white-space:nowrap;padding-left:10px;font-size:.85rem;font-weight:600;position:absolute;left:100%}.shake{animation:.35s shake}@keyframes shake{20%,60%{transform:translate(-6px)}40%,80%{transform:translate(6px)}}.tracker{justify-items:center;gap:6px;display:grid}.bars{grid-template-columns:repeat(5,min(13vw,52px));gap:6px;display:grid}.bars span{background:var(--border);border-radius:3px;height:6px;transition:background .2s}.bars .on{background:var(--changed)}.bars .preview{background:var(--preview)}.tracker small{color:var(--muted)}.controls{gap:10px;display:grid}.undo{color:var(--muted);background:0 0;border:none;justify-self:center;font-size:.9rem;text-decoration:underline}.undo:disabled{visibility:hidden}.keyboard{-webkit-user-select:none;user-select:none;gap:8px;display:grid}.key-row{justify-content:center;gap:5px;display:flex}.key{--unit:calc((100% - 45px) / 10);width:min(44px, var(--unit));background:var(--key);text-transform:uppercase;border:none;border-radius:6px;flex:none;height:56px;padding:0;font-size:1.05rem;font-weight:700}.key.wide{width:min(68px, var(--unit) * 1.5);font-size:.75rem}.key.backspace{font-size:1.4rem}.key:active{filter:brightness(.85)}.result{text-align:center;justify-items:center;gap:8px;display:grid}.result p{margin:0}.score{font-size:3rem;font-weight:800;line-height:1}.score small{color:var(--muted);font-size:1.2rem}.verdict{font-weight:600}.primary{background:var(--changed);color:var(--changed-text);border:none;border-radius:999px;padding:12px 40px;font-weight:700}details{color:var(--muted)}summary{cursor:pointer}.chain{color:var(--text);text-transform:uppercase;letter-spacing:.05em;margin-top:6px!important}.next{color:var(--muted);font-variant-numeric:tabular-nums;font-size:.9rem}.toast{background:var(--text);max-width:calc(100% - 32px);color:var(--bg);text-align:center;z-index:20;border-radius:8px;padding:10px 16px;font-weight:600;position:fixed;top:72px;left:50%;transform:translate(-50%)}.overlay{background:var(--overlay);z-index:10;place-items:center;padding:16px;display:grid;position:fixed;inset:0}.modal{background:var(--surface);border-radius:12px;width:100%;max-width:420px;max-height:90dvh;padding:20px;position:relative;overflow-y:auto}.modal h2{margin-top:0}.close{color:var(--muted);background:0 0;border:none;font-size:1.6rem;line-height:1;position:absolute;top:8px;right:10px}.help table{border-collapse:collapse;width:100%}.help td{border-bottom:1px solid var(--border);padding:3px 0}.help td:last-child{text-align:right;font-weight:600}.example{justify-content:center;gap:4px;display:grid}.example .row{--size:34px}.stats{text-align:center;grid-template-columns:repeat(3,1fr);gap:16px 8px;display:grid}.stats strong{font-size:1.8rem;display:block}.stats span{color:var(--muted);font-size:.8rem}.guidance{text-align:center;min-height:2.9em;color:var(--muted);align-content:end;margin:0;font-size:.95rem}.guidance.ready{color:var(--changed);font-weight:700}.guidance.error{color:var(--error);font-weight:600}.key.enter.ready{background:var(--changed);color:var(--changed-text);animation:1.4s ease-in-out infinite pulse}@keyframes pulse{50%{box-shadow:0 0 0 5px color-mix(in srgb, var(--changed) 30%, transparent)}}@media (prefers-reduced-motion:reduce){.key.enter.ready,.shake{animation:none}}.help .lede{font-size:1.05rem;font-weight:600}.steps{gap:14px;margin:0 0 18px;padding-left:1.4em;display:grid}.steps li::marker{color:var(--changed);font-weight:800}.steps .example{justify-content:start;margin-top:8px}.points-table{text-align:center;color:var(--muted);grid-template-columns:repeat(5,1fr);gap:4px;margin-top:8px;font-size:.75rem;display:grid}.points-table span{border:1px solid var(--border);border-radius:6px;padding:6px 2px;display:grid}.points-table b{color:var(--text);font-size:1.1rem}.points-table em{color:var(--changed);font-style:normal;font-weight:700}.bars.demo{grid-template-columns:repeat(5,34px);margin:8px 0 0}.help h3{margin:0 0 8px;font-size:1rem}.help .small{color:var(--muted);font-size:.9rem}.help .primary{width:100%;margin-top:8px;display:block}.settings{gap:18px;margin:0;display:grid}.setting{border:none;gap:8px;margin:0;padding:0;display:grid}.setting legend{margin-bottom:8px;padding:0;font-weight:600}.segmented{background:var(--key);border-radius:10px;grid-auto-columns:1fr;grid-auto-flow:column;padding:3px;display:grid}.segmented label{text-align:center;cursor:pointer;border-radius:8px;padding:8px 4px;font-size:.9rem;font-weight:600;position:relative}.segmented input{opacity:0;pointer-events:none;position:absolute}.segmented label:has(input:checked){background:var(--changed);color:var(--changed-text)}.segmented label:has(input:focus-visible){outline:2px solid var(--changed);outline-offset:1px}.help .credits{color:var(--muted);text-align:center;margin:16px 0 0;font-size:.75rem}