:root{--color-bg:#121213;--color-text:#fff;--color-text-soft:#ccc;--color-panel:#1a1a1b;--color-panel-alt:#2a2a2b;--color-border:#3a3a3c;--color-border-strong:#565758;--color-muted:#818384;--color-muted-subtle:#565758;--color-overlay:#000000a6;--color-green:#538d4e;--color-correct:#6aaa64;--color-yellow:#b59f3b;--color-present:#c9b458;--color-absent:#a83232;--color-danger:#a1392e;--color-error:#e74c3c;--color-rare:#371010;--color-key-bg:#818384;--color-key-used:#3a3a3c;--color-key-text:#fff;--color-on-accent:#fff}:root[data-theme=light]{--color-bg:#f6f7f8;--color-text:#1f2328;--color-text-soft:#3f4650;--color-panel:#fff;--color-panel-alt:#eceff3;--color-border:#d0d7de;--color-border-strong:#8c959f;--color-muted:#57606a;--color-muted-subtle:#6e7781;--color-overlay:#1f232873;--color-rare:#f4c7c3;--color-key-bg:#d0d7de;--color-key-used:#8c959f;--color-key-text:#1f2328}*{box-sizing:border-box;margin:0;padding:0}body{background:var(--color-bg);color:var(--color-text);scrollbar-gutter:stable;flex-direction:column;align-items:center;min-height:100vh;padding:16px 0;font-family:Segoe UI,sans-serif;display:flex}@media (width<=450px){#root{width:96vw}}#app{flex-direction:column;align-items:center;width:100%;max-width:480px;display:flex}#header{border-bottom:1px solid var(--color-border);justify-content:center;align-items:center;width:100%;margin-bottom:20px;padding-bottom:12px;display:flex;position:relative}#color-hint{text-align:center;width:100%;color:var(--color-muted);margin:-8px 0 16px;font-size:.85rem}h1{letter-spacing:.2rem;text-align:center;font-size:clamp(1.4rem,6vw,2rem)}#rules-btn{background:var(--color-panel-alt);border:1px solid var(--color-border);width:28px;height:28px;color:var(--color-muted);cursor:pointer;border-radius:50%;justify-content:center;align-items:center;padding:0;font-size:1rem;font-weight:700;transition:background .1s,color .1s;display:flex;position:absolute;top:50%;right:0;transform:translateY(-50%)}#rules-btn:hover{background:var(--color-border);color:var(--color-text)}#theme-toggle{position:absolute;top:50%;left:0;transform:translateY(-50%)}#theme-toggle .toggle-switch{width:46px;height:24px}#theme-toggle .toggle-slider{border-radius:12px}#theme-toggle .toggle-slider:before{width:18px;height:18px}#theme-toggle .toggle-switch input:checked+.toggle-slider:before{transform:translate(22px)}#theme-toggle .toggle-switch input:checked+.theme-slider{background:#3a3a3c}:root[data-theme=light] #theme-toggle .toggle-switch input:checked+.theme-slider{background:#8c959f}.theme-icon{z-index:1;pointer-events:none;width:12px;height:12px;position:absolute;top:6px}.moon-icon{left:6px}.sun-icon{right:6px}#rules-overlay{background:var(--color-overlay);z-index:100;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}#rules-dialog{background:var(--color-panel);border:1px solid var(--color-border);width:90%;max-width:360px;color:var(--color-text-soft);border-radius:10px;flex-direction:column;gap:14px;padding:28px 28px 20px;font-size:.9rem;line-height:1.6;display:flex}#rules-dialog strong{color:var(--color-text);font-size:1rem}#rules-close{background:var(--color-border);color:var(--color-text);align-self:center;margin-top:4px;padding:8px 24px;font-size:.9rem}#mode-tabs{gap:6px;width:100%;max-width:480px;margin-bottom:20px;display:flex}.mode-tab{letter-spacing:.05rem;background:var(--color-panel-alt);color:var(--color-muted);border:1px solid var(--color-border);cursor:pointer;border-radius:6px;flex:1;padding:8px 0;font-size:.85rem;font-weight:700;transition:background .1s,color .1s,border-color .1s}.mode-tab.active{background:var(--color-green);color:var(--color-on-accent);border-color:var(--color-green)}#confirm-overlay{background:var(--color-overlay);z-index:100;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}#confirm-dialog{background:var(--color-panel);border:1px solid var(--color-border);text-align:center;border-radius:10px;flex-direction:column;gap:20px;width:90%;max-width:320px;padding:28px 32px;display:flex}#confirm-dialog p{color:var(--color-text);font-size:1rem;line-height:1.5}#confirm-buttons{justify-content:center;gap:10px;display:flex}.confirm-yes{background:var(--color-green);color:var(--color-on-accent);min-width:72px}.confirm-no{background:var(--color-border);color:var(--color-text);min-width:72px}#guess-list{flex-direction:column;gap:8px;width:100%;max-width:480px;min-height:40px;margin-bottom:24px;display:flex}.guess-row{background:var(--color-panel);border:1px solid var(--color-border);border-radius:6px;align-items:center;gap:clamp(6px,2vw,12px);width:fit-content;margin:auto;padding:6px clamp(8px,2vw,12px);display:flex}.letter-boxes{flex:1;gap:clamp(3px,1.2vw,5px);display:flex}.letter-box{border:2px solid var(--color-border-strong);cursor:pointer;-webkit-user-select:none;user-select:none;border-radius:4px;justify-content:center;align-items:center;width:clamp(30px,9vw,46px);height:clamp(30px,9vw,46px);font-size:clamp(.85rem,3.5vw,1.3rem);font-weight:700;transition:background .4s,border-color .4s,transform .15s;display:flex}.letter-box.color-absent{background:var(--color-absent);border-color:var(--color-absent);color:var(--color-on-accent)}.letter-box.color-yellow{background:var(--color-present);border-color:var(--color-present);color:var(--color-on-accent)}.letter-box.color-green{background:var(--color-correct);border-color:var(--color-correct);color:var(--color-on-accent)}.guess-row:not(.current-guess) .letter-box:hover{transform:scale(1.05)}@keyframes flip-down{0%{transform:scaleY(1)}to{transform:scaleY(0)}}@keyframes flip-up{0%{transform:scaleY(0)}60%{transform:scaleY(1.18)}80%{transform:scaleY(.92)}to{transform:scaleY(1)}}.letter-box.flip-down{transition:none;animation:.2s ease-in forwards flip-down}.letter-box.flip-up{transition:none;animation:.28s ease-out forwards flip-up}.feedback-squares{gap:clamp(3px,1.5vw,6px);display:flex}.feedback-square{width:clamp(26px,8vw,40px);height:clamp(26px,8vw,40px);color:var(--color-on-accent);border-radius:4px;justify-content:center;align-items:center;font-size:clamp(.7rem,2.8vw,1rem);font-weight:700;display:flex}.feedback-square.correct{background:var(--color-correct)}.feedback-square.present{background:var(--color-present)}.feedback-square.absent{background:var(--color-absent)}.current-guess .letter-box{cursor:default}.current-guess .feedback-square{background:var(--color-panel-alt);border:1px solid var(--color-border)}#keyboard{flex-direction:column;gap:clamp(4px,1.2vw,6px);width:100%;max-width:480px;margin-bottom:20px;display:flex}#bottom-controls{flex-direction:column;align-items:center;width:100%;max-width:480px;display:flex}.keyboard-row{gap:clamp(3px,1vw,4px);display:flex}.key{letter-spacing:0;text-transform:uppercase;background:var(--color-key-bg);min-width:0;height:clamp(40px,11.5vw,50px);color:var(--color-key-text);cursor:pointer;-webkit-user-select:none;user-select:none;border:none;border-radius:4px;flex:1;justify-content:center;align-items:center;padding:0;font-family:Segoe UI,sans-serif;font-size:clamp(.7rem,2.8vw,1rem);font-weight:700;transition:background .1s;display:flex}.key:active{filter:brightness(1.25)}.key-wide{flex:1.5;font-size:clamp(.58rem,2.2vw,.8rem)}.key-enter{background:var(--color-green);color:var(--color-on-accent)}.key-backspace{background:var(--color-danger);color:var(--color-on-accent)}.key-clear-colors{background:var(--color-panel-alt);color:var(--color-key-text);flex:.9}.backspace-icon{width:auto;height:1rem;display:block}:root[data-theme=light] .key-clear-colors{background:var(--color-key-bg);color:var(--color-key-text)}.clear-colors-icon{width:23px;height:23px;display:block}.clear-colors-icon-light,:root[data-theme=light] .clear-colors-icon-dark{display:none}:root[data-theme=light] .clear-colors-icon-light{display:block}.key-used{background:var(--color-key-used)}.key-rare{background:var(--color-rare)}button{cursor:pointer;letter-spacing:.05rem;touch-action:manipulation;border:none;border-radius:6px;padding:10px 20px;font-size:1rem;font-weight:700}.new-game-btn{background:var(--color-border);color:var(--color-text)}#daily-message{text-align:center;width:100%;max-width:480px;min-height:28px;color:var(--color-muted-subtle);margin-bottom:16px;font-size:.85rem}#status{text-align:center;width:100%;max-width:480px;min-height:28px;color:var(--color-muted);margin-bottom:16px;font-size:.95rem}#status.error{color:var(--color-error)}#status.win{color:var(--color-green);font-size:1.1rem;font-weight:700}#status.loss{color:var(--color-yellow)}#guesses-left{color:var(--color-muted-subtle);margin-bottom:16px;font-size:.85rem}.toggle-label{cursor:pointer;color:var(--color-text-soft);-webkit-user-select:none;user-select:none;justify-content:space-between;align-items:center;font-size:.9rem;display:flex}.toggle-label-text{flex-direction:column;gap:2px;display:flex}.toggle-switch{flex-shrink:0;width:40px;height:22px;position:relative}.toggle-switch input{opacity:0;width:0;height:0;position:absolute}.toggle-slider{background:var(--color-border);border-radius:11px;transition:background .15s;position:absolute;inset:0}.toggle-slider:before{content:"";background:var(--color-on-accent);border-radius:50%;width:16px;height:16px;transition:transform .15s;position:absolute;top:3px;left:3px}.toggle-switch input:checked+.toggle-slider{background:var(--color-green)}.toggle-switch input:checked+.toggle-slider:before{transform:translate(18px)}