:root{--tg-theme-bg-color:#fff;--tg-theme-text-color:#000;--tg-theme-hint-color:#999;--tg-theme-link-color:#2678b6;--tg-theme-button-color:#50a8eb;--tg-theme-button-text-color:#fff;--tg-theme-secondary-bg-color:#f0f0f0;--bg:#efeff4;--surface:#fff;--surface-secondary:#e4e4e9;--text:var(--tg-theme-text-color);--text-secondary:var(--tg-theme-hint-color);--accent:var(--tg-theme-button-color);--accent-text:var(--tg-theme-button-text-color);--border:#00000014;--border-filled:#00000040;--key-bg:#d3d6da;--key-text:var(--tg-theme-text-color);--correct:#6ab04c;--present:#f0b429;--absent:#a0a4a8;--tile-text-revealed:#fff;-webkit-font-smoothing:antialiased;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,sans-serif}[data-theme=dark]{--border:#ffffff1a;--border-filled:#ffffff4d;--key-bg:#818384;--correct:#538d4e;--present:#b59f3b;--absent:#565758;--tile-text-revealed:#fff}*{box-sizing:border-box;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;margin:0;padding:0}body{background:var(--bg);color:var(--text);touch-action:manipulation;overflow:hidden}.app{flex-direction:column;max-width:500px;height:100dvh;margin:0 auto;display:flex}.header{flex-shrink:0;justify-content:center;align-items:center;height:48px;padding:0 12px;display:flex;position:relative}.header__title{letter-spacing:.15em;text-transform:uppercase;font-size:1.1rem;font-weight:700}.header__right{gap:0;display:flex;position:absolute;right:12px}.header__btn{color:var(--text-secondary);cursor:pointer;-webkit-tap-highlight-color:transparent;background:0 0;border:none;border-radius:10px;padding:8px 10px;font-size:1.15rem;transition:background .15s}.header__btn:active{background:var(--surface-secondary)}.mode-tabs{flex-shrink:0;gap:4px;padding:6px 12px;display:flex}.mode-tab{color:var(--text-secondary);cursor:pointer;-webkit-tap-highlight-color:transparent;background:0 0;border:none;border-radius:8px;flex:1;padding:8px 0;font-size:.78rem;font-weight:600;transition:background .15s,color .15s}.mode-tab--active{background:var(--surface-secondary);color:var(--text)}.mode-tab:active{opacity:.8}.main{flex-direction:column;flex:1;display:flex;overflow:hidden}.game-page{flex-direction:column;flex:1;align-items:center;gap:8px;width:100%;padding:8px 0;display:flex;overflow:hidden}.grid{flex-direction:column;flex-shrink:0;gap:5px;margin:auto 0;display:flex}.row{gap:5px;display:flex}.row--shake{animation:.4s cubic-bezier(.36,.07,.19,.97) shake}@keyframes shake{0%,to{transform:translate(0)}20%{transform:translate(-5px)}40%{transform:translate(5px)}60%{transform:translate(-3px)}80%{transform:translate(3px)}}.tile{border:2px solid var(--border);text-transform:uppercase;-webkit-user-select:none;user-select:none;background:var(--surface);width:min(56px,14vw);height:min(56px,14vw);color:var(--text);border-radius:10px;justify-content:center;align-items:center;font-size:min(1.5rem,5.5vw);font-weight:700;transition:border-color .12s,transform 80ms;display:flex}.tile--filled{border-color:var(--border-filled);animation:80ms pop}@keyframes pop{50%{transform:scale(1.06)}}.tile--revealed{animation:.45s forwards flip}@keyframes flip{0%{transform:rotateX(0)}45%{transform:rotateX(90deg)}55%{transform:rotateX(90deg)}to{transform:rotateX(0)}}.tile--correct{background:var(--correct);border-color:var(--correct);color:var(--tile-text-revealed)}.tile--present{background:var(--present);border-color:var(--present);color:var(--tile-text-revealed)}.tile--absent{background:var(--absent);border-color:var(--absent);color:var(--tile-text-revealed)}.keyboard{width:100%;max-width:500px;padding:0 6px;padding-bottom:env(safe-area-inset-bottom,4px);flex-direction:column;gap:6px;margin-top:auto;display:flex}.keyboard__row{justify-content:center;gap:4px;display:flex}.key{background:var(--key-bg);min-width:0;height:52px;color:var(--key-text);text-transform:uppercase;cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation;border:none;border-radius:8px;flex:1;justify-content:center;align-items:center;font-size:1.05rem;font-weight:600;transition:transform 80ms;display:flex}.key:active{transform:scale(.92)}.key--wide{flex:1.4;font-size:1.2rem}.key--correct{background:var(--correct);color:var(--tile-text-revealed)}.key--present{background:var(--present);color:var(--tile-text-revealed)}.key--absent{background:var(--absent);color:var(--tile-text-revealed)}.toast{color:#fff;z-index:200;pointer-events:none;background:#1e1e1ef2;border-radius:8px;padding:10px 18px;font-size:.85rem;font-weight:600;animation:.2s toastIn,.4s 50ms toastShake,.4s 1.4s forwards toastOut;position:fixed;top:60px;left:50%;transform:translate(-50%);box-shadow:0 4px 14px #0003}@keyframes toastIn{0%{opacity:0;transform:translate(-50%,-8px)}to{opacity:1;transform:translate(-50%)}}@keyframes toastShake{0%,to{transform:translate(-50%)}20%{transform:translate(calc(-50% - 6px))}40%{transform:translate(calc(6px - 50%))}60%{transform:translate(calc(-50% - 3px))}80%{transform:translate(calc(3px - 50%))}}@keyframes toastOut{0%{opacity:1}to{opacity:0}}.modal-overlay{z-index:100;background:#0006;justify-content:center;align-items:center;padding:20px;animation:.15s fadeIn;display:flex;position:fixed;inset:0}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.modal{background:var(--surface);border-radius:14px;width:100%;max-width:340px;max-height:80vh;padding:24px 20px;animation:.2s modalIn;overflow-y:auto}@keyframes modalIn{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}.modal h2{text-align:center;margin-bottom:16px;font-size:1.05rem;font-weight:700}.modal h3{color:var(--text-secondary);text-transform:uppercase;letter-spacing:.05em;margin:16px 0 8px;font-size:.8rem;font-weight:600}.modal p{color:var(--text-secondary);margin-bottom:12px;font-size:.88rem;line-height:1.5}.modal__button{background:var(--accent);width:100%;color:var(--accent-text);cursor:pointer;-webkit-tap-highlight-color:transparent;border:none;border-radius:10px;margin-top:16px;padding:13px;font-size:.93rem;font-weight:600}.modal__button:active{opacity:.85}.modal__button:disabled{opacity:.4;cursor:not-allowed}.rules-example{margin-bottom:16px}.rules-tiles{gap:5px;margin-bottom:6px;display:flex}.tile-example{border:2px solid var(--border);text-transform:uppercase;background:var(--surface);border-radius:7px;justify-content:center;align-items:center;width:36px;height:36px;font-size:.9rem;font-weight:700;display:flex}.tile-example.tile--correct{background:var(--correct);border-color:var(--correct);color:#fff}.tile-example.tile--present{background:var(--present);border-color:var(--present);color:#fff}.tile-example.tile--absent{background:var(--absent);border-color:var(--absent);color:#fff}.stats-summary{background:var(--surface-secondary);border-radius:12px;justify-content:space-around;margin-bottom:20px;padding:14px 0;display:flex}.stat-item{text-align:center}.stat-value{font-size:1.5rem;font-weight:700}.stat-label{color:var(--text-secondary);text-transform:uppercase;letter-spacing:.02em;margin-top:2px;font-size:.68rem}.guess-distribution{flex-direction:column;gap:4px;display:flex}.distribution-row{align-items:center;gap:8px;display:flex}.distribution-label{text-align:center;width:14px;color:var(--text-secondary);font-size:.82rem;font-weight:600}.distribution-bar-container{flex:1}.distribution-bar{background:var(--absent);color:#fff;text-align:right;border-radius:4px;min-width:22px;padding:3px 8px;font-size:.72rem;font-weight:600}.result-screen{text-align:center;flex-direction:column;align-items:center;gap:12px;padding:16px;animation:.25s fadeIn;display:flex}.result-header h2{font-size:1.3rem;font-weight:700}.result-answer{color:var(--text-secondary);margin-top:4px;font-size:.9rem}.result-answer strong{color:var(--text);letter-spacing:.12em}.result-attempts{color:var(--text-secondary);font-size:.88rem}.share-button{background:var(--accent);color:var(--accent-text);cursor:pointer;-webkit-tap-highlight-color:transparent;border:none;border-radius:10px;padding:13px 28px;font-size:.93rem;font-weight:600}.share-button:active{opacity:.85}.play-again-button{border:1.5px solid var(--border);color:var(--text);cursor:pointer;-webkit-tap-highlight-color:transparent;background:0 0;border-radius:10px;padding:12px 24px;font-size:.88rem;font-weight:600}.play-again-button:active{background:var(--surface-secondary)}.mode-menu{background:var(--surface);z-index:101;border-radius:14px 14px 0 0;max-width:500px;margin:0 auto;padding:24px 16px;animation:.2s slideFromBottom;position:fixed;bottom:0;left:0;right:0}@keyframes slideFromBottom{0%{transform:translateY(100%)}to{transform:translateY(0)}}.mode-menu h2{text-align:center;margin-bottom:14px;font-size:1rem;font-weight:700}.mode-option{background:var(--surface-secondary);width:100%;color:var(--text);cursor:pointer;text-align:left;-webkit-tap-highlight-color:transparent;border:none;border-radius:12px;align-items:center;gap:12px;margin-bottom:8px;padding:14px;display:flex}.mode-option--active{background:color-mix(in srgb, var(--accent) 12%, var(--surface-secondary))}.mode-option:active{opacity:.8}.mode-icon{justify-content:center;align-items:center;width:34px;height:34px;font-size:1.3rem;display:flex}.mode-title{font-size:.88rem;font-weight:600}.mode-desc{color:var(--text-secondary);margin-top:1px;font-size:.75rem}.challenge-create{justify-content:center;padding:24px}.challenge-create h2{margin-bottom:8px;font-weight:700}.challenge-input{border:2px solid var(--border);background:var(--surface);width:100%;max-width:200px;color:var(--text);text-align:center;text-transform:uppercase;letter-spacing:.3em;border-radius:10px;outline:none;padding:14px;font-size:1.4rem;font-weight:700}.challenge-input:focus{border-color:var(--accent)}.challenge-badge{color:var(--text-secondary);background:var(--surface-secondary);border-radius:20px;padding:4px 12px;font-size:.75rem;font-weight:600}.challenge-link{text-align:center;margin-top:16px}@media (height<=700px){.tile{border-radius:8px;width:min(48px,12.5vw);height:min(48px,12.5vw);font-size:min(1.3rem,5vw)}.key{height:48px;font-size:1rem}.game-page{padding:8px 0 4px}.grid,.row{gap:4px}}@media (height<=600px){.header{height:40px}.mode-tabs{padding:4px 12px}.mode-tab{padding:6px 0;font-size:.72rem}.tile{border-radius:6px;width:min(40px,11vw);height:min(40px,11vw);font-size:min(1.1rem,4.5vw)}.key{border-radius:6px;height:44px;font-size:.95rem}.keyboard{gap:5px}.keyboard__row,.grid,.row{gap:3px}}@media (height<=500px){.tile{border-radius:5px;width:min(34px,9vw);height:min(34px,9vw);font-size:.95rem}.key{height:38px;font-size:.88rem}}
