/* Geometry and typography calibrated against the nine supplied student screens. */
:root { font-family: 'Microsoft YaHei', 'Microsoft YaHei UI', 'Segoe UI', sans-serif; color:#081b48; }
.main-area { background:linear-gradient(135deg,#f4f8ff,#e7f0ff); border-radius:14px 0 0 0; }
.main-content { min-width:0; }
.page-banner { background-color:#082b80; }
.panel-title { color:#07153d; font-size:21px; }
.empty { display:grid; justify-items:center; align-content:center; min-width:0; }
.empty strong { font-size:14px; }
.empty p { max-width:300px; font-size:12px; line-height:1.7; }
.empty-icon { width:48px; height:48px; }
.grid > .empty:only-child { grid-column:1/-1; width:100%; }
.text-link { font-size:13px; }
.row-title { font-size:14px; }
.row-sub { font-size:12px; }
.window-controls { display:none; }
.electron-desktop .window-controls { display:flex; }
.auth-windowbar { display:none; }
.electron-desktop .auth-windowbar { display:flex; position:absolute; z-index:5; top:0; left:0; right:0; height:48px; justify-content:space-between; align-items:center; padding-left:18px; color:#d7e4fa; background:#102858; -webkit-app-region:drag; }
.auth-windowbar button { -webkit-app-region:no-drag; }
.electron-desktop .teacher-entry-link { display:none; }
.classroom-teacher { min-height:190px; display:grid; place-content:center; justify-items:center; gap:10px; padding:18px; background:linear-gradient(140deg,#0c204a,#134983); color:#adcdfb; border-radius:12px; }
.classroom-teacher strong { color:white; font-size:16px; }
.classroom-teacher span { font-size:12px; }
.classroom-live-left { display:grid; align-content:start; gap:12px; min-width:0; }
.classroom-active .classroom-main { grid-template-rows:minmax(400px,1fr) auto; }
.classroom-active .live-screen { min-height:400px; }
.classroom-active .classroom-right { grid-template-rows:260px minmax(0,1fr); }
.classroom-active .scroll-region { max-height:190px; overflow:auto; }
.classroom-active .chat-box { height:230px; }
.classroom-shared-preview { min-height:140px; }
.classroom-shared-preview .empty { padding:12px; }
.classroom-session-footer { display:flex; align-items:center; gap:18px; margin-top:12px; padding:14px; background:#fff; border-radius:12px; }
.classroom-session-footer > span { display:flex; align-items:center; gap:10px; flex:1; }
.window-controls button { width:48px; height:46px; border:0; border-radius:4px; color:#d7e4fa; background:transparent; font-size:23px; }
.window-controls button:hover { background:#ffffff20; }
.window-controls button:last-child:hover { background:#d9384c; color:white; }
.electron-desktop .topbar { -webkit-app-region:drag; }
.electron-desktop .topbar button,.electron-desktop .topbar input,.electron-desktop .top-search { -webkit-app-region:no-drag; }
.top-user-info { display:grid; gap:3px; }
.top-user-name { font-size:16px; }
.top-user-meta { font-size:12px; }
.login-options { display:flex; align-items:center; justify-content:space-between; gap:16px; margin:4px 0 20px; color:#536a91; font-size:13px; }
.login-options label { display:inline-flex; align-items:center; gap:7px; cursor:pointer; }
.login-options input { width:16px; height:16px; margin:0; accent-color:#1768f6; }
@media (min-width:1281px) {
  .electron-desktop .topbar { gap:clamp(10px,1.5vw,22px); }
  .electron-desktop .top-search { flex:1 1 420px; min-width:260px; width:auto; }
  .electron-desktop .top-spacer { flex:0 1 120px; min-width:0; }
  .electron-desktop .top-action,
  .electron-desktop .top-icon,
  .electron-desktop .top-user,
  .electron-desktop .window-controls { flex-shrink:0; }
  .electron-desktop .top-user { gap:8px; white-space:nowrap; }
  .electron-desktop .top-user-info { flex:0 0 auto; min-width:max-content; white-space:nowrap; line-height:1.3; }
  .electron-desktop .top-user-name,
  .electron-desktop .top-user-meta { display:block; max-width:112px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
}
.summary-line { font-size:14px; }
.summary-line strong { font-size:16px; }
.ring-value { font-size:30px; }
.ring-label { font-size:12px; }
.course-catalog-heading p,.course-category-label { display:none; }
.profile-settings-store[hidden] { display:none; }
.modal-content .panel { box-shadow:none; }
.profile-menu b { font-size:16px; }
.profile-menu small { font-size:12px; }
.live-media-control { border:1px solid #d9e4f2; color:#355675; background:#f6f9fd; font-size:11px; }
.live-media-control.is-active { border-color:#1a90a5; color:#fff; background:#127488; }
.live-teacher-audio { min-height:120px; }
.classroom-service-status [data-media-status] { color:#9ac8ef; font-size:10px; }
@media (max-width: 760px) {
  .classroom-session-footer { flex-wrap:wrap; gap:8px; }
  .classroom-session-footer > span { flex:1 0 100%; }
  .classroom-session-footer button { min-height:38px; }
}
.profile-menu button { min-height:65px; }
.classroom-schedule-item.is-joinable { cursor:pointer; }
.classroom-schedule-item.is-joinable:hover { border-color:#75b4ff; background:#f1f7ff; transform:translateY(-1px); }
.page-classroom .classroom-toolbar { background:rgba(255,255,255,.88); border:1px solid #dbe7f8; border-radius:14px; padding:12px 16px; margin-bottom:12px; box-shadow:0 6px 18px rgba(36,86,160,.06); }
.page-classroom .classroom-course-title strong { font-size:20px; letter-spacing:-.02em; }
.page-classroom .classroom-course-title span { font-size:12px; color:#58709b; }
.page-classroom .classroom-service-status { min-height:38px; padding:0 10px; border-radius:10px; background:#f5f8ff; }
.page-classroom .classroom-layout { gap:12px; }
.page-classroom .classroom-outline,.page-classroom .classroom-right > .panel { border-color:#dce8fa; box-shadow:0 8px 20px rgba(47,91,158,.06); }
.page-classroom .classroom-panel-title { padding-bottom:10px; border-bottom:1px solid #edf2fb; }
.page-classroom .classroom-schedule-item { min-height:56px; padding:11px 10px; border:1px solid transparent; transition:all .18s ease; }
.page-classroom .classroom-schedule-item.selected { border-color:#b8d6ff; box-shadow:0 4px 12px rgba(31,112,240,.08); }
.page-classroom .classroom-stage { min-height:430px; border:0; background:radial-gradient(circle at 52% 42%,rgba(20,145,255,.38),transparent 31%),linear-gradient(145deg,#061743,#0b3d91 58%,#061634); box-shadow:inset 0 0 0 1px rgba(119,193,255,.2),0 12px 26px rgba(5,38,95,.16); }
.page-classroom .classroom-stage::after { content:''; position:absolute; inset:12px; border:1px solid rgba(130,205,255,.14); border-radius:12px; pointer-events:none; }
.page-classroom .classroom-stage-graphic strong { font-size:25px; }
.page-classroom .classroom-thumbnail-row > div { min-height:64px; padding:12px; border-radius:12px; box-shadow:0 4px 12px rgba(47,91,158,.05); }
.page-classroom .classroom-controlbar { min-height:68px; padding:10px 14px; border-radius:14px; box-shadow:0 6px 16px rgba(47,91,158,.06); }
.page-classroom .classroom-controlbar button { min-width:72px; min-height:42px; border-radius:10px; transition:background .18s ease,color .18s ease; }
.page-classroom .classroom-controlbar button:hover { background:#edf5ff; color:#075fe5; }
.page-classroom .classroom-policy-note { margin-top:2px; padding:9px 12px; border-radius:10px; background:#f5f8ff; }
.page-classroom .classroom-active .live-screen { min-height:430px; border-radius:16px; box-shadow:inset 0 0 0 1px rgba(110,191,255,.2),0 12px 28px rgba(5,38,95,.16); }
.page-classroom .classroom-active .classroom-teacher { min-height:210px; background:linear-gradient(145deg,#071942,#0b4d9b); border-radius:16px; box-shadow:0 10px 24px rgba(5,38,95,.14); }
.page-classroom .classroom-active .classroom-shared-preview { border-radius:14px; border-color:#dce8fa; box-shadow:0 6px 16px rgba(47,91,158,.06); }
.page-classroom .classroom-active .classroom-session-footer { border:1px solid #dce8fa; box-shadow:0 8px 20px rgba(47,91,158,.08); }
.live-lesson-canvas { position:relative; z-index:1; width:min(86%,760px); min-height:300px; padding:34px 40px; border:1px solid rgba(166,220,255,.45); border-radius:18px; background:linear-gradient(145deg,rgba(255,255,255,.98),rgba(225,243,255,.94)); color:#0a2457; box-shadow:0 16px 38px rgba(2,22,71,.2); }
.live-lesson-kicker { color:#1579e8; font-size:10px; font-weight:800; letter-spacing:.18em; }
.live-lesson-canvas h2 { margin:12px 0 5px; font-size:26px; line-height:1.25; }
.live-lesson-canvas p { margin:0; color:#6680a8; font-size:12px; }
.live-lesson-flow { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:30px; }
.live-lesson-flow span { display:flex; align-items:center; gap:7px; min-width:0; padding:13px 15px; border-radius:12px; color:#1a4e9c; background:#edf7ff; font-size:12px; font-weight:700; }
.live-lesson-flow span svg { color:#1685f5; }
.live-lesson-flow i { color:#2689ed; font-size:20px; font-style:normal; }
.live-lesson-state { margin-top:26px; color:#7891b5; font-size:11px; }
.teacher-video-placeholder { display:grid; place-items:center; width:100%; min-height:126px; margin-bottom:14px; border-radius:12px; background:radial-gradient(circle at 50% 38%,rgba(67,194,255,.5),transparent 28%),linear-gradient(145deg,#06163c,#0b4c98); color:#7de2ff; }
.teacher-video-placeholder svg { filter:drop-shadow(0 0 12px rgba(71,209,255,.55)); }
.teacher-video-placeholder:has(.t-media-tile) { display:block; position:relative; overflow:hidden; padding:0; }
.teacher-video-placeholder .t-media-tile { width:100%; height:100%; min-height:126px; }
.teacher-video-placeholder .t-media-tile video { width:100%; height:100%; min-height:126px; display:block; object-fit:cover; border-radius:12px; }
.teacher-video-placeholder .t-media-caption { position:absolute; left:10px; bottom:8px; padding:4px 8px; border-radius:7px; color:#fff; background:rgba(4,20,55,.72); font-size:10px; }
.teacher-video-placeholder .t-media-placeholder { min-height:126px; display:grid; place-items:center; padding:20px; color:#9cc4ed; text-align:center; font-size:11px; }
.live-screen .t-media-tile.is-screen { position:absolute; z-index:3; inset:14px; border-radius:13px; overflow:hidden; background:#071634; }
.live-screen .t-media-tile.is-screen video { width:100%; height:100%; object-fit:contain; display:block; }
.live-screen .t-media-tile.is-screen .t-media-caption { position:absolute; left:12px; bottom:10px; padding:4px 8px; border-radius:7px; color:#fff; background:rgba(5,18,48,.76); font-size:10px; }
.classroom-realtime-strip { padding:12px; border:1px solid #dce8fa; border-radius:14px; background:#fff; box-shadow:0 6px 16px rgba(47,91,158,.06); }
.classroom-realtime-head { display:flex; align-items:center; justify-content:space-between; gap:12px; color:#23426f; font-size:12px; }
.classroom-realtime-head strong { display:flex; align-items:center; gap:7px; }
.classroom-realtime-head svg { color:#176ef2; }
.classroom-realtime-head span { color:#8a9ab5; font-size:10px; }
.classroom-realtime-empty { display:flex; align-items:center; justify-content:center; gap:8px; min-height:54px; color:#8c9db8; font-size:11px; }
.classroom-right-shell { min-width:0; min-height:0; display:flex; flex-direction:column; overflow:hidden; border-color:#dce8fa; box-shadow:0 8px 20px rgba(47,91,158,.06); }
.classroom-right-tabs { display:grid; grid-template-columns:repeat(4,1fr); min-height:46px; border-bottom:1px solid #e7eef9; background:#fbfdff; }
.classroom-right-tabs button { position:relative; border:0; background:transparent; color:#647b9e; font-size:11px; font-weight:700; }
.classroom-right-tabs button.active { color:#1268eb; }
.classroom-right-tabs button.active::after { content:''; position:absolute; left:16%; right:16%; bottom:-1px; height:3px; border-radius:3px 3px 0 0; background:#1577f4; }
.classroom-right-body { display:grid; grid-template-rows:260px minmax(0,1fr); gap:10px; min-height:0; padding:10px; }
.classroom-right-body > .panel { min-height:0; }
.classroom-right-body > .panel .panel-head { margin-bottom:9px; }
.classroom-right-body > .panel .panel-title { font-size:13px; }
.classroom-session-footer .btn.ghost-blue { min-width:78px; }
@media (min-width:1281px) {
  .page-classroom .classroom-active + .classroom-session-footer { position:sticky; bottom:12px; z-index:12; }
  .page-classroom .classroom-active .classroom-right-body { grid-template-rows:minmax(220px,1fr) minmax(260px,1fr); }
  .page-classroom .classroom-active .classroom-right-tabs button { font-size:12px; }
  .page-classroom .classroom-active .live-lesson-canvas { min-height:330px; }
}
@media (max-width:1180px) and (min-width:761px) {
  .page-classroom .classroom-layout { grid-template-columns:240px minmax(0,1fr); }
  .page-classroom .classroom-right { grid-column:1/-1; grid-template-columns:1fr; }
  .page-classroom .classroom-right-shell { min-height:420px; }
  .page-classroom .classroom-right-body { grid-template-columns:1fr 1fr; grid-template-rows:1fr; }
}
.profile-menu > button > svg:last-child { transform:rotate(-90deg); }
.page-growth .growth-layout { grid-template-columns:minmax(0,1fr) 368px; }
.growth-top-panels .empty,.growth-bottom-panels .empty,.growth-lower-panels .empty { padding:12px; }
.growth-top-panels .panel-empty,.growth-bottom-panels .panel-empty,.growth-lower-panels .panel-empty { display:flex; flex-direction:column; }
.growth-top-panels .panel-empty > .empty,.growth-bottom-panels .panel-empty > .empty,.growth-lower-panels .panel-empty > .empty { flex:1; }
.growth-progress-layout { flex:1; }
.stat-card::after { display:none; }
.stat-value { font-size:25px; }
.stat-label { font-size:12px; }
.profile-kpis .stat-value,.growth-kpis .stat-value { font-size:23px; }
.profile-kpis .stat-label,.growth-kpis .stat-label { font-size:12px; }
.page-dashboard .hero { background-color:#123b9a; background-size:auto 100%,auto,auto,auto; }
.page-dashboard .hero-content { max-width:650px; }
.page-dashboard .hero::before { display:block; opacity:1; mask-image:none; background:linear-gradient(90deg,#143d8d 0%,#143d8d 48%,transparent 72%); }
.page-banner::after { content:''; position:absolute; z-index:0; inset:0; pointer-events:none; background:linear-gradient(90deg,#0c2d80 0%,#0c2d80 35%,transparent 66%); }
.page-banner-copy { z-index:1; }
.page-dashboard .hero h2 { font-style:italic; margin:0 0 14px; font-size:38px; }
.page-dashboard .hero p { font-size:20px; margin-bottom:26px; }
.page-dashboard .hero::after { display:block; width:100%; height:100px; right:0; bottom:-65px; }
.summary-panel .learning-summary { gap:18px; min-height:165px; }
.summary-panel .ring { width:142px; height:142px; }
.summary-panel .summary-list { gap:15px; }
.quick-link { min-height:90px; }
.quick-link b { font-size:14px; }
.quick-link span { width:42px; height:42px; background:linear-gradient(145deg,#29c5ff,#0752ff); color:white; }
.quick-link:nth-child(3n+2) span { background:linear-gradient(145deg,#ae8aff,#6243ed); color:white; }
.quick-link:nth-child(3) span { background:linear-gradient(145deg,#48e6cf,#00b7ba); }
.quick-link:nth-child(7) span { background:linear-gradient(145deg,#ffd66a,#f4a600); }
.quick-link:nth-child(8) span { background:linear-gradient(145deg,#ffcb58,#ff8b22); }
@media(min-width:1281px) {
  .sidebar { background-color:#091c49; }
  .brand-name { font-size:26px; }
  .nav-label { font-size:19px; }
  .nav-item svg { width:27px; height:27px; flex-basis:27px; }
  .topbar { height:72px; padding:0 30px; gap:22px; }
  .top-search { width:min(570px,43vw); border-radius:16px; }
  .main-content { padding-bottom:20px; }
  .dashboard-top { grid-template-columns:minmax(0,2.15fr) minmax(390px,1fr); }
  .dashboard-middle { grid-template-columns:1.4fr 1fr 1fr; }
  .dashboard-bottom { grid-template-columns:1.5fr 1fr 1fr; }
  .page-courses .course-catalog-panel { position:relative; padding-top:5px; min-height:837px; }
  .course-catalog-heading { position:absolute; top:10px; left:15px; }
  .course-status-tabs { min-height:55px; padding-left:158px; gap:28px; align-items:center; }
  .course-status-tab { font-size:16px; }
  .course-category-row { min-height:68px; }
  .course-category-row .chip { border-radius:10px; font-size:14px; min-height:42px; }
  .course-filter-toolbar { min-height:53px; background:#f0f5ff; border-radius:10px; padding:8px; }
  .course-spotlight-empty .course-spotlight-placeholder-hero { min-height:174px; }
  .course-spotlight-empty .course-spotlight-outline { min-height:490px; }
  .course-spotlight-empty .course-spotlight-outline .empty { min-height:380px; }
  .page-growth .growth-top-panels > .panel { min-height:270px; }
  .page-growth .growth-bottom-panels > .panel { min-height:176px; }
  .page-growth .growth-lower-panels > .panel { min-height:128px; }
  .page-growth .growth-bottom-panels .empty,.page-growth .growth-lower-panels .empty { min-height:0; padding:6px; }
  .page-growth .growth-bottom-panels .empty-icon,.page-growth .growth-lower-panels .empty-icon { width:32px; height:32px; margin-bottom:4px; }
  .page-growth .growth-top-panels .panel-head,.page-growth .growth-bottom-panels .panel-head,.page-growth .growth-lower-panels .panel-head { margin-bottom:4px; }
  .page-profile .profile-dashboard { grid-template-columns:356px minmax(0,1fr); }
  .profile-learning-row > .panel { min-height:200px; }
  .profile-feature-row > .panel { min-height:172px; }
  .profile-feature-row .empty { min-height:104px; padding:6px; }
  .profile-left > .panel:nth-child(2) { min-height:120px; padding:12px; }
  .profile-left > .panel:nth-child(2) .panel-title { font-size:18px; }
  .profile-identity { padding:14px; }
  .profile-menu button { min-height:60px; padding:9px 2px; }
  .profile-learning-row .ring { width:140px; height:140px; }
  .page-classroom .classroom-layout { grid-template-columns:300px minmax(0,1fr) 346px; }
  .classroom-outline { min-height:640px; }
  .page-classroom .classroom-layout { min-height:640px; }
  .classroom-stage { max-height:500px; }
  .classroom-main { grid-template-rows:minmax(430px,1fr) auto auto; }
  .classroom-right > .panel:nth-child(3) .empty { padding:12px 8px; }
  .project-sidebar > .panel:nth-child(2) { min-height:180px; }
  .project-sidebar > .panel:nth-child(3) { min-height:172px; }
  .project-sidebar .empty { padding:15px 8px; }
  .project-sidebar .project-summary { min-height:192px; }
  .project-toolbar .project-tab { font-size:15px; }
  .assignment-toolbar .chips { flex-wrap:nowrap; }
  .assignment-toolbar .chip { border-radius:9px; padding:0 12px; font-size:13px; }
  .notification-layout { min-height:640px; }
  .notification-layout > .panel { min-height:640px; }
}
@media(max-width:1280px) {
  .page-growth .growth-layout { grid-template-columns:minmax(0,1fr) 300px; }
  .page-dashboard .hero h2 { font-size:28px; }
  .page-dashboard .hero p { font-size:16px; }
}
@media(max-width:960px) { .page-growth .growth-layout { grid-template-columns:1fr; } }
@media (max-width:1280px) {
  .electron-desktop .topbar { gap:clamp(8px,1vw,12px); padding-inline:16px; }
  .electron-desktop .top-search { flex:1 1 360px; min-width:180px; width:auto; }
  .electron-desktop .top-spacer { flex:0 1 48px; min-width:0; }
  .electron-desktop .top-action,
  .electron-desktop .top-icon,
  .electron-desktop .top-user,
  .electron-desktop .window-controls { flex-shrink:0; }
  .electron-desktop .top-user { gap:8px; white-space:nowrap; }
  .electron-desktop .top-user-info { flex:0 0 auto; min-width:max-content; white-space:nowrap; line-height:1.3; }
  .electron-desktop .top-user-name,
  .electron-desktop .top-user-meta { display:block; max-width:112px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
}
/* Shared classroom shell: waiting and live states keep the reference geometry. */
.page-classroom:has(.cr-workspace) { padding:0; }
.cr-workspace { height:calc(100dvh - 72px); min-height:600px; display:grid; grid-template-rows:82px minmax(0,1fr) 88px; gap:12px; padding:0 14px 10px; color:#0c1b48; background:linear-gradient(125deg,#f6f9ff,#e8f2ff); }
.cr-audio-help { position:fixed; z-index:30; bottom:102px; left:50%; transform:translateX(-50%); display:flex; align-items:center; gap:14px; max-width:calc(100vw - 32px); padding:10px 12px 10px 16px; border:1px solid #b9d8ff; border-radius:12px; background:#fff; color:#18355f; box-shadow:0 12px 32px #163a7026; font-size:12px; }
.cr-audio-help[hidden] { display:none; }
.cr-audio-help button { flex:none; border:0; border-radius:8px; padding:9px 12px; background:#145bea; color:#fff; font:inherit; font-weight:700; cursor:pointer; }
.cr-audio-help button:hover { background:#0e49c2; }
.cr-audio-help { position:fixed; z-index:30; bottom:102px; left:50%; transform:translateX(-50%); display:flex; align-items:center; gap:14px; max-width:calc(100vw - 32px); padding:10px 12px 10px 16px; border:1px solid #b9d8ff; border-radius:12px; background:#fff; color:#18355f; box-shadow:0 12px 32px #163a7026; font-size:12px; }
.cr-audio-help[hidden] { display:none; }
.cr-audio-help button { flex:none; border:0; border-radius:8px; padding:9px 12px; background:#145bea; color:#fff; font:inherit; font-weight:700; cursor:pointer; }
.cr-audio-help button:hover { background:#0e49c2; }
.cr-header { display:flex; align-items:center; gap:16px; padding:12px 8px; border-bottom:1px solid #dce7f6; min-width:0; }
.cr-back { flex:none; border:0; padding:8px; background:none; color:#0d2859; transform:rotate(90deg); }
.cr-title { min-width:0; flex:1; }
.cr-title h1 { margin:0 0 6px; font-size:21px; line-height:1.3; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.cr-title p { margin:0; color:#53678d; font-size:12px; }
.cr-status { flex:none; padding:10px 14px; border:1px solid #cbdfff; border-radius:12px; background:#fff; color:#145bea; font-size:12px; font-weight:700; }
.cr-refresh { border:0; border-radius:10px; width:40px; height:40px; background:#fff; color:#168e71; }
.cr-columns { display:grid; grid-template-columns:minmax(210px,.9fr) minmax(0,2.15fr) minmax(275px,1.04fr); gap:12px; min-height:0; }
.cr-left,.cr-center,.cr-right { min-height:0; min-width:0; display:grid; gap:12px; }
.cr-left { grid-template-rows:190px minmax(0,1fr); }
.cr-center { grid-template-rows:minmax(0,1fr) 124px; }
.cr-right { grid-template-rows: minmax(220px,.94fr) minmax(240px,1.06fr); }
.cr-card { min-height:0; min-width:0; border:1px solid #e3ecfa; border-radius:14px; background:rgba(255,255,255,.95); overflow:hidden; box-shadow:0 5px 16px #3158a40a; }
.cr-teacher { position:relative; overflow:hidden; border-radius:12px; background:#102b53; }
.cr-teacher-video { height:100%; width:100%; position:relative; }
.cr-teacher-empty { height:100%; display:flex; flex-direction:column; justify-content:center; align-items:center; gap:12px; background:radial-gradient(ellipse at 50% 40%,#164779,#0c2049); color:#b9d3f4; font-size:11px; }
.cr-teacher-empty svg { color:#6cc9ff; }
.cr-teacher-caption { display:flex; gap:6px; align-items:center; position:absolute; bottom:10px; left:10px; padding:5px 8px; border-radius:7px; background:#091c4ac4; color:#fff; font-size:12px; }
.cr-teacher .t-media-placeholder { display:none; }
.cr-teacher-video:has(.t-media-tile) .cr-teacher-empty { display:none; }
.cr-teacher-video .t-media-tile,.cr-teacher-video .t-media-tile video { height:100%; min-height:0; border:0; border-radius:0; object-fit:cover; }
.cr-tabs { display:flex; min-height:44px; align-items:stretch; justify-content:space-around; border-bottom:1px solid #e8eff9; background:linear-gradient(#fff,#f5f8ff); }
.cr-tabs button,.cr-tabs > span { display:flex; align-items:center; justify-content:center; flex:1; position:relative; background:transparent; border:0; color:#52658c; font-size:13px; font-weight:700; padding:10px 6px; white-space:nowrap; }
.cr-tabs .active { color:#0765fc; }
.cr-tabs .active::after { content:''; position:absolute; height:3px; background:#126dff; bottom:0; left:15%; right:15%; border-radius:4px; }
.cr-outline,.cr-members { display:flex; flex-direction:column; }
.cr-scroll { overflow:auto; min-height:0; padding:12px; flex:1; }
.cr-workspace [hidden] { display:none!important; }
.cr-workspace .empty { min-height:120px; padding:20px 10px; }
.cr-workspace .empty strong { font-size:12px; }
.cr-workspace .empty p { font-size:11px; }
.cr-chapter { border-radius:9px; background:#f1f6ff; padding:12px; margin-bottom:8px; }
.cr-chapter summary { font-size:13px; font-weight:700; cursor:pointer; }
.cr-chapter p { color:#7b8aa4; font-size:11px; }
.cr-schedule { width:100%; display:flex; align-items:center; gap:8px; padding:12px 10px; border:1px solid #c7ddff; background:#edf4ff; border-radius:10px; margin-bottom:8px; color:#155acc; text-align:left; }
.cr-schedule > span:nth-child(2) { min-width:0; flex:1; display:grid; gap:6px; }
.cr-schedule b { font-size:12px; }.cr-schedule small { font-size:10px; color:#7487a6; }.cr-schedule em { font-size:10px; font-style:normal; }
.cr-schedule:disabled { opacity:.65; cursor:default; }
.cr-presentation,.live-screen.cr-presentation[data-media-stage] { position:relative; display:flex; flex-direction:column; justify-content:center; min-height:0; border:3px solid #bcdcff; border-radius:15px; padding:28px; overflow:hidden; background:radial-gradient(ellipse at 95% 0%,#8edaff6b,transparent 42%),linear-gradient(145deg,#fff,#eff7ff); color:#111b45; box-shadow:0 6px 20px #1d68b515; }
.cr-presentation-bar { height:15px; position:absolute; left:0; right:0; top:0; background:linear-gradient(100deg,#1644ff,#129dff); }
.cr-stage-copy { width:100%; min-width:0; text-align:center; }
.cr-kicker { color:#2a76e5; font-size:11px; letter-spacing:.12em; }
.cr-stage-copy h2 { font-size:clamp(20px,1.8vw,31px); margin:16px 0 22px; line-height:1.4; overflow-wrap:anywhere; }
.cr-stage-copy p { color:#7588a6; line-height:1.8; font-size:12px; }
.cr-empty-presentation { display:grid; justify-items:center; align-content:center; gap:12px; padding:30px 10px; min-height:180px; border:1px dashed #c8dcf6; border-radius:14px; background:#ffffff82; }
.cr-empty-presentation > svg { width:52px!important; height:52px!important; color:#2082f5; }
.cr-empty-presentation strong { color:#496389; font-size:15px; }.cr-empty-presentation p { margin:0; }
.cr-stage-bottom { position:absolute; left:20px; right:20px; bottom:18px; display:flex; gap:7px; justify-content:center; font-size:10px; color:#7c8fac; }
.cr-enter { margin:18px auto; min-width:150px; }
.cr-presentation > .t-media-placeholder { display:none!important; }
.cr-presentation > .t-media-tile.is-screen { position:absolute; inset:0; z-index:4; min-height:0!important; border:0; border-radius:12px; }
.cr-presentation .t-media-tile.is-screen video { min-height:0!important; width:100%; height:100%; object-fit:contain; background:#0b1733; }
.cr-previews { padding:11px; }.cr-previews > header { display:flex; align-items:center; justify-content:space-between; font-size:12px; }.cr-previews > header strong { display:flex; gap:7px; align-items:center; }.cr-previews > header > span { color:#8291ae; font-size:10px; }
.cr-preview-list { display:flex; gap:8px; overflow:auto; height:78px; margin-top:7px; }.cr-preview-empty { display:flex; align-items:center; justify-content:center; gap:10px; color:#9aabc1; width:100%; font-size:11px; }
.cr-preview-list:has(.t-media-tile) .cr-preview-empty { display:none; }.cr-preview-list .t-media-tile { flex:0 0 120px; min-height:0; }.cr-preview-list .t-media-tile video { min-height:0; height:100%; width:100%; object-fit:cover; }.cr-preview-list .t-media-caption { font-size:9px; padding:10px 5px 3px; }
.cr-member-search { display:flex; align-items:center; gap:6px; background:#f1f6ff; padding:8px; border-radius:9px; color:#6882a8; }.cr-member-search input { width:100%; min-width:0; border:0; background:none; font-size:11px; outline:none; }
.cr-member-list .list-row { min-height:45px; padding:7px 0; gap:8px; }.cr-member-list .avatar { width:28px; height:28px; font-size:11px; }.cr-member-list .row-title { font-size:12px; }.cr-member-list .row-sub { font-size:9px; }
.cr-chat { display:flex; flex-direction:column; }.cr-chat .chat-box { height:auto; flex:1; min-height:0; overflow:auto; padding:12px; }.cr-chat .chat-compose { padding:10px; border-top:1px solid #edf1fa; }.cr-chat > .spacer-12,.cr-chat > .btn { display:none; }.cr-chat .chat-bubble { font-size:12px; border-radius:10px; }.cr-chat .chat-author { font-size:10px; }.cr-chat > .empty { flex:1; }
.cr-footer { display:flex; gap:clamp(5px,1vw,20px); align-items:center; padding:8px 10px; border-top:1px solid #dce8f8; background:linear-gradient(110deg,#fff,#f3f8ff); border-radius:12px; min-width:0; }
.cr-tool { display:grid; justify-items:center; align-content:center; gap:7px; border:1px solid transparent; border-radius:10px; padding:8px 12px; min-height:65px; background:transparent; color:#182b55; font-size:12px; white-space:nowrap; }.cr-tool svg { color:#103874; }.cr-tool:hover { background:#eaf2ff; }.cr-tool:disabled { opacity:.4; cursor:not-allowed; }.cr-tool.is-active { color:#087852; background:#e8f8f1; }.cr-tool.is-active svg { color:#13a67a; }.cr-lab { border-color:#c8daff; background:linear-gradient(#dce8ff,#fafcff); color:#0659ed; }.cr-lab svg { color:#126cff; }.cr-footer i { width:1px; height:34px; background:#dce7f8; }.cr-exit { margin-left:auto; border:1px solid #ff475e; border-radius:9px; color:#ef304a; background:#fff; padding:11px 13px; font-size:12px; display:flex; align-items:center; gap:6px; white-space:nowrap; }
@media (max-width:1280px) { .cr-workspace { height:calc(100dvh - 80px); grid-template-rows:74px minmax(0,1fr) 80px; gap:9px; padding-inline:10px; }.cr-columns { grid-template-columns:210px minmax(0,1fr) 265px; gap:10px; }.cr-title h1 { font-size:17px; }.cr-tool { padding-inline:6px; font-size:10px; }.cr-left { grid-template-rows:160px minmax(0,1fr); }.cr-status { font-size:10px; padding:8px; }.cr-presentation { padding:20px; } }
@media (max-width:1000px) { .cr-workspace { height:auto; grid-template-rows:auto auto auto; }.cr-columns { grid-template-columns:210px minmax(0,1fr); }.cr-right { grid-column:1/-1; grid-template-columns:1fr 1fr; grid-template-rows:300px; }.cr-center { min-height:500px; }.cr-left { min-height:500px; }.cr-footer { flex-wrap:wrap; }.cr-status { max-width:140px; }.cr-title h1 { white-space:normal; } }
@media (max-width:700px) { .cr-columns { grid-template-columns:1fr; }.cr-right { grid-column:auto; grid-template-columns:1fr; grid-template-rows:260px 280px; }.cr-left { min-height:350px; }.cr-header { flex-wrap:wrap; }.cr-title { min-width:150px; }.cr-footer { gap:4px; }.cr-tool { flex:1; }.cr-exit { margin-left:0; } }