/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */:root{--accent-gold:#e4c28e;--accent-gold-bright:#f5d78e;--score-blue:#1e5bb8;--sidebar-width:180px;--bg-page:#fff8e7;--game-max:1400px;--success:#2e7d32;--error:#c62828}.grammar-page{--primary:#a85f12;--primary-dark:#874d0f;--primary-light:#f5ebe0;--primary-hover:#ead8c8}.quiz-page{--primary:#0d2b6e;--primary-dark:#0a224f;--primary-light:#e6ecf7;--primary-hover:#d0daf0}.pronunciation-page{--primary:#5c4d8f;--primary-dark:#4a3f75;--primary-light:#ece8f4;--primary-hover:#ddd6ec}.scramble-page{--primary:#9a5f1a;--primary-dark:#7d4e15;--primary-light:#f3ebe0;--primary-hover:#e8dcc8}.wm-page{--primary:#1a5494;--primary-dark:#154478;--primary-light:#e4edf7;--primary-hover:#cddced}.law-page{--primary:#2d6b3a;--primary-dark:#245730;--primary-light:#e6f0e8;--primary-hover:#d4e6d8}.cc-page{--primary:#8a6d28;--primary-dark:#715922;--primary-light:#f5f0e4;--primary-hover:#e8dfc8}.rc-page{--primary:#1e5a96;--primary-dark:#184a7a;--primary-light:#e5edf6;--primary-hover:#cddded}.rm-page{--primary:#8f3d5c;--primary-dark:#74324b;--primary-light:#f3e8ec;--primary-hover:#e8d4dc}.vt-page{--primary:#634878;--primary-dark:#503a60;--primary-light:#ede8f2;--primary-hover:#ddd4e8}.vc-page{--primary:#2a6b62;--primary-dark:#225750;--primary-light:#e4efed;--primary-hover:#cce4df}body{-webkit-text-size-adjust:100%}.sidebar{background:var(--bg-page);border-right:1px solid var(--border)}.sidebar-nav{gap:6px;padding:20px 12px}.nav-item{color:var(--text-muted);padding:11px 16px;transition:color .2s,background .2s,box-shadow .2s}.nav-item i{font-size:17px}.sidebar-version{color:var(--text-muted);border-top:1px solid var(--border);padding:14px 20px}.main{background:var(--bg-page);align-items:center}.main.layout-game,.main.layout-index{align-items:stretch}.main.layout-game{width:100%}.main.layout-game .content,.main.layout-game .header{width:100%;max-width:none}.main.layout-game .content-inner{max-width:var(--content-max);width:100%;margin:0 auto}.pronunciation-page{flex:1}.game-page,.pronunciation-page{width:100%;max-width:var(--game-max);margin:0 auto;padding:clamp(16px,2.5vw,24px) clamp(12px,2vw,20px) clamp(24px,4vw,40px)}.header{flex-shrink:0;height:72px;min-height:72px;max-height:72px}.btn-login{white-space:nowrap;padding:9px 20px;transition:background .2s,transform .2s,box-shadow .2s;box-shadow:0 4px 10px #0d2b6e2e}.badge-rank{color:#f57f17;background:#fff8e1;border:1px solid #ffe082;border-radius:20px;gap:4px;padding:3px 10px;font-size:12px;font-weight:700}.badge-rank i{font-size:11px}.header-actions{flex-shrink:0}.action-item{background:0 0;border:none;font-family:inherit;transition:background .2s}.action-item-lang{letter-spacing:.02em;font-weight:800}.game-top{background:#fff;border:1px solid #0d2b6e12;border-radius:14px;align-items:center;gap:12px;margin-bottom:24px;padding:14px 18px;display:flex;box-shadow:0 2px 8px #0d2b6e0a}.mobile-menu-btn{width:40px;height:40px;font-size:18px}.game-back{background:var(--primary-light);width:36px;height:36px;color:var(--primary);cursor:pointer;border:1px solid #0d2b6e1f;border-radius:10px;flex-shrink:0;justify-content:center;align-items:center;font-size:14px;transition:all .2s;display:inline-flex}.game-back:hover{background:var(--primary);color:#fff;border-color:var(--primary);transform:translate(-2px)}.game-title-wrap{flex:1;min-width:0}.game-title-wrap h1{color:var(--primary);font-size:20px;font-weight:800;line-height:1.2}.game-subtitle{color:var(--text-muted);text-overflow:ellipsis;white-space:nowrap;margin-top:3px;font-size:12px;font-weight:600;overflow:hidden}.game-meta{background:linear-gradient(135deg,#fff,#f0f4fc 55%,#e8eef8);border:1px solid #0d2b6e1a;border-radius:16px;flex-wrap:wrap;align-items:center;gap:12px;margin-bottom:20px;padding:12px 16px;display:flex;box-shadow:0 4px 18px #0d2b6e14,inset 0 1px #ffffffe6}.meta-pill{background:var(--white);color:var(--primary);border:1px solid #0d2b6e14;border-radius:20px;padding:6px 14px;font-size:13px;font-weight:700;box-shadow:0 1px 6px #0000000d}.type-badge{background:var(--primary);color:var(--white)}.progress-bar-wrap{background:linear-gradient(#c5d0e4,#dce4f0 45%,#eef2f8);border:2px solid #0d2b6e24;border-radius:999px;flex:1;min-width:160px;height:16px;padding:3px;position:relative;overflow:visible;box-shadow:inset 0 2px 5px #0d2b6e1f,0 1px #fffc}.progress-bar-wrap:before{content:"";border-radius:inherit;pointer-events:none;opacity:.65;background:linear-gradient(90deg,#1e5bb859,#e4c28e80,#1e5bb859);padding:1px;position:absolute;inset:-1px;-webkit-mask-image:linear-gradient(#fff 0 0),linear-gradient(#fff 0 0);-webkit-mask-position:0 0,0 0;-webkit-mask-size:auto,auto;-webkit-mask-repeat:repeat,repeat;-webkit-mask-clip:content-box,border-box;-webkit-mask-origin:content-box,border-box;-webkit-mask-composite:xor;mask-composite:exclude;-webkit-mask-source-type:auto,auto;mask-mode:match-source,match-source}.progress-bar-fill{background:linear-gradient(90deg,#3b82f6,#1e5bb8 28%,#0d2b6e 62%,#c9a227);border-radius:999px;width:0;height:100%;transition:width .45s cubic-bezier(.34,1.2,.64,1);position:relative;overflow:hidden;box-shadow:0 0 14px #3b82f673,0 0 6px #e4c28e59,inset 0 1px #ffffff73,inset 0 -1px #00000014}.progress-bar-fill:after{content:"";pointer-events:none;background:linear-gradient(90deg,#0000,#ffffff26,#ffffff8c,#ffffff26,#0000);width:60%;height:100%;animation:scoreBarShine 2.8s ease-in-out infinite;position:absolute;top:0;left:-120%}@keyframes scoreBarShine{0%{left:-120%}55%,to{left:180%}}.meta-score-pill{white-space:nowrap;color:#fff;letter-spacing:.02em;border:2px solid var(--accent-gold);text-shadow:0 1px 2px #0003;background:linear-gradient(135deg,#0d2b6e,#1e5bb8 52%,#0a224f);flex-shrink:0;padding:8px 16px;font-size:14px;font-weight:800;box-shadow:0 4px 16px #0d2b6e47,inset 0 1px #ffffff38}.meta-score-pill:before{content:"★";color:var(--accent-gold-bright);vertical-align:middle;margin-right:6px;font-size:12px}#gamePanel,#questionPanel{position:relative}.question-counter-pill{z-index:3;background:var(--white);color:var(--primary);border:1px solid #e8eef8;border-radius:20px;padding:6px 14px;font-size:13px;font-weight:700;position:absolute;top:16px;right:16px;box-shadow:0 1px 6px #00000014}.cc-worksheet .question-counter-pill,.law-worksheet .question-counter-pill,.rc-worksheet .question-counter-pill,.rm-worksheet .question-counter-pill{top:12px;right:12px}.game-card .question-counter-pill{pointer-events:none}.game-card{background:var(--white);border:1px solid #0d2b6e12;border-radius:16px;padding:28px 32px;box-shadow:0 4px 20px #0d2b6e0f}.data-loading-state i{color:var(--primary);vertical-align:-.1em;margin-right:8px;font-size:1.15em}.question-text{word-wrap:break-word;margin-bottom:22px;font-size:18px;font-weight:700;line-height:1.7}.question-text.has-passage{font-weight:600}.quiz-passage{background:var(--primary-light,#eef4ff);border-left:3px solid var(--primary,#1e3a8a);white-space:pre-wrap;border-radius:10px;margin-bottom:16px;padding:14px 16px;font-size:16px;font-weight:500;line-height:1.75}.quiz-passage,.quiz-stem{color:var(--text-dark,#1f2937)}.quiz-stem{margin:0;font-size:18px;font-weight:800;line-height:1.6}.option-btn u,.option-btn u.quiz-error-opt,.question-text u.quiz-error-opt,.quiz-stem u.quiz-error-opt{text-underline-offset:3px;color:inherit;font-weight:800;text-decoration:underline;text-decoration-thickness:2px}.question-instruction{background:var(--primary-light,#eef4ff);border-left:3px solid var(--primary,#1e3a8a);color:var(--text-dark,#1f2937);border-radius:10px;margin:0 0 14px;padding:12px 14px;font-size:14px;font-weight:600;line-height:1.5}.question-text .blank{border-bottom:2px solid var(--primary);text-align:center;min-width:100px;color:var(--primary);font-weight:800;display:inline-block}.options-list{flex-direction:column;gap:10px;display:flex}.option-btn{text-align:left;border:2px solid var(--border);background:var(--white);width:100%;color:var(--text-dark);cursor:pointer;touch-action:manipulation;border-radius:12px;align-items:center;gap:12px;padding:14px 18px;font-family:inherit;font-size:15px;font-weight:700;transition:transform .22s,border-color .2s,background .2s;display:flex}.option-btn:hover:not(:disabled){border-color:var(--primary);background:var(--primary-light);transform:scale(1.02)}.option-btn .opt-letter{background:var(--primary-light);width:28px;height:28px;color:var(--primary);border-radius:8px;flex-shrink:0;justify-content:center;align-items:center;font-size:13px;font-weight:800;display:flex}.option-btn.selected{border-color:var(--primary);background:var(--primary-light)}.option-btn.correct{border-color:var(--success);background:#e8f5e9}.option-btn.wrong{border-color:var(--error);background:#ffebee}.option-btn:disabled{cursor:default;transform:none}.fill-input-wrap{margin-top:8px}.fill-input{border:2px solid var(--border);border-radius:12px;outline:none;width:100%;max-width:320px;padding:12px 16px;font-family:inherit;font-size:16px;font-weight:700;transition:border-color .2s}.fill-input:focus{border-color:var(--primary)}.fill-input:disabled{background:#f5f5f5}.feedback{border-radius:12px;margin-top:16px;padding:14px 16px;font-size:14px;font-weight:700;line-height:1.5;display:none}.feedback.show{align-items:flex-start;gap:10px;display:flex}.feedback i{flex-shrink:0;margin-top:1px;font-size:16px}.feedback.correct{color:#0a6638;background:#f0faf4;border:1px solid #0f764633}.feedback.wrong{color:#9b2626;background:#fdf4f4;border:1px solid #b9303033}.feedback .score-line{opacity:.85;margin-top:6px;font-size:14px;font-weight:800}.game-actions{flex-wrap:wrap;gap:10px;margin-top:24px;display:flex}.list-stats+.game-actions{margin-top:16px;margin-bottom:8px}.btn{cursor:pointer;touch-action:manipulation;box-sizing:border-box;border:none;border-radius:10px;justify-content:center;align-items:center;gap:8px;padding:11px 22px;font-family:inherit;font-size:14px;font-weight:800;text-decoration:none;transition:all .2s cubic-bezier(.4,0,.2,1);display:inline-flex}.btn:hover{transform:translateY(-2px);box-shadow:0 4px 12px #0000001a}.btn-primary{background:linear-gradient(135deg,var(--primary) 0,var(--primary-dark) 100%);color:var(--white);box-shadow:0 3px 10px #0d2b6e2e}.btn-primary:hover{box-shadow:0 6px 18px #0d2b6e40}.btn-secondary{background:var(--white);color:var(--primary);border:1.5px solid #0d2b6e33}.btn-secondary:hover,a.btn-secondary:hover{background:var(--primary-light);border-color:var(--primary)}.btn:disabled{opacity:.5;cursor:not-allowed;box-shadow:none;transform:none}.result-panel{text-align:center;padding:28px 12px 12px}.result-panel h2{color:var(--primary);margin-bottom:16px;font-size:28px;font-weight:800}.result-panel p{color:var(--text-muted);margin-bottom:20px;font-size:16px;font-weight:600}.game-score-hero{background:linear-gradient(135deg,var(--primary) 0,var(--primary-dark) 100%);text-align:left;border:none;border-radius:14px;width:100%;margin:0 0 20px;padding:18px 22px;position:relative;overflow:hidden;box-shadow:0 6px 20px #0d2b6e2e}.game-score-hero:before{content:"🏆";opacity:.22;pointer-events:none;font-size:36px;position:absolute;top:50%;right:20px;transform:translateY(-50%)}.game-score-hero-label{letter-spacing:.06em;text-transform:uppercase;opacity:1;margin:5px 0 0;font-size:11px;font-weight:700;color:#ffffffbf!important}.game-score-hero-value{margin:0;font-size:32px;font-weight:900;line-height:1.1;color:#fff!important}.game-score-hero-unit{color:#fffc;opacity:1;margin-left:5px;font-size:15px;font-weight:700}.result-panel .game-score-hero{text-align:center;max-width:280px;margin-left:auto;margin-right:auto}.game-result-summary-text{color:#475569!important;margin-bottom:22px!important}.list-stats{grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:22px;display:grid}.stat-item{text-align:center;background:#fff;border:1px solid #0d2b6e12;border-radius:14px;padding:16px 8px 14px;transition:transform .2s,box-shadow .2s;box-shadow:0 2px 8px #0d2b6e08}.stat-item:hover{transform:translateY(-2px);box-shadow:0 6px 16px #0d2b6e12}.stat-item .stat-num{color:#1e293b;font-size:26px;font-weight:900;line-height:1.1;display:block}.stat-item .stat-label{color:#94a3b8;text-transform:uppercase;letter-spacing:.06em;margin-top:5px;font-size:10px;font-weight:700}.stat-item.correct{background:linear-gradient(145deg,#f0faf4,#e6f4ec);border-color:#0f764626}.stat-item.correct .stat-num{color:#0f7646}.stat-item.wrong{background:linear-gradient(145deg,#fdf5f5,#f8eded);border-color:#b9303024}.stat-item.wrong .stat-num{color:#b93030}.stat-item.pending{background:#f8fafc;border-color:#0d2b6e12}.stat-item.pending .stat-num{color:#64748b}.question-list{flex-direction:column;gap:8px;margin-bottom:24px;display:flex}.q-list-item{cursor:pointer;width:100%;font-family:inherit;font-size:inherit;color:inherit;text-align:left;appearance:none;box-sizing:border-box;background:#fff;border:1px solid #0d2b6e12;border-radius:12px;align-items:center;gap:14px;padding:14px 16px;transition:all .2s;display:flex;box-shadow:0 1px 4px #0d2b6e08}.q-list-item:hover{border-color:var(--primary);background:var(--primary-light);transform:translate(4px);box-shadow:0 4px 14px #0d2b6e17}.q-list-item.status-correct{background:#f2fbf6;border-color:#0f764633}.q-list-item.status-correct:hover{background:#e6f7ee;border-color:#0f764666}.q-list-item.status-wrong{background:#fdf4f4;border-color:#b9303033}.q-list-item.status-wrong:hover{background:#faecec;border-color:#b9303059}.q-list-item.status-pending{background:#fafbfd;border-color:#0d2b6e12}.q-num{color:#64748b;background:#f1f5f9;border-radius:8px;flex-shrink:0;justify-content:center;align-items:center;width:30px;height:30px;font-size:13px;font-weight:800;display:flex}.q-list-item.status-correct .q-num{color:#fff;background:linear-gradient(135deg,#0f7646,#15a060);box-shadow:0 2px 6px #0f764640}.q-list-item.status-wrong .q-num{color:#fff;background:linear-gradient(135deg,#b93030,#d43c3c);box-shadow:0 2px 6px #b9303040}.q-preview{color:var(--text-dark);text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;font-size:14px;font-weight:600;overflow:hidden}.q-status{text-align:center;flex-shrink:0;width:26px;font-size:14px}.q-list-item.status-correct .q-status{color:#0f7646}.q-list-item.status-wrong .q-status{color:#b93030}.q-list-item.status-pending .q-status{color:#cbd5e1}.list-title{color:var(--text-dark);align-items:center;gap:8px;margin-bottom:16px;font-size:16px;font-weight:800;display:flex}.list-title:before{content:"";background:var(--primary);border-radius:2px;width:4px;height:18px;display:inline-block}.site-footer{color:#fff;padding:clamp(20px,3vw,28px) clamp(16px,3vw,32px) max(12px,env(safe-area-inset-bottom))}.footer-copy{color:#ffffffbf;margin:0;font-size:13px}@media (max-width:900px){.mobile-menu-btn{display:flex}.sidebar{z-index:1000;transition:transform .28s;position:fixed;top:0;bottom:0;left:0;transform:translate(-100%);box-shadow:4px 0 24px #00000026}.app.sidebar-open .sidebar{transform:translate(0)}.sidebar-backdrop{z-index:999;opacity:0;pointer-events:none;background:#00000073;transition:opacity .28s;display:block;position:fixed;inset:0}.app.sidebar-open .sidebar-backdrop:not(.hidden){opacity:1;pointer-events:auto}.app.sidebar-open{overflow:hidden}.header{flex-wrap:wrap;gap:10px;padding:10px 16px}.header-actions,.header-left{min-width:0}.game-page,.pronunciation-page{max-width:100%;padding:16px;overflow-x:clip}.game-top{margin-bottom:18px;padding:12px 14px}.game-card,.game-top{min-width:0;max-width:100%}.game-card{border-radius:14px;padding:20px;overflow-x:clip}.progress-bar-wrap{flex:100%;min-width:0;height:14px}.meta-score-pill{padding:7px 14px;font-size:13px}}@media (max-width:768px){.game-title-wrap h1{font-size:18px}.question-counter-pill{margin-bottom:12px;display:inline-block;position:static}.game-card{padding:18px}.game-score-hero:before{font-size:28px}}@media (max-width:600px){.list-stats{grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;margin-bottom:14px}.stat-item{box-shadow:none;border-radius:12px;flex-direction:column;justify-content:center;align-items:center;gap:2px;padding:10px 4px 8px;display:flex;position:relative}.stat-item:hover{transform:none}.stat-item:before{color:#94a3b8;font-family:Font Awesome\ 6 Free;font-size:13px;font-weight:900;line-height:1}.stat-item:not(.correct):not(.wrong):not(.pending):before{content:""}.stat-item.correct:before{content:"";color:#0f7646}.stat-item.wrong:before{content:"";color:#b93030}.stat-item.pending:before{content:"";color:#64748b}.stat-item .stat-num{font-size:20px;line-height:1}.stat-item .stat-label{clip:rect(0,0,0,0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.game-title-wrap h1{font-size:17px}.question-text{font-size:16px}.q-preview{white-space:normal;-webkit-line-clamp:2;-webkit-box-orient:vertical;display:-webkit-box}.game-score-hero-value{font-size:26px}.meta-score-pill{white-space:normal;flex-shrink:1;line-height:1.3}.meta-pill,.meta-score-pill,.type-badge{overflow-wrap:anywhere;max-width:100%}.list-title{overflow-wrap:anywhere;word-break:break-word;flex-wrap:wrap}.option-btn{align-items:flex-start;min-width:0}.option-btn>span:last-child{overflow-wrap:anywhere;flex:auto;min-width:0}.feedback.show{overflow-wrap:anywhere;word-break:break-word;flex-wrap:wrap}}@media (max-width:480px){.game-page,.pronunciation-page{padding:12px 12px 28px}.game-top{gap:10px;padding:10px 12px}.header-actions .action-item span{display:none}.header-actions .action-item{justify-content:center;min-width:44px;min-height:44px;padding:8px 12px}.header-actions{gap:2px;padding:4px}.btn-login{padding:8px 14px;font-size:14px}.game-meta{border-radius:12px;gap:8px;padding:10px 12px}.meta-score-pill:before{margin-right:4px;font-size:11px}.meta-pill{padding:5px 12px;font-size:12px}.stat-item .stat-num{font-size:20px}.option-btn{padding:12px 14px;font-size:14px}.fill-input{max-width:100%}.game-actions{flex-direction:column}.game-actions .btn{width:100%;min-height:46px}.site-footer{padding:18px 16px 12px}}.question-label{text-transform:uppercase;letter-spacing:.07em;color:var(--text-muted);align-items:center;gap:6px;margin-bottom:8px;font-size:11px;font-weight:800;display:flex}.question-label:before{content:"";background:var(--primary);opacity:.6;border-radius:2px;width:3px;height:12px;display:inline-block}.source-sentence{background:var(--primary-light);border-left:4px solid var(--primary);word-wrap:break-word;color:var(--text-dark);border-radius:12px;margin-bottom:26px;padding:18px 20px;font-size:17px;font-weight:600;line-height:1.7}.rewrite-label{color:var(--text-muted);text-transform:uppercase;letter-spacing:.04em;margin-bottom:14px;font-size:13px;font-weight:700}.rewrite-row{background:#fafbfd;border:1px solid #0d2b6e14;border-radius:12px;flex-wrap:wrap;align-items:center;gap:8px;padding:14px 18px;font-size:18px;font-weight:700;line-height:1.8;display:flex}.rewrite-prefix{color:var(--primary);white-space:nowrap;font-weight:800}.rewrite-input{border:none;border-bottom:2px solid var(--primary);min-width:200px;color:var(--text-dark);background:0 0;outline:none;flex:1;padding:2px 8px 4px;font-family:inherit;font-size:18px;font-weight:700;transition:border-bottom-color .2s}.rewrite-input:focus{border-bottom-color:var(--primary-dark)}.rewrite-input:disabled{opacity:.75}.rewrite-suffix{color:var(--text-dark);font-weight:600}.hint-box{color:#92400e;background:#fffbf0;border:1px solid #fde68a;border-radius:10px;align-items:center;gap:8px;margin-top:14px;padding:10px 14px;font-size:13px;font-weight:600;display:flex}.hint-box i{color:#f59e0b;flex-shrink:0;font-size:14px}@media (max-width:600px){.source-sentence{padding:14px 16px;font-size:15px}.rewrite-row{flex-direction:column;align-items:stretch;gap:10px;padding:12px 14px;font-size:16px}.rewrite-prefix,.rewrite-suffix{white-space:normal;overflow-wrap:anywhere;word-break:break-word;max-width:100%}.rewrite-input{width:100%;min-width:0;max-width:100%;font-size:16px}.hint-box{align-items:flex-start}.hint-box span{overflow-wrap:anywhere;min-width:0}}.law-page{--law-green:#d4edda;--law-green-border:#a8d5b5;--law-green-dark:#2e7d32;--law-paper:#fffef8}.law-worksheet{background:var(--law-paper);border:2px solid #e8e0c8;border-radius:20px;padding:24px 20px 28px;position:relative;overflow:hidden;box-shadow:0 8px 32px #0d2b6e14}.law-worksheet:after,.law-worksheet:before{content:"";opacity:.15;pointer-events:none;border-radius:50%;width:48px;height:48px;position:absolute}.law-worksheet:before{background:#f9a8d4;bottom:12px;left:12px}.law-worksheet:after{background:#86efac;bottom:12px;right:12px}.law-title{text-align:center;color:var(--primary);letter-spacing:.02em;text-transform:uppercase;margin-bottom:6px;font-size:22px;font-weight:900}.law-instruction{text-align:center;color:var(--text-dark);margin-bottom:18px;font-size:16px;font-weight:700}.law-word-bank{background:var(--law-green);border:2px solid var(--law-green-border);border-radius:14px;flex-wrap:wrap;justify-content:center;align-items:center;gap:10px;min-height:56px;margin-bottom:24px;padding:14px 16px;transition:background .2s,border-color .2s;display:flex}.law-word-bank.is-drag-over{border-color:var(--law-green-dark);background:#c3e6cb;box-shadow:inset 0 0 0 2px #2e7d3233}.law-word-bank-label{text-align:center;text-transform:uppercase;letter-spacing:.08em;width:100%;color:var(--law-green-dark);margin-bottom:2px;font-size:11px;font-weight:800}.law-chip{border:2px solid var(--law-green-border);color:var(--text-dark);cursor:grab;-webkit-user-select:none;user-select:none;touch-action:none;background:#fff;border-radius:999px;align-items:center;gap:6px;padding:8px 16px;font-size:15px;font-weight:800;transition:transform .18s,box-shadow .18s,border-color .18s;display:inline-flex;box-shadow:0 2px 6px #0000000f}.law-chip:hover{border-color:var(--primary);transform:scale(1.06)}.law-chip.is-dragging{opacity:.45;cursor:grabbing;transform:scale(1.02)}.law-chip.is-selected{border-color:var(--primary);background:var(--primary-light);box-shadow:0 0 0 3px #0d2b6e26}.law-grid{grid-template-columns:repeat(3,1fr);gap:20px 16px;display:grid}.law-item{flex-direction:column;align-items:center;gap:8px;display:flex}.law-item-num{color:var(--primary);align-self:flex-start;font-size:15px;font-weight:900}.law-item-img-wrap{aspect-ratio:1;background:#f8fafc;border-radius:10px;justify-content:center;align-items:center;width:100%;max-width:160px;padding:8px;display:flex;overflow:hidden}.law-item-img{object-fit:contain;object-position:center;width:100%;max-width:100%;height:100%;max-height:100%}.law-drop-zone{border-bottom:3px solid var(--primary);border-radius:4px 4px 0 0;flex-direction:column;justify-content:center;align-items:center;width:100%;min-height:44px;padding:6px 8px 10px;transition:background .15s,border-color .15s;display:flex}.law-drop-zone.is-drag-over{background:var(--primary-light);border-bottom-color:var(--law-green-dark)}.law-drop-zone.is-correct{border-bottom-color:var(--success);background:#e8f5e9}.law-drop-zone.is-wrong{border-bottom-color:var(--error);background:#ffebee}.law-drop-zone .law-chip{cursor:pointer;padding:6px 14px;font-size:14px}.law-drop-placeholder{color:var(--text-muted);font-size:13px;font-style:italic;font-weight:600}.law-touch-hint{text-align:center;color:var(--text-muted);margin-top:-8px;margin-bottom:16px;font-size:12px;font-weight:700}.law-banner{color:#fff;background:linear-gradient(135deg,#0a224f,#0d2b6e 55%,#153d8a);border-radius:18px;margin-bottom:18px;padding:18px 20px;box-shadow:0 6px 24px #0d2b6e33}.law-banner h2{margin-bottom:4px;font-size:18px;font-weight:900}.law-banner p{opacity:.85;font-size:13px;font-weight:600}.law-meta-row{flex-wrap:wrap;align-items:center;gap:10px;margin-bottom:16px;display:flex}@media (max-width:900px){.law-grid{grid-template-columns:repeat(2,1fr);gap:12px 10px}.law-worksheet{padding:16px 12px 18px}.law-banner{margin-bottom:12px;padding:12px 14px}.law-banner h2{font-size:16px}.law-banner p{font-size:12px}.law-item-img-wrap{aspect-ratio:1;width:100%;max-width:120px}.law-drop-zone{min-height:40px;padding:4px}.law-chip{padding:6px 12px;font-size:13px}}@media (max-width:520px){.law-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 8px;max-width:100%;margin:0}.law-worksheet{border-radius:14px;padding:14px 10px 16px}.law-title{font-size:17px}.law-instruction{font-size:13px}.law-item-img-wrap{max-width:100%}.law-touch-hint{font-size:11px}}.cc-page{--cc-paper:#fffef8;--cc-border:var(--primary)}@supports (color:color-mix(in lab,red,red)){.cc-page{--cc-border:color-mix(in srgb,var(--primary) 28%,#fff)}}.cc-banner{background:linear-gradient(135deg,var(--primary) 0,var(--primary-dark) 100%);color:#fff;border-radius:16px;margin-bottom:18px;padding:18px 22px}.cc-banner h2{margin-bottom:4px;font-size:18px;font-weight:900}.cc-banner p{opacity:.85;font-size:13px;font-weight:600}.cc-meta-row{flex-wrap:wrap;align-items:center;gap:10px;margin-bottom:16px;display:flex}.cc-progress-pill{color:var(--primary);background:var(--primary-light);border-radius:999px;padding:6px 14px;font-size:13px;font-weight:800}.cc-worksheet{background:var(--cc-paper);border:3px solid var(--cc-border);border-radius:22px;padding:28px 24px 32px;position:relative;overflow:hidden;box-shadow:0 8px 32px #0d2b6e14}.cc-deco{pointer-events:none;-webkit-user-select:none;user-select:none;position:absolute}.cc-deco-cloud{opacity:.35;font-size:22px;top:10px;right:18%}.cc-deco-cloud-2{opacity:.25;font-size:16px;top:28px;right:8%}.cc-deco-flower{opacity:.5;font-size:20px;bottom:14px;right:16px}.cc-deco-flower-2{opacity:.4;font-size:14px;bottom:22px;right:42px}.cc-star-badge{color:#fff;clip-path:polygon(50% 0,61% 35%,98% 35%,68% 57%,79% 91%,50% 70%,21% 91%,32% 57%,2% 35%,39% 35%);background:linear-gradient(145deg,#42a5f5,#1565c0);justify-content:center;align-items:center;width:44px;height:44px;margin-bottom:8px;font-size:20px;font-weight:900;display:inline-flex;box-shadow:0 3px 8px #1565c059}.cc-ws-title{color:var(--primary);letter-spacing:.01em;margin:0 0 6px;font-size:26px;font-weight:900}.cc-ws-instruction{color:var(--text-dark);margin:0 0 22px;font-size:15px;font-weight:700}.cc-rows{flex-direction:column;gap:18px;display:flex}.cc-row{grid-template-columns:28px minmax(72px,100px) 1fr;align-items:center;gap:14px;display:grid}.cc-row.has-prompt{grid-template-columns:28px minmax(140px,1.4fr) minmax(160px,1fr);align-items:stretch}.cc-row-num{color:var(--text-dark);text-align:center;font-size:18px;font-weight:900}.cc-picture{aspect-ratio:1;align-items:center;width:100%}.cc-picture,.cc-stem{justify-content:center;display:flex}.cc-stem{flex-direction:column;gap:8px;min-width:0}.cc-prompt{color:var(--text-dark);background:#ffffffeb;border:1px solid #00000014;border-radius:12px;margin:0;padding:10px 12px;font-size:15px;font-weight:600;line-height:1.45}.cc-stem img{object-fit:contain;align-self:flex-start;max-width:96px;max-height:96px}.cc-picture img{object-fit:contain;max-width:100%;max-height:88px}.cc-options{flex-wrap:wrap;align-items:center;gap:12px;display:flex}.cc-opt-wrap{min-width:108px;color:var(--text-dark);cursor:pointer;-webkit-user-select:none;user-select:none;background:#fff;border:2px solid #333;border-radius:10px;justify-content:center;align-items:center;padding:10px 22px;font-family:inherit;font-size:16px;font-weight:800;transition:transform .15s,box-shadow .15s;display:inline-flex;position:relative}.cc-opt-wrap:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 4px 12px #00000014}.cc-opt-wrap:disabled{cursor:default}.cc-opt-wrap.is-correct{background:#e8f5e9;border-color:#2e7d32}.cc-opt-wrap.is-wrong{background:#ffebee;border-color:#c62828}.cc-circle-svg{pointer-events:none;width:calc(100% + 18px);height:calc(100% + 14px);position:absolute;top:50%;left:50%;overflow:visible;transform:translate(-50%,-50%)}.cc-circle-path{fill:none;stroke:#e53935;stroke-width:2.8px;stroke-linecap:round;stroke-dasharray:300;stroke-dashoffset:300px;opacity:0}.cc-opt-wrap.is-circled .cc-circle-path{opacity:1;animation:ccDrawCircle .65s cubic-bezier(.33,1,.68,1) forwards}@keyframes ccDrawCircle{0%{stroke-dashoffset:300px;opacity:1}to{stroke-dashoffset:0;opacity:1}}@media (max-width:560px){.cc-row{grid-template-columns:22px 64px 1fr;gap:8px}.cc-row.has-prompt{grid-template-columns:22px 1fr}.cc-row.has-prompt .cc-options{grid-column:2}.cc-options{flex-direction:column;gap:6px}.cc-worksheet{border-radius:14px;padding:14px 10px 16px}.cc-ws-title{font-size:18px}.cc-ws-instruction{font-size:13px}.cc-banner{margin-bottom:12px;padding:10px 12px}.cc-banner h2{font-size:15px}.cc-banner p{font-size:12px}.cc-star-badge{width:36px;height:36px;font-size:16px}.cc-deco{display:none}.cc-opt-wrap{min-height:40px;padding:8px 10px;font-size:14px}}.wm-board{border-radius:var(--radius-lg);--wm-row-h:96px;background:linear-gradient(#fff8e78c,#e4edf766);border:1px solid #1a54941f;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px 72px;max-width:860px;margin-top:20px;margin-left:auto;margin-right:auto;padding:20px 24px;display:grid;position:relative;box-shadow:inset 0 1px #fff9}.wm-lines{pointer-events:none;z-index:3;width:100%;height:100%;position:absolute;inset:0;overflow:visible}.wm-line{fill:none;stroke-width:3px;stroke-linecap:round;stroke-linejoin:round}.wm-line.is-preview{stroke:var(--primary);stroke-dasharray:6 5;opacity:.9}.wm-line.is-correct{stroke:#22c55e;stroke-width:3.5px}.wm-line.is-wrong{stroke:#ef4444;stroke-width:3.5px}.wm-col-title{color:var(--primary-dark);text-transform:uppercase;letter-spacing:.08em;border-bottom:2px solid #e4c28e73;align-items:center;gap:8px;margin-bottom:12px;padding-bottom:8px;font-size:14px;font-weight:800;display:flex}.wm-col-title i{color:var(--accent-gold)}.wm-list{flex-direction:column;gap:8px;display:flex}.wm-item{height:var(--wm-row-h);border-radius:var(--radius-md);background:var(--primary-light);cursor:pointer;border:2px solid #1a549429;align-items:stretch;transition:transform .2s cubic-bezier(.34,1.56,.64,1),border-color .2s,box-shadow .2s,background-color .2s,opacity .2s;display:flex;position:relative;box-shadow:0 4px 6px -1px #0d2b6e0d,0 2px 4px -1px #0d2b6e08}#wordList .wm-item{background:linear-gradient(135deg,var(--primary-light) 0,#f5f0e4 100%);border-color:#1a549433}#imageList .wm-item{background:#dbeafe;border-color:#1a549438;padding:0;overflow:hidden}.wm-item:hover:not(.is-done):not(.is-wrong){border-color:var(--primary);transform:translateY(-3px)scale(1.02);box-shadow:0 10px 15px -3px #0d2b6e14,0 4px 6px -2px #0d2b6e0a}.wm-item:active:not(.is-done):not(.is-wrong){transform:scale(.98)}.wm-item.is-selected{border-color:var(--primary);background:var(--primary-hover);box-shadow:0 0 0 3px #1a54942e}#wordList .wm-item.is-selected{background:linear-gradient(135deg,#fffef8 0,var(--primary-light) 100%);box-shadow:0 0 0 3px #1a54942e,0 8px 16px -4px #1a54941a}#imageList .wm-item.is-selected{box-shadow:0 0 0 3px #1a549438,0 8px 16px -4px #1a54941f}#imageList .wm-item.is-done,#wordList .wm-item.is-done,.wm-item.is-done{cursor:default;opacity:.95;background:#f0fdf4;border-color:#22c55e;animation:wm-pop .5s cubic-bezier(.175,.885,.32,1.275) forwards;box-shadow:0 0 0 2px #22c55e47,0 6px 14px -4px #22c55e38}.wm-item.is-wrong{animation:wm-shake .4s ease-in-out;background:#fee2e2!important;border-color:#ef4444!important;box-shadow:0 0 0 3px #ef444433!important}#wordList .wm-item:after{right:-14px}#imageList .wm-item:before,#wordList .wm-item:after{content:"";background-color:var(--primary);z-index:2;border:2px solid #fffef8;border-radius:50%;width:12px;height:12px;transition:transform .2s cubic-bezier(.175,.885,.32,1.275);position:absolute;top:50%;transform:translateY(-50%)scale(0);box-shadow:0 0 0 2px #1a549447}#imageList .wm-item:before{left:-14px}#imageList .wm-item.is-selected:before,#imageList .wm-item:hover:not(.is-done):not(.is-wrong):before,#wordList .wm-item.is-selected:after,#wordList .wm-item:hover:not(.is-done):not(.is-wrong):after{transform:translateY(-50%)scale(1)}#imageList .wm-item.is-done:before,#wordList .wm-item.is-done:after{background-color:#22c55e;transform:translateY(-50%)scale(1);box-shadow:0 0 0 2px #22c55e4d}.wm-word-btn{width:100%;height:100%;font:inherit;color:var(--text-dark);text-transform:uppercase;letter-spacing:.04em;cursor:inherit;text-align:center;background:0 0;border:none;justify-content:center;align-items:center;padding:8px 12px;font-size:14px;font-weight:800;line-height:1.25;transition:color .2s;display:flex}.wm-item.is-selected .wm-word-btn{color:var(--primary-dark)}.wm-item.is-done .wm-word-btn{color:#15803d}.wm-item.is-wrong .wm-word-btn{color:#b91c1c}.wm-img-btn{cursor:inherit;border:none;justify-content:center;align-items:center;padding:6px;display:flex;overflow:hidden}.wm-img,.wm-img-btn{width:100%;height:100%;background:0 0;border-radius:0}.wm-img{object-fit:contain;object-position:center;max-width:100%;max-height:100%;transition:transform .2s;display:block}.wm-item:hover:not(.is-done):not(.is-wrong) .wm-img{transform:scale(1.03)}.wm-img-placeholder{color:#64748b;background:linear-gradient(135deg,#e2e8f0,#cbd5e1);border-radius:0;justify-content:center;align-items:center;width:100%;height:100%;font-size:28px;font-weight:800;display:flex}.wm-hint{color:var(--text-muted);text-align:center;min-height:20px;margin-top:8px;font-size:13px;font-weight:700;transition:color .2s}.wm-progress-line{color:var(--primary);text-align:center;margin-top:14px;font-size:15px;font-weight:800}@keyframes wm-shake{0%,to{transform:translate(0)}20%,60%{transform:translate(-6px)}40%,80%{transform:translate(6px)}}@keyframes wm-pop{0%{transform:scale(1)}50%{transform:scale(1.06);box-shadow:0 0 15px #22c55e66}to{transform:scale(1)}}@media (max-width:900px){.wm-board{--wm-row-h:64px;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px 10px;max-width:100%;padding:12px}.wm-col-title{letter-spacing:.04em;gap:4px;margin-bottom:8px;padding-bottom:6px;font-size:11px}.wm-list{gap:6px}.wm-item{border-width:1.5px;border-radius:10px}.wm-word-btn{letter-spacing:.02em;padding:4px 6px;font-size:12px}.wm-img-btn{padding:4px}#imageList .wm-item:before,#wordList .wm-item:after{display:none}}@media (max-width:480px){.wm-board{--wm-row-h:56px;column-gap:8px;padding:8px}.wm-word-btn{font-size:11px}}.vc-page{--vc-paper:#fffef8}.vc-banner{background:linear-gradient(135deg,var(--primary-light) 0,#fff 100%);border:2px solid var(--primary-hover);border-radius:16px;margin-bottom:20px;padding:20px 24px}.vc-banner h2{color:var(--primary);margin-bottom:4px;font-size:18px;font-weight:900}.vc-banner p{color:var(--text-muted);font-size:14px;font-weight:700}.vc-worksheet{background:var(--vc-paper);border:2px solid #e8e0c8;border-radius:20px;padding:24px 20px 28px;position:relative;box-shadow:0 8px 32px #0d2b6e14}.vc-meta-row{align-items:center;gap:10px;margin-bottom:16px;display:flex}.vc-title{text-align:center;color:var(--primary);margin-bottom:6px;font-size:22px;font-weight:900}.vc-instruction{text-align:center;color:var(--text-dark);margin-bottom:16px;font-size:16px;font-weight:700}.vc-list{flex-direction:column;gap:12px;display:flex}.vc-row{background:#fffef8;border:2px solid #e8e0c8;border-radius:12px;grid-template-columns:80px 100px 1fr auto;align-items:center;gap:14px;padding:14px;display:grid}.vc-row img{object-fit:contain;width:72px;height:72px}.vc-img-placeholder{color:#94a3b8;background:#f1f5f9;border-radius:10px;justify-content:center;align-items:center;width:72px;height:72px;font-size:24px;display:flex}.vc-word{color:var(--primary);font-size:18px;font-weight:900}.vc-sentence{color:var(--text-dark);font-weight:700}.vc-actions{gap:10px;display:flex}.vc-btn{cursor:pointer;background:#fff;border:2px solid #e0e0e0;border-radius:12px;width:48px;height:48px;font-size:20px;transition:transform .18s,border-color .18s,background .18s}.vc-btn:hover:not(:disabled){transform:scale(1.08)}.vc-btn:disabled{cursor:default}.vc-btn.is-selected-ok{color:#2e7d32;background:#d4edda;border-color:#2e7d32}.vc-btn.is-selected-bad{color:#c62828;background:#ffebee;border-color:#c62828}.vc-row.is-correct{border-color:#2e7d32}.vc-row.is-wrong{border-color:#c62828}@media (max-width:700px){.vc-banner{margin-bottom:12px;padding:10px 12px}.vc-banner h2{font-size:15px}.vc-banner p{font-size:12px}.vc-row{grid-template-columns:56px 1fr;gap:10px;padding:10px}.vc-img-placeholder,.vc-row img{width:56px;height:56px}.vc-word{grid-column:2;font-size:15px}.vc-sentence{grid-column:1/-1;font-size:13px}.vc-actions{grid-column:1/-1;justify-content:stretch;gap:8px}.vc-actions .btn,.vc-actions button{flex:1;min-height:40px;font-size:13px}.vc-worksheet{border-radius:14px;padding:12px 10px}.vc-title{font-size:17px}.vc-instruction{font-size:13px}}.rc-page{--rc-paper:#fffef8}.rc-banner{background:linear-gradient(135deg,var(--primary-light) 0,#fff 100%);border:2px solid var(--primary-hover);border-radius:16px;margin-bottom:20px;padding:20px 24px}.rc-banner h2{color:var(--primary);margin-bottom:4px;font-size:18px;font-weight:900}.rc-banner p{color:var(--text-muted);font-size:14px;font-weight:700}.rc-meta-row{align-items:center;gap:10px;margin-bottom:16px;display:flex}.rc-worksheet{background:var(--rc-paper);border:2px solid #e8e0c8;border-radius:20px;padding:24px 20px 28px;position:relative;box-shadow:0 8px 32px #0d2b6e14}.rc-ws-title{text-align:center;color:var(--primary);margin-bottom:6px;font-size:22px;font-weight:900}.rc-ws-instruction{text-align:center;color:var(--text-dark);margin-bottom:16px;font-size:16px;font-weight:700}.rc-bank{background:#d4edda;border:2px solid #a8d5b5;border-radius:14px;flex-wrap:wrap;justify-content:center;gap:10px;margin-bottom:20px;padding:14px;display:flex}.rc-chip{cursor:grab;-webkit-user-select:none;user-select:none;touch-action:none;background:#fff;border:2px solid #a8d5b5;border-radius:999px;padding:8px 16px;font-weight:800;transition:border-color .15s,background .15s,opacity .15s,transform .15s}.rc-chip:active{cursor:grabbing}.rc-chip.is-dragging{opacity:.45;transform:scale(.96)}.rc-chip.is-selected{border-color:var(--primary);background:var(--primary-light)}.rc-drag-ghost{z-index:80;pointer-events:none;border:2px solid var(--primary);background:#fff;border-radius:999px;padding:8px 16px;font-weight:800;position:fixed;transform:translate(-50%,-120%);box-shadow:0 8px 20px #19376d33}.rc-sentence-list{flex-direction:column;gap:0;display:flex}.rc-row{background:#fffef8;border:2px solid #e8e0c8;border-radius:12px;flex-wrap:wrap;align-items:center;gap:14px;margin-bottom:12px;padding:14px;display:flex}.rc-row img{object-fit:contain;width:56px;height:56px}.rc-sentence{flex:1;min-width:200px;font-size:17px;font-weight:700;line-height:1.6}.rc-blank{border-bottom:3px solid var(--primary);text-align:center;min-width:90px;color:var(--primary);cursor:pointer;padding:4px 8px;font-weight:900;transition:background .15s,box-shadow .15s,border-color .15s;display:inline-block}.rc-blank.is-drop-target{background:var(--primary-light);border-radius:8px;box-shadow:0 0 0 3px #19376d2e}.rc-blank.is-filled{cursor:pointer}.rc-blank.is-correct{color:#2e7d32;border-color:#2e7d32}.rc-blank.is-wrong{color:#c62828;border-color:#c62828}@media (max-width:600px){.rc-worksheet{border-radius:14px;padding:12px 10px 14px}.rc-banner{margin-bottom:12px;padding:10px 12px}.rc-banner h2{font-size:15px}.rc-banner p{font-size:12px}.rc-sentence{min-width:0;max-width:100%;font-size:14px;line-height:1.45}.rc-row{gap:8px}.rc-blank{min-width:64px;font-size:14px}}.rm-page{--rm-paper:#fffef8}.rm-banner{background:linear-gradient(135deg,var(--primary-light) 0,#fff 100%);border:2px solid var(--primary-hover);border-radius:16px;margin-bottom:20px;padding:20px 24px}.rm-banner h2{color:var(--primary);margin-bottom:4px;font-size:18px;font-weight:900}.rm-banner p{color:var(--text-muted);font-size:14px;font-weight:700}.rm-meta-row{align-items:center;gap:10px;margin-bottom:16px;display:flex}.rm-worksheet{background:var(--rm-paper);border:2px solid #e8e0c8;border-radius:20px;padding:24px 20px 28px;position:relative;box-shadow:0 8px 32px #0d2b6e14}.rm-ws-title{text-align:center;color:var(--primary);margin-bottom:6px;font-size:22px;font-weight:900}.rm-ws-instruction{text-align:center;color:var(--text-dark);margin-bottom:8px;font-size:16px;font-weight:700}.rm-touch-hint{text-align:center;color:var(--text-muted);margin-bottom:16px;font-size:13px;font-weight:700}.rm-board{--rm-row-h:80px;--rm-thumb-h:56px;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:16px;max-width:760px;margin-top:12px;margin-left:auto;margin-right:auto;display:grid}.rm-col h3{color:var(--primary);text-transform:uppercase;letter-spacing:.08em;align-items:center;gap:6px;margin-bottom:14px;font-size:14px;font-weight:800;display:flex}.rm-image-card,.rm-sentence{min-height:var(--rm-row-h);border-radius:var(--radius-md);cursor:pointer;background:#fff;border:2px solid #e2e8f0;margin-bottom:8px;padding:8px 14px;font-size:14px;font-weight:700;line-height:1.35;transition:transform .2s cubic-bezier(.34,1.56,.64,1),border-color .2s,box-shadow .2s,background-color .2s,opacity .2s;position:relative;box-shadow:0 4px 6px -1px #0d2b6e08,0 2px 4px -1px #0d2b6e05}.rm-sentence{-webkit-line-clamp:2;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.rm-image-card:hover:not(.is-matched),.rm-sentence:hover:not(.is-matched){border-color:var(--primary);transform:translateY(-3px)scale(1.01);box-shadow:0 10px 15px -3px #0d2b6e14,0 4px 6px -2px #0d2b6e0a}.rm-image-card:active:not(.is-matched),.rm-sentence:active:not(.is-matched){transform:scale(.99)}.rm-image-card.is-selected,.rm-sentence.is-selected{border-color:var(--primary);background:var(--primary-light);box-shadow:0 0 0 3px #0d2b6e29}.rm-image-card.is-matched,.rm-sentence.is-matched{opacity:.85;pointer-events:none;cursor:default}.rm-image-card.is-matched.is-correct,.rm-sentence.is-matched.is-correct{color:#15803d;background:#f0fdf4;border-color:#22c55e;animation:wm-pop .5s cubic-bezier(.175,.885,.32,1.275) forwards}.rm-image-card.is-matched.is-wrong,.rm-sentence.is-matched.is-wrong{color:#b91c1c;background:#fee2e2;border-color:#ef4444;animation:wm-shake .4s ease-in-out}.rm-sentence:after{right:-6px}.rm-image-card:before,.rm-sentence:after{content:"";background-color:var(--primary);z-index:2;border:2px solid #fff;border-radius:50%;width:10px;height:10px;transition:transform .2s cubic-bezier(.175,.885,.32,1.275);position:absolute;top:50%;transform:translateY(-50%)scale(0);box-shadow:0 0 0 2px #0d2b6e4d}.rm-image-card:before{left:-6px}.rm-image-card.is-selected:before,.rm-image-card:hover:not(.is-matched):not(.is-wrong):before,.rm-sentence.is-selected:after,.rm-sentence:hover:not(.is-matched):not(.is-wrong):after{transform:translateY(-50%)scale(1)}.rm-image-card.is-matched.is-correct:before,.rm-sentence.is-matched.is-correct:after{background-color:#22c55e;transform:translateY(-50%)scale(1);box-shadow:0 0 0 2px #22c55e4d}.rm-image-card.is-matched.is-wrong:before,.rm-sentence.is-matched.is-wrong:after{background-color:#ef4444;transform:translateY(-50%)scale(1);box-shadow:0 0 0 2px #ef44444d}.rm-image-card{align-items:center;gap:12px;padding:8px 12px;display:flex}.rm-image-card img{object-fit:contain;background:#f8fafc}.rm-image-card img,.rm-img-placeholder{width:var(--rm-thumb-h);height:var(--rm-thumb-h);border-radius:var(--radius-sm);flex-shrink:0}.rm-img-placeholder{color:#94a3b8;background:#f1f5f9;justify-content:center;align-items:center;font-size:20px;display:flex}.rm-label{min-width:20px;font-size:14px;font-weight:900}.rm-label,.rm-text-badge-wrapper{color:var(--primary);flex-shrink:0;justify-content:center;align-items:center;display:flex}.rm-text-badge-wrapper{width:var(--rm-thumb-h);height:var(--rm-thumb-h);-webkit-user-select:none;user-select:none;text-shadow:0 1px 1px #fffc;background:linear-gradient(135deg,#e8eef8,#d0daf0);border:2px solid #b8cbe8;border-radius:50%;font-size:18px;font-weight:800;box-shadow:0 2px 4px #0d2b6e14}@media (max-width:768px){.rm-board{--rm-row-h:64px;--rm-thumb-h:44px;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:8px}.rm-worksheet{border-radius:14px;padding:12px 10px 14px}.rm-banner{margin-bottom:12px;padding:10px 12px}.rm-banner h2{font-size:15px}.rm-banner p{font-size:12px}.rm-ws-title{font-size:17px}.rm-ws-instruction{font-size:13px}.rm-col h3{font-size:11px}.rm-sentence{padding:6px 8px;font-size:12px}.rm-image-card{gap:6px;padding:4px 6px}.rm-image-card:before,.rm-sentence:after{display:none}}@media (max-width:480px){.rm-board{--rm-row-h:56px;--rm-thumb-h:40px;gap:6px}.rm-sentence{font-size:11px}}.game-lesson-panel,.game-lesson-panel--exercise,.game-lesson-tabs{width:100%;min-width:0}.game-lesson-tab-list{width:min(100%,var(--game-max));justify-content:center;gap:8px;margin:0 auto;padding:16px 24px 0;display:flex}.game-lesson-tab{border:1px solid var(--border);border-radius:var(--radius-sm) var(--radius-sm) 0 0;background:var(--white);min-height:42px;color:var(--text-muted);font:inherit;cursor:pointer;padding:9px 20px;font-weight:800}.game-lesson-tab:hover{color:var(--primary);background:var(--primary-light)}.game-lesson-tab.active{border-color:var(--primary);background:var(--primary);color:var(--white)}.game-lesson-panel--lesson{padding:20px clamp(12px,3vw,40px) 32px}.game-lesson-panel--lesson .ebook-flip-root{width:100%;max-width:1200px;margin:0 auto}@media (max-width:600px){.game-lesson-tab-list{padding:10px 12px 0}.game-lesson-tab{flex:1;padding-inline:12px}.game-lesson-panel--lesson{padding:12px 0 24px}.cc-worksheet,.law-worksheet,.rc-worksheet,.rm-worksheet,.vc-worksheet{min-width:0;max-width:100%;overflow-x:clip}.cc-meta-row,.law-meta-row,.law-word-bank,.rc-meta-row,.rm-meta-row,.vc-meta-row{flex-wrap:wrap;min-width:0;max-width:100%;margin-bottom:10px}.cc-opt-wrap,.law-chip,.rc-sentence,.rm-image-card,.rm-sentence,.vc-sentence,.wm-item,.wm-word-btn{overflow-wrap:anywhere;word-break:break-word;min-width:0;max-width:100%}.cc-banner,.law-banner,.rc-banner,.rm-banner,.vc-banner,.wm-hint{max-width:100%}.cc-banner h2,.cc-ws-title,.law-banner h2,.law-title,.rc-banner h2,.rm-banner h2,.rm-ws-title,.vc-banner h2,.vc-title{overflow-wrap:anywhere;word-break:break-word}.wm-board{--wm-row-h:58px;column-gap:8px;padding:10px}.wm-item{width:100%}.wm-img,.wm-img-placeholder{max-width:100%}.cc-picture,.cc-prompt,.cc-stem{min-width:0;max-width:100%}.cc-picture img,.cc-stem img{max-width:100%;height:auto}.rc-blank{min-width:0}.rc-blank,.vc-row,.vc-row img{max-width:100%}.vc-row img{height:auto}.rm-image-card,.rm-sentence{width:100%}.rm-image-card img{max-width:100%}.question-list{gap:6px;margin-bottom:16px}.q-list-item{border-radius:10px;gap:10px;padding:10px 12px}.q-num{width:28px;height:28px;font-size:12px}.list-title{margin-bottom:10px;font-size:16px}.list-stats+.game-actions{margin-top:10px}.game-actions{margin-top:14px}}@media (max-width:480px){.law-word-bank{justify-content:center;gap:6px}.law-chip{padding:6px 10px;font-size:12px}.cc-options{width:100%}.cc-opt-wrap{justify-content:flex-start;width:100%}.rm-col h3,.wm-col-title{font-size:10px}.vc-actions{flex-wrap:wrap;width:100%}.vc-actions .btn,.vc-actions button{flex:auto;min-width:0}.q-list-item{padding:8px 10px}.q-preview{font-size:13px}}:root{--primary:#0d2b6e;--primary-dark:#0a224f;--primary-light:#e8eef8;--primary-hover:#d0daf0;--accent-gold:#7fa8e0;--text-dark:#1e293b;--text-muted:#64748b;--border:#e2e8f0;--white:#fff;--sidebar-width:220px;--bg-page:#f1f5f9;--content-max:1680px;--footer-height:auto;--radius-lg:16px;--radius-md:12px;--radius-sm:8px;--shadow-sm:0 1px 3px #0000000d;--shadow-md:0 4px 6px -1px #0000000d,0 2px 4px -1px #00000008;--shadow-lg:0 10px 25px -5px #0000000d,0 8px 10px -6px #00000008;--shadow-glow:0 0 20px #0d2b6e1f}.hidden{display:none!important}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-nunito),"Nunito",sans-serif;background:var(--bg-page);color:var(--text-dark);min-height:100vh;overflow-x:hidden}.page-shell{flex-direction:column;min-height:100vh;display:flex}.app{flex:1;min-height:0;display:flex;position:relative}.sidebar{width:var(--sidebar-width);z-index:10;background:#fff;border-right:1px solid #e2e8f0;flex-direction:column;flex-shrink:0;min-height:100%;display:flex;box-shadow:2px 0 8px #00000005}.sidebar-logo{cursor:pointer;background:linear-gradient(90deg,#0a1435,#122b6b 50%,#0a1435);border-bottom:1px solid #ffffff14;justify-content:center;align-items:center;min-height:76px;padding:16px 20px;text-decoration:none;display:flex}.sidebar-logo img{object-fit:contain;filter:drop-shadow(0 2px 4px #0003);width:auto;max-width:140px;height:auto;max-height:48px}.sidebar-user{background:#fafafa;border-bottom:1px solid #f1f5f9;flex-direction:column;align-items:center;gap:16px;padding:24px 16px;display:flex}.sidebar-user-avatar{background:linear-gradient(135deg,var(--primary-light),#cbdaf8);width:64px;height:64px;color:var(--primary);border:3px solid #fff;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;font-size:20px;font-weight:800;transition:all .3s;display:flex;box-shadow:0 4px 12px #0d2b6e1f}.sidebar-user:hover .sidebar-user-avatar{transform:scale(1.05);box-shadow:0 6px 16px #0d2b6e2e}.sidebar-user-meta{flex-direction:column;align-items:center;gap:12px;width:100%;min-width:0;display:flex}.sidebar-user-name{width:100%;color:var(--text-dark);text-align:center;text-overflow:ellipsis;white-space:nowrap;font-size:16px;font-weight:800;line-height:1.25;overflow:hidden}.sidebar-user-role{color:#1d4ed8;text-align:center;background:#eff6ff;border:1px solid #dbeafe;border-radius:12px;width:100%;padding:10px 12px;font-size:12px;font-weight:700;line-height:1.35}.sidebar-user .badge-rank--sidebar{background:#f8fafc;border:1px solid #e2e8f0;border-radius:12px;flex-direction:column;align-items:stretch;gap:8px;width:100%;padding:12px;display:flex;box-shadow:inset 0 1px 2px #00000005}.sidebar-user .badge-rank-head{justify-content:center;align-items:center;gap:8px;display:flex}.sidebar-user .badge-rank--sidebar img{flex-shrink:0;width:28px;height:28px;display:block}.sidebar-user .badge-rank-level{color:var(--primary);font-size:13px;font-weight:800;line-height:1}.sidebar-user .badge-rank-exp-track{background:#e2e8f0;border-radius:999px;width:100%;height:6px;overflow:hidden}.sidebar-user .badge-rank-exp-fill{border-radius:inherit;background:linear-gradient(90deg,var(--primary) 0,#3b82f6 100%);min-width:4px;height:100%;display:block}.sidebar-user .badge-rank-exp-text{color:var(--text-muted);text-align:center;white-space:nowrap;text-overflow:ellipsis;font-size:11px;font-weight:700;line-height:1.2;overflow:hidden}.sidebar-nav{flex-direction:column;gap:8px;display:flex}.sidebar-filters,.sidebar-nav{-webkit-overflow-scrolling:touch;flex:1;padding:16px 14px;overflow-y:auto}.sidebar-filters{min-height:0}.sidebar-filters .filter-section{margin-bottom:0}.sidebar-filters .filter-title{color:#64748b;text-transform:uppercase;letter-spacing:.05em;margin-bottom:12px;font-size:13px;font-weight:800}.sidebar-filters .filter-grid{flex-direction:column;gap:8px;display:flex}.sidebar-filters .filter-item{text-align:left;color:#475569;background:#f8fafc;border:1px solid #e2e8f0;border-radius:10px;justify-content:flex-start;gap:12px;width:100%;min-height:44px;padding:11px 14px;font-size:14px;font-weight:700;transition:all .2s}.sidebar-filters .filter-item i{text-align:center;opacity:.9;flex-shrink:0;width:18px;font-size:15px}.sidebar-filters .filter-item:hover{color:var(--primary);background:#f0f5ff;border-color:#cbd5e1}.sidebar-filters .filter-item.active{color:#fff;background:linear-gradient(135deg,#0d2b6e,#1a449c);border-color:#0d2b6e;font-weight:800;box-shadow:0 4px 10px #0d2b6e33}.filter-grid .filter-item--solo{grid-column:auto}.nav-item{color:#64748b;cursor:pointer;border-radius:10px;align-items:center;gap:12px;padding:12px 16px;font-size:15px;font-weight:700;text-decoration:none;transition:all .25s;display:flex}.nav-item i{text-align:center;width:20px;font-size:18px;transition:transform .25s}.nav-item:hover{color:var(--primary);background:#f1f5f9}.nav-item:hover i{transform:translate(2px)}.nav-item.active{color:#fff;background:linear-gradient(135deg,#0d2b6e,#1a449c);box-shadow:0 4px 12px #0d2b6e40}.nav-item.active i{color:#fff}.sidebar-version{color:#94a3b8;text-align:center;border-top:1px solid #f1f5f9;padding:16px 24px;font-size:11px;font-weight:600}.main{background:#f1f5f9;flex-direction:column;flex:1;min-width:0;display:flex}.header{box-sizing:border-box;background:linear-gradient(90deg,#0a1435,#122b6b 50%,#0a1435);border-bottom:1px solid #ffffff14;justify-content:space-between;height:76px;min-height:76px;max-height:76px;padding:0 clamp(12px,2vw,20px);box-shadow:0 2px 10px #0a143559}.header,.header-left{align-items:center;gap:12px;display:flex}.header-left{min-width:0}.header-title{color:#fff;white-space:nowrap;text-overflow:ellipsis;font-size:16px;font-weight:700;overflow:hidden}.btn-login{color:var(--white);cursor:pointer;background:linear-gradient(135deg,#0d2b6e,#1a449c);border:none;border-radius:10px;padding:10px 24px;font-family:inherit;font-size:15px;font-weight:700;transition:all .25s;box-shadow:0 4px 10px #0d2b6e33}.btn-login:hover{background:linear-gradient(135deg,#0a224f,#153880);transform:translateY(-1px);box-shadow:0 6px 14px #0d2b6e4d}.badge-rank{color:#0d2b6e;background:linear-gradient(135deg,#fffbeb,#fef3c7);border:1px solid #fde68a;border-radius:14px;align-items:center;gap:8px;padding:5px 10px;font-weight:800;display:inline-flex;box-shadow:0 2px 8px #0d2b6e14}.badge-rank-content{flex-direction:column;gap:2px;width:112px;line-height:1;display:flex}.badge-rank-level{color:#0d2b6e;font-size:11px;font-weight:800}.badge-rank img{flex-shrink:0;width:28px;height:28px;display:block}.badge-rank-exp-track{background:#0d2b6e1f;border-radius:999px;width:100%;height:5px;overflow:hidden;box-shadow:inset 0 1px 2px #0d2b6e14}.badge-rank-exp-fill{border-radius:inherit;background:linear-gradient(90deg,#0d2b6e,#1a449c 60%,#d6a84b);height:100%;transition:width .5s ease-out;display:block}.badge-rank-exp-text{color:#8a5b0a;text-overflow:ellipsis;white-space:nowrap;font-size:9px;font-weight:800;line-height:1.2;overflow:hidden}@media (prefers-reduced-motion:reduce){.badge-rank-exp-fill{transition:none}}.header-actions{background:#ffffff14;border:1px solid #ffffff24;border-radius:10px;padding:3px}.action-item,.header-actions{align-items:center;gap:2px;display:flex}.action-item{cursor:pointer;color:#e4c28e;border-radius:8px;flex-direction:column;padding:4px 12px;text-decoration:none;transition:all .2s}.action-item:hover{color:#f5e6c8;box-shadow:none;background:#ffffff1f}.action-item i{font-size:16px}.action-item span{white-space:nowrap;font-size:11px;font-weight:700}.action-divider{background:#ffffff2e;flex-shrink:0;width:1px;height:28px;margin:0 2px}.action-item-logout{background:0 0;border:none;font-family:inherit}.action-item-logout:hover{color:#ffb4a8;background:#fdecea2e}.content{background:#f1f5f9;flex:1;width:100%;min-width:0;padding:0 clamp(12px,2vw,24px) clamp(16px,2.5vw,24px)}.content-inner{max-width:var(--content-max);width:100%;margin:0 auto}.app.no-sidebar .content-inner{max-width:min(100%,var(--content-max))}.tabs-primary{border-bottom:1px solid var(--border);gap:40px;margin-bottom:0;padding:20px 0 0;display:flex}.tab-primary{color:var(--text-muted);cursor:pointer;background:0 0;border:none;padding-bottom:14px;font-family:inherit;font-size:16px;font-weight:700;position:relative}.tab-primary.active{color:var(--primary)}.tab-primary.active:after{content:"";background:var(--primary);border-radius:3px 3px 0 0;height:3px;position:absolute;bottom:-1px;left:0;right:0}.tabs-secondary{background:#f1f5f9;border:1px solid #cbd5e1;border-radius:30px;gap:4px;margin:clamp(16px,2.5vw,24px) 0 clamp(14px,2vw,20px);padding:5px;display:inline-flex}.tab-secondary{color:var(--text-muted);cursor:pointer;background:0 0;border:none;border-radius:25px;align-items:center;gap:8px;padding:10px 24px;font-family:inherit;font-size:14px;font-weight:700;transition:all .25s cubic-bezier(.4,0,.2,1);display:inline-flex}.tab-secondary:hover{color:var(--primary)}.tab-secondary.active{color:#fff;background:var(--primary);box-shadow:0 4px 12px #0d2b6e40}.tab-secondary.active:after{display:none}.content-body{display:block}.filters{box-shadow:none;background:0 0;border:none;border-radius:0;padding:0}.filter-section{margin-bottom:0}.filter-title{color:#0f172a;align-items:center;gap:8px;margin-bottom:16px;font-size:16px;font-weight:800;display:flex}.filter-title:before{content:"";background:#0d2b6e;border-radius:2px;width:4px;height:16px;display:inline-block}.filter-list{list-style:none}.filter-item{color:#475569;cursor:pointer;text-align:center;background:#f8fafc;border:1px solid #e2e8f0;border-radius:10px;justify-content:center;align-items:center;min-height:42px;padding:10px 14px;font-size:14px;font-weight:750;transition:all .2s;display:flex}.filter-item:hover{color:#0d2b6e;background:#f0f5ff;border-color:#0d2b6e}.filter-item.active{color:#fff;background:linear-gradient(135deg,#0d2b6e,#1a449c);border-color:#0d2b6e;box-shadow:0 4px 8px #0d2b6e26}.filter-grid{grid-template-columns:1fr 1.2fr;align-items:center;gap:8px 10px;display:grid}.filter-grid .filter-item{font-size:13px}.filter-grid .filter-item[data-filter-type=level]{padding-left:8px}.filter-grid .filter-item.is-empty,.filter-grid .filter-item.is-spacer,.filter-grid .filter-item:empty{visibility:hidden;pointer-events:none;background:0 0;border:none;height:0;min-height:0;margin:0;padding:0}.courses-area{background:#fff;border:1px solid #dde4f0;border-radius:16px;min-width:0;padding:clamp(14px,2vw,20px);box-shadow:0 2px 12px #0d2b6e12}.courses-header{align-items:center;gap:9px;margin-bottom:14px;display:flex}.courses-header-icon{width:28px;height:28px;color:var(--white);background:linear-gradient(135deg,#0d2b6e,#1a449c);border-radius:50%;justify-content:center;align-items:center;font-size:12px;display:flex;box-shadow:0 4px 8px #0d2b6e26}.courses-header-text{color:#0f172a;font-size:16px;font-weight:800}.courses-header i.fa-chevron-down{display:none}.course-grid{grid-template-columns:repeat(5,minmax(0,1fr));align-items:stretch;gap:24px;display:grid}.course-card{background:var(--white);cursor:pointer;border:1px solid #e2e8f0;border-radius:14px;flex-direction:column;min-width:0;text-decoration:none;transition:transform .3s cubic-bezier(.34,1.56,.64,1),box-shadow .3s,border-color .3s;display:flex;overflow:hidden;box-shadow:0 4px 16px #0f172a0a}.course-card:hover{border-color:var(--primary);transform:translateY(-6px);box-shadow:0 12px 28px #0d2b6e1f}.course-thumb{aspect-ratio:4/2.35;object-fit:cover;border-bottom:1px solid #0d2b6e0d;width:100%;transition:transform .4s;display:block}.course-card:hover .course-thumb{transform:scale(1.03)}.course-title{color:#0f172a;text-align:left;-webkit-line-clamp:2;white-space:normal;-webkit-box-orient:vertical;height:2.8em;padding:0;font-size:15px;font-weight:800;line-height:1.4;display:-webkit-box;overflow:hidden}.course-card-body{flex-direction:column;flex-grow:1;gap:12px;padding:16px;display:flex}.course-level{color:var(--primary);background:var(--primary-light);letter-spacing:.2px;text-overflow:ellipsis;white-space:nowrap;border-radius:20px;width:fit-content;max-width:100%;padding:4px 10px;font-size:11px;font-weight:750;line-height:1;overflow:hidden}.course-progress-text{color:var(--text-muted);margin-bottom:-4px;font-size:12px;font-weight:600;line-height:1.2}.course-progress-track{background:#e2e8f0;border-radius:999px;width:100%;height:6px;display:block;overflow:hidden}.course-progress-fill{border-radius:inherit;background:linear-gradient(90deg,var(--primary) 0,#1a449c 100%);height:100%;transition:width .4s ease-out;display:block}.course-start-button{background:var(--primary);color:#fff;border-radius:8px;height:36px;margin-top:auto;font-size:13px;font-weight:700;line-height:1;transition:all .2s;box-shadow:0 2px 4px #0d2b6e14}.course-start-button,.course-thumb-placeholder{justify-content:center;align-items:center;display:flex}.course-thumb-placeholder{aspect-ratio:4/2.35;width:100%;transition:all .3s;position:relative;overflow:hidden}.course-card:hover .course-thumb-placeholder{filter:saturate(1.1)}.course-thumb-placeholder:before{content:"";background:radial-gradient(circle,#ffffff26 0,#0000 60%);width:120%;height:120%;transition:transform .5s;position:absolute;top:-10%;left:-10%}.course-card:hover .course-thumb-placeholder:before{transform:scale(1.2)}.course-thumb-placeholder .thumb-icon{color:#fff;z-index:1;filter:drop-shadow(0 4px 8px #00000026);font-size:30px;transition:all .3s}.course-card:hover .thumb-icon{transform:scale(1.1)rotate(5deg)}.filter-grid .filter-item--alphabet{border-color:#0d2b6e40}.filter-grid .filter-item--alphabet i{color:var(--primary)}.courses-header--alphabet{color:#fff;background:linear-gradient(90deg,#2e9b4f,#1f8f6a 55%,#178a7a);border-radius:18px;align-items:center;gap:12px;min-height:48px;margin:0 0 18px;padding:10px 16px;display:flex;box-shadow:0 6px 16px #178a7a38}.courses-header--alphabet .alphabet-header-back{color:#fff;cursor:pointer;background:0 0;border:none;border-radius:50%;justify-content:center;align-items:center;width:36px;height:36px;padding:0;font-size:18px;transition:background .2s,transform .2s;display:inline-flex}.courses-header--alphabet .alphabet-header-back:hover{background:#ffffff29;transform:translate(-1px)}.courses-header--alphabet .alphabet-header-back:focus-visible{outline-offset:2px;outline:2px solid #fff}.courses-header--alphabet .courses-header-text{color:#fff;letter-spacing:.01em;font-size:15px;font-weight:700}.courses-header--alphabet .courses-header-icon,.courses-header--alphabet i.fa-chevron-down{display:none}.alphabet-grid{grid-template-columns:repeat(2,minmax(0,1fr));align-items:stretch;gap:16px;display:grid}.alphabet-card{--alphabet-accent:var(--primary);--alphabet-soft:var(--primary-light);min-width:0;min-height:92px;color:inherit;background:#fff;border:1px solid #e6ecf4;border-radius:16px;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:14px;padding:14px 16px;text-decoration:none;transition:transform .25s,box-shadow .25s,border-color .25s;display:grid;position:relative;overflow:hidden;box-shadow:0 4px 14px #0f172a0d}.alphabet-card:hover{border-color:var(--alphabet-accent);transform:translateY(-3px);box-shadow:0 10px 24px #0d2b6e1a}@supports (color:color-mix(in lab,red,red)){.alphabet-card:hover{border-color:color-mix(in srgb,var(--alphabet-accent) 35%,#e6ecf4)}}.alphabet-card:focus-visible{outline:3px solid var(--alphabet-accent)}@supports (color:color-mix(in lab,red,red)){.alphabet-card:focus-visible{outline:3px solid color-mix(in srgb,var(--alphabet-accent) 70%,white)}}.alphabet-card:focus-visible{outline-offset:3px}.alphabet-card-icon{background:radial-gradient(circle at 30% 28%,#fff 0,transparent 42%),radial-gradient(circle at 72% 70%,var(--alphabet-accent) 0,transparent 55%),var(--alphabet-soft);border-radius:50%;flex-shrink:0;width:58px;height:58px;position:relative}@supports (color:color-mix(in lab,red,red)){.alphabet-card-icon{background:radial-gradient(circle at 30% 28%,#fff 0,transparent 42%),radial-gradient(circle at 72% 70%,color-mix(in srgb,var(--alphabet-accent) 18%,transparent) 0,transparent 55%),var(--alphabet-soft)}}.alphabet-card-icon{box-shadow:inset 0 0 0 1px var(--alphabet-accent);overflow:hidden}@supports (color:color-mix(in lab,red,red)){.alphabet-card-icon{box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--alphabet-accent) 14%,transparent)}}.alphabet-card-icon-letter{letter-spacing:-.03em;color:var(--alphabet-accent);justify-content:center;align-items:center;font-size:18px;font-weight:800;display:flex;position:absolute;inset:0}.alphabet-card-body{flex-direction:column;gap:2px;min-width:0;display:flex}.alphabet-card-label{color:#94a3b8;font-size:12px;font-weight:600;line-height:1.2}.alphabet-card-title{color:var(--primary);font-size:20px;font-weight:800;line-height:1.15}.alphabet-card-desc{color:#64748b;-webkit-line-clamp:2;-webkit-box-orient:vertical;font-size:13px;font-weight:500;line-height:1.35;display:-webkit-box;overflow:hidden}.alphabet-card-meta{flex-direction:column;flex-shrink:0;justify-content:center;align-items:center;gap:4px;min-width:56px;display:flex}.alphabet-progress{width:48px;height:48px;position:relative}.alphabet-progress-svg{width:100%;height:100%;transform:rotate(-90deg)}.alphabet-progress-fill,.alphabet-progress-track{fill:none;stroke-width:4px}.alphabet-progress-track{stroke:#e2e8f0}.alphabet-progress-fill{stroke:#e85a7a;stroke-linecap:round;transition:stroke-dashoffset .35s}.alphabet-progress-text{color:var(--primary);justify-content:center;align-items:center;font-size:11px;font-weight:800;line-height:1;display:flex;position:absolute;inset:0}.alphabet-card-retry{color:#e11d48;white-space:nowrap;font-size:11px;font-weight:700;line-height:1.2}@media (max-width:720px){.alphabet-grid{grid-template-columns:1fr;gap:12px}.alphabet-card{gap:12px;min-height:84px;padding:12px 14px}.alphabet-card-icon{width:52px;height:52px}.alphabet-card-title{font-size:18px}.alphabet-card-desc{font-size:12px}}@media (max-width:1200px){.course-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}}@media (max-width:900px){.course-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}}@media (max-width:640px){.course-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}}@media (max-width:480px){.course-grid{grid-template-columns:1fr;gap:16px}}@media (max-width:900px){.sidebar-filters .filter-grid{flex-direction:column;gap:8px;display:flex}.sidebar-filters .filter-grid .filter-item{width:100%;min-height:44px;padding:11px 14px;font-size:14px}}.view-detail{background:linear-gradient(165deg,#eef2f8,#f6f8fc 42%,#f8fafc);border-radius:0 0 20px 20px;min-height:0;margin:0;padding:clamp(16px,2.5vw,24px) 0 clamp(28px,4vw,40px)}.detail-back{color:var(--text-dark);cursor:pointer;background:#fff;border:1px solid #e2e8f0;border-radius:20px;align-items:center;gap:8px;margin-bottom:24px;padding:8px 18px;font-family:inherit;font-size:14px;font-weight:700;text-decoration:none;transition:all .25s;display:inline-flex;box-shadow:0 2px 8px #00000008}.detail-back:hover{background:var(--primary);color:#fff;border-color:var(--primary);transform:translate(-4px);box-shadow:0 4px 12px #0d2b6e33}.level-pills{justify-content:center;gap:12px;margin-bottom:28px;display:flex}.level-pill{cursor:pointer;border:2px solid var(--primary);background:var(--white);color:var(--primary);border-radius:24px;padding:8px 28px;font-family:inherit;font-size:14px;font-weight:700;transition:all .2s}.level-pill.active{background:var(--primary);color:var(--white);border-color:var(--primary)}.level-pill:hover:not(.active){background:var(--primary-light)}.detail-body{align-items:stretch;gap:clamp(16px,2vw,24px);display:flex}.detail-body--lesson-full .ebook-viewer--natural{height:auto;min-height:0;overflow:visible}.detail-body.is-starters{flex-direction:column;align-items:stretch}.detail-body.is-starters .book-card{width:100%;max-width:560px}.detail-body.is-starters .activity-area{width:100%}.detail-body.is-starters .activity-grid{grid-template-columns:repeat(3,1fr)}@media (max-width:900px){.detail-body.is-starters .activity-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width:520px){.detail-body.is-starters .activity-grid{grid-template-columns:1fr}}.book-card{background:#fff;border:2px solid #0d2b6e24;border-radius:20px;flex-shrink:0;align-self:flex-start;width:min(280px,100%);transition:border-color .25s,box-shadow .25s,transform .25s;position:sticky;top:12px;overflow:hidden;box-shadow:0 6px 24px #0d2b6e12,inset 0 1px #fffffff2}.book-card:before{content:"";z-index:1;background:linear-gradient(90deg,#0a224f,#1a449c 38%,#b8954a 68%,#0a224f);height:4px;position:absolute;top:0;left:0;right:0}.book-card:hover{border-color:#0d2b6e47;transform:translateY(-2px);box-shadow:0 10px 32px #0d2b6e1f}.book-card-top{text-align:center;background:linear-gradient(#f3f6fb,#fff 72%);border-bottom:2px solid #0d2b6e14;flex-direction:column;gap:16px;padding:32px 24px 28px}.book-card-top,.book-thumb{align-items:center;display:flex}.book-thumb{object-fit:cover;width:120px;height:160px;color:var(--white);background:linear-gradient(145deg,#1a3a7a,#0d2b6e 55%,#6b4e2a);border:2px solid #ffffff59;border-radius:12px;flex-shrink:0;justify-content:center;font-size:48px;overflow:hidden;box-shadow:0 10px 22px #0d2b6e38,inset 0 1px #fff3}.book-thumb img{object-fit:cover;width:100%;height:100%}.book-info p{color:#64748b;margin:8px 0 0;font-size:13px;font-weight:700;line-height:1.4}.book-info h2{color:#0a224f;letter-spacing:-.02em;font-size:20px;font-weight:800;line-height:1.4}.book-stats{background:linear-gradient(#fff,#f9fafc);grid-template-columns:1fr 1fr;display:grid}.book-stat{text-align:center;flex-direction:column;justify-content:center;align-items:center;padding:20px 16px;display:flex}.book-stat:first-child{border-right:2px solid #0d2b6e14}.book-stat-value{color:#0d2b6e;margin-bottom:6px;font-size:22px;font-weight:800;line-height:1.2}.book-stat-label{color:#64748b;text-transform:uppercase;letter-spacing:.04em;font-size:11px;font-weight:700;line-height:1.45}.activity-area{flex:1;min-width:0}.detail-main-panel{flex-direction:column;flex:1;gap:0;min-width:0;display:flex;position:relative}.detail-tabs{margin:0 0 16px}.detail-tabs .tab-secondary{align-items:center;gap:8px;display:inline-flex}.course-vocab-panel{background:#faf6f1;border-radius:20px;padding:clamp(16px,2.5vw,28px);box-shadow:0 8px 28px #0f172a0f}.course-vocab-heading{color:#e85a6b;letter-spacing:-.02em;margin:0 0 18px;font-size:clamp(1.35rem,2.4vw,1.75rem);font-weight:800}.course-vocab-list{flex-direction:column;gap:14px;margin:0;padding:0;list-style:none;display:flex}.course-vocab-card{text-align:left;cursor:pointer;background:#fff;border:1.5px solid #f0c4b0;border-radius:16px;width:100%;padding:16px 18px;font-family:inherit;transition:transform .15s,box-shadow .15s,border-color .15s}.course-vocab-card:hover{transform:translateY(-1px);box-shadow:0 6px 18px #0f172a14}.course-vocab-card.is-speaking{box-shadow:0 0 0 3px #e85a6b38}.course-vocab-card--coral{border-color:#f0c4b0}.course-vocab-card--coral .course-vocab-card-title,.course-vocab-card--coral .course-vocab-card-title>i:first-child{color:#e85a6b}.course-vocab-card--green{background:#f4faf2;border-color:#b7d9b0}.course-vocab-card--green .course-vocab-card-title{color:#5a9a4a}.course-vocab-card--green .course-vocab-card-title>i:first-child{color:#e85a6b}.course-vocab-card--amber{border-color:#f0c4b0}.course-vocab-card--amber .course-vocab-card-title{color:#d97706}.course-vocab-card--amber .course-vocab-card-title>i:first-child{color:#e85a6b}.course-vocab-card-title{align-items:center;gap:10px;margin-bottom:10px;font-size:1.15rem;font-weight:800;display:flex}.course-vocab-card-title>span{flex:1;min-width:0}.course-vocab-speak-icon{opacity:.55;color:inherit;font-size:.85rem}.course-vocab-line{color:#1e293b;margin:0 0 6px;font-size:.95rem;line-height:1.45}.course-vocab-line:last-child{margin-bottom:0}.course-vocab-line strong{font-weight:700}.course-vocab-panel--primary{background:#f3f7ff}.course-vocab-list--primary{gap:16px}.course-vocab-flashcard{text-align:left;cursor:pointer;background:#fff;border:2px dashed #7eb6ff;border-radius:18px;width:100%;padding:16px 18px;font-family:inherit;transition:transform .15s,box-shadow .15s,border-color .15s;display:block;position:relative}.course-vocab-flashcard:hover{border-color:#3b82f6;transform:translateY(-1px);box-shadow:0 8px 20px #2563eb1f}.course-vocab-flashcard.is-speaking{border-color:#2563eb;box-shadow:0 0 0 3px #3b82f638}.course-vocab-flashcard-pin{color:#fff;background:#3b82f6;border-radius:999px;justify-content:center;align-items:center;width:28px;height:28px;font-size:.75rem;display:inline-flex;position:absolute;top:-10px;right:18px;box-shadow:0 4px 10px #2563eb59}.course-vocab-flashcard-body{grid-template-columns:minmax(0,1.1fr) minmax(120px,.9fr);align-items:center;gap:14px;display:grid}.course-vocab-flashcard-text{flex-direction:column;gap:6px;min-width:0;display:flex}.course-vocab-flashcard-word{color:#1d4ed8;font-size:clamp(1.35rem,2.4vw,1.8rem);font-weight:800;line-height:1.15}.course-vocab-flashcard-ipa{color:#334155;font-size:1rem;font-weight:500}.course-vocab-flashcard-meaning{color:#0f172a;font-size:1.05rem;font-weight:600}.course-vocab-flashcard-media{background:linear-gradient(#eff6ff,#dbeafe);border-radius:14px;justify-content:center;align-items:center;min-height:110px;display:flex;overflow:hidden}.course-vocab-flashcard-media img{object-fit:contain;width:100%;height:140px;display:block}.course-vocab-flashcard-media>i{color:#93c5fd;font-size:2rem}@media (max-width:640px){.course-vocab-flashcard-body{grid-template-columns:1fr}.course-vocab-flashcard-media img{height:160px}}.detail-panel{flex:1;min-width:0;min-height:0}.detail-panel.is-hidden{display:none!important}.ebook-viewer{background:#fff;border:2px solid #0d2b6e24;border-radius:20px;flex-direction:column;height:min(100vh - 168px,920px);min-height:520px;display:flex;overflow:hidden;box-shadow:0 6px 24px #0d2b6e12}.ebook-viewer--natural{height:auto;min-height:0;overflow:visible}.ebook-viewer--natural .ebook-stage{flex:none;align-items:flex-start;height:auto;min-height:0}.ebook-viewer--natural .ebook-canvas-wrap{justify-content:center;align-items:flex-start;min-height:0;overflow:visible}.ebook-toolbar{border-bottom:1px solid var(--border);background:linear-gradient(#f8fafc,#fff);flex-wrap:wrap;flex-shrink:0;justify-content:space-between;align-items:center;gap:12px;padding:10px 16px;display:flex}.ebook-toolbar-group{align-items:center;gap:8px;display:flex}.ebook-toolbar-center{flex:1;justify-content:center}.ebook-btn{color:#0d2b6e;cursor:pointer;background:#fff;border:2px solid #0d2b6e24;border-radius:10px;justify-content:center;align-items:center;gap:6px;min-width:40px;height:40px;padding:0 12px;font-family:inherit;font-size:14px;font-weight:700;transition:all .22s;display:inline-flex}.ebook-btn:hover:not(:disabled){background:var(--primary-light);border-color:#0d2b6e47;transform:scale(1.04)}.ebook-btn:disabled{opacity:.45;cursor:not-allowed}.ebook-page-info{color:var(--text-dark);text-align:center;font-variant-numeric:tabular-nums;min-width:72px;font-size:15px;font-weight:800}.ebook-stage{background:#e8edf5;flex:1;grid-template-columns:52px minmax(0,1fr) 52px;align-items:stretch;min-height:0;display:grid}.ebook-side-nav{color:#0d2b6e;cursor:pointer;background:0 0;border:none;justify-content:center;align-items:center;padding:0;font-size:22px;transition:background .2s,color .2s;display:flex}.ebook-side-nav:hover:not(:disabled){color:#1a449c;background:#0d2b6e14}.ebook-side-nav:disabled{opacity:.28;cursor:not-allowed}.ebook-canvas-wrap{background:#e8edf5;justify-content:center;align-items:center;min-width:0;min-height:0;padding:8px;display:flex;position:relative;overflow:hidden}.ebook-canvas-wrap canvas{background:#fff;border-radius:4px;flex-shrink:0;width:auto;height:auto;display:block;box-shadow:0 8px 28px #0d2b6e24}.ebook-viewer--flip .ebook-stage{background:0 0;grid-template-columns:none;padding:0;display:block}.ebook-flip-root{justify-content:center;width:100%;display:flex}.ebook-viewer--flip{border-radius:16px}.detail-body--lesson-full .detail-main-panel,.ebook-viewer--flip{width:100%;max-width:1200px;margin:0 auto}.ebook-flip-wrap{background:0 0;justify-content:center;padding:0;display:flex;position:relative;overflow:visible}.ebook-viewer--flip .ebook-side-nav{z-index:5;background:#ffffffeb;border:1px solid #0d2b6e24;border-radius:999px;width:40px;height:40px;font-size:16px;position:absolute;top:50%;transform:translateY(-50%);box-shadow:0 4px 14px #0d2b6e1f}.ebook-viewer--flip .ebook-side-nav-prev{left:8px}.ebook-viewer--flip .ebook-side-nav-next{right:8px}.ebook-viewer--flip .ebook-side-nav:hover:not(:disabled){background:#fff;transform:translateY(-50%)scale(1.05)}.ebook-viewer--flip .ebook-side-nav:disabled{opacity:0;pointer-events:none}.ebook-flip-book{border-radius:2px 10px 10px 2px;margin:0 auto;box-shadow:0 12px 32px #0d2b6e2e}.ebook-flip-page{background:#fffef8;position:relative;overflow:hidden;box-shadow:inset -8px 0 16px #0d2b6e0f}.ebook-flip-page img{object-fit:contain;pointer-events:none;-webkit-user-select:none;user-select:none;-webkit-user-drag:none;image-rendering:auto;-ms-interpolation-mode:bicubic;background:#fff;width:100%;height:100%;display:block}.ebook-vocab-hotspots{z-index:2;pointer-events:none;position:absolute;inset:0}.ebook-vocab-hotspot{cursor:pointer;pointer-events:auto;appearance:none;z-index:1;background:0 0;border:0;border-radius:14px;margin:0;padding:0;transition:transform .22s cubic-bezier(.22,1,.36,1);position:absolute;overflow:visible}.ebook-vocab-hotspot:before{content:"";border-radius:inherit;box-shadow:none;pointer-events:none;background:0 0;border:1.5px solid #0000;transition:border-color .22s,box-shadow .22s,background-color .22s,transform .22s cubic-bezier(.22,1,.36,1);position:absolute;inset:0}.ebook-vocab-hotspot-chip{z-index:2;color:#0f766e;letter-spacing:.01em;opacity:0;pointer-events:none;background:#fffffff0;border:1px solid #0f766e2e;border-radius:999px;align-items:center;gap:.28rem;padding:.28rem .55rem;font-size:.68rem;font-weight:700;line-height:1;transition:opacity .2s,transform .22s cubic-bezier(.22,1,.36,1),background-color .2s,color .2s,border-color .2s;display:inline-flex;position:absolute;top:.45rem;right:.45rem;transform:translateY(6px)scale(.92);box-shadow:0 6px 16px #0f172a1f}.ebook-vocab-hotspot-chip i{font-size:.62rem}.ebook-vocab-hotspot:focus-visible,.ebook-vocab-hotspot:hover{z-index:3;outline:none;transform:translateY(-2px)}.ebook-vocab-hotspot:focus-visible:before,.ebook-vocab-hotspot:hover:before{background:#ffffff1a;border-color:#0f766e6b;box-shadow:0 10px 24px #0f172a1a,inset 0 0 0 1px #ffffff59}.ebook-vocab-hotspot:focus-visible .ebook-vocab-hotspot-chip,.ebook-vocab-hotspot:hover .ebook-vocab-hotspot-chip{opacity:1;transform:translateY(0)scale(1)}.ebook-vocab-hotspot.is-active{z-index:4;transform:translateY(-2px)}.ebook-vocab-hotspot.is-active:before{background:#ffffff0f;border-color:#0d9488b3;animation:ebook-vocab-ring-pulse 1.2s;box-shadow:0 0 0 3px #14b8a629,0 12px 28px #0f172a1f}.ebook-vocab-hotspot.is-active .ebook-vocab-hotspot-chip{opacity:1;color:#fff;background:linear-gradient(135deg,#0d9488,#0f766e);border-color:#0000;transform:translateY(0)scale(1);box-shadow:0 8px 18px #0d948859}.ebook-vocab-hotspot.is-active .ebook-vocab-hotspot-chip i{animation:ebook-vocab-speaker-pulse .9s infinite}@keyframes ebook-vocab-ring-pulse{0%{box-shadow:0 0 #14b8a647,0 12px 28px #0f172a1f}70%{box-shadow:0 0 0 8px #14b8a600,0 12px 28px #0f172a1f}to{box-shadow:0 0 0 3px #14b8a629,0 12px 28px #0f172a1f}}@keyframes ebook-vocab-speaker-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.12)}}@media (prefers-reduced-motion:reduce){.ebook-vocab-hotspot,.ebook-vocab-hotspot-chip,.ebook-vocab-hotspot:before{transition:none}.ebook-vocab-hotspot.is-active .ebook-vocab-hotspot-chip i,.ebook-vocab-hotspot.is-active:before{animation:none}}.ebook-loading-overlay{background:#e8edf5b8;min-height:0;position:absolute;inset:0}.ebook-empty,.ebook-loading{text-align:center;color:var(--text-muted);flex:1;justify-content:center;align-items:center;min-height:320px;padding:32px 24px;font-size:15px;font-weight:600;line-height:1.6;display:flex}.ebook-empty strong{color:var(--primary)}@media (max-width:700px){.ebook-viewer{height:min(100vh - 140px,780px)}.detail-body--lesson-full .ebook-viewer--natural{height:auto;min-height:0}.ebook-stage{grid-template-columns:40px minmax(0,1fr) 40px}.ebook-side-nav{font-size:18px}}.detail-body.is-starters .detail-main-panel{width:100%}.activity-grid{grid-template-columns:repeat(2,1fr);gap:14px;width:100%;min-width:0;display:grid}@media (max-width:900px){.detail-body{flex-direction:column;align-items:stretch}.activity-grid{grid-template-columns:1fr}.book-card{width:100%;max-width:420px;margin:0 auto;position:relative;top:auto}}@media (max-width:600px){.view-detail{padding:12px 0 20px}.detail-back{margin-bottom:12px;padding:8px 14px;font-size:13px}.book-card-top{gap:10px;padding:18px 16px 14px}.book-thumb{width:84px;height:112px;font-size:34px}.book-stat{padding:12px 10px}.book-stat-value{font-size:18px}.activity-card{gap:10px;padding:12px 14px}.activity-icon{width:40px;height:40px;font-size:18px}.activity-label{font-size:14px}}.activity-card{cursor:pointer;background:#fff;border:1px solid #0d2b6e14;border-radius:14px;justify-content:space-between;align-items:center;gap:14px;padding:16px 20px;transition:all .25s cubic-bezier(.4,0,.2,1);display:flex;position:relative;overflow:hidden;box-shadow:0 4px 12px #0d2b6e08}.activity-card:after{content:"";background:0 0;width:4px;height:100%;transition:background-color .2s;position:absolute;top:0;left:0}.activity-card:hover:after{background:var(--primary)}.activity-card:hover[data-activity=grammar]:after{background:#a85f12}.activity-card:hover[data-activity=quiz]:after{background:#0d2b6e}.activity-card:hover[data-activity=pronunciation]:after{background:#5c4d8f}.activity-card:hover[data-activity=scramble]:after{background:#9a5f1a}.activity-card:hover[data-activity=word-match]:after{background:#1a5494}.activity-card:hover[data-activity=look-write]:after{background:#2d6b3a}.activity-card:hover[data-activity=choose-circle]:after{background:#8a6d28}.activity-card:hover[data-activity=read-complete]:after{background:#1e5a96}.activity-card:hover[data-activity=read-match]:after{background:#8f3d5c}.activity-card:hover[data-activity=vocab-test]:after{background:#634878}.activity-card:hover[data-activity=vocab-check]:after{background:#2a6b62}.activity-card[aria-disabled=true]{opacity:.65;cursor:not-allowed;pointer-events:none}.activity-left{align-items:center;gap:14px;min-width:0;display:flex}.activity-progress{color:var(--primary);background:var(--primary-light);white-space:nowrap;border:1px solid #0d2b6e0a;border-radius:20px;flex-shrink:0;padding:6px 14px;font-size:13px;font-weight:700;transition:all .22s}.activity-card:hover .activity-progress{background:var(--primary);color:#fff;border-color:var(--primary);box-shadow:0 2px 6px #0d2b6e26}.activity-card:hover{border-color:#0d2b6e26;transform:translateY(-4px);box-shadow:0 10px 24px #0d2b6e14}.activity-icon{border:1px solid #0000;border-radius:12px;flex-shrink:0;justify-content:center;align-items:center;width:44px;height:44px;font-size:18px;transition:transform .3s;display:flex}.activity-card:hover .activity-icon{transform:scale(1.08)rotate(3deg)}.activity-icon.grammar{color:#a85f12;background:#f5ebe0;border-color:#a85f1238}.activity-icon.quiz{color:#0d2b6e;background:#e6ecf7;border-color:#0d2b6e2e}.activity-icon.pronunciation{color:#5c4d8f;background:#ece8f4;border-color:#5c4d8f33}.activity-icon.scramble{color:#9a5f1a;background:#f3ebe0;border-color:#9a5f1a38}.activity-icon.word-match{color:#1a5494;background:#e4edf7;border-color:#1a549433}.activity-icon.look-write{color:#2d6b3a;background:#e6f0e8;border-color:#2d6b3a33}.activity-icon.choose-circle{color:#8a6d28;background:#f5f0e4;border-color:#8a6d2838}.activity-icon.read-complete{color:#1e5a96;background:#e5edf6;border-color:#1e5a9633}.activity-icon.read-match{color:#8f3d5c;background:#f3e8ec;border-color:#8f3d5c33}.activity-icon.vocab-test{color:#634878;background:#ede8f2;border-color:#63487833}.activity-icon.vocab-check{color:#2a6b62;background:#e4efed;border-color:#2a6b6233}.activity-icon.skill-listening{color:#1e5a96;background:#e8f1fb;border-color:#1e5a9633}.activity-icon.skill-reading{color:#3d6b2a;background:#edf3e8;border-color:#3d6b2a33}.activity-icon.skill-speaking{color:#5c4d8f;background:#efeaf8;border-color:#5c4d8f33}.activity-icon.skill-writing{color:#9a5f1a;background:#f7efe4;border-color:#9a5f1a33}.skill-games-heading{color:#0f172a;margin:0 0 4px;font-size:15px;font-weight:800}.activity-card:hover[data-skill=listening]:after{background:#1e5a96}.activity-card:hover[data-skill=reading]:after{background:#3d6b2a}.activity-card:hover[data-skill=speaking]:after{background:#5c4d8f}.activity-card:hover[data-skill=writing]:after{background:#9a5f1a}.activity-icon.skill-vocabulary{color:#6b4f8a;background:#f3eef8;border-color:#6b4f8a33}.activity-card:hover[data-skill=vocabulary]:after{background:#6b4f8a}.activity-card:hover[data-activity=speaking-word]:after{background:#24734a}.activity-card:hover[data-activity=speaking-sentence]:after{background:#1e5a96}.activity-card:hover[data-activity=speaking-guided]:after{background:#9a5f1a}.activity-card:hover[data-activity=speaking-conversation]:after{background:#5c4d8f}.activity-grid.is-hidden{display:none!important}.starters-mode-hint{color:var(--text-muted);margin-bottom:12px;font-size:13px;font-weight:700;display:none}.starters-mode-hint.show{display:block}.activity-card.is-hidden{display:none!important}.activity-label{color:#0f172a;letter-spacing:-.01em;text-overflow:ellipsis;white-space:nowrap;min-width:0;font-size:15px;font-weight:800;overflow:hidden}.view-leaderboard{background:linear-gradient(#f8fafc,#f1f5f9);flex-direction:column;flex:1;min-height:0;display:flex;position:relative}.lb-page{flex:1;width:100%;max-width:960px;margin:0 auto;padding:0 24px 88px}.lb-top{flex-wrap:wrap;justify-content:space-between;gap:16px;padding:20px 0 16px}.lb-title-row,.lb-top{align-items:center;display:flex}.lb-title-row{gap:12px}.lb-title-row h1{-webkit-text-fill-color:transparent;letter-spacing:-.5px;background:linear-gradient(135deg,#0d2b6e,#1e40af);-webkit-background-clip:text;font-size:28px;font-weight:850}.lb-back{min-height:40px;color:var(--primary);cursor:pointer;background:#ffffffeb;border:2px solid #0d2b6e24;border-radius:12px;flex-shrink:0;align-items:center;gap:8px;padding:8px 14px;font-family:inherit;font-size:14px;font-weight:700;text-decoration:none;transition:transform .22s,background .2s,border-color .2s;display:inline-flex}.lb-back:hover{background:#fff;border-color:#0d2b6e52;transform:scale(1.04)}.lb-title{color:var(--text-dark);font-size:26px;font-weight:800}.period-toggle{background:#e2e8f0;border:1px solid #cbd5e1;border-radius:28px;padding:4px;display:flex;box-shadow:0 2px 12px #00000014}.period-btn{color:var(--text-muted);cursor:pointer;background:0 0;border:none;border-radius:24px;padding:10px 28px;font-family:inherit;font-size:14px;font-weight:700;transition:transform .22s,background .2s,color .2s}.period-btn:hover{color:var(--primary);transform:scale(1.05)}.period-btn.active{color:var(--white);background:linear-gradient(135deg,#0d2b6e,#1a449c);box-shadow:0 4px 10px #0d2b6e33}.period-nav{justify-content:center;align-items:center;gap:16px;margin-bottom:12px;display:flex}.period-nav-btn{background:var(--white);width:36px;height:36px;color:var(--primary);cursor:pointer;border:none;border-radius:50%;transition:transform .22s;box-shadow:0 2px 8px #00000014}.period-nav-btn:hover{transform:scale(1.1)}.period-label{color:var(--primary);text-align:center;min-width:140px;font-size:15px;font-weight:800}.lb-updated{text-align:center;color:var(--text-muted);margin-bottom:16px;font-size:12px;font-weight:600}.podium-container{justify-content:center;align-items:flex-end;gap:16px;max-width:640px;margin:40px auto 32px;padding:0 12px;display:flex}.podium-step{flex-direction:column;flex:1}.podium-step,.podium-user{align-items:center;display:flex;position:relative}.podium-user{text-align:center;flex-direction:column;width:100%;margin-bottom:12px}.podium-avatar{color:#0d2b6e;z-index:2;background:#fff;border:3px solid #cbd5e1;border-radius:50%;justify-content:center;align-items:center;width:72px;height:72px;font-size:20px;font-weight:800;transition:all .3s;display:flex;position:relative;overflow:hidden;box-shadow:0 8px 20px #00000014}.podium-avatar img{object-fit:cover;width:100%;height:100%}.gold .podium-avatar{border-color:#fbbf24;width:88px;height:88px;font-size:24px;box-shadow:0 10px 25px #fbbf2440}.silver .podium-avatar{border-color:#94a3b8;box-shadow:0 8px 20px #94a3b840}.bronze .podium-avatar{border-color:#ea580c;box-shadow:0 8px 20px #ea580c33}.podium-crown{z-index:3;filter:drop-shadow(0 2px 4px #00000026);font-size:24px;animation:crownFloat 2s ease-in-out infinite;position:absolute;top:-24px}.gold .podium-crown{color:#fbbf24;font-size:28px;top:-28px}.silver .podium-crown{color:#94a3b8}.bronze .podium-crown{color:#ea580c}@keyframes crownFloat{0%,to{transform:translateY(0)rotate(0)}50%{transform:translateY(-4px)rotate(2deg)}}.podium-name{color:#0f172a;white-space:normal;overflow-wrap:anywhere;word-break:break-word;text-align:center;max-width:120px;margin-top:8px;font-size:14px;font-weight:800;line-height:1.2}.gold .podium-name{max-width:140px;font-size:16px}.podium-meta{align-items:center;gap:6px;margin-top:4px;display:flex}.podium-score{color:#0d2b6e;font-size:13px;font-weight:800}.gold .podium-score{font-size:15px}.podium-pedestal{border-radius:12px 12px 0 0;justify-content:center;align-items:center;width:100%;display:flex;position:relative;box-shadow:inset 0 2px 4px #fff3,0 8px 16px #0000000f}.pedestal-num{color:#ffffffe6;text-shadow:0 2px 4px #00000026;font-size:32px;font-weight:900}.gold .pedestal-num{font-size:42px}.lb-list{box-shadow:var(--shadow-md);background:#fff;border:1px solid #e2e8f0;border-radius:20px;flex-direction:column;gap:10px;margin-top:12px;padding:16px;display:flex}.lb-row{background:#f8fafc;border:1px solid #0000;border-radius:12px;align-items:center;gap:16px;padding:12px 20px;transition:all .25s;display:flex}.lb-row:hover{box-shadow:var(--shadow-sm);background:#f1f5f9;border-color:#cbd5e1;transform:translateY(-2px)}.lb-rank-num{color:#475569;background:#e2e8f0;width:36px;height:36px;font-size:15px}.lb-avatar,.lb-rank-num{border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;font-weight:800;display:flex}.lb-avatar{background:var(--primary-light);width:44px;height:44px;color:var(--primary);font-size:14px;overflow:hidden}.lb-avatar img{object-fit:cover;width:100%;height:100%}.lb-name{white-space:nowrap;text-overflow:ellipsis;flex:1;min-width:0;font-size:14px;font-weight:700;overflow:hidden}.lb-badge{text-align:center;background:linear-gradient(135deg,#ffd54f,#ffb300);border-radius:8px;min-width:36px;padding:4px 8px;font-size:12px;font-weight:800}.lb-score{color:#0f172a;text-align:right;justify-content:flex-end;align-items:center;gap:4px;min-width:70px;font-size:15px;font-weight:800;display:flex}.text-gold{color:#fbbf24}.lb-loading{text-align:center;color:var(--text-muted);padding:40px;font-weight:600}.data-loading-state i,.lb-loading.is-loading i{color:var(--primary);vertical-align:-.1em;margin-right:8px;font-size:1.15em}.data-loading-state{text-align:center;color:var(--text-muted);padding:48px 24px;font-size:15px;font-weight:600}.detail-data-loading{z-index:6;background:#f8fafce0;border-radius:20px;justify-content:center;align-items:center;min-height:200px;display:flex;position:absolute;inset:0}.lb-sticky.is-loading{color:var(--text-muted);justify-content:center;font-size:14px;font-weight:600}.lb-sticky-loading-text,.lb-sticky.is-loading .lb-avatar,.lb-sticky.is-loading .lb-name,.lb-sticky.is-loading .lb-score,.lb-sticky.is-loading .lb-sticky-medals,.lb-sticky.is-loading .lb-sticky-rank{display:none}.lb-sticky.is-loading .lb-sticky-loading-text{display:inline}.lb-sticky-wrap{background:linear-gradient(to top,var(--bg-page) 70%,transparent);padding:16px 24px 20px;position:sticky;bottom:0;left:0;right:0}.lb-sticky{color:#fff;background:linear-gradient(135deg,#0d2b6e,#1e40af);border-color:#1e40af;border-radius:14px;align-items:center;gap:12px;max-width:960px;margin:0 auto;padding:16px 24px;display:flex;box-shadow:0 10px 25px #0d2b6e4d}.lb-sticky-rank{color:#fcd34d;min-width:72px;font-size:13px;font-weight:800}.lb-sticky .lb-avatar{color:#fff;background:#ffffff26;border:2px solid #ffffff4d}.lb-sticky .lb-name{font-weight:800}.lb-sticky-medals{gap:4px;display:flex}.lb-sticky-medals img{width:28px;height:28px}.lb-sticky .lb-score{color:#fcd34d;font-size:18px;font-weight:800}.login-overlay{z-index:1000;background:#00000073;justify-content:center;align-items:center;padding:20px;display:flex;position:fixed;inset:0}.login-modal{background:var(--white);border-radius:20px;width:100%;max-width:400px;overflow:hidden;box-shadow:0 20px 60px #0000004d}.login-modal-header{background:var(--primary);text-align:center;padding:20px;position:relative}.login-modal-header img{object-fit:contain;max-width:140px;max-height:48px}.login-modal-close{color:#fffc;cursor:pointer;background:0 0;border:none;font-size:20px;position:absolute;top:12px;right:14px}.login-modal-body{padding:24px}.login-modal-body h2{text-align:center;margin-bottom:20px;font-size:20px;font-weight:800}.login-field{margin-bottom:14px}.login-field label{margin-bottom:5px;font-size:13px;font-weight:700;display:block}.login-field input{border:2px solid var(--border);border-radius:10px;outline:none;width:100%;padding:11px 14px;font-family:inherit;font-size:14px;font-weight:600}.login-field input:focus{border-color:var(--primary)}.login-error{color:#e53935;background:#ffebee;border-radius:8px;margin-bottom:12px;padding:9px 12px;font-size:13px;font-weight:600;display:none}.login-error.show{display:block}.login-success{color:#2e7d32;background:#e8f5e9;border-radius:8px;margin-bottom:12px;padding:9px 12px;font-size:13px;font-weight:600;display:none}.login-success.show{display:block}.login-hint{color:#64748b;margin:0 0 14px;font-size:13px;font-weight:500;line-height:1.45}.login-submit{background:var(--primary);width:100%;color:var(--white);cursor:pointer;border:none;border-radius:10px;padding:12px;font-family:inherit;font-size:15px;font-weight:800}.login-submit:hover{background:var(--primary-dark)}.login-submit:disabled{opacity:.7;cursor:not-allowed}.btn-login,.detail-back,.footer-contact-card a,.footer-social-link,.level-pill,.login-submit,button:not(:disabled){transition:transform .22s,background .2s,box-shadow .2s,color .2s}.btn-login:hover,.detail-back:hover,.footer-social-link:hover,.level-pill:hover,.login-submit:hover:not(:disabled),button:not(:disabled):hover{transform:scale(1.06)}.site-footer{width:100%;color:var(--white);background:linear-gradient(90deg,#0a1435,#122b6b 50%,#0a1435);border-top:1px solid #ffffff1a;flex-shrink:0;position:relative;overflow:hidden}.site-footer:before{background:#fbbf241f;top:0;right:25%}.site-footer:after,.site-footer:before{content:"";filter:blur(50px);pointer-events:none;border-radius:50%;width:200px;height:200px;position:absolute}.site-footer:after{background:#facc151a;bottom:0;left:25%}.footer-inner{z-index:1;grid-template-columns:1.2fr 1fr 1fr;align-items:start;gap:22px;max-width:1200px;margin:0 auto;padding:22px 28px 16px;display:grid;position:relative}.footer-brand{flex-direction:column;align-items:flex-start;display:flex}.footer-brand img{object-fit:contain;max-width:140px;max-height:48px;margin-bottom:8px}.footer-brand h2{margin-bottom:4px;font-size:15px;font-weight:800}.footer-brand p{color:#ffffffd9;margin-bottom:10px;font-size:11px;line-height:1.4}.footer-social{flex-wrap:wrap;gap:8px;display:flex}.footer-social-link{background:#ffffff1a;border:1px solid #fff3;border-radius:10px;justify-content:center;align-items:center;width:30px;height:30px;text-decoration:none;display:flex}.footer-social-link img{width:17px;height:17px}.footer-contact h3{align-items:center;gap:8px;margin-bottom:10px;font-size:13px;font-weight:800;display:flex}.footer-contact{flex-direction:column;gap:8px;display:flex}.footer-contact-extra-title{visibility:hidden}.footer-contact-grid{grid-template-columns:1fr 1fr;gap:8px;display:grid}.footer-contact-card{background:#ffffff14;border:1px solid #ffffff1f;border-radius:10px;padding:10px 12px;transition:transform .22s,background .2s}.footer-contact-card:hover{background:#ffffff1f;transform:scale(1.03)}.footer-contact-card .card-label{align-items:center;gap:6px;margin-bottom:4px;font-size:12px;font-weight:800;display:flex}.footer-contact-card .card-label i{opacity:.9;font-size:14px}.footer-contact-card a,.footer-contact-card p{color:#ffffffd9;font-size:11px;line-height:1.5;text-decoration:none}.footer-contact-card a:hover{color:var(--white)}.footer-divider{background:linear-gradient(90deg,#0000,#fff3,#0000);height:1px;margin:0 28px}.footer-copy{z-index:1;text-align:center;color:#fffc;padding:10px 28px 12px;font-size:11px;position:relative}.footer-copy strong{color:var(--white)}.mobile-menu-btn{color:#e4c28e;cursor:pointer;width:36px;height:36px;box-shadow:none;background:#ffffff1a;border:1px solid #ffffff2e;border-radius:10px;flex-shrink:0;justify-content:center;align-items:center;font-size:16px;transition:transform .22s,background .2s;display:none}.mobile-menu-btn:hover{background:#ffffff2e;transform:scale(1.06)}.sidebar-backdrop{display:none}@media (max-width:900px){.mobile-menu-btn{display:flex}.sidebar{z-index:1000;transition:transform .28s;position:fixed;top:0;bottom:0;left:0;transform:translate(-100%);box-shadow:4px 0 24px #00000026}.app.sidebar-open .sidebar{transform:translate(0)}.sidebar-backdrop{z-index:999;opacity:0;pointer-events:none;background:#00000073;transition:opacity .28s;display:block;position:fixed;inset:0}.app.sidebar-open .sidebar-backdrop:not(.hidden){opacity:1;pointer-events:auto}.app.sidebar-open{overflow:hidden}.header{flex-wrap:wrap;gap:8px;height:auto;min-height:76px;max-height:none;padding:8px 16px}.header-actions,.header-left{min-width:0}.content{padding:0 16px 20px;overflow-x:clip}.content-inner{max-width:100%}.view-detail{padding:16px 0 28px}.lb-page{padding:16px}.footer-inner{grid-template-columns:1fr;gap:24px}.footer-brand{text-align:center;align-items:center}.footer-contact h3{justify-content:center}.footer-contact-extra-title{display:none}.footer-contact-grid{grid-template-columns:1fr}}@media (max-width:600px){.courses-area{border-radius:14px;padding:14px}.tab-secondary{padding:9px 16px;font-size:13px}.header-left{flex:1;min-width:0}.header-title{text-overflow:ellipsis;white-space:nowrap;font-size:15px;overflow:hidden}.tabs-secondary{-webkit-overflow-scrolling:touch;gap:16px;overflow-x:auto}.level-pills{flex-wrap:wrap;justify-content:center}.login-modal{width:calc(100% - 32px);max-width:400px}.lb-title{font-size:20px}.period-toggle{flex-wrap:wrap;justify-content:center;gap:8px;width:100%}.lb-list,.lb-row,.lb-sticky,.lb-sticky-wrap,.lb-title-row,.lb-top{min-width:0;max-width:100%}.lb-row{flex-wrap:wrap;gap:8px 10px;padding:12px}.lb-name{text-overflow:ellipsis;white-space:nowrap;flex:140px;min-width:0;overflow:hidden}.lb-score{margin-left:auto}.lb-sticky{flex-wrap:wrap;gap:8px;padding:10px 12px}.course-grid{gap:12px}}@media (max-width:640px){.action-item span{display:none}.action-item{justify-content:center;min-width:44px;min-height:44px;padding:8px 12px}.header-actions{gap:2px}}@media (max-width:480px){.badge-rank{gap:6px;padding:4px 7px}.badge-rank img{width:24px;height:24px}.badge-rank-content{width:84px}.badge-rank-level{font-size:10px}.badge-rank-exp-text{font-size:8px}.btn-login{padding:8px 14px;font-size:14px}.lb-row{gap:8px;padding:10px 12px}.lb-name{font-size:13px}.site-footer{padding-bottom:max(12px,env(safe-area-inset-bottom))}}.speaking-practice{flex-direction:column;gap:14px;display:flex}.speaking-shell{background:#fff;border:1px solid #e2e6ef;border-radius:16px;flex-direction:column;gap:12px;padding:16px;display:flex;box-shadow:0 8px 24px #0f1c3f0f}.speaking-header{border-bottom:1px solid #eef1f7;flex-wrap:wrap;justify-content:space-between;padding-bottom:12px}.speaking-header,.speaking-header-main{align-items:center;gap:12px;display:flex}.speaking-header-main{min-width:0}.speaking-header-icon{color:#3d4f8f;background:linear-gradient(145deg,#eef2ff,#e4e9f8);border-radius:14px;flex-shrink:0;place-items:center;width:48px;height:48px;font-size:1.15rem;display:grid}.speaking-header-text h1{color:#0f1c3f;margin:0;font-size:1.2rem;line-height:1.2}.speaking-header-text p{color:#667089;margin:4px 0 0;font-size:.92rem}.speaking-header-badges{align-items:center;gap:8px;display:flex}.speaking-quota,.speaking-timer{letter-spacing:.02em;font-variant-numeric:tabular-nums;border-radius:999px;align-items:center;gap:8px;padding:8px 12px;font-weight:700;display:inline-flex}.speaking-timer{color:#fff;background:#0f1c3f;font-size:1.1rem}.speaking-quota{color:#314062;background:#f3f5fa;font-size:.92rem}.speaking-quota.is-available{color:#1f6b3a;background:#e8f6ee}.speaking-quota.is-used{color:#9a4d12;background:#fff3e8}.speaking-banner{border-radius:12px;align-items:flex-start;gap:10px;padding:12px 14px;font-size:.95rem;line-height:1.45;display:flex}.speaking-banner p{margin:4px 0 0}.speaking-banner--error{color:#8b1e1e;background:#fff1f1;border:1px solid #f0c3c3}.speaking-banner--info{color:#2f4478;background:#f3f6ff;border:1px solid #d7e0f5}.speaking-banner--warn{color:#7a4a12;background:#fff8ee;border:1px solid #f0d7b2}.speaking-banner--success{color:#1f6b3a;background:#eefaf2;border:1px solid #c5e8d1}.speaking-blocked,.speaking-done,.speaking-layout,.speaking-live,.speaking-prepare{flex-direction:column;gap:12px;display:flex}.speaking-panel{background:#f7f8fc;border:1px solid #e6eaf3;border-radius:14px;padding:14px}.speaking-panel-title{color:#0f1c3f;margin:0 0 6px;font-size:1rem}.speaking-panel-note{color:#667089;margin:0 0 12px;font-size:.9rem}.speaking-field{flex-direction:column;gap:6px;margin:8px 0;display:flex}.speaking-field span{color:#314062;font-size:.88rem;font-weight:600}.speaking-field input,.speaking-field select,.speaking-field textarea{font:inherit;background:#fff;border:1px solid #d5d9e4;border-radius:10px;padding:10px 12px}.speaking-mic-row{border-top:1px dashed #d9dee9;justify-content:space-between;align-items:center;gap:10px;margin-top:8px;padding-top:10px;display:flex}.speaking-mic-label{color:#314062;font-size:.88rem;font-weight:600}.speaking-mic-status{border-radius:999px;padding:4px 10px;font-size:.86rem;font-weight:700}.speaking-mic-status.is-ok{color:#1f6b3a;background:#e8f6ee}.speaking-mic-status.is-bad{color:#8b1e1e;background:#fff1f1}.speaking-mic-status.is-pending{color:#667089;background:#eef1f7}.speaking-actions{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.speaking-actions--live{flex-direction:column;align-items:stretch}.speaking-ptt-btn{color:#0f1c3f;min-height:112px;font:inherit;cursor:pointer;-webkit-user-select:none;user-select:none;touch-action:none;background:linear-gradient(#eff6ff,#dbeafe);border:2px solid #1f6feb;border-radius:18px;flex-direction:column;justify-content:center;align-items:center;gap:8px;padding:18px 16px;font-size:1.05rem;font-weight:800;transition:transform .12s,background .12s,border-color .12s,box-shadow .12s;display:flex}.speaking-ptt-btn i{color:#1f6feb;font-size:1.7rem}.speaking-ptt-btn.is-held{background:linear-gradient(#fff7ed,#ffedd5);border-color:#c2410c;transform:scale(.99);box-shadow:0 0 0 4px #ea580c2e}.speaking-ptt-btn.is-held i{color:#c2410c}.speaking-ptt-btn.is-waiting{background:linear-gradient(#f8fafc,#e2e8f0);border-color:#94a3b8}.speaking-ptt-btn.is-waiting i{color:#64748b}.speaking-btn{justify-content:center;align-items:center;gap:8px;min-height:42px;padding:10px 16px;text-decoration:none;display:inline-flex}.speaking-btn i{font-size:.95em}.speaking-live-status{color:#314062;align-items:center;gap:8px;font-size:.95rem;font-weight:600;display:inline-flex}.speaking-live-dot{background:#9aa3b8;border-radius:50%;flex-shrink:0;width:10px;height:10px}.speaking-live-dot.is-connecting{background:#c9a227;box-shadow:0 0 0 4px #c9a2272e}.speaking-live-dot.is-live{background:#1f9a4a;animation:speaking-pulse 1.4s ease-in-out infinite;box-shadow:0 0 0 4px #1f9a4a2e}.speaking-live-dot.is-saving{background:#3d6fd8;box-shadow:0 0 0 4px #3d6fd82e}@keyframes speaking-pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.7;transform:scale(.85)}}.speaking-chat-frame{background:linear-gradient(#fbfcff,#f4f6fb);border:1px solid #dfe4ef;border-radius:14px;flex-direction:column;min-height:320px;max-height:min(58vh,560px);display:flex;overflow:hidden}.speaking-chat-toolbar{color:#314062;background:#fff;border-bottom:1px solid #e8ecf5;justify-content:space-between;align-items:center;gap:10px;padding:10px 14px;font-size:.9rem;font-weight:700;display:flex}.speaking-chat-toolbar i{color:#5c6ea0;margin-right:6px}.speaking-chat-count{color:#667089;font-size:.84rem;font-weight:600}.speaking-chat{flex-direction:column;flex:1;gap:10px;padding:14px;display:flex;overflow-y:auto}.speaking-chat-empty{text-align:center;color:#7a849c;margin:auto;padding:24px 16px;font-size:.95rem}.speaking-bubble{border-radius:14px;flex-direction:column;gap:4px;max-width:min(85%,520px);padding:10px 12px;display:flex}.speaking-bubble-role{letter-spacing:.03em;text-transform:uppercase;opacity:.8;font-size:.75rem;font-weight:700}.speaking-bubble-text{white-space:pre-wrap;word-break:break-word;margin:0;line-height:1.45}.speaking-bubble--ai{color:#1c2740;background:#fff;border:1px solid #e2e7f2;border-bottom-left-radius:6px;align-self:flex-start}.speaking-bubble--ai .speaking-bubble-role{color:#3d4f8f}.speaking-bubble--user{color:#fff;background:#0f1c3f;border-bottom-right-radius:6px;align-self:flex-end}.speaking-bubble--user .speaking-bubble-role{color:#c8d4f0}@media (max-width:640px){.speaking-shell{border-radius:12px;padding:12px;overflow-x:clip}.speaking-header,.speaking-header-main,.speaking-header-text{min-width:0;max-width:100%}.speaking-header{flex-direction:column;align-items:stretch;gap:10px}.speaking-header-badges{flex-wrap:wrap;justify-content:flex-start}.speaking-chat-frame{min-height:260px;max-height:48vh}.speaking-actions{flex-direction:column;align-items:stretch}.speaking-btn,.speaking-ptt-btn{width:100%}.speaking-field input,.speaking-field select,.speaking-field textarea{max-width:100%}}.speaking-hub{flex-direction:column;gap:14px;display:flex}.main.layout-index>.content:has(.speaking-hub-companion){flex-direction:column;display:flex}.main.layout-index>.content:has(.speaking-hub-companion)>.content-inner{flex-direction:column;flex:1;min-height:0;display:flex}.speaking-hub:has(>.speaking-hub-companion){flex:1;min-height:100%;padding-bottom:12px}.speaking-hub:has(>.speaking-hub-companion)>.detail-body{flex:0 auto}.speaking-hub-stack{flex-direction:column;gap:14px;display:flex}.speaking-hub-companion{justify-content:center;width:100%;margin-top:auto;padding-top:8px;display:flex}.speaking-hub-companion-card{cursor:default;align-items:center;width:min(100%,50% - min(280px,100%)/2 - clamp(16px,2vw,24px)/2 - 7px)}.speaking-hub-companion-card:after{display:none}.speaking-hub-companion-card:hover{border-color:#0d2b6e14;transform:none;box-shadow:0 4px 12px #0d2b6e08}.speaking-hub-companion-card:hover .activity-icon{transform:none}.speaking-hub-companion-avatar{--character-color:#5c4d8f;background:var(--character-color);padding:0;overflow:hidden}@supports (color:color-mix(in lab,red,red)){.speaking-hub-companion-avatar{background:color-mix(in srgb,var(--character-color) 16%,#fff)}}.speaking-hub-companion-avatar{border-color:var(--character-color)}@supports (color:color-mix(in lab,red,red)){.speaking-hub-companion-avatar{border-color:color-mix(in srgb,var(--character-color) 22%,transparent)}}.speaking-hub-companion-avatar img{object-fit:cover;width:100%;height:100%;display:block}.speaking-hub-companion-intro{-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;font-weight:600;display:-webkit-box;overflow:hidden}button.speaking-hub-companion-change.activity-progress{font:inherit;cursor:pointer;appearance:none;margin:0;font-size:13px;font-weight:700}.speaking-hub-companion-card:hover .speaking-hub-companion-change.activity-progress{background:var(--primary-light);color:var(--primary);box-shadow:none;border-color:#0d2b6e0a}.speaking-hub-companion-change.activity-progress:focus-visible,.speaking-hub-companion-change.activity-progress:hover{background:var(--primary);color:#fff;border-color:var(--primary);box-shadow:0 2px 6px #0d2b6e26}.speaking-hub-companion-change.activity-progress:focus-visible{outline-offset:2px;outline:3px solid #f2b84b}@media (max-width:900px){.speaking-hub-companion-card{width:min(100%,420px)}}@media (max-width:480px){.speaking-hub-companion-card{gap:10px;padding:12px 14px}.speaking-hub-companion-intro{-webkit-line-clamp:1;line-clamp:1}}.speaking-hub .activity-card{align-items:flex-start}.speaking-hub .speaking-hub-companion-card{align-items:center}.speaking-hub .activity-card .activity-progress{margin-top:4px}.speaking-hub .speaking-hub-companion-card .activity-progress{margin-top:0}.speaking-hub-card-copy{flex-direction:column;gap:4px;min-width:0;display:flex}.speaking-hub-card-sub{color:#64748b;font-size:13px;font-weight:600;line-height:1.45}.speaking-hub-card-sub--meta{color:#7b879c;font-size:12px;font-weight:700}.activity-card.activity-card--locked{opacity:.82;cursor:pointer}.activity-card.activity-card--locked:disabled{cursor:not-allowed;opacity:.62;pointer-events:none}.speaking-hub-shell{flex-direction:column;gap:18px;width:100%;display:flex}.speaking-hub-eyebrow{color:#5c4d8f;letter-spacing:.08em;margin:0 0 4px;font-size:12px;font-weight:900}.speaking-drill-panel h1{color:#0f1c3f;margin:0;font-size:clamp(24px,3vw,32px);line-height:1.2}.speaking-drill-panel>p{color:#667089;margin:7px 0 0;font-size:15px;line-height:1.55}.speaking-hub .activity-card:focus-visible,.speaking-hub-modal-action:focus-visible,.speaking-hub-modal-close:focus-visible,.speaking-hub-retry:focus-visible{outline-offset:3px;outline:3px solid #f2b84b}.speaking-hub-retry{min-height:40px;color:inherit;font:inherit;cursor:pointer;background:#fff;border:1px solid;border-radius:10px;margin-left:auto;padding:8px 15px;font-weight:800}.speaking-hub-modal-backdrop{z-index:1200;background:#0a143594;place-items:center;padding:20px;display:grid;position:fixed;inset:0}.speaking-hub-modal{color:#17213b;text-align:center;background:#fff;border-radius:20px;width:min(100%,520px);padding:30px;position:relative;box-shadow:0 20px 60px #0a143547}.speaking-hub-modal-close{color:#42506c;cursor:pointer;background:#fff;border:1px solid #dce3ef;border-radius:12px;place-items:center;width:46px;height:46px;font-size:18px;display:grid;position:absolute;top:12px;right:12px}.speaking-drill-icon,.speaking-hub-modal-icon{color:#9a4d12;background:#fff3e8;border-radius:18px;place-items:center;width:66px;height:66px;margin:0 auto 14px;font-size:26px;display:grid}.speaking-hub-modal-activity{color:#5c4d8f;text-transform:uppercase;letter-spacing:.05em;margin:0 0 5px;font-size:13px;font-weight:900}.speaking-hub-modal h2{color:#0f1c3f;margin:0;font-size:23px}.speaking-hub-modal>p:last-of-type{color:#5f6980;margin:12px 0 0;font-size:15px;line-height:1.6}.speaking-hub-modal-actions{flex-wrap:wrap;justify-content:center;gap:10px;margin-top:22px;display:flex}.speaking-hub-modal-action{justify-content:center;align-items:center;gap:8px;min-height:52px;padding:12px 18px;text-decoration:none;display:inline-flex}.speaking-drill-panel{text-align:center;background:#fff;border:1px solid #dce3ef;border-radius:18px;flex-direction:column;justify-content:center;align-items:center;min-height:360px;padding:36px 24px;display:flex;box-shadow:0 6px 20px #0d2b6e0f}.speaking-drill-panel>p{max-width:620px}.speaking-drill-panel .speaking-btn{min-height:52px;margin-top:22px}@media (max-width:560px){.speaking-hub-modal{padding:28px 18px 20px}.speaking-hub-modal-actions{flex-direction:column}.speaking-hub-modal-action{width:100%}}.speaking-drill-workspace{background:#fff;border:1px solid #dce3ef;border-radius:18px;flex-direction:column;gap:18px;padding:24px;display:flex;box-shadow:0 6px 20px #0d2b6e0f}.speaking-drill-header{border-bottom:1px solid #e7ebf2;justify-content:space-between;align-items:flex-start;gap:20px;padding-bottom:18px;display:flex}.speaking-drill-header h1{color:#0f1c3f;margin:5px 0 8px;font-size:clamp(25px,4vw,38px);line-height:1.25}.speaking-drill-header>div>p:last-child{color:#68738b;margin:0;font-size:14px;font-weight:800}.speaking-drill-listen{flex-shrink:0;justify-content:center;align-items:center;gap:9px;min-height:48px;display:inline-flex}.speaking-drill-support{color:#36435e;background:#f7faff;border:1px solid #dce5f4;border-radius:13px;padding:14px 16px}.speaking-drill-support summary{cursor:pointer;color:#244d83;font-weight:900}.speaking-drill-support p{margin:10px 0 0;line-height:1.55}.speaking-drill-recorder{flex-direction:column;align-items:stretch;gap:18px;display:flex}.speaking-drill-mic-state{color:#47536b;background:#f8fafc;border:1px solid #dfe5ef;border-radius:15px;justify-content:center;align-items:center;gap:12px;min-height:90px;padding:16px;font-weight:800;display:flex}.speaking-drill-mic-state.is-recording{color:#8f2020;background:#fff7f7;border-color:#e6a4a4}.speaking-drill-live-dot{background:#98a2b3;border-radius:50%;flex-shrink:0;width:12px;height:12px}.speaking-drill-live-dot.is-recording{background:#cf2e2e;animation:speaking-pulse 1.2s ease-in-out infinite;box-shadow:0 0 0 5px #cf2e2e24}.speaking-drill-countdown{color:#fff;background:#0d2b6e;border-radius:50%;place-items:center;width:48px;height:48px;font-size:26px;font-weight:900;display:grid}.speaking-drill-waveform{align-items:center;gap:3px;height:42px;margin-left:8px;display:flex}.speaking-drill-waveform span{opacity:.62;background:currentColor;border-radius:999px;width:4px;min-height:6px;transition:height 80ms linear}.speaking-drill-playback{flex-direction:column;gap:8px;width:min(100%,640px);margin:0 auto;display:flex}.speaking-drill-playback label{color:#35425d;font-weight:900}.speaking-drill-playback audio{width:100%}.speaking-drill-actions{flex-wrap:wrap}.speaking-drill-actions,.speaking-drill-mic-button{justify-content:center;align-items:center;gap:12px;display:flex}.speaking-drill-mic-button{color:#fff;width:168px;min-height:138px;font:inherit;cursor:pointer;background:linear-gradient(145deg,#153d91,#0a2359);border:0;border-radius:26px;flex-direction:column;padding:18px;font-weight:900;box-shadow:0 12px 28px #0d2b6e40}.speaking-drill-mic-button i{font-size:36px}.speaking-drill-mic-button.is-stop{background:linear-gradient(145deg,#d43c3c,#9a2020);box-shadow:0 12px 28px #9a20203d}.speaking-drill-mic-button:hover{transform:translateY(-2px)}.speaking-drill-actions button:focus-visible,.speaking-drill-listen:focus-visible,.speaking-drill-mic-button:focus-visible,.speaking-drill-support summary:focus-visible{outline-offset:3px;outline:3px solid #f2b84b}.speaking-drill-feedback{background:#f5fbf7;border:1px solid #cfe3d8;border-radius:16px;grid-template-columns:98px minmax(0,1fr);gap:18px;width:min(100%,760px);margin:0 auto;padding:20px;display:grid}.speaking-drill-score{color:#fff;background:#1c7547;border-radius:50%;align-content:center;place-items:center;width:88px;height:88px;font-size:31px;font-weight:900;display:grid}.speaking-drill-score span{font-size:12px}.speaking-drill-feedback-label{color:#17603b;letter-spacing:.05em;text-transform:uppercase;margin:0 0 10px;font-size:13px;font-weight:900}.speaking-drill-feedback-line{color:#26364a;align-items:flex-start;gap:9px;margin:7px 0;line-height:1.5;display:flex}.speaking-drill-feedback-line.is-praise i{color:#b7791f}.speaking-drill-feedback-line.is-improvement i{color:#2d6aa0}.speaking-drill-disclaimer{color:#69758a;margin:10px 0 0;font-size:12px;line-height:1.5}@media (max-width:640px){.speaking-drill-workspace{padding:17px}.speaking-drill-header{flex-direction:column}.speaking-drill-listen{width:100%}.speaking-drill-mic-state{flex-wrap:wrap}.speaking-drill-waveform{justify-content:center;width:100%;margin-left:0}.speaking-drill-feedback{grid-template-columns:1fr}.speaking-drill-score{margin:0 auto}}@media (prefers-reduced-motion:reduce){.speaking-drill-live-dot.is-recording{animation:none}.speaking-drill-mic-button:hover{transform:none}}.speaking-character-backdrop{z-index:1300;background:radial-gradient(circle at 50% 20%,#2f5bd038,#0000 55%),linear-gradient(#080e24f0,#0a1435fa);place-items:center;padding:clamp(16px,4vw,32px);display:grid;position:fixed;inset:0;overflow-y:auto}.speaking-character-picker{text-align:center;color:#f8fafc;width:min(100%,920px);padding:clamp(24px,4vw,40px) clamp(18px,4vw,36px) clamp(28px,5vw,44px);position:relative}.speaking-character-close{color:#e2e8f0;cursor:pointer;background:#ffffff14;border:1px solid #ffffff2e;border-radius:12px;place-items:center;width:46px;height:46px;font-size:18px;transition:background .2s,border-color .2s;display:grid;position:absolute;top:0;right:0}.speaking-character-close:hover{background:#ffffff24;border-color:#ffffff47}.speaking-character-eyebrow{color:#f2b84b;letter-spacing:.1em;margin:0 0 8px;font-size:12px;font-weight:900}.speaking-character-title{color:#fff;margin:0;font-size:clamp(28px,4vw,42px);font-weight:900;line-height:1.15}.speaking-character-subtitle{color:#e2e8f0d1;max-width:560px;margin:10px auto 0;font-size:clamp(15px,2vw,17px);line-height:1.55}.speaking-character-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(14px,2.5vw,24px);margin:clamp(24px,4vw,36px) 0 0;padding:0;list-style:none;display:grid}.speaking-character-card{width:100%;color:inherit;font:inherit;cursor:pointer;text-align:center;appearance:none;background:0 0;border:none;padding:0}.speaking-character-avatar{--character-color:#2f5bd0;aspect-ratio:1;border-radius:18px;width:min(100%,168px);margin:0 auto;transition:transform .22s,box-shadow .22s;display:block;position:relative;overflow:hidden;box-shadow:0 0 0 3px #0000,0 14px 34px #00000059}.speaking-character-avatar img{object-fit:cover;width:100%;height:100%;display:block}.speaking-character-card:focus-visible .speaking-character-avatar,.speaking-character-card:hover .speaking-character-avatar{box-shadow:0 0 0 3px var(--character-color),0 18px 40px #0000006b;transform:translateY(-6px)scale(1.04)}.speaking-character-card.is-selected .speaking-character-avatar{box-shadow:0 0 0 4px var(--character-color),0 18px 40px #0000006b}.speaking-character-check{background:var(--character-color);color:#fff;border-radius:50%;place-items:center;width:34px;height:34px;font-size:14px;display:grid;position:absolute;bottom:10px;right:10px;box-shadow:0 4px 12px #00000047}.speaking-character-name{color:#f8fafcad;margin-top:14px;font-size:clamp(16px,2vw,18px);font-weight:800;transition:color .2s;display:block}.speaking-character-intro{color:#e2e8f0b8;min-height:2.9em;margin-top:6px;font-size:13px;line-height:1.45;display:block}.speaking-character-card.is-selected .speaking-character-name,.speaking-character-card:focus-visible .speaking-character-name,.speaking-character-card:hover .speaking-character-name{color:#fff}.speaking-character-card:focus-visible{outline:none}.speaking-character-card:focus-visible .speaking-character-name{text-underline-offset:3px;text-decoration:underline}.speaking-character-banner,.speaking-character-row{background:linear-gradient(135deg,#f8fbff,#fff);border:1px solid #dce3ef;border-radius:16px;align-items:center;gap:14px;padding:14px 16px;display:flex}.speaking-character-banner{margin-top:4px}.speaking-character-row{margin-bottom:16px}.speaking-character-banner-avatar,.speaking-character-row-avatar{--character-color:#2f5bd0;width:56px;height:56px;box-shadow:0 0 0 2px var(--character-color);border-radius:14px;flex-shrink:0;overflow:hidden}.speaking-character-row-avatar{border-radius:12px;width:48px;height:48px}.speaking-character-banner-avatar img,.speaking-character-row-avatar img{object-fit:cover;width:100%;height:100%;display:block}.speaking-character-banner-text,.speaking-character-row-text{text-align:left;flex:1;min-width:0}.speaking-character-banner-label,.speaking-character-row-label{color:#5c4d8f;letter-spacing:.06em;text-transform:uppercase;font-size:11px;font-weight:900;display:block}.speaking-character-banner-text strong,.speaking-character-row-text strong{color:#0f1c3f;margin-top:2px;font-size:16px;display:block}.speaking-character-banner-text p{color:#667089;margin:4px 0 0;font-size:13px;line-height:1.45}.speaking-character-change{color:#334155;min-height:42px;font:inherit;cursor:pointer;background:#fff;border:1px solid #dce3ef;border-radius:12px;flex-shrink:0;align-items:center;gap:8px;padding:8px 14px;font-size:13px;font-weight:800;transition:background .2s,border-color .2s,color .2s;display:inline-flex}.speaking-character-change:hover{color:#0f1c3f;background:#eef2ff;border-color:#94a3b8}.speaking-character-card:focus-visible .speaking-character-avatar,.speaking-character-change:focus-visible,.speaking-character-close:focus-visible{outline-offset:3px;outline:3px solid #f2b84b}@media (max-width:900px){.speaking-character-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (max-width:640px){.speaking-character-banner,.speaking-character-row{flex-wrap:wrap}.speaking-character-change{justify-content:center;width:100%}.speaking-character-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.speaking-character-intro{min-height:0;font-size:12px}}@media (prefers-reduced-motion:reduce){.speaking-character-avatar,.speaking-character-name{transition:none}.speaking-character-card:focus-visible .speaking-character-avatar,.speaking-character-card:hover .speaking-character-avatar{transform:none}}.scramble-display{text-align:center;color:var(--text-muted);letter-spacing:.12em;margin-bottom:4px;font-size:18px;font-weight:800}.scramble-slot-row{flex-wrap:wrap;justify-content:center;gap:8px;min-height:56px;margin-bottom:8px;display:flex}.scramble-keyboard-hint{text-align:center;color:var(--text-muted);letter-spacing:.02em;margin:0 0 14px;font-size:12px;font-weight:700}.scramble-slot{width:44px;height:52px;color:var(--text-dark);cursor:pointer;background:#f4f7fc;border:2px dashed #9eb0d4;border-radius:12px;justify-content:center;align-items:center;font-size:22px;font-weight:900;transition:border-color .15s,background .15s;display:inline-flex}.scramble-slot.is-filled{border-style:solid;border-color:var(--primary);cursor:pointer;background:#fff}.scramble-slot.is-correct{color:#1b5e20;cursor:default;background:#e8f5e9;border-color:#2e7d32}.scramble-slot.is-wrong{color:#b71c1c;background:#ffebee;border-color:#c62828}.scramble-pool{flex-wrap:wrap;justify-content:center;gap:8px;margin-bottom:8px;display:flex}.scramble-chip{border:2px solid var(--primary);background:var(--primary-light);min-width:44px;height:52px;color:var(--primary);cursor:pointer;border-radius:12px;padding:0 6px;font-size:22px;font-weight:900;transition:transform .12s,box-shadow .12s,opacity .12s;box-shadow:0 2px 8px #0d2b6e1f}.scramble-chip:hover:not(:disabled){transform:translateY(-2px)scale(1.04)}.scramble-chip.is-used,.scramble-chip:disabled{opacity:.25;cursor:default;box-shadow:none;transform:none}.scramble-image-wrap{text-align:center;margin-bottom:12px}.scramble-image-wrap img{object-fit:contain;border-radius:12px;max-width:160px;max-height:140px}@media (max-width:600px){.scramble-display{letter-spacing:.08em;font-size:15px}.scramble-pool,.scramble-slot-row{gap:6px}.scramble-slot{width:38px}.scramble-chip,.scramble-slot{border-radius:10px;height:46px;font-size:18px}.scramble-chip{min-width:38px}.scramble-image-wrap img{max-width:min(140px,42vw);max-height:120px}}@media (max-width:480px){.scramble-slot{width:34px;height:42px;font-size:16px}.scramble-chip{min-width:34px;height:42px;font-size:16px}.scramble-keyboard-hint{font-size:11px}}body,html{overflow-x:clip}body,canvas,html,img,svg:not(.sidebar-logo svg),video{max-width:100%}.app,.content,.content-inner,.courses-area,.game-card,.game-page,.lb-page,.main,.page-shell,.speaking-layout,.speaking-live,.speaking-prepare,.speaking-shell,.view-detail{min-width:0;max-width:100%}.activity-card,.book-card,.fill-input,.game-subtitle,.option-btn,.q-list-item,.question-text,.quiz-passage,.quiz-stem,.speaking-bubble-text{overflow-wrap:anywhere;word-break:break-word}table{max-width:100%}.admin-table-wrap,.sheet-wrap,.table-scroll{-webkit-overflow-scrolling:touch;max-width:100%;overflow-x:auto}.cc-worksheet,.law-worksheet,.login-modal,.login-overlay,.pronunciation-page,.rc-worksheet,.rm-worksheet,.vc-worksheet,.wm-board{min-width:0;max-width:100%}@media (max-width:900px){.tabs-primary{-webkit-overflow-scrolling:touch;scrollbar-width:none;flex-wrap:nowrap;gap:20px;overflow-x:auto}.tabs-primary::-webkit-scrollbar{display:none}.tab-primary{flex-shrink:0}.game-meta,.game-top{min-width:0;max-width:100%}.progress-bar-wrap{flex:100%;min-width:0}.speaking-ptt-btn{width:100%}}@media (max-width:600px){.game-actions{flex-direction:column;align-items:stretch}.game-actions .admin-btn,.game-actions .btn,.game-actions a.btn{width:100%}.header-actions .action-item span{display:none}.header-actions .action-item{justify-content:center;min-width:44px;min-height:44px;padding:8px 12px}.page-back{text-overflow:ellipsis;white-space:nowrap;max-width:100%;padding:8px 14px;font-size:13px;overflow:hidden}.page-back-bar{margin-bottom:12px}.login-overlay{-webkit-overflow-scrolling:touch;padding:max(12px,env(safe-area-inset-top,0px)) 12px max(12px,env(safe-area-inset-bottom,0px));align-items:flex-start;overflow-y:auto}.login-modal{width:100%;max-width:400px;margin:12px auto}.login-modal-body{padding:18px 16px 20px}.login-field input{font-size:16px}.login-error{overflow-wrap:anywhere;word-break:break-word}.login-modal-header .action-item{color:#fff;background:#ffffff24;border-color:#ffffff40}}@media (max-width:480px){.login-modal-header{padding:16px 48px}.login-modal-header img{max-width:120px}}.login-page{min-height:100dvh}.login-page .login-overlay{z-index:1000;padding:max(16px,env(safe-area-inset-top,0px)) 16px max(16px,env(safe-area-inset-bottom,0px));background-color:#0a1435;background-image:linear-gradient(#08123080,#08123080),url(/images/login/wewin-graduation-bg.jpg);background-position:50% 38%;background-repeat:no-repeat;background-size:cover;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.login-page .login-modal{border-radius:18px;width:100%;max-width:min(430px,100% - 32px);box-shadow:0 24px 64px #00000059}.login-page .login-modal-header{padding:18px 48px 16px}.login-page .login-modal-header img{max-width:128px;max-height:44px}.login-page .login-modal-lang{position:absolute;top:12px;right:12px}.login-page .login-modal-header .action-item{color:#fff;background:#ffffff24;border-color:#ffffff40}.login-page .login-modal-body{padding:22px 26px 24px}.login-page .login-modal-body h2{margin-bottom:10px;font-size:19px}.login-page .login-field{margin-bottom:12px}.login-page .login-field input{padding:11px 14px}.login-page .login-submit{padding:12px}@media (max-width:600px){.login-page .login-overlay{-webkit-overflow-scrolling:touch;padding:max(12px,env(safe-area-inset-top,0px)) 12px max(12px,env(safe-area-inset-bottom,0px));align-items:flex-start;overflow-y:auto}.login-page .login-modal{max-width:min(430px,100% - 24px);margin:12px auto}.login-page .login-modal-body{padding:20px 18px 22px}.login-page .login-field input{font-size:16px}}@media (max-width:480px){.login-page .login-modal-header{padding:14px 44px 12px}.login-page .login-modal-header img{max-width:116px}}.guest-form-gate-overlay{z-index:1200}.guest-form-gate-modal{max-width:min(720px,100%)}.guest-form-gate-header{position:relative}.guest-form-gate-header h2{color:#fff;margin:0;padding-right:28px;font-size:18px;font-weight:800;line-height:1.35}.guest-form-gate-close{color:#ffffffeb;cursor:pointer;background:#ffffff29;border:none;border-radius:999px;width:24px;height:24px;font-size:16px;line-height:1;position:absolute;top:10px;right:10px}.guest-form-gate-close:hover{background:#ffffff3d}.guest-form-gate-body{flex-direction:column;gap:14px;max-height:min(78vh,760px);display:flex;overflow:auto}.guest-form-gate-hint{color:var(--text-muted,#64748b);margin:0;font-size:14px;line-height:1.5}.guest-form-gate-form{flex-direction:column;gap:14px;display:flex}.guest-form-gate-field{border:none;flex-direction:column;gap:8px;margin:0;padding:0;display:flex}.guest-form-gate-field>legend,.guest-form-gate-field>span{font-size:13px;font-weight:700}.guest-form-gate-field input[type=tel],.guest-form-gate-field input[type=text]{border:2px solid var(--border,#e2e8f0);width:100%;font:inherit;border-radius:10px;padding:11px 14px;font-size:14px}.guest-form-gate-options{gap:8px;display:grid}.guest-form-gate-option{align-items:flex-start;gap:8px;font-size:14px;line-height:1.4;display:flex}.guest-form-gate-option input{margin-top:3px}.guest-form-gate-error{color:#dc2626;font-size:12px;font-weight:600}.guest-form-gate-submit-error{margin:0}.guest-form-gate-submit{width:100%}@media (max-width:600px){.guest-form-gate-modal{border-radius:16px;max-width:100%;margin:0}}.main.layout-course,.main.layout-index{align-items:stretch}.main.layout-course>.content,.main.layout-course>.header,.main.layout-index>.content,.main.layout-index>.header{align-self:stretch;width:100%}.main.layout-course>.content{padding-left:0}.main.layout-course>.content>.content-inner{width:100%;max-width:none;margin:0}body:has(.game-page),body:has(.pronunciation-page){--sidebar-width:200px}.main.layout-game>.content{width:100%;padding:0}.main.layout-game>.content>.content-inner{width:100%;max-width:none;margin:0}.main.layout-game>.header{align-self:stretch;width:100%}button.q-list-item{width:100%;font:inherit;color:inherit;text-align:left;appearance:none}a.activity-card{color:inherit;text-decoration:none}button.activity-card{width:100%;font:inherit;color:inherit;text-align:left;appearance:none}.page-back-bar{z-index:25;pointer-events:none;align-items:center;margin:0 0 16px;padding:clamp(12px,2vw,16px) 0 0;display:flex;position:sticky;top:0}.page-back,.page-back:visited{color:var(--text-dark);cursor:pointer;pointer-events:auto;background:#fff;border:1px solid #e2e8f0;border-radius:20px;flex-shrink:0;align-items:center;gap:8px;padding:8px 18px;font-family:inherit;font-size:14px;font-weight:700;text-decoration:none;transition:background .25s,color .25s,border-color .25s,box-shadow .25s,transform .25s;display:inline-flex;box-shadow:0 2px 8px #00000008}.page-back:hover,a.page-back:hover,button.page-back:not(:disabled):hover{background:var(--primary);color:#fff;border-color:var(--primary);transform:translate(-4px);box-shadow:0 4px 12px #0d2b6e33}.game-page>.page-back-bar,.lb-page>.page-back-bar,.pronunciation-page>.page-back-bar,.view-detail>.page-back-bar{margin-top:calc(-1*clamp(12px,2vw,16px));padding-top:clamp(12px,2vw,16px)}.sidebar-user-avatar-img{object-fit:cover;border-radius:50%;width:100%;height:100%;display:block}.sidebar-user-avatar-btn{cursor:pointer;outline:none;padding:0;position:relative;overflow:visible}.sidebar-user-avatar-btn:focus-visible{box-shadow:0 0 0 3px #2563eb59}.sidebar-user-avatar-edit{background:var(--primary,#0d2b6e);color:#fff;border:2px solid #fff;border-radius:50%;width:24px;height:24px;font-size:11px;position:absolute;bottom:-2px;right:-2px;box-shadow:0 2px 6px #0d2b6e40}.avatar-modal-overlay,.sidebar-user-avatar-edit{justify-content:center;align-items:center;display:flex}.avatar-modal-overlay{z-index:1000;background:#0f172a99;padding:16px;position:fixed;inset:0}.avatar-modal{background:#fff;border-radius:16px;width:min(420px,100%);max-height:92vh;overflow:auto;box-shadow:0 24px 60px #0f172a4d}.avatar-modal-header{border-bottom:1px solid #eef2f7;justify-content:space-between;align-items:center;padding:16px 20px;display:flex}.avatar-modal-header h2{color:#0f172a;margin:0;font-size:18px;font-weight:800}.avatar-modal-close{cursor:pointer;color:#64748b;background:0 0;border:none;font-size:26px;line-height:1}.avatar-modal-body{padding:18px 20px 20px}.avatar-modal-hint{color:#64748b;margin:0 0 14px;font-size:13px}.avatar-preset-grid{grid-template-columns:repeat(5,1fr);gap:10px;margin-bottom:16px;display:grid}.avatar-preset{aspect-ratio:1;cursor:pointer;background:#f1f5f9;border:3px solid #0000;border-radius:50%;padding:0;transition:transform .15s,border-color .15s;overflow:hidden}.avatar-preset:hover{transform:scale(1.05)}.avatar-preset img{object-fit:cover;width:100%;height:100%;display:block}.avatar-preset.is-active{border-color:var(--primary,#2563eb);box-shadow:0 0 0 2px #2563eb33}.avatar-upload-btn{color:#334155;cursor:pointer;background:#f8fafc;border:1px dashed #cbd5e1;border-radius:12px;justify-content:center;align-items:center;gap:8px;width:100%;padding:11px;font-size:14px;font-weight:700;display:flex}.avatar-upload-btn:hover{background:#eef2ff;border-color:#94a3b8}.avatar-file-input{display:none}.avatar-modal-error{color:#dc2626;margin:12px 0 0;font-size:13px}.avatar-modal-actions{justify-content:space-between;align-items:center;gap:10px;margin-top:18px;display:flex}.avatar-modal-actions-right{gap:10px;margin-left:auto;display:flex}.avatar-btn{cursor:pointer;border:1px solid #0000;border-radius:10px;padding:10px 18px;font-size:14px;font-weight:700}.avatar-btn-primary{background:var(--primary,#2563eb);color:#fff}.avatar-btn-secondary{color:#334155;background:#f1f5f9}.avatar-btn-ghost{color:#dc2626;background:0 0;border:none}.avatar-btn:disabled{opacity:.6;cursor:not-allowed}.avatar-crop-stage{justify-content:center;display:flex}.avatar-crop-viewport{cursor:grab;touch-action:none;-webkit-user-select:none;user-select:none;background:#0f172a;border-radius:10px;width:min(280px,72vw);height:min(280px,72vw);position:relative;overflow:hidden}.avatar-crop-viewport:active{cursor:grabbing}.avatar-crop-image{will-change:transform;max-width:none;top:0;left:0}.avatar-crop-image,.avatar-crop-ring{pointer-events:none;position:absolute}.avatar-crop-ring{border:2px solid #ffffffd9;border-radius:50%;width:100%;height:100%;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 0 0 9999px #0f172a8c}.avatar-crop-zoom{align-items:center;gap:12px;margin-top:16px;display:flex}.avatar-crop-zoom input[type=range]{accent-color:var(--primary,#2563eb);flex:1}.avatar-zoom-icon-sm{color:#94a3b8;font-size:12px}.avatar-zoom-icon-lg{color:#94a3b8;font-size:18px}