:root{--green: #6aaa64;--green-dark: #538d4e;--yellow: #c9b458;--yellow-dark: #b59f3b;--orange: #f5793a;--blue: #85c0f9;--white: #ffffff;--tone-1: #1a1a1b;--tone-2: #787c7e;--tone-3: #878a8c;--tone-4: #d3d6da;--tone-5: #edeff1;--tone-6: #f6f7f8;--tone-7: #ffffff;--correct: var(--green);--present: var(--yellow);--absent: var(--tone-2);--bg: var(--tone-7);--text: var(--tone-1);--text-muted: var(--tone-2);--border: var(--tone-4);--tile-border-empty: var(--tone-4);--tile-border-filled: var(--tone-3);--tile-text-evaluated: var(--white);--key-bg: var(--tone-4);--key-text: var(--tone-1);--key-text-evaluated: var(--white);--surface: var(--tone-7);--surface-raised: var(--tone-6);--overlay: rgba(255, 255, 255, .72);--shadow: rgba(0, 0, 0, .2);--toast-bg: var(--tone-1);--toast-text: var(--tone-7);--font: "Libre Franklin", "Helvetica Neue", Helvetica, Arial, sans-serif;--header-height: 50px;--keyboard-height: 200px;--board-max: 350px;--game-max: 500px;--rail-width: 176px}[data-theme=dark]{--correct: var(--green-dark);--present: var(--yellow-dark);--absent: #3a3a3c;--bg: #121213;--text: var(--white);--text-muted: #818384;--border: #3a3a3c;--tile-border-empty: #3a3a3c;--tile-border-filled: #565758;--key-bg: #818384;--key-text: var(--white);--surface: #121213;--surface-raised: #1e1e20;--overlay: rgba(0, 0, 0, .6);--shadow: rgba(0, 0, 0, .55);--toast-bg: var(--white);--toast-text: #121213}[data-contrast=high]{--correct: var(--orange);--present: var(--blue)}*,*:before,*:after{box-sizing:border-box}html,body{height:100%;margin:0}body{background:var(--bg);color:var(--text);font-family:var(--font);-webkit-font-smoothing:antialiased;overflow:hidden}#app{height:100%;display:flex;flex-direction:column}:focus-visible{outline:2px solid var(--correct);outline-offset:2px}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:1ms!important;animation-iteration-count:1!important;transition-duration:1ms!important}}.header{position:relative;display:flex;align-items:center;justify-content:space-between;height:var(--header-height);flex:0 0 var(--header-height);padding:0 12px;border-bottom:1px solid var(--border)}.header__title{position:absolute;left:0;right:0;text-align:center;font-size:32px;font-weight:800;letter-spacing:.02em;pointer-events:none}.header__side{display:flex;align-items:center;gap:2px;z-index:1}.icon-button{display:grid;place-items:center;width:34px;height:34px;padding:0;border:0;border-radius:4px;background:none;color:var(--text);cursor:pointer}.icon-button:hover{background:var(--surface-raised)}.icon-button svg{width:24px;height:24px;fill:currentColor}.button{font-family:inherit;font-size:14px;font-weight:700;letter-spacing:.03em;text-transform:uppercase;padding:14px 22px;border:2px solid var(--text);border-radius:4px;background:var(--text);color:var(--bg);cursor:pointer}.button:hover:not(:disabled){opacity:.85}.button:disabled{opacity:.35;cursor:default}.button--ghost{background:none;color:var(--text)}.button--accent{background:var(--correct);border-color:var(--correct);color:var(--white)}.eyebrow{font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--text-muted)}.toaster{position:fixed;top:calc(var(--header-height) + 12px);left:0;right:0;display:flex;flex-direction:column;align-items:center;gap:8px;pointer-events:none;z-index:40}.toast{background:var(--toast-bg);color:var(--toast-text);padding:14px 18px;border-radius:4px;font-size:14px;font-weight:700;animation:ToastIn .12s ease-out}.toast--leaving{animation:ToastOut .24s ease-out forwards}@keyframes ToastIn{0%{opacity:0;transform:translateY(-6px)}}@keyframes ToastOut{to{opacity:0}}.tile{display:inline-flex;align-items:center;justify-content:center;aspect-ratio:1;width:100%;font-size:2rem;font-weight:700;line-height:1;text-transform:uppercase;-webkit-user-select:none;user-select:none;color:var(--text);background:transparent;border:2px solid var(--tile-border-empty)}.tile[data-state=tbd]{border-color:var(--tile-border-filled)}.tile[data-state=correct]{background:var(--correct);border-color:var(--correct);color:var(--tile-text-evaluated)}.tile[data-state=present]{background:var(--present);border-color:var(--present);color:var(--tile-text-evaluated)}.tile[data-state=absent]{background:var(--absent);border-color:var(--absent);color:var(--tile-text-evaluated)}.tile--sm{width:48px;height:48px;font-size:1.5rem;aspect-ratio:auto}.play{display:flex;justify-content:center;gap:20px;flex:1;min-height:0;padding:0 12px}.play__main{display:flex;flex-direction:column;flex:0 1 var(--game-max);min-width:0}.play__rail{flex:0 0 var(--rail-width);padding-top:14px;overflow-y:auto}.board-area{display:flex;align-items:center;justify-content:center;flex:1;min-height:0;overflow:hidden}.board{display:grid;grid-template-rows:repeat(6,1fr);gap:5px;padding:10px;width:100%;max-width:var(--board-max);aspect-ratio:350 / 420;max-height:100%}.board__row{display:grid;grid-template-columns:repeat(5,1fr);gap:5px}@keyframes PopIn{0%{transform:scale(.85);opacity:0}40%{transform:scale(1.08);opacity:1}to{transform:scale(1)}}@keyframes FlipIn{0%{transform:rotateX(0)}to{transform:rotateX(-90deg)}}@keyframes FlipOut{0%{transform:rotateX(-90deg)}to{transform:rotateX(0)}}@keyframes Shake{10%,90%{transform:translate(-1px)}20%,80%{transform:translate(2px)}30%,50%,70%{transform:translate(-4px)}40%,60%{transform:translate(4px)}}@keyframes Bounce{0%,20%{transform:translateY(0)}40%{transform:translateY(-30px)}50%{transform:translateY(5px)}60%{transform:translateY(-15px)}80%{transform:translateY(2px)}to{transform:translateY(0)}}.tile[data-animation=pop]{animation:PopIn .1s linear}.tile[data-animation=flip-in]{animation:FlipIn .25s ease-in}.tile[data-animation=flip-out]{animation:FlipOut .25s ease-in}.tile[data-animation=bounce]{animation:Bounce 1s}[data-animation=shake]{animation:Shake .6s}.keyboard{height:var(--keyboard-height);margin:0 8px;-webkit-user-select:none;user-select:none;flex:0 0 auto}.keyboard__row{display:flex;width:100%;margin:0 auto 8px;touch-action:manipulation}.keyboard__spacer{flex:.5}.key{flex:1;height:58px;margin-right:6px;padding:0;border:0;border-radius:4px;font-family:inherit;font-size:1.25rem;font-weight:700;text-transform:uppercase;background:var(--key-bg);color:var(--key-text);cursor:pointer;display:flex;align-items:center;justify-content:center;-webkit-tap-highlight-color:transparent}.keyboard__row .key:last-child{margin-right:0}.key--wide{flex:1.5;font-size:.75rem}.key[data-state=correct]{background:var(--correct);color:var(--key-text-evaluated)}.key[data-state=present]{background:var(--present);color:var(--key-text-evaluated)}.key[data-state=absent]{background:var(--absent);color:var(--key-text-evaluated)}.key svg{width:24px;height:24px;fill:currentColor}.keyboard[data-lang=ru] .key{font-size:1rem}@media(max-width:480px){.keyboard[data-lang=ru] .key{font-size:.8rem}.key{margin-right:4px;font-size:1rem}}.screen{flex:1;min-height:0;overflow-y:auto;display:flex;flex-direction:column;align-items:center;padding:28px 16px 56px}.screen__inner{width:100%;max-width:420px}.section{margin-bottom:34px}.section__head{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:12px}.field{width:100%;padding:12px 14px;font-family:inherit;font-size:15px;font-weight:600;color:var(--text);background:var(--surface);border:2px solid var(--border);border-radius:4px}.field:focus{border-color:var(--tile-border-filled);outline:none}.stack{display:flex;flex-direction:column;gap:10px}.row-actions{display:flex;gap:10px}.row-actions>*{flex:1}.segmented{display:flex;border:2px solid var(--border);border-radius:4px;overflow:hidden}.segmented__option{flex:1;padding:10px 8px;border:0;background:none;font-family:inherit;font-size:13px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--text-muted);cursor:pointer}.segmented__option[aria-pressed=true]{background:var(--text);color:var(--bg)}.mode{display:block;width:100%;text-align:left;padding:14px 16px;border:2px solid var(--border);border-radius:4px;background:none;color:var(--text);font-family:inherit;cursor:pointer}.mode[aria-pressed=true]{border-color:var(--text)}.mode__name{font-size:15px;font-weight:700}.mode__hint{margin-top:3px;font-size:13px;line-height:1.35;color:var(--text-muted)}.code{position:relative;display:inline-flex;gap:5px}.code__input{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;opacity:0;border:0;font-size:16px;cursor:pointer}.code__input:focus+.code__tiles .tile[data-active=true]{border-color:var(--tile-border-filled)}.code__tiles{display:inline-flex;gap:5px;pointer-events:none}.invite{display:flex;flex-direction:column;align-items:flex-start;gap:12px}.invite .button{align-self:stretch}.code--display .tile{width:56px;height:56px;font-size:1.75rem}.players{display:flex;flex-direction:column}.player{display:flex;align-items:center;gap:10px;padding:12px 0;border-bottom:1px solid var(--border)}.player__name{flex:1;min-width:0;font-size:15px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.player__tag{font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--text-muted)}.player--offline .player__name{opacity:.45}.rail__title{margin-bottom:10px}.opponent{display:flex;gap:10px;align-items:flex-start;padding:10px 0;border-bottom:1px solid var(--border)}.opponent__meta{min-width:0;flex:1}.opponent__name{font-size:13px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.opponent__status{margin-top:2px;font-size:11px;color:var(--text-muted)}.opponent--turn .opponent__name:after{content:" •";color:var(--correct)}.mini{display:grid;grid-template-rows:repeat(6,1fr);gap:2px;width:44px;flex:0 0 auto}.mini__row{display:grid;grid-template-columns:repeat(5,1fr);gap:2px}.mini__tile{aspect-ratio:1;border:1px solid var(--tile-border-empty)}.mini__tile[data-state=correct]{background:var(--correct);border-color:var(--correct)}.mini__tile[data-state=present]{background:var(--present);border-color:var(--present)}.mini__tile[data-state=absent]{background:var(--absent);border-color:var(--absent)}.banner{flex:0 0 auto;padding:8px 12px;text-align:center;font-size:13px;font-weight:600;color:var(--text-muted)}.banner strong{color:var(--text)}.leaderboard{width:100%;border-collapse:collapse;font-size:14px}.leaderboard th{text-align:left;font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--text-muted);padding-bottom:6px}.leaderboard td{padding:8px 0;border-top:1px solid var(--border)}.leaderboard td:last-child,.leaderboard th:last-child{text-align:right}.empty-note{font-size:14px;line-height:1.5;color:var(--text-muted)}@media(max-width:900px){.play{flex-direction:column;gap:0;padding:0}.play__main{flex:1;min-height:0}.play__rail{flex:0 0 auto;display:flex;gap:14px;overflow-x:auto;overflow-y:hidden;padding:8px 12px;border-bottom:1px solid var(--border)}.rail__title{display:none}.opponent{flex-direction:column;align-items:center;gap:4px;padding:0;border-bottom:0;width:56px}.opponent__meta{width:100%;text-align:center}.opponent__status{display:none}}.overlay{position:fixed;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;padding:16px;background:var(--overlay);z-index:50;animation:FadeIn .1s ease-out}@keyframes FadeIn{0%{opacity:0}}.modal{position:relative;width:100%;max-width:500px;max-height:90vh;overflow-y:auto;padding:16px 24px 28px;background:var(--surface);color:var(--text);border:1px solid var(--border);border-radius:8px;box-shadow:0 4px 23px 0 var(--shadow);animation:ModalIn .16s cubic-bezier(.2,.8,.3,1)}@keyframes ModalIn{0%{opacity:0;transform:translateY(24px)}}.modal__close{position:absolute;top:12px;right:12px}.modal__title{margin:8px 0 16px;font-size:16px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;text-align:center}.modal__body{font-size:15px;line-height:1.5}.modal__body p{margin:0 0 14px}.modal__body hr{border:0;border-top:1px solid var(--border);margin:18px 0}.modal__footer{margin-top:22px;display:flex;gap:10px}.modal__footer>*{flex:1}.example{margin:16px 0}.example__row{display:flex;gap:4px;margin-bottom:8px}.example .tile{width:40px;height:40px;font-size:1.25rem;aspect-ratio:auto}.stats{display:flex;justify-content:center;margin-bottom:10px}.stat{flex:1;text-align:center}.stat__value{font-size:36px;font-weight:400;letter-spacing:.02em;line-height:1.1}.stat__label{font-size:12px;line-height:1.2}.distribution{display:flex;flex-direction:column;gap:4px;margin-top:8px}.dist-row{display:flex;align-items:center;gap:4px;font-size:14px}.dist-row__label{width:12px;flex:0 0 12px}.dist-row__bar{min-width:22px;padding:2px 8px 2px 0;text-align:right;font-weight:700;color:var(--white);background:var(--absent)}.dist-row--current .dist-row__bar{background:var(--correct)}.setting{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 0;border-bottom:1px solid var(--border)}.setting__title{font-size:16px}.setting__hint{font-size:12px;color:var(--text-muted)}.switch{flex:0 0 auto;width:32px;height:20px;padding:0;border:0;border-radius:999px;background:var(--tone-4);cursor:pointer;position:relative;transition:background .12s}[data-theme=dark] .switch{background:var(--absent)}.switch[aria-checked=true]{background:var(--correct)}.switch:after{content:"";position:absolute;top:2px;left:2px;width:16px;height:16px;border-radius:50%;background:var(--white);transition:transform .12s}.switch[aria-checked=true]:after{transform:translate(12px)}