:root{--petrol:#0d2233;--petrol-mid:#112840;--petrol-muted:#a0bcc8;--ocre:#c8a227;--ocre-soft:#d9bb5a;--ocre-deep:#b8921f;--ocre-light:#f5e9c0;--cream:#f7f4ec;--cream-dark:#f0ece0;--white:#fff;--border:#d4cfc4;--text-body:#5a6470;--success:#2d7a4f;--error:#b03030;--shadow-sm:0 1px 3px #0d223314;--shadow-card:0 2px 8px #0d223314;--shadow-card-hover:0 6px 20px #0d223333;--shadow-lg:0 8px 24px #0d22333d}*{box-sizing:border-box}html,body{min-height:100%}body{color:var(--petrol);background:var(--cream);margin:0;font-family:Arial,Helvetica Neue,sans-serif;font-size:14px;line-height:1.6}button,input,select{font:inherit}button{border:0}button:not(:disabled),label{cursor:pointer}button:disabled{cursor:wait;opacity:.65}h1,h2,h3,p{margin:0}h1,h2,.topbar-title h1,.stat-card strong{letter-spacing:-.02em;font-family:Georgia,serif}.login-page{grid-template-columns:1fr 1fr;min-height:100vh;display:grid}.login-brand{background:var(--petrol);justify-content:center;align-items:center;min-height:100%;padding:64px;display:flex}.login-logo{width:100%;max-width:420px;height:auto}.brand-on-light{filter:brightness(0)saturate()invert(10%)sepia(21%)saturate(1893%)hue-rotate(164deg)brightness(91%)contrast(94%)}.login-form-side{background:var(--cream);justify-content:center;align-items:center;padding:48px;display:flex}.login-form{flex-direction:column;gap:24px;width:100%;max-width:380px;display:flex}.login-form h1{font-size:24px;line-height:1.2}.login-form p,.filter-row>p,.action-row>p{color:var(--text-body);font-size:14px}.login-form h1+p{margin-top:8px;line-height:1.6}.field-stack,.modal-form,.upload-card,.screen-stack,.detail-sessions{flex-direction:column;gap:20px;display:flex}.field-stack{gap:16px}.field{color:var(--petrol);flex-direction:column;gap:6px;font-size:12px;font-weight:700;display:flex}.field input,.field select,.share-link-dialog input{border:1.5px solid var(--border);background:var(--white);width:100%;min-height:42px;color:var(--petrol);border-radius:8px;outline:none;padding:10px 12px;font-size:14px;font-weight:400;transition:background-color .15s cubic-bezier(.4,0,.2,1),border-color .15s cubic-bezier(.4,0,.2,1)}.field input:focus,.field select:focus,.share-link-dialog input:focus{border-color:var(--petrol);background:var(--cream)}.field input.has-error{border-color:var(--error)}.field-error,.inline-error{color:var(--error);font-size:12px;font-weight:700}.button{border:1px solid #0000;border-radius:8px;justify-content:center;align-items:center;gap:8px;min-height:40px;padding:9px 14px;font-size:14px;font-weight:700;line-height:1.2;transition:background-color .2s cubic-bezier(.4,0,.2,1),color .2s cubic-bezier(.4,0,.2,1),border-color .2s cubic-bezier(.4,0,.2,1);display:inline-flex}.button-primary{background:var(--ocre);color:var(--petrol)}.button-primary:hover{background:var(--ocre-soft)}.button-primary:active{background:var(--ocre-deep)}.button-secondary{border-color:var(--border);background:var(--white);color:var(--petrol)}.button-secondary:hover{background:var(--cream-dark)}.button-ghost{color:var(--text-body);background:0 0}.button-ghost:hover{background:var(--ocre-light);color:var(--petrol)}.button-large{width:100%;min-height:48px}.button-small{min-height:32px;padding:7px 11px;font-size:13px}.button-full{width:100%}.demo-accounts{border-top:1px solid var(--border);flex-direction:column;gap:12px;padding-top:20px;display:flex}.eyebrow{color:var(--text-body);letter-spacing:.08em;text-transform:uppercase;font-size:11px;font-weight:700;line-height:1.3}.demo-account-row{gap:8px;display:flex}.demo-account-row button{border:1px solid var(--border);background:var(--white);min-width:0;color:var(--petrol);text-align:left;border-radius:8px;flex-direction:column;flex:1;padding:12px;transition:background-color .2s cubic-bezier(.4,0,.2,1);display:flex}.demo-account-row button:hover{background:var(--cream-dark)}.demo-account-row span{color:var(--text-body);text-overflow:ellipsis;white-space:nowrap;font-size:12px;overflow:hidden}.app-loading,.screen-loading{min-height:100vh;color:var(--text-body);place-items:center;display:grid}.password-gate{background:var(--cream);place-items:center;min-height:100vh;padding:32px;display:grid}.password-card{border:1px solid var(--border);background:var(--white);width:min(100%,420px);box-shadow:var(--shadow-lg);border-radius:16px;flex-direction:column;gap:20px;padding:32px;display:flex}.password-card h1{font-size:24px;line-height:1.2}.password-card h1+p{color:var(--text-body);margin-top:8px}.screen-loading{min-height:200px}.app-shell{grid-template-columns:240px minmax(0,1fr);min-height:100vh;display:grid}.sidebar{background:var(--petrol);min-height:100vh;padding:20px 0}.sidebar-logo{object-fit:contain;object-position:left center;width:calc(100% - 40px);height:26px;margin:0 20px 32px;display:block}.sidebar nav{flex-direction:column;display:flex}.sidebar-item{min-height:41px;color:var(--petrol-muted);text-align:left;background:0 0;border-left:3px solid #0000;align-items:center;gap:12px;padding:10px 20px 10px 17px;font-size:14px;transition:background-color .2s cubic-bezier(.4,0,.2,1),color .2s cubic-bezier(.4,0,.2,1);display:flex}.sidebar-item:hover{color:var(--white)}.sidebar-item.is-active{border-left-color:var(--ocre);background:var(--petrol-mid);color:var(--white);font-weight:700}.app-stage{min-width:0}.topbar{border-bottom:1px solid var(--border);background:var(--white);justify-content:space-between;align-items:center;min-height:64px;padding:0 40px;display:flex}.topbar-title,.topbar-user,.action-row,.filter-row,.card-title-row,.student-heading,.calendar-toolbar,.modal-actions{align-items:center;display:flex}.topbar-title{gap:12px;min-width:0}.topbar-title h1{flex:none;font-size:20px;line-height:1.2}.topbar-title span{color:var(--text-body);text-overflow:ellipsis;white-space:nowrap;font-size:13px;overflow:hidden}.topbar-user{gap:12px}.topbar-user>span{color:var(--petrol);font-size:13px;font-weight:700}.app-content{background:var(--cream);min-height:calc(100vh - 64px);padding:32px 40px 64px}.screen-stack{max-width:1160px}.action-row,.filter-row{justify-content:space-between;gap:16px}.pill-group{flex-wrap:wrap;gap:8px;display:flex}.pill{border:1px solid var(--border);background:var(--white);color:var(--text-body);border-radius:9999px;padding:7px 16px;font-size:12px;font-weight:700;transition:background-color .2s cubic-bezier(.4,0,.2,1)}.pill:hover{background:var(--ocre-light)}.pill.is-selected{border-color:var(--petrol);background:var(--petrol);color:var(--white)}.material-grid{grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:16px;display:grid}.material-card,.student-card,.stat-card,.upload-card,.material-rail,.teacher-list-card,.access-card{border:1px solid var(--border);background:var(--white);box-shadow:var(--shadow-card);border-radius:12px}.material-card{flex-direction:column;gap:14px;min-height:250px;padding:24px;display:flex}.card-title-row{justify-content:space-between;align-items:flex-start;gap:12px}.card-title-row h2{font-size:20px;line-height:1.3}.badge{background:var(--ocre);min-width:34px;color:var(--petrol);border-radius:9999px;justify-content:center;align-items:center;padding:3px 8px;font-size:12px;font-weight:700;line-height:1.2;display:inline-flex}.material-goal{color:var(--text-body);flex:1;line-height:1.6}.material-meta{color:var(--text-body);font-size:12px}.card-footer{border-top:1px solid var(--border);flex-wrap:wrap;gap:8px;padding-top:16px;display:flex}.empty-state{border:1px dashed var(--border);background:var(--cream-dark);color:var(--text-body);text-align:center;border-radius:12px;padding:40px}.student-grid{grid-template-columns:repeat(auto-fill,minmax(255px,1fr));gap:16px;display:grid}.student-card{min-height:154px;color:var(--petrol);text-align:left;flex-direction:column;justify-content:space-between;padding:24px;transition:box-shadow .2s cubic-bezier(.4,0,.2,1);display:flex}.student-card:hover{box-shadow:var(--shadow-card-hover)}.student-heading{gap:12px}.student-heading>span{flex-direction:column;min-width:0;display:flex}.student-heading strong{font-size:15px}.student-heading small,.student-card footer span{color:var(--text-body);font-size:12px}.student-card footer{border-top:1px solid var(--border);justify-content:space-between;align-items:center;padding-top:14px;display:flex}.avatar{background:var(--petrol);color:var(--white);border-radius:50%;flex:none;place-items:center;font-family:Georgia,serif;font-weight:700;display:inline-grid}.avatar-small{width:32px;height:32px;font-size:12px}.avatar-medium{width:40px;height:40px;font-size:14px}.avatar-large{width:64px;height:64px;font-size:20px}.modal-backdrop{z-index:70;background:#0d22338c;place-items:center;padding:24px;display:grid;position:fixed;inset:0}.modal-panel{background:var(--white);width:min(100%,400px);box-shadow:var(--shadow-lg);border-radius:16px;padding:32px}.modal-panel h2{margin-bottom:20px;font-size:24px;line-height:1.2}.modal-form{gap:20px}.modal-actions{justify-content:flex-end;gap:12px}.back-link{color:var(--text-body);background:0 0;align-self:flex-start;align-items:center;gap:6px;padding:0;font-size:13px;font-weight:700;display:inline-flex}.back-link:hover{color:var(--petrol)}.student-detail-layout{grid-template-columns:300px minmax(0,1fr);align-items:start;gap:24px;display:grid}.student-profile-card{border:1px solid var(--border);border-left:4px solid var(--ocre);background:var(--white);box-shadow:var(--shadow-card);border-radius:12px;flex-direction:column;gap:20px;padding:24px;display:flex}.student-profile-card h2{font-size:24px;line-height:1.2}.student-profile-card p{color:var(--text-body);margin-top:6px;font-size:13px}.session-list{flex-direction:column;gap:10px;display:flex}.session-row{border:1px solid var(--border);background:var(--white);border-radius:12px;grid-template-columns:minmax(0,1fr) auto auto auto;align-items:center;gap:16px;padding:16px 20px;display:grid}.session-row>div{flex-direction:column;min-width:0;display:flex}.session-row strong{text-overflow:ellipsis;white-space:nowrap;font-size:15px;overflow:hidden}.session-row span{color:var(--text-body);font-size:13px}.calendar-layout{grid-template-columns:minmax(0,1fr) 270px;align-items:start;gap:24px;max-width:1160px;display:grid}.calendar-card{border:1px solid var(--border);background:var(--white);box-shadow:var(--shadow-card);border-radius:12px;overflow:hidden}.calendar-toolbar{border-bottom:1px solid var(--border);flex-wrap:wrap;gap:12px;padding:16px 20px}.calendar-toolbar strong{font-size:13px}.calendar-toolbar select{border:1.5px solid var(--border);background:var(--white);min-height:36px;color:var(--petrol);border-radius:8px;padding:7px 10px}.calendar-toolbar>span{color:var(--text-body);margin-left:auto;font-size:13px}.calendar-grid{grid-template-columns:56px repeat(5,minmax(0,1fr));min-width:680px;display:grid}.calendar-corner,.calendar-day{border-bottom:1px solid var(--border);min-height:56px}.calendar-day{flex-direction:column;justify-content:center;align-items:center;padding:8px;display:flex}.calendar-day strong{font-size:12px}.calendar-day span{color:var(--text-body);font-size:11px}.calendar-hour{min-height:46px;color:var(--text-body);text-align:right;padding:12px 10px 0 0;font-size:11px}.calendar-cell{border-top:1px solid var(--border);border-left:1px solid var(--border);min-height:46px;padding:3px}.calendar-session{border-left:3px solid var(--ocre);background:var(--ocre-light);width:100%;height:100%;min-height:38px;color:var(--petrol);text-align:left;border-radius:4px;flex-direction:column;padding:5px 7px;display:flex;overflow:hidden}.calendar-session strong,.calendar-session span{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.calendar-session strong{font-size:11px;line-height:1.3}.calendar-session span{color:var(--text-body);font-size:10px}.material-rail{flex-direction:column;gap:14px;padding:20px;display:flex;position:sticky;top:24px}.material-rail>p{color:var(--text-body);font-size:12px;line-height:1.6}.draggable-material{border:1px solid var(--border);background:var(--cream);cursor:grab;border-radius:8px;align-items:center;gap:8px;padding:10px 12px;transition:background-color .2s cubic-bezier(.4,0,.2,1);display:flex}.draggable-material:hover{background:var(--ocre-light)}.draggable-material>span{flex-direction:column;min-width:0;display:flex}.draggable-material strong{text-overflow:ellipsis;white-space:nowrap;font-size:13px;overflow:hidden}.draggable-material small{color:var(--text-body);font-size:11px}.class-viewer{z-index:50;background:var(--petrol);position:fixed;inset:0}.class-frame{background:var(--white);border:0;width:100%;height:100%;display:block}.viewer-exit{z-index:60;border:1px solid var(--petrol-mid);background:var(--petrol);color:var(--white);opacity:.28;border-radius:8px;padding:8px 14px;font-size:13px;font-weight:700;transition:opacity .2s cubic-bezier(.4,0,.2,1);position:fixed;top:16px;left:16px}.viewer-exit:hover{opacity:1}.viewer-message{height:100%;color:var(--white);place-items:center;display:grid}.stats-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;display:grid}.stat-card{flex-direction:column;justify-content:center;gap:8px;min-height:130px;padding:24px;display:flex}.stat-card strong{font-size:36px;line-height:1.1}.stat-card span{color:var(--text-body);font-size:13px}.table-section{flex-direction:column;gap:12px;display:flex}.data-table-wrap{border:1px solid var(--border);background:var(--white);box-shadow:var(--shadow-card);border-radius:12px;overflow-x:auto}.data-table{border-collapse:collapse;text-align:left;width:100%}.data-table th,.data-table td{border-bottom:1px solid var(--border);padding:13px 16px;font-size:13px}.data-table th{color:var(--text-body);font-weight:700}.data-table tbody tr:last-child td{border-bottom:0}.data-table tbody tr{transition:background-color .2s cubic-bezier(.4,0,.2,1)}.data-table tbody tr[role],.data-table tbody tr[onclick]{cursor:pointer}.data-table tbody tr:hover{background:var(--ocre-light)}.table-ellipsis{text-overflow:ellipsis;white-space:nowrap;max-width:340px;overflow:hidden}.materials-layout{grid-template-columns:340px minmax(0,1fr);align-items:start;gap:24px;max-width:1160px;display:grid}.upload-card{padding:24px}.upload-card h2{font-size:18px}.upload-card h2+p{color:var(--text-body);margin-top:4px;font-size:13px}.drop-zone{border:1.5px dashed var(--border);background:var(--cream);text-align:center;border-radius:8px;flex-direction:column;justify-content:center;align-items:center;gap:3px;min-height:135px;padding:24px 16px;transition:background-color .2s cubic-bezier(.4,0,.2,1);display:flex}.drop-zone:hover{background:var(--ocre-light)}.drop-zone strong{text-overflow:ellipsis;white-space:nowrap;max-width:100%;font-size:13px;overflow:hidden}.drop-zone span{color:var(--text-body);font-size:12px}.drop-zone input{display:none}.two-fields{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px;display:grid}.access-checklist{border:0;border-top:1px solid var(--border);flex-direction:column;gap:10px;margin:0;padding:16px 0 0;display:flex}.access-checklist legend{color:var(--petrol);margin-bottom:10px;padding:0;font-size:12px;font-weight:700}.access-checklist label{color:var(--petrol);align-items:center;gap:10px;font-size:13px;display:flex}.access-checklist input{width:16px;height:16px;accent-color:var(--ocre);margin:0}.access-checklist small{color:var(--text-body);font-size:12px}.success-message{color:var(--success);font-size:13px;font-weight:700}.library-table{min-width:0}.temporary-password{border:1px solid var(--border);border-left:4px solid var(--ocre);background:var(--ocre-light);border-radius:8px;padding:12px 16px}.access-layout{grid-template-columns:280px minmax(0,1fr);align-items:start;gap:24px;max-width:1160px;display:grid}.teacher-list-card{overflow:hidden}.teacher-list-card>.eyebrow{border-bottom:1px solid var(--border);padding:16px 20px}.teacher-list-item{border-bottom:1px solid var(--border);background:var(--white);width:100%;color:var(--petrol);text-align:left;border-left:3px solid #0000;flex-direction:column;gap:2px;padding:14px 20px 14px 17px;transition:background-color .2s cubic-bezier(.4,0,.2,1);display:flex}.teacher-list-item:hover{background:var(--ocre-light)}.teacher-list-item.is-selected{border-left-color:var(--ocre);background:var(--ocre-light)}.teacher-list-item strong{font-size:14px}.teacher-list-item span{color:var(--text-body);font-size:12px}.access-grid{grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:12px;display:grid}.access-card{color:var(--petrol);text-align:left;justify-content:space-between;align-items:center;gap:14px;padding:16px 18px;transition:background-color .2s cubic-bezier(.4,0,.2,1);display:flex}.access-card:hover{background:var(--ocre-light)}.access-card>span{flex-direction:column;min-width:0;display:flex}.access-card strong{text-overflow:ellipsis;white-space:nowrap;font-size:14px;overflow:hidden}.access-card small,.access-card b{color:var(--text-body);font-size:12px}.access-card b{flex:none}.access-card b.access-on{color:var(--success)}.share-link-dialog{color:var(--text-body);flex-direction:column;gap:16px;display:flex}.share-link-dialog p{font-size:14px}.share-link-dialog strong{color:var(--petrol)}.share-expiry{font-size:12px!important}.shared-class-page{background:var(--petrol);grid-template-rows:auto minmax(0,1fr);height:100vh;display:grid}.shared-class-note{background:var(--petrol);color:var(--white);justify-content:space-between;align-items:baseline;gap:16px;padding:10px 18px;display:flex}.shared-class-note span{color:var(--petrol-muted);font-size:12px}.shared-link-error{background:var(--cream);min-height:100vh;color:var(--petrol);text-align:center;place-content:center;gap:8px;padding:32px;display:grid}.shared-link-error h1{font-size:28px}.shared-link-error p{color:var(--text-body)}@media (max-width:1050px){.app-shell{grid-template-columns:200px minmax(0,1fr)}.topbar,.app-content{padding-left:24px;padding-right:24px}.calendar-layout,.materials-layout,.access-layout,.student-detail-layout{grid-template-columns:1fr}.material-rail{position:static}.stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
