:root{font-family:Inter,system-ui,Arial,sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0}button,input,select{font:inherit}.theme-light{--bg:#f5f7fb;--text:#111;--muted:#555;--card:#fff;--shadow:#00000014;--chip:#e9edf5;--input-border:#cfd6e4;--input-bg:#fff;--btn-bg:#111;--btn-text:#fff;--status-ok:#156f2d;--status-error:#b42318;--key-bg:#dfe5f0;--key-vowel-bg:#eef3ff;--key-used-bg:#cfd6e4;--key-active-bg:#111;--key-active-text:#fff;--win-bg:#e8fff0;--win-text:#156f2d;--modal-bg:#00000073;--sticky-shadow:#0000001a;--progress-track:#dde4f0;--progress-fill:#111;--accent-soft:#eef3ff;--ok-soft:#e8fff0;--error-soft:#fff1f0;--header-backdrop:#f5f7fbd1;--danger-bg:#d92d20;--danger-text:#fff;--success-bg:#16a34a;--success-text:#fff;--reveal-btn-bg:#1f2937;--reveal-btn-text:#fff}.theme-dark{--bg:#0b0f14;--text:#f7f9fc;--muted:#c2cbda;--card:#131922;--shadow:#0000006b;--chip:#202835;--input-border:#344054;--input-bg:#0f141c;--btn-bg:#f7f9fc;--btn-text:#111;--status-ok:#7df2a2;--status-error:#ff9a9a;--key-bg:#243040;--key-vowel-bg:#304055;--key-used-bg:#1a2230;--key-active-bg:#f7f9fc;--key-active-text:#111;--win-bg:#173122;--win-text:#9af8b6;--modal-bg:#000000ad;--sticky-shadow:#00000073;--progress-track:#202a38;--progress-fill:#f7f9fc;--accent-soft:#162131;--ok-soft:#173122;--error-soft:#301b1b;--header-backdrop:#0b0f14d1;--danger-bg:#ef4444;--danger-text:#fff;--success-bg:#22c55e;--success-text:#08110c;--reveal-btn-bg:#e5e7eb;--reveal-btn-text:#111}body{background:var(--bg);color:var(--text)}.app-shell{background:var(--bg);min-height:100vh;color:var(--text);justify-content:center;padding:16px;display:flex}.game-container{flex-direction:column;gap:16px;width:100%;max-width:560px;padding-bottom:220px;display:flex}.card{background:var(--card);box-shadow:0 8px 24px var(--shadow);border-radius:16px;padding:16px}.card.flash-success{animation:.36s flashSuccess}.card.flash-error{animation:.3s flashError}.header-sticky{z-index:45;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:var(--header-backdrop);border:1px solid var(--input-border);padding:12px 14px;position:sticky;top:0}.title{margin:0;font-size:1.8rem}.category-focus{align-items:center;gap:8px;margin-top:8px;animation:.45s categoryPop;display:flex}.category-focus-emoji{font-size:1.1rem;line-height:1}.category-focus-text{letter-spacing:.04em;text-transform:uppercase;color:var(--progress-fill);font-size:1.15rem;font-weight:900}.progress{font-size:1.1rem;font-weight:700}.progress-bar{background:var(--progress-track);border-radius:999px;height:10px;margin-top:12px;overflow:hidden}.progress-fill{background:var(--progress-fill);border-radius:999px;height:100%;transition:width .3s}.meta-row{flex-wrap:wrap;justify-content:space-between;gap:12px;display:flex}.info-pill-row{flex-wrap:wrap;gap:8px;margin-top:12px;display:flex}.info-pill{background:var(--chip);border-radius:999px;padding:8px 12px;font-size:.92rem;font-weight:700}.used-letters{flex-wrap:wrap;gap:8px;display:flex}.letter-chip{background:var(--chip);text-transform:uppercase;border-radius:10px;justify-content:center;align-items:center;min-width:36px;height:36px;font-weight:700;display:flex}.form-row{gap:8px;display:flex}.guess-input{border:1px solid var(--input-border);background:var(--input-bg);min-width:0;height:48px;color:var(--text);border-radius:12px;flex:1;padding:0 12px}.guess-display{border:1px solid var(--input-border);background:var(--input-bg);min-width:0;min-height:52px;color:var(--text);-webkit-user-select:none;user-select:none;border-radius:12px;flex-wrap:wrap;flex:1;align-items:center;gap:8px;padding:0 12px;display:flex}.guess-display.placeholder{color:var(--muted);font-weight:500}.guess-char{background:var(--chip);text-transform:uppercase;border-radius:8px;justify-content:center;align-items:center;min-width:28px;height:32px;font-weight:800;animation:.12s popIn;display:inline-flex}.submit-btn{cursor:pointer;background:var(--btn-bg);height:48px;color:var(--btn-text);border:0;border-radius:12px;padding:0 16px;font-weight:800;transition:transform .12s,opacity .12s,filter .12s}.submit-btn.ok-btn{background:var(--success-bg);color:var(--success-text)}.submit-btn.reveal-btn{background:var(--reveal-btn-bg);color:var(--reveal-btn-text)}.submit-btn:hover:not(:disabled),.secondary-btn:hover:not(:disabled),.theme-toggle:hover:not(:disabled),.key:hover:not(:disabled){transform:translateY(-1px)}.submit-btn:disabled,.secondary-btn:disabled,.theme-toggle:disabled,.key:disabled{opacity:.6;cursor:not-allowed}.status{min-height:24px;margin-top:8px;font-weight:700}.status.ok{color:var(--status-ok)}.status.error{color:var(--status-error)}.answer-list{flex-direction:column;gap:8px;margin:0;padding:0;list-style:none;display:flex}.answer-item{background:var(--chip);border-radius:10px;justify-content:space-between;align-items:center;gap:12px;padding:10px 12px;display:flex}.answer-item.found{background:var(--ok-soft)}.answer-list.compact .answer-item{padding:8px 10px}.answer-check{color:var(--status-ok);font-weight:900}.keyboard{gap:8px;display:grid}.keyboard-row{grid-template-columns:repeat(10,1fr);gap:8px;display:grid}.key{background:var(--key-bg);min-height:48px;color:var(--text);cursor:pointer;border:0;border-radius:12px;font-weight:800;transition:transform 80ms,background .16s,opacity .16s,filter .12s}.key.vowel{background:var(--key-vowel-bg)}.key.used{background:var(--key-used-bg);opacity:.42}.key.active{background:var(--key-active-bg);color:var(--key-active-text)}.key.wide{grid-column:span 2}.key.del-key{background:var(--danger-bg);color:var(--danger-text)}.key.invalid-press{animation:.28s invalidKeyPress}.key.success-press{animation:.32s successKeyPulse}.win-banner{background:var(--win-bg);color:var(--win-text);border-radius:12px;padding:12px;font-weight:800}.complete-card{background:linear-gradient(135deg, var(--win-bg), var(--accent-soft));border:1px solid var(--input-border);text-align:center}.complete-title{margin:0;font-size:1.4rem;font-weight:900}.complete-subtitle{color:var(--muted);margin:10px 0 0;line-height:1.5}.complete-actions{flex-wrap:wrap;justify-content:center;gap:10px;margin-top:16px;display:flex}.modal-backdrop{background:var(--modal-bg);z-index:1000;justify-content:center;align-items:center;padding:16px;display:flex;position:fixed;inset:0}.modal-card{background:var(--card);width:100%;max-width:560px;max-height:85vh;color:var(--text);box-shadow:0 16px 40px var(--shadow);border-radius:18px;padding:18px;overflow-y:auto}.modal-header{justify-content:space-between;align-items:center;gap:12px;margin-bottom:12px;display:flex}.modal-title{margin:0;font-size:1.2rem}.modal-actions{flex-wrap:wrap;gap:8px;margin-top:16px;display:flex}.secondary-btn{border:1px solid var(--input-border);cursor:pointer;background:var(--card);height:44px;color:var(--text);border-radius:12px;padding:0 14px;font-weight:800;transition:transform .12s,opacity .12s}.top-bar{justify-content:space-between;align-items:center;gap:12px;display:flex}.top-bar>div:last-child{flex-wrap:wrap;gap:8px;display:flex}.theme-toggle{border:1px solid var(--input-border);cursor:pointer;background:var(--card);height:40px;color:var(--text);border-radius:12px;padding:0 12px;font-weight:800;transition:transform .12s,opacity .12s}.sticky-controls{z-index:80;pointer-events:none;padding:0 16px calc(env(safe-area-inset-bottom,0px) + 8px);background:linear-gradient(#0b0f1400 0%,#0b0f14e0 45%,#0b0f14f5 100%);justify-content:center;display:flex;position:fixed;bottom:0;left:0;right:0}.theme-light .sticky-controls{background:linear-gradient(#f5f7fb00 0%,#f5f7fbe0 45%,#f5f7fbf5 100%)}.sticky-controls-inner{pointer-events:auto;background:0 0;flex-direction:column;gap:8px;width:100%;max-width:560px;padding-top:4px;display:flex}.sticky-panel{background:var(--card);box-shadow:0 -6px 18px var(--sticky-shadow);border:1px solid var(--input-border);border-radius:16px;padding:10px}.control-actions{flex-wrap:wrap;gap:8px;margin-top:8px;display:flex}.keyboard-hint{pointer-events:none;justify-content:center;display:flex}.keyboard-hint-badge{background:var(--btn-bg);color:var(--btn-text);box-shadow:0 8px 20px var(--shadow);border-radius:999px;align-items:center;gap:8px;padding:8px 14px;font-size:.9rem;font-weight:800;animation:1.2s ease-in-out infinite keyboardHintFloat;display:inline-flex}.keyboard-panel-pulse{animation:1.2s ease-in-out infinite keyboardPanelPulse}.reveal-summary-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-bottom:16px;display:grid}.reveal-stat{background:var(--chip);border-radius:12px;padding:12px}.reveal-stat-label{color:var(--muted);font-size:.85rem;font-weight:700}.reveal-stat-value{margin-top:4px;font-size:1.1rem;font-weight:900}.rating-badge{background:var(--accent-soft);border-radius:999px;align-items:center;gap:6px;padding:8px 12px;font-weight:800;display:inline-flex}.finished-bar{justify-content:space-between;align-items:center;gap:12px;display:flex}.finished-bar-copy{min-width:0}.finished-bar-title{font-size:1rem;font-weight:900}.finished-bar-subtitle{color:var(--muted);margin-top:4px;font-weight:600}.finished-bar-actions{flex-wrap:wrap;gap:8px;display:flex}.toast{z-index:120;min-width:220px;max-width:min(92vw,420px);box-shadow:0 14px 32px var(--shadow);border:1px solid var(--input-border);background:var(--card);color:var(--text);text-align:center;pointer-events:none;border-radius:14px;padding:12px 16px;font-weight:800;animation:.18s toastIn,.18s 1.82s forwards toastOut;position:fixed;bottom:110px;left:50%;transform:translate(-50%)}.toast-ok{background:var(--win-bg);color:var(--win-text);border-color:#0000}.toast-error{background:var(--error-soft);color:var(--status-error);border-color:#0000}@keyframes invalidKeyPress{0%{transform:translate(0)}20%{transform:translate(-3px)}40%{transform:translate(3px)}60%{transform:translate(-2px)}80%{transform:translate(2px)}to{transform:translate(0)}}@keyframes successKeyPulse{0%{transform:scale(1)}40%{transform:scale(1.08)}to{transform:scale(1)}}@keyframes flashSuccess{0%{box-shadow:0 8px 24px var(--shadow)}40%{box-shadow:0 0 0 2px var(--status-ok), 0 8px 24px var(--shadow)}to{box-shadow:0 8px 24px var(--shadow)}}@keyframes flashError{0%{box-shadow:0 8px 24px var(--shadow)}35%{box-shadow:0 0 0 2px var(--status-error), 0 8px 24px var(--shadow)}to{box-shadow:0 8px 24px var(--shadow)}}@keyframes popIn{0%{opacity:.5;transform:scale(.92)}to{opacity:1;transform:scale(1)}}@keyframes keyboardPanelPulse{0%{box-shadow:0 -6px 18px var(--sticky-shadow);transform:translateY(0)}50%{box-shadow:0 0 0 2px var(--progress-fill), 0 -10px 26px var(--sticky-shadow);transform:translateY(-2px)}to{box-shadow:0 -6px 18px var(--sticky-shadow);transform:translateY(0)}}@keyframes keyboardHintFloat{0%{opacity:.92;transform:translateY(0)}50%{opacity:1;transform:translateY(-4px)}to{opacity:.92;transform:translateY(0)}}@keyframes categoryPop{0%{opacity:0;transform:scale(.92)}to{opacity:1;transform:scale(1)}}@keyframes toastIn{0%{opacity:0;transform:translate(-50%)translateY(8px)scale(.98)}to{opacity:1;transform:translate(-50%)translateY(0)scale(1)}}@keyframes toastOut{0%{opacity:1;transform:translate(-50%)translateY(0)scale(1)}to{opacity:0;transform:translate(-50%)translateY(6px)scale(.98)}}@media (width<=520px){.keyboard-row{grid-template-columns:repeat(10,1fr)}.key{min-height:46px;padding:0;font-size:.98rem}.top-bar{flex-direction:row;justify-content:space-between;align-items:flex-start}.top-bar>div:first-child{min-width:0}.top-bar>div:last-child{gap:6px}.header-sticky{padding:10px 12px}.title{font-size:1.2rem;line-height:1.1}.category-focus{gap:6px;margin-top:6px}.category-focus-emoji{font-size:1rem}.category-focus-text{font-size:.98rem}.theme-toggle{height:34px;padding:0 10px;font-size:.84rem}.game-container{padding-bottom:240px}.sticky-panel{border-radius:16px;margin-left:0;margin-right:0;padding-left:10px;padding-right:10px}.reveal-summary-grid{grid-template-columns:1fr}.complete-title{font-size:1.2rem}.finished-bar{flex-direction:column;align-items:stretch}.finished-bar-actions{width:100%}.finished-bar-actions .submit-btn,.finished-bar-actions .secondary-btn{flex:1}.toast{padding:11px 14px;font-size:.95rem;bottom:96px}}
