.classroom-display-actions{display:flex;align-items:center;gap:7px}.classroom-display-trigger{display:inline-flex;align-items:center;gap:7px;height:36px;padding:0 12px;border:1px solid color-mix(in srgb,var(--primary) 26%,var(--border));border-radius:11px;background:var(--primary-bg);color:var(--primary);font:inherit;font-size:12px;font-weight:750;cursor:pointer;white-space:nowrap}.classroom-display-trigger svg{width:17px;height:17px}.classroom-soft-refresh{display:grid;place-items:center;width:36px;height:36px;padding:0;border:1px solid var(--border);border-radius:11px;background:var(--surface-raised);color:var(--text-secondary);cursor:pointer}.classroom-soft-refresh:hover{border-color:var(--primary);color:var(--primary)}.classroom-soft-refresh svg{width:17px;height:17px}.classroom-soft-refresh.is-refreshing svg{animation:classroom-display-spin .7s linear infinite}.classroom-display-modal{width:min(760px,calc(100vw - 32px))}.classroom-display-active{display:flex;align-items:center;gap:12px;margin-bottom:16px;padding:12px 14px;border:1px solid color-mix(in srgb,var(--success) 28%,var(--border));border-radius:13px;background:color-mix(in srgb,var(--success) 8%,var(--surface));color:var(--success)}.classroom-display-active>svg{width:24px;height:24px}.classroom-display-active>div{display:grid;gap:2px}.classroom-display-active small{color:var(--text-secondary)}.classroom-display-mode-choice{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-bottom:16px}.classroom-display-mode-choice button{display:grid;grid-template-columns:38px minmax(0,1fr);align-items:center;gap:2px 10px;padding:12px;border:1px solid var(--border);border-radius:13px;background:var(--surface);color:var(--text-primary);font:inherit;text-align:left;cursor:pointer}.classroom-display-mode-choice button>span{display:grid;width:38px;height:38px;grid-row:1/3;place-items:center;border-radius:11px;background:var(--surface-raised);color:var(--primary)}.classroom-display-mode-choice svg{width:20px;height:20px}.classroom-display-mode-choice strong{font-size:13px}.classroom-display-mode-choice small{color:var(--text-tertiary);font-size:11px;line-height:1.4}.classroom-display-mode-choice button:hover,.classroom-display-mode-choice button.active{border-color:var(--primary);background:var(--primary-bg)}.classroom-display-mode-choice button.active>span{background:var(--primary);color:#fff}.classroom-display-pair-hint{align-self:center;color:var(--text-secondary);font-size:12px}.classroom-display-view-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:14px 0}.classroom-display-view{position:relative;display:grid;grid-template-columns:42px minmax(0,1fr);align-items:center;gap:10px;padding:12px;border:1px solid var(--border);border-radius:13px;background:var(--surface);cursor:pointer}.classroom-display-view:has(input:checked){border-color:var(--primary);background:var(--primary-bg);box-shadow:0 0 0 2px color-mix(in srgb,var(--primary) 10%,transparent)}.classroom-display-view input{position:absolute;opacity:0}.classroom-display-view-icon{display:grid;place-items:center;width:42px;height:42px;border-radius:12px;background:var(--surface-raised);color:var(--primary)}.classroom-display-view-icon svg{width:21px;height:21px}.classroom-display-view>span:last-child{display:grid;gap:2px}.classroom-display-view strong{color:var(--text-primary);font-size:14px}.classroom-display-view small,.classroom-display-subject small{color:var(--text-tertiary);font-size:11px}.classroom-display-help{margin:12px 0 0;padding:10px 12px;border-radius:11px;background:color-mix(in srgb,var(--primary) 6%,var(--surface));color:var(--text-secondary);font-size:12px;line-height:1.6}.classroom-display-loading{display:flex;align-items:center;justify-content:center;gap:10px;min-height:130px;color:var(--text-secondary)}.classroom-display-loading svg{width:20px;animation:classroom-display-spin 1s linear infinite}@keyframes classroom-display-spin{to{transform:rotate(360deg)}}
body.classroom-display-mode{overflow:auto;background:var(--bg)}body.classroom-display-mode #sidebar,body.classroom-display-mode #sidebar-overlay,body.classroom-display-mode #topbar-drawer,body.classroom-display-mode #development-channel-badge,body.classroom-display-mode #ai-fab{display:none!important}body.classroom-display-mode #main-wrapper{width:100%;margin:0}body.classroom-display-mode #content{max-width:none;padding:24px 32px 48px}body.classroom-display-mode #content button,body.classroom-display-mode #content input,body.classroom-display-mode #content select,body.classroom-display-mode #content textarea{pointer-events:none}body.classroom-display-mode #content .btn,body.classroom-display-mode #content .icon-button,body.classroom-display-mode #content .tabs,body.classroom-display-mode #content .dashboard-tabs,body.classroom-display-mode #content .academic-subject-tabs,body.classroom-display-mode #content .student-view-toolbar,body.classroom-display-mode #content .student-view-switch,body.classroom-display-mode #content .goal-header-actions,body.classroom-display-mode #content .student-point-tools,body.classroom-display-mode #content .student-point-card footer,body.classroom-display-mode #content .attendance-toolbar,body.classroom-display-mode #content .attendance-record-action,body.classroom-display-mode #content .homework-task-actions,body.classroom-display-mode #content .exam-header-actions,body.classroom-display-mode #content .grade-analysis-filter,body.classroom-display-mode #content .schedule-toolbar{display:none!important}body.classroom-display-mode #content .homework-task-details[hidden]{display:block!important}body.classroom-display-mode #content .module-header{margin-bottom:20px}body.classroom-display-mode #content .module-title{font-size:24px}.classroom-display-header{position:sticky;top:0;z-index:500;display:flex;align-items:center;justify-content:space-between;min-height:72px;padding:10px 24px;border-bottom:1px solid var(--border);background:color-mix(in srgb,var(--surface) 92%,transparent);backdrop-filter:blur(16px)}.classroom-display-brand{display:flex;align-items:center;gap:12px;min-width:0}.classroom-display-brand img{width:42px;height:42px}.classroom-display-brand>div{display:grid;gap:2px;min-width:0}.classroom-display-brand strong{color:var(--text-primary);font-size:17px}.classroom-display-brand small{overflow:hidden;color:var(--text-secondary);font-size:12px;text-overflow:ellipsis;white-space:nowrap}.classroom-display-header-actions{display:flex;align-items:center;gap:9px}.classroom-display-sync{display:inline-flex;align-items:center;gap:6px;margin-right:3px;color:var(--success);font-size:12px;font-style:normal}.classroom-display-sync svg{width:15px}.classroom-display-sync i{font-style:normal}.classroom-display-sync.is-syncing svg{animation:classroom-display-spin .8s linear infinite}.classroom-display-ended{position:fixed;inset:0;z-index:5000;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;background:color-mix(in srgb,var(--surface) 94%,transparent);color:var(--text-primary);backdrop-filter:blur(16px)}.classroom-display-ended svg,.classroom-display-error>svg{width:48px;height:48px;color:var(--success)}.classroom-display-ended strong{font-size:22px}.classroom-display-ended span{color:var(--text-secondary)}.classroom-display-error{display:flex;min-height:60vh;flex-direction:column;align-items:center;justify-content:center;gap:12px;text-align:center}.classroom-display-error>svg{color:var(--warning)}.classroom-display-error h2,.classroom-display-error p{margin:0}.classroom-display-error p{color:var(--text-secondary)}
@media(max-width:768px){.classroom-display-trigger{width:36px;padding:0;justify-content:center}.classroom-display-trigger span{display:none}.classroom-display-mode-choice,.classroom-display-view-grid{grid-template-columns:1fr}.classroom-display-header{padding:9px 12px}.classroom-display-header-actions .btn{width:36px;overflow:hidden;padding:0;font-size:0}.classroom-display-header-actions .btn svg{width:17px;margin:0}.classroom-display-sync i{display:none}body.classroom-display-mode #content{padding:18px 14px 36px}}
.classroom-display-pair-control{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:16px;padding:15px 16px;border:1px solid color-mix(in srgb,var(--primary) 24%,var(--border));border-radius:14px;background:linear-gradient(135deg,color-mix(in srgb,var(--primary) 9%,var(--surface)),var(--surface))}.classroom-display-pair-control>div:first-child{display:grid;gap:4px}.classroom-display-pair-control strong{color:var(--text-primary);font-size:14px}.classroom-display-pair-control small{color:var(--text-secondary);font-size:12px;line-height:1.5}.classroom-display-pair-control a{color:var(--primary);font-weight:700;text-decoration:none;overflow-wrap:anywhere}.classroom-display-pair-control a:hover{text-decoration:underline}.classroom-display-pair-control>div:last-child{display:flex;gap:8px}.classroom-display-pair-control input{width:142px;text-align:center;text-transform:uppercase;letter-spacing:1.5px;font-weight:800}.classroom-display-pairing{display:flex;min-height:calc(100vh - 150px);flex-direction:column;align-items:center;justify-content:center;padding:36px;text-align:center}.classroom-display-pairing-icon{display:grid;place-items:center;width:88px;height:88px;margin-bottom:24px;border-radius:28px;background:linear-gradient(145deg,var(--primary),color-mix(in srgb,var(--primary) 62%,#725cff));color:#fff;box-shadow:0 18px 50px color-mix(in srgb,var(--primary) 24%,transparent)}.classroom-display-pairing-icon svg{width:43px;height:43px}.classroom-display-pairing>span{color:var(--text-secondary);font-size:17px}.classroom-display-pairing h1{margin:18px 0 12px;color:var(--text-primary);font-size:clamp(44px,8vw,84px);line-height:1;letter-spacing:.16em}.classroom-display-pairing p{max-width:560px;margin:0;color:var(--text-secondary);font-size:15px;line-height:1.7}.classroom-display-pairing-wait{display:inline-flex;align-items:center;gap:9px;margin-top:28px;padding:10px 16px;border-radius:999px;background:var(--primary-bg);color:var(--primary)}.classroom-display-pairing-wait svg{width:18px;animation:classroom-display-spin .9s linear infinite}.classroom-display-pairing-wait strong{font-size:13px}
@media(max-width:768px){.classroom-display-pair-control{align-items:stretch;flex-direction:column}.classroom-display-pair-control>div:last-child{width:100%}.classroom-display-pair-control input{min-width:0;flex:1}.classroom-display-pairing{min-height:calc(100vh - 120px);padding:24px 8px}.classroom-display-pairing h1{font-size:clamp(38px,12vw,58px)}}
.classroom-display-unavailable{display:flex;align-items:center;gap:12px;margin-bottom:16px;padding:14px 16px;border:1px solid color-mix(in srgb,var(--warning) 34%,var(--border));border-radius:14px;background:color-mix(in srgb,var(--warning) 9%,var(--surface));color:var(--warning)}.classroom-display-unavailable>svg{width:24px;height:24px;flex:none}.classroom-display-unavailable>div{display:grid;gap:3px}.classroom-display-unavailable strong{color:var(--text-primary);font-size:14px}.classroom-display-unavailable small{color:var(--text-secondary);font-size:12px}.classroom-display-preparation{width:min(860px,100%);margin:18px auto;padding:24px;border:1px solid var(--border);border-radius:20px;background:var(--surface);box-shadow:var(--shadow-sm)}.classroom-display-preparation>header{display:flex;align-items:center;gap:14px;margin-bottom:22px}.classroom-display-preparation>header>span{display:grid;place-items:center;width:52px;height:52px;border-radius:15px;background:var(--primary-bg);color:var(--primary)}.classroom-display-preparation>header svg{width:27px;height:27px}.classroom-display-preparation h1,.classroom-display-preparation p{margin:0}.classroom-display-preparation h1{color:var(--text-primary);font-size:22px}.classroom-display-preparation p{margin-top:4px;color:var(--text-secondary);font-size:13px}.classroom-display-preparation-body{padding:20px;border-radius:16px;background:var(--surface-raised)}.classroom-display-preparation>footer{display:flex;justify-content:flex-end;margin-top:20px}.classroom-display-preparing #content button,.classroom-display-preparing #content input,.classroom-display-preparing #content select{pointer-events:auto!important}.classroom-display-preparing #content .btn{display:inline-flex!important}
@media(max-width:768px){.classroom-display-preparation{margin:0;padding:16px;border-radius:16px}.classroom-display-preparation-body{padding:14px}.classroom-display-preparation>header{align-items:flex-start}.classroom-display-preparation h1{font-size:19px}.classroom-display-preparation>footer .btn{width:100%;justify-content:center}}
body.classroom-display-mode.classroom-display-preparing #content .btn{display:inline-flex!important}
.classroom-display-trigger,.classroom-soft-refresh{display:grid;width:36px;height:36px;place-items:center;padding:0;border:1px solid var(--border);border-radius:11px;background:var(--surface-raised);color:var(--text-secondary);transition:border-color .18s,background .18s,color .18s,transform .18s}.classroom-display-trigger:hover,.classroom-soft-refresh:hover{border-color:var(--primary);background:var(--primary-bg);color:var(--primary);transform:translateY(-1px)}
.classroom-display-controller,.classroom-display-launcher{display:grid;gap:12px}.classroom-display-controller{padding-bottom:18px;border-bottom:1px solid var(--border)}.classroom-display-launcher{padding-top:18px}.classroom-display-controller>header,.classroom-display-launcher>header{display:flex;align-items:center;justify-content:space-between}.classroom-display-controller header>div,.classroom-display-launcher header>div{display:grid;gap:2px}.classroom-display-controller header strong,.classroom-display-launcher header strong{color:var(--text-primary);font-size:15px}.classroom-display-controller header small,.classroom-display-launcher header small{color:var(--text-tertiary);font-size:11px}.classroom-display-controller-row{display:flex;align-items:stretch;gap:10px}.classroom-display-status{display:grid;min-width:0;flex:1;grid-template-columns:38px minmax(0,1fr) auto;align-items:center;gap:11px;padding:12px 14px;border:1px solid;border-radius:13px;font:inherit;text-align:left}.classroom-display-status.online{border-color:color-mix(in srgb,var(--success) 35%,var(--border));background:color-mix(in srgb,var(--success) 9%,var(--surface));color:var(--success);cursor:pointer}.classroom-display-status.online:hover{background:color-mix(in srgb,var(--success) 14%,var(--surface))}.classroom-display-status.offline{border-color:color-mix(in srgb,var(--danger) 32%,var(--border));background:color-mix(in srgb,var(--danger) 8%,var(--surface));color:var(--danger)}.classroom-display-status>span:first-child{display:grid;width:38px;height:38px;place-items:center;border-radius:11px;background:color-mix(in srgb,currentColor 11%,var(--surface))}.classroom-display-status>span:nth-child(2){display:grid;gap:2px}.classroom-display-status strong{color:var(--text-primary);font-size:13px}.classroom-display-status small{color:var(--text-secondary);font-size:11px}.classroom-display-status svg{width:19px;height:19px}.classroom-display-status>svg:last-child{width:16px}.classroom-display-controller-actions{display:flex;align-items:center;gap:7px}.classroom-display-launcher .classroom-display-mode-choice{margin:0}.classroom-display-expanded{display:grid;gap:14px;margin-top:18px;padding-top:18px;border-top:1px solid var(--border)}.classroom-display-expanded>h3{margin:0;color:var(--text-primary);font-size:14px}.classroom-display-remote-methods{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.classroom-display-remote-methods>div{display:grid;gap:4px;padding:12px;border:1px solid var(--border);border-radius:12px;background:var(--surface-raised)}.classroom-display-remote-methods strong{color:var(--text-primary);font-size:13px}.classroom-display-remote-methods small{color:var(--text-secondary);font-size:11px;line-height:1.55}.classroom-display-remote-methods a{color:var(--primary);font-weight:700;text-decoration:none;overflow-wrap:anywhere}
@media(max-width:768px){.classroom-display-controller-row{flex-direction:column}.classroom-display-controller-actions{justify-content:flex-end}.classroom-display-remote-methods{grid-template-columns:1fr}.classroom-display-expanded{margin-top:14px;padding-top:14px}}
