:root{--color-bg: #0f0f10;--color-surface: #1c1c2a;--color-header: #161625;--color-border: rgba(255, 255, 255, .08);--color-text: #f0f0f5;--color-text-secondary: #9d9db5;--color-text-muted: #5a5a78;--color-correct: #4caf6a;--color-correct-light: #66cc80;--color-present: #c9a227;--color-absent: #3a3a4a;--color-empty: #24243a;--color-cell-border: #44445a;--color-cursor-border: #f0f0f5;--color-submit: #4caf6a;--color-submit-hover: #66cc80;--color-submit-disabled: #3a3a4a;--color-theme-bg: #1a1a40;--color-theme-accent: #e94560;--header-height: 52px;--cell-gap: 5px;--cell-size: clamp(44px, 10vw, 60px);--radius: 8px;--font-main: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;--font-mono: ui-monospace, "SF Mono", Menlo, Consolas, monospace;--shadow-sm: 0 1px 3px rgba(0, 0, 0, .3);--shadow-md: 0 4px 12px rgba(0, 0, 0, .4);color-scheme:dark}@media (prefers-color-scheme: light){:root{--color-bg: #f5f5f7;--color-surface: #ffffff;--color-header: #ffffff;--color-border: rgba(0, 0, 0, .08);--color-text: #1a1a2e;--color-text-secondary: #5a5a78;--color-text-muted: #9d9db5;--color-correct: #4caf6a;--color-correct-light: #3d9e5a;--color-present: #c9a227;--color-absent: #c4c4cc;--color-empty: #eeeef2;--color-cell-border: #d0d0da;--color-cursor-border: #1a1a2e;--color-submit: #4caf6a;--color-submit-hover: #3d9e5a;--color-submit-disabled: #c4c4cc;--color-theme-bg: #eef0ff;--color-theme-accent: #d63851;--shadow-sm: 0 1px 3px rgba(0, 0, 0, .08);--shadow-md: 0 4px 12px rgba(0, 0, 0, .1);color-scheme:light}}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{height:100%;-webkit-tap-highlight-color:transparent}body{min-height:100%;background:var(--color-bg);color:var(--color-text);font-family:var(--font-main);font-size:16px;line-height:1.5;-webkit-font-smoothing:antialiased;transition:background .3s,color .3s}body.modal-open{overflow:hidden}#app{display:flex;flex-direction:column;min-height:100dvh}#header{display:flex;align-items:center;justify-content:space-between;height:var(--header-height);padding:0 16px;background:var(--color-header);border-bottom:1px solid var(--color-border);position:sticky;top:0;z-index:10;box-shadow:var(--shadow-sm)}#header h1{font-size:1.15rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--color-text)}.header-left,.header-right{width:40px;display:flex;align-items:center}.header-right{justify-content:flex-end}.icon-btn{background:none;border:1px solid var(--color-border);color:var(--color-text);font-size:1rem;cursor:pointer;padding:6px;border-radius:10px;transition:background .15s,border-color .15s;display:flex;align-items:center;justify-content:center;width:34px;height:34px;font-weight:700}.icon-btn:hover,.icon-btn:focus-visible{background:var(--color-empty);border-color:var(--color-cell-border);outline:none}#game-container{flex:1;display:flex;flex-direction:column;align-items:center;padding:16px 16px 40px;gap:10px;max-width:500px;margin:0 auto;width:100%}.day-label{font-size:.7rem;text-transform:uppercase;letter-spacing:.12em;color:var(--color-text-muted);align-self:flex-end;font-weight:500}.theme-banner{display:flex;flex-direction:column;align-items:center;background:var(--color-theme-bg);border:1px solid rgba(233,69,96,.2);border-radius:14px;padding:14px 28px;width:100%;margin-bottom:2px;box-shadow:var(--shadow-sm)}.theme-label{font-size:.6rem;text-transform:uppercase;letter-spacing:.18em;color:var(--color-text-muted);margin-bottom:2px;font-weight:600}.theme-word{font-size:clamp(1.5rem,6vw,2.1rem);font-weight:800;letter-spacing:.2em;text-transform:uppercase;color:var(--color-theme-accent);text-shadow:0 0 24px rgba(233,69,96,.3)}.instruction{font-size:.78rem;color:var(--color-text-secondary);text-align:center;margin-bottom:2px}.words-section{display:flex;flex-direction:column;gap:10px;width:100%}.word-row-wrapper{display:flex;flex-direction:column;align-items:center;gap:8px;padding:12px 16px;background:var(--color-surface);border:1px solid var(--color-border);border-radius:12px;transition:border-color .3s,box-shadow .3s;box-shadow:var(--shadow-sm);position:relative}.word-row-wrapper.solved{border-color:var(--color-correct);box-shadow:0 0 0 1px var(--color-correct),var(--shadow-sm)}.word-warning{font-size:1rem;color:#e94560;position:absolute;right:10px;top:50%;transform:translateY(-50%);font-weight:600;line-height:1}.cell-grid{display:flex;gap:var(--cell-gap);justify-content:center}.cell{width:var(--cell-size);height:var(--cell-size);display:flex;align-items:center;justify-content:center;font-size:clamp(1rem,4vw,1.4rem);font-weight:700;text-transform:uppercase;border:2px solid var(--color-cell-border);border-radius:var(--radius);background:var(--color-empty);cursor:pointer;-webkit-user-select:none;user-select:none;transition:background .2s,border-color .2s,transform .1s,box-shadow .2s;position:relative;letter-spacing:0}@media (max-width: 380px){:root{--cell-size: 42px;--cell-gap: 4px}}@media (max-width: 340px){:root{--cell-size: 36px;--cell-gap: 3px}}.cell:active:not(.locked){transform:scale(.93)}.cell.cursor{border-color:var(--color-cursor-border);box-shadow:0 0 0 2px #8080ff40}.cell.status-empty:not(:empty){border-color:var(--color-text-secondary);animation:pop .1s ease}@keyframes pop{0%{transform:scale(1)}50%{transform:scale(1.1)}to{transform:scale(1)}}.cell.status-correct,.legend-cell.status-correct{background:var(--color-correct);border-color:var(--color-correct);color:#fff}.cell.status-present,.legend-cell.status-present{background:var(--color-present);border-color:var(--color-present);color:#fff}.cell.status-absent,.legend-cell.status-absent{background:var(--color-absent);border-color:var(--color-absent)}@media (prefers-color-scheme: dark){.cell.status-absent,.legend-cell.status-absent{color:#fff9}}@media (prefers-color-scheme: light){.cell.status-absent,.legend-cell.status-absent{color:#00000080}}.cell.locked{cursor:default}@keyframes flip-reveal{0%{transform:scaleY(1)}45%{transform:scaleY(0)}55%{transform:scaleY(0)}to{transform:scaleY(1)}}.cell.flip-reveal{animation:flip-reveal .2s ease}@keyframes flip-in{0%{transform:scaleY(1)}40%{transform:scaleY(0)}60%{transform:scaleY(0);background:var(--color-correct);border-color:var(--color-correct)}to{transform:scaleY(1);background:var(--color-correct);border-color:var(--color-correct)}}.cell.reveal-correct{animation:flip-in .55s ease forwards}.relation-text{font-size:.8rem;color:var(--color-text-secondary);text-align:center;font-style:italic;max-width:340px;line-height:1.5;border-top:1px solid var(--color-border);padding-top:8px;width:100%}@keyframes fade-in{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}.relation-text.reveal-fade{animation:fade-in .5s ease forwards}.submit-row{display:flex;flex-direction:column;align-items:center;gap:8px;margin-top:8px;width:100%}.submit-btn{width:100%;max-width:260px;padding:12px;font-size:.9rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:#fff;background:var(--color-submit);border:none;border-radius:10px;cursor:pointer;transition:background .2s,transform .1s,opacity .2s,box-shadow .2s;box-shadow:var(--shadow-sm)}.submit-btn:hover:not(:disabled){background:var(--color-submit-hover);box-shadow:var(--shadow-md)}.submit-btn:active:not(:disabled){transform:scale(.97)}.submit-btn:disabled{background:var(--color-submit-disabled);opacity:.5;cursor:not-allowed;box-shadow:none}.submit-btn-wrapper{position:relative;width:100%;display:flex;justify-content:center}.submit-btn-wrapper[data-tooltip]:after{content:attr(data-tooltip);position:absolute;bottom:calc(100% + 8px);left:50%;transform:translate(-50%);background:#000000d1;color:#fff;padding:5px 10px;border-radius:6px;font-size:.75rem;white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .2s;z-index:10}.submit-btn-wrapper[data-tooltip]:hover:after{opacity:1}.attempt-label{font-size:.72rem;color:var(--color-text-muted);font-weight:500}.next-day-btn{margin-top:16px;padding:8px 18px;font-size:.78rem;font-weight:600;color:var(--color-text-secondary);background:transparent;border:1px dashed var(--color-text-muted);border-radius:8px;cursor:pointer;opacity:.6;transition:opacity .2s,border-color .2s}.next-day-btn:hover{opacity:1;border-color:var(--color-text-secondary)}.guessed-letters{display:flex;flex-wrap:wrap;gap:5px;justify-content:center;width:100%;max-width:280px;margin-bottom:4px}.guessed-letter{width:28px;height:28px;display:flex;align-items:center;justify-content:center;font-size:.72rem;font-weight:700;text-transform:uppercase;border-radius:6px;color:#fff}@keyframes guessed-letter-enter{0%{opacity:0;transform:translateY(8px) scale(.8)}to{opacity:1;transform:translateY(0) scale(1)}}.guessed-letter.guessed-letter-enter{animation:guessed-letter-enter .35s ease forwards}.guessed-letter.status-present{background:var(--color-present)}.guessed-letter.status-absent{background:var(--color-absent)}@media (prefers-color-scheme: dark){.guessed-letter.status-absent{color:#fff9}}@media (prefers-color-scheme: light){.guessed-letter.status-absent{color:#00000080}}.completion-banner{display:flex;flex-direction:column;align-items:center;gap:8px;padding:24px 20px;background:var(--color-surface);border:2px solid var(--color-correct);border-radius:14px;width:100%;text-align:center;margin-top:8px;box-shadow:0 0 0 1px var(--color-correct),var(--shadow-md)}.completion-emoji{font-size:2.5rem}.completion-banner h2{font-size:1.2rem;font-weight:700}.completion-banner p{color:var(--color-text-secondary);font-size:.85rem}.streak-line{font-size:.95rem!important;color:#ff9f43!important;font-weight:600}.next-label{font-size:.75rem!important;color:var(--color-text-muted)!important;margin-top:4px}.hidden-input{position:fixed;left:-9999px;top:-9999px;width:1px;height:1px;opacity:0;pointer-events:none}.toast{position:fixed;top:calc(var(--header-height) + 12px);left:50%;transform:translate(-50%) translateY(-8px);background:var(--color-surface);color:var(--color-text);padding:10px 20px;border-radius:24px;border:1px solid var(--color-border);font-size:.82rem;font-weight:600;z-index:200;pointer-events:none;opacity:0;transition:opacity .25s,transform .25s;white-space:nowrap;box-shadow:var(--shadow-md)}.toast.show{opacity:1;transform:translate(-50%) translateY(0)}#modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000080;z-index:50;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.modal{position:fixed;top:0;right:0;bottom:0;left:0;z-index:60;display:flex;align-items:flex-end;justify-content:center;pointer-events:none}@media (min-width: 480px){.modal{align-items:center}}.modal-content{pointer-events:all;background:var(--color-surface);border:1px solid var(--color-border);border-radius:18px 18px 0 0;padding:24px 20px 32px;width:100%;max-width:440px;max-height:90dvh;overflow-y:auto;position:relative;box-shadow:var(--shadow-md)}@media (min-width: 480px){.modal-content{border-radius:18px;padding:28px 28px 32px}}.modal-content h2{font-size:1rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;margin-bottom:16px;text-align:center}.modal-close{position:absolute;top:14px;right:14px;background:none;border:none;color:var(--color-text-secondary);font-size:1rem;cursor:pointer;padding:4px 8px;border-radius:6px;transition:background .15s}.modal-close:hover{background:var(--color-empty)}.rules-body p{margin-bottom:12px;font-size:.85rem;color:var(--color-text-secondary);line-height:1.6}.rules-body ul{padding-left:20px;margin-bottom:12px}.rules-body li{font-size:.85rem;color:var(--color-text-secondary);margin-bottom:6px;line-height:1.5}.rules-body strong{color:var(--color-text)}.rules-body kbd{display:inline-block;padding:2px 6px;background:var(--color-empty);border:1px solid var(--color-border);border-radius:5px;font-family:var(--font-mono);font-size:.78rem;color:var(--color-text)}.rules-legend{display:flex;flex-direction:column;gap:8px;margin:12px 0 16px}.legend-row{display:flex;align-items:center;gap:12px}.legend-cell{width:38px;height:38px;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:.95rem;border-radius:var(--radius);border:2px solid transparent;flex-shrink:0}.legend-row span{font-size:.82rem;color:var(--color-text-secondary)}.stats-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:16px}.stat-box{display:flex;flex-direction:column;align-items:center;background:var(--color-bg);border-radius:10px;padding:12px 8px;border:1px solid var(--color-border)}.stat-value{font-size:1.5rem;font-weight:700;line-height:1;margin-bottom:4px}.stat-key{font-size:.6rem;text-transform:uppercase;letter-spacing:.08em;color:var(--color-text-muted);text-align:center;font-weight:500}.stats-note{font-size:.8rem;color:var(--color-text-secondary);text-align:center;padding:10px;background:var(--color-bg);border-radius:10px;border:1px solid var(--color-border)}.stats-note strong{color:var(--color-text)}.confetti-canvas{position:fixed;top:0;right:0;bottom:0;left:0;z-index:300;pointer-events:none}.hidden{display:none!important}:focus-visible{outline:2px solid var(--color-theme-accent);outline-offset:2px}