@font-face{font-family:Space Grotesk Variable;font-style:normal;font-display:swap;font-weight:300 700;src:url(./space-grotesk-vietnamese-wght-normal-D0rl6rjA.woff2)format("woff2-variations");unicode-range:U+102-103,U+110-111,U+128-129,U+168-169,U+1A0-1A1,U+1AF-1B0,U+300-301,U+303-304,U+308-309,U+323,U+329,U+1EA0-1EF9,U+20AB}@font-face{font-family:Space Grotesk Variable;font-style:normal;font-display:swap;font-weight:300 700;src:url(./space-grotesk-latin-ext-wght-normal-D9tNdqV9.woff2)format("woff2-variations");unicode-range:U+100-2BA,U+2BD-2C5,U+2C7-2CC,U+2CE-2D7,U+2DD-2FF,U+304,U+308,U+329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Space Grotesk Variable;font-style:normal;font-display:swap;font-weight:300 700;src:url(./space-grotesk-latin-wght-normal-BhU9QXUp.woff2)format("woff2-variations");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}:root{--inset-top:var(--safe-area-inset-top,env(safe-area-inset-top,0px));--inset-right:var(--safe-area-inset-right,env(safe-area-inset-right,0px));--inset-bottom:var(--safe-area-inset-bottom,env(safe-area-inset-bottom,0px));--inset-left:var(--safe-area-inset-left,env(safe-area-inset-left,0px));--bg:#f6f5f1;--surface:#fff;--text:#15171a;--muted:#6b6f76;--border:#dcd9d0;--border-filled:#8b877b;--correct:#13a06b;--present:#f6c945;--present-text:#2a2000;--absent:#6e7a8a;--locked:#b3203a;--key-bg:#e4e2db;--key-text:#15171a;--key-absent:#6e7a8a;--key-absent-text:#fff;--modal-bg:#fff;--backdrop:#f6f5f1b3;--toast-bg:#15171a;--toast-text:#f6f5f1;--shadow:0 4px 23px #15171a2e;--radius:7px;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;font-family:Space Grotesk Variable,system-ui,sans-serif}@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--bg:#141518;--surface:#1b1d21;--text:#f1f0ec;--muted:#9a9ca3;--border:#34373d;--border-filled:#6b6e75;--correct:#17a673;--present:#e9bd3e;--present-text:#241a00;--absent:#474e5a;--locked:#c62a44;--key-bg:#6c7079;--key-text:#fff;--key-absent:#474e5a;--key-absent-text:#e3e5e9;--modal-bg:#1d1f23;--backdrop:#0000008c;--toast-bg:#f1f0ec;--toast-text:#141518;--shadow:0 4px 23px #0009;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}}:root[data-theme=dark]{--bg:#141518;--surface:#1b1d21;--text:#f1f0ec;--muted:#9a9ca3;--border:#34373d;--border-filled:#6b6e75;--correct:#17a673;--present:#e9bd3e;--present-text:#241a00;--absent:#474e5a;--locked:#c62a44;--key-bg:#6c7079;--key-text:#fff;--key-absent:#474e5a;--key-absent-text:#e3e5e9;--modal-bg:#1d1f23;--backdrop:#0000008c;--toast-bg:#f1f0ec;--toast-text:#141518;--shadow:0 4px 23px #0009;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}:root[data-contrast=high]{--correct:#2457d6;--present:#f2b134;--present-text:#1d1500}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--bg);color:var(--text);-webkit-tap-highlight-color:transparent;overscroll-behavior:none;font-family:Space Grotesk Variable,system-ui,sans-serif}button{font:inherit;color:inherit;cursor:pointer}.app{max-width:500px;height:100dvh;padding:var(--inset-top) var(--inset-right) calc(var(--inset-bottom) + var(--ad-height,0px)) var(--inset-left);-webkit-user-select:none;user-select:none;flex-direction:column;margin:0 auto;display:flex}.header{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;padding:4px 8px;display:flex}.header-side{width:88px;display:flex}.header-side.right{justify-content:flex-end}.title-block{text-align:center;flex:1;min-width:0}h1,.brand{letter-spacing:-.03em;align-items:center;gap:8px;margin:0;font-size:1.75rem;font-weight:700;line-height:1.1;display:inline-flex}.logo-mark{background:var(--locked);color:#fff;border-radius:.26em;place-items:center;width:1.1em;height:1.1em;display:grid}.logo-mark svg{width:58%;height:58%}.subtitle{white-space:nowrap;text-overflow:ellipsis;color:var(--muted);letter-spacing:.03em;font-size:.7rem;overflow:hidden}.icon-button{background:0 0;border:none;border-radius:8px;place-items:center;width:44px;height:44px;display:grid}.icon-button:hover{background:color-mix(in srgb, var(--text) 8%, transparent)}.segmented{border:1px solid var(--border);border-radius:999px;padding:2px;display:inline-flex}.segmented button{color:var(--muted);background:0 0;border:none;border-radius:999px;padding:4px 14px;font-size:.85rem;font-weight:600}.segmented button.active{background:var(--text);color:var(--bg)}.mode-row{justify-content:center;align-items:center;gap:10px;margin-top:8px;display:flex}.pick-pill{color:#f6c945;font-variant-numeric:tabular-nums;white-space:nowrap;background:#15171a;border-radius:999px;align-items:center;gap:6px;height:34px;padding:0 12px 0 10px;font-size:.95rem;font-weight:700;display:inline-flex;box-shadow:0 0 0 1px #ffffff1f}.pick-pill svg{width:20px;height:20px}.pick-pill span{color:#f6f5f1}.pick-pill.active{box-shadow:0 0 0 2px var(--locked)}.pick-pill.used{color:#6b6f76}.pick-pill.used span{color:#8b8f96}.board-container{flex:1;justify-content:center;align-items:center;min-height:0;padding:8px;display:flex;container-type:size}.board{aspect-ratio:5/8;grid-template-rows:repeat(8,1fr);gap:5px;width:min(330px,100cqw,62.5cqh);display:grid;container-type:inline-size}.row{grid-template-columns:repeat(5,1fr);gap:5px;display:grid}.tile{--flip-delay:calc(var(--i,0) * .25s);border:2px solid var(--border);text-transform:uppercase;color:var(--text);background:var(--surface);border-radius:var(--radius);place-items:center;font-size:10cqw;font-weight:700;line-height:1;display:grid;position:relative}.tile.filled{border-color:var(--border-filled);animation:.1s ease-out pop}.tile.lock-hint{color:var(--muted);background:0 0;border-style:dashed}.tile-lock{opacity:.8;width:40%;height:40%}button.tile{cursor:pointer;padding:0;font-family:inherit}button.tile:focus-visible{outline:3px solid var(--text);outline-offset:2px}.tile .lock-key{display:none}@media (hover:hover){.tile.pickable:hover .lock-shut{display:none}.tile.pickable:hover .lock-key{display:block}.tile.pickable:hover .tile-badge.lock-key{width:26%}.tile.pickable:hover .tile-lock.lock-key{opacity:1;width:50%;height:50%}.tile.pickable:not(.locked):hover{border-color:var(--locked);color:var(--locked)}}.touch-key{display:none}@media (hover:none){.tile.pickable .touch-key{width:28%;height:28%;color:var(--locked);display:block;position:absolute;bottom:2px;left:3px}.tile.pickable.locked .touch-key{color:#ffd54f}}.tile.cursor{outline:2.5px solid var(--text);outline-offset:1.5px}.tile.picked{border:2px dashed var(--locked);color:var(--text)}.tile.picked .tile-lock,.tile.picked .tile-badge{color:var(--locked);opacity:1;animation:.45s ease-out unlock-pop}@keyframes unlock-pop{0%{transform:scale(.6)rotate(-12deg)}60%{transform:scale(1.2)rotate(6deg)}to{transform:scale(1)rotate(0)}}.tile.locked{background:var(--locked);border-color:var(--locked);color:#fff;animation:.45s ease-out lock-reveal}.tile.locked .tile-badge{color:#ffd54f;animation:.7s ease-out .15s lock-pulse}.tile-badge{opacity:.85;color:#fff;width:22%;height:22%;position:absolute;top:3px;right:3px}.tile.correct,.tile.present,.tile.absent{color:#fff;animation:none}.tile.present,.tile.present .tile-badge{color:var(--present-text)}.tile.correct{background:var(--correct);border-color:var(--correct)}.tile.present{background:var(--present);border-color:var(--present)}.tile.absent{background:var(--absent);border-color:var(--absent)}.tile.reveal{animation:flip .5s ease-in-out var(--flip-delay) both;transition:background-color 0s linear calc(var(--flip-delay) + .25s), border-color 0s linear calc(var(--flip-delay) + .25s), color 0s linear calc(var(--flip-delay) + .25s)}.row.shake{animation:.6s shake}.row.bounce .tile{animation:bounce 1s ease calc(var(--i,0) * .1s)}.row.bounce .tile:first-child{--i:0}.row.bounce .tile:nth-child(2){--i:1}.row.bounce .tile:nth-child(3){--i:2}.row.bounce .tile:nth-child(4){--i:3}.row.bounce .tile:nth-child(5){--i:4}@keyframes lock-reveal{0%{transform:scale(.8)}60%{transform:scale(1.1)}to{transform:scale(1)}}@keyframes lock-pulse{0%,to{opacity:.85;transform:scale(1)}40%{opacity:1;transform:scale(1.6)}}@keyframes pop{50%{transform:scale(1.1)}}@keyframes flip{0%{transform:rotateX(0)}50%{transform:rotateX(-90deg)}to{transform:rotateX(0)}}@keyframes shake{10%,90%{transform:translate(-1px)}20%,80%{transform:translate(2px)}30%,50%,70%{transform:translate(-4px)}40%,60%{transform:translate(4px)}}@keyframes bounce{0%,20%{transform:translateY(0)}40%{transform:translateY(-30px)}50%{transform:translateY(5px)}60%{transform:translateY(-15px)}80%{transform:translateY(2px)}to{transform:translateY(0)}}@media (prefers-reduced-motion:reduce){.tile,.tile-badge,.tile-lock,.row{transition:none!important;animation:none!important}}.keyboard{padding:0 8px 8px}.keyboard-row{touch-action:manipulation;gap:6px;margin-bottom:8px;display:flex}.key{border-radius:var(--radius);background:var(--key-bg);height:56px;color:var(--key-text);text-transform:uppercase;border:none;flex:1;place-items:center;padding:0;font-size:1.15rem;font-weight:700;transition:background-color .15s;display:grid}.key.wide{flex:1.5;font-size:.75rem}.key-spacer{flex:.5}.key.correct{color:#fff}.key.absent{color:var(--key-absent-text)}.key.present{color:var(--present-text)}.key.correct{background:var(--correct)}.key.present{background:var(--present)}.key.absent{background:var(--key-absent)}@media (height<=640px){.key{height:46px}.keyboard-row{margin-bottom:6px}}.toasts{z-index:20;pointer-events:none;flex-direction:column;align-items:center;gap:8px;display:flex;position:fixed;left:50%;transform:translate(-50%)}.toasts.top{top:calc(var(--inset-top) + 110px)}.toasts.bottom{bottom:calc(var(--inset-bottom) + var(--ad-height,0px) + 212px)}@media (height<=640px){.toasts.bottom{bottom:calc(var(--inset-bottom) + var(--ad-height,0px) + 182px)}}.toast{background:var(--toast-bg);color:var(--toast-text);white-space:nowrap;border-radius:4px;padding:12px 16px;font-size:.9rem;font-weight:700}.modal-backdrop{z-index:10;background:var(--backdrop);padding:calc(var(--inset-top) + 16px) calc(var(--inset-right) + 16px) calc(var(--inset-bottom) + var(--ad-height,0px) + 16px) calc(var(--inset-left) + 16px);justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.modal{background:var(--modal-bg);width:100%;max-width:460px;max-height:100%;box-shadow:var(--shadow);-webkit-user-select:text;user-select:text;border-radius:8px;padding:20px 20px 24px;animation:.2s ease-out slide-in;position:relative;overflow-y:auto}@keyframes slide-in{0%{opacity:0;transform:translateY(30px)}}.modal h2{text-transform:uppercase;letter-spacing:.05em;text-align:center;margin:0 0 12px;font-size:1.1rem}.modal h3{text-transform:uppercase;letter-spacing:.04em;margin:18px 0 8px;font-size:.95rem}.modal-close{position:absolute;top:8px;right:8px}.help-heading{text-align:center;margin:12px 0 18px}.help-heading .brand{font-size:2rem}.modal .help-heading h2{color:var(--muted);margin:6px 0 0;font-size:.85rem}.help p{margin:6px 0 12px;font-size:.95rem;line-height:1.4}.row.example{gap:4px;width:220px;margin:8px 0 4px;container-type:inline-size}.row.example .tile{aspect-ratio:1;font-size:1.5rem;animation:none}.answer-reveal{text-align:center;margin:0 0 12px;font-size:1rem}.stat-figures{justify-content:center;gap:8px;display:flex}.stat{text-align:center;flex:1;max-width:80px}.stat-value{font-size:2.2rem;font-weight:400}.stat-label{font-size:.72rem}.distribution{padding:0 8px}.dist-row{align-items:center;gap:6px;margin-bottom:4px;font-size:.85rem;display:flex}.dist-label{width:12px}.dist-bar{background:var(--absent);color:#fff;text-align:right;min-width:24px;padding:2px 8px;font-weight:700}.dist-bar.highlight{background:var(--correct)}.stats-footer{justify-content:space-around;align-items:center;gap:16px;margin-top:20px;display:flex}.next-puzzle{text-align:center}.countdown{font-variant-numeric:tabular-nums;font-size:2rem}.button{text-transform:uppercase;letter-spacing:.04em;border:none;border-radius:999px;padding:12px 28px;font-size:1rem;font-weight:700}.button.primary{background:var(--correct);color:#fff}.button.secondary{background:var(--key-bg);color:var(--key-text)}.support{border-top:1px solid var(--border);color:var(--muted);flex-direction:column;align-items:center;gap:8px;margin-top:20px;padding-top:16px;font-size:.9rem;display:flex}.kofi-link{color:#fff;background:#ff5e5b;border-radius:999px;padding:8px 18px;font-weight:700;text-decoration:none;display:inline-block}.setting{border-bottom:1px solid var(--border);padding:12px 0}.setting h3{margin-top:0}.setting small{color:var(--muted);margin-top:2px;font-size:.8rem;display:block}.row-setting{justify-content:space-between;align-items:center;gap:12px;display:flex}.difficulty-options{flex-direction:column;gap:8px;display:flex}.difficulty-option{border:1px solid var(--border);cursor:pointer;border-radius:8px;align-items:flex-start;gap:10px;padding:10px 12px;display:flex}.difficulty-option.selected{border-color:var(--correct);box-shadow:inset 0 0 0 1px var(--correct)}.difficulty-option input{accent-color:var(--correct);margin-top:3px}.plus-badge{color:#f6c945;letter-spacing:.04em;vertical-align:2px;background:#15171a;border-radius:999px;margin-left:8px;padding:1px 7px;font-size:.7rem;font-weight:700;display:inline-block}.plus-section p{margin:4px 0 12px;font-size:.9rem}.plus-actions{flex-wrap:wrap;align-items:center;gap:16px;display:flex}.link-button{color:var(--muted);cursor:pointer;background:0 0;border:none;padding:0;font-size:.85rem;font-weight:600;text-decoration:underline}.button:disabled,.link-button:disabled{opacity:.6;cursor:default}.difficulty-option.locked-option{opacity:.55;cursor:not-allowed}.setting-note{color:var(--muted);margin:8px 0 0;font-size:.8rem}.switch{flex-shrink:0;width:44px;height:24px;position:relative}.switch input{opacity:0;width:0;height:0}.slider{background:var(--border-filled);cursor:pointer;border-radius:999px;transition:background .15s;position:absolute;inset:0}.slider:before{content:"";background:#fff;border-radius:50%;width:18px;height:18px;transition:transform .15s;position:absolute;top:3px;left:3px}.switch input:checked+.slider{background:var(--correct)}.switch input:checked+.slider:before{transform:translate(20px)}.switch input:focus-visible+.slider{outline:2px solid var(--text);outline-offset:2px}.about{max-width:560px;padding:40px 16px calc(var(--inset-bottom) + 48px);border-top:1px solid var(--border);-webkit-user-select:text;user-select:text;margin:0 auto;line-height:1.6}.about h1{margin:0 0 12px;font-size:1.6rem;line-height:1.2}.about h2{margin:32px 0 8px;font-size:1.2rem}.about h3{margin:20px 0 4px;font-size:1rem}.about p,.about ul{margin:0 0 12px}.about a{color:var(--text)}.about-row{gap:5px;margin:12px 0;display:flex}.about-row span{color:#fff;box-sizing:border-box;border-radius:6px;justify-content:center;align-items:center;width:40px;height:40px;font-size:1.2rem;font-weight:700;display:flex}.about-row .correct{background:var(--correct)}.about-row .present{background:var(--present);color:var(--present-text)}.about-row .absent{background:var(--absent)}.about-row .locked{background:var(--locked)}.about-row .empty{border:2px solid var(--border-filled);color:var(--text)}.about-links{border-top:1px solid var(--border);flex-wrap:wrap;gap:20px;margin-top:32px;padding-top:20px;display:flex}.about-links a{color:var(--muted)}
