:root{--bg:#0e1219;--panel:#19212b;--line:#34404d;--ink:#f7f5f0;--muted:#b9c3cf;--accent:#f26a57;--blue:#77cce4}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:var(--bg);color:var(--ink)}body{font-family:"Noto Sans TC","Microsoft JhengHei",Arial,sans-serif;line-height:1.65}
.topbar{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:27px 32px;border-bottom:1px solid var(--line);background:#111923}.eyebrow{font:800 12px Arial,sans-serif;letter-spacing:.17em;color:var(--accent)}h1{font-size:30px;line-height:1;margin:9px 0 0}.connection{font-size:13px;color:var(--blue);border:1px solid #315667;border-radius:100px;padding:7px 12px;white-space:nowrap}.connection.offline{color:var(--muted);border-color:var(--line)}main{max-width:820px;padding:34px 34px 54px;margin:auto}.page-meta{display:flex;justify-content:space-between;color:var(--accent);font:800 14px Arial,sans-serif;letter-spacing:.1em}.progress{height:4px;background:#28323d;border-radius:3px;margin:13px 0 36px}.progress div{height:100%;background:var(--accent);border-radius:3px;transition:width .2s}h2{font-size:38px;line-height:1.25;margin:0 0 8px}.duration{font-weight:800;color:var(--blue);font-size:17px;margin:0 0 29px}.note-card,.source-card{background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:25px 28px;margin-top:19px}.note-card{border-left:5px solid var(--accent)}h3{font-size:17px;letter-spacing:.08em;color:var(--accent);margin:0 0 14px}.note-card p{font-size:22px;line-height:1.75;margin:0;white-space:pre-line}.source-card{padding:19px 28px}.source-card h3{color:var(--blue);font-size:14px}.source-card a,.help a{color:var(--blue);overflow-wrap:anywhere}.source-card div{font-size:16px;color:var(--muted)}.speaker-controls{display:flex;gap:13px;margin:25px 0}.speaker-controls button{flex:1;background:var(--accent);color:#17191e;font:900 20px inherit;border:0;border-radius:12px;min-height:56px;cursor:pointer}.speaker-controls button:first-child{background:#26333e;color:var(--ink);border:1px solid #50606e}.speaker-controls button:disabled{opacity:.42;cursor:not-allowed}.jump{display:flex;align-items:center;gap:14px}.jump label{font-size:15px;color:var(--muted)}.jump select{flex:1;min-width:0;padding:12px;background:#1d2833;border:1px solid #57636e;color:var(--ink);border-radius:9px;font-size:15px}.help{margin-top:30px;color:#9faab7;font-size:14px}@media(max-width:600px){.topbar{padding:20px}.topbar h1{font-size:24px}.connection{font-size:11px}main{padding:25px 19px}.note-card p{font-size:19px}h2{font-size:31px}}

/* Lecturer view follows the same restrained editorial palette as the deck. */
:root{--bg:#f3f1eb;--panel:#fffdf8;--line:#c9ccc9;--ink:#20262a;--muted:#566168;--accent:#b73e36;--blue:#226579}
html,body{background:var(--bg);color:var(--ink)}
.topbar{background:#151c21;color:#f4f0e8;border-bottom:3px solid var(--accent)}
.topbar h1{color:#f4f0e8}.topbar .eyebrow{color:#e88a7a}
.connection{color:#c7e5e6;border-color:#5d8b95;border-radius:2px}.connection.offline{color:#d4dad6;border-color:#67737a}
.page-meta{color:var(--accent)}.progress{background:#d6d9d5;border-radius:0}.progress div{border-radius:0}
h2{font-weight:800;letter-spacing:-.03em}.duration{color:var(--blue)}
.note-card,.source-card{background:var(--panel);border:1px solid var(--line);border-radius:2px;box-shadow:none}
.note-card{border-left:4px solid var(--accent)}.note-card p{color:var(--ink)}
.source-card h3{color:var(--blue)}.source-card div{color:var(--muted)}
.speaker-controls button{border-radius:2px;color:#fff}.speaker-controls button:first-child{background:#dce2df;color:var(--ink);border:1px solid var(--line)}
.speaker-controls button:hover:not(:disabled){filter:brightness(1.09)}
.jump select{background:#fffdf8;color:var(--ink);border:1px solid #aeb8b6;border-radius:2px}
.help{color:#627077}
button:focus-visible,select:focus-visible,a:focus-visible{outline:3px solid #b73e36;outline-offset:3px}