:root{color:#20384c;--muted:#4b6072;--line:#d9e3ea}body{font-weight:500}
.live-top{height:78px;border-bottom:1px solid var(--line);background:#fff;display:flex;align-items:center;padding:0 max(24px,calc((100vw - 1160px)/2));gap:20px}.live-top .brand{font-size:24px;gap:7px}.live-top .brand-dot{margin-left:-7px}.live-top-label{font-size:10px;color:#526677;border-left:1px solid var(--line);padding-left:20px;letter-spacing:1px}.live-network{margin-left:auto;font-size:11px;color:#326446;display:flex;align-items:center;gap:7px}.live-network i,.live-mode i{width:6px;height:6px;background:currentColor;border-radius:50%}.live-network.offline{color:#885716}.live-main{max-width:1160px;padding:35px 24px 0}.live-muted{font-size:12px;line-height:1.8;color:#4b6072}.live-login{max-width:1050px;display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center;padding:80px 35px}.live-login-intro h1{font-size:42px;line-height:1.3;color:#205777}.live-login-intro>p{color:#4b6072;font-size:14px;line-height:1.9;margin-top:20px}.live-login-card{background:white;border:1px solid var(--line);border-radius:15px;padding:30px}.live-login-card h2{font-size:23px;margin-bottom:9px}.live-login-card label,.live-picker label{display:block;font-size:11px;font-weight:650;color:#3e586e;margin-bottom:8px}.live-login-card input{border:1px solid #dce5eb;border-radius:7px;width:100%;padding:13px;color:#203c52;font-size:14px;min-height:45px;margin-bottom:20px}.live-login-card form{margin-top:27px}.live-login-card input:disabled{background:#f4f7fa}.live-greeting{display:flex;justify-content:space-between;align-items:center;gap:18px;margin-bottom:25px}.live-greeting h1{font-size:29px}.live-greeting p{margin-top:8px}.live-mode{display:flex;align-items:center;gap:12px;justify-content:space-between;background:#fff5e4;border:1px solid #f1dfbc;border-radius:8px;padding:12px 15px;color:#75521d;margin:20px 0}.live-mode>span{display:flex;align-items:center;gap:7px;font-size:9px;letter-spacing:.6px;font-weight:650}.live-mode>small{font-size:10px}.live-notice{background:#edf6f1;border-color:#d2e7da;color:#326446}.live-picker{display:flex;gap:17px;align-items:flex-end;padding:24px;background:white;border:1px solid var(--line);border-radius:12px;margin:24px 0}.live-picker>div:first-child{flex:1}.live-picker label span{font-weight:500;color:#526677;margin-left:8px}.live-picker select,.live-picker input{border:1px solid #dde6ed;padding:12px 14px;min-height:43px;background:white;border-radius:7px;color:#29485e;width:100%;font-size:13px}.live-picker .button{min-height:43px}.live-session-section{margin:30px 0}.live-session-section .section-heading p{font-size:12px;color:#526677}.live-sessions{display:grid;gap:10px;grid-template-columns:repeat(2,minmax(0,1fr))}.live-session{background:white;border:1px solid var(--line);border-radius:9px;padding:18px;display:flex;align-items:center;gap:12px;text-align:left}.live-session.chosen{border-color:#87b8d1;background:#f5fbfe;box-shadow:0 0 0 1px #87b8d130}.live-session-icon{width:35px;height:35px;display:grid;place-items:center;background:#edf5fb;color:#357393;border-radius:9px;font-size:24px}.live-session strong{display:block;font-size:13px}.live-session small{display:block;font-size:10px;color:#4b6072;margin-top:6px}.live-session .badge{margin-left:auto}.live-chevron{font-size:22px;color:#3f6d89}.live-roster-title{padding:22px 24px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;gap:10px}.live-roster-title h2{font-size:19px}.live-roster-title .eyebrow{font-size:9px;letter-spacing:.6px;margin-bottom:8px}.live-roster .live-student{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:19px 24px;border-bottom:1px solid var(--line)}.live-student .student-name strong{font-size:14px}.live-student .student-avatar{height:38px;width:38px;font-size:14px}.live-student .status-button{min-height:38px;min-width:84px;font-size:12px}.live-readonly{padding:16px 24px;color:#75521d;background:#fff8ed;font-size:11px;line-height:1.8}.live-attendance .search-input input{padding-left:13px}.live-save{position:sticky;bottom:0;z-index:2;background:#fff;border-top:1px solid #dce7ee;box-shadow:0 -5px 16px #24486505}.live-footer{font-size:10px;line-height:1.8;color:#526677;text-align:center;padding:30px 15px}.live-dialog{border:1px solid #d8e4ed;border-radius:14px;padding:29px;max-width:460px;width:calc(100% - 35px);color:#203c52;box-shadow:0 20px 80px #122e4e30}.live-dialog::backdrop{background:#1a344a66;backdrop-filter:blur(3px)}.live-dialog h2{font-size:23px;margin-bottom:17px}.live-dialog p{font-size:12px;line-height:1.9}.live-dialog p strong{font-size:14px}.live-summary{display:flex;justify-content:space-around;background:#f2f7fa;border-radius:9px;margin:20px 0;padding:19px}.live-summary span{font-size:28px;font-weight:650;text-align:center}.live-summary small{display:block;font-size:10px;font-weight:500;margin-top:7px;color:#4b6072}.live-dialog-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:25px}
@media(max-width:700px){.live-top{height:65px;padding:0 20px;gap:10px}.live-top-label{display:none}.live-top .brand{font-size:23px}.live-network{font-size:10px}.live-main{padding:25px 16px 0}.live-login{display:block;padding:34px 20px}.live-login-intro h1{font-size:29px}.live-login-intro p{font-size:12px;line-height:1.8;margin:12px 0 25px}.live-login-intro p br{display:none}.live-login-card{padding:24px}.live-login-card h2{font-size:21px}.live-greeting{align-items:flex-start}.live-greeting h1{font-size:23px}.live-greeting .eyebrow{font-size:8px;letter-spacing:.3px}.live-greeting .button{font-size:10px;padding:9px 11px;min-height:35px}.live-greeting .sun{font-size:22px}.live-greeting .live-muted{font-size:11px}.live-mode{align-items:flex-start;gap:8px;flex-direction:column;padding:12px 14px}.live-mode>span{font-size:8px}.live-mode>small{font-size:9px;line-height:1.7}.live-picker{padding:18px 16px;flex-wrap:wrap;gap:14px}.live-picker>div:first-child{flex-basis:100%}.live-picker>div:nth-child(2){flex:1}.live-picker select,.live-picker input{font-size:12px}.live-picker>.button{font-size:10px;padding:10px;max-width:150px}.live-sessions{grid-template-columns:1fr}.live-session{padding:16px 14px;gap:10px}.live-session strong{font-size:12px}.live-session small{font-size:9px;line-height:1.6}.live-session .badge{font-size:8px;padding:5px}.live-session-icon{height:31px;width:31px;flex-shrink:0}.live-roster-title{padding:19px 16px;align-items:flex-start;flex-direction:column;gap:13px}.live-roster-title h2{font-size:18px}.live-roster .live-student{padding:18px 16px;align-items:stretch;flex-direction:column;gap:14px}.live-student .student-name strong{font-size:14px}.live-student .student-name small{line-height:1.7}.live-student .status-buttons{display:flex;gap:9px}.live-student .status-button{flex:1;min-height:43px;font-size:12px}.live-save{padding:15px}.live-save .save-actions .button{font-size:11px}.live-save .save-actions .button:last-child{flex:1.7}.live-footer{font-size:9px;padding:26px 5px 35px}.live-dialog{padding:24px}.live-dialog h2{font-size:21px}.live-dialog-actions .button{font-size:11px}.live-main .notice{overflow-wrap:anywhere}}

/* Live typography: readable labels and status colours on desktop and phone. */
#live-app .eyebrow{color:#526677;font-weight:700}
#live-app .button{font-weight:700}
#live-app .live-top-label,#live-app .live-network{font-weight:650}
#live-app .live-login-card label,#live-app .live-picker label{font-size:12px;font-weight:700}
#live-app .live-login-card input,#live-app .live-picker select,#live-app .live-picker input{font-weight:600}
#live-app .student-name strong{font-weight:750}
#live-app .student-name small{font-size:12px;font-weight:550;color:#4b6072}
#live-app .status-button{font-weight:700;color:#4b6072}
#live-app .status-button.present.selected{color:#23623d;border-color:#8abf9d}
#live-app .status-button.absent.selected{color:#9b392f;border-color:#d49b94}
#live-app .status-button:disabled{opacity:.75}
#live-app .badge{font-weight:700;color:#805312}
#live-app .badge.dirty{color:#80501d}
#live-app .badge.draft{color:#43596d}
#live-app .green-text{color:#23623d}
#live-app .red-text{color:#9b392f}
#live-app .orange-text{color:#805312}
#live-app .attendance-stats span,#live-app .class-comment label span,#live-app .save-status small{font-size:12px;font-weight:550;color:#4b6072}
#live-app .class-comment label,#live-app .save-status strong{font-weight:700;color:#29485e}
#live-app .class-comment textarea,#live-app .search-input input,#live-app .roster-tools select{font-size:13px;font-weight:550;color:#29485e}
#live-app input::placeholder,#live-app textarea::placeholder{color:#5c6e7d;opacity:1}
#live-app .empty-state{color:#4b6072}
#live-app .empty-state h2,#live-app .empty-state h3{font-weight:700;color:#29485e}
#live-app .notice{font-size:12px;font-weight:600;color:#365d75}
#live-app .notice.error{color:#923e2c}
#live-app .notice.live-notice{color:#326446}
#live-app .live-footer{font-size:12px;font-weight:600}
.live-dialog{font-weight:500}
.live-dialog .eyebrow,.live-dialog .button{font-weight:700}
.live-dialog .live-muted{color:#4b6072;font-weight:550}
.live-dialog .live-summary small{font-size:12px;font-weight:600}