:root{--color-bg: #ffffff;--color-text: #1a1a1b;--color-border: #d3d6da;--color-border-strong: #878a8c;--color-key: #d3d6da;--color-key-text: #1a1a1b;--color-absent: #787c7e;--color-present: #c9b458;--color-correct: #6aaa64;--color-modal-border: #d3d6da;--color-overlay: rgba(0, 0, 0, .45);--color-toast: #121213;--tile-size: min(12.5vw, 62px);--keyboard-max-width: 500px;--board-gap: 6px;--header-height: 52px;--font-body: "Libre Franklin", sans-serif;--font-title: "Oswald", sans-serif}body[data-theme=dark]{--color-bg: #121213;--color-text: #f8f8f8;--color-border: #3a3a3c;--color-border-strong: #565758;--color-key: #818384;--color-key-text: #ffffff;--color-absent: #3a3a3c;--color-present: #b59f3b;--color-correct: #538d4e;--color-modal-border: #2f2f31;--color-overlay: rgba(0, 0, 0, .7);--color-toast: #f8f8f8}body[data-high-contrast=true]{--color-present: #f5793a;--color-correct: #85c0f9}*{box-sizing:border-box}html,body{margin:0;min-height:100%}body{background:var(--color-bg);color:var(--color-text);font-family:var(--font-body);transition:background-color .16s ease,color .16s ease}button,input{font:inherit}button{border:0;background:none;color:inherit}.app-shell{min-height:100vh;display:flex;flex-direction:column}.topbar{height:var(--header-height);border-bottom:1px solid var(--color-border);display:grid;grid-template-columns:44px 1fr auto;align-items:center;padding:0 8px}.brand{margin:0;font-family:var(--font-title);font-size:clamp(2rem,5vw,2.35rem);line-height:1;text-align:center;letter-spacing:.06em;font-weight:600}.topbar-actions{display:flex;justify-content:flex-end;align-items:center;gap:6px}.icon-button{width:40px;height:40px;display:inline-grid;place-items:center;color:var(--color-border-strong);cursor:pointer}.icon-button svg{width:24px;height:24px;fill:currentColor}.next-button{min-height:40px;padding:0 16px;border-radius:999px;background:var(--color-correct);color:#fff;font-size:.82rem;font-weight:800;letter-spacing:.04em;text-transform:uppercase;cursor:pointer}.next-button-header{min-height:34px;padding:0 12px}.game-shell{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:space-between;padding:12px 12px 24px;gap:16px}.board-wrap{flex:1;display:grid;place-items:center;width:100%}.board{display:grid;gap:var(--board-gap)}.board-row{display:grid;grid-template-columns:repeat(5,var(--tile-size));gap:var(--board-gap)}.tile{width:var(--tile-size);height:var(--tile-size);border:2px solid var(--color-border);display:grid;place-items:center;text-transform:uppercase;-webkit-user-select:none;user-select:none;font-size:clamp(1.55rem,5vw,2rem);font-weight:700;line-height:1;letter-spacing:.02em;background:transparent}.tile.filled{border-color:var(--color-border-strong)}.tile.pop{animation:pop .11s linear}.tile.shake{animation:shake .6s}.tile.reveal.absent{animation:flip-absent .6s ease forwards;animation-delay:var(--delay)}.tile.reveal.present{animation:flip-present .6s ease forwards;animation-delay:var(--delay)}.tile.reveal.correct{animation:flip-correct .6s ease forwards;animation-delay:var(--delay)}.tile.evaluated.absent,.key.absent{background:var(--color-absent);border-color:var(--color-absent);color:#fff}.tile.evaluated.present,.key.present{background:var(--color-present);border-color:var(--color-present);color:#fff}.tile.evaluated.correct,.key.correct{background:var(--color-correct);border-color:var(--color-correct);color:#fff}.keyboard-wrap{width:100%;display:flex;justify-content:center}.keyboard{width:min(100%,var(--keyboard-max-width));display:grid;gap:8px}.keyboard-row{display:flex;justify-content:center;gap:6px;width:100%}.key{min-width:28px;height:58px;border-radius:4px;background:var(--color-key);color:var(--color-key-text);font-size:.82rem;font-weight:700;flex:1;max-width:43px;text-transform:uppercase;cursor:pointer;padding:0}.key.action{flex:1.5;max-width:65px;font-size:.72rem}.toast{position:fixed;top:74px;left:50%;transform:translate(-50%,-8px);background:var(--color-toast);color:var(--color-bg);padding:14px 18px;border-radius:4px;font-size:.9rem;font-weight:700;opacity:0;pointer-events:none;transition:opacity .18s ease,transform .18s ease;z-index:40;white-space:nowrap}.toast.visible{opacity:1;transform:translate(-50%)}.modal-root{position:fixed;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;z-index:50}.modal-root.hidden{display:none}.modal-backdrop{position:absolute;top:0;right:0;bottom:0;left:0;background:var(--color-overlay)}.modal-card{position:relative;width:min(92vw,540px);max-height:min(86vh,760px);overflow:auto;background:var(--color-bg);border:1px solid var(--color-modal-border);padding:16px 18px 20px}.modal-header{display:flex;align-items:center;justify-content:center;position:sticky;top:0;background:var(--color-bg);z-index:1}.modal-header h2{margin:0;font-size:1rem;font-weight:800;letter-spacing:.04em;text-transform:uppercase}.modal-close{position:absolute;right:-6px;top:-6px}.modal-body{padding-top:18px;font-size:.92rem;line-height:1.45}.modal-body p,.modal-body ul{margin:0 0 14px}.modal-body hr{border:0;border-top:1px solid var(--color-border);margin:18px 0}.example-row{display:flex;gap:4px;margin-bottom:10px}.example-tile{width:40px;height:40px;border:2px solid var(--color-border);display:grid;place-items:center;font-weight:700;text-transform:uppercase}.example-tile.correct{background:var(--color-correct);border-color:var(--color-correct);color:#fff}.example-tile.present{background:var(--color-present);border-color:var(--color-present);color:#fff}.example-tile.absent{background:var(--color-absent);border-color:var(--color-absent);color:#fff}.setting-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 0;border-bottom:1px solid var(--color-border)}.setting-row:last-child{border-bottom:0}.setting-copy strong{display:block;font-size:.95rem}.setting-copy span{color:var(--color-border-strong);font-size:.82rem}.toggle{position:relative;width:48px;height:28px;border-radius:999px;background:var(--color-border);cursor:pointer;transition:background-color .16s ease}.toggle:after{content:"";position:absolute;top:3px;left:3px;width:22px;height:22px;border-radius:50%;background:var(--color-bg);transition:transform .16s ease}.toggle.on{background:var(--color-correct)}.toggle.on:after{transform:translate(20px)}.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:18px}.stat-card{text-align:center}.stat-value{display:block;font-size:2rem;line-height:1}.stat-label{display:block;margin-top:4px;font-size:.75rem}.distribution{display:grid;gap:4px}.distribution-row{display:grid;grid-template-columns:16px 1fr;align-items:center;gap:8px}.distribution-bar{min-height:20px;display:flex;justify-content:flex-end;align-items:center;padding:0 8px;font-size:.75rem;color:#fff;background:var(--color-absent)}.distribution-bar.highlight{background:var(--color-correct)}.stats-footer{display:flex;gap:20px;align-items:flex-start;justify-content:space-between;margin-top:22px}.stats-footer-copy{max-width:240px}.countdown-label{display:block;font-size:.72rem;text-transform:uppercase;letter-spacing:.06em;color:var(--color-border-strong)}.countdown{margin-top:8px;font-size:1rem;font-weight:700;letter-spacing:.01em}.stats-actions{display:flex;gap:10px;align-items:center}.share-button{display:block;background:var(--color-correct);color:#fff;padding:14px 18px;border-radius:4px;font-weight:700;cursor:pointer}.stats-actions .next-button,.stats-actions .share-button{min-width:92px}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@keyframes pop{50%{transform:scale(1.08)}}@keyframes shake{10%,90%{transform:translate(-1px)}20%,80%{transform:translate(2px)}30%,50%,70%{transform:translate(-4px)}40%,60%{transform:translate(4px)}}@keyframes flip-absent{0%{transform:scaleY(1);background:transparent;border-color:var(--color-border-strong);color:var(--color-text)}45%{transform:scaleY(0);background:transparent;border-color:var(--color-border-strong);color:var(--color-text)}55%{transform:scaleY(0);background:var(--color-absent);border-color:var(--color-absent);color:#fff}to{transform:scaleY(1);background:var(--color-absent);border-color:var(--color-absent);color:#fff}}@keyframes flip-present{0%{transform:scaleY(1);background:transparent;border-color:var(--color-border-strong);color:var(--color-text)}45%{transform:scaleY(0);background:transparent;border-color:var(--color-border-strong);color:var(--color-text)}55%{transform:scaleY(0);background:var(--color-present);border-color:var(--color-present);color:#fff}to{transform:scaleY(1);background:var(--color-present);border-color:var(--color-present);color:#fff}}@keyframes flip-correct{0%{transform:scaleY(1);background:transparent;border-color:var(--color-border-strong);color:var(--color-text)}45%{transform:scaleY(0);background:transparent;border-color:var(--color-border-strong);color:var(--color-text)}55%{transform:scaleY(0);background:var(--color-correct);border-color:var(--color-correct);color:#fff}to{transform:scaleY(1);background:var(--color-correct);border-color:var(--color-correct);color:#fff}}@media (max-width: 640px){:root{--tile-size: min(13vw, 58px)}.topbar{height:auto;grid-template-columns:44px 1fr;grid-template-areas:"help actions" "brand brand";row-gap:4px;padding:8px}.topbar>#openHelp{grid-area:help}.brand{grid-area:brand}.topbar-actions{grid-area:actions}.game-shell{padding:10px 10px 18px}.key{height:56px;font-size:.76rem}.stats-footer,.stats-actions{flex-direction:column;align-items:stretch}.next-button-header,.share-button{width:100%;text-align:center}}
