/* 录播课播放器外壳。课件页样式在 design/theme.css。 */
html,body{margin:0;height:100%;background:#0B0C0F;overflow:hidden;font-family:"Inter","Noto Sans SC",sans-serif}
#frame{position:absolute;left:50%;top:0;transform-origin:0 0}
#stage{position:absolute;left:0;top:0;width:1920px;height:1080px;transform-origin:0 0;background:#000;overflow:hidden}
.slide{position:absolute;left:0;top:0;opacity:0}
.slide video.full,.slide img.full{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
/* 字幕：画在字幕区 y 880–1000 */
#cc{position:absolute;left:160px;right:160px;top:900px;height:90px;display:flex;align-items:center;justify-content:center;pointer-events:none;z-index:20}
#cc span{background:rgba(17,19,24,.82);color:#fff;font-size:36px;line-height:1.35;padding:8px 22px;border-radius:6px;font-weight:500}
#cc span:empty{display:none}
body.nocc #cc{display:none}
/* 暂停题 */
#quiz{position:absolute;inset:0;z-index:30;display:none;align-items:center;justify-content:center;background:rgba(246,247,249,.92)}
#quiz.on{display:flex}
#quiz .box{width:1180px;background:#fff;border:1px solid var(--hair);border-left:8px solid var(--red);padding:56px 64px;box-shadow:0 40px 80px -40px rgba(17,19,24,.35)}
#quiz .eyebrow{margin-bottom:22px}
#quiz .q{font-size:42px;line-height:1.5;font-weight:700;color:var(--ink)}
#quiz .a{display:none;margin-top:30px;padding-top:26px;border-top:1px solid var(--hair);font-size:32px;line-height:1.6;color:var(--ink2)}
#quiz .a b{color:var(--red)}
#quiz.reveal .a{display:block}
#quiz .btns{margin-top:40px;display:flex;gap:18px}
#quiz button{font:inherit;font-size:28px;font-weight:700;padding:14px 34px;border-radius:4px;cursor:pointer;border:2px solid var(--ink);background:#fff;color:var(--ink)}
#quiz button.go{background:var(--ink);color:#fff}
/* 开始遮罩 */
#start{position:absolute;inset:0;z-index:40;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:34px;background:rgba(15,17,21,.72);cursor:pointer;color:#fff}
#start .t{font-size:44px;font-weight:700}
#start .b{width:150px;height:150px;border-radius:50%;background:var(--red);display:flex;align-items:center;justify-content:center}
#start .b::after{content:"";border-left:52px solid #fff;border-top:32px solid transparent;border-bottom:32px solid transparent;margin-left:12px}
/* 控制条 */
#bar{position:fixed;left:0;right:0;bottom:0;height:56px;display:flex;align-items:center;gap:16px;padding:0 18px;background:#121418;color:#C9CED8;font-size:14px;user-select:none}
#bar button,#bar select{background:none;border:0;color:#E6E8EC;font:inherit;font-size:15px;cursor:pointer;padding:6px 8px;border-radius:4px}
#bar button:hover,#bar select:hover{background:#22252c}
#bar select option{background:#121418}
#bar .time{font-family:"JetBrains Mono",monospace;font-size:13px;min-width:112px}
#prog{position:relative;flex:1;height:28px;cursor:pointer}
#prog .track{position:absolute;left:0;right:0;top:12px;height:4px;background:#2A2E36;border-radius:2px}
#prog .fill{position:absolute;left:0;top:12px;height:4px;background:var(--red);border-radius:2px}
#prog .tick{position:absolute;top:8px;width:2px;height:12px;background:#6B7280}
#prog .tick:hover::after{content:attr(data-title);position:absolute;bottom:18px;left:-40px;white-space:nowrap;background:#22252c;color:#fff;padding:4px 8px;border-radius:4px}
#prog .q{position:absolute;top:9px;width:10px;height:10px;margin-left:-5px;border-radius:50%;background:#FFE066}
#bar .on{color:#fff;background:#2A2E36}