:root{--diff-yellow:#f3cf4c;--diff-green:#9fc35b;--diff-blue:#7eaae0;--diff-purple:#b885cf;--diff-text:#1a1a1a;--accent:#203bc8;--accent-hover:#1a31a8;--accent-text:#fff;--radius-tile:8px;--radius-block:8px;--gap:clamp(7px, 2vw, 9px)}:root,:root[data-theme=light]{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--bg:#fff;--surface:#fff;--text:#121212;--text-muted:#5c626b;--border:#d8dade;--border-strong:#1f2024;--hover-surface:#f1f2f4;--tile-bg:#eceef1;--tile-bg-hover:#e2e5ea;--tile-text:#121212;--tile-selected-bg:#2b2c30;--tile-selected-text:#fff;--dot-filled:#54596180;--dot-on:#2b2c30;--focus:#203bc8;--overlay:#1212126b;--shadow:0 12px 40px #1212142e}:root[data-theme=dark]{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg:#0f1012;--surface:#17181b;--text:#ededee;--text-muted:#9aa0a8;--border:#2e3034;--border-strong:#6a6e75;--hover-surface:#1f2125;--tile-bg:#26282c;--tile-bg-hover:#30333a;--tile-text:#ededee;--tile-selected-bg:#e9e9ea;--tile-selected-text:#121212;--dot-filled:#6a6e75;--dot-on:#e9e9ea;--focus:#6f97ff;--overlay:#0009;--shadow:0 12px 40px #00000080}*,:before,:after{box-sizing:border-box}html,body{margin:0;padding:0}body{background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;text-rendering:optimizelegibility;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;line-height:1.5}button{font-family:inherit}.visually-hidden{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;position:absolute!important}.app{justify-content:center;min-height:100dvh;padding:clamp(12px,3vw,28px) 14px 40px;display:flex}.board{flex-direction:column;width:100%;max-width:540px;display:flex}.header{border-bottom:1px solid var(--border);margin-bottom:clamp(10px,2.4vw,18px);padding-bottom:12px}.header__bar{grid-template-columns:40px 1fr 40px;align-items:center;display:grid}.header__title{text-align:center;letter-spacing:-.02em;margin:0;font-size:clamp(1.4rem,5.4vw,1.95rem);font-weight:800}.header__meta{text-align:center;color:var(--text-muted);font-variant-numeric:tabular-nums;margin:2px 0 0;font-size:.82rem}.icon-button{width:40px;height:40px;color:var(--text);cursor:pointer;background:0 0;border:none;border-radius:50%;justify-content:center;align-items:center;transition:background .15s;display:inline-flex}.icon-button:hover{background:var(--hover-surface)}.icon-button:focus-visible,.btn:focus-visible,.tile:focus-visible,.switch:focus-visible{outline:3px solid var(--focus);outline-offset:2px}.instruction{text-align:center;color:var(--text-muted);margin:0 0 12px;font-size:.92rem}.toast-slot{height:0;position:relative}.toast{z-index:6;background:var(--text);color:var(--bg);white-space:nowrap;box-shadow:var(--shadow);pointer-events:none;border-radius:999px;padding:8px 16px;font-size:.85rem;font-weight:600;animation:1.9s forwards toast-life;position:absolute;top:-2px;left:50%;transform:translate(-50%)}.toast[data-kind=oneaway]{color:#fff;background:#c98a14}.solved-groups{gap:var(--gap);margin-bottom:var(--gap);flex-direction:column;display:flex}.solved-block{border-radius:var(--radius-block);text-align:center;color:var(--diff-text);padding:10px 12px;animation:.34s cubic-bezier(.22,1.2,.42,1) pop-in}.solved-block[data-difficulty=yellow]{background:var(--diff-yellow)}.solved-block[data-difficulty=green]{background:var(--diff-green)}.solved-block[data-difficulty=blue]{background:var(--diff-blue)}.solved-block[data-difficulty=purple]{background:var(--diff-purple)}.solved-block__label{text-transform:uppercase;letter-spacing:.02em;margin:0;font-size:clamp(.92rem,3.4vw,1.05rem);font-weight:800}.solved-block__words{text-transform:uppercase;letter-spacing:.04em;opacity:.85;margin:2px 0 0;font-size:clamp(.78rem,3vw,.92rem);font-weight:500}.word-grid{gap:var(--gap);grid-template-columns:repeat(4,minmax(0,1fr));display:grid}.tile{border-radius:var(--radius-tile);background:var(--tile-bg);height:clamp(60px,16.5vw,82px);color:var(--tile-text);text-transform:uppercase;letter-spacing:.01em;cursor:pointer;-webkit-user-select:none;user-select:none;border:none;justify-content:center;align-items:center;padding:4px;font-size:clamp(.78rem,3.3vw,1.05rem);font-weight:700;transition:background .12s,transform 80ms,color .12s;display:flex;overflow:hidden}.tile[data-long=true]{font-size:clamp(.66rem,2.8vw,.92rem)}.tile__label{white-space:nowrap}@media (hover:hover){.tile:hover:not([data-selected=true]):not(:disabled){background:var(--tile-bg-hover)}}.tile[data-selected=true]{background:var(--tile-selected-bg);color:var(--tile-selected-text)}.tile:active:not(:disabled){transform:scale(.94)}.tile[data-shaking=true]{animation:.42s shake}.tile:disabled{cursor:default}.mistakes{justify-content:center;align-items:center;gap:12px;margin:clamp(16px,4vw,24px) 0 clamp(14px,3.5vw,20px);display:flex}.mistakes__label{color:var(--text-muted);font-size:.86rem}.mistakes__dots{gap:8px;display:flex}.mistakes__dot{background:var(--dot-filled);border-radius:50%;width:14px;height:14px;transition:background .2s,transform .2s}.mistakes__dot[data-filled=false]{border:1.5px solid var(--border);background:0 0}.mistakes__dot[data-filled=true]{background:var(--dot-on)}.action-bar{flex-wrap:wrap;justify-content:center;gap:10px;display:flex}.btn{appearance:none;cursor:pointer;color:var(--text);background:0 0;border:1.5px solid #0000;border-radius:999px;padding:.72em 1.25em;font-size:.95rem;font-weight:600;transition:background .14s,border-color .14s,opacity .14s,transform 80ms}.btn:active:not(:disabled){transform:scale(.97)}.btn:disabled{opacity:.38;cursor:default}.btn--outline{border-color:var(--border-strong);color:var(--text)}.btn--outline:hover:not(:disabled){background:var(--hover-surface)}.btn--primary{background:var(--accent);border-color:var(--accent);color:var(--accent-text)}.btn--primary:hover:not(:disabled){background:var(--accent-hover);border-color:var(--accent-hover)}.btn--danger{color:#c2453f;border-color:#c2453f}.btn--danger:hover:not(:disabled){background:#c2453f1a}.btn--share{align-items:center;gap:8px;display:inline-flex}.end-panel{flex-direction:column;align-items:center;gap:16px;margin-top:clamp(16px,4vw,24px);display:flex}.summary{text-align:center;flex-direction:column;align-items:center;gap:14px;width:100%;display:flex}.summary__headline{margin:0;font-size:clamp(1.1rem,4.4vw,1.4rem);font-weight:800}.summary__path{letter-spacing:2px;flex-direction:column;gap:3px;font-size:1.15rem;line-height:1.05;display:flex}.summary__stats{grid-template-columns:repeat(auto-fit,minmax(92px,1fr));gap:8px;width:100%;margin:0;display:grid}.summary__stat{background:var(--hover-surface);border-radius:12px;flex-direction:column;gap:3px;padding:10px 8px;display:flex}.summary__stat dt{text-transform:uppercase;letter-spacing:.06em;color:var(--text-muted);font-size:.68rem}.summary__stat dd{margin:0;font-size:.92rem;font-weight:700}.end-panel__next{color:var(--text-muted);margin:0;font-size:.86rem}.modal-overlay{background:var(--overlay);z-index:50;justify-content:center;align-items:center;padding:18px;animation:.16s fade-in;display:flex;position:fixed;inset:0}.modal{background:var(--surface);border:1px solid var(--border);width:100%;max-width:430px;max-height:86dvh;box-shadow:var(--shadow);border-radius:18px;padding:20px 22px 24px;animation:.2s pop-in;overflow-y:auto}.modal__header{justify-content:space-between;align-items:center;margin-bottom:8px;display:flex}.modal__title{margin:0;font-size:1.25rem;font-weight:800}.modal__body .prose{margin:0 0 12px;font-size:.96rem}.prose-list{flex-direction:column;gap:7px;margin:0 0 14px;padding-left:20px;font-size:.94rem;display:flex}.legend{grid-template-columns:1fr 1fr;gap:8px 14px;margin:0;padding:0;list-style:none;display:grid}.legend__item{align-items:center;gap:9px;font-size:.9rem;display:flex}.legend__swatch,.summary__swatch{border-radius:5px;flex:none;width:18px;height:18px}.legend__swatch[data-difficulty=yellow]{background:var(--diff-yellow)}.legend__swatch[data-difficulty=green]{background:var(--diff-green)}.legend__swatch[data-difficulty=blue]{background:var(--diff-blue)}.legend__swatch[data-difficulty=purple]{background:var(--diff-purple)}.setting-row{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;gap:14px;padding:14px 0;display:flex}.setting-row--block:last-child{border-bottom:none}.setting-row__text{flex-direction:column;gap:2px;display:flex}.setting-row__label{font-size:.96rem;font-weight:600}.setting-row__desc{color:var(--text-muted);font-size:.82rem}.switch{background:var(--border-strong);cursor:pointer;border:none;border-radius:999px;flex:none;width:46px;height:27px;padding:0;transition:background .18s;position:relative}.switch[data-on=true]{background:var(--accent)}.switch__thumb{background:#fff;border-radius:50%;width:21px;height:21px;transition:transform .18s;position:absolute;top:3px;left:3px}.switch[data-on=true] .switch__thumb{transform:translate(19px)}.puzzle-error{max-width:640px;margin:40px auto;padding:0 20px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}.puzzle-error h1{font-size:1.3rem}.puzzle-error ul{background:var(--hover-surface);border-radius:10px;padding:14px 14px 14px 32px;line-height:1.7}@keyframes shake{0%,to{transform:translate(0)}20%{transform:translate(-6px)}40%{transform:translate(6px)}60%{transform:translate(-4px)}80%{transform:translate(4px)}}@keyframes pop-in{0%{opacity:0;transform:scale(.96)translateY(6px)}to{opacity:1;transform:scale(1)translateY(0)}}@keyframes toast-life{0%{opacity:0;transform:translate(-50%)translateY(-6px)}10%{opacity:1;transform:translate(-50%)translateY(0)}82%{opacity:1;transform:translate(-50%)translateY(0)}to{opacity:0;transform:translate(-50%)translateY(-4px)}}@keyframes fade-in{0%{opacity:0}to{opacity:1}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.001ms!important;animation-duration:.001ms!important;animation-iteration-count:1!important}}:root[data-reduced-motion=true] *,:root[data-reduced-motion=true] :before,:root[data-reduced-motion=true] :after{transition-duration:.001ms!important;animation-duration:.001ms!important;animation-iteration-count:1!important}@media (prefers-reduced-motion:reduce){.toast{animation-duration:1.9s!important}}:root[data-reduced-motion=true] .toast{animation-duration:1.9s!important}
