.btn{--btn-bg:var(--color-primary);--btn-edge:var(--color-primary-edge);--btn-ink:var(--color-ink);justify-content:center;align-items:center;gap:var(--space-2);min-height:var(--touch-min);padding:0 var(--space-6);white-space:nowrap;border-radius:var(--radius-m);background:var(--btn-bg);color:var(--btn-ink);box-shadow:0 var(--edge) 0 var(--btn-edge);font-family:var(--font-display);letter-spacing:.01em;transition:translate var(--dur-fast), box-shadow var(--dur-fast), background var(--dur-fast);border:none;font-size:22px;font-weight:600;display:inline-flex;translate:0}.btn:active:not(:disabled){translate:0 calc(var(--edge) - 1px);box-shadow:0 1px 0 var(--btn-edge)}.btn:disabled{--btn-bg:var(--color-line);--btn-edge:var(--color-surface-edge);--btn-ink:var(--color-ink-muted)}.btn--primary,.btn--correct{min-width:160px}.btn--block{width:100%}.btn--correct{--btn-bg:var(--color-correct);--btn-edge:var(--color-correct-edge);--btn-ink:#fff}.btn--retry{--btn-bg:var(--color-retry);--btn-edge:var(--color-retry-edge);--btn-ink:var(--color-ink)}.btn--secondary{--btn-bg:var(--color-surface);--btn-edge:var(--color-surface-edge);--btn-ink:var(--color-ink)}.btn svg{flex:none}.icon-btn{width:var(--touch-min);height:var(--touch-min);background:0 0;border:none;flex:none;place-items:center;padding:0;display:inline-grid}.icon-btn__face{border-radius:var(--radius-pill);width:52px;height:52px;color:var(--color-ink);transition:translate var(--dur-fast), box-shadow var(--dur-fast);place-items:center;display:grid}.icon-btn--surface .icon-btn__face{background:var(--color-surface);box-shadow:0 4px 0 var(--color-surface-edge)}.icon-btn--surface:active .icon-btn__face{box-shadow:0 1px 0 var(--color-surface-edge);translate:0 3px}.icon-btn--ghost .icon-btn__face{color:var(--color-ink-muted)}.icon-btn--ghost:hover .icon-btn__face{background:var(--color-line)}.progress-bar{height:var(--progress-height);border-radius:var(--radius-pill);background:var(--color-line);flex:1;overflow:hidden;box-shadow:inset 0 2px #2b2d4214}.progress-bar__fill{height:100%;min-width:var(--progress-height);border-radius:var(--radius-pill);background:var(--color-primary);position:relative}.progress-bar__fill:after{content:"";left:var(--space-2);right:var(--space-2);border-radius:var(--radius-pill);background:#ffffff8c;height:5px;position:absolute;top:4px}.audio-btn{background:0 0;border:none;flex:none;place-items:center;width:112px;height:112px;padding:0;display:inline-grid;position:relative}.audio-btn--s{width:var(--touch-min);height:var(--touch-min)}.audio-btn__face{z-index:1;border-radius:var(--radius-pill);background:var(--color-primary);width:100%;height:100%;color:var(--color-ink);box-shadow:0 var(--edge) 0 var(--color-primary-edge);transition:translate var(--dur-fast), box-shadow var(--dur-fast);place-items:center;display:grid;position:relative}.audio-btn--s .audio-btn__face{box-shadow:0 4px 0 var(--color-primary-edge)}.audio-btn:disabled .audio-btn__face{background:var(--color-surface-edge);box-shadow:0 var(--edge) 0 var(--color-line);color:var(--color-ink-muted)}.audio-btn:active:not(:disabled) .audio-btn__face{box-shadow:0 1px 0 var(--color-primary-edge);translate:0 4px}.audio-btn__wave{border-radius:var(--radius-pill);border:4px solid var(--color-primary);opacity:0;pointer-events:none;position:absolute;inset:0}.audio-btn[data-playing] .audio-btn__wave,.mic-btn[data-playing] .audio-btn__wave{animation:1.2s ease-out infinite audio-wave}.audio-btn[data-playing] .audio-btn__wave--late,.mic-btn[data-playing] .audio-btn__wave--late{animation-delay:.6s}@keyframes audio-wave{0%{opacity:.8;transform:scale(1)}to{opacity:0;transform:scale(1.5)}}@media (prefers-reduced-motion:reduce){.audio-btn[data-playing] .audio-btn__wave:first-child,.mic-btn[data-playing] .audio-btn__wave:not(.audio-btn__wave--late){opacity:.8;animation:none;transform:scale(1.15)}}.answer-card{width:var(--card-size,var(--card-min));min-width:var(--card-min);aspect-ratio:1;background:0 0;border:none;border-radius:22%;padding:0;display:block;position:relative}.answer-card__art{filter:drop-shadow(0 5px #3b2a2033);width:100%;height:100%;transition:translate .18s,filter .18s,opacity .2s;display:block}.answer-card__art .picture{width:100%;height:100%}.answer-card:after{content:"";pointer-events:none;border:6px solid #0000;border-radius:24%;transition:border-color .15s,box-shadow .15s;position:absolute;inset:-8px}.answer-card--selected .answer-card__art{filter:drop-shadow(0 11px #3b2a2033);translate:0 -6px}.answer-card--selected:after{border-color:var(--color-primary);box-shadow:0 0 0 2px var(--color-ink)}.answer-card--flown .answer-card__art{visibility:hidden}.answer-card--flown:after{border:3px dashed var(--color-correct);background:var(--color-correct-tint);border-radius:19%;inset:0}.answer-card--wrong:after{border-color:var(--color-retry);box-shadow:0 0 0 2px var(--color-ink)}.answer-card--missed .answer-card__art,.answer-card--dimmed .answer-card__art{opacity:.4;filter:grayscale(.7)}.answer-card__badge{z-index:2;border-radius:var(--radius-pill);border:3px solid var(--color-surface);place-items:center;width:36px;height:36px;display:grid;position:absolute;top:-12px;right:-12px}.answer-card__badge--wrong{background:var(--color-retry);color:var(--color-ink)}.answer-card--missed .answer-card__badge{opacity:.6}.star-burst{z-index:3;pointer-events:none;width:0;height:0;position:absolute;top:50%;left:50%}.star-burst__star{color:var(--color-star);filter:drop-shadow(0 1px 0 var(--color-primary-edge));position:absolute;top:-12px;left:-12px}.star-burst__star--teal{color:var(--color-correct);filter:drop-shadow(0 1px 0 var(--color-correct-edge))}.sheet{--sheet-ink:var(--color-correct-ink);z-index:20;padding:var(--space-5) var(--space-4) max(var(--space-5), env(safe-area-inset-bottom));border-radius:var(--radius-l) var(--radius-l) 0 0;background:var(--color-correct-tint);position:fixed;bottom:0;left:0;right:0;box-shadow:0 -8px 24px #2b2d4224}.sheet--retry,.sheet--revealed{--sheet-ink:var(--color-retry-ink);background:var(--color-retry-tint)}.sheet--retry{cursor:pointer}.sheet-backdrop{z-index:19;cursor:pointer;position:fixed;inset:0}.sheet__inner{max-width:var(--content-max);gap:var(--space-4);flex-direction:column;margin:0 auto;display:flex}.sheet__head{align-items:center;gap:var(--space-3);color:var(--sheet-ink);display:flex}.sheet__icon{flex:none;display:grid}.sheet__title{font-size:var(--text-title);color:var(--sheet-ink);font-weight:700}.sheet__message{font-size:var(--text-body);color:var(--color-ink)}.sheet__tip{align-items:flex-start;gap:var(--space-3);padding:var(--space-3);border-radius:var(--radius-s);background:var(--color-primary-tint);color:var(--color-ink);font-size:var(--text-body);line-height:1.35;display:flex}.sheet__tip-icon{color:var(--color-primary-edge);flex:none}.sheet__tip-label{font-family:var(--font-display);font-size:var(--text-small);color:var(--color-retry-ink);font-weight:600;display:block}.sheet__tip strong{font-weight:900}.sheet__answer{align-items:center;gap:var(--space-3);padding:var(--space-3);border-radius:var(--radius-m);background:var(--color-surface);display:flex}.sheet__picture{aspect-ratio:1;flex:none;width:88px;position:relative}.sheet__picture-art{display:block}.flying-card{z-index:30;pointer-events:none;filter:drop-shadow(0 8px 10px #2b2d4240);position:fixed}.flying-card .picture{width:100%;height:100%}.sheet__picture .picture{width:100%;height:auto}.sheet__words{flex-direction:column;flex:1;min-width:0;display:flex}.sheet__es{font-size:var(--text-es);font-weight:700;line-height:1.1}.gloss{font-family:var(--font-body);font-size:var(--text-subtitle);color:var(--color-ink);font-weight:600;line-height:1.3}.gloss[data-hidden]{visibility:hidden}.speech-btn{--bubble-h:112px;justify-content:center;align-items:center;gap:var(--space-3);width:188px;height:var(--bubble-h);padding:var(--space-1) var(--space-4);border:4px solid var(--color-art-outline);border-radius:min(var(--radius-l), calc(var(--bubble-h) / 3.5));background:var(--color-surface);box-shadow:0 var(--edge) 0 var(--color-surface-edge);transition:translate var(--dur-fast), box-shadow var(--dur-fast);flex:none;display:flex;position:relative}.speech-btn:active{box-shadow:0 2px 0 var(--color-surface-edge);translate:0 3px}.speech-btn:has(.speech-btn__speaker){justify-content:flex-start}.speech-btn:before,.speech-btn:after{content:"";border-style:solid;width:0;height:0;position:absolute;top:50%;translate:0 -50%}.speech-btn:before{border-width:12px 24px 12px 0;border-color:transparent var(--color-art-outline) transparent transparent;left:-24px}.speech-btn:after{border-width:8px 18px 8px 0;border-color:transparent var(--color-surface) transparent transparent;left:-17px}.speech-btn__speaker{--speaker:min(68px, calc(var(--bubble-h) - 24px));width:var(--speaker);height:var(--speaker);border-radius:var(--radius-pill);background:var(--color-primary);box-shadow:0 4px 0 var(--color-primary-edge);color:var(--color-ink);flex:none;place-items:center;display:grid}.speech-btn__speaker svg{width:59%;height:59%}.speech-btn__bars{--bar-max:min(40px, calc(var(--bubble-h) - 36px));height:var(--bar-max);align-items:center;gap:5px;display:flex}.speech-btn__bar{border-radius:var(--radius-pill);background:var(--color-primary-edge);width:7px;height:12px}.speech-btn[data-playing] .speech-btn__bar{animation:.5s ease-in-out infinite alternate speech-bar}@keyframes speech-bar{0%{height:10px}to{height:var(--bar-max)}}@media (prefers-reduced-motion:reduce){.speech-btn[data-playing] .speech-btn__bar{height:28px;animation:none}}.speech-btn__text{text-align:center;color:var(--color-ink);font-size:28px;font-weight:700;line-height:1.1}.word-tile{border-radius:var(--radius-s);box-shadow:0 4px 0 var(--color-surface-edge);background:0 0;border:none;padding:0;display:inline-flex;position:relative}.word-tile__face{min-height:var(--touch-min);min-width:var(--touch-min);padding:0 var(--space-3);border:3px solid var(--color-surface-edge);border-radius:var(--radius-s);background:var(--color-surface);font-family:var(--font-display);font-size:var(--text-tile);color:var(--color-ink);white-space:nowrap;justify-content:center;align-items:center;font-weight:700;line-height:1;display:flex}.word-tile:active:not(:disabled){box-shadow:0 1px 0 var(--color-surface-edge);translate:0 3px}.word-tile--wrong .word-tile__face{border-color:var(--color-retry);background:var(--color-retry-tint);box-shadow:0 0 0 2px var(--color-ink)}.word-tile--correct{box-shadow:0 4px 0 var(--color-correct-edge)}.word-tile--correct .word-tile__face{border-color:var(--color-correct);background:var(--color-correct-tint);color:var(--color-correct-ink)}.word-tile--locked{cursor:default}.word-tile--ghost{box-shadow:none}.word-tile--ghost .word-tile__face{background:var(--color-line);color:#0000;border-color:#0000}.mic-btn{width:var(--mic-size);height:var(--mic-size);border-radius:var(--radius-pill);background:0 0;border:none;place-items:center;padding:0;display:grid;position:relative}.mic-btn__face{z-index:1;border-radius:var(--radius-pill);background:var(--color-primary);width:100%;height:100%;box-shadow:0 var(--edge) 0 var(--color-primary-edge);color:var(--color-ink);transition:background var(--dur-fast), translate var(--dur-fast), box-shadow var(--dur-fast);place-items:center;display:grid;position:relative}.mic-btn:active:not(:disabled) .mic-btn__face{box-shadow:0 2px 0 var(--color-primary-edge);translate:0 3px}.mic-btn[data-recording] .mic-btn__face{background:var(--color-retry);box-shadow:0 var(--edge) 0 var(--color-retry-edge)}.mic-btn:disabled .mic-btn__face{background:var(--color-surface-edge);box-shadow:0 var(--edge) 0 var(--color-line);color:var(--color-ink-muted)}.mic-btn__level{border-radius:var(--radius-pill);background:var(--color-retry-tint);border:3px solid var(--color-retry);opacity:0;transition:transform 80ms linear, opacity var(--dur-fast);position:absolute;inset:0}.mic-btn[data-recording] .mic-btn__level{opacity:1}.mic-btn[data-invite]:before{content:"";border-radius:var(--radius-pill);border:4px solid var(--color-primary);animation:1.6s ease-out infinite mic-invite;position:absolute;inset:0}@keyframes mic-invite{0%{opacity:.9;transform:scale(1)}to{opacity:0;transform:scale(1.45)}}@media (prefers-reduced-motion:reduce){.mic-btn[data-invite]:before{opacity:.7;animation:none;transform:scale(1.12)}.mic-btn__level{transition:none}}.lesson-top{width:100%;max-width:calc(var(--content-max) + 2 * var(--space-4));align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-2) 0;margin:0 auto;display:flex}.lesson-top--on-art .progress-bar{box-shadow:0 0 0 3px var(--color-surface)}.modal.leave{width:min(440px,100%)}.leave .modal__head h2,.leave__text{text-wrap:balance}.leave__text{font-size:var(--text-body);margin-bottom:var(--space-5)}.leave__actions{gap:var(--space-3);flex-wrap:wrap-reverse;display:flex}.leave__actions .btn{min-width:0;padding:0 var(--space-3);flex:auto;font-size:clamp(18px,5.6vw,22px)}.lesson-actions{border-top:3px solid var(--color-line);background:var(--color-bg);padding:var(--space-4) var(--space-4) max(var(--space-4), env(safe-area-inset-bottom))}.lesson-actions__inner{max-width:var(--content-max);margin:0 auto}.modal__backdrop{z-index:50;padding:var(--space-4);background:#2b2d4273;place-items:center;display:grid;position:fixed;inset:0}.modal{width:min(640px,100%);max-height:calc(100dvh - 2 * var(--space-4));border:4px solid var(--color-art-outline);border-radius:var(--radius-l);background:var(--color-bg);box-shadow:var(--shadow-soft);flex-direction:column;display:flex;overflow:hidden}.modal__head{justify-content:space-between;align-items:center;gap:var(--space-3);padding:var(--space-2) var(--space-2) var(--space-2) var(--space-5);border-bottom:3px solid var(--color-line);display:flex}.modal__head h2{font-family:var(--font-display);font-size:var(--text-heading)}.modal__body{padding:var(--space-4) var(--space-5) var(--space-5);overflow-y:auto}