/* 이러닝·교육 카드 위쪽 가상 화면 (edu-scenes.js) */
.pf-textthumb .edu-scene{flex:1;min-height:0;display:flex;align-items:center;justify-content:center;padding-top:6px}
.pf-textview .edu-scene{margin:0 0 22px;height:250px;display:flex}
.edu-scene>div{width:100%;max-width:420px;margin:0 auto}
.edu-scene i,.edu-scene em,.edu-scene u{display:block;font-style:normal;text-decoration:none}

/* 강의 플레이어 */
.edu-player{display:grid;gap:7px;padding:10px;border:1px solid #8fa8ff33;border-radius:12px;background:#0a1128cc}
.edu-slide{position:relative;aspect-ratio:16/8;border-radius:7px;background:linear-gradient(135deg,#f3f5fb,#dfe5f4);padding:12% 34% 0 7%;display:grid;align-content:start;gap:7%}
.edu-slide i{height:7px;border-radius:4px;background:#b7c2dc}
.edu-slide i.t{height:11px;width:70%;background:#2c4fb8}
.edu-slide i.s{width:55%}
.edu-pip{position:absolute;right:5%;bottom:9%;width:27%;aspect-ratio:4/3;border-radius:6px;background:linear-gradient(160deg,#3b4c78,#1b2547);display:flex;align-items:flex-end;justify-content:center;overflow:hidden}
.edu-pip b{width:46%;aspect-ratio:1/1.15;border-radius:50% 50% 0 0;background:#8fa1c9;box-shadow:0 -14px 0 -4px #8fa1c9}
.edu-sub{margin:0;justify-self:center;padding:3px 10px;border-radius:4px;background:#000a;color:#fff;font-size:.66rem;letter-spacing:.02em}
.edu-progress{position:relative;height:5px;border-radius:3px;background:#ffffff1f}
.edu-progress span{position:absolute;inset:0 auto 0 0;border-radius:3px;background:#6ea2ff}
.edu-progress em{position:absolute;top:-2px;width:2px;height:9px;background:#fff9}
.edu-chapters{display:flex;gap:4px;font-size:.6rem;color:#9aa6c2}
.edu-chapters span{flex:1;padding:3px 0;border-radius:4px;background:#ffffff0d;text-align:center;white-space:nowrap}
.edu-chapters .on{background:#6ea2ff33;color:#dfe8ff}

/* 편집 타임라인 */
.edu-editor{display:grid;gap:8px;padding:10px;border:1px solid #8fa8ff33;border-radius:12px;background:#0a1128cc}
.edu-preview{position:relative;aspect-ratio:16/7;border-radius:7px;background:radial-gradient(circle at 30% 40%,#5b6fd6,#1d2552 70%);display:grid;align-content:center;gap:8px;padding:0 12%}
.edu-preview i{height:9px;width:62%;border-radius:4px;background:#fffc}
.edu-preview i.s{height:6px;width:40%;background:#fff7}
.edu-badge{position:absolute;right:7px;top:7px;padding:3px 8px;border-radius:20px;background:#22c55e;color:#04210f;font-size:.62rem;font-weight:800}
.edu-tracks{display:grid;gap:5px}
.edu-tracks div{display:grid;grid-template-columns:42px 1fr;align-items:center;height:15px}
.edu-tracks b{font-size:.6rem;font-weight:600;color:#9aa6c2}
.edu-tracks p{position:relative;height:100%;margin:0;border-radius:3px;background:#ffffff0a}
.edu-tracks span{position:absolute;top:2px;height:11px;border-radius:3px;background:#f5b94a}
.edu-tracks span.g{background:#a78bfa}
.edu-tracks span.v{background:#4f7fe8}
.edu-tracks u{position:absolute;top:3px;width:8px;height:8px;margin-left:-4px;background:#fff;transform:rotate(45deg)}

/* 한자 카드 */
.edu-hanja{display:grid;grid-template-columns:1fr 1.15fr;gap:12px;align-items:center}
.edu-card{aspect-ratio:3/3.6;border-radius:14px;background:linear-gradient(160deg,#fff7e6,#ffe1b0);box-shadow:0 10px 30px #0006;display:grid;place-content:center;text-align:center;color:#5a3410}
.edu-card strong{font-size:3.4rem;line-height:1;font-family:"Noto Serif KR","Batang",serif}
.edu-card span{margin-top:8px;font-size:.78rem;font-weight:700}
.edu-quiz{display:grid;gap:5px}
.edu-quiz p{margin:0 0 2px;font-size:.72rem;color:#cdd5ea;font-weight:700}
.edu-quiz span{padding:6px 10px;border-radius:7px;background:#ffffff12;border:1px solid #ffffff1c;font-size:.7rem;color:#dfe5f4}
.edu-quiz .ok{background:#22c55e2e;border-color:#22c55e;color:#bff5d2;font-weight:700}

/* 단원 도입 장면 + 레이어 */
.edu-layers{display:grid;grid-template-columns:1fr 92px;gap:10px;align-items:stretch}
.edu-stage{position:relative;aspect-ratio:4/3;border-radius:10px;overflow:hidden;background:#cfe7ff}
.edu-stage .sky{position:absolute;inset:0;background:linear-gradient(#9fd0ff,#e6f4ff 70%)}
.edu-stage .hill{position:absolute;left:-10%;right:-10%;bottom:-30%;height:65%;border-radius:50%;background:#7cc68d}
.edu-stage .who{position:absolute;left:58%;bottom:16%;width:15%;aspect-ratio:1/2;border-radius:40% 40% 8px 8px;background:#f08a5d;box-shadow:0 -22px 0 -6px #f6c7a5}
.edu-stage p{position:absolute;left:8%;bottom:8%;margin:0;padding:3px 9px;border-radius:5px;background:#0b1022d9;color:#fff;font-size:.68rem;font-weight:700}
.edu-layers ul{margin:0;padding:6px;list-style:none;display:grid;gap:4px;align-content:start;border-radius:10px;background:#0a1128cc;border:1px solid #8fa8ff33}
.edu-layers li{padding:5px 7px;border-radius:5px;background:#ffffff0d;font-size:.64rem;color:#cdd5ea}
.edu-layers li::before{content:"";display:inline-block;width:7px;height:7px;margin-right:6px;border-radius:2px;background:#6ea2ff;vertical-align:1px}
.edu-layers li.on{background:#6ea2ff33;color:#fff}

@media (max-width:640px){
  .pf-textview .edu-scene{height:200px}
  .edu-card strong{font-size:2.6rem}
  /* 좁은 카드는 그림 + 분류만, 세부 항목은 눌렀을 때 팝업에서 */
  .pf-textthumb:has(.edu-scene){padding:12px;gap:8px}
  .pf-textthumb:has(.edu-scene) ul{display:none}
  .pf-textthumb .edu-scene>div{zoom:.62}
}