/* Approved visual layer. Business selectors, forms and role permissions stay in app.js. */
#teacherApp .roster-compact-switch{display:block;background:transparent;border:0;padding:0;margin:0 0 24px}
.roster-method-switch{display:flex;flex-wrap:wrap;gap:5px;width:fit-content;max-width:100%;padding:5px;margin-bottom:20px;background:#f0f4ed;border-radius:12px}
.roster-method-switch button{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:42px;padding:8px 16px;border:0;border-radius:9px;background:transparent;color:#63775e;font-size:14px;font-weight:600}
.roster-method-switch button[aria-pressed="true"]{background:#fff;color:#286652;box-shadow:0 2px 6px #25342e12}
.roster-method-switch button:hover{color:#286652;background:#e5eddf}
#teacherApp .roster-compact-switch .teacher-class-add-student{grid-template-columns:minmax(0,1fr) auto;gap:10px 12px;align-items:end}
#teacherApp .roster-compact-switch .teacher-class-add-student label>span,#teacherApp .roster-compact-switch .teacher-class-import-students>div b{display:block;font-size:14px;font-weight:650;margin:0 0 12px;color:#38594f}
#teacherApp .roster-compact-switch .teacher-class-add-student input{height:50px}
#teacherApp .roster-compact-switch .teacher-class-add-student>button{height:50px;min-width:140px;background:#286652;color:#fff;border:0;display:inline-flex;align-items:center;justify-content:center;gap:12px;padding:0 20px}
#teacherApp .roster-compact-switch .teacher-class-import-students{grid-template-columns:minmax(0,1fr);gap:0;padding:0;border:0}
#teacherApp .roster-compact-switch #chooseStudentRosterBtn{width:100%;min-height:50px;display:flex;align-items:center;justify-content:center;gap:14px;font-size:14px;color:#286652;border-color:#cfddc8;background:#fff}
.roster-action-arrow{width:24px;height:24px;flex:none}
#teacherApp .roster-compact-switch p:empty{display:none}
#teacherApp .roster-compact-switch .teacher-review-message:not(:empty){margin-top:10px}
@media(max-width:480px){#teacherApp .roster-compact-switch .teacher-class-add-student{grid-template-columns:minmax(0,1fr)}#teacherApp .roster-compact-switch .teacher-class-add-student>button{width:100%}.roster-method-switch{width:100%}.roster-method-switch button{flex:1;padding:8px;gap:6px;font-size:13px}}
#teacherApp .teacher-class-detail-head>div:first-child>span{display:none}
#teacherApp .teacher-class-detail-head .class-term-summary{display:block;margin:10px 0 0;padding:0;background:transparent;color:#365c46;font-size:15px;font-weight:650;line-height:1.5}
#teacherApp .teacher-class-detail-actions .class-student-count{display:flex;align-items:center;gap:4px;min-width:0;padding:12px 16px;border-radius:12px;background:#e5eee4;white-space:nowrap}
#teacherApp .class-student-count>span{font-size:14px;color:#456452;font-weight:600}
#teacherApp .class-student-count>strong{font-size:24px;line-height:1.2;color:#286652}
#backTeacherClassListBtn{display:inline-flex;align-items:center;gap:9px;padding:9px 13px;border:1px solid #dce4d7;border-radius:10px;background:#fff;color:#365c46;font-size:14px;font-weight:650}
#backTeacherClassListBtn svg{width:24px;height:24px;flex:none}
#backTeacherClassListBtn:hover{background:#edf3e8;border-color:#b9cbb0}
#teacherCreateClassForm{grid-template-columns:clamp(180px,14vw,198px) minmax(0,1fr)}
#teacherCreateClassForm .academic-term-selects{grid-template-columns:minmax(0,1fr) 72px}
#teacherCreateClassForm label,#teacherCreateClassForm .custom-select{min-width:0}
#teacherCreateClassForm .academic-term-selects .custom-select-trigger{gap:4px;padding-inline:10px}
@media(max-width:600px){#teacherCreateClassForm{grid-template-columns:minmax(0,1fr)}#teacherCreateClassForm .academic-term-selects{grid-template-columns:minmax(0,1fr) 72px}}
#teacherApp .teacher-account-box{margin-top:auto}
#teacherApp .teacher-seed-message .assistant-bubble{width:min(100%,520px);max-width:100%;background:transparent;border:0;padding:0}
#teacherApp .teacher-seed-message .suggested-questions{margin-top:22px}
#teacherChatMessages:has(>.message-row:not(.teacher-seed-message))>.teacher-seed-message{display:none}
:root{--blue:#286652;--ink:#25342e;--muted:#788477;--line:#e1e6dc;--bg:#f7f8f4}
.brand-mark{background:#286652;box-shadow:none}
.sidebar{background:#f0f2ed;color:#25342e;border-right:1px solid var(--line)}
.sidebar-brand{align-items:center;gap:10px;padding-bottom:28px}
.sidebar-brand strong{font-size:21px;font-weight:800;white-space:nowrap}
.sidebar-brand span,.topbar .eyebrow,.workflow-status small{display:none}
.nav-item{color:#667068;gap:9px}.nav-item:hover{background:#e6ecdf;color:#286652}
.nav-item.active{background:white;color:#286652;box-shadow:0 2px 5px #273b2910}
.nav-item em{background:#dce7d6;color:#49643c}
.ui-nav-icon{width:20px;height:20px;fill:#dbe8d7;stroke:#36624c;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;vertical-align:middle}
.ui-nav-icon .detail{fill:none}
.sidebar .account-box{border-color:#dce2d7}.sidebar .account-copy strong{color:#354c3d}
.sidebar .account-copy span,.sidebar-registration{color:#7b8974}
.sidebar .avatar{background:#e1e8db;color:#49643c}.sidebar .dots{color:#5b705e}.sidebar .dots:hover{color:#286652;background:#dfe7d9}
.sidebar .account-menu{background:white;border:1px solid #dce2d7;box-shadow:0 8px 30px #25342e20}
.sidebar .account-menu button{color:#354c3d}.sidebar .account-menu button:hover{background:#f0f3eb}.sidebar .account-menu .danger{color:#aa4e43}
.sidebar *{scrollbar-width:thin;scrollbar-color:#9ba894 transparent}
.sidebar *::-webkit-scrollbar{width:7px}.sidebar *::-webkit-scrollbar-track{background:transparent}.sidebar *::-webkit-scrollbar-thumb{background:#9ba894;border-radius:9px}.sidebar *::-webkit-scrollbar-button{display:none}
.sidebar-content-tabs{background:#e4eadf;border-color:#dce2d7}.sidebar-content-tabs button{color:#667662}.sidebar-content-tabs button.active{color:#286652;background:#fff}
.new-chat-btn{color:#35553e;background:#e5eddf;border-color:#d1deca;margin-bottom:14px}.new-chat-btn:hover{background:#dce8d5;color:#286652}
.conversation-history-head,.conversation-history-count{color:#64785e}.conversation-search{background:#fff;border-color:#d8e1d3;color:#667662}.conversation-search input{color:#354c3d}
.conversation-history-item{color:#354c3d;padding:11px 10px}.conversation-history-item strong{color:inherit;font-size:14px;line-height:1.5}.conversation-history-item small{font-size:12px;line-height:1.5;color:#596c55}.conversation-history-empty{font-size:13px;color:#596c55}
.sidebar .conversation-history-head{font-size:14px;color:#45613f}.sidebar .conversation-history-head span{font-size:12px}
.sidebar .conversation-history-item small,.sidebar .conversation-history-item.active small{color:#596c55}
.sidebar .conversation-search input{font-size:14px}.sidebar .account-copy strong{font-size:15px}.sidebar .account-copy span{font-size:13px;color:#596c55}.sidebar .sidebar-registration{font-size:12px;color:#596c55}
@media(min-width:1600px){.sidebar .conversation-history-item strong{font-size:15px}.sidebar .conversation-history-item small{font-size:13px}.sidebar .nav-item{font-size:16px}.sidebar .sidebar-content-tabs button{font-size:14px}}
.conversation-history-item:hover,.conversation-history-item.active{background:#e0e9db;color:#286652}
#surveyCourseFolder{display:flex;justify-content:space-between;align-items:center;color:#435548;padding:10px 2px;gap:8px}
#surveyCourseFolder strong{font-size:14px;color:inherit}
#surveyCourseFolder b{width:32px;height:32px;display:grid;place-items:center;border-radius:50%;background:#e0ebd9;transform:none;color:#516f4d}
#surveyCourseFolder b svg{width:20px;height:20px;transition:transform 460ms cubic-bezier(.2,1.65,.4,1)}
#surveyCourseFolder[aria-expanded="false"] b svg{transform:rotate(-90deg)}
.course-folder-children{border-color:#d5ded0}.course-resource-folder{color:#677662}.course-resource-folder.active{background:#dfe9d9;color:#355132}
.course-material-item{grid-template-columns:38px minmax(0,1fr);gap:10px;min-height:58px;border:0;border-radius:10px;padding:9px;color:#355342}
.course-material-item:hover,.course-material-item.active{background:#e1e9df;color:#284a38}
.course-material-item>span,.material-badge{height:38px;min-width:38px;display:grid;place-items:center;border:0;border-radius:9px;background:linear-gradient(145deg,#fff1e4,#f0d8c4);color:#904b25;font-size:10px;font-weight:800;box-shadow:0 3px 6px #79513924,0 8px 15px #79513910;flex:none}
.course-material-item[data-extension="PDF"]>span{background:linear-gradient(145deg,#f7ece8,#e6d3cc);color:#864337}
.course-material-item small,.course-material-item>b{display:none}.course-material-item strong{font-size:13px;font-weight:500;color:inherit;margin:0}
#studentApp{--sidebar-width:224px;--reader-width:540px;grid-template-columns:var(--sidebar-width) minmax(0,1fr);position:relative}
#studentApp>.sidebar{width:var(--sidebar-width);padding:24px 14px 14px}
#studentApp>main{min-width:0;display:flex;flex-direction:column}
#studentApp .topbar{height:76px;flex:0 0 76px;padding:0 28px;border-bottom:1px solid var(--line);background:white;display:flex;justify-content:space-between;align-items:center}
#studentApp .topbar h2{font-size:16px}
#studentApp .page{height:calc(100dvh - 76px);flex:1;min-height:0}
#studentApp #assistantPage{overflow:hidden}
#studentApp #assistantPage .workspace{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 0px;height:100%;padding:0;gap:0;background:white;overflow:hidden;transition:grid-template-columns 420ms cubic-bezier(.22,.85,.25,1)}
#studentApp #assistantPage .workspace.course-preview-open{grid-template-columns:minmax(0,1fr) var(--reader-width)}
#studentApp #assistantPage .workspace .chat-panel{grid-column:1;width:100%;min-width:0;display:flex;flex-direction:column;border:0;border-radius:0;box-shadow:none;background:white;overflow:hidden}
#studentApp .chat-messages{flex:1;min-height:0;padding:28px clamp(20px,4vw,60px);scrollbar-width:thin;scrollbar-color:#9ba894 transparent}
#studentApp .chat-messages:has(>.seed-message:only-child){display:flex;flex-direction:column;justify-content:center;padding-inline:max(24px,calc((100% - 960px)/2 + 24px))}
#studentApp .seed-message{display:block;max-width:650px;width:100%;margin:auto 0;text-align:left;align-self:flex-start}
#studentApp .seed-message .message-avatar{width:52px;height:52px;border-radius:17px;font-size:25px;background:#eaf3ee;color:#286652;margin-bottom:24px}
#studentApp .seed-message .message-bubble{background:none;border:0;padding:0;max-width:none;width:100%}
#studentApp .seed-message h1{font-size:clamp(24px,2.2vw,36px);line-height:1.5;margin:0 0 26px;color:#25342e;letter-spacing:-1px}
#studentApp .chat-messages:has(>.message-row:not(.seed-message))>.seed-message{display:none}
.suggested-questions{display:grid;gap:10px;width:100%;max-width:440px}
.suggested-questions button{text-align:left;border:1px solid #e7e8e2;border-radius:12px;background:#f8f9f5;color:#54624f;padding:15px 18px;font-size:14px;animation:question-enter 480ms ease both}
.suggested-questions button:nth-child(2){animation-delay:140ms}.suggested-questions button:nth-child(3){animation-delay:280ms}
.suggested-questions button:hover{background:#edf2e8;border-color:#cad8be}
@keyframes question-enter{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
.suggestion-refresh{display:inline-flex;align-items:center;gap:7px;margin-top:12px;padding:8px 12px;border:1px solid #d8e1d3;border-radius:10px;background:#f8faf5;color:#526b50;font-size:13px}
.suggestion-refresh svg{width:16px;height:16px}.suggestion-refresh:hover{background:#edf3e8;border-color:#b9cbb0}
#studentApp #assistantPage .workspace .composer-wrap{width:100%;max-width:960px;align-self:center;padding:16px 24px 24px;border:0;background:white;flex:none}
#studentApp .composer{border:1px solid #dadfd4;border-radius:20px;padding:16px 18px;box-shadow:0 6px 28px #243f2510}
#studentApp .composer textarea{font-size:15px;line-height:1.7;min-height:60px}
.composer-tools>span,.composer-send>span{display:none}
.composer .attach-btn{background:#f2f5ee;color:#536e50;border:0;border-radius:10px}
#studentApp #sendBtn,#teacherApp #teacherSendBtn{width:38px;height:38px;display:grid;place-items:center;flex:none;border:0;border-radius:50%;background:#286652;color:white;padding:0}
.ui-send-icon{width:22px;height:22px}.user-bubble{background:#e8f2e9;color:#25342e;min-width:0;overflow-wrap:anywhere}.assistant-bubble{border-color:#e1e6dc}
#studentApp #assistantPage .workspace #coursePreviewPanel{position:absolute;top:0;right:12px;bottom:12px;width:calc(var(--reader-width) - 12px);height:auto;min-height:0;display:flex;flex-direction:column;border:1px solid #dce2d7;border-radius:18px;background:#e8ece5;z-index:5;transform:translateX(calc(100% + 12px));visibility:hidden;pointer-events:none;transition:transform 420ms cubic-bezier(.22,.85,.25,1),visibility 0s 420ms;overflow:hidden}
#studentApp #assistantPage .workspace.course-preview-open #coursePreviewPanel{transform:translateX(0);visibility:visible;pointer-events:auto;transition:transform 420ms cubic-bezier(.22,.85,.25,1),visibility 0s}
#studentApp .course-preview-head{height:64px;min-height:64px;flex:none;background:#f8faf6;justify-content:flex-start;gap:11px;padding:10px 16px;border-color:#dce2d7}
#studentApp .course-preview-head>div{min-width:0;flex:1}.course-preview-head strong{margin:0}
#studentApp .course-preview-download{display:block;color:inherit;text-decoration:none;border-radius:7px;padding:5px 0;min-width:0}
#studentApp .course-preview-download:hover{text-decoration:underline;text-underline-offset:3px}
#studentApp .course-preview-head .material-badge{height:28px;min-width:34px;font-size:9px;box-shadow:none}
#studentApp .course-pdf-toolbar{display:none}
#studentApp .course-pdf-viewer{display:flex;flex-direction:column;flex:1;min-height:0;background:#e8ece5}
#studentApp .course-pdf-canvas-wrap{flex:1;min-height:0;background:#e8ece5;scrollbar-color:#9ba894 transparent;padding:12px}
#studentApp .course-pdf-page canvas{width:100%!important;max-width:100%;height:auto!important;box-shadow:0 3px 10px #25342e12}
#studentApp .course-preview-status{flex:none;padding:14px;background:#f1f4ec}
#studentApp #coursePreviewFrame{flex:1;min-height:0}
.reader-toggle{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-width:112px;height:38px;border:1px solid #e1e6dc;background:white;border-radius:9px;padding:8px 12px;color:#526657;font-size:12px;cursor:pointer}
.reader-toggle:hover{background:#f3f7ef;border-color:#c7d6bd}.reader-label-window{display:block;height:20px;width:4em;overflow:hidden;perspective:100px}
.reader-label-reel{display:block;transition:transform 420ms cubic-bezier(.22,.85,.25,1)}.reader-label-reel>span{display:block;height:20px;line-height:20px;white-space:nowrap}
.reader-toggle[aria-expanded="true"] .reader-label-reel{transform:translateY(-20px)}
.reader-toggle-icons{position:relative;width:16px;height:16px}.reader-toggle-icons svg{position:absolute;inset:0;width:16px;height:16px;transition:opacity 260ms ease,transform 380ms ease}
.reader-toggle-close{opacity:0;transform:rotate(-90deg) scale(.5)}.reader-toggle[aria-expanded="true"] .reader-toggle-arrow{opacity:0;transform:rotate(90deg) scale(.5)}.reader-toggle[aria-expanded="true"] .reader-toggle-close{opacity:1;transform:none}
.ui-divider{position:absolute;top:0;bottom:0;width:10px;transform:translateX(-50%);z-index:24;background:transparent;border:0;padding:0;cursor:col-resize;touch-action:none}
.ui-divider::after{content:'';position:absolute;inset:0 auto 0 4px;width:2px;background:#dce2d7}.ui-divider:hover::after,.ui-divider:focus-visible::after{background:#6c9678;box-shadow:0 0 0 2px #6c967822}
#studentApp.is-resizing,#studentApp.is-resizing *{cursor:col-resize!important;user-select:none!important}#studentApp.is-resizing .workspace{transition:none!important}
button:focus-visible,a:focus-visible{outline:2px solid #286652;outline-offset:3px}
@media(max-width:760px){
 #studentApp{display:grid;grid-template-columns:64px minmax(0,1fr)!important}
 #studentApp>.sidebar{position:relative;width:64px;height:100dvh;flex-direction:column;padding:16px 7px;gap:12px;align-items:stretch}
 #studentApp .sidebar-brand{padding:0;justify-content:center}#studentApp .sidebar-brand>div:last-child{display:none}
 #studentApp .sidebar nav{display:flex;gap:8px}#studentApp .nav-item{display:flex;justify-content:center;padding:0}#studentApp .nav-item>span,#studentApp .nav-item em{display:none}
 #studentApp .conversation-history-panel{position:absolute;top:160px;left:64px;bottom:90px;width:min(270px,calc(100vw - 80px));background:#f0f2ed;border:1px solid #dce2d7;border-radius:12px;padding:12px;z-index:30;display:none}
 #studentApp.library-visible .conversation-history-panel:not([hidden]){display:flex}
 #studentApp .account-box{margin: auto 0 0;flex-wrap:wrap;justify-content:center}#studentApp .account-copy,#studentApp .sidebar-registration{display:none}#studentApp .account-menu{bottom:45px;top:auto;left:0;right:auto;width:160px}
 #studentApp .topbar{padding:0 12px;gap:8px}#studentApp .topbar h2{font-size:14px}
 #studentApp #assistantPage .workspace.course-preview-open{grid-template-columns:minmax(0,1fr) 0px}
 #studentApp #assistantPage .workspace #coursePreviewPanel{width:calc(100% - 12px)}
 #studentApp #assistantPage .workspace .composer-wrap{padding:12px}#studentApp .chat-messages{padding:24px 16px}
 #studentApp .chat-messages:has(>.seed-message:only-child){padding-inline:12px}
 .ui-divider{display:none}.reader-toggle{min-width:104px;padding:8px}
 #studentApp .mobile-library-toggle{display:block}
}
.mobile-library-toggle{display:none;border:0;border-radius:8px;background:#e5eddf;color:#35553e;padding:8px;font-size:12px}
@media(prefers-reduced-motion:reduce){#studentApp .workspace,#studentApp #assistantPage .workspace #coursePreviewPanel,.reader-label-reel,.reader-toggle-icons svg,#surveyCourseFolder b svg{transition:none!important}.suggested-questions button{animation:none}}
.ui-arrow-right,.ui-arrow-left,.ui-arrow-out,.ui-arrow-down{display:inline-block;width:1.4em;height:1.4em;min-width:20px;min-height:20px;flex:none;vertical-align:-.3em;background:currentColor;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 12h16m-7-7 7 7-7 7' fill='none' stroke='black' stroke-width='2.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat}
.ui-arrow-left{transform:rotate(180deg)}
.ui-arrow-out{transform:rotate(-45deg)}
.ui-arrow-down{transform:rotate(90deg)}
.primary-btn>b:has(>.ui-arrow-right){display:inline-flex;align-items:center;font-size:inherit;line-height:1}
.sidebar .account-ripple-menu,.sidebar .account-ripple-menu[hidden]{display:block!important;overflow:hidden;z-index:1001;clip-path:circle(150% at 94% 100%);visibility:visible;transition:clip-path 560ms cubic-bezier(.22,.72,.18,1),visibility 0s}
.sidebar .account-ripple-menu[hidden]{clip-path:circle(0% at 94% 100%);visibility:hidden;pointer-events:none;transition:clip-path 360ms cubic-bezier(.4,0,.4,1),visibility 0s 360ms}
.sidebar .account-ripple-menu:after{content:'';position:absolute;right:6%;bottom:0;width:600px;height:600px;border-radius:50%;background:radial-gradient(circle,transparent 57%,#8eac8b26 63%,transparent 70%);transform:translate(50%,50%) scale(0);pointer-events:none}
.sidebar .account-ripple-menu:not([hidden]):after{animation:account-menu-wave 560ms ease-out both}
@keyframes account-menu-wave{to{transform:translate(50%,50%) scale(1);opacity:0}}
@media(prefers-reduced-motion:reduce){.sidebar .account-ripple-menu,.sidebar .account-ripple-menu[hidden]{transition:none}.sidebar .account-ripple-menu:after{animation:none!important}}
.reply-wait{display:flex;align-items:center;gap:12px;min-height:30px;color:#657c68}.reply-wait .typing{flex:none}.reply-wait-copy{font-size:14px;line-height:1.6}.reply-reveal-all{display:block;margin-top:12px;padding:6px 10px;border:1px solid #dce2d7;border-radius:8px;background:#f4f7f1;color:#38634e;font:inherit;font-size:12px;cursor:pointer}
