@font-face{font-family:Fredoka;font-style:normal;font-weight:300 700;font-display:swap;src:url(/fonts/fredoka-latin.woff2)format("woff2")}@font-face{font-family:Fredoka;font-style:normal;font-weight:300 700;font-display:swap;src:url(/fonts/fredoka-latin-ext.woff2)format("woff2")}:root{--coral:#ff6b6b;--coral-hot:#ff5252;--teal:#4ecdc4;--teal-deep:#3aa897;--teal-tint:#e0f7fa;--pale-yellow:#fff9c4;--panel-grey:#f8f9fa;--ink:#333;--card:#ffffffe6;--shadow-card:0 10px 30px #0003;--shadow-soft:0 5px 15px #0000001a}*{box-sizing:border-box}[hidden]{display:none!important}body{min-height:100vh;color:var(--ink);-webkit-text-size-adjust:100%;background:linear-gradient(135deg,#ffd1dc,#a2d8f1);margin:0;font-family:Fredoka,system-ui,-apple-system,Segoe UI,sans-serif}#app{justify-content:center;align-items:flex-start;min-height:100vh;padding:20px;display:flex}.app-card{background:var(--card);width:100%;min-width:0;max-width:600px;box-shadow:var(--shadow-card);border-radius:15px;padding:20px}.app-header{text-align:center;gap:.4rem;margin-bottom:.9rem;display:grid}.title{color:var(--coral);letter-spacing:-.01em;text-align:center;text-shadow:2px 2px #ffd1dc;margin:0;font-size:2.5rem;font-weight:700}.subtitle{color:var(--teal);margin:0;font-size:1.2rem;font-weight:500}.header-controls{flex-wrap:nowrap;justify-content:space-between;align-items:center;gap:clamp(.3rem,1.2vw,.6rem);margin-top:.35rem;display:flex}.mode-bar{border-radius:50px;display:inline-flex}.mode-bar button{background:var(--coral);color:#fff;min-height:2.5rem;font:inherit;cursor:pointer;border:0;border-radius:0;padding:0 .85rem;font-size:.9rem;font-weight:600}.mode-bar button:first-child{border-radius:50px 0 0 50px}.mode-bar button:last-child{border-radius:0 50px 50px 0}.mode-bar button.on{background:var(--teal);box-shadow:0 0 0 4px #4ecdc466}.word-list-toggle,.how-to-toggle{border:2px solid var(--teal);background:var(--teal-tint);min-height:2.5rem;color:var(--teal-deep);font:inherit;cursor:pointer;border-radius:50px;padding:0 .95rem;font-size:.9rem;font-weight:600}.header-controls button{white-space:nowrap;padding-inline:clamp(.45rem,1.6vw,.95rem);font-size:clamp(.7rem,2.2vw,.9rem)}.label-full{display:inline}.label-short{display:none}.how-to-panel{background:#fff;border-radius:15px;margin:0 0 15px;padding:15px;box-shadow:0 5px 15px #0000001a}.how-to-panel h2{color:var(--coral);text-align:center;margin:0 0 10px;font-size:1.35rem}.how-to-steps{gap:.4rem;margin:0;padding-left:1.4rem;font-size:.95rem;line-height:1.45;display:grid}.count{color:#6b7280;font-variant-numeric:tabular-nums;margin:0;font-size:.85rem}.pattern-panel{border:2px solid var(--teal-tint);background:var(--panel-grey);border-radius:15px;margin:0 0 .9rem;padding:.4rem .6rem .7rem}.options{grid-template-columns:repeat(auto-fill,minmax(11rem,1fr));gap:.15rem;max-height:48vh;display:grid;overflow:auto}.option{cursor:pointer;border-radius:10px;align-items:center;gap:.6rem;min-height:2.75rem;padding:.25rem .5rem;display:flex}.option:hover{background:var(--teal-tint)}.option input{width:1.35rem;height:1.35rem;accent-color:var(--teal)}.action-btn{background:var(--coral);color:#fff;min-height:3rem;font:inherit;cursor:pointer;border:0;border-radius:50px;padding:0 1.3rem;font-size:1rem;font-weight:600;transition:background .15s ease-out,transform .15s ease-out;box-shadow:0 5px 15px #0003}.action-btn:hover{background:var(--coral-hot);transform:scale(1.05)}.action-btn:active{transform:scale(.98)}.peek-btn{background:var(--teal);color:#fff;width:100%;max-width:24rem;min-height:5rem;font:inherit;cursor:pointer;border:0;border-radius:50px;justify-self:center;margin:0 auto;padding:0 1.3rem;font-size:1.15rem;font-weight:600;transition:background .15s ease-out,transform .15s ease-out;box-shadow:0 5px 15px #0003}.peek-btn:hover{background:var(--teal-deep);transform:scale(1.02)}.peek-btn:active{transform:scale(.98)}.game{grid-template-columns:1fr;align-content:start;gap:.85rem;min-width:0;display:grid}.game-bar{color:#6b7280;font-variant-numeric:tabular-nums;justify-content:space-between;font-size:.9rem;display:flex}.score{font-weight:600}.word-box{box-sizing:border-box;min-width:0;max-width:100%;box-shadow:var(--shadow-soft);background:#fff;border-radius:15px;padding:12px}.card{border:3px solid var(--teal);background:var(--pale-yellow);letter-spacing:-.02em;text-align:center;box-sizing:border-box;white-space:nowrap;border-radius:10px;place-items:center;width:100%;max-width:100%;height:clamp(10rem,30vh,20rem);padding:.35rem .5rem;font-size:clamp(3.5rem,12vw,8rem);font-weight:400;line-height:1.25;display:grid;overflow:hidden}.game>.action-btn,.hear{justify-self:center}.hear{margin-block:.5rem}.verdict-pad{background:var(--panel-grey);border-radius:15px;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;padding:10px;display:grid}.verdict{color:#fff;cursor:pointer;border:0;border-radius:10px;min-height:96px;font-family:Fredoka,system-ui,sans-serif;font-size:1.25rem;font-weight:600}.verdict.right{background:var(--teal)}.verdict.wrong{background:var(--coral)}.verdict:active{transform:scale(.985)}.size-controls{justify-content:center;align-items:center;gap:.5rem;display:flex}.size-btn{border:2px solid var(--teal-tint);min-width:3.25rem;min-height:2.75rem;color:var(--teal-deep);font:inherit;cursor:pointer;background:#fff;border-radius:10px;padding:0 .8rem;font-size:.9rem;font-weight:600}.size-btn:disabled{opacity:.35;cursor:not-allowed}.control-sep{background:var(--teal-tint);align-self:stretch;width:1px;margin:0 .25rem}.volume-label{color:#6b7280;font-variant-numeric:tabular-nums;place-items:center;min-width:3rem;font-size:.8rem;display:grid}.flash,.flash-slot{color:var(--coral);place-items:center;font-size:1.3rem;font-weight:700;display:grid}.flash{min-height:2.2rem;animation:.18s ease-out flash-in}.flash-slot{height:0;min-height:0;display:none}.flash.gone{opacity:0;transition:opacity .35s ease-out}@keyframes flash-in{0%{opacity:0;transform:translateY(6px)scale(.96)}}.streak{color:#6b7280;font-variant-numeric:tabular-nums;text-align:center;font-size:.9rem}.progress-area{background:#fff;border-radius:15px;margin-top:10px;padding:15px;box-shadow:0 5px 15px #0000001a}.progress-area h2{color:var(--coral);text-align:center;margin:0 0 10px;font-size:1.35rem}.goal-track{background:#f8f9fa;border-radius:15px;grid-template-columns:1fr auto 1fr;align-items:center;gap:6px;padding:10px;display:grid}.mascot{grid-area:1/1;justify-self:start;font-size:2.5rem;line-height:1;animation:1.4s ease-in-out infinite bounce}.goal-steps-wrapper{flex-direction:column;grid-area:1/2;justify-self:center;gap:4px;display:flex}.goal-steps{justify-content:center;gap:5px;display:flex}.step{color:#7f8c8d;font-variant-numeric:tabular-nums;background:#e0e0e0;border-radius:8px;place-items:center;width:35px;height:35px;font-size:.85rem;font-weight:700;transition:background .15s ease-out,color .15s ease-out;display:grid}.step.filled{color:#fff;background:linear-gradient(135deg,#4ecdc4,#ff6b6b);box-shadow:0 2px 8px #4ecdc466}.goal-end{grid-area:1/3;justify-self:end;font-size:2.5rem;line-height:1}.solved-line{color:#6b7280;font-variant-numeric:tabular-nums;text-align:center;margin:10px 0 0;font-size:.9rem}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-6px)}}.summary,.empty{align-content:start;justify-items:stretch;gap:.6rem;margin-top:.5rem;display:grid}.summary .action-btn,.summary .secondary{width:100%}.secondary{border:2px solid var(--teal-tint);min-height:3rem;color:var(--teal-deep);font:inherit;cursor:pointer;background:#fff;border-radius:50px;margin-top:.4rem;font-weight:600}.site-footer{color:var(--teal);text-align:center;margin-top:20px;font-size:1.2rem}.site-footer p{margin:0}.celebration{z-index:10;background:#00000073;place-items:center;padding:1.5rem;display:grid;position:fixed;inset:0}.celebration-card{max-width:26rem;box-shadow:var(--shadow-card);text-align:center;background:#fff;border-radius:15px;justify-items:center;gap:.75rem;padding:1.5rem;display:grid}.celebration-card h2{color:var(--coral);margin:0;font-size:1.35rem}.celebration-emojis{font-size:2.5rem}@media (width<=600px){#app{padding:10px}.app-card{padding:14px}.game{grid-template-columns:1fr}.verdict-pad{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.word-box{padding:8px}.title{font-size:2rem}.action-btn{width:100%}}@media (width<=480px){.mode-bar button,.word-list-toggle,.how-to-toggle{min-height:2.75rem}.label-full{display:none}.label-short{display:inline}}@media (prefers-reduced-motion:reduce){.flash,.step,.action-btn,.mascot{transition:none;animation:none}.verdict:active,.action-btn:hover,.action-btn:active,.peek-btn:hover,.peek-btn:active{transform:none}}