/* Classroom presentation: high-contrast, distraction-free and readable at TV distance. */
body.presenting { overflow:hidden; }
.presenter-root { position:fixed; inset:0; z-index:9999; display:flex; flex-direction:column; background:#f8f6ef; color:#173d47; font-family:'DM Sans',Arial,sans-serif; }
.presenter-root[hidden] { display:none !important; }
.presenter-top { display:flex; align-items:center; gap:18px; justify-content:space-between; flex-wrap:wrap; flex:0 0 auto; padding:13px clamp(18px,3vw,56px); background:#173d47; color:#fffefa; min-height:76px; }
.presenter-brand { display:flex; gap:12px; align-items:center; min-width:0; }
.presenter-brand img { width:44px; height:44px; border-radius:50%; background:#b8ceae; }
.presenter-brand strong { font:600 clamp(18px,1.5vw,24px) 'Fraunces',Georgia,serif; letter-spacing:-.03em; white-space:nowrap; }
.presenter-level { display:inline-block; font-weight:800; font-size:14px; padding:4px 9px; background:#b8ceae; color:#173d47; border-radius:8px; }
.presenter-toolbar { display:flex; flex-wrap:wrap; align-items:center; gap:9px; }
.presenter-toolbar label { font-size:13px; font-weight:700; color:#e4eee9; }
.presenter-toolbar select,.presenter-toolbar button,.presenter-bottom button,.presenter-action { border-radius:10px; border:1px solid #adcbc1; font-size:15px; font-weight:700; padding:9px 13px; background:#fffefa; color:#173d47; cursor:pointer; }
.presenter-toolbar select { max-width:205px; }
.presenter-toolbar button:hover,.presenter-bottom button:hover,.presenter-action:hover { background:#e2f0e5; }
.presenter-toolbar .presenter-close { background:transparent; color:#fffefa; border-color:#86a9a4; }
.presenter-toolbar .presenter-close:hover { background:#315760; }
.presenter-stage { flex:1 1 auto; min-height:0; overflow:auto; padding:clamp(18px,3.1vh,40px) clamp(18px,5vw,90px); display:flex; justify-content:center; align-items:stretch; }
.presenter-slide { width:min(1300px,100%); margin:auto; padding:clamp(8px,2vw,30px) 0; position:relative; min-width:0; }
.presenter-kicker { display:block; font-size:clamp(14px,1.15vw,20px); color:#b35443; font-weight:800; text-transform:uppercase; letter-spacing:.16em; margin-bottom:12px; }
.presenter-slide h2 { font:600 clamp(34px,3.5vw,64px)/1.12 'Fraunces',Georgia,serif; color:#173d47; letter-spacing:-.035em; margin:0 0 22px; max-width:1200px; }
.presenter-slide .presenter-statement { max-width:1150px; font-size:clamp(25px,2.3vw,40px); line-height:1.43; font-weight:500; margin:14px 0 18px; }
.presenter-slide p { overflow-wrap:break-word; }
.presenter-slide ul,.presenter-slide ol { margin:17px 0; padding-left:1.4em; }
.presenter-slide li { margin:12px 0; }
.presenter-prompt { font:600 clamp(36px,3.8vw,68px)/1.27 'Fraunces',Georgia,serif; letter-spacing:-.025em; max-width:1200px; margin:26px 0 !important; }
.presenter-reading { max-width:1140px; font-size:clamp(26px,2.35vw,42px); line-height:1.46; margin:8px 0; }
.presenter-reading-count { font-size:14px; color:#5b7876; font-weight:700; margin-top:18px; }
.presenter-big-list { font-size:clamp(22px,2.15vw,36px); line-height:1.37; max-width:1150px; }
.presenter-big-list li { margin:14px 0; }
.presenter-panel { border-radius:19px; padding:clamp(18px,2.5vw,36px); border:2px solid #c9d8cb; background:#fffefa; margin:17px 0; }
.presenter-big-note { font-size:clamp(21px,2vw,34px); line-height:1.4; }
.presenter-vocab-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:15px; }
.presenter-vocab { text-align:left; padding:19px 22px; min-height:150px; border-radius:17px; border:2px solid #b8d1c3; background:#f1f7ed; color:#173d47; cursor:pointer; }
.presenter-vocab strong { display:block; font-size:clamp(25px,2.3vw,40px); line-height:1.2; }
.presenter-vocab span { display:block; font-size:clamp(18px,1.65vw,27px); line-height:1.3; margin-top:12px; color:#56726d; }
.presenter-vocab.revealed { background:#fff0e8; border-color:#e8b3a0; }
.presenter-vocab.revealed span { color:#4e6363; }
.presenter-choice-grid { display:grid; gap:13px; }
.presenter-choice { display:flex; align-items:center; gap:18px; text-align:left; width:100%; min-height:72px; border:2px solid #ccddd0; border-radius:14px; padding:13px 20px; background:#fffefa; color:#173d47; font-size:clamp(22px,1.9vw,33px); line-height:1.3; cursor:pointer; }
.presenter-choice .presenter-letter { display:grid; place-items:center; flex:0 0 auto; width:43px; height:43px; border-radius:50%; background:#e4eee2; font-size:19px; font-weight:800; }
.presenter-choice.selected { border-color:#6a9c97; background:#eff7f2; }
.presenter-choice.correct { background:#d9eedb; border-color:#4d9878; }
.presenter-choice.incorrect { background:#f7e7e0; border-color:#d6927e; }
.presenter-feedback { margin-top:16px; background:#e4f1e7; color:#24534e; padding:16px 22px; font-size:clamp(19px,1.7vw,27px); line-height:1.35; border-radius:12px; }
.presenter-actions { display:flex; gap:12px; flex-wrap:wrap; align-items:center; margin-top:21px; }
.presenter-action { display:inline-flex; align-items:center; text-decoration:none; padding:12px 17px; font-size:17px; }
.presenter-action.primary { background:#ef7965; border-color:#ef7965; color:#173d47; }
.presenter-action.primary:hover { background:#ffc0ac; }
.presenter-video-layout { display:grid; grid-template-columns:1fr 1fr; gap:28px; align-items:center; }
.presenter-video-frame { aspect-ratio:16/9; border-radius:17px; overflow:hidden; background:#173d47; display:grid; place-items:center; }
.presenter-video-frame iframe { border:0; width:100%; height:100%; }
.presenter-video-placeholder { padding:22px; color:#edf7ee; text-align:center; font-size:clamp(22px,2vw,34px); }
.presenter-video-placeholder button { margin-top:17px; }
.presenter-role-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:15px; }
.presenter-role-grid .presenter-panel { margin:0; }
.presenter-role-grid strong { font:600 clamp(23px,2.4vw,39px) 'Fraunces',Georgia,serif; color:#173d47; }
.presenter-role-grid p { font-size:clamp(20px,1.8vw,30px); line-height:1.35; margin:12px 0 0; }
.presenter-sources { display:grid; gap:12px; margin-top:20px; }
.presenter-sources a { color:#266a73; font-size:clamp(17px,1.45vw,23px); font-weight:700; text-underline-offset:3px; overflow-wrap:anywhere; }
.presenter-mascot { width:clamp(78px,9vw,150px); height:auto; object-fit:contain; float:right; margin-left:28px; opacity:.9; }
.presenter-qr-card { display:flex; align-items:center; gap:23px; max-width:520px; border:1px solid #b9d2c2; border-radius:16px; background:#fffefa; padding:15px 19px; margin-top:32px; font-size:17px; font-weight:700; line-height:1.4; }
.presenter-qr-card img { width:110px; height:110px; flex:0 0 110px; image-rendering:pixelated; }
.presenter-qr-card small { display:block; font-size:13px; font-weight:500; color:#617874; margin-top:5px; }
.presenter-bottom { flex:0 0 auto; display:flex; justify-content:space-between; align-items:center; gap:18px; background:#e5eee3; border-top:1px solid #bed0c0; padding:12px clamp(18px,3vw,56px); }
.presenter-nav { display:flex; gap:9px; align-items:center; }
.presenter-bottom button:disabled { opacity:.38; cursor:default; }
.presenter-progress-area { flex:1 1 auto; min-width:90px; display:flex; gap:12px; align-items:center; justify-content:center; color:#31565e; font-size:15px; font-weight:800; }
.presenter-progress-track { height:8px; border-radius:999px; background:#bfd1c0; width:min(280px,26vw); overflow:hidden; }
.presenter-progress-fill { height:100%; background:#d46d58; width:0; transition:width .15s ease; }
.presenter-timer { display:flex; align-items:center; gap:8px; font-variant-numeric:tabular-nums; }
.presenter-timer time { font:600 27px 'Fraunces',Georgia,serif; color:#173d47; min-width:61px; }
.presenter-help { position:absolute; bottom:0; right:0; font-size:12px; color:#69837f; }
@media(max-width:1040px) {
  .presenter-top { padding:10px 17px; }
  .presenter-brand strong { display:none; }
  .presenter-stage { padding:15px 27px; }
  .presenter-slide { padding:8px 0; }
  .presenter-slide h2 { font-size:clamp(31px,4vw,51px); }
  .presenter-video-layout { grid-template-columns:1fr; }
  .presenter-video-frame { max-width:680px; width:100%; }
  .presenter-bottom { padding:9px 16px; }
  .presenter-bottom button { padding:8px 10px; }
  .presenter-help { display:none; }
}
@media(max-width:650px) {
  .presenter-top { gap:8px; }
  .presenter-brand img { width:34px; height:34px; }
  .presenter-toolbar { gap:5px; }
  .presenter-toolbar label { display:none; }
  .presenter-toolbar select { max-width:125px; font-size:12px; padding:6px; }
  .presenter-toolbar button { padding:7px 9px; font-size:12px; }
  .presenter-stage { padding:15px; }
  .presenter-slide h2 { font-size:clamp(30px,7vw,42px); }
  .presenter-prompt { font-size:clamp(30px,7vw,46px); }
  .presenter-reading,.presenter-slide .presenter-statement { font-size:clamp(21px,4.8vw,27px); }
  .presenter-big-list { font-size:22px; }
  .presenter-vocab-grid,.presenter-role-grid { grid-template-columns:1fr; }
  .presenter-vocab { min-height:95px; }
  .presenter-vocab strong { font-size:25px; }
  .presenter-vocab span { font-size:19px; }
  .presenter-choice { font-size:21px; min-height:55px; }
  .presenter-progress-track { display:none; }
  .presenter-progress-area { min-width:0; font-size:12px; }
  .presenter-bottom { gap:6px; padding:7px; flex-wrap:wrap; }
  .presenter-nav { gap:3px; }
  .presenter-bottom button { font-size:12px; padding:7px 8px; }
  .presenter-timer time { font-size:20px; min-width:45px; }
  .presenter-qr-card img { width:80px; height:80px; flex-basis:80px; }
}
@media(prefers-reduced-motion:reduce) { .presenter-progress-fill { transition:none; } }
