*,*:before,*:after{box-sizing:border-box}html,body{margin:0;padding:0;height:100%;overscroll-behavior:none;-webkit-tap-highlight-color:transparent}body{font-family:Segoe UI,system-ui,-apple-system,sans-serif;background:var(--color-bg);color:var(--color-text)}#root{height:100%;height:100dvh}button{font-family:inherit}:root{--color-bg: #1a0a0a;--color-surface: #1a1a1b;--color-border: #2a2a2b;--color-border-tbd: #565656;--color-text: #ffffff;--color-text-muted: #818181;--color-key-bg: #3a3a3c;--color-key-text: #d7dadc;--color-key-absent: #1a1a1b;--color-key-absent-text: #4a4a4c;--color-correct: #6aaa64;--color-present: #c9a227;--color-absent: #3a3a3c;--tile-size: 62px;--tile-gap: 5px;--key-height: 58px;--key-min-width: 42px}@media (max-width: 480px){:root{--tile-size: 54px;--tile-gap: 4px;--key-height: 52px;--key-min-width: 34px}}@media (max-width: 380px){:root{--tile-size: 46px;--tile-gap: 3px;--key-height: 46px;--key-min-width: 29px}}.app{display:flex;flex-direction:column;align-items:center;height:100%;height:100dvh;max-width:500px;margin:0 auto;padding-bottom:env(safe-area-inset-bottom,0px)}.app__board{flex:1;display:flex;align-items:center;justify-content:center}.app__keyboard{width:100%;padding-bottom:8px}.header{display:flex;align-items:center;justify-content:space-between;width:100%;padding:12px 16px;border-bottom:1px solid var(--color-border);box-sizing:border-box}.header__title{font-size:26px;font-weight:800;letter-spacing:2px;margin:0;text-transform:uppercase;color:var(--color-text)}.header__icon{font-style:normal}.header__help{width:34px;height:34px;border-radius:50%;border:2px solid var(--color-border-tbd);background:transparent;color:var(--color-text);font-size:18px;font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center;touch-action:manipulation}.header__help:hover{border-color:var(--color-text)}.header__version{font-size:11px;color:var(--color-text-muted);min-width:34px;text-align:right}.tile{display:flex;align-items:center;justify-content:center;width:var(--tile-size);height:var(--tile-size);border:2px solid var(--color-border);border-radius:4px;font-size:calc(var(--tile-size) * .52);font-weight:700;text-transform:uppercase;color:var(--color-text);background:transparent;transition:border-color .1s;-webkit-user-select:none;user-select:none}.tile[data-status=tbd]{border-color:var(--color-border-tbd)}.tile[data-status=correct]{background:var(--color-correct);border-color:var(--color-correct)}.tile[data-status=present]{background:var(--color-present);border-color:var(--color-present)}.tile[data-status=absent]{background:var(--color-absent);border-color:var(--color-absent);color:var(--color-text-muted)}.tile--reveal{animation:tileFlip .5s ease-in-out forwards;animation-delay:var(--reveal-delay, 0ms)}@keyframes tileFlip{0%{transform:rotateX(0)}50%{transform:rotateX(90deg)}to{transform:rotateX(0)}}.tile--bounce{animation:tileBounce .5s ease-in-out forwards;animation-delay:var(--bounce-delay, 0ms)}@keyframes tileBounce{0%{transform:translateY(0)}40%{transform:translateY(-20px)}60%{transform:translateY(-10px)}80%{transform:translateY(-16px)}to{transform:translateY(0)}}.tile--pop{animation:tilePop .1s ease-in-out}@keyframes tilePop{0%{transform:scale(1)}50%{transform:scale(1.12)}to{transform:scale(1)}}.game-grid{display:flex;flex-direction:column;gap:var(--tile-gap);padding:12px 0}.grid-row{display:flex;gap:var(--tile-gap)}.grid-row--shake{animation:rowShake .5s ease-in-out}@keyframes rowShake{0%{transform:translate(0)}15%{transform:translate(-6px)}30%{transform:translate(6px)}45%{transform:translate(-6px)}60%{transform:translate(6px)}75%{transform:translate(-3px)}90%{transform:translate(3px)}to{transform:translate(0)}}.key{display:flex;align-items:center;justify-content:center;height:var(--key-height);min-width:var(--key-min-width);padding:0 6px;border:none;border-radius:6px;background:var(--color-key-bg);color:var(--color-key-text);font-family:inherit;font-size:14px;font-weight:700;cursor:pointer;touch-action:manipulation;user-select:none;-webkit-user-select:none;transition:background .2s,color .2s}.key--wide{min-width:calc(var(--key-min-width) * 1.6);font-size:12px;letter-spacing:-.3px}.key--correct{background:var(--color-correct);color:#fff}.key--present{background:var(--color-present);color:#fff}.key--absent{background:var(--color-key-absent);color:var(--color-key-absent-text)}.key:active{filter:brightness(.85)}.keyboard{display:flex;flex-direction:column;gap:6px;padding:8px 4px;user-select:none;-webkit-user-select:none}.keyboard-row{display:flex;gap:5px;justify-content:center}.toast{position:fixed;top:80px;left:50%;transform:translate(-50%);background:var(--color-text);color:var(--color-bg);padding:10px 20px;border-radius:8px;font-weight:700;font-size:15px;white-space:nowrap;z-index:1000;pointer-events:none;animation:toastIn .2s ease-out}@keyframes toastIn{0%{opacity:0;transform:translate(-50%) translateY(-10px)}to{opacity:1;transform:translate(-50%) translateY(0)}}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#0009;display:flex;align-items:center;justify-content:center;z-index:500;padding:16px;box-sizing:border-box}.modal-panel{background:var(--color-surface);border:1px solid var(--color-border);border-radius:12px;width:100%;max-width:420px;max-height:90vh;overflow-y:auto;animation:modalIn .2s ease-out}@keyframes modalIn{0%{opacity:0;transform:translateY(-16px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}.modal-header{display:flex;align-items:center;justify-content:space-between;padding:16px 20px 12px;border-bottom:1px solid var(--color-border)}.modal-title{font-size:18px;font-weight:800;letter-spacing:1px;text-transform:uppercase;margin:0}.modal-close{background:transparent;border:2px solid var(--color-border-tbd);color:var(--color-text);width:30px;height:30px;border-radius:50%;font-size:14px;cursor:pointer;display:flex;align-items:center;justify-content:center;touch-action:manipulation}.modal-close:hover{border-color:var(--color-text)}.modal-body{padding:20px}.how-to-play{display:flex;flex-direction:column;gap:12px;font-size:14px;line-height:1.5;color:var(--color-text)}.htp-intro{margin:0;text-align:center}.htp-divider{border:none;border-top:1px solid var(--color-border)}.htp-examples-title{margin:0;text-align:center;text-transform:uppercase;letter-spacing:1px;font-size:13px}.htp-example{display:flex;flex-direction:column;gap:6px}.htp-example p{margin:0}.htp-tiles{display:flex;gap:4px}.htp-tile{width:42px;height:42px;display:flex;align-items:center;justify-content:center;border:2px solid var(--color-border-tbd);border-radius:4px;font-weight:700;font-size:20px;text-transform:uppercase;color:var(--color-text)}.htp-tile--correct{background:var(--color-correct);border-color:var(--color-correct)}.htp-tile--present{background:var(--color-present);border-color:var(--color-present)}.htp-tile--absent{background:var(--color-absent);border-color:var(--color-absent);color:var(--color-text-muted)}.htp-daily{margin:0;text-align:center;font-weight:600}.htp-version{margin:0;text-align:center;color:var(--color-text-muted);font-size:12px}.result-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#0009;display:flex;align-items:center;justify-content:center;z-index:500;padding:16px;box-sizing:border-box}.result-panel{position:relative;background:var(--color-surface);border:1px solid var(--color-border);border-radius:16px;width:100%;max-width:340px;padding:32px 24px 24px;display:flex;flex-direction:column;align-items:center;gap:12px;animation:resultIn .25s ease-out}@keyframes resultIn{0%{opacity:0;transform:scale(.92)}to{opacity:1;transform:scale(1)}}.result-close{position:absolute;top:12px;right:12px;background:transparent;border:2px solid var(--color-border-tbd);color:var(--color-text);width:28px;height:28px;border-radius:50%;font-size:12px;cursor:pointer;touch-action:manipulation;display:flex;align-items:center;justify-content:center}.result-emoji{font-size:48px;line-height:1}.result-title{font-size:22px;font-weight:800;text-transform:uppercase;letter-spacing:2px;margin:0;text-align:center}.result-subtitle{font-size:15px;margin:0;text-align:center;color:var(--color-text-muted)}.result-solution{color:var(--color-text);font-size:18px;letter-spacing:2px}.result-countdown{background:var(--color-bg);border-radius:10px;padding:12px 24px;text-align:center;width:100%;box-sizing:border-box}.result-countdown-label{margin:0 0 4px;font-size:11px;text-transform:uppercase;letter-spacing:1px;color:var(--color-text-muted)}.result-countdown-time{margin:0;font-size:30px;font-weight:800;letter-spacing:2px;font-variant-numeric:tabular-nums}.result-share{width:100%;padding:14px;background:var(--color-correct);border:none;border-radius:10px;color:#fff;font-family:inherit;font-size:16px;font-weight:700;cursor:pointer;touch-action:manipulation;letter-spacing:.5px}.result-share:active{filter:brightness(.88)}