@font-face{font-family:Outfit;font-style:normal;font-display:swap;font-weight:400;src:url(/assets/outfit-latin-400-normal-BGsTXAXT.woff2)format("woff2"),url(/assets/outfit-latin-400-normal-DMwTpYkH.woff)format("woff")}@font-face{font-family:Outfit;font-style:normal;font-display:swap;font-weight:700;src:url(/assets/outfit-latin-700-normal-Cu9v6i1X.woff2)format("woff2"),url(/assets/outfit-latin-700-normal-D4itBLBr.woff)format("woff")}@font-face{font-family:Outfit;font-style:normal;font-display:swap;font-weight:800;src:url(/assets/outfit-latin-800-normal-CQna6-G7.woff2)format("woff2"),url(/assets/outfit-latin-800-normal-BRHLSPcU.woff)format("woff")}:root{--bg:#e8f7fb;--bg-top:#d5f1f8;--bg-end:#fff;--surface:#fff;--surface-2:#f2fafc;--border:#cfe6ef;--border-strong:#7fbfd6;--text:#0d1f3c;--muted:#557089;--primary:#2563eb;--primary-strong:#1d4ed8;--primary-soft:#e1eefe;--key:#def0f6;--key-hover:#cbe7f1;--key-text:#12305c;--tile-shadow:0 1px 0 #cfe6ef, 0 4px 14px -6px #0e749033;--brand-1:#3b82f6;--brand-2:#1d4ed8;--exact-1:#3b82f6;--exact-2:#1d4ed8;--exact-text:#fff;--near:#db2777;--near-fill:#fff;--zero-bg:#eaf3f7;--zero-text:#93a9b8;--zero-border:#d3e4ec;--absent-bg:#e3eef2;--absent-fg:#8ea3af;--tile-empty-bg:#ffffff8c;--tile-active-border:#a9d2e2;--key-shadow:#b5cfe0;--key-absent-bg:#eef7fa;--key-absent-fg:#12305c59;--key-absent-hover:#e3f1f6;--exact-shadow:#1d4ed880;--near-shadow:#db277766;--key-correct-shadow:#163fae;--toast-bg:#0d1f3c;--toast-text:#fff;--overlay:#0d1f3c59;--font:"Outfit", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--bg:#08202c;--bg-top:#0b3343;--bg-end:#061620;--surface:#0f2c3a;--surface-2:#133746;--border:#1d4a5c;--border-strong:#3f8fb0;--text:#e8f6fb;--muted:#8eb0c0;--primary:#4c8dff;--primary-strong:#3b7bf5;--primary-soft:#133a52;--key:#173d4d;--key-hover:#1f4b5e;--key-text:#e3f2f8;--tile-shadow:0 1px 0 #163c4c, 0 6px 16px -8px #0009;--brand-1:#4c8dff;--brand-2:#2f6ef0;--exact-1:#5b9bff;--exact-2:#2f6ef0;--near:#f472b6;--near-fill:transparent;--zero-bg:#133544;--zero-text:#5f8696;--zero-border:#1d4556;--absent-bg:#1a3b4a;--absent-fg:#6a8c9a;--tile-empty-bg:#0f2c3a8c;--tile-active-border:#2b6884;--key-shadow:#2f5570;--key-absent-bg:#12323f;--key-absent-fg:#e3f2f859;--key-absent-hover:#153846;--exact-shadow:#2f6ef080;--near-shadow:#f472b666;--key-correct-shadow:#1f4fb0;--toast-bg:#eaf2ff;--toast-text:#0d1f3c;--overlay:#02081499;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}}:root[data-theme=dark]{--bg:#08202c;--bg-top:#0b3343;--bg-end:#061620;--surface:#0f2c3a;--surface-2:#133746;--border:#1d4a5c;--border-strong:#3f8fb0;--text:#e8f6fb;--muted:#8eb0c0;--primary:#4c8dff;--primary-strong:#3b7bf5;--primary-soft:#133a52;--key:#173d4d;--key-hover:#1f4b5e;--key-text:#e3f2f8;--tile-shadow:0 1px 0 #163c4c, 0 6px 16px -8px #0009;--brand-1:#4c8dff;--brand-2:#2f6ef0;--exact-1:#5b9bff;--exact-2:#2f6ef0;--near:#f472b6;--near-fill:transparent;--zero-bg:#133544;--zero-text:#5f8696;--zero-border:#1d4556;--absent-bg:#1a3b4a;--absent-fg:#6a8c9a;--tile-empty-bg:#0f2c3a8c;--tile-active-border:#2b6884;--key-shadow:#2f5570;--key-absent-bg:#12323f;--key-absent-fg:#e3f2f859;--key-absent-hover:#153846;--exact-shadow:#2f6ef080;--near-shadow:#f472b666;--key-correct-shadow:#1f4fb0;--toast-bg:#eaf2ff;--toast-text:#0d1f3c;--overlay:#02081499;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*,:before,:after{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{font-family:var(--font);color:var(--text);background:linear-gradient(165deg, var(--bg-top) 0%, var(--bg) 45%, var(--bg-end) 100%);-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent;background-attachment:fixed}button{font:inherit;color:inherit;cursor:pointer}h1,h2,h3,p{margin:0}.muted{color:var(--muted)}.small{font-size:.875rem;line-height:1.45}.center{text-align:center}.sr-only{clip:rect(0 0 0 0);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.app{--tile:clamp(34px, calc((100vh - 380px) / 8), 56px);height:100vh;height:var(--app-h,100vh);max-width:520px;padding:0 12px env(safe-area-inset-bottom);flex-direction:column;margin:0 auto;display:flex}.header{grid-template-columns:88px 1fr 88px;align-items:center;padding:10px 0 6px;display:grid}.header-right{justify-content:flex-end;gap:2px;display:flex}.icon-btn{width:40px;height:40px;color:var(--muted);background:0 0;border:0;border-radius:12px;place-items:center;transition:background .15s,color .15s;display:grid}.icon-btn:hover{background:var(--primary-soft);color:var(--primary)}.logo{letter-spacing:-.03em;justify-self:center;align-items:center;gap:4px;font-size:1.85rem;font-weight:800;display:flex}.logo-me{color:#fff;background:linear-gradient(135deg, var(--brand-1), var(--brand-2));border-radius:10px;padding:0 9px 2px;transform:rotate(-3deg);box-shadow:0 6px 16px -6px #2563eb8c}.subhead{border-bottom:1px solid var(--border);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px;padding-bottom:8px;font-size:.9rem;display:flex}.subhead-info{align-items:center;gap:8px;display:flex}.length-picker{background:var(--surface-2);border:1px solid var(--border);border-radius:12px;padding:3px;display:flex}.length-picker button{color:var(--muted);background:0 0;border:0;border-radius:9px;padding:5px 11px;font-size:.85rem;font-weight:600;transition:background .15s,color .15s}.length-picker button:hover:not(.on):not(:disabled){color:var(--primary)}.length-picker button.on{background:linear-gradient(140deg, var(--brand-1), var(--brand-2));color:#fff;box-shadow:0 4px 10px -4px var(--brand-2)}.length-picker button:disabled{cursor:wait}.chip{background:var(--primary-soft);color:var(--primary-strong);border-radius:999px;padding:2px 10px;font-weight:700}.play{flex:1;justify-content:center;align-items:flex-start;min-height:0;padding:12px 0 6px;display:flex}.loading{color:var(--muted)}.board{gap:calc(var(--tile) * .12);flex-direction:column;display:flex}.row{align-items:center;gap:calc(var(--tile) * .22);display:flex}.tiles{gap:calc(var(--tile) * .12);display:flex}.tile{width:var(--tile);height:var(--tile);border-radius:calc(var(--tile) * .22);border:2px solid var(--border);background:var(--surface);color:var(--text);font-size:calc(var(--tile) * .5);text-transform:uppercase;-webkit-user-select:none;user-select:none;place-items:center;padding:0;font-weight:700;transition:border-color .12s,opacity .2s,background .2s;display:grid;position:relative}.row:not(.row-active) .tile:not(.tile-done){background:var(--tile-empty-bg)}.row-active .tile{border-color:var(--tile-active-border)}.row.row-active .tile.tile-cursor{border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-soft)}.row-active button.tile{cursor:pointer}.row .tile.tile-filled{border-color:var(--border-strong);animation:.12s ease-out pop}.row .tile.tile-done{border-color:var(--border);box-shadow:var(--tile-shadow);animation:none}.row button.tile-done:hover{border-color:var(--border-strong)}.row .tile.st-correct{--st-bg:linear-gradient(140deg, var(--exact-1), var(--exact-2));--st-fg:#fff;--st-border:transparent}.row .tile.st-present{--st-bg:var(--surface);--st-fg:var(--near);--st-border:var(--near);border-width:3px}.row .tile.st-absent{--st-bg:var(--absent-bg);--st-fg:var(--absent-fg);--st-border:var(--absent-bg)}.row .tile.st{background:var(--st-bg);color:var(--st-fg);border-color:var(--st-border);box-shadow:none}.row .tile.st.flip{animation:.34s both flip-reveal}.tile.mark-out{opacity:.38}.tile.mark-out:after{content:"";background:currentColor;border-radius:2px;height:2px;position:absolute;top:50%;left:18%;right:18%;transform:rotate(-20deg)}.tile.mark-in{color:var(--primary);background:var(--primary-soft);border-color:var(--primary)!important}.badges{gap:calc(var(--tile) * .1);display:flex}.badge{width:calc(var(--tile) * .72);height:calc(var(--tile) * .72);min-width:26px;min-height:26px;font-weight:700;font-size:max(.85rem, calc(var(--tile) * .36));border-radius:50%;place-items:center;display:grid}.badge-exact{background:linear-gradient(140deg, var(--exact-1), var(--exact-2));color:var(--exact-text);box-shadow:0 4px 12px -4px var(--exact-shadow)}.badge-near{background:var(--near-fill);color:var(--near);border:2.5px solid var(--near);box-shadow:0 4px 12px -6px var(--near-shadow)}.badge-zero{background:var(--zero-bg);color:var(--zero-text);border:1.5px solid var(--zero-border)}.badge-ring{border:2px dashed var(--border-strong);opacity:.6}.badge-empty{visibility:hidden}.keyboard{-webkit-user-select:none;user-select:none;flex-direction:column;gap:7px;padding:4px 0 12px;display:flex}.key-row{justify-content:center;gap:6px;display:flex}.key-row:nth-child(2){padding:0 5%}.key{background:var(--key);min-width:0;max-width:46px;height:clamp(44px,6.5vh,56px);color:var(--key-text);box-shadow:0 2px 0 var(--key-shadow);border:0;border-radius:10px;flex:1;place-items:center;font-size:1.05rem;font-weight:600;transition:background .12s,transform 60ms,opacity .15s;display:grid}.key:hover{background:var(--key-hover)}.key:active{box-shadow:none;transform:translateY(2px)}.key-wide{text-transform:uppercase;letter-spacing:.02em;flex:1.5 0 auto;min-width:56px;max-width:76px;padding:0;font-size:clamp(.68rem,3vw,.8rem)}.key-enter{background:linear-gradient(140deg, var(--brand-1), var(--brand-2));color:#fff;box-shadow:0 2px 0 var(--brand-2);font-weight:700}.key-enter:hover{filter:brightness(1.06)}.key-out{opacity:.35;text-decoration:line-through}.key-absent{background:var(--key-absent-bg);color:var(--key-absent-fg);box-shadow:none}.key-absent:hover{background:var(--key-absent-hover)}.key-in{background:var(--surface);color:var(--primary);outline:2px solid var(--primary);outline-offset:-2px}.key-typed{background:var(--primary-soft);color:var(--primary)}.key-correct{background:linear-gradient(140deg, var(--exact-1), var(--exact-2));color:#fff;box-shadow:0 2px 0 var(--key-correct-shadow)}.key-correct:hover{background:linear-gradient(140deg, var(--exact-1), var(--exact-2));filter:brightness(1.06)}.key-present{background:var(--surface);color:var(--near);box-shadow:inset 0 0 0 2px var(--near)}.key-present:hover{background:var(--surface)}.toast{background:var(--toast-bg);color:var(--toast-text);z-index:30;border-radius:12px;padding:10px 18px;font-size:.95rem;font-weight:600;animation:.18s ease-out toast-in;position:fixed;top:120px;left:50%;transform:translate(-50%);box-shadow:0 10px 30px -10px #0d1f3c80}.overlay{z-index:20;background:var(--overlay);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);place-items:center;padding:16px;animation:.15s ease-out fade;display:grid;position:fixed;inset:0}.modal{width:100%;max-width:440px;max-height:calc(var(--app-h,100vh) - 32px);background:var(--surface);border:1px solid var(--border);border-radius:22px;outline:none;padding:18px 22px 24px;animation:.22s cubic-bezier(.2,.9,.3,1.2) rise;overflow-y:auto;box-shadow:0 30px 60px -20px #0d1f3c59}.modal-head{justify-content:space-between;align-items:center;margin-bottom:10px;display:flex}.modal h2{letter-spacing:-.02em;font-size:1.45rem;font-weight:800}.modal h3{text-transform:uppercase;letter-spacing:.08em;color:var(--muted);margin:18px 0 8px;font-size:.8rem}.lead{margin-bottom:14px;font-size:1.02rem;line-height:1.5}.legend{gap:8px;margin-bottom:10px;display:grid}.legend>div{background:var(--surface-2);border:1px solid var(--border);border-radius:14px;align-items:center;gap:12px;padding:8px 12px;display:flex}.legend .badge{width:32px;min-width:32px;height:32px;font-size:1rem}.examples{gap:10px;display:grid}.example{gap:4px;display:grid}.row.mini{--tile:38px}.result{background:var(--surface-2);border:1px solid var(--border);border-radius:16px;justify-items:center;gap:8px;margin-bottom:14px;padding:12px;display:grid}.answer-tiles{--tile:42px;gap:6px;display:flex}.answer-tile{animation:.5s both bounce}.result.won .answer-tile{background:linear-gradient(140deg, var(--exact-1), var(--exact-2));color:#fff;border-color:#0000!important}.stat-grid{text-align:center;grid-template-columns:repeat(4,1fr);gap:8px;display:grid}.stat-grid strong{font-size:1.9rem;font-weight:700;line-height:1.1;display:block}.stat-grid span{color:var(--muted);font-size:.78rem}.dist{gap:5px;display:grid}.dist-row{align-items:center;gap:8px;font-size:.85rem;display:flex}.dist-label{width:12px;color:var(--muted);font-weight:600}.dist-track{flex:1}.dist-bar{background:var(--key);color:var(--key-text);text-align:right;border-radius:6px;min-width:26px;padding:2px 8px;font-weight:600;transition:width .5s}.dist-today{background:linear-gradient(90deg, var(--exact-1), var(--exact-2));color:#fff}.stats-foot{border-top:1px solid var(--border);justify-content:space-between;align-items:center;gap:12px;margin-top:20px;padding-top:16px;display:flex}.next{display:grid}.countdown{font-variant-numeric:tabular-nums;font-size:1.6rem;font-weight:700}.btn-primary{background:linear-gradient(140deg, var(--brand-1), var(--brand-2));color:#fff;box-shadow:0 10px 20px -10px var(--brand-2);border:0;border-radius:14px;align-items:center;gap:8px;padding:12px 22px;font-size:1.05rem;font-weight:700;display:inline-flex}.btn-primary:hover{filter:brightness(1.06)}.setting{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;gap:12px;padding:12px 0;display:flex}.setting:last-child{border-bottom:0}.segmented{background:var(--surface-2);border:1px solid var(--border);border-radius:12px;flex-shrink:0;padding:3px;display:flex}.segmented button{color:var(--muted);background:0 0;border:0;border-radius:9px;padding:6px 12px;font-size:.9rem;font-weight:600}.segmented button.on{background:var(--surface);color:var(--primary);box-shadow:0 1px 4px #0d1f3c1f}.segmented button:disabled{opacity:.45;cursor:not-allowed}.flip{animation:.34s both flip}.pop-in{animation:.25s cubic-bezier(.2,1.4,.4,1) both badge-pop}.shake{animation:.45s shake}.row-won .tile{background:linear-gradient(140deg, var(--exact-1), var(--exact-2));color:#fff;animation:.6s both bounce;border-color:#0000!important}@keyframes pop{50%{transform:scale(1.08)}}@keyframes flip-reveal{0%{background:var(--surface);color:var(--text);border-color:var(--border-strong);transform:rotateX(0)}50%{background:var(--surface);color:var(--text);border-color:var(--border-strong);transform:rotateX(90deg)}50.1%{background:var(--st-bg);color:var(--st-fg);border-color:var(--st-border);transform:rotateX(90deg)}to{background:var(--st-bg);color:var(--st-fg);border-color:var(--st-border);transform:rotateX(0)}}@keyframes flip{0%{transform:rotateX(0)}50%{background:var(--primary-soft);transform:rotateX(90deg)}to{transform:rotateX(0)}}@keyframes badge-pop{0%{opacity:0;transform:scale(0)}to{opacity:1;transform:scale(1)}}@keyframes shake{20%,60%{transform:translate(-7px)}40%,80%{transform:translate(7px)}}@keyframes bounce{0%,to{transform:translateY(0)}40%{transform:translateY(-14px)}70%{transform:translateY(3px)}}@keyframes fade{0%{opacity:0}}@keyframes rise{0%{opacity:0;transform:translateY(16px)scale(.98)}}@keyframes toast-in{0%{opacity:0;transform:translate(-50%,-8px)}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important}}.btn-quiet{border:1px solid var(--border);background:var(--surface-2);color:var(--text);border-radius:10px;flex-shrink:0;padding:7px 12px;font-size:.88rem;font-weight:600}.btn-quiet:hover{border-color:var(--border-strong)}.btn-quiet.danger{border-color:var(--near);color:var(--near)}.settings-foot{margin-top:14px}.settings-foot a{color:var(--primary);font-weight:600}