.mini-classroom{--mc-purple:#4c347c;--mc-muted:#655a79}.mini-classroom button,.mini-classroom a,.mini-classroom label{-webkit-tap-highlight-color:transparent}.mini-classroom button:not(:disabled),.mini-classroom label{cursor:pointer}.mini-classroom button:disabled{cursor:default;opacity:.4}:is(.mini-classroom button:focus-visible,.mini-classroom a:focus-visible,.mini-classroom input:focus-visible){outline-offset:3px;outline:3px solid #7652be}.mini-classroom input{accent-color:#7652be;width:16px;height:16px}.mc-topics{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-bottom:20px;display:grid}.mc-topic{text-align:left;background:#fff;border:1px solid #e2d9ef;border-radius:16px;align-items:center;gap:12px;padding:16px 20px;transition:background .2s;display:flex}.mc-topic.is-active{color:#fff;background:#4c347c;border-color:#4c347c;box-shadow:0 8px 20px #4c347c18}.mc-topic-number{color:#4c347c;background:#e8e0f7;border-radius:50%;flex-shrink:0;place-items:center;width:32px;height:32px;font-size:13px;font-weight:800;display:grid}.mc-topic.is-active .mc-topic-number{background:#ffc94a}.mc-topic strong{font-size:16px;display:block}.mc-topic small{opacity:.8;margin-top:4px;font-size:12px;display:block}.mc-workspace{background:#fff;border:1px solid #e2d9ef;border-radius:24px;grid-template-columns:1fr 1fr;display:grid;overflow:hidden}.mc-scene-column{background:#f1ecfa;min-width:0;padding:20px}.mc-stage{isolation:isolate;background:#e8e0f7;border-radius:16px;height:500px;position:relative;overflow:hidden}.mc-backdrop{background-image:url(/assets/classroom/scenes.png);background-repeat:no-repeat;background-size:400% 200%;position:absolute;inset:0}.mc-backdrop-cafe{background-position:0 0}.mc-backdrop-ktv{background-position:100% 0}.mc-stage-shade{background:linear-gradient(#fff3,#0000 55%,#36204d70);position:absolute;inset:0}.mc-scene-caption{z-index:2;letter-spacing:.1em;background:#fffdf6ed;border-radius:20px;padding:5px 10px;font-size:10px;font-weight:800;position:absolute;top:14px;left:16px}.mc-bubble{z-index:3;background:#fffffff5;border-radius:18px 18px 18px 3px;padding:14px 18px;position:absolute;top:54px;left:16px;right:16px;box-shadow:0 8px 30px #36204d12}.mc-speaker{color:#7652be;margin-bottom:4px;font-size:11px;font-weight:800;display:block}.mc-bubble p[lang=vi]{font-size:20px;font-weight:800;line-height:1.5}.mc-bubble .mc-translation{color:#655a79;margin-top:4px;font-size:13px;line-height:1.6}.mc-person{transform-origin:bottom;filter:brightness(.9)saturate(.85);background:url(/assets/classroom/characters.png) 0 0/400% 100% no-repeat;width:190px;height:380px;position:absolute;bottom:-75px}.mc-bao{background-position:0 0;left:0}.mc-linh{background-position:33.3333% 0;right:0}.mc-person.is-speaking{filter:drop-shadow(0 0 10px #ffeba877)}.is-animated .mc-person.is-speaking{animation:2.8s ease-in-out infinite mc-breathe}.is-animated .mc-bubble{animation:.28s ease-out mc-arrive}.mc-character-labels{z-index:4;justify-content:space-between;display:flex;position:absolute;bottom:14px;left:20px;right:20px}.mc-character-labels span{color:#fff;background:#372650d9;border-radius:20px;padding:4px 10px;font-size:11px;font-weight:700}.mc-display-options{flex-wrap:wrap;align-items:center;gap:8px 14px;padding-top:12px;font-size:12px;font-weight:700;display:flex}.mc-display-options label,.mc-display-options button{align-items:center;gap:6px;min-height:36px;display:flex}.mc-display-options button{margin-left:auto}.mc-role-note{color:#655a79;margin-top:9px;font-size:12px;line-height:1.8}.mc-practice{flex-direction:column;min-width:0;padding:24px;display:flex}.mc-steps{border-bottom:1px solid #e8e0f7;justify-content:space-between;gap:12px;padding-bottom:20px;list-style:none;display:flex}.mc-steps li{color:#72677f;align-items:center;gap:6px;font-size:12px;font-weight:700;display:flex}.mc-steps li span{background:#f1ecfa;border-radius:50%;place-items:center;width:23px;height:23px;display:grid}.mc-steps li[aria-current]{color:#4c347c}.mc-steps li[aria-current] span{color:#fff;background:#4c347c}.mc-panel{padding:24px 0 20px}.mc-eyebrow{letter-spacing:.08em;color:#7652be;font-size:11px;font-weight:800}.mc-panel h2,.mc-bridge h2{margin-top:7px;font-size:23px;font-weight:900;line-height:1.5}.mc-description{color:#655a79;margin-top:8px;font-size:14px;line-height:1.8}.mc-words{gap:9px;margin-top:20px;display:grid}.mc-word{border:1px solid #e8e0f7;border-radius:12px;justify-content:space-between;align-items:center;gap:12px;padding:12px 16px;display:flex}.mc-word strong{font-size:19px;display:block}.mc-word small{color:#655a79;margin-top:2px;font-size:12px;display:block}.mc-word button{background:#f1ecfa;border-radius:50%;place-items:center;width:42px;height:42px;display:grid}.mc-tip{color:#655a79;margin-top:16px;font-size:12px;line-height:1.8}.mc-tip strong{color:#4c347c;display:block}.mc-next{gap:8px;width:100%;margin-top:20px}.mc-audio-note{color:#716582;border-top:1px solid #e8e0f7;flex-wrap:wrap;gap:8px 16px;margin-top:auto;padding-top:14px;font-size:11px;line-height:1.8;display:flex}.mc-audio-note label{align-items:center;gap:6px;display:flex}.mc-audio-note button{text-decoration:underline}.mc-line-progress{align-items:center;gap:7px;margin:24px 0;display:flex}.mc-line-progress>span{background:#e8e0f7;border-radius:3px;flex:1;height:5px}.mc-line-progress>span.is-read{background:#8b72d9}.mc-line-progress strong{margin-left:5px;font-size:12px}.mc-read-line{border-left:3px solid #8b72d9;padding:6px 0 8px 16px}.mc-read-line>span{color:#7652be;font-size:12px;font-weight:700}.mc-read-line p{margin-top:6px;font-size:24px;font-weight:800;line-height:1.6}.mc-read-line small{color:#655a79;margin-top:10px;font-size:14px;line-height:1.8;display:block}.mc-read-button{color:#7652be;align-items:center;gap:7px;min-height:40px;margin-top:12px;font-size:13px;font-weight:700;display:inline-flex}.mc-controls{justify-content:space-between;align-items:center;gap:12px;margin-top:30px;display:flex}.mini-classroom .vn-button{text-align:center;justify-content:center;align-items:center;gap:7px;display:inline-flex}.mc-back-button{align-items:center;gap:3px;min-height:40px;font-size:12px;font-weight:700;display:inline-flex}.mc-question{background:#f7f3fe;border-radius:12px;margin:16px 0;padding:12px 15px}.mc-question p{font-size:17px;font-weight:700;line-height:1.6}.mc-question small{margin-top:6px;font-size:12px;line-height:1.7;display:block}.mc-question .mc-read-button{margin-top:5px}.mc-choices{gap:9px;margin-top:18px;display:grid}.mc-choice{text-align:left;border:1px solid #e2d9ef;border-radius:12px;align-items:center;gap:12px;padding:13px;transition:background .2s;display:flex}.mc-choice:hover{background:#faf9fc;border-color:#8b72d9}.mc-choice-letter{background:#f1ecfa;border-radius:50%;flex-shrink:0;place-items:center;width:28px;height:28px;font-size:12px;font-weight:800;display:grid}.mc-choice strong{font-size:15px;line-height:1.6;display:block}.mc-choice small{color:#655a79;margin-top:4px;font-size:12px;line-height:1.7;display:block}.mc-choice.is-correct{background:#f0f8f3;border-color:#4e846b}.mc-choice.is-correct .mc-choice-letter{color:#fff;background:#386b53}.mc-choice.is-retry{background:#fff8e9;border-color:#c38b32}.mc-feedback{color:#77591b;background:#fff8e9;border-radius:10px;margin-top:14px;padding:12px 14px;font-size:13px;line-height:1.8}.mc-feedback.is-correct{color:#386b53;background:#f0f8f3}.mc-success{margin-top:20px}.mc-success>p{margin-bottom:10px;font-size:13px;font-weight:700}.mc-success .vn-button{width:100%;padding:12px;font-size:13px}.mc-text-button{color:#7652be;min-height:40px;margin:8px auto 0;font-size:12px;font-weight:700;display:block}.mc-bridge{background:#e8e0f7;border-radius:20px;justify-content:space-between;align-items:center;gap:30px;margin-top:26px;padding:28px 32px;display:flex}.mc-bridge>div{max-width:640px}.mc-bridge>div>p:last-child{color:#655a79;margin-top:10px;font-size:13px;line-height:1.9}.mc-bridge>a{flex-shrink:0;font-size:13px}@keyframes mc-breathe{0%,to{transform:translateY(0)rotate(-.3deg)}50%{transform:translateY(-5px)rotate(.3deg)}}@keyframes mc-arrive{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}@media (max-width:1000px){.mc-workspace{grid-template-columns:.9fr 1.1fr}.mc-practice{padding:20px}.mc-person{width:160px;height:320px;bottom:-50px}.mc-bubble p[lang=vi]{font-size:18px}.mc-stage{height:460px}.mc-bridge{flex-direction:column;align-items:flex-start;gap:20px}}@media (max-width:760px){.mc-topics{gap:7px}.mc-topic{border-radius:12px;flex-direction:column;align-items:flex-start;gap:8px;padding:12px}.mc-topic-number{width:26px;height:26px;font-size:11px}.mc-topic strong{font-size:14px}.mc-topic small{display:none}.mc-workspace{border-radius:18px;grid-template-columns:1fr}.mc-scene-column{padding:12px}.mc-stage{height:390px}.mc-person{width:145px;height:290px;bottom:-90px}.mc-bao{left:6%}.mc-linh{right:6%}.mc-bubble{padding:10px 13px;top:48px;left:12px;right:12px}.mc-bubble p[lang=vi]{font-size:17px}.mc-bubble .mc-translation{font-size:12px}.mc-character-labels{bottom:10px;left:14px;right:14px}.mc-character-labels span{font-size:10px}.mc-role-note{font-size:11px}.mc-practice{padding:18px}.mc-steps{gap:5px;padding-bottom:17px}.mc-steps li{gap:5px;font-size:11px}.mc-panel{padding-top:20px}.mc-panel h2,.mc-bridge h2{font-size:22px}.mc-bridge{padding:22px}.mc-read-line p{font-size:21px}}@media (prefers-reduced-motion:reduce){.mini-classroom *,.mini-classroom :before,.mini-classroom :after{transition:none!important;animation:none!important}}.mc-topic{overflow-wrap:anywhere;min-width:0}.mc-topic>span:last-child,.mc-steps li{min-width:0}.mc-steps li span{flex-shrink:0}.mc-controls{flex-wrap:wrap}
