:root{--ink:#182f32;--muted:#6e8081;--green:#137c6d;--mint:#e4f2ec;--line:#e3e9e5;--bg:#f5f7f4;--orange:#d5894e;--red:#c65b50}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:14px/1.65 'Segoe UI','Microsoft YaHei',sans-serif}button,input,select,textarea{font:inherit}button,a{touch-action:manipulation}button{cursor:pointer;border:1px solid var(--line);background:white;color:var(--ink);border-radius:9px;padding:9px 16px;transition:.18s}button:hover{border-color:var(--green);background:#f0f7f4}button:disabled{opacity:.5;cursor:not-allowed}.primary{background:var(--green);border-color:var(--green);color:white}.primary:hover{background:#096457;color:white}.danger{color:var(--red)}input,select,textarea{border:1px solid #dce4df;border-radius:8px;padding:10px 12px;background:white;color:var(--ink);width:100%}input:focus,textarea:focus,select:focus{outline:2px solid #b3d7c8;outline-offset:1px}textarea{resize:vertical;min-height:85px}label{display:block;font-size:13px;color:#556b6d;margin-bottom:6px}.field{margin-bottom:16px}h1,h2,h3,p{margin-top:0}h1{font-size:29px;letter-spacing:-1px;line-height:1.3;margin-bottom:9px}h2{font-size:18px;margin-bottom:16px}h3{font-size:15px;margin-bottom:9px}.muted{color:var(--muted)}.small{font-size:12px}.eyebrow{font-size:11px;letter-spacing:2px;color:var(--green);font-weight:700;margin-bottom:12px}.badge{display:inline-flex;align-items:center;gap:6px;background:var(--mint);color:var(--green);padding:4px 10px;border-radius:6px;font-size:12px;white-space:nowrap}.badge.orange{background:#fcf0df;color:#a77535}.dot{width:6px;height:6px;background:currentColor;border-radius:50%}.row{display:flex;align-items:center;gap:12px}.between{justify-content:space-between}.stack{display:flex;flex-direction:column;gap:18px}.card{background:white;border:1px solid var(--line);border-radius:13px;padding:23px}.grid2{display:grid;grid-template-columns:1.2fr 1fr;gap:20px}.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.divider{height:1px;background:var(--line);margin:20px 0}.empty{text-align:center;padding:35px 12px;color:var(--muted)}.notice{background:#fff6e8;border:1px solid #ead5b4;border-radius:8px;padding:11px 14px;color:#826438;font-size:12px}.error{color:#b04039;margin-top:12px}.success{color:var(--green)}#toast{position:fixed;bottom:26px;left:50%;transform:translateX(-50%) translateY(100px);background:#173d36;color:white;border-radius:10px;padding:12px 24px;z-index:100;box-shadow:0 8px 35px #173d3629;transition:.2s;max-width:90vw}#toast.show{transform:translateX(-50%) translateY(0)}
/* 登录 */
.login-layout{min-height:100vh;display:grid;grid-template-columns:1.1fr 1fr}.login-story{background:#143d35;color:#fff;padding:52px 70px;position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:space-between}.brand{display:flex;gap:10px;align-items:center;font-size:22px;font-weight:700}.brand-icon{width:36px;height:36px;display:grid;place-items:center;background:#d9efb0;color:#194938;border-radius:10px;font-size:21px}.brand small{font-size:11px;letter-spacing:2px;font-weight:400;color:#a1bdb1;display:block}.login-story h1{font-size:48px;line-height:1.4;letter-spacing:1px;max-width:490px}.login-story p{color:#a7c5b8;max-width:390px;font-size:15px}.story-chart{display:flex;align-items:end;height:150px;gap:16px;margin:30px 0}.story-chart span{flex:1;background:#bddc9b;border-radius:12px 12px 4px 4px;min-width:18px;opacity:.85}.login-right{padding:40px;display:flex;align-items:center;justify-content:center}.login-box{width:405px}.login-box h1{font-size:28px;margin:18px 0 8px}.tabs{display:flex;gap:4px;border-bottom:1px solid var(--line);margin:26px 0}.tabs button{flex:1;border:0;border-bottom:2px solid transparent;border-radius:0;background:none;padding:12px 4px;color:var(--muted)}.tabs button.active{border-bottom-color:var(--green);color:var(--green);font-weight:600}.login-box .primary{width:100%;margin-top:7px}.demo-accounts{background:#eaf0e9;border-radius:9px;padding:14px;margin-top:25px}.demo-accounts button{padding:4px 9px;font-size:12px;background:transparent;margin-top:7px}.demo-accounts code{font-family:monospace;font-size:12px}.oauth-buttons{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:20px 0}.oauth-buttons button{padding:22px 10px}.oauth-logo{display:block;font-size:30px;margin-bottom:5px}
/* 框架 */
.sidebar{position:fixed;width:222px;height:100vh;background:#fff;border-right:1px solid var(--line);padding:29px 20px;display:flex;flex-direction:column;z-index:20}.sidebar .brand{padding:0 8px;margin-bottom:42px}.sidebar .brand small{color:#91a19a}.nav-caption{font-size:10px;color:#91a19a;letter-spacing:2px;padding:0 13px;margin-bottom:13px}.nav-button{border:0;background:none;border-radius:9px;text-align:left;display:flex;gap:12px;align-items:center;width:100%;padding:12px;margin-bottom:6px;color:#687c78}.nav-button.active{background:#e6f1e9;color:#176d57;font-weight:600}.nav-icon{width:21px;font-size:18px;text-align:center}.sidebar-bottom{margin-top:auto;padding-top:20px}.profile{display:flex;align-items:center;gap:10px;border-top:1px solid var(--line);padding-top:22px}.avatar{flex-shrink:0;width:35px;height:35px;border-radius:10px;background:#e8eee4;color:#537147;display:grid;place-items:center;font-weight:700}.logout{padding:4px 7px;border:none;font-size:12px;margin-left:auto}.main{margin-left:222px}.topbar{height:76px;background:#ffffffb0;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 34px;gap:15px}.topbar select{width:305px;background:#f5f7f4;border-color:transparent;font-size:13px}.topbar .date{font-size:12px;color:var(--muted)}.content{max-width:1500px;margin:auto;padding:32px 34px 50px}.page-heading{display:flex;justify-content:space-between;gap:20px;margin-bottom:26px;align-items:center}.page-heading p{margin-bottom:0;font-size:13px;color:var(--muted)}.course-banner{background:#e8f0df;border:1px solid #dce6d0;border-radius:12px;padding:22px 25px;display:flex;justify-content:space-between;align-items:center;margin-bottom:22px;gap:15px}.course-banner h2{margin:0 0 5px;font-size:20px}.banner-meta{font-size:12px;color:#74816a}.timer{font-size:24px;font-variant-numeric:tabular-nums;font-weight:600;text-align:right;color:#4d6c40}.metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:22px}.metric{padding:20px 22px}.metric .number{font-size:34px;font-weight:650;letter-spacing:-1px;line-height:1.5}.metric small{font-size:14px;color:#81908a;font-weight:400;margin-left:4px}.metric .hint{font-size:11px;color:#89958d;margin-top:8px}.metric.featured{background:#186d5e;color:white;border-color:#186d5e}.metric.featured .muted,.metric.featured small,.metric.featured .hint{color:#b1d5c8}.chart-card{min-height:320px}.chart-title{margin-bottom:6px}.bar-chart{height:205px;display:flex;align-items:end;gap:17px;padding:28px 12px 30px;border-bottom:1px solid var(--line)}.bar-col{flex:1;height:100%;display:flex;flex-direction:column;justify-content:end;align-items:center;position:relative}.bar{width:75%;min-height:3px;border-radius:6px 6px 0 0;position:relative}.bar-value{position:absolute;top:-26px;width:100%;text-align:center;font-size:12px;font-weight:600}.bar-label{position:absolute;bottom:-29px;font-size:12px;color:#758179;white-space:nowrap}.pie-layout{display:flex;align-items:center;justify-content:space-around;gap:25px;padding:28px 0 6px}.donut{width:168px;height:168px;border-radius:50%;position:relative;flex-shrink:0}.donut::after{content:'';position:absolute;inset:24px;background:white;border-radius:50%}.donut-center{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:1;font-size:28px;font-weight:600}.donut-center small{font-size:11px;font-weight:400;color:var(--muted)}.legend{min-width:135px}.legend-row{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:6px 0;font-size:12px}.swatch{width:8px;height:8px;border-radius:3px;display:inline-block;margin-right:8px}.insight{margin-top:20px;background:#f4f7f1;border-radius:8px;padding:11px 14px;font-size:12px;color:#6d8162}.mini-row{display:flex;justify-content:space-between;align-items:center;padding:12px 0;border-bottom:1px solid #edf0eb}.mini-row:last-child{border:0}.bottom-grid{margin-top:20px}.feedback-options{display:grid;grid-template-columns:repeat(6,1fr);gap:12px;margin:28px 0}.emoji-option{padding:20px 5px;border:1px solid var(--line);background:#fbfcfa;display:flex;flex-direction:column;align-items:center;gap:7px}.emoji-option .emoji{font-size:35px}.emoji-option.selected{border:2px solid var(--green);background:#e8f4ed;padding:19px 4px}.emoji-option strong{font-size:12px}.feedback-footer{display:flex;align-items:center;justify-content:space-between;gap:14px}.feedback-footer .primary{min-width:150px}.student-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:20px}.flow-step{display:flex;gap:13px;margin-top:17px;font-size:13px}.step-number{background:#edf3e9;color:var(--green);width:27px;height:27px;border-radius:50%;display:grid;place-items:center;flex-shrink:0}.table-wrap{overflow-x:auto}table{width:100%;border-collapse:collapse;font-size:12px;text-align:left;white-space:nowrap}th{background:#f7f9f5;color:#7a897d;font-weight:500;padding:12px 13px}td{padding:14px 13px;border-bottom:1px solid #edf0eb}tr:last-child td{border-bottom:0}.filters{display:flex;align-items:end;gap:14px;margin-bottom:22px}.filters .field{margin:0;flex:1}.filters button{white-space:nowrap}.table-actions button{padding:4px 9px;font-size:12px}.chat-layout{display:grid;grid-template-columns:1fr 285px;gap:20px}.chat-card{padding:0;overflow:hidden}.chat-title{border-bottom:1px solid var(--line);padding:18px 24px}.messages{height:440px;overflow:auto;padding:20px 25px;background:#fbfcfa}.message{display:flex;gap:12px;margin-bottom:20px}.message.mine{flex-direction:row-reverse}.message-content{max-width:78%}.message.mine .message-meta{text-align:right}.message-meta{font-size:11px;color:var(--muted);margin-bottom:5px}.message-bubble{padding:11px 15px;background:white;border:1px solid var(--line);border-radius:0 10px 10px 10px;white-space:pre-wrap;overflow-wrap:anywhere}.mine .message-bubble{background:#e5f1e8;border-color:#d3e6d6;border-radius:10px 0 10px 10px}.message-bubble img{display:block;max-width:100%;max-height:230px;border-radius:7px;margin-top:8px}.chat-compose{padding:18px 22px}.chat-compose textarea{min-height:64px}.chat-actions{display:flex;justify-content:space-between;align-items:center;margin-top:10px}.upload{font-size:12px;display:inline-block;cursor:pointer}.upload input{width:auto;max-width:190px;font-size:11px;padding:4px}.quiz-card{margin-bottom:18px}.quiz-options{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:20px 0}.quiz-option{display:flex;gap:10px;padding:13px;border:1px solid var(--line);border-radius:8px;align-items:center;margin:0;color:var(--ink)}.quiz-option input{width:auto}.quiz-option.correct{border-color:#8dbc96;background:#eff7ec}.quiz-result{padding:10px 13px;border-radius:7px;background:#eff5e9;color:#4c7040;margin-bottom:12px}.quiz-form{display:grid;grid-template-columns:1fr 1fr;gap:16px}.quiz-form .wide{grid-column:1/-1}.quiz-form .field{margin:0}.modal-backdrop{position:fixed;inset:0;background:#132c2b66;z-index:50;display:flex;justify-content:center;align-items:center;padding:20px}.modal{background:white;border-radius:14px;padding:25px;width:650px;max-height:90vh;overflow:auto}.user-form{display:grid;grid-template-columns:1fr 1fr;gap:0 16px}.settings-range{display:flex;gap:10px;margin:25px 0}.settings-range button{flex:1;padding:16px 5px}.settings-range button.selected{background:var(--green);color:white}.mobile-brand{display:none}.footer-note{font-size:11px;color:#8d9991;margin-top:25px}.no-margin{margin:0}button:focus-visible,a:focus-visible{outline:3px solid #b0cf97;outline-offset:3px}
#toast{visibility:hidden;opacity:0;pointer-events:none}#toast.show{visibility:visible;opacity:1}
.classroom-code{font-family:Consolas,monospace;font-size:18px;letter-spacing:2px;color:var(--green)}.join-card{display:grid;grid-template-columns:1fr 1fr;gap:28px;align-items:center;margin-bottom:22px}.join-card input{font-size:20px;letter-spacing:3px}.join-card .error{margin-top:8px}
@media(max-width:760px){.join-card{grid-template-columns:1fr;gap:20px}.course-banner .row{flex-wrap:wrap}.course-banner{align-items:flex-start}.classroom-code{font-size:16px}.join-card input{min-width:0;font-size:18px}.join-card button{padding:12px}}
@media(min-width:1500px){.content{padding-top:38px}.bar-chart{height:240px}.chart-card{min-height:355px}}
@media(max-width:1100px){.sidebar{width:190px;padding:26px 14px}.main{margin-left:190px}.content{padding:25px 22px}.topbar{padding:0 22px}.grid2{grid-template-columns:1fr 1fr}.pie-layout{gap:12px}.donut{width:140px;height:140px}.legend{min-width:110px}.metrics{gap:10px}.metric{padding:17px 15px}.chat-layout{grid-template-columns:1fr}.chat-side{display:none}.login-story{padding:45px}.login-story h1{font-size:39px}}
@media(max-width:760px){.login-layout{display:block}.login-story{padding:25px}.login-story>div:nth-child(2),.login-story>small{display:none}.login-right{padding:26px 20px}.sidebar{position:sticky;top:0;width:100%;height:auto;flex-direction:row;padding:7px 10px;border-bottom:1px solid var(--line);align-items:center}.sidebar .brand,.nav-caption,.sidebar-bottom{display:none}.sidebar nav{display:flex;width:100%;justify-content:space-around}.nav-button{width:auto;display:flex;flex-direction:column;gap:0;margin:0;padding:5px 9px;font-size:11px}.nav-icon{font-size:18px}.main{margin:0}.topbar{height:auto;min-height:62px;padding:10px 16px}.topbar select{width:100%;max-width:270px}.topbar .date{display:none}.content{padding:23px 16px}.page-heading{margin-bottom:18px;align-items:start}.page-heading h1{font-size:24px}.page-heading>button{padding:7px 10px;font-size:12px}.course-banner{padding:17px}.course-banner h2{font-size:16px}.timer{font-size:21px}.metrics{grid-template-columns:1fr 1fr}.metric .number{font-size:29px}.grid2,.grid3,.student-grid{grid-template-columns:1fr}.card{padding:18px}.feedback-options{grid-template-columns:repeat(3,1fr);gap:9px}.emoji-option{padding:14px 4px}.emoji-option.selected{padding:13px 3px}.emoji-option .emoji{font-size:30px}.feedback-footer{align-items:start;flex-direction:column}.feedback-footer button{width:100%}.filters{flex-wrap:wrap;gap:10px}.filters .field{min-width:42%}.quiz-options,.quiz-form{grid-template-columns:1fr}.quiz-form .wide{grid-column:auto}.chat-card{padding:0}.messages{height:400px;padding:16px}.chat-compose{padding:14px}.message-content{max-width:85%}.user-form{grid-template-columns:1fr 1fr}.login-box{width:100%}.login-story .brand{font-size:20px}.modal{padding:20px}.pie-layout{justify-content:center;gap:40px}.donut{width:170px;height:170px}}

@media(max-width:760px){#course-list-table,#course-list-table tbody{display:block}#course-list-table thead{display:none}#course-list-table tr{display:grid;grid-template-columns:1fr 1fr;padding:12px 0;border-bottom:1px solid var(--line);gap:8px}#course-list-table td{border:0;padding:2px 0;white-space:normal;overflow-wrap:anywhere}#course-list-table td:first-child,#course-list-table td:nth-child(4),#course-list-table td:last-child{grid-column:1/-1}#course-list-table td:first-child{font-size:15px;margin-bottom:4px}#course-list-table td:nth-child(3),#course-list-table td:nth-child(4){color:var(--muted);font-size:11px}#course-list-table td:last-child{display:flex;gap:8px;margin-top:6px}#course-list-table td:last-child button{flex:1;padding:9px 5px}#course-list-table td:nth-child(2){grid-column:1/-1}}

.wechat-login{text-align:center}.wechat-mark{width:66px;height:66px;border-radius:20px;background:#e2f4e7;color:#16a05b;font-size:38px;display:grid;place-items:center;margin:0 auto 16px}.wechat-login h2{margin-bottom:8px}.wechat-steps{display:flex;gap:12px;list-style-position:inside;padding:0;margin:20px 0;text-align:left;font-size:12px;color:var(--muted)}.wechat-steps li{flex:1}.wechat-login .notice{text-align:left}.login-box .tabs button{font-size:12px}

/* 课堂放映与实时弹幕 */
.presentation-layout{display:grid;grid-template-columns:minmax(0,1fr) 285px;gap:20px}.presentation-card{padding:0;overflow:hidden;background:#101918;border-color:#1b2c29}.presentation-title{padding:15px 19px;background:#fff;color:var(--ink)}.presentation-page{font:600 16px/1 Consolas,monospace;color:var(--green)}.presentation-stage{aspect-ratio:16/9;position:relative;display:flex;align-items:center;justify-content:center;background:#0b1110;overflow:hidden}.presentation-stage>img{width:100%;height:100%;object-fit:contain;display:block}.presentation-empty{color:#d4e3de;text-align:center;padding:45px}.presentation-empty strong{font-size:20px}.presentation-empty p{color:#8da49d;margin:8px 0 0}.presentation-controls{display:flex;justify-content:center;align-items:center;gap:12px;padding:14px 18px;background:#fff;border-top:1px solid var(--line)}.presentation-controls button{min-width:112px}.presentation-paused{position:absolute;right:16px;bottom:16px;padding:8px 13px;border-radius:7px;background:#101918cc;color:#fff;font-size:12px;opacity:0;transform:translateY(8px);transition:.2s}.presentation-paused.show{opacity:1;transform:none}.danmaku-layer{position:absolute;inset:0;overflow:hidden;pointer-events:none}.danmaku-item{position:absolute;left:100%;display:block;width:max-content;max-width:75%;padding:5px 12px;border-radius:15px;background:#071a17bb;color:#fff;font-weight:600;font-size:16px;line-height:1.4;text-shadow:0 1px 2px #000;box-shadow:0 2px 9px #0004;animation:danmaku-move var(--danmaku-duration,10s) linear forwards}.danmaku-item.teacher{background:#167d72e8;color:#effff7}.danmaku-compose{display:flex;gap:10px;padding:14px 18px 18px;background:#fff}.danmaku-compose input{flex:1}.danmaku-compose button{white-space:nowrap}.presentation-comments{padding:20px 18px;background:#fff;border-top:1px solid var(--line);color:var(--ink)}.presentation-comments-heading{margin-bottom:12px}.presentation-comments-heading h2{font-size:16px}.danmaku-comments{max-height:330px;overflow:auto;border:1px solid var(--line);border-radius:10px;background:#f8faf8;padding:6px 0}.danmaku-comment{display:flex;align-items:flex-end;gap:10px;padding:9px 15px}.danmaku-comment.mine{flex-direction:row-reverse}.danmaku-comment-body{display:flex;min-width:0;flex:1;flex-direction:column;align-items:flex-start}.danmaku-comment.mine .danmaku-comment-body{align-items:flex-end}.danmaku-comment-body>.row{width:100%;gap:8px;justify-content:flex-start}.danmaku-comment.mine .danmaku-comment-body>.row{flex-direction:row-reverse}.danmaku-comment-body strong{display:flex;align-items:center;gap:7px;font-size:12px}.danmaku-comment-body time{font-size:10px;color:var(--muted);font-variant-numeric:tabular-nums;white-space:nowrap}.danmaku-comment-body p{max-width:78%;margin:4px 0 0;padding:8px 12px;border:1px solid var(--line);border-radius:4px 13px 13px 13px;background:#fff;white-space:pre-wrap;overflow-wrap:anywhere;box-shadow:0 1px 2px #173d3608}.danmaku-comment.mine .danmaku-comment-body p{border-color:#cfe3d7;border-radius:13px 4px 13px 13px;background:#e5f1e8}.teacher-tag{display:inline-flex;padding:1px 6px;border-radius:8px;background:var(--mint);color:var(--green);font-size:10px;font-weight:600}.ppt-upload{display:flex;min-height:105px;align-items:center;justify-content:center;text-align:center;border:1px dashed #aac1b6;border-radius:10px;background:#f4f8f5;color:var(--green);cursor:pointer;padding:16px}.ppt-upload input{position:absolute;width:1px;height:1px;opacity:0}.ppt-upload:has(input:focus-visible){outline:3px solid #b0cf97}.presentation-stage:fullscreen{width:100vw;height:100vh;aspect-ratio:auto;background:#050807}.presentation-stage:fullscreen .danmaku-item{font-size:22px}@keyframes danmaku-move{to{transform:translateX(calc(-100vw - 100%))}}
@media(max-width:1100px){.presentation-layout{grid-template-columns:1fr}.presentation-side{display:grid;grid-template-columns:1fr 1fr}.presentation-side .card{height:100%}}
@media(max-width:760px){.sidebar nav{overflow-x:auto;justify-content:flex-start}.nav-button{flex:0 0 auto}.presentation-layout{gap:14px}.presentation-card{border-radius:10px}.presentation-title{align-items:flex-start;flex-direction:column}.presentation-title>.row{width:100%;justify-content:space-between}.presentation-controls{gap:7px;padding:11px}.presentation-controls button{min-width:0;flex:1;padding:8px 5px}.danmaku-compose{padding:11px;gap:7px}.danmaku-compose button{padding:9px}.presentation-comments{padding:16px 11px}.danmaku-comment{padding:11px}.danmaku-comment .avatar{width:31px;height:31px}.danmaku-comment-body>.row{align-items:flex-start}.danmaku-item{font-size:13px}.presentation-side{grid-template-columns:1fr}.presentation-stage{aspect-ratio:16/10}}
