#wa-east-asia{
  --paper: #f6f2e9;
  --paper-deep: #ece5d8;
  --card: #fffdf8;
  --ink: #25231f;
  --muted: #6e695e;
  --accent: #918766;
  --accent-dark: #665e48;
  --accent-soft: #ded7c7;
  --line: #d9d1c1;
  --success: #2f6b4f;
  --success-soft: #e4f0e8;
  --danger: #9a3e3e;
  --danger-soft: #f7e8e6;
  --focus: #2f5d91;
  --shadow: 0 18px 50px rgba(57, 49, 35, .12);
  --radius: 22px;
  --header-h: 82px;
  --footer-h: 74px;
  color-scheme: light;
}
#wa-east-asia *{ box-sizing: border-box; }
#wa-east-asia{ min-height: 100%; background: var(--paper); }
#wa-east-asia{
  min-height: 100vh;
  margin: 0;
  color: var(--ink);
  background:
    radial-gradient(circle at 10% 5%, rgba(145,135,102,.13), transparent 32rem),
    radial-gradient(circle at 92% 88%, rgba(145,135,102,.09), transparent 30rem),
    var(--paper);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  line-height: 1.55;
}
#wa-east-asia button, #wa-east-asia input, #wa-east-asia textarea, #wa-east-asia select{ font: inherit; }
#wa-east-asia button{ color: inherit; }
#wa-east-asia button:focus-visible, #wa-east-asia input:focus-visible, #wa-east-asia textarea:focus-visible, #wa-east-asia select:focus-visible, #wa-east-asia summary:focus-visible, #wa-east-asia [tabindex]:focus-visible{
  outline: 3px solid color-mix(in srgb, var(--focus) 72%, white);
  outline-offset: 3px;
}
#wa-east-asia a{ color: var(--accent-dark); }
#wa-east-asia img{ max-width: 100%; display: block; }
#wa-east-asia [hidden]{ display: none !important; }
#wa-east-asia .course-shell{ min-height: 100vh; display: grid; grid-template-rows: auto 1fr auto; }
#wa-east-asia .course-header{
  position: sticky; top: 0; z-index: 30;
  min-height: var(--header-h);
  display: grid;
  grid-template-columns: auto minmax(0,1fr) auto;
  align-items: center;
  gap: 18px;
  padding: 12px clamp(16px,3vw,42px) 16px;
  background: rgba(246,242,233,.92);
  border-bottom: 1px solid rgba(145,135,102,.25);
  backdrop-filter: blur(14px);
}
#wa-east-asia .header-brand{ min-width: 0; line-height: 1.15; }
#wa-east-asia .header-brand strong{ display: block; font-family: "Cormorant", Georgia, "Times New Roman", serif; font-size: clamp(1.05rem,2vw,1.42rem); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#wa-east-asia .brand-kicker{ display: block; color: var(--accent-dark); font-size: .73rem; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; }
#wa-east-asia .header-status{ display: flex; align-items: center; gap: 12px; color: var(--muted); font-size: .9rem; }
#wa-east-asia .learner-label{ max-width: 180px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#wa-east-asia .score-label{ min-width: 64px; padding: 6px 10px; border: 1px solid var(--line); border-radius: 999px; background: var(--card); font-weight: 800; text-align: center; }
#wa-east-asia .header-progress{ position: absolute; left: 0; right: 0; bottom: 0; height: 4px; background: var(--accent-soft); overflow: hidden; }
#wa-east-asia .progress-bar{ display: block; width: 0; height: 100%; background: var(--accent); transition: width .3s ease; }
#wa-east-asia .icon-button{ display: inline-grid; place-items: center; width: 44px; height: 44px; padding: 0; border: 1px solid var(--line); border-radius: 50%; background: var(--card); cursor: pointer; font-size: 1.45rem; box-shadow: 0 6px 18px rgba(57,49,35,.08); }
#wa-east-asia .course-main{ width: min(1180px, 100%); margin: 0 auto; padding: clamp(24px,4vw,56px) clamp(16px,4vw,44px); min-height: calc(100vh - var(--header-h) - var(--footer-h)); }
#wa-east-asia .course-main > .screen{ animation: enter .32s ease both; }
@keyframes enter{ from { opacity: 0; transform: translateY(7px); } to { opacity: 1; transform: translateY(0); } }
#wa-east-asia .course-footer{
  position: sticky; bottom: 0; z-index: 25;
  min-height: var(--footer-h);
  display: grid;
  grid-template-columns: auto auto 1fr auto;
  align-items: center;
  gap: 10px;
  padding: 10px clamp(14px,3vw,38px);
  background: rgba(246,242,233,.94);
  border-top: 1px solid rgba(145,135,102,.25);
  backdrop-filter: blur(14px);
}
#wa-east-asia .screen-label{ justify-self: center; color: var(--muted); font-size: .86rem; }
#wa-east-asia .button{
  min-height: 44px;
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  padding: 10px 18px;
  border-radius: 999px;
  border: 1px solid transparent;
  font-weight: 800;
  text-decoration: none;
  cursor: pointer;
  transition: transform .16s ease, box-shadow .16s ease, background .16s ease;
}
#wa-east-asia .button:hover{ transform: translateY(-1px); }
#wa-east-asia .button:disabled{ opacity: .42; cursor: not-allowed; transform: none; }
#wa-east-asia .button.primary{ background: var(--accent-dark); color: white; box-shadow: 0 8px 22px rgba(83,75,54,.2); }
#wa-east-asia .button.secondary{ background: var(--card); border-color: var(--line); }
#wa-east-asia .button.ghost{ background: transparent; border-color: transparent; color: var(--accent-dark); }
#wa-east-asia .button.success{ background: var(--success); color: white; }
#wa-east-asia .button.danger{ background: var(--danger); color: white; }
#wa-east-asia .text-button{ border: 0; background: transparent; padding: 8px; cursor: pointer; text-decoration: underline; text-underline-offset: 3px; }
#wa-east-asia .text-button.danger{ color: var(--danger); }
#wa-east-asia .button-row{ display: flex; flex-wrap: wrap; gap: 12px; align-items: center; margin-top: 24px; }
#wa-east-asia .card{ background: rgba(255,253,248,.96); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow); }
#wa-east-asia .content-card{ padding: clamp(22px,4vw,48px); }
#wa-east-asia .eyebrow{ color: var(--accent-dark); font-size: .78rem; font-weight: 850; letter-spacing: .14em; text-transform: uppercase; }
#wa-east-asia h1, #wa-east-asia h2, #wa-east-asia h3{ margin: 0; font-family: "Cormorant", Georgia, "Times New Roman", serif; line-height: 1.13; }
#wa-east-asia h1{ font-size: clamp(2.2rem,6vw,5rem); font-weight: 500; }
#wa-east-asia h2{ font-size: clamp(1.7rem,3.6vw,2.8rem); font-weight: 500; }
#wa-east-asia h3{ font-size: clamp(1.08rem,2.3vw,1.42rem); }
#wa-east-asia p{ margin: 0 0 1em; }
#wa-east-asia .lead{ max-width: 780px; color: var(--muted); font-size: clamp(1.03rem,2vw,1.25rem); }
#wa-east-asia .muted{ color: var(--muted); }
#wa-east-asia .small{ font-size: .9rem; }
#wa-east-asia .title-screen, #wa-east-asia .section-screen{ min-height: min(670px, calc(100vh - 200px)); display: grid; place-items: center; text-align: center; overflow: hidden; position: relative; }
#wa-east-asia .title-screen::before, #wa-east-asia .section-screen::before{ content:""; position:absolute; inset: 18px; border: 1px solid rgba(145,135,102,.34); border-radius: calc(var(--radius) - 6px); pointer-events:none; }
#wa-east-asia .title-inner, #wa-east-asia .section-inner{ position: relative; z-index: 1; width: min(820px, 92%); padding: 44px 20px; }
#wa-east-asia .title-screen h1{ margin-bottom: 10px; }
#wa-east-asia .title-rule{ width: 140px; height: 1px; background: var(--accent); margin: 22px auto; position: relative; }
#wa-east-asia .title-rule::after{ content:"◆"; position:absolute; left:50%; top:50%; transform:translate(-50%,-52%); padding:0 10px; color:var(--accent); background:var(--card); font-size:.72rem; }
#wa-east-asia .section-screen h1{ font-size: clamp(2.25rem,6vw,4.7rem); }
#wa-east-asia .form-card{ max-width: 760px; margin: 0 auto; }
#wa-east-asia .field-label{ display:block; margin-bottom:8px; font-weight:800; }
#wa-east-asia .text-input, #wa-east-asia .text-area, #wa-east-asia .select-input{
  width: 100%; border: 1px solid var(--line); border-radius: 14px; background: white; color: var(--ink); padding: 14px 16px;
}
#wa-east-asia .text-input{ min-height: 52px; font-size: 1.08rem; }
#wa-east-asia .text-area{ min-height: 190px; resize: vertical; line-height: 1.65; }
#wa-east-asia .field-note{ display:flex; justify-content:space-between; gap:14px; margin-top:7px; color:var(--muted); font-size:.86rem; }
#wa-east-asia .toc-grid, #wa-east-asia .exercise-grid{ display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 16px; margin-top: 26px; }
#wa-east-asia .toc-card, #wa-east-asia .exercise-card{ text-align:left; padding: 22px; border: 1px solid var(--line); border-radius: 18px; background: var(--card); cursor: pointer; min-height: 160px; display:flex; flex-direction:column; transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease; }
#wa-east-asia .toc-card:hover, #wa-east-asia .exercise-card:hover{ transform: translateY(-3px); border-color: var(--accent); box-shadow: 0 14px 28px rgba(57,49,35,.1); }
#wa-east-asia .toc-card h3, #wa-east-asia .exercise-card h3{ margin-bottom:9px; }
#wa-east-asia .toc-card p, #wa-east-asia .exercise-card p{ color:var(--muted); font-size:.91rem; flex:1; }
#wa-east-asia .card-progress{ height: 5px; border-radius: 999px; background: var(--accent-soft); overflow:hidden; margin-top:16px; }
#wa-east-asia .card-progress span{ display:block; height:100%; background:var(--accent); }
#wa-east-asia .info-banner{ display:flex; gap:14px; align-items:flex-start; padding:16px 18px; border:1px solid var(--line); background:var(--paper); border-radius:16px; margin:20px 0; }
#wa-east-asia .info-icon{ width:30px; height:30px; flex:0 0 auto; display:grid; place-items:center; border-radius:50%; background:var(--accent-soft); color:var(--accent-dark); font-weight:900; }
#wa-east-asia .external-card{ max-width: 850px; margin: 0 auto; }
#wa-east-asia .external-steps{ display:grid; gap:12px; counter-reset: step; margin:24px 0; }
#wa-east-asia .external-step{ position:relative; padding:15px 16px 15px 54px; border:1px solid var(--line); border-radius:15px; background:var(--paper); }
#wa-east-asia .external-step::before{ counter-increment:step; content:counter(step); position:absolute; left:15px; top:13px; width:28px; height:28px; display:grid; place-items:center; border-radius:50%; background:var(--accent-dark); color:white; font-weight:800; }
#wa-east-asia .glossary-grid{ display:grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap:12px; margin-top:24px; }
#wa-east-asia details.glossary-item{ border:1px solid var(--line); border-radius:15px; background:var(--card); overflow:hidden; }
#wa-east-asia details.glossary-item summary{ cursor:pointer; list-style:none; padding:15px 18px; font-weight:850; color:var(--accent-dark); }
#wa-east-asia details.glossary-item summary::-webkit-details-marker{ display:none; }
#wa-east-asia details.glossary-item summary::after{ content:"+"; float:right; }
#wa-east-asia details.glossary-item[open] summary::after{ content:"−"; }
#wa-east-asia details.glossary-item p{ padding:0 18px 16px; margin:0; color:var(--muted); }
#wa-east-asia .story-layout{ display:grid; grid-template-columns: minmax(0,1.45fr) minmax(260px,.7fr); gap:24px; align-items:start; }
#wa-east-asia .story-copy{ padding: clamp(22px,3vw,42px); }
#wa-east-asia .story-toolbar{ display:flex; flex-wrap:wrap; gap:9px; justify-content:space-between; align-items:center; padding-bottom:17px; border-bottom:1px solid var(--line); margin-bottom:20px; }
#wa-east-asia .story-text{ font-family: "Inter", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; font-size: clamp(1rem,1.6vw,1.17rem); line-height:1.85; }
#wa-east-asia .story-text p{ margin-bottom:1.05em; }
#wa-east-asia .story-images{ display:grid; gap:20px; align-content:start; }
#wa-east-asia .story-image-frame{ margin:0; display:grid; gap:8px; min-width:0; overflow:hidden; border-radius:18px; }
#wa-east-asia .story-image-frame figcaption{ color:var(--muted); font-size:.82rem; text-align:center; }
#wa-east-asia .story-image-main{ aspect-ratio: 4 / 5; width:100%; object-fit:cover; border-radius:18px; border:1px solid var(--line); box-shadow:var(--shadow); }
#wa-east-asia .story-image-main.landscape{ aspect-ratio: 4 / 3; }
#wa-east-asia .story-image-main.square{ aspect-ratio: 1 / 1; }
#wa-east-asia .story-image-main.route{ aspect-ratio: 16 / 9; object-fit:cover; }
#wa-east-asia .story-image-main.natural{ aspect-ratio:auto; height:auto; object-fit:contain; }
#wa-east-asia .vocab-term{ display:inline; border:0; background:transparent; padding:0; margin:0; font:inherit; color:var(--accent-dark); font-weight:800; text-decoration:underline dotted; text-underline-offset:3px; cursor:pointer; }
#wa-east-asia .story-reference{ margin-top:22px; }
#wa-east-asia .story-reference summary{ cursor:pointer; color:var(--accent-dark); font-weight:800; }
#wa-east-asia .story-reference .story-text{ max-height:330px; overflow:auto; margin-top:14px; padding:18px; background:var(--paper); border-radius:14px; }
#wa-east-asia .story-audio-player{
  display: grid;
  gap: 10px;
  margin: 0 0 24px;
  padding: 14px 16px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: var(--paper);
}
#wa-east-asia .story-audio-player audio{ display: none; }
#wa-east-asia .story-audio-controls{
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}
#wa-east-asia .story-audio-controls .button{ min-height: 44px; padding: 9px 15px; }
#wa-east-asia .story-audio-play{ min-width: 104px; }
#wa-east-asia .story-audio-play [data-audio-play-icon]{
  display: inline-grid;
  place-items: center;
  width: 18px;
  font-size: .86rem;
}
#wa-east-asia .story-audio-speed-label{
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 5px 6px 5px 13px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--card);
  color: var(--accent-dark);
  font-size: .88rem;
  font-weight: 800;
}
#wa-east-asia .story-audio-speed{
  min-height: 32px;
  padding: 4px 28px 4px 9px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--card);
  color: var(--ink);
  font-weight: 800;
  cursor: pointer;
}
#wa-east-asia .story-audio-progress-row{
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
}
#wa-east-asia .story-audio-progress{
  width: 100%;
  min-width: 0;
  height: 44px;
  margin: 0;
  accent-color: var(--accent-dark);
  cursor: pointer;
}
#wa-east-asia .story-audio-progress:disabled{ cursor: wait; opacity: .55; }
#wa-east-asia .story-audio-time{
  min-width: 98px;
  color: var(--muted);
  font-size: .84rem;
  font-variant-numeric: tabular-nums;
  font-weight: 750;
  text-align: right;
  white-space: nowrap;
}
#wa-east-asia .story-audio-status{
  min-height: 1.25em;
  margin: 0;
  color: var(--muted);
  font-size: .8rem;
}
#wa-east-asia .question-card{ max-width: 920px; margin: 0 auto; }
#wa-east-asia .question-number{ color:var(--accent-dark); font-size:.82rem; font-weight:850; text-transform:uppercase; letter-spacing:.12em; }
#wa-east-asia .question-title{ margin:10px 0 24px; font-family:"Cormorant",Georgia,"Times New Roman",serif; font-size:clamp(1.35rem,3vw,2.15rem); }
#wa-east-asia .option-list{ display:grid; gap:11px; }
#wa-east-asia .option-label{ position:relative; display:grid; grid-template-columns:auto 1fr; gap:13px; align-items:flex-start; padding:15px 17px; border:1px solid var(--line); border-radius:15px; background:white; cursor:pointer; transition:border-color .15s ease, background .15s ease; }
#wa-east-asia .option-label:hover{ border-color:var(--accent); }
#wa-east-asia .option-label:has(input:checked){ border-color:var(--accent-dark); background:#f3efe4; }
#wa-east-asia .option-label.correct{ border-color:var(--success); background:var(--success-soft); }
#wa-east-asia .option-label.incorrect{ border-color:var(--danger); background:var(--danger-soft); }
#wa-east-asia .option-label input{ margin-top:4px; width:18px; height:18px; accent-color:var(--accent-dark); }
#wa-east-asia .feedback{ margin-top:18px; padding:15px 17px; border-radius:15px; border:1px solid var(--line); }
#wa-east-asia .feedback.success{ background:var(--success-soft); border-color:color-mix(in srgb,var(--success) 40%,white); }
#wa-east-asia .feedback.error{ background:var(--danger-soft); border-color:color-mix(in srgb,var(--danger) 40%,white); }
#wa-east-asia .feedback strong{ display:block; margin-bottom:4px; }
#wa-east-asia .word-options{ display:flex; flex-wrap:wrap; gap:10px; margin:20px 0; }
#wa-east-asia .word-chip{ min-width:110px; padding:12px 18px; border:1px solid var(--line); border-radius:999px; background:white; font-weight:800; cursor:pointer; }
#wa-east-asia .word-chip:hover, #wa-east-asia .word-chip.selected{ border-color:var(--accent-dark); background:var(--paper-deep); }
#wa-east-asia .sentence-frame{ padding:24px; border:1px solid var(--line); background:var(--paper); border-radius:17px; font-family:"Inter",ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; font-size:clamp(1.18rem,2.7vw,1.7rem); }
#wa-east-asia .blank-display{ display:inline-block; min-width:120px; border-bottom:2px solid var(--accent-dark); color:var(--accent-dark); font-weight:800; text-align:center; }
#wa-east-asia .multi-grid{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; margin-top:24px; }
#wa-east-asia .multi-item{ padding:18px; border:1px solid var(--line); border-radius:16px; background:white; }
#wa-east-asia .multi-item.correct{ border-color:var(--success); background:var(--success-soft); }
#wa-east-asia .multi-item.incorrect{ border-color:var(--danger); background:var(--danger-soft); }
#wa-east-asia .multi-prompt{ min-height:52px; margin-bottom:13px; font-family:"Inter",ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; font-size:1.08rem; }
#wa-east-asia .sentence-choice-grid{ align-items:start; }
#wa-east-asia .sentence-choice-item{ display:flex; flex-direction:column; }
#wa-east-asia .sentence-clue{ margin:9px 0 12px; color:var(--muted); font-weight:700; line-height:1.55; }
#wa-east-asia .multi-sentence, #wa-east-asia .game-sentence{ padding:18px; font-size:clamp(1.05rem,2vw,1.3rem); line-height:1.55; }
#wa-east-asia .sentence-choice-item .word-options, #wa-east-asia .game-sentence + .word-options{ margin:14px 0 0; }
#wa-east-asia .sentence-choice-item .feedback{ margin-top:14px; }
#wa-east-asia .game-try-again{ margin:10px 0 0; color:var(--danger); font-weight:750; }
#wa-east-asia .model-answer{ margin-top:22px; border:1px solid var(--line); border-radius:16px; background:var(--paper); overflow:hidden; }
#wa-east-asia .model-answer summary{ cursor:pointer; list-style:none; padding:15px 18px; color:var(--accent-dark); font-weight:850; }
#wa-east-asia .model-answer summary::-webkit-details-marker{ display:none; }
#wa-east-asia .model-answer summary::after{ content:"+"; float:right; }
#wa-east-asia .model-answer[open] summary{ border-bottom:1px solid var(--line); }
#wa-east-asia .model-answer[open] summary::after{ content:"−"; }
#wa-east-asia .model-answer-body{ padding:20px; }
#wa-east-asia .model-answer-body h3{ margin:20px 0 10px; color:var(--accent-dark); }
#wa-east-asia .model-answer-body h4{ margin:20px 0 9px; font-size:1rem; }
#wa-east-asia .model-answer-copy{ padding:17px 18px; border:1px solid var(--line); border-radius:14px; background:var(--card); font-family:"Inter",ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; line-height:1.72; }
#wa-east-asia .model-answer-copy p:last-child{ margin-bottom:0; }
#wa-east-asia .model-answer-note{ display:grid; gap:4px; padding:14px 16px; border-left:4px solid var(--accent); background:var(--card); color:var(--muted); }
#wa-east-asia .model-answer-note strong{ color:var(--ink); }
#wa-east-asia .model-answer-analysis{ margin:0; padding-left:20px; }
#wa-east-asia .model-answer-analysis li{ margin:8px 0; line-height:1.55; }
#wa-east-asia .mini-model-answer{ margin-top:12px; border-top:1px solid var(--line); padding-top:10px; }
#wa-east-asia .mini-model-answer summary{ cursor:pointer; color:var(--accent-dark); font-weight:800; }
#wa-east-asia .mini-model-answer p{ margin:10px 0 0; padding:12px 14px; border-radius:12px; background:var(--paper); line-height:1.6; }
#wa-east-asia .flashcard-grid{ display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:14px; margin-top:24px; }
#wa-east-asia .flashcard-grid.six-cards{ grid-template-columns:repeat(3,minmax(0,1fr)); }
#wa-east-asia .flashcard{ perspective:1000px; min-height:340px; height:360px; border:0; background:transparent; padding:0; cursor:pointer; text-align:left; }
#wa-east-asia .flashcard-inner{ display:block; position:relative; width:100%; height:100%; min-height:340px; transform-style:preserve-3d; transition:transform .55s ease; }
#wa-east-asia .flashcard.flipped .flashcard-inner{ transform:rotateY(180deg); }
#wa-east-asia .flashcard-face{ display:block; position:absolute; inset:0; backface-visibility:hidden; border:1px solid var(--line); border-radius:18px; overflow:hidden; background:var(--card); box-shadow:0 12px 30px rgba(57,49,35,.1); }
#wa-east-asia .flashcard-front{ display:flex; flex-direction:column; }
#wa-east-asia .flashcard-front img{ width:100%; height:245px; object-fit:cover; }
#wa-east-asia .flashcard-word{ padding:16px; text-align:center; font-family:"Cormorant",Georgia,"Times New Roman",serif; font-size:1.35rem; }
#wa-east-asia .flashcard-back{ transform:rotateY(180deg); padding:20px; overflow:auto; }
#wa-east-asia .flashcard-back h3{ color:var(--accent-dark); margin-bottom:4px; }
#wa-east-asia .flashcard-back .part{ color:var(--muted); font-size:.85rem; font-weight:800; text-transform:uppercase; }
#wa-east-asia .flashcard-back ul{ padding-left:18px; }
#wa-east-asia .flashcard-hint{ text-align:center; color:var(--muted); font-size:.88rem; margin-top:14px; }
#wa-east-asia .game-tabs{ display:flex; flex-wrap:wrap; gap:8px; margin:22px 0; border-bottom:1px solid var(--line); padding-bottom:12px; }
#wa-east-asia .game-tab{ border:1px solid var(--line); background:white; border-radius:999px; padding:10px 16px; cursor:pointer; font-weight:800; }
#wa-east-asia .game-tab.active{ background:var(--accent-dark); color:white; border-color:var(--accent-dark); }
#wa-east-asia .game-panel{ min-height:460px; }
#wa-east-asia .game-hero{ display:grid; grid-template-columns:minmax(0,1fr) minmax(240px,.55fr); gap:22px; align-items:center; }
#wa-east-asia .game-image{ border-radius:17px; border:1px solid var(--line); }
#wa-east-asia .game-image-link{ display:block; align-self:start; color:var(--accent-dark); text-decoration:none; border-radius:17px; }
#wa-east-asia .game-image-link:hover .game-image{ transform:translateY(-2px); box-shadow:0 14px 28px rgba(57,49,35,.14); }
#wa-east-asia .game-image-link:focus-visible{ outline:3px solid var(--accent-soft); outline-offset:4px; }
#wa-east-asia .game-image-link .game-image{ width:100%; transition:transform .16s ease, box-shadow .16s ease; }
#wa-east-asia .game-image-caption{ display:flex; justify-content:center; gap:7px; margin-top:9px; font-weight:850; text-align:center; }
#wa-east-asia .word-search-wrap aside .game-image-link{ margin-top:20px; }
#wa-east-asia .game-score{ display:inline-flex; padding:8px 12px; border-radius:999px; background:var(--paper-deep); font-weight:800; }
#wa-east-asia .word-search-wrap{ display:grid; grid-template-columns:minmax(430px,1fr) minmax(180px,.35fr); gap:24px; align-items:start; }
#wa-east-asia .word-search{ display:grid; grid-template-columns:repeat(14,minmax(22px,1fr)); gap:3px; user-select:none; touch-action:manipulation; }
#wa-east-asia .letter-cell{ aspect-ratio:1; min-width:0; display:grid; place-items:center; border:1px solid var(--line); border-radius:5px; background:white; padding:0; font-size:clamp(.68rem,1.55vw,1rem); font-weight:800; cursor:pointer; }
#wa-east-asia .letter-cell.start{ background:var(--accent-soft); border-color:var(--accent-dark); }
#wa-east-asia .letter-cell.found{ background:var(--success-soft); border-color:var(--success); color:var(--success); }
#wa-east-asia .word-list{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
#wa-east-asia .word-list span{ padding:7px 9px; border-radius:8px; background:var(--paper); text-transform:uppercase; font-weight:800; font-size:.85rem; }
#wa-east-asia .word-list span.found{ text-decoration:line-through; color:var(--success); background:var(--success-soft); }
#wa-east-asia .garden-layout{ display:grid; grid-template-columns:minmax(0,1.45fr) minmax(240px,.55fr); gap:22px; align-items:start; }
#wa-east-asia .garden-panel{ border:1px solid var(--line); border-radius:17px; background:white; overflow:hidden; }
#wa-east-asia .garden-panel img{ display:block; width:100%; height:auto; min-height:0; object-fit:contain; background:transparent; }
#wa-east-asia .garden-controls{ padding:18px; }
#wa-east-asia .garden-counter{ color:var(--muted); font-weight:800; }
#wa-east-asia .garden-overview{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; }
#wa-east-asia .garden-jump{ padding:11px; border:1px solid var(--line); background:white; border-radius:11px; cursor:pointer; text-align:left; }
#wa-east-asia .garden-jump.current{ border-color:var(--accent-dark); background:var(--paper-deep); }
#wa-east-asia .garden-jump.correct{ border-color:var(--success); background:var(--success-soft); }
#wa-east-asia .sentence-practice-grid{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; margin-top:22px; }
#wa-east-asia .sentence-practice-item{ padding:16px; border:1px solid var(--line); border-radius:15px; background:white; }
#wa-east-asia .sentence-practice-item textarea{ min-height:105px; }
#wa-east-asia .word-picker{ display:flex; flex-wrap:wrap; gap:9px; margin:20px 0; }
#wa-east-asia .word-picker button{ border:1px solid var(--line); border-radius:999px; background:white; padding:9px 14px; font-weight:800; cursor:pointer; }
#wa-east-asia .word-picker button.selected{ background:var(--accent-dark); color:white; border-color:var(--accent-dark); }
#wa-east-asia .results-grid{ display:grid; grid-template-columns:minmax(260px,.55fr) minmax(0,1fr); gap:24px; margin-top:24px; }
#wa-east-asia .score-ring{ width:min(280px,70vw); aspect-ratio:1; margin:0 auto; border-radius:50%; display:grid; place-items:center; background:conic-gradient(var(--accent-dark) var(--score-angle), var(--accent-soft) 0); position:relative; }
#wa-east-asia .score-ring::before{ content:""; position:absolute; inset:18px; border-radius:50%; background:var(--card); }
#wa-east-asia .score-ring-content{ position:relative; text-align:center; }
#wa-east-asia .score-ring strong{ display:block; font-family:"Inter",ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; font-size:3.4rem; line-height:1; }
#wa-east-asia .breakdown-list{ display:grid; gap:10px; }
#wa-east-asia .breakdown-row{ display:grid; grid-template-columns:1fr auto; gap:12px; align-items:center; padding:13px 15px; border:1px solid var(--line); border-radius:13px; background:white; }
#wa-east-asia .review-list{ display:flex; flex-wrap:wrap; gap:8px; margin-top:16px; }
#wa-east-asia .review-button{ border:1px solid var(--line); border-radius:999px; background:white; padding:8px 12px; cursor:pointer; }
#wa-east-asia .certificate-wrap{ padding:clamp(16px,3vw,34px); }
#wa-east-asia .certificate{ position:relative; min-height:650px; padding:clamp(40px,7vw,86px); text-align:center; border:7px double var(--accent); background:var(--card); overflow:hidden; }
#wa-east-asia .certificate::before{ content:""; position:absolute; inset:17px; border:1px solid var(--accent-soft); pointer-events:none; }
#wa-east-asia .certificate h1{ font-size:clamp(2.2rem,5vw,4.1rem); color:var(--accent-dark); }
#wa-east-asia .certificate-name{ margin:28px auto 9px; max-width:720px; padding-bottom:8px; border-bottom:1px solid var(--accent); font-family:"Cormorant",Georgia,"Times New Roman",serif; font-size:clamp(1.8rem,4vw,3rem); }
#wa-east-asia .certificate-course{ font-family:"Cormorant",Georgia,"Times New Roman",serif; font-size:1.35rem; }
#wa-east-asia .certificate-copy{ max-width:760px; margin:24px auto; color:var(--muted); }
#wa-east-asia .certificate-meta{ display:flex; justify-content:space-between; gap:20px; max-width:720px; margin:48px auto 0; }
#wa-east-asia .certificate-meta div{ flex:1; padding-top:8px; border-top:1px solid var(--accent); }
#wa-east-asia .certificate.locked{ filter:grayscale(.4); }
#wa-east-asia .certificate-lock{ position:absolute; inset:0; z-index:4; display:grid; place-items:center; background:rgba(246,242,233,.88); padding:30px; }
#wa-east-asia .certificate-lock-box{ max-width:520px; padding:26px; border:1px solid var(--line); border-radius:18px; background:var(--card); box-shadow:var(--shadow); }
#wa-east-asia .toc-drawer{ position:fixed; inset:0 auto 0 0; z-index:60; width:min(430px,92vw); padding:24px; background:var(--card); border-right:1px solid var(--line); box-shadow:20px 0 60px rgba(37,35,31,.2); transform:translateX(-105%); transition:transform .25s ease; overflow:auto; }
#wa-east-asia .toc-drawer.open{ transform:translateX(0); }
#wa-east-asia .drawer-backdrop{ position:fixed; inset:0; z-index:55; background:rgba(27,25,21,.42); backdrop-filter:blur(2px); }
#wa-east-asia .drawer-head{ display:flex; justify-content:space-between; align-items:flex-start; gap:12px; padding-bottom:16px; border-bottom:1px solid var(--line); }
#wa-east-asia .drawer-content-section{ margin:15px 0; }
#wa-east-asia .drawer-link{ width:100%; display:grid; grid-template-columns:auto 1fr auto; gap:11px; align-items:center; padding:11px; border:0; border-radius:12px; background:transparent; text-align:left; cursor:pointer; }
#wa-east-asia .drawer-link:hover, #wa-east-asia .drawer-link.current{ background:var(--paper); }
#wa-east-asia .drawer-index{ width:28px; height:28px; display:grid; place-items:center; border-radius:50%; border:1px solid var(--line); font-size:.78rem; }
#wa-east-asia .drawer-link.visited .drawer-index{ background:var(--accent-dark); color:white; border-color:var(--accent-dark); }
#wa-east-asia .drawer-section-title{ margin-top:20px; padding:0 10px 6px; color:var(--accent-dark); font-size:.72rem; font-weight:900; letter-spacing:.13em; text-transform:uppercase; }
#wa-east-asia .drawer-actions{ display:grid; gap:10px; margin-top:24px; padding-top:20px; border-top:1px solid var(--line); }
#wa-east-asia .toast{ position:fixed; left:50%; bottom:95px; z-index:90; transform:translate(-50%,20px); opacity:0; pointer-events:none; max-width:min(540px,90vw); padding:13px 17px; border-radius:999px; background:#292721; color:white; box-shadow:var(--shadow); transition:opacity .2s ease, transform .2s ease; text-align:center; }
#wa-east-asia .toast.show{ opacity:1; transform:translate(-50%,0); }
#wa-east-asia .glossary-backdrop{
  position: fixed;
  inset: 0;
  z-index: 94;
  background: rgba(37,35,31,.38);
  backdrop-filter: blur(2px);
}
#wa-east-asia.glossary-modal-open{ overflow: hidden; }
#wa-east-asia .glossary-popover{
  position: fixed;
  z-index: 95;
  width: min(420px, calc(100vw - 28px));
  max-height: calc(100vh - var(--header-h) - var(--footer-h) - 28px);
  padding: 0;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: var(--card);
  box-shadow: 0 24px 70px rgba(57,49,35,.25);
  overflow: auto;
  overscroll-behavior: contain;
}
#wa-east-asia .glossary-card-head{
  position: sticky;
  top: 0;
  z-index: 2;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  padding: 17px 18px 13px;
  border-bottom: 1px solid var(--line);
  background: color-mix(in srgb, var(--card) 95%, var(--paper));
}
#wa-east-asia .glossary-kicker{
  display: block;
  margin-bottom: 2px;
  color: var(--accent-dark);
  font-size: .7rem;
  font-weight: 850;
  letter-spacing: .13em;
  text-transform: uppercase;
}
#wa-east-asia .glossary-popover h3{
  margin: 0;
  color: var(--accent-dark);
  font-family: "Cormorant", Georgia, "Times New Roman", serif;
  font-size: clamp(1.65rem, 3vw, 2.15rem);
  line-height: 1.05;
  text-transform: none;
}
#wa-east-asia .glossary-close{
  flex: 0 0 auto;
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  padding: 0;
  border: 1px solid var(--line);
  border-radius: 50%;
  background: var(--paper);
  color: var(--ink);
  cursor: pointer;
  font-size: 1.45rem;
  line-height: 1;
}
#wa-east-asia .glossary-card-body{ padding: 18px; }
#wa-east-asia .glossary-definition{
  margin: 0;
  color: var(--ink);
  font-size: 1.02rem;
  line-height: 1.65;
}
#wa-east-asia .glossary-visual-toggle{
  width: 100%;
  margin-top: 17px;
}
#wa-east-asia .glossary-visual{
  margin: 16px 0 0;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 15px;
  background: var(--paper);
}
#wa-east-asia .glossary-visual img{
  width: 100%;
  height: auto;
  max-height: 390px;
  object-fit: contain;
  background: var(--paper-deep);
}
#wa-east-asia .glossary-visual figcaption{
  padding: 10px 13px 12px;
  color: var(--muted);
  font-size: .78rem;
  line-height: 1.45;
  text-align: left;
}
#wa-east-asia .glossary-popover.mode-side{
  top: calc(var(--header-h) + 14px + env(safe-area-inset-top, 0px));
  right: max(16px, env(safe-area-inset-right, 0px));
  bottom: calc(var(--footer-h) + 14px + env(safe-area-inset-bottom, 0px));
  left: auto;
  width: min(400px, calc(100vw - 32px));
  max-height: none;
}
#wa-east-asia .glossary-popover.mode-sheet{
  inset: auto 0 0 0;
  width: 100%;
  max-height: min(82vh, 760px);
  border-width: 1px 0 0;
  border-radius: 24px 24px 0 0;
  padding-bottom: max(10px, env(safe-area-inset-bottom, 0px));
  animation: glossary-sheet-in .2s ease both;
}
#wa-east-asia .glossary-popover.mode-sheet .glossary-card-head{
  padding-top: 19px;
}
#wa-east-asia .glossary-popover.mode-sheet .glossary-visual img{
  max-height: 46vh;
}
@keyframes glossary-sheet-in{
  from { transform: translateY(20px); opacity: 0; }
  to { transform: translateY(0); opacity: 1; }
}
#wa-east-asia .noscript{ padding:20px; background:var(--danger-soft); color:var(--danger); text-align:center; font-weight:800; }
@media (max-width: 980px){#wa-east-asia .toc-grid, #wa-east-asia .exercise-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); }
#wa-east-asia .flashcard-grid, #wa-east-asia .flashcard-grid.six-cards{ grid-template-columns:repeat(2,minmax(0,1fr)); }
#wa-east-asia .garden-layout, #wa-east-asia .results-grid, #wa-east-asia .game-hero, #wa-east-asia .word-search-wrap{ grid-template-columns:1fr; }
#wa-east-asia .garden-overview{ grid-template-columns:repeat(5,minmax(0,1fr)); }}
@media (min-width: 701px) and (max-width: 980px){#wa-east-asia .story-layout{
    grid-template-columns: minmax(0,1.35fr) minmax(220px,.68fr);
    gap:18px;
  }
#wa-east-asia .story-copy{ padding:24px; }
#wa-east-asia .story-toolbar{ align-items:flex-start; gap:12px; }
#wa-east-asia .story-toolbar > div:first-child{ min-width:0; }
#wa-east-asia .story-toolbar .button-row{ flex:0 0 auto; gap:5px; }
#wa-east-asia .story-toolbar .button{ min-height:40px; padding:8px 12px; }
#wa-east-asia .story-audio-player{ padding:13px; }
#wa-east-asia .story-audio-controls{ gap:6px; }
#wa-east-asia .story-audio-controls .button{ min-height:42px; padding:8px 11px; }
#wa-east-asia .story-audio-speed-label{ flex:1 1 150px; justify-content:space-between; }
#wa-east-asia .story-audio-progress-row{ grid-template-columns:1fr; gap:2px; }
#wa-east-asia .story-audio-time{ justify-self:start; text-align:left; }
#wa-east-asia .story-text{ font-size:1rem; line-height:1.72; }
#wa-east-asia .story-images{ grid-template-columns:1fr; gap:16px; min-width:0; }
#wa-east-asia .story-image-main{ border-radius:15px; }
#wa-east-asia .story-image-frame figcaption{ font-size:.74rem; }}
@media (max-width: 700px){#wa-east-asia .story-layout{ grid-template-columns:1fr; }
#wa-east-asia .story-images{ grid-template-columns:minmax(0,520px); justify-content:center; }}
@media (max-width: 680px){#wa-east-asia{ --header-h:72px; --footer-h:70px; }
#wa-east-asia .course-header{ grid-template-columns:auto minmax(0,1fr) auto; gap:10px; padding-inline:12px; }
#wa-east-asia .header-status .learner-label{ display:none; }
#wa-east-asia .course-main{ padding:22px 12px; }
#wa-east-asia .course-footer{ grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,1fr); gap:4px; padding:9px 8px; max-width:100vw; overflow:hidden; }
#wa-east-asia .course-footer .screen-label{ display:none; }
#wa-east-asia .course-footer #home-button{ order:2; }
#wa-east-asia .course-footer #next-button{ order:3; }
#wa-east-asia .nav-button{ width:100%; min-width:0; padding-inline:6px; font-size:.88rem; }
#wa-east-asia .toc-grid, #wa-east-asia .exercise-grid, #wa-east-asia .glossary-grid, #wa-east-asia .multi-grid, #wa-east-asia .sentence-practice-grid{ grid-template-columns:1fr; }
#wa-east-asia .multi-sentence, #wa-east-asia .game-sentence{ padding:15px; }
#wa-east-asia .model-answer-body{ padding:16px; }
#wa-east-asia .model-answer-copy{ padding:14px; }
#wa-east-asia .flashcard-grid, #wa-east-asia .flashcard-grid.six-cards{ grid-template-columns:1fr; }
#wa-east-asia .flashcard, #wa-east-asia .flashcard-inner{ min-height:420px; height:420px; }
#wa-east-asia .flashcard-front img{ height:315px; }
#wa-east-asia .content-card{ padding:22px 17px; }
#wa-east-asia .story-audio-player{ padding:13px 12px; margin-bottom:20px; }
#wa-east-asia .story-audio-controls{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); }
#wa-east-asia .story-audio-controls .button{ width:100%; min-width:0; padding-inline:8px; }
#wa-east-asia .story-audio-play{ min-width:0; }
#wa-east-asia .story-audio-speed-label{ grid-column:1 / -1; width:100%; justify-content:space-between; border-radius:14px; }
#wa-east-asia .story-audio-progress-row{ grid-template-columns:1fr; gap:0; }
#wa-east-asia .story-audio-time{ justify-self:start; text-align:left; }
#wa-east-asia .title-screen, #wa-east-asia .section-screen{ min-height:calc(100vh - 190px); }
#wa-east-asia .garden-overview{ grid-template-columns:repeat(2,minmax(0,1fr)); }
#wa-east-asia .word-search{ grid-template-columns:repeat(14,minmax(18px,1fr)); gap:2px; }
#wa-east-asia .letter-cell{ border-radius:3px; font-size:.64rem; }
#wa-east-asia .certificate{ padding:50px 22px; }
#wa-east-asia .certificate-meta{ flex-direction:column; }
#wa-east-asia .learner-label{ display:none; }}
@media (max-width: 360px){#wa-east-asia .word-search{ grid-template-columns:repeat(14,minmax(0,1fr)); width:100%; min-width:0; gap:2px; }
#wa-east-asia .letter-cell{ min-width:0; width:auto; }}
@media (prefers-reduced-motion: reduce){#wa-east-asia *, #wa-east-asia *::before, #wa-east-asia *::after{ scroll-behavior:auto !important; animation-duration:.001ms !important; transition-duration:.001ms !important; }}
@media print{#wa-east-asia{ background:white; }
#wa-east-asia .course-header, #wa-east-asia .course-footer, #wa-east-asia .button-row, #wa-east-asia .toc-drawer, #wa-east-asia .drawer-backdrop, #wa-east-asia .toast, #wa-east-asia .glossary-backdrop, #wa-east-asia .glossary-popover{ display:none !important; }
#wa-east-asia .course-main{ width:100%; padding:0; }
#wa-east-asia .certificate-wrap, #wa-east-asia .certificate{ box-shadow:none; border-color:#756c52; }
#wa-east-asia .certificate{ min-height:95vh; page-break-inside:avoid; }
#wa-east-asia .certificate-lock{ display:none !important; }}
#wa-east-asia .story-layout.no-story-images{
  grid-template-columns: minmax(0, 1fr);
  width: min(980px, 100%);
  margin-inline: auto;
}
#wa-east-asia .story-layout.no-story-images .story-copy{ min-width: 0; }
#wa-east-asia .completion-list{
  display: grid;
  gap: 20px;
  margin-top: 24px;
}
#wa-east-asia .completion-list-item{
  padding: clamp(18px, 2.5vw, 28px);
  border: 1px solid var(--line);
  border-radius: 18px;
  background: white;
}
#wa-east-asia .completion-list-item.correct{
  border-color: var(--success);
  background: var(--success-soft);
}
#wa-east-asia .completion-list-item.incorrect{
  border-color: var(--danger);
}
#wa-east-asia .completion-list-item .sentence-frame{ margin-top: 12px; }
#wa-east-asia .completion-list-item .button-row{ margin-bottom: 0; }
@media (max-width: 680px){#wa-east-asia .completion-list-item{ padding: 16px; }}
#wa-east-asia .glossary-helper-actions{ padding: 0 18px 14px; }
#wa-east-asia .glossary-helper-visual-toggle{ width: 100%; justify-content: center; }
#wa-east-asia .glossary-helper-visual{
  margin: 0 18px 18px;
  max-width: none;
  border-radius: 14px;
  overflow: hidden;
  background: var(--paper);
}
#wa-east-asia .glossary-helper-visual img{
  display: block;
  width: 100%;
  max-height: 360px;
  object-fit: contain;
  background: var(--paper);
}
#wa-east-asia .glossary-helper-visual figcaption{ padding: 10px 12px 12px; }
@media (max-width: 700px){#wa-east-asia .glossary-helper-visual img{ max-height: 300px; }}
#wa-east-asia .assessment-card{ max-width: 980px; margin: 0 auto; }
#wa-east-asia .assessment-heading{ display:flex; align-items:flex-start; justify-content:space-between; gap:24px; }
#wa-east-asia .assessment-count{ min-width:128px; display:grid; justify-items:center; padding:12px 16px; border:1px solid var(--line); border-radius:16px; background:var(--paper); }
#wa-east-asia .assessment-count strong{ font-family:"Cormorant",Georgia,"Times New Roman",serif; color:var(--accent-dark); font-size:2rem; line-height:1; }
#wa-east-asia .assessment-count span{ margin-top:4px; color:var(--muted); font-size:.78rem; font-weight:750; }
#wa-east-asia .assessment-progress-meta{ display:flex; justify-content:space-between; gap:18px; margin-top:24px; color:var(--muted); font-size:.86rem; font-weight:750; }
#wa-east-asia .assessment-progress-track{ height:8px; margin-top:8px; border-radius:999px; background:var(--accent-soft); overflow:hidden; }
#wa-east-asia .assessment-progress-track span{ display:block; height:100%; border-radius:inherit; background:var(--accent-dark); transition:width .24s ease; }
#wa-east-asia .assessment-jump-grid{ display:grid; grid-template-columns:repeat(12,minmax(34px,1fr)); gap:7px; margin:20px 0; }
#wa-east-asia .assessment-jump{ min-height:38px; border:1px solid var(--line); border-radius:10px; background:var(--card); color:var(--muted); cursor:pointer; font-weight:850; }
#wa-east-asia .assessment-jump:hover{ border-color:var(--accent); }
#wa-east-asia .assessment-jump.answered{ background:var(--paper-deep); color:var(--accent-dark); }
#wa-east-asia .assessment-jump.current{ border-color:var(--accent-dark); box-shadow:0 0 0 2px color-mix(in srgb,var(--accent-dark) 18%,transparent); }
#wa-east-asia .assessment-jump.locked-correct{ background:var(--success-soft); border-color:color-mix(in srgb,var(--success) 45%,var(--line)); color:var(--success); }
#wa-east-asia .assessment-question-shell{ padding:clamp(20px,3vw,32px); border:1px solid var(--line); border-radius:20px; background:var(--paper); }
#wa-east-asia .assessment-question-title{ margin:9px 0 22px; font-size:clamp(1.35rem,2.5vw,2rem); }
#wa-east-asia .assessment-context{ margin-bottom:22px; padding:18px 20px; border-left:4px solid var(--accent); border-radius:0 14px 14px 0; background:var(--card); }
#wa-east-asia .assessment-context p{ margin:8px 0 0; line-height:1.75; }
#wa-east-asia .assessment-options .option-label.selected{ border-color:var(--accent-dark); background:color-mix(in srgb,var(--accent-soft) 46%,var(--card)); }
#wa-east-asia .assessment-actions{ display:flex; flex-wrap:wrap; gap:12px; margin-top:22px; }
#wa-east-asia .assessment-actions .button.primary{ margin-left:auto; }
#wa-east-asia .assessment-submit-note{ margin:12px 0 0; color:var(--muted); font-size:.88rem; }
#wa-east-asia .assessment-submit-note.ready{ color:var(--success); font-weight:750; }
#wa-east-asia .assessment-result-grid{ display:grid; grid-template-columns:minmax(230px,.6fr) minmax(0,1.4fr); gap:28px; align-items:center; margin-top:26px; }
#wa-east-asia .assessment-score-ring{ width:min(250px,65vw); }
#wa-east-asia .assessment-score-caption{ margin:14px 0 0; text-align:center; color:var(--muted); font-weight:800; }
#wa-east-asia .assessment-status{ display:flex; align-items:flex-start; gap:14px; padding:18px; border:1px solid var(--line); border-radius:16px; background:var(--paper); }
#wa-east-asia .assessment-status.success{ border-color:color-mix(in srgb,var(--success) 40%,var(--line)); background:var(--success-soft); }
#wa-east-asia .assessment-status.warning{ border-color:color-mix(in srgb,var(--danger) 34%,var(--line)); background:var(--danger-soft); }
#wa-east-asia .assessment-status.guidance{ border-color:var(--accent); background:var(--paper-deep); }
#wa-east-asia .assessment-status-icon{ width:34px; height:34px; flex:0 0 auto; display:grid; place-items:center; border-radius:50%; background:var(--accent-dark); color:white; font-weight:900; }
#wa-east-asia .assessment-status.success .assessment-status-icon{ background:var(--success); }
#wa-east-asia .assessment-status.warning .assessment-status-icon{ background:var(--danger); }
#wa-east-asia .assessment-status p{ margin:5px 0 0; color:var(--muted); }
#wa-east-asia .assessment-summary-list{ display:grid; gap:9px; margin-top:15px; }
#wa-east-asia .assessment-summary-list > div{ display:grid; grid-template-columns:1fr auto; gap:14px; padding:12px 14px; border:1px solid var(--line); border-radius:12px; background:var(--card); }
#wa-east-asia .assessment-review-title{ margin-top:30px; }
#wa-east-asia .assessment-review-list{ display:grid; gap:10px; margin-top:14px; }
#wa-east-asia .assessment-review-item{ border:1px solid var(--line); border-radius:14px; background:var(--card); overflow:hidden; }
#wa-east-asia .assessment-review-item summary{ display:flex; justify-content:space-between; gap:14px; padding:14px 16px; cursor:pointer; list-style:none; }
#wa-east-asia .assessment-review-item summary::-webkit-details-marker{ display:none; }
#wa-east-asia .assessment-review-item.incorrect summary strong{ color:var(--danger); }
#wa-east-asia .assessment-review-item.correct summary strong{ color:var(--success); }
#wa-east-asia .assessment-review-body{ padding:0 16px 16px; border-top:1px solid var(--line); }
#wa-east-asia .assessment-review-body > p:first-child{ margin-top:14px; font-weight:750; }
#wa-east-asia .assessment-answer-line{ display:grid; grid-template-columns:minmax(110px,.35fr) 1fr; gap:12px; padding:10px 0; border-top:1px solid var(--line); }
#wa-east-asia .assessment-answer-line span{ color:var(--muted); }
#wa-east-asia .assessment-summary-cards{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; margin-top:14px; }
#wa-east-asia .assessment-summary-card{ padding:20px; border:1px solid var(--line); border-radius:16px; background:var(--paper); }
#wa-east-asia .assessment-summary-card.complete{ border-color:color-mix(in srgb,var(--success) 42%,var(--line)); background:var(--success-soft); }
#wa-east-asia .assessment-summary-card > strong{ display:block; margin:10px 0 4px; color:var(--accent-dark); font-family:"Cormorant",Georgia,"Times New Roman",serif; font-size:2rem; }
#wa-east-asia .assessment-summary-card p{ margin:0; color:var(--muted); }
#wa-east-asia .drawer-link.locked{ opacity:.48; cursor:not-allowed; }
#wa-east-asia .drawer-link.locked:hover{ background:transparent; }
#wa-east-asia .certificate-meta-three{ max-width:860px; }
#wa-east-asia .certificate-requirements{ margin:16px auto 0; padding-left:22px; text-align:left; color:var(--muted); }
#wa-east-asia .certificate-requirements li{ margin:8px 0; }
@media (max-width: 980px){#wa-east-asia .assessment-result-grid{ grid-template-columns:1fr; }
#wa-east-asia .assessment-summary-cards{ grid-template-columns:1fr; }}
@media (max-width: 700px){#wa-east-asia .assessment-heading{ flex-direction:column; }
#wa-east-asia .assessment-count{ min-width:0; width:100%; grid-template-columns:auto 1fr; justify-items:start; align-items:center; gap:10px; }
#wa-east-asia .assessment-count strong{ font-size:1.6rem; }
#wa-east-asia .assessment-progress-meta{ flex-direction:column; gap:3px; }
#wa-east-asia .assessment-jump-grid{ grid-template-columns:repeat(6,minmax(0,1fr)); }
#wa-east-asia .assessment-actions{ display:grid; grid-template-columns:1fr 1fr; }
#wa-east-asia .assessment-actions .button{ width:100%; }
#wa-east-asia .assessment-actions .button.primary{ grid-column:1 / -1; margin-left:0; }
#wa-east-asia .assessment-answer-line{ grid-template-columns:1fr; gap:3px; }}
@media (max-width: 390px){#wa-east-asia .assessment-jump-grid{ grid-template-columns:repeat(4,minmax(0,1fr)); }
#wa-east-asia .assessment-actions{ grid-template-columns:1fr; }
#wa-east-asia .assessment-actions .button.primary{ grid-column:auto; }}
#wa-east-asia .title-course-subtitle{
  max-width: 720px;
  margin: 0 auto;
  color: var(--muted);
  font-family: "Inter", ui-sans-serif, system-ui, sans-serif;
  font-size: clamp(1rem, 2.2vw, 1.28rem);
  line-height: 1.6;
}
#wa-east-asia .title-continue{ margin-top: 30px; }
#wa-east-asia .name-entry-card{ text-align: left; }
#wa-east-asia .name-entry-card > h1{ margin: 6px 0 12px; }
#wa-east-asia .name-form{ margin-top: 28px; }
#wa-east-asia .toc-card-kicker{
  display: block;
  margin-bottom: 8px;
  color: var(--accent-dark);
  font-size: .7rem;
  font-weight: 900;
  letter-spacing: .12em;
  text-transform: uppercase;
}
#wa-east-asia .toc-card-status{
  margin-top: 12px;
  color: var(--accent-dark);
  font-size: .79rem;
  font-weight: 800;
}
#wa-east-asia .toc-card.is-locked{
  opacity: .48;
  cursor: not-allowed;
  filter: grayscale(.45);
}
#wa-east-asia .toc-card.is-locked:hover{ transform: none; box-shadow: none; }
#wa-east-asia .essential-question-card{
  margin: 28px 0;
  padding: clamp(22px,4vw,38px);
  border: 1px solid var(--line);
  border-left: 6px solid var(--accent);
  border-radius: 20px;
  background: var(--paper);
}
#wa-east-asia .essential-question-card > span{
  display: block;
  margin-bottom: 8px;
  color: var(--accent-dark);
  font-size: .76rem;
  font-weight: 900;
  letter-spacing: .13em;
  text-transform: uppercase;
}
#wa-east-asia .essential-question-card h2{ font-size: clamp(1.8rem,4vw,3.15rem); }
#wa-east-asia .overview-hero{
  margin: 28px 0;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 20px;
  background: var(--paper);
}
#wa-east-asia .overview-hero img{
  width: 100%;
  aspect-ratio: 16 / 6;
  object-fit: cover;
}
#wa-east-asia .overview-hero figcaption, #wa-east-asia .timeline-preview figcaption{
  padding: 10px 14px;
  color: var(--muted);
  font-size: .84rem;
  text-align: center;
}
#wa-east-asia .overview-lessons{
  display: grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap: 16px;
  margin: 30px 0;
}
#wa-east-asia .overview-lesson{
  position: relative;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: var(--card);
}
#wa-east-asia .overview-lesson img{
  width: 100%;
  height: 170px;
  object-fit: cover;
  border-bottom: 1px solid var(--line);
}
#wa-east-asia .overview-lesson > div:last-child{ padding: 18px; }
#wa-east-asia .overview-lesson h3{ margin-bottom: 8px; }
#wa-east-asia .overview-lesson p{ margin: 0; color: var(--muted); font-size: .9rem; }
#wa-east-asia .lesson-number{
  position: absolute;
  top: 12px;
  left: 12px;
  z-index: 2;
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: rgba(255,253,248,.94);
  border: 1px solid var(--line);
  color: var(--accent-dark);
  font-weight: 900;
  box-shadow: 0 7px 18px rgba(37,35,31,.14);
}
#wa-east-asia .overview-split{
  display: grid;
  grid-template-columns: minmax(0,1fr) minmax(260px,.6fr);
  gap: 28px;
  align-items: start;
  margin-top: 30px;
}
#wa-east-asia .learning-list{
  display: grid;
  gap: 12px;
  margin: 20px 0 0;
  padding: 0;
  list-style: none;
}
#wa-east-asia .learning-list li{
  position: relative;
  padding: 14px 16px 14px 48px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--paper);
}
#wa-east-asia .learning-list li::before{
  content: "✓";
  position: absolute;
  left: 15px;
  top: 13px;
  width: 24px;
  height: 24px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: var(--accent-soft);
  color: var(--accent-dark);
  font-weight: 900;
}
#wa-east-asia .timeline-preview{
  margin: 0;
  max-height: 650px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: var(--paper);
}
#wa-east-asia .timeline-preview img{
  width: 100%;
  max-height: 560px;
  object-fit: cover;
  object-position: top;
}
#wa-east-asia .flashcard-progress-note{
  display: inline-flex;
  gap: 5px;
  margin-top: 18px;
  padding: 8px 12px;
  border-radius: 999px;
  background: var(--paper-deep);
  color: var(--muted);
  font-size: .84rem;
}
#wa-east-asia .flashcard-progress-note strong{ color: var(--accent-dark); }
#wa-east-asia .flashcard-grid, #wa-east-asia .flashcard-grid.six-cards, #wa-east-asia .flashcard-grid.many-cards{
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap: 18px;
}
#wa-east-asia .flashcard{
  min-height: 390px;
  height: 410px;
}
#wa-east-asia .flashcard-inner{ min-height: 390px; }
#wa-east-asia .flashcard-front img{ height: 275px; object-fit: cover; }
#wa-east-asia .flashcard-word{
  padding: 14px 12px 4px;
  font-size: clamp(1.22rem,2.1vw,1.6rem);
}
#wa-east-asia .flashcard-hint{
  display: block;
  padding: 0 12px 14px;
  margin-top: 7px;
  font-size: .78rem;
}
#wa-east-asia .flashcard-back{
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 25px;
  text-align: center;
}
#wa-east-asia .flashcard-back-label{
  color: var(--accent-dark);
  font-size: .7rem;
  font-weight: 900;
  letter-spacing: .13em;
  text-transform: uppercase;
}
#wa-east-asia .flashcard-back h3{
  margin: 10px 0 15px;
  font-size: clamp(1.5rem,2.8vw,2.1rem);
}
#wa-east-asia .flashcard-back p{ color: var(--muted); }
#wa-east-asia .flashcard.seen .flashcard-face{ border-color: color-mix(in srgb,var(--success) 35%,var(--line)); }
#wa-east-asia .scenario-card{
  margin: 25px 0;
  padding: clamp(20px,3vw,30px);
  border: 1px solid var(--line);
  border-left: 5px solid var(--accent);
  border-radius: 18px;
  background: var(--paper);
}
#wa-east-asia .scenario-card > span{
  display: block;
  color: var(--accent-dark);
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}
#wa-east-asia .scenario-card p{ margin: 10px 0; }
#wa-east-asia .scenario-card strong{
  display: block;
  color: var(--accent-dark);
  font-family: "Cormorant", Georgia, serif;
  font-size: 1.35rem;
}
#wa-east-asia .story-copy{
  padding: 0;
}
#wa-east-asia .story-block{
  padding: clamp(21px,3vw,34px);
  border: 1px solid var(--line);
  border-radius: 18px;
  background: var(--paper);
}
#wa-east-asia .story-block + .story-block{ margin-top: 16px; }
#wa-east-asia .story-block h2{
  margin-bottom: 13px;
  color: var(--accent-dark);
  font-size: clamp(1.45rem,2.8vw,2.1rem);
}
#wa-east-asia .story-block p{
  font-family: "Inter", ui-sans-serif, system-ui, sans-serif;
  font-size: clamp(.98rem,1.45vw,1.11rem);
  line-height: 1.82;
}
#wa-east-asia .story-block p:last-child{ margin-bottom: 0; }
#wa-east-asia .glossary-term{
  display: inline;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--accent-dark);
  font: inherit;
  font-weight: 800;
  text-decoration: underline dotted;
  text-underline-offset: 3px;
  cursor: pointer;
}
#wa-east-asia .story-images{ position: sticky; top: calc(var(--header-h) + 22px); }
#wa-east-asia .zoom-image-button{
  position: relative;
  display: block;
  width: 100%;
  padding: 0;
  border: 0;
  border-radius: inherit;
  background: transparent;
  cursor: zoom-in;
  overflow: hidden;
}
#wa-east-asia .zoom-image-button img{ transition: transform .2s ease; }
#wa-east-asia .zoom-image-button:hover img{ transform: scale(1.012); }
#wa-east-asia .zoom-badge{
  position: absolute;
  right: 12px;
  bottom: 12px;
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(255,255,255,.75);
  border-radius: 50%;
  background: rgba(37,35,31,.72);
  color: white;
  font-size: 1.15rem;
  box-shadow: 0 6px 16px rgba(0,0,0,.2);
}
#wa-east-asia .source-note{
  margin-top: 24px;
  padding: 14px 17px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--paper);
  color: var(--muted);
  font-size: .84rem;
}
#wa-east-asia .source-note strong{ color: var(--ink); }
#wa-east-asia .rationale-list{
  display: grid;
  gap: 10px;
  margin-top: 18px;
}
#wa-east-asia .rationale-item{
  display: grid;
  grid-template-columns: 36px minmax(0,1fr);
  gap: 12px;
  padding: 13px 15px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--card);
}
#wa-east-asia .rationale-item.is-correct{
  border-color: color-mix(in srgb,var(--success) 42%,var(--line));
  background: color-mix(in srgb,var(--success-soft) 62%,var(--card));
}
#wa-east-asia .rationale-item.is-wrong.is-selected{
  border-color: color-mix(in srgb,var(--danger) 46%,var(--line));
  background: var(--danger-soft);
}
#wa-east-asia .rationale-letter{
  width: 32px;
  height: 32px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: var(--paper-deep);
  color: var(--accent-dark);
  font-weight: 900;
}
#wa-east-asia .rationale-item.is-correct .rationale-letter{ background: var(--success); color: white; }
#wa-east-asia .rationale-item.is-wrong.is-selected .rationale-letter{ background: var(--danger); color: white; }
#wa-east-asia .rationale-item strong{ display: block; margin-bottom: 3px; }
#wa-east-asia .rationale-item p{ margin: 0; color: var(--muted); font-size: .9rem; }
#wa-east-asia .order-list{
  display: grid;
  gap: 11px;
  margin: 28px 0 0;
  padding: 0;
  list-style: none;
}
#wa-east-asia .order-item{
  display: grid;
  grid-template-columns: 44px minmax(0,1fr) auto;
  gap: 14px;
  align-items: center;
  padding: 14px 16px;
  border: 1px solid var(--line);
  border-radius: 15px;
  background: var(--card);
  box-shadow: 0 6px 16px rgba(57,49,35,.05);
}
#wa-east-asia .order-position{
  width: 36px;
  height: 36px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: var(--accent-dark);
  color: white;
  font-weight: 900;
}
#wa-east-asia .order-copy{ display: grid; gap: 2px; }
#wa-east-asia .order-copy strong{ font-size: 1rem; }
#wa-east-asia .order-copy span{ color: var(--muted); font-size: .84rem; }
#wa-east-asia .order-controls{ display: flex; gap: 6px; }
#wa-east-asia .order-button{
  width: 42px;
  height: 42px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--paper);
  color: var(--accent-dark);
  cursor: pointer;
  font-size: 1.1rem;
  font-weight: 900;
}
#wa-east-asia .order-button:hover{ border-color: var(--accent); background: var(--paper-deep); }
#wa-east-asia .order-button:disabled{ opacity: .34; cursor: not-allowed; }
#wa-east-asia .match-workspace{
  display: grid;
  grid-template-columns: minmax(0,1.15fr) minmax(280px,.85fr);
  gap: 22px;
  align-items: start;
  margin-top: 25px;
}
#wa-east-asia .match-prompts{ display: grid; gap: 11px; }
#wa-east-asia .match-prompt-card{
  display: grid;
  gap: 4px;
  width: 100%;
  padding: 16px 18px;
  border: 1px solid var(--line);
  border-radius: 15px;
  background: var(--card);
  text-align: left;
  cursor: pointer;
}
#wa-east-asia .match-prompt-card:hover, #wa-east-asia .match-prompt-card.active{ border-color: var(--accent-dark); background: var(--paper); }
#wa-east-asia .match-prompt-card.correct{ border-color: var(--success); background: var(--success-soft); }
#wa-east-asia .match-prompt-card.incorrect{ border-color: var(--danger); background: var(--danger-soft); }
#wa-east-asia .match-prompt-label{ font-weight: 900; }
#wa-east-asia .match-assignment{ color: var(--muted); font-size: .88rem; }
#wa-east-asia .match-row-feedback{
  margin-top: 6px;
  color: var(--accent-dark);
  font-size: .82rem;
  font-weight: 800;
}
#wa-east-asia .match-prompt-card.correct .match-row-feedback{ color: var(--success); }
#wa-east-asia .match-prompt-card.incorrect .match-row-feedback{ color: var(--danger); }
#wa-east-asia .match-bank{
  position: sticky;
  top: calc(var(--header-h) + 22px);
  padding: 20px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: var(--paper);
}
#wa-east-asia .match-bank h2{ font-size: 1.55rem; }
#wa-east-asia .match-bank > p{ color: var(--muted); font-size: .86rem; }
#wa-east-asia .match-bank-list{ display: grid; gap: 8px; }
#wa-east-asia .match-bank-button{
  width: 100%;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--card);
  text-align: left;
  cursor: pointer;
}
#wa-east-asia .match-bank-button:hover{ border-color: var(--accent-dark); background: var(--paper-deep); }
#wa-east-asia .match-bank-button.used{
  border-style: dashed;
  color: var(--muted);
}
#wa-east-asia .match-bank-button:disabled{ opacity: .55; cursor: not-allowed; }
#wa-east-asia .hotspot-layout{
  display: grid;
  grid-template-columns: minmax(0,1.6fr) minmax(250px,.55fr);
  gap: 20px;
  align-items: start;
  margin-top: 26px;
}
#wa-east-asia .hotspot-figure{
  position: relative;
  margin: 0;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 19px;
  background: var(--paper-deep);
  box-shadow: var(--shadow);
}
#wa-east-asia .hotspot-figure > img{ width: 100%; height: auto; }
#wa-east-asia .hotspot-marker{
  position: absolute;
  transform: translate(-50%,-50%);
  width: clamp(36px,4.5vw,50px);
  height: clamp(36px,4.5vw,50px);
  display: grid;
  place-items: center;
  padding: 0;
  border: 3px solid white;
  border-radius: 50%;
  background: var(--accent-dark);
  color: white;
  box-shadow: 0 0 0 4px rgba(102,94,72,.25), 0 8px 22px rgba(0,0,0,.25);
  cursor: pointer;
  font-weight: 900;
  animation: hotspot-pulse 2.3s ease-in-out infinite;
}
#wa-east-asia .hotspot-marker.found{
  background: var(--success);
  animation: none;
}
@keyframes hotspot-pulse{
  0%,100% { box-shadow: 0 0 0 4px rgba(102,94,72,.22), 0 8px 22px rgba(0,0,0,.25); }
  50% { box-shadow: 0 0 0 10px rgba(102,94,72,.08), 0 8px 22px rgba(0,0,0,.25); }
}
#wa-east-asia .image-corner-zoom{
  position: absolute;
  right: 10px;
  bottom: 10px;
  min-height: 38px;
  padding: 7px 12px;
  border: 1px solid rgba(255,255,255,.65);
  border-radius: 999px;
  background: rgba(37,35,31,.76);
  color: white;
  cursor: zoom-in;
  font-weight: 800;
}
#wa-east-asia .hotspot-panel{
  min-height: 250px;
  padding: 20px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: var(--paper);
}
#wa-east-asia .hotspot-progress{
  padding-bottom: 13px;
  border-bottom: 1px solid var(--line);
  color: var(--muted);
  font-size: .86rem;
}
#wa-east-asia .hotspot-progress strong{ color: var(--accent-dark); }
#wa-east-asia .hotspot-detail > span{
  display: block;
  margin-top: 17px;
  color: var(--accent-dark);
  font-size: .72rem;
  font-weight: 900;
  letter-spacing: .12em;
  text-transform: uppercase;
}
#wa-east-asia .hotspot-detail h2{ margin: 6px 0 9px; }
#wa-east-asia .hotspot-detail p{ color: var(--muted); }
#wa-east-asia .hotspot-empty{
  min-height: 180px;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 10px;
  color: var(--muted);
  text-align: center;
}
#wa-east-asia .hotspot-empty > span{ font-size: 2rem; color: var(--accent); }
#wa-east-asia .hotspot-question{
  max-width: none;
  margin-top: 28px;
  padding: clamp(20px,3vw,30px);
  border: 1px solid var(--line);
  border-radius: 19px;
  background: var(--paper);
}
#wa-east-asia .multi-select-grid{
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 12px;
}
#wa-east-asia .multi-select-option{
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 12px;
  align-items: start;
  padding: 15px 17px;
  border: 1px solid var(--line);
  border-radius: 15px;
  background: var(--card);
  cursor: pointer;
}
#wa-east-asia .multi-select-option:hover{ border-color: var(--accent); }
#wa-east-asia .multi-select-option.selected{ border-color: var(--accent-dark); background: var(--paper-deep); }
#wa-east-asia .multi-select-option.correct{ border-color: var(--success); background: var(--success-soft); }
#wa-east-asia .multi-select-option.incorrect{ border-color: var(--danger); background: var(--danger-soft); }
#wa-east-asia .multi-select-option.missed{ border: 2px dashed var(--success); }
#wa-east-asia .multi-select-option input{
  width: 19px;
  height: 19px;
  margin-top: 2px;
  accent-color: var(--accent-dark);
}
#wa-east-asia .source-grid{
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 17px;
  margin: 28px 0;
}
#wa-east-asia .source-card{
  padding: clamp(20px,3vw,28px);
  border: 1px solid var(--line);
  border-top: 5px solid var(--accent);
  border-radius: 18px;
  background: var(--paper);
}
#wa-east-asia .source-card > span{
  color: var(--accent-dark);
  font-size: .76rem;
  font-weight: 900;
  letter-spacing: .1em;
  text-transform: uppercase;
}
#wa-east-asia .source-card blockquote{
  margin: 16px 0;
  font-family: "Cormorant", Georgia, serif;
  font-size: clamp(1.25rem,2.4vw,1.7rem);
  line-height: 1.48;
}
#wa-east-asia .source-card > p{ margin: 0; color: var(--muted); font-size: .8rem; }
#wa-east-asia .source-question{
  max-width: none;
  padding: clamp(20px,3vw,30px);
  border: 1px solid var(--line);
  border-radius: 18px;
  background: var(--card);
}
#wa-east-asia .writing-prompt{
  margin: 25px 0;
  padding: 20px;
  border: 1px solid var(--line);
  border-left: 5px solid var(--accent);
  border-radius: 16px;
  background: var(--paper);
}
#wa-east-asia .writing-prompt > strong{
  display: block;
  margin-bottom: 6px;
  color: var(--accent-dark);
  font-size: .75rem;
  letter-spacing: .1em;
  text-transform: uppercase;
}
#wa-east-asia .writing-prompt p{ margin: 0; font-size: 1.08rem; }
#wa-east-asia .writing-checklist{
  margin-top: 22px;
  padding: 20px;
  border: 1px solid var(--line);
  border-radius: 17px;
  background: var(--paper);
}
#wa-east-asia .writing-checklist h2{ font-size: 1.5rem; }
#wa-east-asia .writing-checklist ul{ margin-bottom: 0; }
#wa-east-asia .model-answer > div{ padding: 20px; }
#wa-east-asia .model-answer > div p:last-child{ margin-bottom: 0; }
#wa-east-asia .central-passage{
  margin: 26px 0;
  padding: clamp(22px,3vw,34px);
  border: 1px solid var(--line);
  border-left: 6px solid var(--accent);
  border-radius: 0 18px 18px 0;
  background: var(--paper);
  font-family: "Cormorant", Georgia, serif;
  font-size: clamp(1.24rem,2.2vw,1.65rem);
  line-height: 1.62;
}
#wa-east-asia .central-question-grid{ display: grid; gap: 18px; }
#wa-east-asia .central-question{
  padding: clamp(18px,3vw,28px);
  border: 1px solid var(--line);
  border-radius: 18px;
  background: var(--card);
}
#wa-east-asia .central-question.correct{ border-color: var(--success); }
#wa-east-asia .central-question.incorrect{ border-color: var(--danger); }
#wa-east-asia .central-question-number{
  color: var(--accent-dark);
  font-size: .72rem;
  font-weight: 900;
  letter-spacing: .1em;
  text-transform: uppercase;
}
#wa-east-asia .central-question h3{
  margin: 7px 0 17px;
  font-family: "Inter", ui-sans-serif, system-ui, sans-serif;
  font-size: 1.05rem;
  line-height: 1.5;
}
#wa-east-asia .storyboard-grid{
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 16px;
  margin-top: 26px;
}
#wa-east-asia .storyboard-frame, #wa-east-asia .storyboard-summary{
  display: grid;
  gap: 7px;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 17px;
  background: var(--paper);
}
#wa-east-asia .storyboard-frame > span{
  color: var(--accent-dark);
  font-size: .72rem;
  font-weight: 900;
  letter-spacing: .1em;
  text-transform: uppercase;
}
#wa-east-asia .storyboard-frame textarea, #wa-east-asia .storyboard-summary textarea{
  width: 100%;
  min-height: 125px;
  padding: 13px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--card);
  resize: vertical;
}
#wa-east-asia .storyboard-summary{ margin-top: 16px; }
#wa-east-asia .storyboard-summary textarea{ min-height: 180px; }
#wa-east-asia .assessment-locked-note{
  display: inline-flex;
  margin-bottom: 12px;
  padding: 7px 11px;
  border-radius: 999px;
  background: var(--success-soft);
  color: var(--success);
  font-size: .78rem;
  font-weight: 850;
}
#wa-east-asia .assessment-question-shell h2{
  margin: 5px 0 22px;
  font-family: "Cormorant", Georgia, serif;
  font-size: clamp(1.45rem,3vw,2.2rem);
}
#wa-east-asia .assessment-score-ring{
  aspect-ratio: 1;
  margin: 0 auto;
  display: grid;
  place-items: center;
  position: relative;
  border-radius: 50%;
  background: conic-gradient(var(--accent-dark) var(--score-angle), var(--accent-soft) 0);
}
#wa-east-asia .assessment-score-ring::before{
  content: "";
  position: absolute;
  inset: 17px;
  border-radius: 50%;
  background: var(--card);
}
#wa-east-asia .assessment-score-ring > div{
  position: relative;
  display: grid;
  justify-items: center;
  text-align: center;
}
#wa-east-asia .assessment-score-ring strong{
  font-size: 2.6rem;
  line-height: 1;
}
#wa-east-asia .assessment-score-ring span{
  margin-top: 7px;
  color: var(--muted);
  font-size: .76rem;
  font-weight: 800;
}
#wa-east-asia .assessment-review-item summary > span{
  flex: 1;
  color: var(--muted);
  font-size: .86rem;
  text-align: right;
}
#wa-east-asia .assessment-answer-line{
  display: grid;
  grid-template-columns: 125px minmax(0,1fr);
  gap: 12px;
}
#wa-east-asia .assessment-answer-line span{ color: var(--muted); }
#wa-east-asia .assessment-review-body{ padding: 0 16px 18px; }
#wa-east-asia .assessment-review-item.incorrect{ border-color: color-mix(in srgb,var(--danger) 40%,var(--line)); }
#wa-east-asia .assessment-review-item.correct{ border-color: color-mix(in srgb,var(--success) 35%,var(--line)); }
#wa-east-asia .result-assessment-cards{
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 10px;
  margin-top: 18px;
}
#wa-east-asia .result-assessment-cards > div{
  display: grid;
  justify-items: center;
  padding: 13px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--paper);
}
#wa-east-asia .result-assessment-cards span{ color: var(--muted); font-size: .78rem; }
#wa-east-asia .result-assessment-cards strong{ color: var(--accent-dark); }
#wa-east-asia .requirements-panel{
  margin: 22px 0;
  padding: 20px;
  border: 1px solid var(--line);
  border-radius: 17px;
  background: var(--paper);
}
#wa-east-asia .requirements-panel.complete{ border-color: var(--success); background: var(--success-soft); }
#wa-east-asia .requirements-panel ul, #wa-east-asia .certificate-requirements{
  display: grid;
  gap: 9px;
  margin: 14px 0 0;
  padding: 0;
  list-style: none;
}
#wa-east-asia .requirements-panel li, #wa-east-asia .certificate-requirements li{
  position: relative;
  padding-left: 30px;
  color: var(--muted);
}
#wa-east-asia .requirements-panel li::before, #wa-east-asia .certificate-requirements li::before{
  content: "○";
  position: absolute;
  left: 0;
  color: var(--danger);
  font-weight: 900;
}
#wa-east-asia .requirements-panel li.done::before, #wa-east-asia .certificate-requirements li.done::before{
  content: "✓";
  color: var(--success);
}
#wa-east-asia .requirements-panel li.done, #wa-east-asia .certificate-requirements li.done{ color: var(--ink); }
#wa-east-asia .certificate-meta-three{ max-width: 860px; }
#wa-east-asia .certificate-meta-three div{ display: grid; gap: 4px; }
#wa-east-asia .certificate-meta-three span{ color: var(--muted); font-size: .78rem; }
#wa-east-asia .certificate-actions{ justify-content: center; }
#wa-east-asia .drawer-link{
  width: 100%;
  min-height: 42px;
  display: grid;
  grid-template-columns: 28px minmax(0,1fr);
  gap: 8px;
  align-items: center;
  padding: 8px 10px;
  border: 0;
  border-radius: 10px;
  background: transparent;
  text-align: left;
  cursor: pointer;
}
#wa-east-asia .drawer-link:hover, #wa-east-asia .drawer-link.current{ background: var(--paper-deep); }
#wa-east-asia .drawer-link > span:first-child{
  width: 26px;
  height: 26px;
  display: grid;
  place-items: center;
  border: 1px solid var(--line);
  border-radius: 50%;
  color: var(--muted);
  font-size: .72rem;
  font-weight: 900;
}
#wa-east-asia .drawer-link.complete > span:first-child{
  border-color: var(--success);
  background: var(--success-soft);
  color: var(--success);
}
#wa-east-asia .drawer-link:disabled{ opacity: .38; cursor: not-allowed; }
#wa-east-asia .image-backdrop{
  position: fixed;
  inset: 0;
  z-index: 96;
  background: rgba(20,21,26,.78);
  backdrop-filter: blur(4px);
}
#wa-east-asia .image-modal{
  position: fixed;
  inset: 4vh 4vw;
  z-index: 97;
  display: grid;
  grid-template-rows: auto minmax(0,1fr) auto;
  gap: 12px;
  padding: 18px;
  border: 1px solid rgba(255,255,255,.2);
  border-radius: 20px;
  background: #14151a;
  box-shadow: 0 24px 80px rgba(0,0,0,.5);
}
#wa-east-asia .image-modal img{
  width: 100%;
  height: 100%;
  min-height: 0;
  object-fit: contain;
}
#wa-east-asia .image-modal p{
  margin: 0;
  color: #faf8f3;
  text-align: center;
}
#wa-east-asia .image-modal-close{
  justify-self: end;
  width: 44px;
  height: 44px;
  border: 1px solid rgba(255,255,255,.35);
  border-radius: 50%;
  background: rgba(255,255,255,.08);
  color: white;
  cursor: pointer;
  font-size: 1.5rem;
}
#wa-east-asia.modal-open{ overflow: hidden; }
#wa-east-asia .glossary-popover img{
  width: 100%;
  max-height: 230px;
  object-fit: cover;
  border-radius: 14px;
  margin-bottom: 15px;
}
#wa-east-asia .glossary-popover h2{ margin: 5px 0 8px; }
#wa-east-asia .glossary-popover p{ margin-bottom: 0; }
@media (max-width: 980px){#wa-east-asia .overview-lessons{ grid-template-columns: 1fr; }
#wa-east-asia .overview-lesson{
    display: grid;
    grid-template-columns: 180px minmax(0,1fr);
  }
#wa-east-asia .overview-lesson img{ height: 100%; min-height: 170px; border-bottom: 0; border-right: 1px solid var(--line); }
#wa-east-asia .flashcard-grid, #wa-east-asia .flashcard-grid.six-cards, #wa-east-asia .flashcard-grid.many-cards{ grid-template-columns: repeat(2,minmax(0,1fr)); }
#wa-east-asia .match-workspace, #wa-east-asia .hotspot-layout{ grid-template-columns: 1fr; }
#wa-east-asia .match-bank, #wa-east-asia .story-images{ position: static; }
#wa-east-asia .match-bank-list{ grid-template-columns: repeat(2,minmax(0,1fr)); }
#wa-east-asia .hotspot-panel{ min-height: 0; }}
@media (max-width: 760px){#wa-east-asia .overview-split, #wa-east-asia .story-layout, #wa-east-asia .source-grid, #wa-east-asia .results-grid{ grid-template-columns: 1fr; }
#wa-east-asia .story-images{ grid-template-columns: 1fr; }
#wa-east-asia .multi-select-grid, #wa-east-asia .storyboard-grid{ grid-template-columns: 1fr; }
#wa-east-asia .assessment-review-item summary{ display: grid; }
#wa-east-asia .assessment-review-item summary > span{ text-align: left; }
#wa-east-asia .assessment-answer-line{ grid-template-columns: 1fr; gap: 2px; }
#wa-east-asia .result-assessment-cards{ grid-template-columns: 1fr; }}
@media (max-width: 620px){#wa-east-asia .overview-lesson{ display: block; }
#wa-east-asia .overview-lesson img{ height: 170px; border-right: 0; border-bottom: 1px solid var(--line); }
#wa-east-asia .flashcard-grid, #wa-east-asia .flashcard-grid.six-cards, #wa-east-asia .flashcard-grid.many-cards{ grid-template-columns: 1fr; }
#wa-east-asia .flashcard{ height: 390px; }
#wa-east-asia .match-bank-list{ grid-template-columns: 1fr; }
#wa-east-asia .order-item{ grid-template-columns: 38px minmax(0,1fr); }
#wa-east-asia .order-controls{ grid-column: 2; }
#wa-east-asia .hotspot-marker{
    width: 36px;
    height: 36px;
    border-width: 2px;
  }
#wa-east-asia .assessment-jump-grid{ grid-template-columns: repeat(6,minmax(34px,1fr)); }
#wa-east-asia .assessment-heading{ display: grid; }
#wa-east-asia .assessment-count{ justify-self: start; }
#wa-east-asia .assessment-actions .button.primary{ margin-left: 0; }
#wa-east-asia .certificate-meta{ display: grid; }
#wa-east-asia .image-modal{ inset: 1.5vh 2vw; padding: 10px; }}
@media print{#wa-east-asia *{ visibility: hidden !important; }
#wa-east-asia .certificate-wrap, #wa-east-asia .certificate-wrap *{ visibility: visible !important; }
#wa-east-asia .certificate-wrap{
    position: absolute;
    inset: 0;
    width: 100%;
    padding: 0;
  }
#wa-east-asia .certificate{
    min-height: 100vh;
    box-shadow: none;
  }
#wa-east-asia .certificate-actions, #wa-east-asia .course-header, #wa-east-asia .course-footer{ display: none !important; }}
#wa-east-asia .course-main:focus, #wa-east-asia .course-main:focus-visible{ outline: none; }
#wa-east-asia .overview-context-card{
  margin: 28px 0;
  padding: clamp(22px, 4vw, 36px);
  border: 1px solid var(--line);
  border-radius: 20px;
  background: linear-gradient(135deg, var(--paper), var(--card));
}
#wa-east-asia .overview-context-card h2{ margin: 6px 0 20px; }
#wa-east-asia .overview-context-grid{
  display: grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 14px;
}
#wa-east-asia .overview-context-grid > div{
  padding: 17px;
  border: 1px solid var(--line);
  border-radius: 15px;
  background: var(--card);
}
#wa-east-asia .overview-context-grid strong{
  display: block;
  margin-bottom: 6px;
  color: var(--accent-dark);
  font-family: "Cormorant", Georgia, serif;
  font-size: 1.35rem;
}
#wa-east-asia .overview-context-grid p{ margin: 0; color: var(--muted); font-size: .9rem; }
#wa-east-asia .overview-lesson.text-only{
  min-height: 220px;
  display: flex;
  flex-direction: column;
  overflow: visible;
}
#wa-east-asia .overview-lesson.text-only .lesson-number{
  position: static;
  flex: 0 0 auto;
  margin: 18px 18px 0;
  background: var(--paper-deep);
  box-shadow: none;
}
#wa-east-asia .overview-lesson-copy{ flex: 1; }
#wa-east-asia .overview-split.text-only-overview{ grid-template-columns: minmax(0,.9fr) minmax(360px,1.1fr); }
#wa-east-asia .text-timeline-panel{
  padding: clamp(20px,3vw,28px);
  border: 1px solid var(--line);
  border-radius: 18px;
  background: var(--paper);
}
#wa-east-asia .text-timeline-panel h2{ margin: 5px 0 18px; }
#wa-east-asia .text-timeline{
  display: grid;
  gap: 0;
  margin: 0;
  padding: 0;
  list-style: none;
}
#wa-east-asia .text-timeline li{
  position: relative;
  display: grid;
  grid-template-columns: 128px minmax(0,1fr);
  gap: 18px;
  padding: 12px 0 12px 21px;
  border-left: 2px solid var(--accent-soft);
}
#wa-east-asia .text-timeline li::before{
  content: "";
  position: absolute;
  left: -7px;
  top: 19px;
  width: 12px;
  height: 12px;
  border: 2px solid var(--card);
  border-radius: 50%;
  background: var(--accent-dark);
  box-shadow: 0 0 0 1px var(--accent-dark);
}
#wa-east-asia .timeline-date{ color: var(--accent-dark); font-size: .8rem; font-weight: 900; }
#wa-east-asia .text-timeline p{ margin: 0; color: var(--muted); font-size: .88rem; }
#wa-east-asia .flashcard.text-only{ min-height: 330px; height: 350px; }
#wa-east-asia .flashcard.text-only .flashcard-inner{ min-height: 330px; }
#wa-east-asia .flashcard.text-only .flashcard-front{
  position: relative;
  align-items: center;
  justify-content: center;
  padding: 28px;
  background:
    linear-gradient(135deg, rgba(145,135,102,.10), transparent 52%),
    var(--card);
  text-align: center;
}
#wa-east-asia .flashcard-term-index{
  position: absolute;
  top: 16px;
  right: 16px;
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  border: 1px solid var(--line);
  border-radius: 50%;
  color: var(--muted);
  font-size: .78rem;
  font-weight: 900;
}
#wa-east-asia .flashcard-term-badge{
  color: var(--accent-dark);
  font-size: .7rem;
  font-weight: 900;
  letter-spacing: .14em;
  text-transform: uppercase;
}
#wa-east-asia .flashcard.text-only .flashcard-word{
  padding: 12px 0 4px;
  font-size: clamp(1.75rem, 3.5vw, 2.55rem);
}
#wa-east-asia .flashcard-question{
  max-width: 250px;
  color: var(--muted);
  font-size: .9rem;
}
#wa-east-asia .flashcard.text-only .flashcard-hint{ margin-top: 20px; padding: 0; }
#wa-east-asia .story-layout.no-story-images{ grid-template-columns: minmax(0,1fr); }
#wa-east-asia .evidence-notes{ margin-top: 28px; }
#wa-east-asia .evidence-notes > h2{ margin: 5px 0 18px; }
#wa-east-asia .evidence-note-grid{
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 14px;
}
#wa-east-asia .evidence-note-card{
  padding: 19px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: var(--paper);
}
#wa-east-asia .evidence-note-card > span{
  color: var(--accent-dark);
  font-size: .69rem;
  font-weight: 900;
  letter-spacing: .12em;
  text-transform: uppercase;
}
#wa-east-asia .evidence-note-card h3{ margin: 7px 0 9px; font-size: 1.35rem; }
#wa-east-asia .evidence-note-card p{ margin: 0; color: var(--muted); }
#wa-east-asia .evidence-explorer-layout{
  display: grid;
  grid-template-columns: minmax(0,1.15fr) minmax(280px,.75fr);
  gap: 20px;
  align-items: start;
  margin-top: 26px;
}
#wa-east-asia .evidence-marker-grid{ display: grid; gap: 12px; }
#wa-east-asia .evidence-marker-card{
  width: 100%;
  display: grid;
  grid-template-columns: 46px minmax(0,1fr) 34px;
  gap: 13px;
  align-items: center;
  padding: 15px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: var(--card);
  text-align: left;
  cursor: pointer;
  transition: transform .16s ease, border-color .16s ease, background .16s ease;
}
#wa-east-asia .evidence-marker-card:hover{ transform: translateY(-2px); border-color: var(--accent-dark); }
#wa-east-asia .evidence-marker-card.active{ border-color: var(--accent-dark); background: var(--paper-deep); }
#wa-east-asia .evidence-marker-card.found{ border-color: color-mix(in srgb, var(--success) 45%, var(--line)); }
#wa-east-asia .evidence-marker-number, #wa-east-asia .evidence-marker-status{
  display: grid;
  place-items: center;
  border-radius: 50%;
  font-weight: 900;
}
#wa-east-asia .evidence-marker-number{
  width: 42px;
  height: 42px;
  background: var(--accent-dark);
  color: white;
}
#wa-east-asia .evidence-marker-card.found .evidence-marker-number{ background: var(--success); }
#wa-east-asia .evidence-marker-copy{ display: grid; gap: 3px; }
#wa-east-asia .evidence-marker-copy strong{ font-family: "Cormorant", Georgia, serif; font-size: 1.28rem; }
#wa-east-asia .evidence-marker-copy small{ color: var(--muted); }
#wa-east-asia .evidence-marker-status{ width: 30px; height: 30px; color: var(--accent-dark); background: var(--paper); }
#wa-east-asia .evidence-marker-card.found .evidence-marker-status{ color: var(--success); background: var(--success-soft); }
#wa-east-asia .evidence-explorer-layout .hotspot-panel{ min-height: 270px; }
#wa-east-asia .glossary-popover{ padding-top: 28px; }
#wa-east-asia .glossary-popover .eyebrow{ padding-right: 42px; }
@media (max-width: 980px){#wa-east-asia .overview-split.text-only-overview, #wa-east-asia .evidence-explorer-layout{ grid-template-columns: 1fr; }
#wa-east-asia .overview-context-grid{ grid-template-columns: 1fr; }}
@media (max-width: 760px){#wa-east-asia .evidence-note-grid{ grid-template-columns: 1fr; }
#wa-east-asia .text-timeline li{ grid-template-columns: 104px minmax(0,1fr); gap: 12px; }}
@media (max-width: 520px){#wa-east-asia .text-timeline li{ grid-template-columns: 1fr; gap: 3px; padding-left: 18px; }
#wa-east-asia .evidence-marker-card{ grid-template-columns: 40px minmax(0,1fr) 30px; padding: 13px; }
#wa-east-asia .evidence-marker-number{ width: 38px; height: 38px; }}
#wa-east-asia .complete-reading-notice{
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 7px 14px;
  margin: 21px 0 24px;
  padding: 14px 16px;
  border-left: 4px solid var(--accent-dark);
  border-radius: 0 14px 14px 0;
  background: var(--paper-deep);
}
#wa-east-asia .complete-reading-notice strong{
  color: var(--accent-dark);
  font-family: "Inter", ui-sans-serif, system-ui, sans-serif;
  font-size: .78rem;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}
#wa-east-asia .complete-reading-notice span{ color: var(--muted); line-height: 1.55; }
#wa-east-asia .source-reading-screen .story-copy{ display: grid; gap: 18px; }
#wa-east-asia .source-reading-screen .story-block + .story-block{ margin-top: 0; }
#wa-east-asia .source-reading-block{
  position: relative;
  padding: clamp(25px, 4vw, 42px);
  background: color-mix(in srgb, var(--paper) 88%, white);
}
#wa-east-asia .source-reading-block h2{
  max-width: 880px;
  margin-right: 58px;
  padding-bottom: 13px;
  border-bottom: 1px solid var(--line);
}
#wa-east-asia .source-reading-block p{
  max-width: 920px;
  margin-right: auto;
  margin-left: auto;
  font-size: clamp(1rem, 1.35vw, 1.09rem);
  line-height: 1.88;
}
#wa-east-asia .source-section-number{
  position: absolute;
  top: 22px;
  right: 24px;
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border: 1px solid var(--line);
  border-radius: 50%;
  color: var(--accent-dark);
  background: var(--card);
  font-size: .74rem;
  font-weight: 900;
  letter-spacing: .07em;
}
#wa-east-asia .glossary-backdrop{
  z-index: 94;
  background: rgba(20, 21, 26, .34);
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}
#wa-east-asia .glossary-popover{
  top: 50%;
  right: auto;
  bottom: auto;
  left: 50%;
  width: min(500px, calc(100vw - 32px));
  max-height: min(620px, calc(100vh - 48px));
  padding: 0;
  transform: translate(-50%, -50%);
  border: 1px solid color-mix(in srgb, var(--accent-dark) 28%, var(--line));
  border-radius: 20px;
  background: var(--card);
  box-shadow: 0 28px 90px rgba(20, 21, 26, .32);
  overflow: auto;
}
#wa-east-asia .glossary-popover[hidden], #wa-east-asia .glossary-backdrop[hidden]{ display: none !important; }
#wa-east-asia .glossary-popover .glossary-card-head{
  position: sticky;
  top: 0;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
  padding: 20px 20px 16px;
  border-bottom: 1px solid var(--line);
  background: var(--card);
}
#wa-east-asia .glossary-popover .glossary-kicker{
  display: block;
  margin-bottom: 4px;
  color: var(--accent-dark);
  font-family: "Inter", ui-sans-serif, system-ui, sans-serif;
  font-size: .7rem;
  font-weight: 900;
  letter-spacing: .13em;
  text-transform: uppercase;
}
#wa-east-asia .glossary-popover h2{
  margin: 0;
  color: var(--accent-dark);
  font-family: "Cormorant", Georgia, "Times New Roman", serif;
  font-size: clamp(1.85rem, 5vw, 2.5rem);
  line-height: 1.05;
}
#wa-east-asia .glossary-popover .glossary-card-body{ padding: 21px 22px 24px; }
#wa-east-asia .glossary-popover .glossary-definition{
  margin: 0;
  color: var(--ink);
  font-family: "Inter", ui-sans-serif, system-ui, sans-serif;
  font-size: clamp(1rem, 2vw, 1.08rem);
  line-height: 1.72;
}
#wa-east-asia .glossary-popover .glossary-close{
  flex: 0 0 auto;
  width: 40px;
  height: 40px;
  display: grid;
  place-items: center;
  padding: 0;
  border: 1px solid var(--line);
  border-radius: 50%;
  color: var(--ink);
  background: var(--paper);
  font-size: 1.45rem;
  line-height: 1;
  cursor: pointer;
}
#wa-east-asia .glossary-popover .glossary-close:hover, #wa-east-asia .glossary-popover .glossary-close:focus-visible{
  border-color: var(--accent-dark);
  outline: none;
  background: var(--paper-deep);
}
#wa-east-asia.glossary-modal-open{ overflow: hidden; }
@media (max-width: 620px){#wa-east-asia .source-reading-block{ padding: 24px 18px; }
#wa-east-asia .source-reading-block h2{ margin-right: 46px; }
#wa-east-asia .source-section-number{ top: 17px; right: 16px; width: 36px; height: 36px; }
#wa-east-asia .glossary-popover{
    top: auto;
    right: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    max-height: min(72vh, 620px);
    transform: none;
    border-width: 1px 0 0;
    border-radius: 22px 22px 0 0;
  }}
body.glossary-modal-open{overflow:hidden;}