:root{--green: #6aaa64;--yellow: #c9b458;--grey: #787c7e;--blue: #4a8fd9;--red: #d9534f;--tile-border: #d3d6da;--tile-border-filled: #878a8c;--bg: #ffffff;--bg-elev: #f6f7f8;--text: #1a1a1b;--text-muted: #5f6368;--key: #d3d6da;--key-text: #1a1a1b;--border: #d3d6da;--input-bg: #ffffff;--radius: 8px;--gap: 5px;color-scheme:light}@media(prefers-color-scheme:dark){:root:not([data-theme=light]){--tile-border: #3a3a3c;--tile-border-filled: #565758;--bg: #121213;--bg-elev: #1b1b1d;--text: #f0f0f0;--text-muted: #9a9a9c;--key: #818384;--key-text: #ffffff;--border: #3a3a3c;--input-bg: #1b1b1d;color-scheme:dark}}:root[data-theme=dark]{--tile-border: #3a3a3c;--tile-border-filled: #565758;--bg: #121213;--bg-elev: #1b1b1d;--text: #f0f0f0;--text-muted: #9a9a9c;--key: #818384;--key-text: #ffffff;--border: #3a3a3c;--input-bg: #1b1b1d;color-scheme:dark}*{box-sizing:border-box}html,body{margin:0;padding:0;background:var(--bg);color:var(--text);font-family:Segoe UI,system-ui,-apple-system,Roboto,Helvetica Neue,Arial,sans-serif;-webkit-font-smoothing:antialiased}button,input,select{font:inherit}a{color:var(--blue)}h1,h2,h3{margin:0}.muted{color:var(--text-muted);font-size:.9rem}.topbar{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:8px 16px;border-bottom:1px solid var(--border);gap:8px}.topbar__left{display:flex;justify-content:flex-start}.topbar__right{display:flex;justify-content:flex-end;align-items:center;gap:8px}.logo{font-size:1.9rem;font-weight:800;letter-spacing:.06em;display:flex;align-items:center;gap:8px;text-transform:uppercase}.logo__mark{width:30px;height:30px;border-radius:8px;background:var(--green);position:relative}.logo__mark:after{content:"";position:absolute;inset:6px;border:3px solid #fff;border-radius:50% 50% 50% 0;transform:rotate(-30deg)}.icon-btn{width:36px;height:36px;border-radius:50%;border:1px solid var(--border);background:transparent;color:var(--text);cursor:pointer;font-weight:700;font-size:1rem}.icon-btn:hover{background:var(--bg-elev)}.switch{display:inline-flex;align-items:center;gap:8px;cursor:pointer;-webkit-user-select:none;user-select:none;font-size:.9rem}.switch input{position:absolute;opacity:0;width:0;height:0}.switch__track{width:42px;height:24px;border-radius:12px;background:var(--grey);position:relative;transition:background .2s}.switch__thumb{position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:#fff;transition:transform .2s}.switch input:checked+.switch__track{background:var(--green)}.switch input:checked+.switch__track .switch__thumb{transform:translate(18px)}.switch input:focus-visible+.switch__track{outline:2px solid var(--blue);outline-offset:2px}.app{min-height:100vh;display:flex;flex-direction:column}.layout{flex:1;display:grid;grid-template-columns:minmax(320px,1fr) minmax(360px,1.15fr);gap:24px;padding:16px;max-width:1280px;width:100%;margin:0 auto}@media(max-width:900px){.layout{grid-template-columns:1fr;padding:12px}}.layout__game{display:flex;flex-direction:column;gap:20px;min-width:0}.puzzle-title{display:flex;align-items:center;gap:8px;font-weight:600;margin-bottom:8px;color:var(--text-muted)}.badge{font-size:.7rem;padding:2px 6px;border-radius:999px;background:var(--yellow);color:#1a1a1b;font-weight:700;text-transform:uppercase}.viewer{position:sticky;top:12px}@media(max-width:900px){.viewer{position:static}}.viewer__canvas{position:relative;width:100%;height:min(60vh,520px);min-height:280px;border-radius:12px;overflow:hidden;border:1px solid var(--border);background:var(--bg)}.viewer__canvas canvas{border-radius:12px}.viewer__overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;pointer-events:none;color:var(--text-muted);font-size:.95rem;z-index:2}.viewer__error{color:var(--red);pointer-events:auto;padding:12px;text-align:center}.viewer__controls{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-top:10px;font-size:.85rem;color:var(--text-muted)}.viewer__controls label{display:inline-flex;align-items:center;gap:6px}.viewer__controls select{background:var(--input-bg);color:var(--text);border:1px solid var(--border);border-radius:6px;padding:4px 6px}.viewer__caption{margin:8px 0 0;font-size:.85rem;color:var(--text-muted)}.viewer__hint{margin:2px 0 0;font-size:.75rem;color:var(--text-muted)}.board{border:1px solid var(--border);border-radius:12px;padding:14px;background:var(--bg-elev);display:flex;flex-direction:column;gap:12px}.board--locked{opacity:.7}.board__header{display:flex;justify-content:space-between;align-items:center;gap:8px;flex-wrap:wrap}.board__header h2,.board--locked h2{font-size:1.05rem;font-weight:700}.board__meta{font-weight:400;color:var(--text-muted);font-size:.85rem;margin-left:6px}.board__actions{display:flex;gap:6px}.board__solved{margin:0;color:var(--green);font-weight:700}.rows{display:flex;flex-direction:column;gap:var(--gap)}.tile-row{--tile: 44px;display:flex;gap:var(--gap);width:100%;align-items:stretch}.tile{flex:0 0 var(--tile);width:var(--tile);height:var(--tile);display:inline-flex;align-items:center;justify-content:center;font-weight:700;font-size:calc(var(--tile) * .55);text-transform:uppercase;border:2px solid var(--tile-border);border-radius:4px;color:var(--text);-webkit-user-select:none;user-select:none;line-height:1}.tile--sep{flex-basis:calc(var(--tile) * .45);width:calc(var(--tile) * .45);border-color:transparent;color:var(--text-muted);font-size:calc(var(--tile) * .5)}.tile--pill{flex-basis:calc(var(--tile) * var(--span) + var(--gap) * (var(--span) - 1));width:calc(var(--tile) * var(--span) + var(--gap) * (var(--span) - 1));font-size:calc(var(--tile) * .42);text-transform:lowercase;letter-spacing:.01em;overflow:hidden;padding:0 3px}.tile--pill .tile__text{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.status-input{border-color:var(--tile-border-filled)}.status-correct{background:var(--green);border-color:var(--green);color:#fff}.status-present{background:var(--yellow);border-color:var(--yellow);color:#fff}.status-absent{background:var(--grey);border-color:var(--grey);color:#fff}.status-revealed{background:var(--blue);border-color:var(--blue);color:#fff}.tile-row--reveal .tile:not(.tile--sep){background:var(--blue);border-color:var(--blue);color:#fff}.tile-row--known .tile:not(.tile--sep){border-style:dashed}.tile-row--known .tile.status-correct,.tile-row--known .tile.status-revealed{border-style:solid}.tile-row--animate .tile:not(.tile--sep){animation:flip .5s ease both;animation-delay:calc(var(--i, 0) * 45ms)}@keyframes flip{0%{transform:rotateX(90deg);opacity:.3}to{transform:rotateX(0);opacity:1}}.guess-form{display:flex;gap:8px;align-items:center}.guess-input{flex:1;min-width:0;padding:10px 12px;border-radius:8px;border:1px solid var(--border);background:var(--input-bg);color:var(--text);font-size:1rem}.guess-input:focus{outline:2px solid var(--blue);outline-offset:1px}.guess-count--over{color:var(--red);font-weight:700}.guess-count{color:var(--text-muted);font-variant-numeric:tabular-nums;font-size:.85rem;min-width:3ch;text-align:right}.btn{padding:9px 14px;border-radius:8px;border:1px solid var(--border);background:var(--bg);color:var(--text);cursor:pointer;font-weight:600;white-space:nowrap}.btn:hover:not(:disabled){filter:brightness(1.08)}.btn:disabled{opacity:.5;cursor:not-allowed}.btn--primary{background:var(--green);border-color:var(--green);color:#fff}.btn--ghost{background:transparent;font-weight:500;padding:6px 10px;font-size:.85rem}.btn--danger{border-color:var(--red);color:var(--red);background:transparent}.keyboard{display:flex;flex-direction:column;gap:6px;-webkit-user-select:none;user-select:none}.keyboard__row{display:flex;justify-content:center;gap:5px}.key{flex:1 1 0;max-width:40px;height:46px;border:none;border-radius:4px;background:var(--key);color:var(--key-text);font-weight:700;font-size:.85rem;cursor:pointer;padding:0;text-transform:uppercase}.key--wide{max-width:64px;flex-basis:64px;font-size:.7rem}.key.status-correct{background:var(--green);color:#fff}.key.status-present{background:var(--yellow);color:#fff}.key.status-absent{background:var(--grey);color:#fff;opacity:.55}.key:disabled{cursor:default}.fn-bank{display:flex;flex-wrap:wrap;gap:6px;max-height:260px;overflow:auto;padding:4px;border:1px dashed var(--border);border-radius:8px}.fn-chip{display:inline-flex;gap:3px;padding:4px 8px;border-radius:999px;border:1px solid var(--border);background:var(--bg);color:var(--text);cursor:pointer;font-size:.8rem}.fn-chip--out{opacity:.4}.fn-chip__token{padding:1px 5px;border-radius:999px}.game-footer{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.game-footer__attempts{margin-left:auto}.footer{text-align:center;padding:12px;font-size:.75rem;color:var(--text-muted);border-top:1px solid var(--border)}.error-box{border:1px solid var(--red);border-radius:8px;padding:12px}.modal-backdrop{position:fixed;inset:0;background:#0000008c;display:flex;align-items:center;justify-content:center;padding:16px;z-index:50}.modal{background:var(--bg);color:var(--text);border-radius:12px;width:min(100%,460px);max-height:90vh;overflow:auto;border:1px solid var(--border);box-shadow:0 20px 50px #00000059}.modal--wide{width:min(100%,600px)}.modal__header{display:flex;justify-content:space-between;align-items:center;padding:14px 18px;border-bottom:1px solid var(--border)}.modal__header h2{font-size:1.15rem}.modal__close{border:none;background:transparent;color:var(--text);font-size:1.5rem;cursor:pointer;line-height:1}.modal__body{padding:16px 18px;display:flex;flex-direction:column;gap:12px}.modal__body p{margin:0}.help-list{margin:0;padding-left:20px;display:flex;flex-direction:column;gap:6px}.help-list--plain{list-style:disc}.help-example{display:flex;flex-direction:column;gap:8px;background:var(--bg-elev);padding:10px;border-radius:8px}.help-caption{font-size:.8rem;color:var(--text-muted);display:flex;flex-wrap:wrap;gap:4px;align-items:center}.help-footnote{font-size:.85rem;color:var(--text-muted)}.swatch{display:inline-block;width:14px;height:14px;border-radius:3px;vertical-align:middle}.result__headline{font-size:1.15rem}.result__actions{display:flex;gap:12px;align-items:center;flex-wrap:wrap}.countdown{display:flex;flex-direction:column;line-height:1.1}.countdown__label{font-size:.75rem;color:var(--text-muted);text-transform:uppercase}.countdown__value{font-size:1.3rem;font-weight:700;font-variant-numeric:tabular-nums}.answer-card{border:1px solid var(--border);border-radius:10px;padding:12px;display:flex;flex-direction:column;gap:6px;background:var(--bg-elev)}.answer-card__row{display:grid;grid-template-columns:90px 1fr;gap:8px;align-items:baseline}.answer-card__label{font-size:.75rem;text-transform:uppercase;color:var(--text-muted);letter-spacing:.05em}.answer-card__value{font-weight:600}.answer-card__desc{margin:6px 0 0;font-size:.92rem;line-height:1.45}.stat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;text-align:center}.stat__value{font-size:1.8rem;font-weight:700}.stat__label{font-size:.75rem;color:var(--text-muted)}.dist{display:flex;flex-direction:column;gap:4px}.dist__row{display:flex;align-items:center;gap:6px;font-size:.8rem}.dist__label{width:24px;text-align:right;color:var(--text-muted)}.dist__bar{background:var(--grey);color:#fff;padding:2px 6px;border-radius:3px;text-align:right;font-weight:700;min-width:20px}.dist__bar--highlight{background:var(--green)}.toast{position:fixed;top:70px;left:50%;transform:translate(-50%) translateY(-8px);background:var(--text);color:var(--bg);padding:10px 16px;border-radius:8px;font-weight:600;opacity:0;pointer-events:none;transition:opacity .2s,transform .2s;z-index:60;max-width:90vw;text-align:center}.toast--visible{opacity:1;transform:translate(-50%) translateY(0)}@media(max-width:480px){.logo{font-size:1.4rem}.switch__label{display:none}.board{padding:10px}.key{height:42px}}.crash{max-width:520px;margin:15vh auto;padding:24px;border:1px solid var(--border);border-radius:12px;background:var(--bg-elev);display:flex;flex-direction:column;gap:12px}.crash__actions{display:flex;gap:10px;flex-wrap:wrap}
