.letter-tile{position:relative;height:var(--tile-size);width:auto;aspect-ratio:1;flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;font-family:var(--font-sans);font-size:calc(var(--tile-size) * .44);font-weight:800;line-height:1;letter-spacing:.02em;text-indent:.02em;background:var(--bubble-bg);color:var(--tile-text);border:2px solid var(--tile-border);border-radius:50%;box-shadow:var(--bubble-inset);cursor:pointer;padding:0;user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation;transition:border-color var(--motion-base) var(--ease-out),background-color var(--motion-base) var(--ease-out),color var(--motion-base) var(--ease-out),transform var(--motion-fast) var(--ease-out),width var(--motion-base) var(--ease-out),margin var(--motion-base) var(--ease-out),opacity var(--motion-fast) var(--ease-out)}.letter-tile__shine{position:absolute;top:16%;left:22%;width:16%;height:11%;border-radius:50%;background:var(--bubble-shine);pointer-events:none;transition:opacity var(--motion-base) var(--ease-out)}.letter-tile__glyph{position:relative;z-index:1}.letter-tile:not(:disabled):hover{border-color:var(--color-border-strong)}.letter-tile:not(:disabled):active{transform:scale(.94)}.letter-tile--shed{width:0;aspect-ratio:auto;border-width:0;box-shadow:none;background:transparent;margin-inline:calc(var(--tile-gap) / -2);pointer-events:none;overflow:visible;transition:width var(--motion-base) var(--ease-out),margin var(--motion-base) var(--ease-out)}.letter-tile:disabled{cursor:default}.letter-tile--shed .letter-tile__shine,.letter-tile--shed .letter-tile__glyph{opacity:0}.letter-tile__pop{position:fixed;width:var(--pop-size);height:var(--pop-size);pointer-events:none;z-index:50}.letter-tile__pop-bubble{position:absolute;top:0;right:0;bottom:0;left:0;border-radius:50%;background:var(--bubble-bg);border:2px solid var(--tile-border);animation:pop-burst .32s var(--ease-out) forwards}.letter-tile__shard{position:absolute;top:50%;left:50%;width:calc(var(--pop-size) * .13);height:calc(var(--pop-size) * .13);border-radius:50%;background:var(--color-accent-2);--dx: calc(var(--fx) * var(--pop-size) * .62);--dy: calc(var(--fy) * var(--pop-size) * .62);animation:shard-fly .44s var(--ease-out) forwards}@keyframes pop-burst{0%{transform:scale(1)}45%{transform:scale(1.18)}70%{transform:scale(.55);opacity:.35}to{transform:scale(0);opacity:0}}@keyframes shard-fly{0%{transform:translate(-50%,-50%) scale(1);opacity:0}18%{opacity:1}to{transform:translate(calc(-50% + var(--dx)),calc(-50% + var(--dy))) scale(.2);opacity:0}}.word-row{display:flex;justify-content:center}.word-row__tiles{display:flex;justify-content:center;gap:var(--tile-gap)}.word-row--valid .letter-tile:not(.letter-tile--shed),.word-row--hinted .letter-tile:not(.letter-tile--shed){background:radial-gradient(circle at 35% 28%,#ffffff47,#fff0 55%),var(--color-valid);border-color:var(--color-valid);color:var(--color-valid-text)}.word-row--invalid .letter-tile:not(.letter-tile--shed){background:var(--color-invalid-bg);border-color:var(--color-invalid-border);color:var(--color-invalid-text);box-shadow:none;opacity:.6}.word-row--invalid .letter-tile:not(.letter-tile--shed) .letter-tile__shine{opacity:0}.game-board{--tile-gap: 6px;--board-chrome: 364px;--tile-size: max( 34px, min( 80px, (min(100vw, var(--content-width)) - (2 * var(--board-gutter)) - ((var(--longest-word) - 1) * var(--tile-gap))) / var(--longest-word), (100dvh - var(--board-chrome) - ((var(--row-count) - 1) * var(--tile-gap))) / var(--row-count) ) );display:flex;flex-direction:column;gap:var(--tile-gap);align-items:center;padding:0 var(--board-gutter);width:100%}.answer-slot{position:relative;width:var(--slot-size);height:var(--slot-size);display:inline-flex;align-items:center;justify-content:center;font-family:var(--font-sans);font-size:calc(var(--slot-size) * .44);font-weight:800;line-height:1;letter-spacing:.02em;text-indent:.02em;border-radius:50%;padding:0;user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation;transition:background-color var(--motion-base) var(--ease-out),border-color var(--motion-base) var(--ease-out),color var(--motion-base) var(--ease-out),transform var(--motion-fast) var(--ease-out)}.answer-slot__glyph{position:relative;z-index:1}.answer-slot--empty{background:transparent;border:2px dashed var(--slot-empty-border);cursor:default}.answer-slot--filled{background:radial-gradient(circle at 35% 28%,#ffffff52,#fff0 52%),var(--color-accent);border:2px solid transparent;color:var(--slot-filled-text);cursor:pointer}.answer-slot__shine{position:absolute;top:16%;left:22%;width:16%;height:11%;border-radius:50%;background:#ffffff8c;opacity:0;pointer-events:none}.answer-slot--filled .answer-slot__shine,.answer-slot--hinted .answer-slot__shine{opacity:1}.answer-slot--filled:not(:disabled):hover{transform:translateY(-2px)}.answer-slot--filled:not(:disabled):active{transform:scale(.94)}.answer-slot--hinted{background:radial-gradient(circle at 35% 28%,#ffffff57,#fff0 52%),var(--color-hinted);border-color:transparent;color:var(--color-hinted-text);cursor:default}.answer-slot--completed{background:radial-gradient(circle at 35% 28%,#ffffff52,#fff0 52%),var(--color-accent);border-color:transparent;color:var(--color-accent-text);cursor:default}.answer-slot--revealing{animation:solve-bounce .4s var(--ease-out) backwards;animation-delay:calc(var(--reveal-index) * 90ms)}@keyframes solve-bounce{0%{transform:scale(1)}45%{transform:scale(1.16)}74%{transform:scale(.98)}to{transform:scale(1)}}.answer-slot--arriving{animation:reveal-in .3s var(--ease-out) backwards}@keyframes reveal-in{0%{transform:scale(.2);opacity:0}60%{transform:scale(1.12);opacity:1}to{transform:scale(1);opacity:1}}.answer-slot--popping{overflow:visible}.answer-slot__pop{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:3}.answer-slot__pop-bubble{position:absolute;top:0;right:0;bottom:0;left:0;border-radius:50%;background:radial-gradient(circle at 35% 28%,#ffffff52,#fff0 52%),var(--color-accent);animation:pop-burst .32s var(--ease-out) forwards}.answer-slot__shard{position:absolute;top:50%;left:50%;width:calc(var(--slot-size) * .12);height:calc(var(--slot-size) * .12);border-radius:50%;background:var(--color-accent-2);--dx: calc(var(--fx) * var(--slot-size) * .6);--dy: calc(var(--fy) * var(--slot-size) * .6);animation:shard-fly .44s var(--ease-out) forwards}.answer-tray{--slot-gap: 9px;--slot-size: max( 36px, min( 74px, (min(100vw, var(--content-width)) - (2 * var(--board-gutter)) - ((var(--slot-count) - 1) * var(--slot-gap))) / var(--slot-count) ) );display:flex;justify-content:center;width:100%;padding:0 var(--board-gutter)}.answer-tray__slots{display:flex;gap:var(--slot-gap);justify-content:center}.tut-title{font-weight:800;font-size:1.125rem;line-height:1.1;margin:0 0 20px;color:var(--color-text)}.tut-demo{display:flex;flex-direction:column;align-items:center;gap:14px;padding:2px 0 22px}.tut-board{display:flex;flex-direction:column;gap:6px}.tut-row{position:relative;display:flex;justify-content:center}.tut-tile{position:relative;width:38px;height:38px;flex:none;margin:0 3px;display:flex;align-items:center;justify-content:center;border:2px solid var(--tile-border);border-radius:50%;background:var(--bubble-bg);box-shadow:var(--bubble-inset);color:var(--tile-text);font-weight:800;font-size:17px;letter-spacing:.02em;transition:width var(--motion-base) var(--ease-out),margin var(--motion-base) var(--ease-out),opacity var(--motion-base) var(--ease-out),background var(--motion-base) var(--ease-out),border-color var(--motion-base) var(--ease-out),box-shadow var(--motion-base) var(--ease-out),color var(--motion-base) var(--ease-out)}.tut-tile:before{content:"";position:absolute;top:16%;left:22%;width:16%;height:11%;border-radius:50%;background:var(--bubble-shine);transition:opacity var(--motion-base) var(--ease-out)}.tut-tile--green{background:radial-gradient(circle at 35% 28%,#ffffff47,#fff0 55%),var(--color-valid);border-color:var(--color-valid);color:#fff}.tut-tile--shed{width:0;margin:0;opacity:0;border-width:0}.tut-tile--highlight{border-color:var(--color-accent);transform-origin:center;animation:tut-pulse 1.4s var(--ease-out) infinite}@keyframes tut-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.09)}}.tut-divider{width:70%;height:1px;background:var(--color-border)}.tut-answer{display:flex;gap:6px;justify-content:center}.tut-slot{position:relative;width:36px;height:36px;flex:none;display:flex;align-items:center;justify-content:center;padding:0;border:2px dashed var(--slot-empty-border);border-radius:50%;background:transparent;color:var(--slot-filled-text);font-weight:800;font-size:17px;cursor:default;transition:background var(--motion-base) var(--ease-out),border-color var(--motion-base) var(--ease-out),box-shadow var(--motion-base) var(--ease-out)}.tut-slot--filled{border-color:transparent;background:radial-gradient(circle at 35% 28%,#ffffff52,#fff0 52%),var(--color-accent);box-shadow:0 3px 9px #12a5b838;cursor:pointer}.tut-slot--filled{animation:tut-reveal-in .3s var(--ease-out)}@keyframes tut-reveal-in{0%{transform:scale(.2);opacity:0}60%{transform:scale(1.12);opacity:1}to{transform:scale(1);opacity:1}}.tut-slot--solved{animation:tut-solve-bounce .4s var(--ease-out) backwards;animation-delay:calc(var(--tut-reveal-index, 0) * 90ms)}@keyframes tut-solve-bounce{0%{transform:scale(1)}45%{transform:scale(1.16)}74%{transform:scale(.98)}to{transform:scale(1)}}.tut-answer:not(.tut-answer--practice) .tut-slot{pointer-events:none}.tut-answer:not(.tut-answer--practice) .tut-slot--tappable{pointer-events:auto;cursor:pointer;animation:tut-pulse 1.4s var(--ease-out) infinite}.tut-caption{padding:0 10px;min-height:84px}.tut-caption__kicker{font-weight:800;font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--color-accent);margin:0 0 5px}.tut-caption__body{font-weight:500;font-size:14px;line-height:1.5;color:var(--color-text);margin:0;text-wrap:pretty}.tut-controls{display:flex;align-items:center;justify-content:center;gap:18px;margin-top:12px;padding:0 10px}.tut-dots{display:flex;align-items:center;gap:7px}.tut-dot{width:8px;height:8px;border-radius:var(--radius-pill);background:var(--color-border-strong);transition:width var(--motion-base) var(--ease-out),background var(--motion-base) var(--ease-out)}.tut-dot--active{width:22px;background:var(--color-accent)}.tut-controls__buttons{display:flex;gap:8px}.tut-btn{min-height:44px;min-width:76px;padding:0 18px;border-radius:var(--radius-pill);font-weight:700;font-size:14px;cursor:pointer;transition:transform var(--motion-fast) var(--ease-out)}.tut-btn:active{transform:scale(.94)}.tut-btn--primary{border:2px solid var(--color-accent);background:var(--color-accent);color:var(--color-accent-text)}.tut-btn--secondary{border:2px solid var(--color-border-strong);background:transparent;color:var(--color-text)}.tut-btn:disabled{opacity:.4;cursor:default}.tut-btn:focus-visible,.tut-slot:focus-visible{outline:2px solid var(--color-focus);outline-offset:2px}.tut-index{position:absolute;left:-26px;top:50%;transform:translateY(-50%);font-size:14px;font-weight:800;color:var(--color-accent);opacity:0}.tut-slot__num{font-size:14px;font-weight:800;color:var(--color-accent)}.tut-demo--numbered .tut-index{opacity:1}.tut-tile--tappable,.tut-tile--live{padding:0;font-family:inherit;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation}.tut-tile--live:hover:not(.tut-tile--shed):not(:disabled){border-color:var(--color-accent)}.tut-tile--live:focus-visible{outline:2px solid var(--color-focus);outline-offset:2px}.tut-tile--live.tut-tile--shed{pointer-events:none}.tut-caption__body--idle{color:var(--color-text-muted)}.tut-caption__body--win{color:var(--color-valid);font-weight:700}.tut-answer--practice .tut-slot{width:46px;height:46px;font-size:20px}.tut-tile--live:disabled{cursor:default}.tut-slot--highlight{animation:tut-pulse 1.4s var(--ease-out) infinite}.tut-slot--wrong{background:radial-gradient(circle at 35% 28%,#ffffff4d,#fff0 52%),var(--color-wrong);box-shadow:none}.tut-slot--target{border-color:var(--color-accent);border-style:dashed;animation:tut-pulse 1.4s var(--ease-out) infinite}.tut-row--target .tut-tile:not(.tut-tile--shed){border-color:var(--color-accent)}.tut-word{font-weight:800;color:var(--color-text)}@media(max-width:420px){.tut-caption{min-height:105px}}.tut-controls--practice{justify-content:space-between;min-height:44px}.tut-back{display:inline-flex;align-items:center;gap:6px;padding:0;border:none;background:none;font-family:inherit;font-size:13px;font-weight:700;color:var(--color-text-muted);cursor:pointer;transition:color var(--motion-base) var(--ease-out)}.tut-back__arrow{width:1.15em;height:1.15em;flex:0 0 auto}.tut-back:hover{color:var(--color-text)}.tut-back:focus-visible{outline:2px solid var(--color-focus);outline-offset:3px;border-radius:var(--radius-sm)}.game{max-width:var(--content-width);width:100%;margin:0 auto;flex:1 1 auto;min-height:0;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;--game-gap: clamp(10px, 2.6vh, 26px);gap:var(--game-gap);padding:clamp(10px,2.2vh,22px) 0}.game:before,.game:after{content:"";flex:1 1 0}.game:before{margin-bottom:calc(-1 * var(--game-gap))}.game:after{flex-grow:3;margin-top:calc(-1 * var(--game-gap))}.game--admin .game-board{--board-chrome: 456px}.game__view-results{min-height:44px;padding:0 26px;border-radius:var(--radius-pill);border:2px solid var(--color-border-strong);background:transparent;color:var(--color-text);font-size:.9375rem;font-weight:700;letter-spacing:.02em;cursor:pointer;touch-action:manipulation;transition:background-color var(--motion-base) var(--ease-out),border-color var(--motion-base) var(--ease-out)}.game__view-results:hover{background:var(--color-accent);border-color:var(--color-accent);color:var(--color-accent-text)}