/* Áo game cho trang bài học. Không đụng trang thi. */
.game-skin{--game-wood:#16100C;--game-wood-2:#231912;--game-wood-3:#2E2219;--game-ink:#F7EBDC;--game-muted:#C4AD93;--game-fire:#FF9A2E;--game-fire-2:#FFC46B;--game-ok:#86D693;--game-bad:#E2574C;--game-accent:#2FB3A8;background:var(--game-wood);color:var(--game-ink)}
.game-skin .masthead{background:var(--game-wood-2);border-bottom:1px solid #3a2c22}
.game-skin .brand,.game-skin .back,.game-skin .masthead a{color:var(--game-ink)}
.game-bar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:0 auto;max-width:1200px;padding:10px 24px;background:var(--game-wood-2);color:var(--game-ink);border-bottom:1px solid #3a2c22}
.game-brand{font-weight:800;color:var(--game-fire-2)}
.game-skin .masthead,html[data-game-kind="practice"] .masthead{display:none!important}
html[data-game-kind="practice"] video::-webkit-media-text-track-container{bottom:52px!important;top:auto!important}
html[data-game-kind="practice"] video::cue{background:rgba(22,16,12,.92);color:#F7EBDC}
.game-bar a{color:var(--game-fire-2);font-weight:700;text-decoration:none}
.game-path{flex:1;min-width:0;color:var(--game-muted);font-size:14px}
.game-torch{color:var(--game-fire-2);font-weight:700;white-space:nowrap}
.game-torch:not(:empty)::before,.bu-torch-mark{display:inline-block;width:14px;height:14px;margin-right:4px;vertical-align:-2px;border-radius:50% 50% 45% 45%;background:radial-gradient(circle at 50% 35%,#fff6c2,#ff9a2e 55%,#c45a12);content:''}
.game-skin .teen-hero{background:linear-gradient(125deg,#2E2219,#231912);color:#F7EBDC}
.game-skin .teen-hero:after{background:var(--game-accent);opacity:.35}
.game-skin .panel,.game-skin .journey-card,.game-skin .lesson-card{background:#fff;color:#2A2018;border:1px solid #E6D9C6;border-radius:16px}
.game-skin .journey-step{border-radius:14px}
.game-skin .teen-dot.is-done{background:var(--game-ok);color:#142016}
.game-skin .teen-dot.is-current{background:var(--game-fire);color:#2a1608}
.game-skin .video-wrap{border:3px solid var(--game-accent);border-radius:14px;padding:6px;background:var(--game-wood)}
.game-skin .button,.game-skin .teen-button{border-radius:14px}
.game-mascot{position:fixed;left:16px;bottom:16px;z-index:8;display:flex;align-items:flex-end;gap:8px;width:max-content;max-width:min(320px,calc(100% - 32px));pointer-events:none}
.game-mascot button{pointer-events:auto}
.game-mascot img{width:72px;height:auto}
.game-mascot p{margin:0;max-width:220px;background:var(--game-wood-3,#2E2219);color:var(--game-ink,#F7EBDC);border:1px solid #3a2c22;border-radius:14px;padding:8px 12px;font-size:14px}
.game-mascot button{position:static;flex:0 0 auto;border:0;border-radius:99px;background:#2E2219;color:#F7EBDC;width:28px;height:28px;pointer-events:auto}
.game-done{margin:0 0 16px;padding:14px 16px;border-radius:14px;background:#2a2114;border:1px solid var(--game-fire);color:var(--game-ink)}
.game-done a{color:var(--game-fire-2);font-weight:700}
@media (prefers-reduced-motion:reduce){.game-skin *,.game-mascot,.game-spark{animation:none!important;transition:none!important}}
@media (max-width:800px){.game-bar{padding:10px 16px}.game-mascot{left:8px;right:auto;top:auto;bottom:8px;width:40px;max-width:40px}.game-mascot p{display:none}.game-mascot img{width:40px;height:40px;object-fit:cover;border-radius:50%}}
.game-exam-bar{position:fixed;top:0;left:0;right:0;z-index:2147483001;display:flex;align-items:center;gap:12px;height:40px;padding:0 16px;background:#1c1917;color:#F7EBDC;font:700 14px/1 "Be Vietnam Pro",system-ui,sans-serif}
.game-exam-bar a{color:#FFC46B;margin-left:auto}
html[data-game-kind="exam"] body{padding-top:40px}
html[data-game-kind="exam"] body.classroom-secure-active{padding-top:88px!important}
html[data-game-kind="exam"] #classroom-secure-bar{top:40px!important}
html[data-game-kind="practice"]{overflow-x:hidden;background:#16100C}
html[data-game-kind="practice"] body{background:#16100C!important;background-image:none!important;color:#F7EBDC;font-family:"Be Vietnam Pro",system-ui,sans-serif}
html[data-game-kind="practice"] .game-bar,html[data-game-kind="practice"] .game-exam-bar{background:#231912;color:#F7EBDC}
html[data-game-kind="practice"] .wrap-content,html[data-game-kind="practice"] .container,body.game-skin .teen-wrap{background:#FBF6EE!important;color:#2A2018!important;border:1px solid #E6D9C6;border-radius:16px;max-width:920px;margin:16px auto;padding:24px;box-sizing:border-box}
html[data-game-kind="practice"] .bg-white,html[data-game-kind="practice"] .bg-slate-50,html[data-game-kind="practice"] .bg-slate-100,html[data-game-kind="practice"] .card,html[data-game-kind="practice"] .qb-card,html[data-game-kind="practice"] .card-writing,body.game-skin .panel{background:#fff!important;color:#2A2018!important;border:1px solid #E6D9C6!important;border-radius:16px}
html[data-game-kind="practice"] input,html[data-game-kind="practice"] select,html[data-game-kind="practice"] textarea,body.game-skin .teen-wrap input,body.game-skin .teen-wrap select,body.game-skin .teen-wrap textarea{background:#FFFDF8;color:#2A2018;border:1px solid #E6D9C6;border-radius:14px}
html[data-game-house="writing"] textarea,body.game-skin textarea{background:#F7EBDC!important;color:#231912!important}
body.game-skin .question{display:flex;flex-direction:column;margin:16px 0;padding:0;border:0;min-width:0}
body.game-skin .question legend{position:relative;display:block;float:none;width:100%;margin:0 0 12px;padding:0;color:#2A2018;background:transparent}
body.game-skin .option{position:relative;clear:both;margin:8px 0 0;color:#2A2018;background:#fff}
body.game-skin .option span,body.game-skin .option .option-key{color:#2A2018}
body.game-skin .option .option-key{background:#F3E6D4}
body.game-skin .option.is-correct{background:#E3F4E8;color:#1E6B3F;border-color:#2E8B57}
body.game-skin .option.is-wrong{background:#FBE4E0;color:#9B2C1F;border-color:#C2412F}
body.game-skin .feedback,html[data-game-kind="practice"] .feedback{background:#FBE4E0!important;color:#9B2C1F!important;border-left:4px solid #C2412F}
body.game-skin .feedback.correct,html[data-game-kind="practice"] .feedback.correct{background:#E3F4E8!important;color:#1E6B3F!important;border-left-color:#2E8B57}
body.game-skin .feedback strong{color:inherit!important}
body.game-skin .feedback strong::before{content:"✗ Chưa đúng · "}
body.game-skin .feedback.correct strong::before{content:"✓ Đúng · "}
body.game-skin .panel .eyebrow,body.game-skin .eyebrow{color:#7A3208}
body.game-skin .kw,body.game-skin .sentence,html[data-game-kind="practice"] .kw,html[data-game-kind="practice"] .sentence{color:#2A2018;background:transparent}
body.game-skin .kw[aria-pressed="true"],body.game-skin .sentence[aria-pressed="true"]{background:#F6E2B8;color:#2A2018}
body.game-skin .kw:disabled,body.game-skin .sentence:disabled{color:#6B5A48}
body.game-skin .kw:focus-visible,body.game-skin .sentence:focus-visible{outline:2px solid #D9741A;outline-offset:2px}
@media (max-width:600px){html[data-game-kind="practice"] .wrap-content,html[data-game-kind="practice"] .container,body.game-skin .teen-wrap{padding:14px;margin:8px}}
html[data-game-house="vocab"] .card,html[data-game-house="vocab"] [style*="border-radius:12px"]{border-radius:14px}
html[data-game-house="vocab"] .vocab-manage-wrap{background:transparent}
html[data-game-house="vocab"] .vocab-portal.is-brightup{background:transparent;color:#2A2018;padding:16px}
html[data-game-house="vocab"] .vocab-portal.is-brightup .vocab-portal-topbar,html[data-game-house="vocab"] .vocab-portal.is-brightup .vocab-manager-card{background:#FBF6EE;color:#2A2018;border:1px solid #E6D9C6;border-radius:16px}
html[data-game-house="vocab"] .vocab-portal.is-brightup .vocab-back-class{border-color:#E6D9C6;background:#FFFDF8;color:#7A3208}
html[data-game-house="vocab"] .vocab-portal.is-brightup .vocab-table{min-width:0}
html[data-game-house="vocab"] .vocab-portal.is-brightup .vocab-row-actions{flex-wrap:wrap;justify-content:flex-start}
html[data-game-house="vocab"] .vocab-bed{display:inline-flex;align-items:center;gap:6px;margin-top:4px;color:#7A3208;font-size:14px;font-weight:700}
html[data-game-house="vocab"] #study-room-launcher{display:none}
html[data-game-house="speaking"] .wave,html[data-game-house="speaking"] canvas{filter:drop-shadow(0 0 6px #F06C8B)}
.game-vine{color:#FFC46B;font-weight:700;white-space:nowrap}
.game-combo{color:#FF9A2E;font-weight:800}
.game-mascot.is-practice{z-index:40}
.game-mascot.is-dock{width:48px;max-width:48px}
.game-mascot.is-dock p{display:none}
.game-mascot.is-dock img{width:48px;height:48px;border-radius:50%;object-fit:cover}
.game-spark{position:fixed;z-index:70;color:#FFC46B;font-weight:800;pointer-events:none}
.game-summary{position:fixed;right:16px;bottom:16px;z-index:45;max-width:min(360px,calc(100% - 32px));padding:16px;border-radius:14px;background:#2E2219;color:#F7EBDC;border:1px solid #FF9A2E}
.game-summary a,.game-summary button{color:#2a1608;background:#FFC46B;border:0;border-radius:14px;padding:8px 12px;font-weight:700;text-decoration:none;cursor:pointer}
.game-round{margin-left:auto;border:0;border-radius:14px;background:#FF9A2E;color:#2a1608;font-weight:700;padding:6px 10px;cursor:pointer}
@media (max-width:420px){.game-exam-bar,.game-bar,.game-brand,.game-bar a{font-size:14px}.game-path{flex-basis:100%}}
html[data-game-kind="practice"] .listening-audio-bar__status,
html[data-game-kind="practice"] .listening-audio-speed__btn,
html[data-game-kind="practice"] #listening-test-app .question-palette__item,
html[data-game-kind="practice"] #reading-test-app .question-palette__item{font-size:14px}
@media (max-width:480px){
html[data-game-kind="practice"] #listening-test-app .listening-questions-wrap{overflow-x:auto;max-width:100%;box-sizing:border-box}
html[data-game-kind="practice"] #listening-test-app .test-panel table,
html[data-game-kind="practice"] #listening-test-app .test-panel tbody,
html[data-game-kind="practice"] #listening-test-app .test-panel tr,
html[data-game-kind="practice"] #listening-test-app .test-panel th,
html[data-game-kind="practice"] #listening-test-app .test-panel td{display:block;width:100%;min-width:0;max-width:100%;box-sizing:border-box}
html[data-game-kind="practice"] #listening-test-app .test-panel li{white-space:normal;max-width:100%}
html[data-game-kind="practice"] #listening-test-app .test-panel__iotquestion{flex-wrap:wrap;max-width:100%}
html[data-game-kind="practice"] #listening-test-app .test-panel__input-answer,
html[data-game-kind="practice"] #listening-test-app .iot-lr-question.iot-question__fill-blank{min-width:7.5em;width:7.5em;max-width:100%;box-sizing:border-box}
}
/* 05/10 student test: readable pronunciation instructions and corrected words. */
body.game-skin .teen-card{background:#FBF6EE;color:#2A2018;--muted:#6B5A48;--bg:#F3E6D4}
body.game-skin .gv-missing{color:#1E6B3F;border-bottom-color:#1E6B3F}
body.game-skin .gv-wrong{color:#9B2C1F;background:#FBE4E0}
/* Keep dark hero headings distinct from the light lesson paper. */
body.game-skin .teen-hero .eyebrow{color:#FFC46B}
