:root{--bg-main: hsl(222, 47%, 9%);--bg-card: hsla(222, 47%, 15%, .7);--border-color: hsl(223, 27%, 24%);--text-main: hsl(210, 40%, 98%);--text-muted: hsl(215, 20%, 65%);--color-primary: hsl(263, 90%, 65%);--color-primary-hover: hsl(263, 90%, 70%);--color-secondary: hsl(217, 91%, 60%);--color-accent: hsl(190, 95%, 50%);--color-success: hsl(142, 70%, 45%);--color-success-bg: hsla(142, 70%, 15%, .8);--color-success-border: hsl(142, 70%, 30%);--color-error: hsl(350, 85%, 55%);--color-error-bg: hsla(350, 85%, 15%, .8);--color-error-border: hsl(350, 85%, 30%);--radius-sm: 8px;--radius-md: 16px;--radius-lg: 24px;--font-family: "Outfit", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--shadow-glow: 0 0 20px hsla(263, 90%, 65%, .25);--shadow-card: 0 10px 30px rgba(0, 0, 0, .4);--transition-fast: .15s ease;--transition-normal: .3s cubic-bezier(.4, 0, .2, 1);--bg-app-container: hsla(222, 47%, 6%, .5);--bg-validation-drawer: hsl(222, 47%, 6%)}:root[data-theme=light]{--bg-main: hsl(220, 30%, 95%);--bg-card: hsla(220, 30%, 100%, .85);--border-color: hsl(220, 20%, 85%);--text-main: hsl(222, 47%, 9%);--text-muted: hsl(215, 15%, 45%);--color-primary: hsl(263, 70%, 55%);--color-primary-hover: hsl(263, 70%, 45%);--color-secondary: hsl(217, 80%, 50%);--color-accent: hsl(190, 85%, 40%);--color-success: hsl(142, 60%, 35%);--color-success-bg: hsla(142, 70%, 90%, .95);--color-success-border: hsl(142, 60%, 75%);--color-error: hsl(350, 75%, 45%);--color-error-bg: hsla(350, 85%, 90%, .95);--color-error-border: hsl(350, 75%, 75%);--shadow-glow: 0 0 20px hsla(263, 70%, 55%, .15);--shadow-card: 0 10px 30px rgba(0, 0, 0, .08);--bg-app-container: hsla(220, 30%, 100%, .4);--bg-validation-drawer: hsl(220, 30%, 90%)}*{box-sizing:border-box;margin:0;padding:0}.hidden{display:none!important}input,textarea,select{font-size:16px}body{font-family:var(--font-family);background-color:var(--bg-main);color:var(--text-main);height:100dvh;width:100vw;display:flex;justify-content:center;align-items:center;overflow:hidden;position:fixed;left:0;top:0;background-image:radial-gradient(at 0% 0%,hsla(263,90%,65%,.08) 0px,transparent 50%),radial-gradient(at 100% 100%,hsla(190,95%,50%,.08) 0px,transparent 50%)}.app-container{width:100%;max-width:650px;height:100dvh;display:flex;flex-direction:column;position:relative;padding:0;overflow:hidden}@media(min-width:650px){.app-container{height:100dvh;max-height:none;border-left:3px solid var(--border-color);border-right:3px solid var(--border-color);border-top:none;border-bottom:none;border-radius:0;background-color:var(--bg-app-container);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:8px 0 #0000000d,-8px 0 #0000000d}}.screen{display:none;flex-direction:column;width:100%;height:100%;max-height:100%;flex:1;min-height:0;overflow:hidden;opacity:0;transition:opacity var(--transition-normal)}.screen.active{display:flex;opacity:1}.primary-btn{background:linear-gradient(135deg,var(--color-primary),var(--color-secondary));color:#fff;border:none;padding:16px 32px;font-size:1.1rem;font-weight:700;border-radius:var(--radius-md);cursor:pointer;box-shadow:var(--shadow-glow);transition:all var(--transition-fast);text-align:center;position:relative;overflow:hidden}.primary-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 0 25px #9355f666;filter:brightness(1.1)}.primary-btn:active:not(:disabled){transform:translateY(1px)}.primary-btn.disabled,.primary-btn:disabled{background:#2b303b;color:var(--text-muted);cursor:not-allowed;box-shadow:none;transform:none}.secondary-btn{background-color:transparent;color:var(--text-muted);border:2px solid var(--border-color);padding:16px 32px;font-size:1.1rem;font-weight:600;border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-fast)}.secondary-btn:hover{border-color:var(--text-muted);color:var(--text-main);background-color:#1b294b4d}.icon-btn{background:none;border:none;color:var(--text-muted);font-size:1.5rem;cursor:pointer;padding:8px;transition:color var(--transition-fast);display:flex;align-items:center;justify-content:center}.icon-btn:hover{color:var(--text-main)}#welcome-screen{align-items:center;padding:40px 24px;overflow-y:auto!important;overflow-x:hidden}.welcome-card{width:100%;max-width:500px;text-align:center;display:flex;flex-direction:column;gap:32px;margin:20px 0}.welcome-hero{display:grid;grid-template-columns:minmax(0,1fr);justify-items:center;align-items:center;gap:12px}.welcome-hero .logo-area{width:100%;min-width:0}.panda-actor__motion{position:relative;display:block;width:100%;height:100%;overflow:hidden;transform-origin:50% 88%}.panda-actor__sprite,.panda-actor__fallback{position:absolute;inset:0;display:block;width:100%;height:100%}.panda-actor__sprite{z-index:1;background-position:0 0;background-repeat:no-repeat;background-size:1000% 100%;opacity:0;will-change:background-position}.panda-actor__fallback{z-index:0;object-fit:contain;opacity:1}.panda-actor[data-panda-ready=true] .panda-actor__sprite{opacity:1}.panda-actor[data-panda-ready=true] .panda-actor__fallback{opacity:0}.panda-actor.is-playing .panda-actor__sprite{animation:panda-sprite-frames var(--panda-duration, .9s) steps(9,end) both}.panda-actor.is-complete .panda-actor__sprite{background-position:100% 0}.panda-actor.is-playing[data-panda-state=idle] .panda-actor__motion{animation:panda-motion-idle var(--panda-duration, .9s) ease-in-out both}.panda-actor.is-playing[data-panda-state=wave] .panda-actor__motion{animation:panda-motion-wave var(--panda-duration, .82s) cubic-bezier(.25,.8,.3,1) both}.panda-actor.is-playing[data-panda-state=correct] .panda-actor__motion{animation:panda-motion-correct var(--panda-duration, .82s) cubic-bezier(.2,.78,.25,1) both}.panda-actor.is-playing[data-panda-state=wrong] .panda-actor__motion{animation:panda-motion-wrong var(--panda-duration, .9s) cubic-bezier(.3,.72,.35,1) both}@keyframes panda-sprite-frames{0%{background-position:0 0}to{background-position:100% 0}}@keyframes panda-motion-idle{0%,to{transform:translateY(0) scale(1)}48%{transform:translateY(-2px) scale(1.015,.985)}}@keyframes panda-motion-wave{0%,to{transform:rotate(0) scale(1)}35%{transform:translateY(-3px) rotate(2deg) scale(1.02)}70%{transform:rotate(-1.5deg)}}@keyframes panda-motion-correct{0%{transform:translateY(3px) scale(1.04,.94)}48%{transform:translateY(-12px) scale(.98,1.04)}76%{transform:translateY(2px) scale(1.035,.965)}to{transform:none}}@keyframes panda-motion-wrong{0%,to{transform:none}28%{transform:translate(-2px) rotate(-2deg)}58%{transform:translateY(4px) rotate(1.5deg) scale(.99)}}.welcome-panda{width:160px;aspect-ratio:1;opacity:0;pointer-events:none;-webkit-user-select:none;user-select:none;transform-origin:50% 90%;will-change:opacity,transform}.welcome-panda-image{filter:drop-shadow(0 14px 18px rgba(6,182,212,.16))}:root[data-theme=light] .welcome-panda-image{filter:drop-shadow(0 14px 18px rgba(30,64,175,.12))}.welcome-panda.is-greeting{opacity:1;animation:welcome-panda-enter .7s cubic-bezier(.2,.82,.24,1) both}.welcome-panda.is-idle{opacity:1}@keyframes welcome-panda-enter{0%{opacity:0;transform:translate3d(-34px,12px,0) scale(.86) rotate(-5deg)}62%{opacity:1;transform:translate3d(4px,-5px,0) scale(1.03) rotate(2deg)}to{opacity:1;transform:translateZ(0) scale(1) rotate(0)}}.logo-area h1{font-size:3.5rem;font-weight:800;letter-spacing:-1px;margin-top:10px;background:linear-gradient(135deg,var(--text-main) 30%,var(--color-accent));-webkit-background-clip:text;-webkit-text-fill-color:transparent}@media(max-width:480px){.welcome-panda{width:120px}}.logo-area h1 span{background:linear-gradient(135deg,var(--color-primary),var(--color-secondary));-webkit-background-clip:text;-webkit-text-fill-color:transparent}.logo-area .mascot-avatar{font-size:4.5rem;animation:float 4s ease-in-out infinite}.subtitle{color:var(--text-muted);font-size:1.05rem;line-height:1.6}.config-section{display:flex;flex-direction:column;gap:24px;text-align:left}.config-group h3{font-size:.95rem;text-transform:uppercase;letter-spacing:1px;color:var(--color-accent);margin-bottom:12px}.radio-tiles{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.tile-option{position:relative;cursor:pointer}.tile-option input{position:absolute;opacity:0;width:0;height:0}.tile-label{display:block;padding:14px;background-color:var(--bg-card);border:2px solid var(--border-color);border-radius:16px;font-weight:700;text-align:center;transition:transform .1s ease,box-shadow .1s ease,background-color .15s ease,border-color .15s ease,color .15s ease;color:var(--text-muted);box-shadow:0 4px 0 var(--border-color)}.tile-option:active .tile-label{transform:translateY(2px);box-shadow:0 2px 0 var(--border-color)}.tile-option input:checked+.tile-label{border-color:#58cc02;background-color:#e8f5e9;color:#58cc02;box-shadow:0 4px #58cc02}.tile-option:active input:checked+.tile-label{transform:translateY(2px);box-shadow:0 2px #58cc02}.tile-option input:checked+.tile-label:after{content:"✓";position:absolute;top:-6px;right:-6px;width:18px;height:18px;background:#58cc02;color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:700;border:2px solid #fff;box-shadow:0 2px 4px #00000026}.tile-option:hover .tile-label{border-color:color-mix(in srgb,var(--color-primary) 30%,var(--border-color));background-color:var(--bg-tertiary, #f7f7f7)}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}.pulse{animation:pulse-glow 2.5s infinite}@keyframes pulse-glow{0%{box-shadow:0 0 #9355f666}70%{box-shadow:0 0 0 15px #9355f600}to{box-shadow:0 0 #9355f600}}#game-screen{height:100%;overflow:hidden;position:relative}.game-header{display:flex;align-items:center;justify-content:space-between;padding:16px 24px;gap:16px;border-bottom:1px solid var(--border-color)}.infinite-stop-btn{min-height:40px;padding:7px 11px;flex:0 0 auto;border:2px solid var(--color-error-border);border-radius:12px;background:var(--color-error-bg);color:var(--color-error);font:inherit;font-size:.76rem;font-weight:900;cursor:pointer}.infinite-stop-btn:hover{filter:brightness(.97);transform:translateY(-1px)}.progress-bar-container{flex:1;height:16px;background-color:var(--border-color);border-radius:8px;overflow:hidden;position:relative}.progress-bar{height:100%;background:linear-gradient(90deg,var(--color-accent),var(--color-secondary));border-radius:8px;transition:width .4s cubic-bezier(.4,0,.2,1);box-shadow:0 0 10px #06d0f966}.hearts-container{display:flex;align-items:center;gap:12px}.combo-chip{padding:4px 9px;border:1px solid color-mix(in srgb,#ff9600 55%,transparent);border-radius:20px;background:color-mix(in srgb,#ff9600 14%,transparent);color:#ff9600;font-size:.85rem;font-weight:800;white-space:nowrap}.combo-chip.pop{animation:combo-pop .42s cubic-bezier(.2,1.6,.4,1)}@media(max-width:480px){.game-header{padding:12px 14px;gap:8px}.game-theme-toggle{flex-shrink:0}.progress-bar-container{min-width:40px}.hearts-container{gap:6px}.combo-chip{padding:3px 6px;font-size:.78rem}.hearts-display{font-size:1rem;gap:1px}}@keyframes combo-pop{0%{transform:scale(.6)}60%{transform:scale(1.18)}to{transform:scale(1)}}.score-badge{white-space:nowrap;background-color:#06d0f91a;border:1px solid hsla(190,95%,50%,.3);color:var(--color-accent);padding:4px 10px;border-radius:20px;font-size:.85rem;font-weight:700}.hearts-display{display:flex;gap:4px;font-size:1.25rem}.heart{opacity:.3;transform:scale(.85);transition:all var(--transition-fast)}.heart.active{opacity:1;transform:scale(1);animation:heart-beat 1.2s infinite alternate}@keyframes heart-beat{0%{transform:scale(1)}to{transform:scale(1.1)}}.heart.shake{animation:shake .5s ease-in-out}.game-content{flex:1;display:flex;flex-direction:column;padding:24px 20px;gap:20px;max-width:550px;margin:0 auto;width:100%;overflow-y:auto}.prompt-bubble-container{display:flex;gap:16px;align-items:flex-start;flex-shrink:0}.mascot-small{flex:0 0 auto;width:44px;height:53px;font-size:2.5rem;transform-origin:50% 90%}.mascot-small .panda-actor__motion{width:44px;height:44px;margin-top:4px;overflow:visible}.mascot-small :is(.panda-actor__sprite,.panda-actor__fallback){width:44px;height:44px;filter:drop-shadow(0 4px 8px rgba(0,0,0,.18))}.mascot-small.is-question-pop{animation:panda-question-pop .34s cubic-bezier(.2,.82,.3,1) both}@keyframes panda-question-pop{0%{opacity:.55;transform:translateY(5px) scale(.92)}65%{opacity:1;transform:translateY(-2px) scale(1.04)}to{opacity:1;transform:none}}.bubble-meta{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px;margin-bottom:6px}.bubble-meta:has(.round-meta:empty):has(.mode-chip[hidden]){display:none}.mode-chip{padding:2px 9px;border:1px solid color-mix(in srgb,var(--color-primary) 45%,transparent);border-radius:999px;background:color-mix(in srgb,var(--color-primary) 14%,transparent);color:var(--color-primary);font-size:.74rem;font-weight:800}.round-meta{color:var(--text-muted);font-size:.74rem;font-weight:700;letter-spacing:.02em}.speech-bubble{position:relative;background-color:var(--bg-card);border:2px solid var(--border-color);padding:16px 20px;border-radius:var(--radius-md);flex:1;box-shadow:0 4px 12px #00000026}.speech-bubble:before{content:"";position:absolute;left:-10px;top:18px;width:0;height:0;border-top:10px solid transparent;border-bottom:10px solid transparent;border-right:10px solid var(--border-color)}.speech-bubble:after{content:"";position:absolute;left:-7px;top:18px;width:0;height:0;border-top:10px solid transparent;border-bottom:10px solid transparent;border-right:10px solid hsl(222,47%,15%)}:root[data-theme=light] .speech-bubble:after{border-right-color:#fcfcfd}.instruction{color:var(--text-muted);font-size:.85rem;text-transform:uppercase;letter-spacing:.5px;margin-bottom:4px;font-weight:600}#vietnamese-sentence{font-size:1.35rem;font-weight:700;line-height:1.4}.workspace{min-height:100px;display:flex;flex-direction:column;justify-content:center;flex-shrink:0}.sentence-slots{display:flex;flex-wrap:wrap;gap:10px;padding:16px;border-bottom:2px dashed var(--border-color);min-height:70px;align-items:center}.sentence-slots:focus{outline:none;border-bottom-color:var(--color-primary)}.single-word-answer-slots{justify-content:center;min-height:156px;padding:8px 0 20px}.single-word-answer-stage{display:grid;flex:0 0 100%;min-height:128px;place-items:center}.single-word-answer-placeholder{visibility:hidden;width:min(100%,480px);min-height:128px}.single-word-answer-slots .builder-replay-btn{flex:0 0 auto}.single-word-answer{position:relative;isolation:isolate;display:grid;width:min(100%,480px);min-height:128px;align-content:center;justify-items:center;gap:7px;overflow:hidden;padding:18px 24px 16px;color:var(--text-main);border:1px solid color-mix(in srgb,var(--color-primary) 72%,var(--border-color));border-bottom:5px solid color-mix(in srgb,var(--color-primary) 70%,var(--border-color));border-radius:22px;background:radial-gradient(circle at 12% 0%,color-mix(in srgb,var(--color-secondary) 27%,transparent),transparent 48%),linear-gradient(135deg,color-mix(in srgb,var(--color-primary) 18%,var(--bg-card)),color-mix(in srgb,var(--color-secondary) 9%,var(--bg-card)));box-shadow:0 12px 28px color-mix(in srgb,var(--color-primary) 16%,transparent),inset 0 1px color-mix(in srgb,white 16%,transparent);cursor:pointer;font:inherit;text-align:center;transition:border-color var(--transition-fast),box-shadow var(--transition-fast),filter var(--transition-fast),background var(--transition-fast)}.single-word-answer:after{content:"";position:absolute;z-index:-1;right:-34px;bottom:-48px;width:150px;height:150px;border-radius:50%;background:color-mix(in srgb,var(--color-primary) 20%,transparent);filter:blur(2px)}.single-word-answer-kicker{color:color-mix(in srgb,var(--text-muted) 86%,white);font-size:.67rem;font-weight:900;letter-spacing:.13em;line-height:1}.single-word-answer-text{max-width:100%;color:var(--text-main);font-size:clamp(1.55rem,5vw,2.2rem);font-weight:900;letter-spacing:.01em;line-height:1.08;overflow-wrap:anywhere}.single-word-answer-hint{color:var(--text-muted);font-size:.72rem;font-weight:700;line-height:1.25}.single-word-answer:hover{border-color:var(--color-secondary);background:radial-gradient(circle at 12% 0%,color-mix(in srgb,var(--color-secondary) 37%,transparent),transparent 48%),linear-gradient(135deg,color-mix(in srgb,var(--color-primary) 24%,var(--bg-card)),color-mix(in srgb,var(--color-secondary) 14%,var(--bg-card)));box-shadow:0 15px 32px color-mix(in srgb,var(--color-primary) 24%,transparent),inset 0 1px color-mix(in srgb,white 20%,transparent)}.single-word-answer:focus-visible{outline:3px solid color-mix(in srgb,var(--color-accent) 62%,transparent);outline-offset:4px}.single-word-answer:active{filter:brightness(.95)}.word-tile{background-color:var(--bg-card);border:2px solid var(--border-color);border-bottom-width:4px;color:var(--text-main);padding:10px 18px;font-size:1.05rem;font-weight:600;border-radius:var(--radius-sm);cursor:pointer;-webkit-user-select:none;user-select:none;transition:transform var(--transition-fast),border-color var(--transition-fast),background-color var(--transition-fast);display:inline-block;box-shadow:0 2px 4px #0003}.word-tile:hover{border-color:var(--text-muted);box-shadow:0 4px 8px #0000003d}.word-tile:active{transform:translateY(1px);border-bottom-width:2px;margin-top:2px}.word-tile.used{opacity:.15;cursor:default;pointer-events:none;transform:none!important;border-bottom-width:2px}.options-container{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;min-height:100px;align-content:flex-start;flex-shrink:0}.fill-blank-sentence{font-size:1.5rem;font-weight:600;text-align:center;line-height:1.8;letter-spacing:.5px}.blank-slot{display:inline-block;min-width:90px;border-bottom:3px dashed var(--color-primary);margin:0 10px;text-align:center;color:var(--color-accent);padding-bottom:2px;font-weight:700}.blank-slot.filled{border-bottom-style:solid;color:var(--color-primary);animation:scale-up .2s ease-out}.choice-list{display:flex;flex-direction:column;gap:12px;width:100%}.choice-card{display:flex;align-items:center;background-color:var(--bg-card);border:2px solid var(--border-color);border-bottom-width:4px;border-radius:var(--radius-md);padding:16px 20px;cursor:pointer;transition:all var(--transition-fast);text-align:left;-webkit-user-select:none;user-select:none;color:var(--text-main);font-family:inherit}.choice-card:hover{border-color:var(--text-muted);box-shadow:0 4px 8px #0000002e}.choice-card:active{transform:translateY(1px);border-bottom-width:2px}.choice-card.selected{border-color:var(--color-primary);background-color:#9355f614;box-shadow:0 0 15px #9355f61a}.choice-number{display:flex;align-items:center;justify-content:center;width:28px;height:28px;border:2px solid var(--border-color);border-radius:8px;margin-right:16px;font-size:.85rem;font-weight:700;color:var(--text-muted);transition:all var(--transition-fast)}.choice-card.selected .choice-number{border-color:var(--color-primary);background-color:var(--color-primary);color:#fff}.choice-text{font-size:1.1rem;font-weight:600;flex:1}.validation-drawer{position:relative;background-color:var(--bg-validation-drawer);border-top:2px solid var(--border-color);padding:18px 24px calc(18px + env(safe-area-inset-bottom));transition:all var(--transition-normal);z-index:100;width:100%;overflow:visible}.drawer-inner{max-width:610px;margin:0 auto;display:flex;flex-direction:column;gap:16px}.drawer-actions{display:flex;justify-content:space-between;align-items:center}.feedback-message{display:none;min-width:0;font-size:1rem;font-weight:700;align-items:center;gap:14px;animation:feedback-rise .38s cubic-bezier(.2,.9,.25,1.2)}.feedback-message svg{width:28px;height:28px;fill:currentColor}.feedback-details{display:flex;flex-direction:column;gap:8px;min-width:0;flex:1}.feedback-heading{display:flex;align-items:center;flex-wrap:wrap;gap:8px}.feedback-title{font-size:1.15rem;font-weight:900;line-height:1.2}.feedback-pair{color:inherit;font-size:1.08rem;font-weight:850;line-height:1.4;overflow-wrap:anywhere}.feedback-symbol{display:grid;flex:0 0 46px;width:46px;height:46px;place-items:center;border:2px solid currentColor;border-radius:50%;background:color-mix(in srgb,currentColor 12%,var(--bg-card));box-shadow:0 8px 20px color-mix(in srgb,currentColor 20%,transparent);font-size:1.45rem;font-weight:950;animation:feedback-symbol-pop .48s cubic-bezier(.2,1.55,.4,1)}.feedback-reward{display:inline-flex;align-items:center;min-height:25px;padding:3px 9px;border:1px solid color-mix(in srgb,currentColor 48%,transparent);border-radius:999px;background:color-mix(in srgb,currentColor 12%,transparent);font-size:.76rem;font-weight:950;letter-spacing:.04em;animation:feedback-reward-pop .52s .08s cubic-bezier(.2,1.5,.4,1) both}.feedback-answer,.feedback-explanation{display:flex;flex-direction:column;align-items:flex-start;gap:2px}.feedback-explanation{margin-top:1px;padding:8px 10px;border:1px solid color-mix(in srgb,currentColor 26%,transparent);border-radius:10px;background:color-mix(in srgb,currentColor 7%,var(--bg-card))}.feedback-explanation p{color:var(--text-main);font-size:.9rem;font-weight:650;line-height:1.42;overflow-wrap:anywhere;white-space:pre-wrap}.feedback-label{font-size:.68rem;text-transform:uppercase;font-weight:900;letter-spacing:.08em;opacity:.72}.feedback-diff-text{font-size:1rem;font-weight:800;letter-spacing:.02em;overflow-wrap:anywhere}.feedback-diff-text .diff-ok{color:var(--text-main)}.feedback-diff-text .diff-extra{color:var(--color-error);text-decoration:line-through 2px}.feedback-diff-text .diff-missing{color:var(--color-success);text-decoration:underline 2px;text-underline-offset:3px}.feedback-speak-btn{display:inline-grid;place-items:center;width:32px;height:32px;margin-left:auto;border:1px solid color-mix(in srgb,currentColor 40%,transparent);border-radius:50%;background:color-mix(in srgb,currentColor 10%,var(--bg-card));color:inherit;font-size:.95rem;cursor:pointer;transition:transform var(--transition-fast)}.feedback-speak-btn:hover{transform:scale(1.08)}.feedback-speak-btn:focus-visible{outline:2px solid currentColor;outline-offset:2px}.validation-drawer.correct{background:radial-gradient(circle at 18% 0%,color-mix(in srgb,var(--color-success) 20%,transparent),transparent 42%),var(--color-success-bg);border-top-color:var(--color-success-border);animation:drawer-feedback-in .34s ease-out}.validation-drawer.correct .feedback-message{display:flex;color:var(--color-success)}.validation-drawer.correct #check-btn{background:var(--color-success)!important;box-shadow:0 8px 24px color-mix(in srgb,var(--color-success) 38%,transparent)}.validation-drawer.incorrect{background:radial-gradient(circle at 18% 0%,color-mix(in srgb,var(--color-error) 18%,transparent),transparent 42%),var(--color-error-bg);border-top-color:var(--color-error-border);animation:drawer-feedback-in .34s ease-out}.validation-drawer.incorrect .feedback-message{display:flex;color:var(--color-error)}.validation-drawer.incorrect #check-btn{background:var(--color-error)!important;box-shadow:0 8px 24px color-mix(in srgb,var(--color-error) 35%,transparent)}.validation-drawer.correct .drawer-inner,.validation-drawer.incorrect .drawer-inner{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:18px}.validation-drawer.correct .drawer-actions,.validation-drawer.incorrect .drawer-actions{justify-content:flex-end}.validation-drawer.correct #check-btn,.validation-drawer.incorrect #check-btn{min-width:142px;min-height:48px}@keyframes drawer-feedback-in{0%{opacity:.65;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@keyframes feedback-rise{0%{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}@keyframes feedback-symbol-pop{0%{opacity:0;transform:scale(.45) rotate(-12deg)}70%{opacity:1;transform:scale(1.12) rotate(3deg)}to{transform:scale(1) rotate(0)}}@keyframes feedback-reward-pop{0%{opacity:0;transform:translateY(8px) scale(.7)}to{opacity:1;transform:translateY(0) scale(1)}}@media(max-width:560px){.validation-drawer{padding:14px 20px calc(14px + env(safe-area-inset-bottom))}.validation-drawer.correct .drawer-inner,.validation-drawer.incorrect .drawer-inner{display:flex;align-items:stretch;gap:12px}.validation-drawer.correct .drawer-actions,.validation-drawer.incorrect .drawer-actions,.validation-drawer.correct #check-btn,.validation-drawer.incorrect #check-btn{width:100%}.feedback-message{align-items:flex-start;gap:10px}.feedback-symbol{flex-basis:38px;width:38px;height:38px;font-size:1.18rem}.feedback-title{font-size:1.02rem}.feedback-pair{font-size:.93rem}}.keyboard-help{text-align:center;font-size:.75rem;color:var(--text-muted);pointer-events:none;padding:8px 0;width:100%;display:none}@media(min-width:650px){.keyboard-help{display:block}}#result-screen{align-items:center;padding:40px 24px;overflow-y:auto!important;overflow-x:hidden}.result-card{width:100%;max-width:500px;text-align:center;display:flex;flex-direction:column;gap:24px;margin:20px 0}.trophy-icon{font-size:5rem;animation:bounce-rotate 1.5s ease infinite alternate}.result-subtitle{color:var(--text-muted);margin-top:-10px}.result-actions{display:flex;flex-wrap:wrap;justify-content:center;gap:12px}.result-actions>button{flex:1 1 180px}.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(88px,1fr));gap:12px;margin:10px 0}.stat-card{background-color:var(--bg-card);border:2px solid var(--border-color);padding:16px 8px;border-radius:var(--radius-md);display:flex;flex-direction:column;gap:6px}.stat-value{font-size:1.5rem;font-weight:800;color:var(--color-accent)}.stat-label{font-size:.8rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px;font-weight:600}.review-section{text-align:left;display:flex;flex-direction:column;max-height:250px;overflow-y:auto;border:2px solid var(--border-color);border-radius:20px;padding:20px;background-color:var(--bg-card);box-shadow:0 4px 0 var(--border-color);scrollbar-width:thin;scrollbar-color:var(--border-color) transparent}.review-section h3{margin:0 0 16px;font-size:1.05rem;font-weight:800;text-transform:uppercase;letter-spacing:.05em;color:var(--text-main);display:flex;align-items:center;gap:8px}.review-section::-webkit-scrollbar{width:6px}.review-section::-webkit-scrollbar-thumb{background-color:var(--border-color);border-radius:3px}.review-list{display:flex;flex-direction:column}.review-item{display:flex;gap:14px;font-size:.92rem;line-height:1.4;padding:12px 0;border-bottom:2px solid var(--border-color)}.review-item:first-child{padding-top:0}.review-item:last-child{border-bottom:none;padding-bottom:0}.review-status-icon{font-size:1.2rem;flex-shrink:0;display:flex;align-items:flex-start;padding-top:2px}.review-details{flex:1}.review-vi{font-weight:800;color:var(--text-main);margin-bottom:4px;font-size:.95rem}.review-eng{font-size:.88rem;font-weight:600;color:var(--text-muted)}.review-eng.wrong{color:#ea2b2b;text-decoration:line-through;margin-right:8px}.review-correct{color:#58cc02;font-weight:700;font-size:.88rem}@keyframes shake{0%,to{transform:translate(0)}20%,60%{transform:translate(-6px)}40%,80%{transform:translate(6px)}}.shake-active{animation:shake .4s ease-in-out}@keyframes bounce-rotate{0%{transform:scale(1) rotate(0)}to{transform:scale(1.1) rotate(10deg)}}@keyframes scale-up{0%{transform:scale(.9);opacity:0}to{transform:scale(1);opacity:1}}@keyframes slide-up-subtle{0%{transform:translateY(15px);opacity:0}to{transform:translateY(0);opacity:1}}.confetti{position:absolute;width:10px;height:10px;border-radius:50%;pointer-events:none;z-index:999;animation:confetti-fall 3s ease-out forwards}@keyframes confetti-fall{0%{transform:translateY(-50px) rotate(0);opacity:1}to{transform:translateY(800px) rotate(720deg);opacity:0}}#welcome-screen,#result-screen,.game-content{scrollbar-width:thin;scrollbar-color:var(--border-color) transparent}#welcome-screen::-webkit-scrollbar,#result-screen::-webkit-scrollbar,.game-content::-webkit-scrollbar{width:6px}#welcome-screen::-webkit-scrollbar-thumb,#result-screen::-webkit-scrollbar-thumb,.game-content::-webkit-scrollbar-thumb{background-color:var(--border-color);border-radius:3px}.matching-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;width:100%;margin-top:10px}.matching-column{display:flex;flex-direction:column;gap:12px}.matching-card{display:flex;align-items:center;justify-content:center;background-color:var(--bg-card);border:2px solid var(--border-color);border-bottom-width:4px;border-radius:var(--radius-md);padding:16px 12px;cursor:pointer;transition:all var(--transition-fast);text-align:center;-webkit-user-select:none;user-select:none;color:var(--text-main);font-family:inherit;font-size:1rem;font-weight:600;min-height:70px}.matching-card:hover:not(.matched){border-color:var(--text-muted);box-shadow:0 4px 8px #0000002e}.matching-card:active:not(.matched){transform:translateY(1px);border-bottom-width:2px}.matching-card.selected{border-color:var(--color-primary);background-color:#9355f61f;box-shadow:0 0 15px #9355f626}.matching-card.matched{border-color:var(--color-success-border);background-color:var(--color-success-bg);color:var(--color-success);opacity:.4;cursor:default;pointer-events:none;border-bottom-width:2px;transform:none!important}.matching-card.wrong{border-color:var(--color-error-border);background-color:var(--color-error-bg);color:var(--color-error);animation:shake .4s ease-in-out}.listen-match-audio{font-size:1.8rem;line-height:1}.listen-match-audio.playing{border-color:var(--color-primary);box-shadow:0 0 15px #9355f640;animation:listenMatchPulse 1s ease-in-out infinite}.vocab-image-block{display:flex;flex-direction:column;align-items:center;gap:10px;width:100%;min-width:0}.vocab-image{display:flex;flex-direction:column;align-items:center;gap:8px;margin:0;max-width:100%}.vocab-image-img{display:block;width:auto;max-width:min(100%,420px);max-height:min(280px,42vh);object-fit:contain;border-radius:16px;border:1px solid var(--border-color);background:var(--bg-tertiary)}.vocab-image-fallback{display:flex;flex-wrap:wrap;justify-content:center;align-items:baseline;gap:8px;margin:0;max-width:100%;color:var(--text-muted);font-size:.95rem;text-align:center;overflow-wrap:anywhere}.vocab-image-caption{max-width:100%;color:var(--text-main);font-size:1.2rem;font-weight:700;text-align:center;overflow-wrap:anywhere}.image-option-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;width:100%;min-width:0}.image-option{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;min-width:0;min-height:120px;padding:8px;border:2px solid var(--border-color);border-bottom-width:4px;border-radius:16px;background:var(--bg-card);color:var(--text-main);font:inherit;cursor:pointer}.image-option.selected{border-color:var(--color-primary);background:#9355f61f}.image-option .choice-number{margin-right:0}.image-option.selected .choice-number{border-color:var(--color-primary);background-color:var(--color-primary);color:#fff}.image-option img,.matching-image-card img{width:100%;max-width:100%;max-height:min(140px,28vh);object-fit:contain;pointer-events:none}.image-match-grid{align-items:stretch}.image-match-grid .matching-card{height:auto;min-height:112px;overflow-wrap:anywhere}.image-match-grid .matching-card:not(.matching-image-card){flex-direction:column;gap:6px;padding:12px 10px}.image-match-grid .matching-card.matched{opacity:.85}.image-match-grid .matching-word-en{font-size:1.05rem;font-weight:700;line-height:1.25}.image-match-grid .matching-word-vi{font-size:.85rem;font-weight:600;color:var(--color-success);line-height:1.2;animation:matchViAppear .25s ease-out}@keyframes matchViAppear{0%{opacity:0;transform:translateY(3px)}to{opacity:1;transform:translateY(0)}}.matching-image-card{flex-direction:column;gap:6px;padding:8px;min-height:112px}.image-option-caption,.image-option-fallback{font-size:.85rem;font-weight:700;text-align:center;overflow-wrap:anywhere}.image-option-fallback{color:var(--text-muted);font-weight:600}@media(max-width:640px){.vocab-image-img{max-height:min(220px,36vh)}.image-option{min-height:96px}.image-option img,.matching-image-card img{max-height:min(110px,22vh)}}@keyframes listenMatchPulse{0%,to{transform:scale(1)}50%{transform:scale(1.04)}}.truefalse-pair{display:flex;flex-direction:column;align-items:center;gap:10px;padding:28px 22px}.truefalse-english{font-size:1.6rem;font-weight:800;color:var(--text-main);text-align:center}.truefalse-divider{width:48px;height:2px;background:var(--border-color);border-radius:2px;opacity:.6}.truefalse-meaning{font-size:1.35rem;font-weight:700;color:var(--color-primary);text-align:center}.kicker-label{font-size:.7rem;letter-spacing:.08em;text-transform:uppercase;color:var(--text-muted);font-weight:800;margin:0}.typing-container{display:flex;width:100%;padding:10px 0;flex-shrink:0}.typing-input{width:100%;background-color:var(--bg-card);border:2px solid var(--border-color);border-radius:var(--radius-md);padding:16px 20px;color:var(--text-main);font-family:inherit;font-size:1.25rem;font-weight:600;outline:none;transition:border-color var(--transition-fast),box-shadow var(--transition-fast);box-shadow:var(--shadow-card)}.typing-input:focus{border-color:var(--color-primary);box-shadow:0 0 15px #9355f626}.typing-input::placeholder{color:var(--text-muted);opacity:.6}.listening-workspace{display:flex;flex-direction:column;align-items:center;width:100%;gap:12px;margin-bottom:16px;flex-shrink:0}.speaker-container{display:flex;justify-content:center;align-items:center;height:90px}.speaker-btn{width:76px;height:76px;border-radius:50%;background-color:#9355f61f;border:2px solid var(--color-primary);color:var(--color-primary);display:flex;justify-content:center;align-items:center;cursor:pointer;outline:none;transition:all var(--transition-fast);box-shadow:0 0 10px #9355f61a;position:relative}.speaker-btn:hover{transform:scale(1.06);background-color:#9355f638;box-shadow:0 0 20px #9355f64d}.speaker-btn:active{transform:scale(.95)}.speaker-btn svg{width:32px;height:32px;fill:currentColor}.speaker-btn:after{content:"";position:absolute;inset:-2px;border-radius:50%;border:2px solid var(--color-primary);opacity:0;pointer-events:none}.speaker-btn.playing:after{animation:speakerPulse 1.2s cubic-bezier(.24,0,.38,1) infinite}@keyframes speakerPulse{0%{transform:scale(1);opacity:.8}to{transform:scale(1.4);opacity:0}}.hint-toggle-btn{background:none;border:none;color:var(--text-muted);font-family:inherit;font-size:.9rem;font-weight:600;text-decoration:underline;cursor:pointer;transition:color var(--transition-fast);padding:4px 8px}.hint-toggle-btn:hover{color:var(--color-primary)}.hint-text{font-size:1.1rem;color:var(--color-primary);font-weight:600;text-align:center;min-height:24px;opacity:0;transition:opacity .3s ease;background-color:#9355f60d;padding:6px 16px;border-radius:var(--radius-sm);border:1px dashed hsla(263,90%,65%,.2)}.hint-text:not(.visible){display:none}.hint-text.visible{display:block;opacity:1}.listening-workspace .hint-text{max-width:100%;overflow-wrap:anywhere}.listen-image-hint:not(.visible){display:none}.listen-image-hint.visible{display:block}:root[data-theme=light] body{background-image:radial-gradient(at 0% 0%,hsla(263,70%,55%,.04) 0px,transparent 50%),radial-gradient(at 100% 100%,hsla(190,85%,40%,.04) 0px,transparent 50%)}body,.app-container,.screen,.welcome-card,.result-card,.speech-bubble,.choice-card,.word-tile,.matching-card,.typing-input,.primary-btn,.secondary-btn,.game-header,.validation-drawer,.stat-card,.review-item{transition:background-color var(--transition-normal),border-color var(--transition-normal),color var(--transition-normal),box-shadow var(--transition-normal)}.theme-toggle-btn{display:inline-flex;align-items:center;justify-content:space-between;padding:6px;border-radius:20px;background:var(--bg-card);border:2px solid var(--border-color);box-shadow:0 3px 0 var(--border-color);cursor:pointer;position:relative;width:76px;height:38px;box-sizing:border-box;overflow:hidden;-webkit-user-select:none;user-select:none;z-index:100;transition:transform var(--transition-fast),background-color var(--transition-fast),border-color var(--transition-fast)}.theme-toggle-btn:hover{transform:scale(1.05)}.theme-toggle-btn:active{transform:scale(.98)}.toggle-sun{position:absolute;left:8px;top:50%;transform:translateY(-50%);z-index:1;font-size:.95rem;pointer-events:none;line-height:1}.toggle-moon{position:absolute;right:8px;top:50%;transform:translateY(-50%);z-index:1;font-size:.95rem;pointer-events:none;line-height:1}.duo-toggle-knob{width:22px;height:22px;border-radius:50%;display:inline-block;transition:transform .2s cubic-bezier(.34,1.56,.64,1);box-shadow:0 2px 4px #00000026;position:absolute;top:6px;left:6px;z-index:2;flex-shrink:0}.duo-toggle-knob.light{transform:translate(0);background:#ff9600}.duo-toggle-knob.dark{transform:translate(38px);background:var(--color-primary)}:root[data-theme=light] .score-badge{background-color:#0fa0bd14;border-color:#0fa0bd40;color:#0d8ca5}:root[data-theme=light] .mascot-avatar{background-color:#7a3cdd14}:root[data-theme=light] .primary-btn.disabled,:root[data-theme=light] .primary-btn:disabled{background:#c2c9d6!important;color:#818898!important}:root[data-theme=light] .secondary-btn:hover{background-color:#bdc7db66;border-color:var(--color-primary);color:var(--color-primary)}#user-profile-area{display:flex;align-items:center;gap:10px}.google-login-btn{display:inline-flex;align-items:center;gap:8px;background:var(--bg-card);color:var(--text-main);border:1px solid var(--border-color);padding:8px 16px;border-radius:50px;font-family:var(--font-family);font-size:.85rem;font-weight:600;cursor:pointer;text-decoration:none;transition:background var(--transition-fast),border-color var(--transition-fast)}.google-login-btn:hover{background:var(--bg-main);border-color:var(--color-primary)}.google-login-btn svg{flex-shrink:0}.welcome-user-chip{display:flex;align-items:center;gap:8px;background:var(--bg-card);border:1px solid var(--border-color);padding:4px 12px 4px 4px;border-radius:50px;text-decoration:none;color:var(--text-main);transition:border-color var(--transition-fast)}.welcome-user-chip:hover{border-color:var(--color-primary)}.welcome-user-chip img{width:28px;height:28px;border-radius:50%;object-fit:cover}.welcome-user-chip .username{font-size:.85rem;font-weight:600;max-width:100px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.welcome-user-chip .manage-link{font-size:.75rem;color:var(--color-primary);font-weight:700;margin-left:4px}.deck-dropdown{width:100%;padding:12px 16px;border-radius:var(--radius-md);border:2px solid var(--border-color);background-color:var(--bg-card);color:var(--text-main);font-family:var(--font-family);font-size:.95rem;font-weight:500;cursor:pointer;outline:none;transition:border-color var(--transition-fast)}.deck-dropdown:focus{border-color:var(--color-primary)}.auth-error-alert{padding:12px 16px;background:var(--color-error-bg);border:1px solid var(--color-error-border);color:var(--color-error);border-radius:var(--radius-md);font-size:.88rem;margin-bottom:16px;text-align:left}.top-bar-right{display:flex;align-items:center;gap:12px}.streak-badge{display:inline-flex;align-items:center;gap:8px;padding:8px 16px;background:var(--bg-card);border:2px solid #ff9600;color:#ff9600;border-radius:99px;font-weight:800;font-size:.85rem;box-shadow:0 3px #ff9600;transition:transform .1s ease;white-space:nowrap;cursor:pointer;-webkit-user-select:none;user-select:none}.streak-badge:hover{transform:scale(1.05)}.streak-badge:active{transform:translateY(2px);box-shadow:0 1px #ff9600}.heatmap-overlay{position:fixed;inset:0;background:#0f172ad9;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;z-index:10000;animation:heatmap-overlay-in .3s ease;padding:16px}@keyframes heatmap-overlay-in{0%{opacity:0}to{opacity:1}}.heatmap-overlay.fade-out{animation:heatmap-overlay-out .3s ease forwards}@keyframes heatmap-overlay-out{0%{opacity:1}to{opacity:0}}.heatmap-modal{background:var(--bg-card);border:2px solid var(--border-color);border-radius:24px;box-shadow:0 8px 0 var(--border-color),0 20px 50px #00000080;width:520px;max-width:calc(100vw - 32px);max-height:85vh;display:flex;flex-direction:column;overflow:hidden;animation:leaderboard-slideup .3s cubic-bezier(.34,1.56,.64,1);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}.heatmap-header{display:flex;align-items:center;justify-content:space-between;padding:20px 24px;border-bottom:2px solid var(--border-color);flex-shrink:0}.heatmap-title{font-size:1.25rem;font-weight:800;color:var(--text-main);margin:0;display:flex;align-items:center;gap:8px}.heatmap-close-btn{background:none;border:none;color:var(--text-muted);font-size:1.15rem;font-weight:700;cursor:pointer;transition:color .15s;padding:4px;display:flex;align-items:center;justify-content:center}.heatmap-close-btn:hover{color:var(--color-error)}.heatmap-content{display:flex;flex-direction:column;flex:1;overflow-y:auto;padding:20px 24px;gap:20px;scrollbar-width:thin;scrollbar-color:var(--border-color) transparent}.heatmap-content::-webkit-scrollbar{width:6px}.heatmap-content::-webkit-scrollbar-thumb{background:var(--border-color);border-radius:3px}.heatmap-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.heatmap-stat{background:#070a1314;border:2px solid var(--border-color);border-radius:12px;padding:12px;text-align:center}.heatmap-stat-value{font-size:1.5rem;font-weight:800;color:#ff9600;margin-bottom:4px}.heatmap-stat-label{font-size:.75rem;font-weight:700;color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em}.heatmap-grid-wrapper{display:flex;flex-direction:column;gap:8px}.heatmap-months{display:grid;grid-template-columns:24px repeat(16,1fr);gap:4px;padding:0 0 0 24px;font-size:.65rem;font-weight:700;color:var(--text-muted)}.heatmap-month-label{text-align:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.heatmap-body{display:flex;gap:4px}.heatmap-weekdays{display:flex;flex-direction:column;gap:4px;width:20px;font-size:.6rem;font-weight:700;color:var(--text-muted)}.heatmap-weekday{height:16px;display:flex;align-items:center;justify-content:flex-end}.heatmap-grid{display:grid;grid-template-columns:repeat(17,1fr);grid-template-rows:repeat(7,1fr);gap:4px;flex:1}.heatmap-cell{aspect-ratio:1;border-radius:3px;background:var(--bg-main);border:1px solid var(--border-color);transition:transform .1s,box-shadow .1s;cursor:pointer;position:relative}.heatmap-cell:hover{transform:scale(1.2);box-shadow:0 0 0 2px #ff9600;z-index:1}.heatmap-cell.level-0{background:var(--bg-main)}.heatmap-cell.level-1{background:#ff960040;border-color:#ff960060}.heatmap-cell.level-2{background:#ff960080;border-color:#ff9600a0}.heatmap-cell.level-3{background:#ff9600c0;border-color:#ff9600e0}.heatmap-cell.level-4{background:#ff9600;border-color:#ff9600}.heatmap-cell[data-tooltip]:hover:after{content:attr(data-tooltip);position:absolute;bottom:calc(100% + 6px);left:50%;transform:translate(-50%);background:var(--bg-card);border:1px solid var(--border-color);border-radius:6px;padding:6px 10px;font-size:.7rem;font-weight:700;color:var(--text-main);white-space:nowrap;pointer-events:none;z-index:10;box-shadow:0 4px 12px #0000004d}.heatmap-legend{display:flex;align-items:center;gap:8px;justify-content:flex-end;font-size:.7rem;font-weight:700;color:var(--text-muted)}.heatmap-legend-cells{display:flex;gap:3px}.heatmap-legend-cell{width:12px;height:12px;border-radius:2px;border:1px solid var(--border-color)}.heatmap-empty{text-align:center;padding:30px;color:var(--text-muted);font-weight:700}.duo-profile-chip{display:flex;align-items:center;gap:7px;background:var(--bg-card);border:2px solid var(--border-color);padding:4px 9px 4px 5px;border-radius:99px;box-shadow:0 2px 4px #00000005;color:var(--text-main);cursor:pointer;font:inherit;text-align:left}.duo-profile-chip:hover,.duo-profile-chip[aria-expanded=true]{border-color:var(--color-primary)}.duo-profile-chip:focus-visible,.profile-menu-link:focus-visible{outline:3px solid color-mix(in srgb,var(--color-accent) 65%,transparent);outline-offset:3px}.duo-profile-chip img.user-avatar{width:28px;height:28px;border-radius:50%;object-fit:cover;border:1.5px solid #fff;box-shadow:0 1px 3px #0000001a}.duo-profile-chip .user-name{font-size:.85rem;font-weight:800;color:var(--text-main);max-width:110px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.user-profile-menu{position:relative}.profile-menu-chevron{color:var(--text-muted);font-size:.9rem;font-weight:900;line-height:1;transition:transform var(--transition-fast)}.duo-profile-chip[aria-expanded=true] .profile-menu-chevron{transform:rotate(180deg)}.user-profile-menu-panel{position:absolute;top:calc(100% + 8px);left:0;z-index:30;display:grid;min-width:154px;gap:4px;padding:6px;border:2px solid var(--border-color);border-radius:14px;background:var(--bg-card);box-shadow:var(--shadow-card)}.profile-menu-link{display:block;padding:9px 10px;border-radius:9px;color:var(--text-main);font-size:.82rem;font-weight:800;text-decoration:none}.profile-menu-link:hover{color:var(--color-primary);background:color-mix(in srgb,var(--color-primary) 10%,var(--bg-card))}.config-group h3{color:var(--color-primary)!important;font-weight:800!important;font-size:.88rem!important;letter-spacing:.05em!important;margin-bottom:12px!important;display:flex!important;align-items:center!important;gap:8px!important;text-transform:uppercase!important}.tile-option input:checked+.tile-label{border-color:var(--color-primary)!important;background-color:color-mix(in srgb,var(--color-primary) 10%,var(--bg-card))!important;color:var(--color-primary)!important;box-shadow:0 4px 0 var(--color-primary)!important}.tile-option input:checked+.tile-label:after{background:var(--color-primary)!important}.deck-dropdown{border-radius:16px!important;border:2px solid var(--border-color)!important;box-shadow:0 3px 0 var(--border-color)!important;font-weight:700!important;padding:12px 20px!important}#start-btn{background:var(--color-primary)!important;color:#fff!important;border:none!important;border-bottom:5px solid color-mix(in srgb,var(--color-primary) 70%,black)!important;box-shadow:none!important;border-radius:16px!important;padding:14px 32px!important;font-weight:800!important;font-size:1.1rem!important;letter-spacing:.05em!important;width:100%!important;display:flex!important;align-items:center!important;justify-content:center!important;gap:8px!important;transition:transform .1s ease,border-bottom-width .1s ease!important;text-shadow:0 1px 2px rgba(0,0,0,.1);box-sizing:border-box;margin-top:10px}#start-btn.hidden{display:none!important}#start-btn:active{transform:translateY(3px)!important;border-bottom-width:2px!important}.mascot-illustration{margin-bottom:12px;display:flex;justify-content:center}body:after{content:"";position:fixed;bottom:0;left:0;right:0;height:120px;background-image:radial-gradient(ellipse at 30% 120%,#78c800 50%,transparent 55%),radial-gradient(ellipse at 70% 120%,#58a700 55%,transparent 60%);background-size:100% 120px;z-index:-1;pointer-events:none;opacity:.45}:root[data-theme=dark] body:after{opacity:.15}@media(max-width:480px){.welcome-top-bar{padding:0 8px!important;top:8px!important}.duo-profile-chip{padding:4px 8px!important;gap:6px!important}.duo-profile-chip .user-name{display:none!important}.top-bar-right{gap:6px!important}.streak-badge{padding:6px 10px!important;font-size:.78rem!important}.theme-toggle-btn{transform:scale(.95)!important}}.streak-celebration-overlay{position:fixed;inset:0;background:#0f172ad9;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;z-index:9999;animation:fadeIn .3s ease forwards}.streak-celebration-card{background:var(--bg-card);border:3px solid var(--border-color);border-radius:28px;padding:32px;max-width:420px;width:90%;text-align:center;box-shadow:0 12px 0 var(--border-color);animation:popIn .5s cubic-bezier(.34,1.56,.64,1) forwards;box-sizing:border-box}.streak-fire-wrapper{position:relative;width:160px;height:160px;margin:0 auto 20px;display:flex;align-items:center;justify-content:center}.streak-huge-fire{font-size:8rem;line-height:1;animation:burn 1.2s ease-in-out infinite alternate;filter:drop-shadow(0 4px 10px rgba(255,69,0,.3))}.streak-huge-number{position:absolute;font-size:2.8rem;font-weight:900;color:#fff;top:55%;left:50%;transform:translate(-50%,-50%);text-shadow:-3px -3px 0 #000,3px -3px 0 #000,-3px 3px 0 #000,3px 3px 0 #000,0px 4px 0 #ff4500;animation:pulseNumber 1.2s ease-in-out infinite alternate}.streak-title{color:#ff8c00;font-size:1.8rem;font-weight:800;margin:10px 0;text-transform:uppercase;letter-spacing:.05em;text-shadow:0 2px 0 rgba(0,0,0,.05)}.streak-desc{font-size:1rem;line-height:1.5;color:var(--text-muted);margin-bottom:24px}.streak-continue-btn{background:#ff8c00!important;border-bottom:5px solid #cc7000!important;color:#fff!important;padding:14px 32px!important;font-size:1.1rem!important;font-weight:800!important;border-radius:16px!important;width:100%!important;cursor:pointer;transition:transform .1s ease,border-bottom-width .1s ease!important}.streak-continue-btn:active{transform:translateY(3px)!important;border-bottom-width:2px!important}.streak-spark{position:absolute;border-radius:50%;pointer-events:none;opacity:1;animation:flyOut 1.5s cubic-bezier(.1,.8,.3,1) forwards}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes popIn{0%{transform:scale(.7);opacity:0}to{transform:scale(1);opacity:1}}@keyframes burn{0%{transform:scale(.95) rotate(-2deg)}to{transform:scale(1.05) rotate(2deg)}}@keyframes pulseNumber{0%{transform:translate(-50%,-50%) scale(.95)}to{transform:translate(-50%,-50%) scale(1.05)}}@keyframes flyOut{to{transform:translate(var(--x-dest),var(--y-dest)) scale(0);opacity:0}}.streak-celebration-overlay.fade-out{opacity:0;transition:opacity .4s ease}.ai-chat-fab{position:fixed;bottom:calc(24px + env(safe-area-inset-bottom,0px));right:calc(24px + env(safe-area-inset-right,0px));z-index:9000;display:grid;place-items:center;width:52px;height:52px;overflow:visible;isolation:isolate;background:radial-gradient(circle at 28% 18%,rgba(255,255,255,.32),transparent 31%),linear-gradient(145deg,#1788f5 8%,#5565ee 49%,#803de4);color:#fff;border:1px solid rgba(255,255,255,.46);border-radius:17px;padding:0;cursor:pointer;font-family:var(--font-family);box-shadow:0 3px #411f95b8,0 9px 24px #3752d257,inset 0 1px #ffffff59;transition:transform .18s cubic-bezier(.2,.8,.2,1),box-shadow .18s ease,filter .18s ease;-webkit-user-select:none;user-select:none}.ai-chat-fab:before{content:"";position:absolute;inset:4px;z-index:-1;border:1px solid rgba(255,255,255,.16);border-radius:13px;pointer-events:none}.ai-chat-fab:hover{transform:translateY(-2px) scale(1.035);filter:saturate(1.08) brightness(1.04);box-shadow:0 5px #411f95b3,0 14px 30px #3752d26b,inset 0 1px #fff6}.ai-chat-fab:active{transform:translateY(1px);filter:brightness(.98);box-shadow:0 1px #411f95b8,0 5px 14px #3752d24d,inset 0 1px #ffffff47}.ai-chat-fab:focus-visible{outline:3px solid var(--color-accent);outline-offset:4px;box-shadow:0 3px #411f95b8,0 0 0 7px color-mix(in srgb,var(--color-primary) 20%,transparent),0 12px 30px #3752d266}.ai-chat-fab-icon{display:grid;place-items:center;width:32px;height:32px;filter:drop-shadow(0 2px 2px rgba(27,20,91,.22));transition:transform .18s cubic-bezier(.2,.8,.2,1)}.ai-chat-fab:hover .ai-chat-fab-icon{transform:translateY(-1px) rotate(-2deg)}.ai-chat-fab-icon svg{display:block;width:100%;height:100%;overflow:visible;fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.9}.ai-chat-fab-icon .ai-chat-fab-bubble{fill:#ffffff1f}.ai-chat-fab-icon circle{fill:currentColor;stroke:none}.ai-chat-fab-icon .ai-chat-fab-spark,.ai-chat-fab-icon .ai-chat-fab-mini-spark{fill:#dffbff;stroke:#dffbff;stroke-width:.9}.ai-chat-fab-icon .ai-chat-fab-smile{stroke-width:1.65}.ai-chat-panel{position:fixed;bottom:calc(90px + env(safe-area-inset-bottom,0px));right:calc(24px + env(safe-area-inset-right,0px));z-index:9001;width:380px;max-width:calc(100vw - 32px);max-height:580px;background:var(--bg-card);border:2px solid var(--border-color);border-radius:24px;box-shadow:0 6px 0 var(--border-color),0 16px 48px #0006;display:flex;flex-direction:column;overflow:hidden;animation:ai-panel-slidein .3s cubic-bezier(.34,1.56,.64,1);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}@keyframes ai-panel-slidein{0%{opacity:0;transform:translateY(20px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}.ai-chat-header{display:flex;align-items:center;justify-content:space-between;padding:16px 18px;background:linear-gradient(135deg,var(--color-primary),var(--color-secondary));color:#fff;flex-shrink:0}.ai-chat-header-info{display:flex;align-items:center;gap:10px}.ai-chat-header-icon{font-size:1.6rem;line-height:1}.ai-chat-header-title{font-weight:800;font-size:1rem;letter-spacing:.02em}.ai-chat-header-sub{font-size:.78rem;opacity:.85;font-weight:500;margin-top:1px;max-width:200px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ai-chat-header-actions{display:flex;gap:6px}.ai-chat-icon-btn{background:#ffffff26;border:none;color:#fff;border-radius:8px;width:32px;height:32px;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:1rem;font-weight:700;transition:background .15s}.ai-chat-icon-btn:hover{background:#ffffff47}.ai-chat-topic-screen{padding:18px;overflow-y:auto;flex:1}.ai-chat-topic-intro{font-size:.8rem;font-weight:700;color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em;margin-bottom:14px}.ai-chat-topic-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:14px}.ai-chat-topic-chip{background:var(--bg-main);border:2px solid var(--border-color);border-radius:14px;padding:10px 12px;font-family:var(--font-family);font-size:.82rem;font-weight:700;color:var(--text-main);cursor:pointer;text-align:center;transition:all .15s ease;box-shadow:0 3px 0 var(--border-color);line-height:1.3}.ai-chat-topic-chip:hover{background:var(--color-primary);border-color:var(--color-primary);color:#fff;transform:translateY(-2px);box-shadow:0 5px #510ac280}.ai-chat-topic-chip:active{transform:translateY(1px);box-shadow:0 1px 0 var(--border-color)}.ai-chat-custom-topic{display:flex;gap:8px;margin-top:4px}.ai-chat-custom-topic input{flex:1;background:var(--bg-main);border:2px solid var(--border-color);border-radius:12px;padding:10px 14px;font-family:var(--font-family);font-size:.85rem;color:var(--text-main);outline:none;transition:border-color .15s}.ai-chat-custom-topic input:focus{border-color:var(--color-primary)}.ai-chat-custom-topic input::placeholder{color:var(--text-muted)}.ai-chat-custom-go{background:var(--color-primary);border:2px solid var(--color-primary);border-radius:12px;color:#fff;font-size:1.1rem;font-weight:700;width:44px;height:44px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .15s;box-shadow:0 3px #510ac280;flex-shrink:0}.ai-chat-custom-go:hover{background:var(--color-primary-hover);transform:translateY(-1px)}.ai-chat-chat-screen{display:flex;flex-direction:column;flex:1;overflow:hidden;min-height:0}.ai-chat-messages{flex:1;overflow-y:auto;padding:16px;display:flex;flex-direction:column;gap:12px;scrollbar-width:thin;scrollbar-color:var(--border-color) transparent}.ai-chat-messages::-webkit-scrollbar{width:4px}.ai-chat-messages::-webkit-scrollbar-thumb{background:var(--border-color);border-radius:2px}.ai-chat-bubble{max-width:85%;padding:10px 14px;border-radius:18px;font-size:.88rem;line-height:1.5;word-break:break-word;animation:ai-bubble-in .2s ease}@keyframes ai-bubble-in{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.ai-chat-bubble.ai{background:var(--bg-main);border:2px solid var(--border-color);color:var(--text-main);align-self:flex-start;border-bottom-left-radius:6px;font-weight:500}.ai-chat-bubble.user{background:linear-gradient(135deg,var(--color-primary),var(--color-secondary));color:#fff;align-self:flex-end;border-bottom-right-radius:6px;font-weight:600}.ai-chat-bubble.correction{background:var(--color-success-bg);border:2px solid var(--color-success-border);color:var(--text-main);align-self:flex-start;border-bottom-left-radius:6px;font-size:.84rem}.ai-chat-bubble.correction:before{content:"✅ Correction:";font-weight:800;color:var(--color-success);display:block;margin-bottom:4px;font-size:.78rem;text-transform:uppercase;letter-spacing:.05em}.ai-chat-bubble.loading{background:var(--bg-main);border:2px solid var(--border-color);align-self:flex-start;border-bottom-left-radius:6px;display:flex;align-items:center;gap:4px;padding:12px 16px}.ai-chat-dot{width:7px;height:7px;border-radius:50%;background:var(--text-muted);animation:ai-dot-bounce 1.2s ease-in-out infinite}.ai-chat-dot:nth-child(2){animation-delay:.2s}.ai-chat-dot:nth-child(3){animation-delay:.4s}@keyframes ai-dot-bounce{0%,80%,to{transform:translateY(0);opacity:.5}40%{transform:translateY(-6px);opacity:1}}.ai-chat-input-bar{padding:12px 14px 14px;border-top:2px solid var(--border-color);display:flex;flex-direction:column;gap:8px;background:var(--bg-card);flex-shrink:0}.ai-chat-input-row{display:flex;gap:8px}.ai-chat-input-bar input{flex:1;background:var(--bg-main);border:2px solid var(--border-color);border-radius:14px;padding:10px 14px;font-family:var(--font-family);font-size:.88rem;color:var(--text-main);outline:none;transition:border-color .15s}.ai-chat-input-bar input:focus{border-color:var(--color-primary)}.ai-chat-input-bar input::placeholder{color:var(--text-muted)}.ai-chat-send-btn{background:var(--color-primary);border:2px solid var(--color-primary);border-radius:14px;color:#fff;font-size:1rem;font-weight:700;width:44px;height:44px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .15s;box-shadow:0 3px #510ac280;flex-shrink:0}.ai-chat-send-btn:hover{background:var(--color-primary-hover);transform:translateY(-1px)}.ai-chat-send-btn:disabled{opacity:.5;cursor:not-allowed;transform:none}.ai-chat-correct-btn{background:transparent;border:2px solid var(--border-color);border-radius:12px;color:var(--text-muted);font-family:var(--font-family);font-size:.8rem;font-weight:700;padding:7px 14px;cursor:pointer;transition:all .15s;text-align:center;width:100%}.ai-chat-correct-btn:hover{border-color:var(--color-success);color:var(--color-success);background:var(--color-success-bg)}.ai-chat-correct-btn:disabled{opacity:.4;cursor:not-allowed}@media(max-width:480px){.ai-chat-fab{bottom:calc(16px + env(safe-area-inset-bottom,0px));right:calc(16px + env(safe-area-inset-right,0px));width:48px;height:48px}.ai-chat-panel{bottom:calc(76px + env(safe-area-inset-bottom,0px));right:calc(12px + env(safe-area-inset-right,0px));left:calc(12px + env(safe-area-inset-left,0px));width:auto;max-height:min(72vh,calc(100dvh - 96px - env(safe-area-inset-bottom,0px)))}}.ai-chat-bubble-wrapper{display:flex;flex-direction:column;align-self:flex-start;max-width:85%;gap:4px;animation:ai-bubble-in .2s ease}.ai-chat-translate-btn{background:none;border:none;cursor:pointer;font-size:.75rem;font-family:var(--font-family);font-weight:600;color:var(--text-muted);padding:2px 4px;text-align:left;transition:color .15s;display:inline-flex;align-items:center;gap:4px;opacity:.7}.ai-chat-translate-btn:hover{color:var(--color-secondary);opacity:1}.ai-chat-translate-btn:disabled{opacity:.4;cursor:not-allowed}.ai-chat-translation{background:#3c83f614;border:1.5px solid hsla(217,91%,60%,.25);border-radius:4px 12px 12px;padding:8px 12px;font-size:.83rem;font-weight:500;color:var(--text-main);line-height:1.5;animation:ai-bubble-in .2s ease}.ai-chat-translation-label{font-size:.7rem;font-weight:800;color:var(--color-secondary);text-transform:uppercase;letter-spacing:.06em;margin-bottom:3px}.leaderboard-toggle-btn{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;border-radius:12px;background:var(--bg-card);border:2px solid var(--border-color);box-shadow:0 3px 0 var(--border-color);cursor:pointer;font-size:1.15rem;transition:transform var(--transition-fast),background-color var(--transition-fast)}.leaderboard-toggle-btn:hover{transform:translateY(-2px);background-color:var(--border-color)}.leaderboard-toggle-btn:active{transform:translateY(1px);box-shadow:0 1px 0 var(--border-color)}.leaderboard-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;background:#0009;z-index:10000;display:flex;align-items:center;justify-content:center;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);animation:leaderboard-fadein .25s ease}@keyframes leaderboard-fadein{0%{opacity:0}to{opacity:1}}.leaderboard-modal{background:var(--bg-card);border:2px solid var(--border-color);border-radius:24px;box-shadow:0 8px 0 var(--border-color),0 20px 50px #00000080;width:440px;max-width:calc(100vw - 32px);max-height:80vh;display:flex;flex-direction:column;overflow:hidden;animation:leaderboard-slideup .3s cubic-bezier(.34,1.56,.64,1);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}@keyframes leaderboard-slideup{0%{transform:translateY(30px) scale(.95);opacity:0}to{transform:translateY(0) scale(1);opacity:1}}.leaderboard-header{display:flex;align-items:center;justify-content:space-between;padding:20px 24px;border-bottom:2px solid var(--border-color);flex-shrink:0}.leaderboard-title{font-size:1.25rem;font-weight:800;color:var(--text-main);margin:0}.leaderboard-close-btn{background:none;border:none;color:var(--text-muted);font-size:1.15rem;font-weight:700;cursor:pointer;transition:color .15s;padding:4px;display:flex;align-items:center;justify-content:center}.leaderboard-close-btn:hover{color:var(--color-error)}.leaderboard-content{display:flex;flex-direction:column;flex:1;overflow:hidden;position:relative}.leaderboard-list-header{display:grid;grid-template-columns:60px 1fr 100px;padding:10px 24px;border-bottom:2px solid var(--border-color);font-size:.72rem;font-weight:800;color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em;background:#070a1326;flex-shrink:0}.leaderboard-list{overflow-y:auto;flex:1;padding:8px 0;scrollbar-width:thin;scrollbar-color:var(--border-color) transparent}.leaderboard-list::-webkit-scrollbar{width:6px}.leaderboard-list::-webkit-scrollbar-thumb{background:var(--border-color);border-radius:3px}.leaderboard-row{display:grid;grid-template-columns:60px 1fr 100px;align-items:center;padding:12px 24px;border-bottom:1px solid hsla(222,27%,24%,.4);font-size:.92rem;transition:background-color .15s}.leaderboard-row:last-child{border-bottom:none}.leaderboard-row.highlight-me{background-color:#8b5cf61a;border-left:4px solid var(--color-primary);padding-left:20px}.leaderboard-rank{font-weight:800;font-size:.95rem;color:var(--text-muted);display:flex;align-items:center}.leaderboard-rank.top-1,.leaderboard-rank.top-2,.leaderboard-rank.top-3{font-size:1.35rem}.leaderboard-user-info{display:flex;align-items:center;gap:12px;min-width:0}.leaderboard-avatar{width:32px;height:32px;border-radius:50%;border:2px solid var(--border-color);object-fit:cover;flex-shrink:0;background-color:var(--bg-main)}.leaderboard-name{font-weight:700;color:var(--text-main);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.leaderboard-row.highlight-me .leaderboard-name{color:var(--color-primary)}.leaderboard-streak{display:flex;align-items:center;justify-content:flex-end;gap:4px;font-weight:800;font-size:.95rem;color:#ff9600;text-align:right;padding-right:8px}.leaderboard-sticky-row{border-top:2px solid var(--border-color);background:var(--bg-card);box-shadow:0 -4px 15px #00000026;flex-shrink:0}.leaderboard-sticky-row .leaderboard-row{border-bottom:none;background-color:#8b5cf626;border-left:4px solid var(--color-primary);padding:14px 24px 14px 20px}.leaderboard-sticky-label{font-size:.65rem;font-weight:800;color:var(--color-primary);text-transform:uppercase;letter-spacing:.08em;padding:8px 24px 0;background-color:#8b5cf626;display:block}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.tile-option.unavailable{opacity:.45;cursor:not-allowed}.tile-option.unavailable .tile-label{cursor:not-allowed}.deck-picker-trigger{width:100%;min-height:72px;display:flex;align-items:center;gap:12px;padding:12px 16px;color:var(--text-main);background:var(--bg-card);border:2px solid var(--border-color);border-bottom-width:4px;border-radius:16px;font-family:inherit;text-align:left;cursor:pointer;transition:border-color var(--transition-fast),transform var(--transition-fast)}.deck-picker-trigger:hover,.deck-picker-trigger[aria-expanded=true]{border-color:var(--color-primary)}.deck-picker-trigger:active{transform:translateY(2px);border-bottom-width:2px}.deck-picker-icon{font-size:1.7rem}.deck-picker-copy{min-width:0;display:flex;flex:1;flex-direction:column;gap:2px}.deck-picker-copy strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.98rem}.deck-picker-copy small,.deck-picker-status{color:var(--text-muted);font-size:.8rem;font-weight:600}.deck-picker-chevron{color:var(--color-primary);font-size:1.5rem;font-weight:800}.deck-picker-status{min-height:1.1em;margin-top:8px}.app-modal-overlay{position:fixed;z-index:20000;inset:0;display:flex;align-items:center;justify-content:center;padding:16px;background:#0000009e;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);animation:modal-fade-in .18s ease-out}@keyframes modal-fade-in{0%{opacity:0}to{opacity:1}}.deck-picker-modal,.exit-game-modal{width:min(560px,100%);max-height:min(760px,calc(100dvh - 32px));display:flex;flex-direction:column;overflow:hidden;color:var(--text-main);background:var(--bg-card);border:2px solid var(--border-color);border-radius:24px;box-shadow:0 8px 0 var(--border-color),0 22px 54px #0006;animation:modal-pop .24s cubic-bezier(.34,1.56,.64,1)}@keyframes modal-pop{0%{opacity:0;transform:translateY(22px) scale(.96)}to{opacity:1;transform:none}}.picker-modal-header{display:flex;justify-content:space-between;gap:18px;padding:20px 22px 16px;border-bottom:2px solid var(--border-color)}.picker-modal-header h2,.exit-game-modal h2{margin:0;font-size:1.35rem;font-weight:800}.picker-modal-header p{margin-top:5px;color:var(--text-muted);font-size:.9rem}.modal-close-btn{width:44px;height:44px;border:0;color:var(--text-muted);background:transparent;font:inherit;font-size:1.15rem;cursor:pointer}.modal-close-btn:hover{color:var(--color-error)}.picker-modal-body{min-height:0;overflow-y:auto;padding:16px 22px}.deck-picker-search{width:100%;min-height:48px;padding:0 14px;color:var(--text-main);background:var(--bg-main);border:2px solid var(--border-color);border-radius:12px;font-family:inherit;outline:none}.deck-picker-search:focus{border-color:var(--color-primary)}.deck-picker-list{display:flex;flex-direction:column;gap:18px;margin-top:18px}.deck-picker-group h3{margin:0 0 9px;color:var(--text-muted);font-size:.75rem;letter-spacing:.07em;text-transform:uppercase}.deck-picker-system-group h3{color:var(--color-primary)}.deck-picker-own-group h3{color:var(--color-secondary)}.deck-check-row{min-height:64px;display:flex;align-items:center;gap:11px;padding:10px 4px;border-bottom:1px solid var(--border-color);cursor:pointer}.deck-check-row:last-child{border-bottom:0}.deck-check-row input{width:20px;height:20px;accent-color:var(--color-primary);flex:0 0 auto}.deck-check-row.disabled{cursor:not-allowed;opacity:.5}.deck-check-icon{font-size:1.2rem}.deck-check-copy{min-width:0;flex:1;display:flex;flex-direction:column;gap:2px}.deck-check-copy strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.deck-check-copy small{color:var(--text-muted);font-size:.8rem}.deck-check-mark{color:var(--color-primary);font-size:1.1rem;font-weight:900}.deck-picker-empty{display:flex;min-height:150px;align-items:center;justify-content:center;flex-direction:column;gap:10px;color:var(--text-muted);text-align:center}.deck-picker-empty a{color:var(--color-primary);font-weight:800}.picker-modal-footer{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 22px;border-top:2px solid var(--border-color);background:var(--bg-card)}.deck-picker-count{color:var(--text-muted);font-size:.85rem;font-weight:800}.picker-modal-actions{display:flex;align-items:center;gap:8px}.picker-modal-actions .primary-btn,.picker-modal-actions .secondary-btn{min-height:42px;padding:9px 15px;font-size:.9rem}.text-btn{min-height:42px;padding:7px;color:var(--color-primary);background:transparent;border:0;font-family:inherit;font-weight:800;cursor:pointer}.exit-game-modal{width:min(390px,100%);padding:28px 24px 24px;align-items:center;text-align:center;overflow:visible}.exit-game-mascot{width:108px;height:108px;margin-bottom:10px;pointer-events:none;-webkit-user-select:none;user-select:none}.exit-game-mascot .panda-actor__motion{overflow:visible}.exit-game-mascot :is(.panda-actor__sprite,.panda-actor__fallback){filter:drop-shadow(0 9px 12px rgba(18,24,38,.2))}.exit-game-modal p{margin:10px 0 22px;color:var(--text-muted);line-height:1.45}.exit-game-actions{width:100%;display:grid;gap:10px}.exit-game-actions .primary-btn,.exit-game-actions .danger-outline-btn{width:100%;min-height:48px}.danger-outline-btn{color:var(--color-error);border:2px solid var(--color-error-border);border-bottom-width:4px;border-radius:14px;background:transparent;font-family:inherit;font-size:1rem;font-weight:800;cursor:pointer}.danger-outline-btn:active{transform:translateY(2px);border-bottom-width:2px}.speedtype-card,.preview-card{width:100%;padding:24px;border:2px solid var(--border-color);border-radius:20px;background:var(--bg-card);box-shadow:var(--shadow-card)}.speedtype-hint{color:var(--text-muted);font-size:.94rem;font-weight:600;line-height:1.5}.speedtype-input{margin-top:20px;font-size:1.25rem}.speedtype-input.speedtype-error{border-color:var(--color-error);box-shadow:0 0 0 3px #ee2b4b1f}.speedtype-input.speedtype-complete{border-color:var(--color-success)!important;color:var(--color-success);box-shadow:0 0 0 3px color-mix(in srgb,var(--color-success) 35%,transparent),0 8px 24px color-mix(in srgb,var(--color-success) 20%,transparent)!important}.speedtype-speech-warning{margin-top:14px;color:var(--text-muted);font-size:.82rem;font-weight:600;line-height:1.45}.speedtype-stats{width:100%;display:flex;justify-content:space-around;gap:8px;padding:11px;color:var(--color-accent);font-size:.84rem;font-weight:800}.speedtype-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:100%;gap:12px}.speedtype-actions>button{width:100%;min-height:48px}.speedtype-actions>:only-child{grid-column:1 / -1}.preview-card{text-align:center}.preview-vietnamese{margin-bottom:20px;color:var(--color-primary);font-size:1.35rem;font-weight:800;line-height:1.4}.listen-again-btn{min-height:44px;padding:9px 15px;color:var(--color-primary);background:color-mix(in srgb,var(--color-primary) 10%,var(--bg-card));border:2px solid var(--color-primary);border-radius:12px;font-family:inherit;font-weight:800;cursor:pointer}.preview-actions{display:grid;grid-template-columns:1fr 1fr;width:100%;gap:12px}.preview-actions .primary-btn,.preview-review-btn{min-height:50px;padding:10px;font-size:.9rem}.preview-review-btn{color:#be7000;border:2px solid #ff9600;border-bottom-width:4px;border-radius:14px;background:color-mix(in srgb,#ff9600 10%,var(--bg-card));font-family:inherit;font-weight:800;cursor:pointer}.memory-board{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));width:100%;gap:12px}.memory-card{position:relative;min-width:0;min-height:112px;padding:0;border:0;background:transparent;cursor:pointer;perspective:700px;font-family:inherit}.memory-card:focus-visible{outline:3px solid var(--color-accent);outline-offset:3px;border-radius:16px}.memory-card-inner{position:absolute;inset:0;display:block;transform-style:preserve-3d;-webkit-transform-style:preserve-3d;will-change:transform;transition:transform .34s cubic-bezier(.22,.9,.28,1.15)}.memory-card.is-open .memory-card-inner,.memory-card.is-matched .memory-card-inner{transform:rotateY(180deg)}.memory-card-face{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:10px;border:2px solid var(--border-color);border-bottom-width:5px;border-radius:16px;backface-visibility:hidden;-webkit-backface-visibility:hidden;-webkit-transform:translateZ(.1px);transform:translateZ(.1px);box-shadow:var(--shadow-card);transition:border-color var(--transition-fast),background-color var(--transition-fast),color var(--transition-fast)}.memory-card-back{color:#fff;background:linear-gradient(145deg,var(--color-primary),var(--color-secondary));font-size:1.55rem}.memory-card-front{transform:rotateY(180deg) translateZ(.1px);-webkit-transform:rotateY(180deg) translateZ(.1px);color:var(--text-main);background:var(--bg-card);font-weight:800;line-height:1.26;text-align:center;overflow-wrap:anywhere}.memory-card-english{font-size:.92rem}.memory-card-vietnamese{color:var(--text-muted);font-size:.78rem;font-weight:700}.memory-card.is-matched .memory-card-front{color:var(--color-success);border-color:var(--color-success-border);background:var(--color-success-bg)}.memory-card.is-wrong{animation:shake .4s ease-in-out}.memory-card.is-wrong .memory-card-front{color:var(--color-error);border-color:var(--color-error-border);background:var(--color-error-bg)}.memory-card:disabled{cursor:default;opacity:1}.memory-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));width:100%;gap:8px;padding:11px;color:var(--color-accent);border:1px solid var(--border-color);border-radius:13px;background:color-mix(in srgb,var(--bg-card) 88%,var(--color-primary));font-size:.8rem;font-weight:800;text-align:center}.memory-status{min-height:1.4em;margin:3px 0 0;color:var(--text-muted);font-size:.83rem;font-weight:650;line-height:1.45;text-align:center}.swipe-game{width:100%;display:grid;justify-items:center;gap:12px;overflow:hidden;padding:2px 8px 8px}.swipe-timer{width:min(390px,100%);display:grid;grid-template-columns:minmax(0,1fr) 48px;align-items:center;gap:10px}.swipe-timer-track{height:11px;overflow:hidden;border:1px solid var(--border-color);border-radius:999px;background:var(--bg-card)}.swipe-timer-fill{width:100%;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--color-secondary),var(--color-primary));transition:width .05s linear,background .2s}.swipe-timer.urgent .swipe-timer-fill{background:linear-gradient(90deg,#ff9600,var(--color-error))}.swipe-timer-text{color:var(--text-muted);font-size:.78rem;font-weight:900;font-variant-numeric:tabular-nums;text-align:right}.swipe-timer.urgent .swipe-timer-text{color:var(--color-error)}.swipe-stage{position:relative;width:min(390px,100%);height:330px;display:grid;place-items:center;perspective:900px}.swipe-stage:before,.swipe-stage:after{content:"";position:absolute;width:88%;height:88%;border:2px solid var(--border-color);border-radius:24px;background:var(--bg-card);box-shadow:var(--shadow-card)}.swipe-stage:before{transform:translateY(13px) scale(.94) rotate(-2deg);opacity:.4}.swipe-stage:after{transform:translateY(7px) scale(.97) rotate(1.3deg);opacity:.7}.swipe-card{position:relative;z-index:2;width:100%;min-height:300px;display:flex;align-items:center;justify-content:center;flex-direction:column;overflow:hidden;padding:32px 24px 24px;color:var(--text-main);border:2px solid var(--border-color);border-bottom-width:6px;border-radius:24px;background:linear-gradient(155deg,color-mix(in srgb,var(--bg-card) 90%,var(--color-primary)),var(--bg-card));box-shadow:0 14px 32px #0003;cursor:grab;-webkit-user-select:none;user-select:none;touch-action:none;transition:transform .22s ease,opacity .28s ease,border-color .2s,background .2s}.swipe-card.dragging{cursor:grabbing;transition:border-color .2s,background .2s}.swipe-card.snap-back{transition:transform .22s cubic-bezier(.22,.9,.28,1.2)}.swipe-card:focus-visible{outline:3px solid var(--color-accent);outline-offset:4px}.swipe-card-kicker{color:var(--text-muted);font-size:.68rem;font-weight:900;letter-spacing:.12em}.swipe-card-english{max-width:100%;margin-top:6px;font-size:clamp(1.7rem,7vw,2.55rem);font-weight:900;line-height:1.15;overflow-wrap:anywhere;text-align:center}.swipe-card-divider{width:54px;height:4px;margin:22px 0;border-radius:999px;background:linear-gradient(90deg,var(--color-secondary),var(--color-primary))}.swipe-card-vietnamese{max-width:100%;margin-top:7px;color:var(--color-primary);font-size:clamp(1.08rem,4vw,1.42rem);font-weight:800;line-height:1.35;overflow-wrap:anywhere;text-align:center}.swipe-card-hint{margin-top:auto;padding-top:23px;color:var(--text-muted);font-size:.72rem;font-weight:700}.swipe-verdict{position:absolute;z-index:3;top:20px;padding:7px 11px;border:3px solid currentColor;border-radius:10px;font-size:1.05rem;font-weight:950;letter-spacing:.08em;opacity:0;transition:opacity .12s,transform .12s}.swipe-verdict-left{left:18px;color:var(--color-error);transform:rotate(-10deg) scale(.75)}.swipe-verdict-right{right:18px;color:var(--color-success);transform:rotate(10deg) scale(.75)}.swipe-card.lean-left .swipe-verdict-left,.swipe-card.lean-right .swipe-verdict-right{opacity:1;transform:rotate(0) scale(1)}.swipe-card.lean-left{border-color:var(--color-error-border);background:color-mix(in srgb,var(--color-error-bg) 45%,var(--bg-card))}.swipe-card.lean-right{border-color:var(--color-success-border);background:color-mix(in srgb,var(--color-success-bg) 45%,var(--bg-card))}.swipe-card.swipe-answer-correct{border-color:var(--color-success-border);box-shadow:0 14px 32px color-mix(in srgb,var(--color-success) 22%,transparent)}.swipe-card.swipe-answer-wrong{border-color:var(--color-error-border)}.swipe-card.swipe-timeout{transform:scale(.96);opacity:.58;animation:shake .38s ease-in-out}.swipe-actions{width:min(390px,100%);display:grid;grid-template-columns:1fr 1fr;gap:12px}.swipe-action{min-height:52px;padding:10px 16px;border:2px solid;border-bottom-width:5px;border-radius:16px;background:var(--bg-card);font:inherit;font-size:1rem;font-weight:900;cursor:pointer}.swipe-action:active{transform:translateY(3px);border-bottom-width:2px}.swipe-action:disabled{cursor:default;opacity:.55}.swipe-action-wrong{color:var(--color-error);border-color:var(--color-error-border);background:color-mix(in srgb,var(--color-error-bg) 55%,var(--bg-card))}.swipe-action-right{color:var(--color-success);border-color:var(--color-success-border);background:color-mix(in srgb,var(--color-success-bg) 55%,var(--bg-card))}.swipe-stats{width:min(390px,100%);display:grid;grid-template-columns:repeat(3,1fr);gap:7px;color:var(--text-muted);font-size:.76rem;font-weight:850;text-align:center}.swipe-status{width:100%;min-height:1.4em;margin:0;color:var(--text-muted);font-size:.8rem;font-weight:700;text-align:center}.swipe-status[data-tone=success]{color:var(--color-success)}.swipe-status[data-tone=error]{color:var(--color-error)}.swipe-result{position:absolute;z-index:4;width:min(86%,320px);display:grid;justify-items:center;gap:6px;padding:20px 18px 18px;border:3px solid;border-bottom-width:6px;border-radius:22px;box-shadow:0 18px 40px #00000047;text-align:center;pointer-events:none;animation:swipe-result-pop .42s cubic-bezier(.34,1.56,.64,1) both}.swipe-result.is-correct{color:var(--color-success);border-color:var(--color-success-border);background:color-mix(in srgb,var(--color-success-bg) 70%,var(--bg-card))}.swipe-result.is-wrong{color:var(--color-error);border-color:var(--color-error-border);background:color-mix(in srgb,var(--color-error-bg) 70%,var(--bg-card))}.swipe-result-icon{width:64px;height:64px;display:grid;place-items:center;color:#fff;border-radius:50%;font-size:2rem;font-weight:950;line-height:1}.swipe-result.is-correct .swipe-result-icon{background:var(--color-success);box-shadow:0 0 0 8px color-mix(in srgb,var(--color-success) 20%,transparent)}.swipe-result.is-wrong .swipe-result-icon{background:var(--color-error);box-shadow:0 0 0 8px color-mix(in srgb,var(--color-error) 20%,transparent);animation:shake .4s ease-in-out .18s}.swipe-result-title{margin-top:6px;font-size:1.55rem;font-weight:950;line-height:1.1}.swipe-result-detail{color:var(--text-main);font-size:.82rem;font-weight:900;letter-spacing:.06em}.swipe-result-pair{max-width:100%;color:var(--text-main);font-size:.88rem;font-weight:700;line-height:1.35;overflow-wrap:anywhere}.swipe-result-xp{padding:3px 10px;color:#fff;border-radius:999px;background:var(--color-success);font-size:.8rem;font-weight:900;animation:swipe-xp-rise .7s ease-out .12s both}@keyframes swipe-result-pop{0%{opacity:0;transform:translateY(16px) scale(.6)}to{opacity:1;transform:none}}@keyframes swipe-xp-rise{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}@media(prefers-reduced-motion:reduce){.swipe-result,.swipe-result-icon,.swipe-result-xp{animation:none!important}}@media(max-width:520px){.app-modal-overlay{align-items:flex-end;padding:0}.deck-picker-modal{width:100%;max-height:86dvh;border-radius:24px 24px 0 0;border-bottom:0}.picker-modal-header,.picker-modal-body,.picker-modal-footer{padding-left:16px;padding-right:16px}.picker-modal-footer{align-items:flex-start;flex-direction:column}.picker-modal-actions{width:100%}.picker-modal-actions .primary-btn,.picker-modal-actions .secondary-btn{flex:1}.text-btn{margin-right:auto}.exit-game-modal{margin:auto 16px}.exit-game-mascot{width:96px;height:96px;margin-bottom:8px}.preview-actions,.speedtype-actions{grid-template-columns:1fr}.memory-board{grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}.memory-card{min-height:102px}.memory-card-face{padding:8px;border-radius:14px}.memory-card-english{font-size:.82rem}.memory-card-vietnamese{font-size:.7rem}.memory-stats{padding:9px 6px;font-size:.72rem}.swipe-stage{height:305px}.swipe-card{min-height:278px;padding:28px 18px 20px;border-radius:20px}.swipe-card-divider{margin:17px 0}.swipe-card-hint{padding-top:18px}.swipe-action{min-height:50px}}@media(max-width:360px){.memory-board{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.memory-card{min-height:106px}}.deck-check-row{gap:8px;cursor:default}.deck-check-select{min-width:0;flex:1;min-height:48px;display:flex;align-items:center;gap:11px;cursor:pointer}.deck-check-row.disabled .deck-check-select{cursor:not-allowed}.deck-mindmap-btn{flex:0 0 auto;min-height:40px;padding:7px 9px;color:var(--color-primary);border:1.5px solid color-mix(in srgb,var(--color-primary) 46%,var(--border-color));border-radius:10px;background:color-mix(in srgb,var(--color-primary) 8%,var(--bg-card));font:inherit;font-size:.72rem;font-weight:800;cursor:pointer}.deck-mindmap-btn:hover{background:var(--color-primary);color:#fff}.deck-complete-btn{flex:0 0 auto;min-height:40px;padding:7px 9px;color:var(--color-text-secondary);border:1.5px solid var(--border-color);border-radius:10px;background:var(--bg-card);font:inherit;font-size:.72rem;font-weight:800;cursor:pointer;transition:all .15s ease}.deck-complete-btn:hover{background:color-mix(in srgb,var(--color-success) 10%,var(--bg-card));border-color:var(--color-success);color:var(--color-success)}.deck-complete-btn.completed{background:color-mix(in srgb,var(--color-success) 15%,var(--bg-card));border-color:var(--color-success);color:var(--color-success)}.deck-complete-btn.completed:hover{background:color-mix(in srgb,var(--color-success) 25%,var(--bg-card))}.deck-completed-badge{margin-left:6px;font-size:.85em;vertical-align:middle}.deck-mindmap-view{display:flex;min-height:0;flex-direction:column;gap:10px}.mindmap-toolbar{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.6fr) minmax(0,1fr);align-items:center;gap:8px}.mindmap-toolbar .text-btn{justify-self:start}.mindmap-title{min-width:0;margin:0;overflow:hidden;color:var(--text-main);font-size:.9rem;font-weight:900;text-align:center;text-overflow:ellipsis;white-space:nowrap;outline:none}.mindmap-zoom-controls{display:flex;justify-content:flex-end;gap:4px}.mindmap-zoom-controls button{width:32px;height:32px;padding:0;color:var(--text-main);border:1.5px solid var(--border-color);border-radius:9px;background:var(--bg-main);font:inherit;font-weight:900;cursor:pointer}.mindmap-status{min-height:1.2em;margin:0;color:var(--text-muted);font-size:.75rem;font-weight:600;text-align:center}.deck-mindmap-viewport{position:relative;min-height:420px;overflow:hidden;border:2px solid var(--border-color);border-radius:18px;background:radial-gradient(circle at 50% 50%,color-mix(in srgb,var(--color-primary) 14%,var(--bg-card)),var(--bg-main) 70%);cursor:grab;touch-action:none}.deck-mindmap-viewport.dragging{cursor:grabbing}.deck-mindmap-scene{position:absolute;top:calc(50% - 340px);left:calc(50% - 460px);width:920px;height:680px;transform-origin:center center;will-change:transform}.mindmap-lines{position:absolute;z-index:1;inset:0;width:920px;height:680px;overflow:visible}.mindmap-lines path{fill:none;stroke:color-mix(in srgb,var(--color-primary) 46%,var(--border-color));stroke-width:2.5;stroke-linecap:round;opacity:.72}.mindmap-root,.mindmap-word-node{position:absolute;display:flex;flex-direction:column;align-items:center;justify-content:center;transform:translate(-50%,-50%);text-align:center}.mindmap-root{z-index:3;width:164px;min-height:108px;padding:13px 15px;color:#fff;border:3px solid rgba(255,255,255,.62);border-radius:30px;background:linear-gradient(145deg,var(--color-primary),var(--color-secondary));box-shadow:0 10px 24px color-mix(in srgb,var(--color-primary) 40%,transparent)}.mindmap-root strong{display:-webkit-box;overflow:hidden;font-size:.9rem;line-height:1.22;-webkit-line-clamp:3;-webkit-box-orient:vertical}.mindmap-root small{margin-top:4px;font-size:.68rem;font-weight:700;opacity:.86}.mindmap-word-node{z-index:2;width:144px;min-height:86px;padding:9px 11px;color:var(--text-main);border:2px solid color-mix(in srgb,var(--color-primary) 36%,var(--border-color));border-radius:16px;background:color-mix(in srgb,var(--bg-card) 92%,var(--color-primary));box-shadow:0 5px color-mix(in srgb,var(--border-color) 76%,var(--color-primary))}.mindmap-word-node:focus-visible{outline:3px solid var(--color-accent);outline-offset:4px}.mindmap-word-node strong{display:-webkit-box;width:100%;overflow:hidden;font-size:.84rem;font-weight:900;line-height:1.18;overflow-wrap:anywhere;-webkit-line-clamp:2;-webkit-box-orient:vertical}.mindmap-word-node small{display:-webkit-box;width:100%;overflow:hidden;margin-top:5px;padding-top:4px;color:var(--text-muted);border-top:1px solid color-mix(in srgb,var(--border-color) 76%,var(--color-primary));font-size:.7rem;font-weight:700;line-height:1.2;overflow-wrap:anywhere;-webkit-line-clamp:2;-webkit-box-orient:vertical}.mindmap-pagination{display:flex;min-height:42px;align-items:center;justify-content:center;gap:10px;color:var(--text-muted);font-size:.8rem;font-weight:800}.mindmap-pagination .secondary-btn{min-height:38px;padding:6px 10px;font-size:.78rem}.deck-quiz-preview-view{display:flex;min-height:0;flex-direction:column;gap:10px}.quiz-preview-toolbar{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:8px}.quiz-preview-list{display:flex;flex-direction:column;gap:12px}.quiz-preview-card{padding:14px;border:2px solid var(--border-color);border-radius:16px;background:var(--bg-main)}.quiz-preview-kicker{margin:0 0 6px;color:var(--text-muted);font-size:.72rem;font-weight:800;letter-spacing:.04em}.quiz-preview-question{margin:0;color:var(--text-main);font-size:.98rem;font-weight:800;line-height:1.4;overflow-wrap:anywhere;white-space:normal}.quiz-preview-image{display:block;width:100%;max-height:180px;margin-top:10px;border-radius:12px;object-fit:contain;background:var(--bg-card)}.quiz-preview-options{display:grid;gap:8px;margin:12px 0 0;padding:0;list-style:none}.quiz-preview-option{display:flex;align-items:flex-start;justify-content:space-between;gap:8px;padding:8px 10px;border:1.5px solid var(--border-color);border-radius:12px;background:var(--bg-card)}.quiz-preview-option-text{min-width:0;color:var(--text-main);font-size:.88rem;font-weight:700;line-height:1.35;overflow-wrap:anywhere}.quiz-preview-option.is-correct{border-color:var(--color-success-border);background:color-mix(in srgb,var(--color-success) 12%,var(--bg-card))}.quiz-preview-answer{flex:0 0 auto;padding:2px 7px;color:var(--color-success);border:1.5px solid var(--color-success-border);border-radius:999px;font-size:.68rem;font-weight:900}.quiz-preview-explanation{margin:10px 0 0;color:var(--text-muted);font-size:.82rem;font-weight:650;line-height:1.45;overflow-wrap:anywhere}@media(min-width:521px){.deck-picker-modal{width:min(980px,calc(100vw - 48px));max-height:min(920px,calc(100dvh - 24px))}.deck-mindmap-viewport{height:clamp(490px,61vh,620px);min-height:490px}}.preview-tools{display:flex;flex-wrap:wrap;justify-content:center;gap:10px}.preview-example-btn{min-height:44px;padding:9px 15px;color:var(--text-main);border:2px solid var(--border-color);border-radius:12px;background:var(--bg-main);font:inherit;font-weight:800;cursor:pointer}.preview-example-btn:hover{border-color:var(--color-secondary);color:var(--color-secondary)}.preview-example-btn:disabled{opacity:.64;cursor:wait}.preview-examples{margin-top:16px;text-align:left}.preview-example-list{display:grid;gap:8px}.preview-example-row{padding:10px 12px;border:1.5px solid var(--border-color);border-radius:12px;background:var(--bg-main)}.preview-example-row strong,.preview-example-row small{display:block}.preview-example-row strong{color:var(--text-main);font-size:.88rem;line-height:1.4}.preview-example-row small{margin-top:4px;color:var(--text-muted);font-size:.8rem;line-height:1.4}.preview-example-empty,.preview-example-loading{margin:6px 0;color:var(--text-muted);font-size:.83rem;font-weight:600;line-height:1.45;text-align:center}.preview-example-source{margin:10px 0 0;color:var(--text-muted);font-size:.7rem;text-align:center}.preview-example-source a{color:var(--color-primary);font-weight:800}.ai-chat-mode-grid{display:grid;gap:12px}.ai-chat-mode-card{min-height:94px;display:flex;flex-direction:column;justify-content:center;gap:5px;padding:15px;color:var(--text-main);border:2px solid var(--border-color);border-radius:16px;background:var(--bg-main);box-shadow:0 4px 0 var(--border-color);font:inherit;text-align:left;cursor:pointer;transition:transform .15s,border-color .15s}.ai-chat-mode-card strong{font-size:.95rem}.ai-chat-mode-card small{color:var(--text-muted);font-size:.78rem;font-weight:600;line-height:1.4}.ai-chat-mode-card:hover{transform:translateY(-2px);border-color:var(--color-primary)}.ai-chat-mode-card:focus-visible{outline:3px solid var(--color-accent);outline-offset:2px;border-color:var(--color-primary)}.ai-chat-tutor-suggestions{display:flex;flex-wrap:wrap;gap:8px}.ai-chat-tutor-suggestions button{min-height:38px;padding:7px 10px;color:var(--color-primary);border:1.5px solid color-mix(in srgb,var(--color-primary) 40%,var(--border-color));border-radius:999px;background:color-mix(in srgb,var(--color-primary) 7%,var(--bg-card));font:inherit;font-size:.76rem;font-weight:700;cursor:pointer}.ai-chat-input-bar textarea{flex:1;min-height:44px;max-height:110px;resize:none;overflow-y:auto;padding:10px 14px;color:var(--text-main);border:2px solid var(--border-color);border-radius:14px;background:var(--bg-main);font-family:var(--font-family);font-size:.88rem;line-height:1.35;outline:none}.ai-chat-input-bar textarea:focus{border-color:var(--color-primary)}.ai-chat-input-bar textarea::placeholder{color:var(--text-muted)}.ai-chat-bubble,.ai-chat-translation{white-space:pre-wrap}.ai-chat-message-actions{display:flex;gap:7px}.ai-chat-user-wrapper{align-self:flex-end}.ai-chat-message-actions button{padding:2px 4px;color:var(--text-muted);border:0;background:transparent;font:inherit;font-size:.72rem;font-weight:700;cursor:pointer}.ai-chat-retry-btn{align-self:flex-start;min-height:34px;padding:5px 9px;color:var(--color-primary);border:1.5px solid var(--color-primary);border-radius:9px;background:transparent;font:inherit;font-size:.76rem;font-weight:800;cursor:pointer}.ai-chat-dictionary-screen{display:grid;gap:13px}.ai-dictionary-intro{display:flex;align-items:center;gap:11px;padding:1px 1px 2px}.ai-dictionary-intro-icon{display:grid;place-items:center;flex:0 0 42px;height:42px;color:#fff;border-radius:13px;background:linear-gradient(135deg,var(--color-primary),var(--color-secondary));box-shadow:inset 0 -3px #00000026;font-size:.92rem;font-weight:900;letter-spacing:-.04em}.ai-dictionary-intro h2{margin:0 0 2px;color:var(--text-main);font-size:1rem;line-height:1.25}.ai-dictionary-intro p{margin:0;color:var(--text-muted);font-size:.76rem;font-weight:600;line-height:1.4}.ai-dictionary-form{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px}.ai-dictionary-form input{min-width:0;height:44px;padding:9px 12px;color:var(--text-main);border:2px solid var(--border-color);border-radius:13px;background:var(--bg-main);font:inherit;font-size:.9rem;font-weight:650;outline:none;transition:border-color .15s ease,box-shadow .15s ease}.ai-dictionary-form input:focus{border-color:var(--color-primary);box-shadow:0 0 0 3px color-mix(in srgb,var(--color-primary) 16%,transparent)}.ai-dictionary-form input::placeholder{color:var(--text-muted);font-weight:500}.ai-dictionary-form button{min-width:76px;height:44px;padding:7px 12px;color:#fff;border:2px solid var(--color-primary);border-bottom-width:4px;border-radius:13px;background:linear-gradient(135deg,var(--color-primary),var(--color-secondary));font:inherit;font-size:.8rem;font-weight:850;cursor:pointer;transition:transform .12s ease,filter .12s ease}.ai-dictionary-form button:hover:not(:disabled){filter:brightness(1.06);transform:translateY(-1px)}.ai-dictionary-form button:active:not(:disabled){border-bottom-width:2px;transform:translateY(2px)}.ai-dictionary-form :disabled{cursor:wait;opacity:.65}.ai-dictionary-status{min-height:1.25em;margin:-4px 2px 0;color:var(--text-muted);font-size:.74rem;font-weight:700;line-height:1.4}.ai-dictionary-status[data-tone=error]{color:var(--color-error)}.ai-dictionary-status[data-tone=loading]:before{content:"";display:inline-block;width:9px;height:9px;margin-right:6px;border:2px solid color-mix(in srgb,var(--color-primary) 25%,transparent);border-top-color:var(--color-primary);border-radius:50%;vertical-align:-1px;animation:ai-dictionary-spin .7s linear infinite}@keyframes ai-dictionary-spin{to{transform:rotate(360deg)}}.ai-dictionary-result{display:grid;gap:12px;padding:14px;border:2px solid color-mix(in srgb,var(--color-primary) 26%,var(--border-color));border-radius:18px;background:linear-gradient(145deg,color-mix(in srgb,var(--color-primary) 7%,var(--bg-card)),var(--bg-card) 42%);box-shadow:0 4px color-mix(in srgb,var(--color-primary) 12%,var(--border-color))}.ai-dictionary-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}.ai-dictionary-headword{margin:0;color:var(--text-main);font-size:1.28rem;line-height:1.2;overflow-wrap:anywhere}.ai-dictionary-phonetic{margin:3px 0 0;color:var(--color-primary);font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.8rem;font-weight:750}.ai-dictionary-listen{display:grid;place-items:center;flex:0 0 40px;height:40px;padding:0;color:var(--color-primary);border:2px solid color-mix(in srgb,var(--color-primary) 38%,var(--border-color));border-bottom-width:4px;border-radius:12px;background:color-mix(in srgb,var(--color-primary) 9%,var(--bg-card));font:inherit;font-size:1rem;cursor:pointer}.ai-dictionary-listen:active{border-bottom-width:2px;transform:translateY(2px)}.ai-dictionary-listen:focus-visible,.ai-dictionary-synonym-list button:focus-visible,.ai-dictionary-retry:focus-visible{outline:3px solid var(--color-accent);outline-offset:2px}.ai-dictionary-entries{display:grid;gap:10px;margin:0;padding:0;list-style:none;counter-reset:dictionary-entry}.ai-dictionary-entry{position:relative;display:grid;gap:4px;padding:11px 11px 11px 39px;border:1.5px solid var(--border-color);border-radius:13px;background:var(--bg-main);counter-increment:dictionary-entry}.ai-dictionary-entry:before{content:counter(dictionary-entry);position:absolute;top:11px;left:11px;display:grid;place-items:center;width:20px;height:20px;color:#fff;border-radius:7px;background:var(--color-primary);font-size:.68rem;font-weight:900}.ai-dictionary-pos{width:fit-content;padding:2px 7px;color:var(--color-primary);border-radius:999px;background:color-mix(in srgb,var(--color-primary) 12%,transparent);font-size:.67rem;font-style:italic;font-weight:800}.ai-dictionary-meaning,.ai-dictionary-definition,.ai-dictionary-example-en,.ai-dictionary-example-vi{margin:0;overflow-wrap:anywhere}.ai-dictionary-meaning{color:var(--text-main);font-size:.9rem;font-weight:850;line-height:1.4}.ai-dictionary-definition{color:var(--text-muted);font-size:.78rem;font-weight:600;line-height:1.45}.ai-dictionary-examples{display:grid;gap:2px;margin-top:4px;padding-left:9px;border-left:3px solid color-mix(in srgb,var(--color-accent) 55%,transparent)}.ai-dictionary-example-en{color:var(--text-main);font-size:.76rem;font-style:italic;font-weight:650;line-height:1.4}.ai-dictionary-example-vi{color:var(--text-muted);font-size:.73rem;line-height:1.4}.ai-dictionary-synonyms,.ai-dictionary-note{display:grid;gap:7px}.ai-dictionary-section-label{color:var(--text-main);font-size:.73rem;font-weight:900;letter-spacing:.02em;text-transform:uppercase}.ai-dictionary-synonym-list{display:flex;flex-wrap:wrap;gap:6px}.ai-dictionary-synonym-list button{padding:5px 9px;color:var(--color-primary);border:1.5px solid color-mix(in srgb,var(--color-primary) 38%,var(--border-color));border-radius:999px;background:color-mix(in srgb,var(--color-primary) 7%,var(--bg-card));font:inherit;font-size:.72rem;font-weight:750;cursor:pointer}.ai-dictionary-synonym-list button:hover{border-color:var(--color-primary);background:color-mix(in srgb,var(--color-primary) 13%,var(--bg-card))}.ai-dictionary-note{padding:10px 11px;border-radius:12px;background:color-mix(in srgb,var(--color-accent) 9%,var(--bg-main))}.ai-dictionary-note-text{margin:0;color:var(--text-muted);font-size:.76rem;font-weight:600;line-height:1.45}.ai-dictionary-result.is-error{justify-items:start;border-color:color-mix(in srgb,var(--color-error) 42%,var(--border-color));background:color-mix(in srgb,var(--color-error) 7%,var(--bg-card));box-shadow:none}.ai-dictionary-error-text{margin:0;color:var(--color-error);font-size:.8rem;font-weight:750;line-height:1.45}.ai-dictionary-retry{min-height:34px;padding:5px 11px;color:var(--color-primary);border:1.5px solid var(--color-primary);border-radius:10px;background:transparent;font:inherit;font-size:.75rem;font-weight:850;cursor:pointer}@media(max-width:380px){.ai-chat-topic-screen{padding:14px}.ai-dictionary-form{grid-template-columns:1fr}.ai-dictionary-form button{width:100%}}@media(prefers-reduced-motion:reduce){.ai-chat-panel,.ai-chat-bubble,.ai-chat-bubble-wrapper,.ai-chat-dot,.ai-dictionary-status[data-tone=loading]:before{animation:none!important}.ai-chat-fab,.ai-chat-mode-card,.ai-dictionary-form button{transition-duration:.01ms!important}}@media(max-width:520px){.deck-mindmap-viewport{min-height:365px}.mindmap-toolbar{grid-template-columns:1fr auto}.mindmap-title{grid-column:1 / -1;grid-row:1}.mindmap-toolbar .text-btn{grid-row:2}.mindmap-zoom-controls{grid-column:2;grid-row:2}.mindmap-root{width:156px;min-height:102px}.mindmap-word-node{width:140px;min-height:84px}}.speak-workspace{width:min(100%,530px);display:grid;justify-items:center;gap:14px;padding:22px 18px 18px;border:2px solid var(--border-color);border-radius:22px;background:linear-gradient(145deg,color-mix(in srgb,var(--color-primary) 10%,var(--bg-card)),var(--bg-card) 56%);box-shadow:var(--shadow-card);text-align:center}.speak-lead{max-width:390px;margin:0;color:var(--text-muted);font-size:.88rem;font-weight:650;line-height:1.5}.speak-recording-timer{width:min(100%,280px);position:relative;overflow:hidden;padding:9px 14px;color:var(--text-main);border:1.5px solid var(--border-color);border-radius:999px;background:var(--bg-main);font-size:.84rem;font-weight:800;isolation:isolate}.speak-recording-timer:before{position:absolute;z-index:-1;top:0;bottom:0;left:0;width:var(--recording-progress, 0%);content:"";background:color-mix(in srgb,var(--color-primary) 17%,transparent);transition:width .1s linear}.speak-actions{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(108px,.65fr);width:100%;gap:10px}.speak-login-btn{min-height:48px;display:inline-flex;align-items:center;justify-content:center;padding:10px 16px;font-size:.88rem;text-decoration:none}.speak-record-btn{min-height:52px;padding:10px 14px;color:#fff;border:2px solid var(--color-primary);border-bottom-width:5px;border-radius:15px;background:linear-gradient(135deg,var(--color-primary),var(--color-secondary));box-shadow:0 6px 17px color-mix(in srgb,var(--color-primary) 28%,transparent);font:inherit;font-size:.9rem;font-weight:900;cursor:pointer;transition:transform .15s ease,filter .15s ease}.speak-record-btn:hover:not(:disabled){filter:brightness(1.05);transform:translateY(-1px)}.speak-record-btn:active:not(:disabled){transform:translateY(2px);border-bottom-width:3px}.speak-record-btn.is-recording{border-color:#f04d63;background:linear-gradient(135deg,#ef4660,#fc7a5d);animation:speak-pulse 1.15s ease-in-out infinite}.speak-record-btn:disabled,.speak-skip-btn:disabled{cursor:not-allowed;opacity:.62}.speak-skip-btn{min-height:52px;padding:8px 12px;font-size:.9rem}.speak-status{min-height:1.45em;margin:0;color:var(--text-muted);font-size:.83rem;font-weight:700;line-height:1.45}.speak-status[data-tone=recording]{color:#d84b5d}.speak-status[data-tone=success]{color:var(--color-success)}.speak-status[data-tone=error]{color:var(--color-error)}.speak-outcome{display:grid;width:100%;gap:7px}.speak-transcript,.speak-score{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin:0;padding:10px 12px;border:1.5px solid var(--border-color);border-radius:12px;background:var(--bg-main);color:var(--text-muted);font-size:.82rem;text-align:left}.speak-transcript strong{min-width:0;overflow-wrap:anywhere;color:var(--text-main);font-size:.91rem}.speak-outcome-label{flex:0 0 auto;font-weight:700}.speak-score strong{color:var(--color-primary);font-size:1rem}.speak-score.passed{border-color:var(--color-success-border);background:var(--color-success-bg)}.speak-score.passed strong{color:var(--color-success)}.speak-quota{color:var(--text-muted);font-size:.72rem;font-weight:650}.target-pair{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin:0;padding:10px 12px;border:1.5px solid var(--border-color);border-radius:12px;background:var(--bg-main);color:var(--text-muted);font-size:.82rem;font-weight:700;text-align:left}.target-pair strong{min-width:0;color:var(--text-main);font-size:.91rem;overflow-wrap:anywhere}.speak-workspace.is-busy .speak-recording-timer{border-color:color-mix(in srgb,var(--color-primary) 55%,var(--border-color))}@keyframes speak-pulse{50%{box-shadow:0 0 0 8px color-mix(in srgb,#ef4660 18%,transparent),0 8px 21px color-mix(in srgb,#ef4660 28%,transparent)}}.speak-tiles{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:center;gap:10px 8px;width:100%;padding:4px 2px 2px;perspective:640px}.speak-tile{--letters: 4;--speak-miss: #ea7a1c;display:inline-flex;align-items:flex-end;justify-content:center;min-width:calc(var(--letters) * .62em + 16px);min-height:2.2em;padding:4px 9px 5px;color:var(--text-muted);border:1.5px solid transparent;border-bottom:3px solid color-mix(in srgb,var(--text-muted) 42%,transparent);border-radius:11px 11px 7px 7px;background:color-mix(in srgb,var(--bg-main) 72%,transparent);font-size:1.16rem;font-weight:850;line-height:1.25;letter-spacing:.01em;transform-origin:50% 85%;transition:color .2s ease,background-color .2s ease,border-color .2s ease,box-shadow .3s ease}.speak-tile-text{visibility:hidden;white-space:nowrap}.speak-tile.is-revealed .speak-tile-text{visibility:visible}.speak-tile.is-static{min-width:0;padding-inline:2px;border-color:transparent;background:none}.speak-tile.is-next{border-bottom-color:var(--color-primary);animation:speak-tile-next 1.1s ease-in-out infinite}.speak-tile.is-hit{color:var(--color-success);border-color:var(--color-success-border);border-bottom-color:var(--color-success);background:var(--color-success-bg);box-shadow:0 6px 18px color-mix(in srgb,var(--color-success) 26%,transparent);animation:speak-tile-flip .45s cubic-bezier(.2,.8,.3,1.25)}.speak-tile.is-miss{color:var(--speak-miss);border-color:color-mix(in srgb,var(--speak-miss) 35%,transparent);border-bottom-color:var(--speak-miss);background:color-mix(in srgb,var(--speak-miss) 12%,var(--bg-main))}.speak-interim{width:100%;margin:-4px 0 0;overflow-wrap:anywhere;color:var(--text-muted);font-size:.82rem;font-weight:650;line-height:1.45;opacity:.85}.speak-interim em{color:var(--text-main);font-style:italic}.speak-interim[hidden]{display:none}@keyframes speak-tile-flip{0%{transform:rotateX(88deg) scale(.92);opacity:.4}60%{transform:rotateX(-14deg) scale(1.07);opacity:1}to{transform:none}}@keyframes speak-tile-next{50%{border-bottom-color:color-mix(in srgb,var(--color-primary) 30%,transparent)}}@media(prefers-reduced-motion:reduce){.speak-record-btn.is-recording,.speak-tile.is-hit,.speak-tile.is-next{animation:none}}@media(max-width:420px){.speak-workspace{padding:18px 13px 15px;border-radius:18px}.speak-actions{grid-template-columns:1fr}.speak-actions>button{width:100%}.speak-tile{font-size:1.02rem;padding-inline:7px}}.sentence-workspace{width:min(100%,560px);display:grid;justify-items:center;gap:13px;padding:22px 18px 18px;border:2px solid var(--border-color);border-radius:22px;background:linear-gradient(145deg,color-mix(in srgb,var(--color-primary) 10%,var(--bg-card)),var(--bg-card) 56%);box-shadow:var(--shadow-card);text-align:center}.sentence-lead{max-width:460px;margin:0;color:var(--text-muted);font-size:.88rem;font-weight:650;line-height:1.5}.sentence-lead strong{color:var(--text-main)}.sentence-input{width:100%;min-height:86px;box-sizing:border-box;padding:12px 14px;color:var(--text-main);border:1.5px solid var(--border-color);border-radius:14px;background:var(--bg-main);font:inherit;font-size:1rem;font-weight:650;line-height:1.5;resize:vertical;transition:border-color .15s ease}.sentence-input:focus{outline:3px solid color-mix(in srgb,var(--color-primary) 35%,transparent);border-color:var(--color-primary)}.sentence-input:disabled{cursor:not-allowed;opacity:.62}.sentence-actions{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(108px,.65fr);width:100%;gap:10px}.sentence-login-btn{min-height:48px;display:inline-flex;align-items:center;justify-content:center;padding:10px 16px;font-size:.88rem;text-decoration:none}.sentence-submit-btn{min-height:52px;padding:10px 14px;color:#fff;border:2px solid var(--color-primary);border-bottom-width:5px;border-radius:15px;background:linear-gradient(135deg,var(--color-primary),var(--color-secondary));box-shadow:0 6px 17px color-mix(in srgb,var(--color-primary) 28%,transparent);font:inherit;font-size:.9rem;font-weight:900;cursor:pointer;transition:transform .15s ease,filter .15s ease}.sentence-submit-btn:hover:not(:disabled){filter:brightness(1.05);transform:translateY(-1px)}.sentence-submit-btn:active:not(:disabled){transform:translateY(2px);border-bottom-width:3px}.sentence-submit-btn:disabled,.sentence-skip-btn:disabled{cursor:not-allowed;opacity:.62}.sentence-skip-btn{min-height:52px;padding:8px 12px;font-size:.9rem}.sentence-status{min-height:1.45em;max-width:480px;margin:0;color:var(--text-muted);font-size:.83rem;font-weight:700;line-height:1.45}.sentence-status[data-tone=success]{color:var(--color-success)}.sentence-status[data-tone=error]{color:var(--color-error)}.sentence-outcome{display:grid;width:100%;gap:7px;text-align:left}.sentence-score{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin:0;padding:10px 12px;border:1.5px solid var(--border-color);border-radius:12px;background:var(--bg-main);color:var(--text-muted);font-size:.82rem}.sentence-score>span:first-child{font-weight:700}.sentence-score strong{color:var(--color-primary);font-size:1rem}.sentence-score.passed{border-color:var(--color-success-border);background:var(--color-success-bg)}.sentence-score.passed strong{color:var(--color-success)}.sentence-feedback{margin:0;padding:10px 12px;border:1.5px dashed var(--border-color);border-radius:12px;background:var(--bg-main);color:var(--text-main);font-size:.83rem;line-height:1.5;overflow-wrap:anywhere;font-weight:650}.sentence-example{display:flex;gap:8px;margin:0;padding:10px 12px;border:1.5px solid var(--border-color);border-radius:12px;background:var(--bg-main);color:var(--text-muted);font-size:.82rem;font-weight:700;line-height:1.5}.sentence-example strong{min-width:0;color:var(--color-success);overflow-wrap:anywhere}.sentence-quota{color:var(--text-muted);font-size:.72rem;font-weight:650}.sentence-workspace.is-busy .sentence-input{border-color:color-mix(in srgb,var(--color-primary) 55%,var(--border-color))}@media(max-width:420px){.sentence-workspace{padding:18px 13px 15px;border-radius:18px}.sentence-actions{grid-template-columns:1fr}.sentence-actions>button{width:100%}}.custom-mode-summary-row{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:13px}.custom-mode-summary{min-width:0;margin:0;color:var(--text-muted);font-size:.8rem;font-weight:700;line-height:1.4}.custom-mode-config{min-height:42px;flex:0 0 auto;padding:8px 12px;font-size:.8rem}.custom-mode-modal{width:min(540px,100%);max-height:min(710px,calc(100dvh - 32px));display:flex;flex-direction:column;overflow:hidden;color:var(--text-main);border:2px solid var(--border-color);border-radius:24px;background:var(--bg-card);box-shadow:0 8px 0 var(--border-color),0 22px 54px #0006;animation:modal-pop .24s cubic-bezier(.34,1.56,.64,1)}.custom-mode-list{display:grid;min-height:0;gap:7px;overflow-y:auto;padding:15px 22px}.custom-mode-row{min-height:58px;display:flex;align-items:center;gap:12px;padding:9px 11px;border:1.5px solid var(--border-color);border-radius:14px;background:var(--bg-main);cursor:pointer}.custom-mode-row:has(input:checked){border-color:var(--color-primary);background:color-mix(in srgb,var(--color-primary) 8%,var(--bg-card))}.custom-mode-row.unavailable{opacity:.68}.custom-mode-row input{width:20px;height:20px;flex:0 0 auto;accent-color:var(--color-primary)}.custom-mode-copy{min-width:0;display:grid;gap:2px}.custom-mode-copy strong{color:var(--text-main);font-size:.9rem}.custom-mode-copy small{color:var(--text-muted);font-size:.74rem;font-weight:650}.custom-result-breakdown{grid-column:1 / -1;margin:2px 0 0;color:var(--text-muted);font-size:.78rem;font-weight:700;line-height:1.45;text-align:center}.speed-fall-game{width:100%;display:grid;gap:12px}.speed-fall-arena{position:relative;width:100%;min-height:clamp(440px,64vh,680px);overflow:hidden;border:2px solid color-mix(in srgb,var(--color-primary) 44%,var(--border-color));border-radius:24px;background:radial-gradient(ellipse at 50% -22%,color-mix(in srgb,var(--color-secondary) 28%,transparent),transparent 54%),linear-gradient(180deg,color-mix(in srgb,var(--bg-card) 74%,var(--color-primary)),var(--bg-main));box-shadow:inset 0 -25px 38px color-mix(in srgb,var(--color-primary) 9%,transparent),var(--shadow-card)}.speed-fall-grid{position:absolute;inset:0;pointer-events:none;opacity:.33;background-image:linear-gradient(90deg,transparent calc(33.333% - 1px),color-mix(in srgb,var(--border-color) 74%,transparent) calc(33.333% - 1px),color-mix(in srgb,var(--border-color) 74%,transparent) 33.333%,transparent 33.333%,transparent calc(66.666% - 1px),color-mix(in srgb,var(--border-color) 74%,transparent) calc(66.666% - 1px),color-mix(in srgb,var(--border-color) 74%,transparent) 66.666%,transparent 66.666%)}.speed-danger-line{position:absolute;z-index:3;right:12px;bottom:74px;left:12px;height:3px;display:flex;align-items:center;justify-content:center;color:var(--color-error);border-radius:999px;background:linear-gradient(90deg,transparent,var(--color-error) 11%,var(--color-error) 89%,transparent);box-shadow:0 0 12px color-mix(in srgb,var(--color-error) 52%,transparent);font-size:.62rem;font-weight:950;letter-spacing:.13em;text-shadow:0 1px var(--bg-card)}.falling-word-card{position:absolute;z-index:2;top:0;width:min(29%,220px);min-height:78px;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:5px;padding:10px 12px;color:var(--text-main);border:2px solid color-mix(in srgb,var(--color-primary) 45%,var(--border-color));border-bottom-width:5px;border-radius:17px;background:color-mix(in srgb,var(--bg-card) 92%,var(--color-primary));box-shadow:0 8px 22px color-mix(in srgb,var(--color-primary) calc(var(--fall-glow, .2) * 55%),transparent);text-align:center;will-change:transform,opacity}.falling-word-vietnamese{display:block;width:100%;overflow:hidden;font-size:clamp(.88rem,2.3vw,1.05rem);font-weight:950;line-height:1.17;overflow-wrap:anywhere;transition:opacity .2s ease}.falling-word-english{display:block;width:100%;overflow:hidden;color:var(--text-muted);opacity:.35;font-size:clamp(.65rem,1.6vw,.76rem);font-weight:600;line-height:1.2;letter-spacing:.03em;overflow-wrap:anywhere}.falling-word-cleared{z-index:99!important;overflow:visible!important;pointer-events:none;border-color:var(--color-success)!important;border-width:2px!important;border-bottom-width:5px!important;background:color-mix(in srgb,var(--color-success-bg) 88%,var(--bg-card))!important;box-shadow:0 8px 24px color-mix(in srgb,var(--color-success) 35%,transparent),0 0 16px color-mix(in srgb,var(--color-success) 25%,transparent)!important;animation:falling-card-burst .7s cubic-bezier(.22,1,.36,1) forwards!important}.falling-word-cleared .falling-word-vietnamese,.falling-word-cleared .falling-word-english{display:block!important;width:100%!important;opacity:1!important;color:#fff!important;background:transparent!important;padding:0!important;text-shadow:0 1px 3px rgba(0,0,0,.45),0 0 10px color-mix(in srgb,var(--color-success) 55%,transparent)!important}.falling-word-cleared .falling-word-vietnamese{font-size:clamp(.88rem,2.3vw,1.05rem)!important;font-weight:950!important}.falling-word-cleared .falling-word-english{font-size:clamp(.78rem,2vw,.95rem)!important;font-weight:800!important;letter-spacing:.02em!important;animation:falling-english-zoom .7s cubic-bezier(.22,1,.36,1) forwards!important}.falling-word-missed{pointer-events:none;border-color:var(--color-error-border);background:var(--color-error-bg);animation:falling-miss .9s ease-out forwards}.falling-word-skipped{pointer-events:none;border-color:var(--border-color);animation:falling-skip .9s ease-out forwards}.falling-word-missed .falling-word-vietnamese,.falling-word-missed .falling-word-english,.falling-word-skipped .falling-word-vietnamese,.falling-word-skipped .falling-word-english{opacity:1;color:var(--text-main)}.falling-word-missed .falling-word-english,.falling-word-skipped .falling-word-english{font-weight:800}.falling-word-rain{--rain-hint: hsl(45, 95%, 58%)}:root[data-theme=light] .falling-word-rain{--rain-hint: hsl(38, 92%, 36%)}.falling-word-rain .falling-word-english{color:var(--text-muted);opacity:.85;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:clamp(.9rem,2.4vw,1.1rem);font-weight:800;letter-spacing:.18em;white-space:pre-wrap}.falling-word-hint{color:var(--rain-hint)}.falling-word-typed{color:var(--color-success);text-shadow:0 0 10px color-mix(in srgb,var(--color-success) 60%,transparent)}.falling-word-rain.falling-word-typing{border-color:var(--color-success);box-shadow:0 0 0 3px color-mix(in srgb,var(--color-success) 28%,transparent),0 8px 22px color-mix(in srgb,var(--color-success) 30%,transparent)}.falling-word-rain.falling-word-typing .falling-word-english{opacity:1}@keyframes falling-card-burst{0%{transform:translate(-50%,var(--fall-y, 0px)) scale(1);opacity:1}35%{transform:translate(-50%,calc(var(--fall-y, 0px) - 10px)) scale(1.12);opacity:1}75%{transform:translate(-50%,calc(var(--fall-y, 0px) - 14px)) scale(1.08);opacity:.9}to{transform:translate(-50%,calc(var(--fall-y, 0px) - 20px)) scale(1);opacity:0}}@keyframes falling-english-zoom{0%{transform:scale(.9);opacity:.7}35%{transform:scale(1.15);opacity:1}75%{transform:scale(1.1);opacity:1}to{transform:scale(1);opacity:0}}@keyframes falling-miss{0%,55%{opacity:1}to{opacity:0;filter:saturate(.4)}}@keyframes falling-skip{0%,55%{opacity:1}to{opacity:0;filter:grayscale(.45)}}.speed-input-dock{position:relative;z-index:4;margin-top:-48px;padding:0 18px}.speed-fall-input{width:100%;min-height:56px;margin:0;border-width:2px 2px 5px;border-color:var(--color-primary);border-radius:16px;background:var(--bg-card);box-shadow:0 8px 24px color-mix(in srgb,var(--color-primary) 16%,transparent);font-size:max(16px,1.16rem);font-weight:750}.speedtype-stats{flex-wrap:wrap}.monster-scene{--hero-w: clamp(76px, 13%, 124px);--foe-w: clamp(84px, 14%, 128px);--sky-top: hsl(256, 45%, 22%);--sky-bottom: hsl(222, 60%, 42%);--sun: hsl(45, 95%, 62%);--hill-back: hsl(140, 30%, 30%);--hill-front: hsl(135, 34%, 25%);--grass: hsl(120, 45%, 36%);--soil: hsl(25, 42%, 24%);--prompt-bg: hsla(222, 47%, 10%, .78);position:relative;width:100%;height:clamp(360px,58vh,560px);overflow:hidden;border:2px solid color-mix(in srgb,var(--color-primary) 44%,var(--border-color));border-radius:24px;background:linear-gradient(180deg,var(--sky-top),var(--sky-bottom) 72%);box-shadow:var(--shadow-card);cursor:text}:root[data-theme=light] .monster-scene{--sky-top: hsl(205, 85%, 62%);--sky-bottom: hsl(195, 80%, 86%);--sun: hsl(50, 100%, 62%);--hill-back: hsl(110, 45%, 66%);--hill-front: hsl(115, 42%, 58%);--grass: hsl(95, 65%, 50%);--soil: hsl(28, 50%, 36%);--prompt-bg: hsla(190, 55%, 22%, .88)}.monster-sun{position:absolute;top:150px;right:26px;width:clamp(44px,8vw,70px);aspect-ratio:1;border-radius:50%;background:var(--sun);box-shadow:0 0 0 10px color-mix(in srgb,var(--sun) 25%,transparent),0 0 40px var(--sun)}.monster-cloud{position:absolute;width:96px;height:26px;border-radius:999px;background:#ffffffe0;animation:monster-cloud 38s linear infinite}.monster-cloud:before,.monster-cloud:after{content:"";position:absolute;bottom:8px;border-radius:50%;background:inherit}.monster-cloud:before{left:16px;width:38px;height:34px}.monster-cloud:after{left:44px;width:30px;height:26px}.monster-cloud-a{top:168px;left:8%}.monster-cloud-b{top:220px;left:52%;transform:scale(.7);opacity:.7;animation-duration:52s}:root:not([data-theme=light]) .monster-cloud{opacity:.35}.monster-hill{position:absolute;bottom:30px;border-radius:50% 50% 0 0}.monster-hill-back{left:-10%;width:70%;height:32%;background:var(--hill-back)}.monster-hill-front{right:-12%;width:75%;height:24%;background:var(--hill-front)}.monster-tree{position:absolute;bottom:40px;width:12px;height:22px;background:#6f472a;border-radius:3px}.monster-tree:before{content:"";position:absolute;bottom:14px;left:50%;width:46px;height:42px;border-radius:50%;transform:translate(-50%);background:color-mix(in srgb,var(--grass) 80%,black)}.monster-tree-a{left:22%}.monster-tree-b{left:48%;transform:scale(.8);transform-origin:bottom}.monster-tree-c{left:76%}.monster-ground{position:absolute;right:0;bottom:0;left:0;height:40px;background:linear-gradient(180deg,var(--grass) 0 34%,var(--soil) 34%)}.monster-hero{position:absolute;z-index:2;bottom:32px;left:3%;width:var(--hero-w);aspect-ratio:1}.monster-hero .panda-actor__motion{overflow:visible}.monster-hero :is(.panda-actor__sprite,.panda-actor__fallback){filter:drop-shadow(0 6px 8px rgba(18,24,38,.2))}.monster-foe{position:absolute;z-index:2;bottom:30px;left:calc(3% + var(--hero-w) + (97% - var(--hero-w) - var(--foe-w) - 12px) * var(--monster-x, 1));width:var(--foe-w)}.monster-foe svg{display:block;width:100%;animation:monster-walk .6s ease-in-out infinite alternate;transform-origin:bottom center}.monster-scene[data-danger=true] .monster-foe svg{filter:drop-shadow(0 0 10px var(--color-error));animation-duration:.3s}.monster-foe.is-pushed{transition:left .45s cubic-bezier(.2,.8,.3,1.2)}.monster-foe.is-pushed svg{animation:monster-pushed .45s ease-out}.monster-foe.is-biting svg{animation:monster-bite .4s ease-in-out 2}.monster-prompt{position:absolute;z-index:3;top:14px;left:50%;width:min(560px,calc(100% - 28px));display:flex;align-items:center;flex-direction:column;gap:6px;padding:12px 14px 14px;color:#fff;border:1px solid rgba(255,255,255,.22);border-radius:18px;background:var(--prompt-bg);box-shadow:0 10px 28px #00000040;transform:translate(-50%);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);text-align:center}.monster-prompt-label{color:#afea86;font-size:.68rem;font-weight:900;letter-spacing:.12em;text-transform:uppercase}.monster-meaning{font-size:clamp(1rem,2.6vw,1.25rem);font-weight:850}.monster-slots{display:flex;flex-wrap:wrap;justify-content:center;gap:6px}.monster-slot{width:clamp(26px,5vw,34px);height:clamp(32px,6vw,40px);display:grid;place-items:center;border:2px solid rgba(255,255,255,.28);border-radius:8px;background:#ffffff14;font-size:clamp(.95rem,2.4vw,1.15rem);font-weight:900;text-transform:uppercase}.monster-slot-hint{color:#ffffffe6;border-style:dashed;border-color:#fff9}.monster-slot-typed{color:#fff;border-color:var(--color-success);background:color-mix(in srgb,var(--color-success) 75%,transparent);box-shadow:0 0 10px color-mix(in srgb,var(--color-success) 55%,transparent)}.monster-slot-reveal{color:#ffd966;border-color:#fac72e}.monster-slot-gap{width:10px;border:0;background:none}.monster-slot-mark{width:auto;border:0;background:none}.monster-slot.is-wrong{border-color:var(--color-error);background:color-mix(in srgb,var(--color-error) 45%,transparent);animation:monster-slot-wrong .35s ease-in-out}.monster-input{position:absolute;bottom:0;left:50%;width:1px;height:1px;padding:0;border:0;opacity:0;font-size:16px;pointer-events:none}@keyframes monster-cloud{0%{translate:-30vw 0}to{translate:60vw 0}}@keyframes monster-walk{0%{transform:translateY(0) rotate(-3deg)}to{transform:translateY(-5px) rotate(3deg)}}@keyframes monster-pushed{0%{transform:rotate(0)}40%{transform:rotate(14deg) scale(.92)}to{transform:rotate(0)}}@keyframes monster-bite{0%,to{transform:translate(0) scale(1)}50%{transform:translate(-10px) scale(1.08)}}@keyframes monster-slot-wrong{0%,to{translate:0}25%{translate:-4px 0}75%{translate:4px 0}}@media(max-width:520px){.monster-scene{height:clamp(340px,56dvh,480px);border-radius:19px}.monster-slots{gap:4px}.monster-tree-b{display:none}}@media(prefers-reduced-motion:reduce){.monster-cloud,.monster-foe svg,.monster-foe.is-pushed svg,.monster-foe.is-biting svg,.monster-slot.is-wrong{animation:none}.monster-foe.is-pushed{transition:none}}.shooter-arena{--arena-top: hsl(300, 45%, 12%);--arena-bottom: hsl(262, 42%, 5%);--arena-edge: hsla(300, 70%, 55%, .28);--timer-track: hsla(0, 0%, 100%, .08);position:relative;width:100%;height:clamp(440px,64vh,680px);overflow:hidden;border:2px solid var(--arena-edge);border-radius:24px;background:radial-gradient(ellipse at 50% 112%,hsla(300,85%,50%,.2),transparent 55%),linear-gradient(180deg,var(--arena-top),var(--arena-bottom));box-shadow:var(--shadow-card);touch-action:manipulation;user-select:none;-webkit-user-select:none}:root[data-theme=light] .shooter-arena{--arena-top: hsl(292, 70%, 96%);--arena-bottom: hsl(268, 60%, 86%);--arena-edge: hsla(290, 60%, 55%, .35);--timer-track: hsla(270, 40%, 30%, .12)}.shooter-timer{position:absolute;inset:0 0 auto;height:5px;background:var(--timer-track)}.shooter-timer-fill{display:block;height:100%;background:linear-gradient(90deg,#f04ce3,#b268f3);transform:scaleX(var(--shooter-time, 1));transform-origin:left}.shooter-arena[data-urgent=true] .shooter-timer-fill{background:var(--color-error)}.shooter-field{position:absolute;inset:16px 10px 100px}.shooter-bubble{--bubble-a: hsl(300, 72%, 56%);--bubble-b: hsl(276, 68%, 48%);position:absolute;top:0;left:0;padding:10px 18px;border:2px solid hsla(300,100%,88%,.7);border-radius:999px;background:linear-gradient(135deg,var(--bubble-a),var(--bubble-b));color:#fff;font:inherit;font-size:1rem;font-weight:800;line-height:1.2;white-space:nowrap;text-shadow:0 1px 2px rgba(0,0,0,.35);box-shadow:0 6px 18px #b814b859,inset 0 2px #ffffff40;cursor:crosshair;will-change:transform;animation:shooter-bubble-in .35s ease-out}.shooter-bubble:nth-child(3n+2){--bubble-a: hsl(318, 75%, 58%);--bubble-b: hsl(326, 70%, 44%)}.shooter-bubble:nth-child(3n){--bubble-a: hsl(284, 70%, 58%);--bubble-b: hsl(266, 65%, 46%)}.shooter-bubble:hover,.shooter-bubble:focus-visible{filter:brightness(1.15);outline:3px solid hsla(300,100%,85%,.8);outline-offset:2px}.shooter-bubble.is-wrong{--bubble-a: hsl(350, 85%, 58%);--bubble-b: hsl(356, 80%, 44%);border-color:#ffb3bf;animation:shooter-wrong .45s ease-in-out}.shooter-bubble.is-popping{pointer-events:none;animation:shooter-pop .35s ease-out forwards}.shooter-bubble.is-leaving{pointer-events:none;animation:shooter-leave .4s ease-in forwards}.shooter-cannon{--cannon-angle: 0deg;position:absolute;bottom:8px;left:50%;width:64px;height:84px;translate:-50% 0;pointer-events:none}.shooter-barrel{position:absolute;bottom:34px;left:50%;width:14px;height:46px;margin-left:-7px;border-radius:7px 7px 3px 3px;background:linear-gradient(90deg,#858ea3,#e6e9ef 45%,#737e96);transform:rotate(var(--cannon-angle));transform-origin:50% 100%;transition:transform .12s ease-out}.shooter-barrel:before{position:absolute;top:-4px;left:-3px;width:20px;height:8px;border-radius:4px;background:#f47bf4;content:""}.shooter-cannon.is-firing .shooter-barrel:after{position:absolute;top:-22px;left:50%;width:28px;height:28px;margin-left:-14px;border-radius:50%;background:radial-gradient(circle,#fff,hsla(300,100%,72%,.85) 40%,transparent 70%);content:"";animation:shooter-flash .22s ease-out forwards}.shooter-ball{position:absolute;bottom:12px;left:50%;width:42px;height:42px;margin-left:-21px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fcf,#eb47eb 45%,#831da5);box-shadow:0 0 18px #f53df58c}.shooter-cannon.is-firing .shooter-ball{animation:shooter-recoil .22s ease-out}.shooter-base{position:absolute;bottom:0;left:50%;width:54px;height:16px;margin-left:-27px;border:2px solid hsl(300,70%,70%);border-radius:8px 8px 6px 6px;background:#5b206f}.shooter-bullet{position:absolute;top:-6px;left:-6px;z-index:3;width:12px;height:12px;border-radius:50%;background:#fff;box-shadow:0 0 10px 4px #ff66ffe6;pointer-events:none}.shooter-bullet:after{position:absolute;top:10px;left:3px;width:6px;height:34px;border-radius:3px;background:linear-gradient(hsla(300,100%,78%,.85),transparent);content:""}.shooter-burst{position:absolute;z-index:2;width:0;height:0;pointer-events:none}.shooter-burst:before{position:absolute;top:-30px;left:-30px;width:60px;height:60px;border:3px solid hsl(300,100%,76%);border-radius:50%;content:"";animation:shooter-ring .5s ease-out forwards}.shooter-burst-piece{position:absolute;top:-5px;left:-5px;width:10px;height:10px;border-radius:3px;background:#ff70ff;animation:shooter-piece .6s ease-out forwards}.shooter-burst.is-miss:before{border-color:var(--color-error)}.shooter-burst.is-miss .shooter-burst-piece{background:var(--color-error);animation-duration:.4s}@keyframes shooter-bubble-in{0%{opacity:0;scale:.3}to{opacity:1;scale:1}}@keyframes shooter-pop{to{opacity:0;scale:1.6}}@keyframes shooter-leave{to{opacity:0;scale:.5}}@keyframes shooter-wrong{0%,to{rotate:0deg}25%{rotate:-6deg}75%{rotate:6deg}}@keyframes shooter-flash{0%{opacity:1;scale:.6}to{opacity:0;scale:1.4}}@keyframes shooter-recoil{40%{translate:0 4px}}@keyframes shooter-ring{0%{opacity:1;scale:.4}to{opacity:0;scale:1.5}}@keyframes shooter-piece{0%{opacity:1;transform:rotate(var(--burst-angle)) translateY(0) scale(1)}to{opacity:0;transform:rotate(var(--burst-angle)) translateY(-58px) scale(.3)}}@media(max-width:520px){.shooter-arena{height:clamp(420px,60dvh,560px);border-radius:19px}.shooter-field{inset:14px 6px 96px}.shooter-bubble{padding:8px 13px;font-size:.88rem}}@media(prefers-reduced-motion:reduce){.shooter-bubble,.shooter-bubble.is-wrong,.shooter-cannon.is-firing .shooter-ball,.shooter-burst-piece{animation:none}.shooter-burst-piece{display:none}.shooter-barrel{transition:none}}@media(prefers-reduced-motion:reduce){.falling-word-cleared,.falling-word-missed,.falling-word-skipped{animation:none;opacity:0}.falling-word-cleared .falling-word-english{animation:none}}@media(max-width:520px){.custom-mode-modal{width:100%;max-height:86dvh;border-radius:24px 24px 0 0;border-bottom:0}.custom-mode-list{padding-right:16px;padding-left:16px}.custom-mode-summary-row{align-items:flex-start;flex-direction:column}.custom-mode-config{width:100%}.speed-fall-arena{min-height:clamp(420px,60dvh,560px);border-radius:19px}.speed-fall-grid{background-image:linear-gradient(90deg,transparent calc(50% - 1px),color-mix(in srgb,var(--border-color) 74%,transparent) calc(50% - 1px),color-mix(in srgb,var(--border-color) 74%,transparent) 50%,transparent 50%)}.falling-word-card{width:min(43%,182px);min-height:74px;padding:9px 8px}.speed-input-dock{padding:0 11px}.infinite-stop-btn{padding-inline:8px;font-size:.7rem}}@media(prefers-reduced-motion:reduce){.memory-card-inner{transition:none}.memory-card.is-wrong,.listen-match-audio.playing{animation:none}}.learning-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;margin:18px 0 16px;padding:4px;border:1px solid color-mix(in srgb,var(--border-color) 80%,transparent);border-radius:17px;background:color-mix(in srgb,var(--bg-secondary) 88%,var(--bg-card));box-shadow:inset 0 1px 2px #0f172a14}.learning-tab{min-width:0;min-height:48px;display:flex;align-items:center;justify-content:center;gap:8px;padding:8px 10px;border:1px solid transparent;border-radius:13px;color:var(--text-muted);background:transparent;font:inherit;font-size:.84rem;font-weight:850;line-height:1.1;cursor:pointer;transition:color .18s ease,background-color .18s ease,border-color .18s ease,box-shadow .18s ease,transform .15s ease}.learning-tab:hover:not(.active){color:var(--text-main);background:color-mix(in srgb,var(--bg-card) 62%,transparent)}.learning-tab:active{transform:translateY(1px)}.learning-tab.active{color:#fff;border-color:#fff3;background:linear-gradient(135deg,var(--color-primary),var(--color-secondary));box-shadow:0 3px color-mix(in srgb,var(--color-primary) 72%,#1e1b4b),0 7px 16px color-mix(in srgb,var(--color-primary) 24%,transparent)}.learning-tab:focus-visible{outline:3px solid color-mix(in srgb,var(--color-accent) 75%,#fff);outline-offset:2px}.learning-tab-icon{width:20px;height:20px;flex:0 0 auto;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.learning-tab-label{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.learning-tab-short{display:none}.game-mode-config{gap:0}.quick-game-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:11px}.quick-game-heading h3{margin:0!important}.game-picker-trigger{min-height:36px;display:inline-flex;align-items:center;gap:6px;padding:6px 10px 6px 12px;color:var(--color-primary);border:1.5px solid color-mix(in srgb,var(--color-primary) 34%,var(--border-color));border-radius:999px;background:color-mix(in srgb,var(--color-primary) 7%,var(--bg-card));font:inherit;font-size:.76rem;font-weight:850;cursor:pointer;white-space:nowrap;transition:transform .15s ease,border-color .15s ease,background-color .15s ease}.game-picker-trigger span{font-size:1.2rem;line-height:.7}.game-picker-trigger:hover,.game-picker-trigger[aria-expanded=true]{border-color:var(--color-primary);background:color-mix(in srgb,var(--color-primary) 12%,var(--bg-card))}.game-picker-trigger:active{transform:translateY(1px)}.game-picker-trigger:focus-visible{outline:3px solid color-mix(in srgb,var(--color-primary) 28%,transparent);outline-offset:2px}.quick-game-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.quick-game-card{position:relative;min-width:0;min-height:70px;display:grid;grid-template-columns:38px minmax(0,1fr) 18px;align-items:center;gap:10px;padding:10px 11px;color:var(--text-main);border:1.5px solid var(--border-color);border-bottom-width:4px;border-radius:16px;background:color-mix(in srgb,var(--bg-card) 94%,var(--color-primary));font:inherit;text-align:left;cursor:pointer;transition:transform .15s ease,border-color .15s ease,background-color .15s ease,box-shadow .15s ease}.quick-game-card:hover{transform:translateY(-1px);border-color:color-mix(in srgb,var(--color-primary) 52%,var(--border-color));box-shadow:0 8px 18px color-mix(in srgb,var(--color-primary) 10%,transparent)}.quick-game-card:active{transform:translateY(2px);border-bottom-width:2px}.quick-game-card:focus-visible{outline:3px solid color-mix(in srgb,var(--color-primary) 28%,transparent);outline-offset:2px}.quick-game-card.is-selected{border-color:var(--color-primary);background:color-mix(in srgb,var(--color-primary) 10%,var(--bg-card));box-shadow:0 4px color-mix(in srgb,var(--color-primary) 78%,transparent)}.quick-game-icon{width:38px;height:38px;display:grid;place-items:center;border-radius:12px;background:color-mix(in srgb,var(--color-primary) 11%,var(--bg-main));font-size:1.25rem}.quick-game-copy{min-width:0;display:grid;gap:3px}.quick-game-copy strong{overflow:hidden;color:var(--text-main);font-size:.86rem;text-overflow:ellipsis;white-space:nowrap}.quick-game-copy small{display:-webkit-box;overflow:hidden;color:var(--text-muted);font-size:.68rem;font-weight:650;line-height:1.25;-webkit-box-orient:vertical;-webkit-line-clamp:2}.quick-game-check{width:18px;height:18px;display:grid;place-items:center;opacity:0;color:#fff;border-radius:50%;background:var(--color-primary);font-size:.65rem;font-weight:950;transform:scale(.6);transition:opacity .15s ease,transform .15s ease}.quick-game-card.is-selected .quick-game-check{opacity:1;transform:scale(1)}.quick-game-empty{min-height:84px;display:flex;align-items:center;gap:13px;padding:14px;border:1.5px dashed color-mix(in srgb,var(--color-primary) 38%,var(--border-color));border-radius:16px;background:color-mix(in srgb,var(--color-primary) 5%,var(--bg-card))}.quick-game-empty-icon{width:44px;height:44px;display:grid;flex:0 0 auto;place-items:center;border-radius:14px;background:color-mix(in srgb,var(--color-primary) 12%,var(--bg-card));font-size:1.3rem}.quick-game-empty>span:last-child{display:grid;gap:3px}.quick-game-empty strong{color:var(--text-main);font-size:.86rem}.quick-game-empty small{color:var(--text-muted);font-size:.72rem;font-weight:650}.game-mode-config .custom-mode-summary-row{margin-top:10px;padding:10px 12px;border-radius:13px;background:color-mix(in srgb,var(--color-primary) 6%,var(--bg-card))}.game-picker-modal{width:min(720px,100%);max-height:min(780px,calc(100dvh - 32px));display:flex;flex-direction:column;overflow:hidden;color:var(--text-main);border:2px solid var(--border-color);border-radius:25px;background:var(--bg-card);box-shadow:0 8px 0 var(--border-color),0 24px 60px #0000006b;animation:modal-pop .24s cubic-bezier(.34,1.56,.64,1)}.game-picker-eyebrow{display:block;margin-bottom:4px;color:var(--color-primary);font-size:.65rem;font-weight:950;letter-spacing:.12em}.game-picker-tools{display:grid;gap:12px;padding:14px 20px 12px;border-bottom:1px solid var(--border-color);background:color-mix(in srgb,var(--bg-main) 55%,var(--bg-card))}.game-picker-search-wrap{min-height:44px;display:flex;align-items:center;gap:9px;padding:0 12px;color:var(--text-muted);border:1.5px solid var(--border-color);border-radius:13px;background:var(--bg-card)}.game-picker-search-wrap:focus-within{border-color:var(--color-primary);box-shadow:0 0 0 3px color-mix(in srgb,var(--color-primary) 12%,transparent)}.game-picker-search-wrap>span:first-child{font-size:1.35rem;line-height:1;transform:rotate(-15deg)}.game-picker-search-wrap input{min-width:0;width:100%;padding:0;color:var(--text-main);border:0;outline:0;background:transparent;font:inherit;font-size:.86rem;font-weight:700}.game-picker-categories{display:flex;gap:7px;overflow-x:auto;padding-bottom:2px;scrollbar-width:none}.game-picker-categories::-webkit-scrollbar{display:none}.game-picker-category{min-height:32px;flex:0 0 auto;padding:5px 11px;color:var(--text-muted);border:1px solid var(--border-color);border-radius:999px;background:var(--bg-card);font:inherit;font-size:.72rem;font-weight:800;cursor:pointer}.game-picker-category.is-active{color:#fff;border-color:var(--color-primary);background:var(--color-primary);box-shadow:0 3px color-mix(in srgb,var(--color-primary) 68%,#1e1b4b)}.game-picker-category:focus-visible{outline:3px solid color-mix(in srgb,var(--color-primary) 25%,transparent);outline-offset:2px}.game-picker-list{min-height:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-content:start;gap:9px;overflow-y:auto;padding:15px 20px}.game-picker-item{min-width:0}.game-picker-item-card{min-height:72px;display:grid;grid-template-columns:42px minmax(0,1fr) 20px;align-items:center;gap:10px;padding:10px 11px;color:var(--text-main);border:1.5px solid var(--border-color);border-radius:15px;background:var(--bg-main);cursor:pointer;transition:border-color .15s ease,background-color .15s ease,transform .15s ease}.game-picker-item:hover .game-picker-item-card{border-color:color-mix(in srgb,var(--color-primary) 55%,var(--border-color));transform:translateY(-1px)}.game-picker-item input:focus-visible+.game-picker-item-card{outline:3px solid color-mix(in srgb,var(--color-primary) 25%,transparent);outline-offset:2px}.game-picker-item input:checked+.game-picker-item-card{border-color:var(--color-primary);background:color-mix(in srgb,var(--color-primary) 9%,var(--bg-card));box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--color-primary) 24%,transparent)}.game-picker-item-icon{width:42px;height:42px;display:grid;place-items:center;border-radius:13px;background:color-mix(in srgb,var(--color-primary) 10%,var(--bg-card));font-size:1.3rem}.game-picker-item-copy{min-width:0;display:grid;gap:3px}.game-picker-item-copy strong{overflow:hidden;font-size:.84rem;text-overflow:ellipsis;white-space:nowrap}.game-picker-item-copy small{color:var(--text-muted);font-size:.68rem;font-weight:650;line-height:1.3}.game-picker-item-check{width:20px;height:20px;display:grid;place-items:center;opacity:0;color:#fff;border-radius:50%;background:var(--color-primary);font-size:.68rem;font-weight:950}.game-picker-item input:checked+.game-picker-item-card .game-picker-item-check{opacity:1}.game-picker-item.unavailable{opacity:.62}.game-picker-item.unavailable .game-picker-item-card{cursor:not-allowed}.game-picker-item.unavailable input:checked+.game-picker-item-card{border-color:var(--border-color);background:var(--bg-main);box-shadow:none}.game-picker-item.unavailable .game-picker-item-check{opacity:0!important}.game-picker-item.unavailable .game-picker-item-status{color:var(--color-error)}.game-picker-no-results{grid-column:1 / -1;margin:24px 0;color:var(--text-muted);font-size:.86rem;font-weight:750;text-align:center}.game-picker-footer{min-height:58px;display:flex;align-items:center;justify-content:space-between;gap:14px;padding:11px 20px;border-top:1px solid var(--border-color);background:color-mix(in srgb,var(--bg-main) 55%,var(--bg-card))}.game-picker-footer strong{color:var(--text-muted);font-size:.76rem;white-space:nowrap}.game-picker-unavailable-toggle{position:relative;display:inline-flex;align-items:center;gap:9px;color:var(--text-muted);font-size:.75rem;font-weight:750;cursor:pointer}.game-picker-unavailable-toggle input{position:absolute;z-index:1;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer}.game-picker-unavailable-toggle>span{position:relative;width:34px;height:20px;flex:0 0 auto;border-radius:999px;background:var(--border-color);transition:background-color .18s ease}.game-picker-unavailable-toggle>span:after{position:absolute;top:3px;left:3px;width:14px;height:14px;border-radius:50%;background:#fff;box-shadow:0 1px 3px #00000040;content:"";transition:transform .18s ease}.game-picker-unavailable-toggle input:checked+span{background:var(--color-primary)}.game-picker-unavailable-toggle input:checked+span:after{transform:translate(14px)}.game-picker-unavailable-toggle input:focus-visible+span{outline:3px solid color-mix(in srgb,var(--color-primary) 25%,transparent);outline-offset:2px}@media(max-width:520px){.learning-tabs{margin-top:14px;border-radius:15px}.learning-tab{min-height:46px;gap:5px;padding:7px 5px;font-size:.75rem}.learning-tab-icon{width:18px;height:18px}.learning-tab-long{display:none}.learning-tab-short{display:inline}.quick-game-grid{gap:8px}.quick-game-card{min-height:66px;grid-template-columns:34px minmax(0,1fr) 17px;gap:8px;padding:8px;border-radius:14px}.quick-game-icon{width:34px;height:34px;border-radius:11px;font-size:1.1rem}.quick-game-copy strong{font-size:.78rem}.quick-game-copy small{font-size:.62rem}.game-picker-modal{width:100%;max-height:88dvh;border-right:0;border-bottom:0;border-left:0;border-radius:24px 24px 0 0;animation-name:game-picker-sheet-in}.game-picker-header{padding:17px 16px 13px}.game-picker-header h2{font-size:1.18rem}.game-picker-header p{font-size:.78rem}.game-picker-tools{padding:11px 14px 10px}.game-picker-list{grid-template-columns:1fr;gap:8px;padding:12px 14px}.game-picker-item-card{min-height:66px}.game-picker-footer{padding:10px 14px calc(10px + env(safe-area-inset-bottom,0px))}.game-picker-unavailable-toggle{font-size:.7rem}}@keyframes game-picker-sheet-in{0%{opacity:0}to{opacity:1}}@media(max-width:350px){.learning-tab{flex-direction:column;gap:3px;font-size:.68rem}.learning-tab-icon{width:17px;height:17px}.quick-game-card{grid-template-columns:31px minmax(0,1fr) 16px}.quick-game-copy small{display:none}.game-picker-trigger{padding-inline:9px}}@media(prefers-reduced-motion:reduce){.learning-tab,.quick-game-card,.quick-game-check,.game-picker-modal,.game-picker-item-card,.game-picker-unavailable-toggle>span,.game-picker-unavailable-toggle>span:after{animation:none!important;transition:none!important}}.choice-card.answer-revealed,.image-option:disabled{cursor:default;opacity:1}.choice-card.correct-answer,.image-option.correct-answer{border-color:var(--color-success);background:color-mix(in srgb,var(--color-success) 19%,var(--bg-card));color:var(--text-main);box-shadow:0 0 0 1px color-mix(in srgb,var(--color-success) 45%,transparent),0 10px 24px color-mix(in srgb,var(--color-success) 23%,transparent);animation:answer-correct-pop .48s cubic-bezier(.2,1.35,.3,1)}.choice-card.wrong-answer,.image-option.wrong-answer{border-color:var(--color-error);background:color-mix(in srgb,var(--color-error) 18%,var(--bg-card));color:var(--text-main);box-shadow:0 8px 20px color-mix(in srgb,var(--color-error) 18%,transparent);animation:answer-wrong-shake .38s ease-in-out}.choice-card.answer-muted,.image-option.answer-muted{opacity:.5;filter:saturate(.55)}.choice-card.correct-answer .choice-number,.image-option.correct-answer .choice-number{border-color:var(--color-success);background:var(--color-success);color:#fff}.choice-card.wrong-answer .choice-number,.image-option.wrong-answer .choice-number{border-color:var(--color-error);background:var(--color-error);color:#fff}.choice-status{display:grid;flex:0 0 30px;width:30px;height:30px;margin-left:10px;place-items:center;border-radius:50%;color:#fff;font-size:.95rem;font-weight:950}.choice-status.is-correct{background:var(--color-success)}.choice-status.is-wrong{background:var(--color-error)}.image-option .choice-status{position:absolute;top:8px;right:8px;margin:0}.image-option{position:relative;transition:opacity var(--transition-fast),filter var(--transition-fast),border-color var(--transition-fast),background-color var(--transition-fast),box-shadow var(--transition-fast)}.typing-input.answer-input-correct{border-color:var(--color-success);background:color-mix(in srgb,var(--color-success) 10%,var(--bg-card));box-shadow:0 0 0 3px color-mix(in srgb,var(--color-success) 16%,transparent),0 10px 26px color-mix(in srgb,var(--color-success) 18%,transparent);animation:answer-correct-pop .48s cubic-bezier(.2,1.35,.3,1)}.typing-input.answer-input-wrong{border-color:var(--color-error);background:color-mix(in srgb,var(--color-error) 9%,var(--bg-card));box-shadow:0 0 0 3px color-mix(in srgb,var(--color-error) 14%,transparent);animation:answer-wrong-shake .38s ease-in-out}.sentence-slots.answer-surface-correct,.sentence-slots.answer-surface-wrong{border:2px solid;border-radius:18px}.sentence-slots.answer-surface-correct{border-color:var(--color-success);background:color-mix(in srgb,var(--color-success) 10%,transparent);box-shadow:0 10px 26px color-mix(in srgb,var(--color-success) 18%,transparent);animation:answer-correct-pop .48s cubic-bezier(.2,1.35,.3,1)}.sentence-slots.answer-surface-wrong{border-color:var(--color-error);background:color-mix(in srgb,var(--color-error) 9%,transparent);animation:answer-wrong-shake .38s ease-in-out}.answer-celebration-layer{position:absolute;inset:0;z-index:130;overflow:hidden;pointer-events:none}.answer-celebration-particle{--burst-x: 0px;--burst-y: -150px;--burst-rotate: 180deg;--burst-delay: 0ms;--burst-color: var(--color-success);position:absolute;left:50%;bottom:72px;width:8px;height:13px;border-radius:3px;background:var(--burst-color);box-shadow:0 0 8px color-mix(in srgb,var(--burst-color) 55%,transparent);animation:answer-particle-burst .88s var(--burst-delay) cubic-bezier(.15,.75,.28,1) both}.answer-celebration-particle:nth-child(3n){width:7px;height:7px;border-radius:50%}.answer-celebration-particle:nth-child(4n){width:11px;height:5px}.panda-feedback{--panda-feedback-bottom: 180px;position:absolute;left:max(8px,env(safe-area-inset-left));bottom:var(--panda-feedback-bottom);z-index:140;width:130px;pointer-events:none;-webkit-user-select:none;user-select:none;contain:layout style}.panda-feedback-visual{display:block;width:100%;aspect-ratio:1;transform-origin:45% 88%}.panda-feedback-visual :is(.panda-actor__sprite,.panda-actor__fallback){filter:drop-shadow(0 12px 16px rgba(18,24,38,.24))}.panda-feedback-bubble{position:absolute;left:68%;bottom:76%;display:inline-flex;min-height:34px;max-width:170px;padding:8px 12px;align-items:center;border:2px solid color-mix(in srgb,var(--color-success) 52%,var(--border-color));border-radius:16px 16px 16px 5px;background:color-mix(in srgb,var(--color-success-bg) 86%,var(--bg-card));color:var(--color-success);box-shadow:0 9px 24px #1218262e;font-size:.8rem;font-weight:900;line-height:1.15;white-space:nowrap;will-change:transform,opacity;animation:panda-bubble-lifecycle 1.8s ease both}.panda-feedback--wrong .panda-feedback-bubble{border-color:color-mix(in srgb,#f59e0b 58%,var(--border-color));background:color-mix(in srgb,#fef3c7 82%,var(--bg-card));color:#b45309}:root[data-theme=dark] .panda-feedback--wrong .panda-feedback-bubble{background:color-mix(in srgb,#78350f 58%,var(--bg-card));color:#fcd34d}.panda-feedback--correct{animation:panda-correct-lifecycle 1.8s cubic-bezier(.2,.82,.24,1) both}.panda-feedback--wrong{animation:panda-wrong-lifecycle 1.8s cubic-bezier(.28,.72,.32,1) both}@media(min-width:480px){.panda-feedback{width:170px;left:12px}.panda-feedback-bubble{padding:9px 14px;font-size:.9rem}}@media(min-width:900px){.panda-feedback{width:210px}.panda-feedback-bubble{font-size:.96rem}}@keyframes panda-correct-lifecycle{0%{opacity:0;transform:translate3d(-135%,24px,0) scale(.82) rotate(-7deg)}18%{opacity:1;transform:translateZ(0) scale(1) rotate(0)}31%{transform:translate3d(0,-22px,0) scale(1.045) rotate(-4deg)}43%{transform:translateZ(0) scale(1) rotate(4deg)}54%{transform:translate3d(0,-7px,0) scale(1.018) rotate(-2deg)}65%,82%{opacity:1;transform:translateZ(0) scale(1) rotate(0)}to{opacity:0;transform:translate3d(-125%,12px,0) scale(.9) rotate(-6deg)}}@keyframes panda-wrong-lifecycle{0%{opacity:0;transform:translate3d(-135%,10px,0) scale(.9) rotate(0)}28%{opacity:1;transform:translateZ(0) scale(1) rotate(0)}43%{transform:translate3d(0,8px,0) scale(.985) rotate(-3deg)}55%{transform:translate3d(-3px,7px,0) scale(.985) rotate(2deg)}66%,82%{opacity:1;transform:translate3d(0,6px,0) scale(.99) rotate(0)}to{opacity:0;transform:translate3d(-118%,10px,0) scale(.92) rotate(-3deg)}}@keyframes panda-bubble-lifecycle{0%,13%{opacity:0;transform:translate3d(-8px,8px,0) scale(.88)}25%,82%{opacity:1;transform:translateZ(0) scale(1)}to{opacity:0;transform:translate3d(-6px,4px,0) scale(.94)}}@keyframes answer-correct-pop{0%{transform:scale(.96)}62%{transform:scale(1.025)}to{transform:scale(1)}}@keyframes answer-wrong-shake{0%,to{transform:translate(0)}25%{transform:translate(-7px)}50%{transform:translate(6px)}75%{transform:translate(-3px)}}@keyframes answer-particle-burst{0%{opacity:0;transform:translate(-50%,8px) scale(.4) rotate(0)}14%{opacity:1}72%{opacity:1}to{opacity:0;transform:translate(calc(-50% + var(--burst-x)),var(--burst-y)) scale(1) rotate(var(--burst-rotate))}}.review-explanation{margin-top:4px;color:var(--text-secondary);font-size:.88rem;white-space:pre-wrap}@media(max-width:480px){.learning-tab{font-size:.83rem;padding:10px 4px}}@media(prefers-reduced-motion:reduce){.welcome-panda.is-greeting,.welcome-panda.is-idle{opacity:1;animation:welcome-panda-fade .3s ease both;transform:none}.welcome-panda.is-greeting .welcome-panda-image,.welcome-panda.is-idle .welcome-panda-image{animation:none;transform:none}.validation-drawer.correct,.validation-drawer.incorrect,.feedback-message,.feedback-symbol,.feedback-reward,.choice-card.correct-answer,.choice-card.wrong-answer,.image-option.correct-answer,.image-option.wrong-answer,.typing-input.answer-input-correct,.typing-input.answer-input-wrong,.sentence-slots.answer-surface-correct,.sentence-slots.answer-surface-wrong,.heart.shake,.matching-card.wrong,.combo-chip.pop{animation:none}.answer-celebration-layer{display:none}.panda-feedback--correct,.panda-feedback--wrong,.panda-feedback-bubble{animation:panda-feedback-fade 1.8s ease both;transform:none}.panda-actor__sprite{display:none!important;animation:none!important}.panda-actor__fallback{opacity:1!important}.panda-actor__motion{animation:none!important;transform:none!important}.mascot-small.is-question-pop{animation:none}}@keyframes welcome-panda-fade{0%{opacity:0}to{opacity:1}}@keyframes panda-feedback-fade{0%,to{opacity:0}15%,82%{opacity:1}}@media(max-width:520px){.heatmap-modal{width:100%;max-height:88dvh;border-radius:20px}.heatmap-stats{grid-template-columns:1fr;gap:8px}.heatmap-stat{display:flex;align-items:center;justify-content:space-between;padding:10px 14px}.heatmap-stat-value{margin-bottom:0;margin-right:8px;font-size:1.25rem}.heatmap-content{padding:16px;gap:14px}.heatmap-header{padding:14px 16px}.heatmap-cell[data-tooltip]:hover:after{display:none}.heatmap-cell:active:after{content:attr(data-tooltip);position:absolute;bottom:calc(100% + 4px);left:50%;transform:translate(-50%);background:var(--bg-card);border:1px solid var(--border-color);border-radius:6px;padding:4px 8px;font-size:.65rem;white-space:nowrap;z-index:10;pointer-events:none}}@media(prefers-reduced-motion:no-preference){.answers-entering .choice-card,.answers-entering>.word-tile,.answers-entering .image-option{animation:answer-enter .28s ease-out both}.answers-entering :is(.choice-card,.word-tile,.image-option):nth-child(2){animation-delay:.04s}.answers-entering :is(.choice-card,.word-tile,.image-option):nth-child(3){animation-delay:.08s}.answers-entering :is(.choice-card,.word-tile,.image-option):nth-child(4){animation-delay:.12s}.answers-entering :is(.choice-card,.word-tile,.image-option):nth-child(n+5){animation-delay:.16s}.progress-bar.pulse{animation:progress-pulse .6s ease-out}}@keyframes answer-enter{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}@keyframes progress-pulse{0%{filter:brightness(1)}35%{filter:brightness(1.45);box-shadow:0 0 16px #06d0f9b3}to{filter:brightness(1)}}.image-option:active:not(:disabled){transform:scale(.97)}.path-tiles{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}.path-tile-label{height:100%;display:grid;justify-items:center;align-content:start;gap:3px;padding:12px 10px}.path-tile-icon{font-size:1.55rem;line-height:1.2}.path-tile-name{color:var(--text-main);font-size:.92rem}.path-tile-desc{color:var(--text-muted);font-size:.72rem;font-weight:650;line-height:1.35}.tile-option input:checked+.path-tile-label .path-tile-name{color:var(--color-primary)}.path-summary{min-height:1.2em;margin:11px 0 0;color:var(--text-muted);font-size:.8rem;font-weight:700;line-height:1.45}.stage-banner{position:fixed;z-index:60;top:86px;left:50%;display:flex;align-items:center;gap:10px;max-width:calc(100vw - 32px);padding:10px 18px;color:var(--text-main);border:2px solid var(--color-primary);border-radius:999px;background:var(--bg-card);box-shadow:0 5px 0 var(--color-primary),0 14px 30px #0000002e;pointer-events:none;transform:translate(-50%,-12px);opacity:0;white-space:nowrap}.stage-banner.show{animation:stage-banner-in 1.7s cubic-bezier(.34,1.56,.64,1) forwards}.stage-banner-step{padding:2px 9px;color:#fff;border-radius:999px;background:var(--color-primary);font-size:.74rem;font-weight:900;letter-spacing:.03em}.stage-banner-name{overflow:hidden;font-size:.95rem;text-overflow:ellipsis}@keyframes stage-banner-in{0%{opacity:0;transform:translate(-50%,-12px) scale(.92)}15%,80%{opacity:1;transform:translate(-50%) scale(1)}to{opacity:0;transform:translate(-50%,-8px) scale(.98)}}@media(prefers-reduced-motion:reduce){.stage-banner.show{animation:none;opacity:1;transform:translate(-50%)}}@media(max-width:520px){.path-tiles{grid-template-columns:repeat(2,1fr);gap:10px}.stage-banner{top:72px;padding:8px 14px}}.quiz-timer{margin:0 auto 12px}.swipe-card-quiz .swipe-card-english{font-size:clamp(1.05rem,4.2vw,1.35rem);font-weight:800;line-height:1.35}.swipe-card-quiz .swipe-card-vietnamese{font-size:clamp(1.1rem,4.4vw,1.4rem);font-weight:900}.millionaire-board{width:100%;display:grid;gap:10px;margin-bottom:4px}.millionaire-status{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:4px 12px;padding:10px 14px;border:1px solid var(--border-color);border-radius:var(--radius-md);background:var(--bg-card)}.millionaire-question{color:var(--text-muted);font-size:.82rem;font-weight:800}.millionaire-bank{color:#f9c31f;font-size:1.02rem;font-weight:900;font-variant-numeric:tabular-nums}.millionaire-safe{flex-basis:100%;color:var(--text-muted);font-size:.76rem;font-weight:700}.millionaire-ladder{display:flex;flex-wrap:wrap;gap:5px;margin:0;padding:0;list-style:none}.millionaire-rung{min-width:28px;padding:3px 0;border:1px solid var(--border-color);border-radius:999px;color:var(--text-muted);font-size:.72rem;font-weight:900;text-align:center;font-variant-numeric:tabular-nums}.millionaire-rung.safe{border-color:#f9c31f}.millionaire-rung.done{border-color:var(--color-success-border);background:var(--color-success-bg);color:var(--color-success)}.millionaire-rung.current{border-color:var(--color-primary);background:var(--color-primary);color:#fff}.millionaire-lifelines{display:flex;gap:8px}.quiz-lifeline{padding:7px 14px;border:2px solid var(--color-primary);border-radius:999px;background:transparent;color:var(--color-primary);font:inherit;font-size:.85rem;font-weight:900;cursor:pointer;transition:background var(--transition-fast),opacity var(--transition-fast)}.quiz-lifeline:hover:not(:disabled){background:color-mix(in srgb,var(--color-primary) 14%,transparent)}.quiz-lifeline:focus-visible{outline:3px solid var(--color-accent);outline-offset:2px}.quiz-lifeline:disabled{cursor:not-allowed;opacity:.45}.quiz-lifeline.used{border-color:var(--border-color);color:var(--text-muted);text-decoration:line-through}:root[data-theme=light] .millionaire-bank{color:#b07207}:root[data-theme=light] .millionaire-rung.safe{border-color:#dc8f09}.deck-quiz-record{color:var(--text-muted);font-size:.78rem;font-weight:800;white-space:nowrap}.quiz-question-image{margin-bottom:4px}.quiz-question-image .vocab-image-img{max-height:min(220px,30vh)}.swipe-card-image{display:block;max-width:100%;max-height:96px;margin-top:8px;border-radius:10px;object-fit:contain;pointer-events:none}.swipe-stage:has(.swipe-card-quiz){height:auto;min-height:330px;padding:16px 0 10px}.course-root{--course-node: 68px;min-height:120px;isolation:isolate}.course-lead,.course-empty,.course-loading{margin:4px 0 14px;color:var(--text-muted);font-size:.92rem;line-height:1.5;text-align:center}.course-empty{display:grid;gap:10px;justify-items:center;padding:18px 8px}.course-list{display:grid;gap:14px}.course-list-hero{position:relative;display:flex;gap:14px;align-items:center;overflow:hidden;padding:18px;border:2px solid color-mix(in srgb,var(--color-primary) 42%,var(--border-color));border-radius:22px;background:linear-gradient(135deg,color-mix(in srgb,var(--color-primary) 18%,var(--bg-card)),color-mix(in srgb,var(--color-accent) 9%,var(--bg-card)))}.course-list-hero:after{content:"";position:absolute;right:-38px;bottom:-46px;width:130px;height:130px;border:18px solid color-mix(in srgb,var(--color-accent) 12%,transparent);border-radius:50%}.course-list-hero-icon{display:grid;place-items:center;flex:0 0 58px;height:58px;border-radius:18px;background:color-mix(in srgb,var(--color-primary) 22%,var(--bg-card));box-shadow:inset 0 -4px color-mix(in srgb,var(--color-primary) 22%,transparent);font-size:2rem}.course-list-hero-copy{position:relative;z-index:1;min-width:0}.course-eyebrow{color:var(--color-accent);font-size:.7rem;font-weight:900;letter-spacing:.11em}.course-list-heading{margin:2px 0 4px;font-size:1.2rem;line-height:1.2}.course-list-hero .course-lead{margin:0;text-align:left}.course-card{display:flex;gap:14px;align-items:center;width:100%;padding:15px 16px;color:var(--text-main);text-align:left;font:inherit;border:2px solid var(--border-color);border-bottom-width:5px;border-radius:20px;background:var(--bg-card);cursor:pointer;transition:transform var(--transition-fast),border-color var(--transition-fast),box-shadow var(--transition-fast);animation:course-card-enter .38s cubic-bezier(.2,.8,.2,1) both;animation-delay:calc(var(--course-card-index, 0) * 55ms)}.course-card:hover{border-color:color-mix(in srgb,var(--color-primary) 62%,var(--border-color));box-shadow:0 12px 28px color-mix(in srgb,var(--color-primary) 12%,transparent);transform:translateY(-2px)}.course-card:active{transform:translateY(3px);border-bottom-width:2px;margin-bottom:3px}.course-card:focus-visible{outline:3px solid var(--color-accent);outline-offset:3px}.course-card-icon{display:grid;place-items:center;flex:0 0 56px;height:56px;border:2px solid color-mix(in srgb,var(--color-primary) 32%,transparent);border-radius:18px;font-size:1.8rem;background:linear-gradient(145deg,color-mix(in srgb,var(--color-primary) 20%,transparent),color-mix(in srgb,var(--color-secondary) 10%,transparent))}.course-card-copy{display:grid;gap:5px;min-width:0;flex:1}.course-card-title{display:flex;flex-wrap:wrap;gap:6px;align-items:center;font-size:1.05rem}.course-card-desc{color:var(--text-muted);font-size:.86rem;line-height:1.4}.course-card-meta{display:flex;justify-content:space-between;gap:8px;color:var(--text-muted);font-size:.78rem;font-weight:700}.course-card-meta strong{color:var(--color-accent)}.course-card-arrow{color:var(--text-muted);font-size:1.8rem;line-height:1;transition:transform var(--transition-fast),color var(--transition-fast)}.course-card:hover .course-card-arrow{color:var(--color-primary);transform:translate(3px)}.course-draft-badge{padding:2px 8px;border-radius:999px;color:#92400e;background:#fde68a;font-size:.7rem;font-weight:800;letter-spacing:.02em}.course-progress{display:block;height:11px;overflow:hidden;border:2px solid color-mix(in srgb,var(--border-color) 80%,transparent);border-radius:999px;background:color-mix(in srgb,var(--border-color) 55%,transparent)}.course-progress-fill{position:relative;display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--color-primary),var(--color-secondary),var(--color-accent));transition:width .55s cubic-bezier(.2,.8,.2,1)}.course-progress-fill:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.35),transparent);transform:translate(-100%);animation:course-progress-shine 1.2s ease-out .25s both}@keyframes course-card-enter{0%{opacity:0;transform:translateY(12px) scale(.985)}to{opacity:1;transform:none}}@keyframes course-progress-shine{to{transform:translate(100%)}}.course-login{display:grid;gap:10px;justify-items:center;padding:22px 12px;text-align:center;border:2px dashed var(--border-color);border-radius:var(--radius-md)}.course-login p{margin:0;color:var(--text-muted);font-size:.9rem}.course-login-icon{font-size:2.4rem}.course-login-btn{display:inline-flex;width:auto;padding-inline:22px;text-decoration:none}.course-unit{--unit-color: hsl(var(--unit-hue, 220), 69%, 55%);position:relative;margin-bottom:28px;padding-bottom:4px}.course-unit-banner{position:relative;z-index:4;display:flex;gap:12px;align-items:center;justify-content:space-between;overflow:hidden;padding:16px 18px;color:#fff;border-radius:20px;background:linear-gradient(135deg,var(--unit-color),color-mix(in srgb,var(--unit-color) 68%,var(--color-primary)));box-shadow:0 6px color-mix(in srgb,var(--unit-color) 65%,#000),0 16px 32px color-mix(in srgb,var(--unit-color) 18%,transparent)}.course-unit-banner:after{content:"";position:absolute;right:72px;top:-36px;width:104px;height:104px;border:18px solid rgba(255,255,255,.08);border-radius:50%}.course-unit-copy{min-width:0}.course-unit-kicker{font-size:.72rem;font-weight:800;letter-spacing:.08em;opacity:.85}.course-unit-title{margin:2px 0 0;font-size:1.12rem}.course-unit-goal{margin:4px 0 0;font-size:.84rem;line-height:1.4;opacity:.92}.course-guide-btn{position:relative;z-index:1;flex:0 0 auto;padding:9px 12px;color:#fff;font:inherit;font-size:.84rem;font-weight:800;border:2px solid rgba(255,255,255,.55);border-bottom-width:4px;border-radius:12px;background:#ffffff24;cursor:pointer}.course-guide-btn:hover{background:#ffffff42}.course-unit-scenery{position:absolute;inset:86px 0 0;z-index:-1;overflow:hidden;pointer-events:none}.course-scenery-dot{position:absolute;width:8px;height:8px;border-radius:50%;background:color-mix(in srgb,var(--unit-color) 28%,transparent);box-shadow:0 0 0 6px color-mix(in srgb,var(--unit-color) 7%,transparent)}.course-scenery-dot.dot-one{top:18%;left:8%}.course-scenery-dot.dot-two{top:58%;right:9%;width:6px;height:6px}.course-scenery-cloud{position:absolute;top:37%;left:3%;width:42px;height:14px;border-radius:999px;background:color-mix(in srgb,var(--unit-color) 8%,transparent)}.course-scenery-cloud:before,.course-scenery-cloud:after{content:"";position:absolute;bottom:0;border-radius:50%;background:inherit}.course-scenery-cloud:before{left:7px;width:18px;height:18px}.course-scenery-cloud:after{right:5px;width:13px;height:13px}.course-trail-wrap{position:relative;width:100%;margin-top:22px}.course-trail-road{position:absolute;z-index:0;top:0;left:50%;width:220px;height:100%;overflow:visible;pointer-events:none;transform:translate(-50%)}.course-road-shadow,.course-road-line{stroke-linecap:round;stroke-width:13}.course-road-shadow{stroke:color-mix(in srgb,var(--border-color) 82%,transparent)}.course-road-line{stroke:color-mix(in srgb,var(--bg-main) 72%,var(--border-color));stroke-width:7;stroke-dasharray:3 15}.course-road-line.travelled{stroke:color-mix(in srgb,var(--unit-color) 72%,var(--color-accent));stroke-dasharray:none}.course-trail{position:relative;z-index:1;display:grid;gap:14px;justify-items:stretch;margin:0;padding:0;list-style:none}.course-step{position:relative;display:grid;width:100%;min-height:110px;justify-items:center;align-content:start;gap:4px;transform:translate(var(--trail-x, 0))}.course-step:has(.course-popover){z-index:20}.course-node{position:relative;display:grid;place-items:center;width:var(--course-node);height:var(--course-node);padding:0;color:#fff;font:inherit;font-size:1.55rem;border:4px solid color-mix(in srgb,#fff 28%,transparent);border-radius:50%;background:linear-gradient(145deg,color-mix(in srgb,var(--unit-color) 82%,#fff),var(--unit-color));box-shadow:0 7px color-mix(in srgb,var(--unit-color) 60%,#000),0 12px 24px color-mix(in srgb,var(--unit-color) 20%,transparent);cursor:pointer;transition:transform var(--transition-fast),filter var(--transition-fast)}.course-node:after{content:"";position:absolute;top:8px;left:14px;width:24px;height:10px;border-radius:50%;background:#fff3;transform:rotate(-15deg)}.course-node:hover:not(.locked){filter:brightness(1.09);transform:translateY(-2px) scale(1.035)}.course-node:active{transform:translateY(4px);box-shadow:0 2px color-mix(in srgb,var(--unit-color) 65%,#000)}.course-node:focus-visible{outline:3px solid var(--color-accent);outline-offset:4px}.course-node.done{border-color:#ffe98f;background:linear-gradient(145deg,#ffe057,#f8b10d);box-shadow:0 7px #ab6c0d,0 12px 24px #f59e0b2e}.course-node.locked{color:var(--text-muted);border-color:color-mix(in srgb,var(--border-color) 75%,transparent);background:linear-gradient(145deg,color-mix(in srgb,var(--border-color) 86%,#fff),var(--border-color));box-shadow:0 7px color-mix(in srgb,var(--border-color) 70%,#000);filter:saturate(.25)}.course-node.kind-checkpoint{width:calc(var(--course-node) + 16px);height:calc(var(--course-node) + 16px);border-radius:24px;font-size:1.8rem;transform:rotate(2deg)}.course-node.kind-checkpoint .course-node-icon{transform:rotate(-2deg)}.course-node.current{animation:course-pulse 1.8s ease-in-out infinite}.course-node-caption{position:relative;z-index:2;display:grid;width:max-content;min-width:68px;max-width:174px;justify-items:center;gap:2px;padding:2px 8px 3px;border-radius:10px;background:var(--bg-main);box-shadow:0 0 0 3px var(--bg-main)}.course-node-stars{color:#fbc523;font-size:.86rem;letter-spacing:1px;text-shadow:0 2px 5px rgba(245,158,11,.28)}.course-node-label{max-width:158px;color:var(--text-muted);font-size:.78rem;font-weight:800;text-align:center;line-height:1.3}.course-start-tag{position:absolute;z-index:3;top:-31px;padding:5px 11px;color:var(--unit-color);font-size:.7rem;font-weight:900;letter-spacing:.07em;border:2px solid color-mix(in srgb,var(--unit-color) 34%,var(--border-color));border-radius:10px;background:var(--bg-main);box-shadow:0 4px 12px #0000001f;animation:course-bob 1.8s ease-in-out infinite}.course-start-tag:after{content:"";position:absolute;left:50%;bottom:-6px;width:8px;height:8px;border-right:2px solid color-mix(in srgb,var(--unit-color) 34%,var(--border-color));border-bottom:2px solid color-mix(in srgb,var(--unit-color) 34%,var(--border-color));background:var(--bg-main);transform:translate(-50%) rotate(45deg)}.course-path-mascot{position:absolute;z-index:4;top:2px;left:calc(50% + 48px);width:62px;height:62px;pointer-events:none}.course-path-mascot :is(.panda-actor__sprite,.panda-actor__fallback){width:62px;height:62px;filter:drop-shadow(0 7px 10px rgba(0,0,0,.2))}.course-step.is-unlocked .course-node{animation:course-unlock .82s cubic-bezier(.2,1.45,.35,1) both}.course-step.is-unlocked .course-node.current{animation:course-unlock .82s cubic-bezier(.2,1.45,.35,1) both,course-pulse 1.8s ease-in-out .82s infinite}@keyframes course-pulse{0%,to{box-shadow:0 6px color-mix(in srgb,var(--unit-color) 65%,#000),0 0 color-mix(in srgb,var(--unit-color) 55%,transparent)}50%{box-shadow:0 6px color-mix(in srgb,var(--unit-color) 65%,#000),0 0 0 12px transparent}}@keyframes course-bob{0%,to{transform:translateY(0)}50%{transform:translateY(-4px)}}@keyframes course-unlock{0%{opacity:.45;transform:scale(.65) rotate(-8deg)}58%{transform:scale(1.15) rotate(4deg)}to{opacity:1;transform:none}}.course-popover{position:absolute;z-index:20;top:82px;left:50%;display:grid;gap:7px;width:min(292px,calc(100vw - 42px));padding:15px;text-align:center;border:2px solid var(--border-color);border-bottom-width:5px;border-radius:18px;background:var(--bg-main);box-shadow:0 18px 42px #00000047;animation:modal-pop .2s ease-out;transform:translate(-50%)}.course-popover:before{content:"";position:absolute;top:-8px;left:50%;width:13px;height:13px;border-top:2px solid var(--border-color);border-left:2px solid var(--border-color);background:var(--bg-main);transform:translate(-50%) rotate(45deg)}.course-popover.current,.course-popover.done{border-color:var(--unit-color)}.course-popover.current:before,.course-popover.done:before{border-color:var(--unit-color)}.course-popover-kind{justify-self:center;padding:4px 9px;color:var(--unit-color);border-radius:999px;background:color-mix(in srgb,var(--unit-color) 12%,transparent);font-size:.74rem;font-weight:900}.course-popover-title{font-size:1rem}.course-popover-meta,.course-popover-note{color:var(--text-muted);font-size:.82rem}.course-popover-best{display:flex;justify-content:space-between;gap:8px;padding:8px 10px;border-radius:11px;background:color-mix(in srgb,var(--border-color) 32%,transparent);color:var(--text-muted);font-size:.8rem;font-weight:800}.course-popover-best strong{color:#fabf0f;letter-spacing:1px}.course-popover-start{margin-top:4px;padding-block:12px}.course-guide-modal{width:min(560px,100%);max-height:min(720px,calc(100dvh - 32px));display:flex;flex-direction:column;overflow:hidden;color:var(--text-main);border:2px solid var(--border-color);border-radius:24px;background:var(--bg-main);box-shadow:0 8px 0 var(--border-color),0 22px 54px #0006;animation:modal-pop .24s cubic-bezier(.34,1.56,.64,1)}.course-guide-modal #course-guide-goal{margin:4px 0 0;color:var(--text-muted);font-size:.88rem}.course-guide-body{display:grid;gap:18px;padding:4px 20px 22px;overflow-y:auto}.course-guide-section h3{margin:0 0 8px;font-size:.95rem}.course-guide-phrase{display:flex;gap:10px;align-items:center;padding:8px 0;border-bottom:1px solid var(--border-color)}.course-guide-phrase div{display:grid;gap:2px}.course-guide-phrase span,.course-guide-pattern span{color:var(--text-muted);font-size:.86rem}.course-guide-pattern{display:grid;gap:2px;padding:8px 12px;margin-bottom:6px;border-left:4px solid var(--color-primary);border-radius:8px;background:var(--bg-card)}.course-guide-tip{padding:10px 12px;margin-bottom:8px;border-radius:12px;background:var(--bg-card)}.course-guide-tip p{margin:4px 0 0;color:var(--text-muted);font-size:.88rem;line-height:1.5}.course-guide-words{display:flex;flex-wrap:wrap;gap:6px}.course-guide-word{padding:6px 10px;color:var(--text-main);font:inherit;font-size:.84rem;border:1px solid var(--border-color);border-radius:999px;background:var(--bg-card);cursor:pointer}.slow-btn{display:inline-grid;place-items:center;width:44px;height:44px;margin-left:8px;font-size:1.25rem;border:2px solid var(--border-color);border-radius:50%;background:var(--bg-card);cursor:pointer;vertical-align:middle}.slow-btn.playing{border-color:var(--color-accent)}.course-intro{display:grid;gap:10px;justify-items:center;padding:6px 0 4px;text-align:center}.course-intro-sound{display:flex;flex-direction:row;gap:14px;align-items:center;justify-content:center}.course-intro-sound .slow-btn{margin-left:0}.course-intro-meaning{font-size:1.35rem}.course-intro-pattern{display:inline-flex;gap:8px;align-items:center;margin:0;padding:6px 12px;border-radius:999px;background:color-mix(in srgb,var(--color-primary) 16%,transparent)}.course-intro-pattern span{color:var(--text-muted);font-size:.76rem;font-weight:800;text-transform:uppercase}.course-intro-note{max-width:460px;margin:0;color:var(--text-muted);font-size:.9rem;line-height:1.5}.course-blank{display:inline-block;min-width:3.5em;margin:0 4px;color:var(--color-accent);border-bottom:3px solid var(--color-accent)}.course-blank-hint{margin:0 0 6px;color:var(--text-muted);text-align:center}#vietnamese-sentence .speaker-btn{width:40px;height:40px;margin-left:10px;vertical-align:middle}.course-scene-image .vocab-image-img{max-height:min(160px,22vh)}.course-intro-image .vocab-image-img{max-height:min(200px,28vh)}.course-chat{display:grid;gap:10px;max-height:min(46vh,420px);padding:4px 2px;overflow-y:auto}.course-chat-line{display:flex;gap:8px;align-items:flex-start;max-width:92%;opacity:.72}.course-chat-line.current{opacity:1}.course-chat-line.right{flex-direction:row-reverse;justify-self:end;text-align:right}.course-chat-avatar{display:grid;place-items:center;flex:0 0 34px;height:34px;color:#fff;font-weight:900;border-radius:50%;background:var(--color-secondary)}.course-chat-line.right .course-chat-avatar{background:var(--color-primary)}.course-chat-text{padding:9px 12px;border:2px solid var(--border-color);border-radius:16px;background:var(--bg-card)}.course-chat-line.current .course-chat-text{border-color:var(--color-accent)}.course-chat-en,.course-chat-vi{margin:0}.course-chat-en{font-weight:700}.course-chat-speaker{display:block;color:var(--text-muted);font-size:.72rem;font-weight:800;text-transform:uppercase}.course-chat-vi{margin-top:3px;color:var(--text-muted);font-size:.86rem}.course-chat-play{flex:0 0 auto;width:34px;height:34px;font-size:1rem;border:1px solid var(--border-color);border-radius:50%;background:var(--bg-card);cursor:pointer}@media(max-width:480px){.course-root{--course-node: 58px}.course-list-hero{align-items:flex-start;padding:15px}.course-list-hero-icon{flex-basis:46px;height:46px;border-radius:14px;font-size:1.5rem}.course-list-heading{font-size:1.05rem}.course-card{padding:13px}.course-card-icon{flex-basis:48px;height:48px}.course-unit-banner{align-items:flex-start;flex-direction:column;padding:15px}.course-guide-btn{align-self:stretch}.course-trail-road{width:210px}.course-step{transform:translate(calc(var(--trail-x, 0) * .72))}.course-path-mascot{left:calc(50% + 38px);width:54px;height:54px}.course-path-mascot :is(.panda-actor__sprite,.panda-actor__fallback){width:54px;height:54px}.course-popover{top:74px}}@media(prefers-reduced-motion:reduce){.course-node.current,.course-start-tag,.course-step.is-unlocked .course-node,.course-card,.course-progress-fill:after{animation:none}.course-card{opacity:1;transform:none}}#game-screen{--game-accent: var(--color-primary);background:radial-gradient(circle at 18% 8%,color-mix(in srgb,var(--game-accent) 10%,transparent),transparent 34%),linear-gradient(180deg,color-mix(in srgb,var(--bg-main) 96%,var(--game-accent)),var(--bg-main))}#game-screen[data-game-family=listening]{--game-accent: var(--color-accent)}#game-screen[data-game-family=matching]{--game-accent: hsl(217, 91%, 62%)}#game-screen[data-game-family=speaking]{--game-accent: hsl(342, 83%, 62%)}#game-screen[data-game-family=dialogue]{--game-accent: hsl(278, 82%, 66%)}#game-screen[data-game-family=arcade]{--game-accent: hsl(35, 95%, 56%)}#game-screen .game-header{position:relative;z-index:20;min-height:70px;padding:13px 20px;border-bottom:0;background:color-mix(in srgb,var(--bg-main) 94%,transparent);box-shadow:0 1px color-mix(in srgb,var(--border-color) 70%,transparent);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}#game-screen .game-header .icon-btn,#game-screen .game-theme-toggle{display:grid;place-items:center;width:42px;height:42px;padding:0;border:2px solid var(--border-color);border-bottom-width:4px;border-radius:13px;background:var(--bg-card);font-size:1.05rem;overflow:hidden;transform:none!important}#game-screen .game-theme-toggle:hover{border-color:var(--color-primary);transform:translateY(-1px)!important}#game-screen .game-theme-icon{display:grid;width:22px;height:22px;place-items:center;line-height:0}#game-screen .game-theme-icon svg{display:block;width:100%;height:100%;overflow:visible}#game-screen .game-theme-icon[data-icon=sun]{color:#fbbd23}#game-screen .game-theme-icon[data-icon=sun] svg{fill:currentColor;stroke:currentColor;stroke-width:2;stroke-linecap:round}#game-screen .game-theme-icon[data-icon=moon]{color:#9b66f0}#game-screen .game-theme-icon[data-icon=moon] svg{fill:currentColor;stroke:currentColor;stroke-width:1.6;stroke-linejoin:round}#game-screen .game-header .icon-btn:active,#game-screen .game-theme-toggle:active{transform:translateY(2px)!important;border-bottom-width:2px}#game-screen .progress-bar-container{height:14px;border:2px solid color-mix(in srgb,var(--border-color) 85%,transparent);background:color-mix(in srgb,var(--border-color) 62%,transparent);box-shadow:inset 0 2px 4px #0000001f}#game-screen .progress-bar{background:linear-gradient(90deg,var(--game-accent),color-mix(in srgb,var(--game-accent) 54%,var(--color-accent)));box-shadow:0 0 15px color-mix(in srgb,var(--game-accent) 42%,transparent)}#game-screen .score-badge,#game-screen .combo-chip{border-width:2px;font-weight:900}#game-screen .game-content{max-width:590px;padding:26px 24px 22px;gap:22px}#game-screen .prompt-bubble-container{align-items:center}#game-screen .speech-bubble{position:relative;flex:1;min-width:0;padding:18px 20px;border:2px solid color-mix(in srgb,var(--game-accent) 34%,var(--border-color));border-bottom-width:5px;border-radius:22px;background:color-mix(in srgb,var(--bg-card) 94%,var(--game-accent));box-shadow:0 14px 34px color-mix(in srgb,var(--game-accent) 8%,transparent)}#game-screen .speech-bubble:before{content:"";position:absolute;left:-8px;top:24px;width:13px;height:13px;border:0;border-left:2px solid color-mix(in srgb,var(--game-accent) 34%,var(--border-color));border-bottom:2px solid color-mix(in srgb,var(--game-accent) 34%,var(--border-color));background:color-mix(in srgb,var(--bg-card) 94%,var(--game-accent));transform:rotate(45deg)}#game-screen .speech-bubble:after{display:none}#game-screen .instruction{color:var(--game-accent);font-size:.83rem;font-weight:900;letter-spacing:.025em}#game-screen #vietnamese-sentence{margin-top:5px;font-size:clamp(1.25rem,4.8vw,1.72rem);line-height:1.3}#game-screen .workspace{border-radius:22px}#game-screen .choice-card,#game-screen .word-tile,#game-screen .matching-card,#game-screen .image-option,#game-screen .typing-input{border-radius:17px;box-shadow:0 4px color-mix(in srgb,var(--border-color) 92%,#0000)}#game-screen .choice-card{padding:16px 18px}#game-screen .choice-card:hover:not(:disabled),#game-screen .word-tile:hover:not(:disabled),#game-screen .matching-card:hover:not(.matched){border-color:color-mix(in srgb,var(--game-accent) 56%,var(--border-color))}#game-screen .choice-card.selected,#game-screen .word-tile.selected{border-color:var(--game-accent);background:color-mix(in srgb,var(--game-accent) 10%,var(--bg-card))}#game-screen .choice-card.selected .choice-number{border-color:var(--game-accent);background:var(--game-accent)}#game-screen .matching-card.matched{animation:game-match-lock .42s cubic-bezier(.2,1.4,.3,1)}#game-screen[data-game-family=listening] .speaker-btn,#game-screen[data-game-family=listening] .listen-again-btn{box-shadow:0 0 color-mix(in srgb,var(--game-accent) 25%,transparent);animation:game-listen-breathe 2.4s ease-in-out infinite}#game-screen[data-game-family=dialogue] .course-chat-line.current .course-chat-text{animation:game-dialogue-reveal .34s cubic-bezier(.2,.85,.25,1) both}#game-screen .validation-drawer{border:2px solid var(--border-color);border-bottom:0;border-radius:24px 24px 0 0;background:color-mix(in srgb,var(--bg-validation-drawer) 94%,transparent);box-shadow:0 -14px 34px #00000026;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}#game-screen .validation-drawer.correct{border-color:var(--color-success-border)}#game-screen .validation-drawer.incorrect{border-color:var(--color-error-border)}#game-screen .drawer-actions .primary-btn,#game-screen .drawer-actions .secondary-btn{border-bottom-width:4px;min-height:50px}#game-screen .drawer-actions button:active:not(:disabled){transform:translateY(2px);border-bottom-width:2px}@media(prefers-reduced-motion:no-preference){#game-screen.is-entering .prompt-bubble-container{animation:game-question-enter .36s cubic-bezier(.2,.85,.25,1) both}#game-screen.is-entering .workspace{animation:game-surface-enter .34s ease-out .04s both}#game-screen.is-entering .options-container{animation:game-surface-enter .34s ease-out .08s both}#game-screen.is-feedback[data-feedback=correct] .speech-bubble{animation:game-correct-nudge .38s cubic-bezier(.2,1.35,.3,1)}#game-screen.is-feedback[data-feedback=wrong] .speech-bubble{animation:answer-wrong-shake .34s ease-out}}@keyframes game-question-enter{0%{opacity:0;transform:translateY(10px) scale(.985)}to{opacity:1;transform:none}}@keyframes game-surface-enter{0%{opacity:0}to{opacity:1}}@keyframes game-correct-nudge{50%{transform:translateY(-4px) scale(1.008)}}@keyframes game-match-lock{50%{transform:scale(1.055)}}@keyframes game-listen-breathe{50%{box-shadow:0 0 0 9px transparent;transform:translateY(-2px)}}@keyframes game-dialogue-reveal{0%{opacity:0;transform:translateY(7px) scale(.98)}to{opacity:1;transform:none}}#result-screen{background:radial-gradient(circle at 50% 8%,color-mix(in srgb,var(--color-primary) 18%,transparent),transparent 34%),linear-gradient(180deg,color-mix(in srgb,var(--bg-main) 96%,var(--color-primary)),var(--bg-main))}#result-screen .result-card{max-width:540px;gap:18px;padding:28px 26px 30px;border:2px solid var(--border-color);border-bottom-width:6px;border-radius:28px;background:color-mix(in srgb,var(--bg-card) 94%,transparent);box-shadow:0 24px 60px #00000038;-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px)}.result-panda{width:124px;height:124px;margin:-14px auto -26px}.result-panda :is(.panda-actor__sprite,.panda-actor__fallback){width:124px;height:124px;filter:drop-shadow(0 12px 18px rgba(0,0,0,.2))}#result-screen .trophy-icon{align-self:center;padding:5px 13px;border:2px solid color-mix(in srgb,var(--color-primary) 34%,var(--border-color));border-radius:999px;background:color-mix(in srgb,var(--color-primary) 12%,var(--bg-card));font-size:1.55rem;animation:none}#result-screen h1{font-size:clamp(1.55rem,5vw,2rem)}.result-stars{display:flex;justify-content:center;gap:8px;min-height:46px}.result-stars[hidden]{display:none}.result-stars span{color:color-mix(in srgb,var(--border-color) 88%,transparent);font-size:2.45rem;line-height:1;filter:grayscale(1)}.result-stars span.earned{color:#fdc921;filter:drop-shadow(0 5px 7px rgba(245,158,11,.28))}#result-screen .stat-card{border-bottom-width:4px;border-radius:17px;background:color-mix(in srgb,var(--bg-card) 96%,var(--color-primary))}#result-screen .review-section{padding-top:6px;border-top:1px solid var(--border-color);text-align:left}@media(prefers-reduced-motion:no-preference){#result-screen.is-completing .result-panda{animation:result-panda-enter .55s cubic-bezier(.2,1.35,.3,1) both}#result-screen.is-completing .result-stars span{animation:result-star-award .5s cubic-bezier(.2,1.55,.3,1) both;animation-delay:calc(var(--star-index, 0) * .14s + .12s)}#result-screen.is-completing .stat-card{animation:result-stat-enter .4s ease-out both;animation-delay:calc(var(--result-index, 0) * 55ms + .18s)}}@keyframes result-panda-enter{0%{opacity:0;transform:translateY(18px) scale(.82)}to{opacity:1;transform:none}}@keyframes result-star-award{0%{opacity:0;transform:scale(.2) rotate(-22deg)}70%{transform:scale(1.2) rotate(5deg)}to{opacity:1;transform:none}}@keyframes result-stat-enter{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}@media(max-width:560px){#game-screen .game-header{min-height:62px;padding:9px 12px;gap:7px}#game-screen .game-header .icon-btn,#game-screen .game-theme-toggle{width:38px;height:38px;border-radius:11px}#game-screen .game-content{padding:18px 16px 14px;gap:16px}#game-screen .prompt-bubble-container{gap:10px}#game-screen .speech-bubble{padding:14px 15px;border-radius:18px}#game-screen .speech-bubble:before{top:20px}#game-screen .choice-card{padding:13px 14px}#game-screen .validation-drawer{border-radius:20px 20px 0 0}#result-screen{padding:18px 14px}#result-screen .result-card{gap:15px;margin:0;padding:22px 16px 24px;border-radius:22px}.result-panda{width:106px;height:106px;margin-top:-10px}.result-panda :is(.panda-actor__sprite,.panda-actor__fallback){width:106px;height:106px}}@media(prefers-reduced-motion:reduce){#game-screen.is-entering :is(.prompt-bubble-container,.workspace,.options-container),#game-screen.is-feedback .speech-bubble,#game-screen .matching-card.matched,#game-screen[data-game-family=listening] :is(.speaker-btn,.listen-again-btn),#game-screen[data-game-family=dialogue] .course-chat-line.current .course-chat-text,#result-screen.is-completing :is(.result-panda,.result-stars span,.stat-card){animation:none!important;transform:none!important}}#welcome-screen{padding:12px 24px 32px}.welcome-top-bar{position:sticky;top:8px;z-index:40;display:flex;flex-direction:column;width:min(100%,600px);min-height:60px;margin:0 auto;padding:7px 10px 8px;border:2px solid color-mix(in srgb,var(--border-color) 88%,transparent);border-bottom-width:4px;border-radius:18px;background:color-mix(in srgb,var(--bg-card) 96%,var(--color-primary));box-shadow:0 10px 26px #0000001a}.welcome-nav-main{display:flex;min-width:0;min-height:42px;align-items:center;justify-content:space-between;gap:9px}.welcome-nav-brand{display:flex;min-width:0;align-items:center;gap:8px}.welcome-nav-brand img{flex:0 0 34px;border-radius:10px;filter:drop-shadow(0 3px 5px color-mix(in srgb,var(--color-primary) 20%,transparent))}.welcome-nav-brand strong{color:var(--text-main);font-size:1rem;font-weight:900;letter-spacing:-.025em;white-space:nowrap}.welcome-nav-brand strong span{color:var(--color-primary)}.course-nav-context{display:flex;min-width:0;flex:1;align-items:center;gap:7px}.course-nav-back,.welcome-nav-more{display:grid;place-items:center;flex:0 0 38px;width:38px;height:38px;padding:0;color:var(--text-main);border:2px solid var(--border-color);border-bottom-width:4px;border-radius:12px;background:var(--bg-main);font:inherit;font-size:1rem;font-weight:900;cursor:pointer;transition:border-color .15s ease,transform .15s ease}.course-nav-back:hover,.welcome-nav-more:hover{border-color:var(--color-primary)}.course-nav-back:active,.welcome-nav-more:active{border-bottom-width:2px;transform:translateY(2px)}.course-nav-back:focus-visible,.welcome-nav-more:focus-visible,.welcome-nav-menu-action:focus-visible,.welcome-nav-login:focus-visible{outline:3px solid var(--color-accent);outline-offset:2px}.course-nav-icon{flex:0 0 auto;font-size:1.15rem;line-height:1}.course-nav-title{min-width:0;overflow:hidden;color:var(--text-main);font-size:.9rem;text-overflow:ellipsis;white-space:nowrap}.welcome-nav-actions{display:flex;flex:0 0 auto;align-items:center;gap:7px}.course-nav-percent{padding:5px 8px;color:var(--color-accent);border-radius:999px;background:color-mix(in srgb,var(--color-accent) 12%,transparent);font-size:.73rem;font-weight:900}.course-nav-progress{height:5px;margin:4px 2px 0;overflow:hidden;border-radius:999px;background:color-mix(in srgb,var(--border-color) 68%,transparent)}.course-nav-progress>span{display:block;width:0;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--color-primary),var(--color-secondary),var(--color-accent));transition:width .45s cubic-bezier(.2,.8,.2,1)}.welcome-nav-login{min-height:38px;display:inline-flex;align-items:center;padding:7px 12px;color:#fff;border:2px solid var(--color-primary);border-bottom-width:4px;border-radius:12px;background:linear-gradient(135deg,var(--color-primary),var(--color-secondary));font-size:.78rem;font-weight:900;text-decoration:none}.welcome-nav-login:active{border-bottom-width:2px;transform:translateY(2px)}.welcome-nav-more{letter-spacing:.05em;line-height:1}.welcome-nav-more[aria-expanded=true]{color:#fff;border-color:var(--color-primary);background:var(--color-primary)}.welcome-nav-menu{position:absolute;top:calc(100% + 8px);right:0;z-index:60;display:grid;width:min(286px,calc(100vw - 28px));gap:5px;padding:9px;border:2px solid var(--border-color);border-bottom-width:5px;border-radius:17px;background:var(--bg-card);box-shadow:0 18px 42px #00000042}#user-profile-area.welcome-nav-profile{display:grid;min-width:0;gap:7px}.welcome-nav-user-summary{display:flex;min-width:0;align-items:center;gap:10px;padding:8px 9px;border-radius:12px;background:color-mix(in srgb,var(--color-primary) 8%,var(--bg-main))}.welcome-nav-user-summary .user-avatar{flex:0 0 38px;width:38px;height:38px;border:2px solid #fff;border-radius:50%;object-fit:cover;box-shadow:0 3px 7px #00000021}.welcome-nav-user-copy{display:grid;min-width:0;gap:1px}.welcome-nav-user-copy strong,.welcome-nav-user-copy small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.welcome-nav-user-copy strong{color:var(--text-main);font-size:.84rem}.welcome-nav-user-copy small{color:var(--text-muted);font-size:.68rem}.welcome-nav-profile-links{display:grid;gap:4px}.welcome-nav-menu-action{display:flex;width:100%;min-height:40px;align-items:center;justify-content:flex-start;gap:9px;padding:8px 10px;color:var(--text-main);border:0;border-radius:10px;background:transparent;font:inherit;font-size:.8rem;font-weight:800;text-align:left;text-decoration:none;cursor:pointer;box-shadow:none}.welcome-nav-menu-action:hover{color:var(--color-primary);background:color-mix(in srgb,var(--color-primary) 10%,var(--bg-main));transform:none}.course-nav-review{color:var(--color-primary);background:color-mix(in srgb,var(--color-primary) 10%,var(--bg-main))}.welcome-nav-menu-separator{height:1px;margin:2px 5px;background:var(--border-color)}.theme-toggle-btn.welcome-nav-theme{position:static;z-index:auto;width:100%;height:40px;padding:8px 10px;justify-content:flex-start;border:0;border-radius:10px;background:transparent;box-shadow:none;overflow:visible}.theme-toggle-btn.welcome-nav-theme:hover{color:var(--color-primary);background:color-mix(in srgb,var(--color-primary) 10%,var(--bg-main));transform:none}.welcome-nav-action-icon{width:1.25em;text-align:center}.welcome-top-bar .streak-badge{min-height:38px;gap:5px;padding:6px 10px;border-width:2px;border-bottom-width:4px;box-shadow:none;font-size:.76rem}.welcome-top-bar .streak-badge:hover{transform:translateY(-1px)}.welcome-top-bar .streak-badge:active{border-bottom-width:2px;transform:translateY(2px)}#welcome-screen>.welcome-card{margin:14px 0 20px}#welcome-screen.course-detail-active>.welcome-card{gap:0;margin-top:12px}#welcome-screen.course-detail-active :is(.welcome-hero,.learning-tabs){display:none}#welcome-screen.course-detail-active #course-config{width:100%;gap:0}@media(max-width:480px){#welcome-screen{padding:max(8px,env(safe-area-inset-top,0px)) 10px 24px}.welcome-top-bar{top:max(8px,env(safe-area-inset-top,0px))!important;width:100%;min-height:56px;padding:6px 8px 7px!important;border-radius:16px}.welcome-nav-brand img{flex-basis:30px;width:30px;height:30px}.welcome-nav-brand strong{font-size:.9rem}.welcome-nav-main,.welcome-nav-actions{gap:5px}.course-nav-back,.welcome-nav-more{flex-basis:36px;width:36px;height:36px;border-radius:11px}.course-nav-icon{font-size:1rem}.course-nav-title{font-size:.8rem}.course-nav-percent{padding-inline:6px;font-size:.68rem}.welcome-top-bar .streak-badge{min-height:36px;padding:5px 7px!important;font-size:.7rem!important}.welcome-nav-login{min-height:36px;padding-inline:9px}.welcome-nav-menu{top:calc(100% + 7px)}#welcome-screen.course-detail-active>.welcome-card{margin-top:8px}}@media(max-width:350px){.welcome-nav-brand strong,.course-nav-icon{display:none}.course-nav-title{max-width:78px}.welcome-top-bar .streak-unit{display:none}}@media(prefers-reduced-motion:reduce){.course-nav-progress>span,.course-nav-back,.welcome-nav-more{transition:none}}