:root{--primary:#4f46e5;--primary-dark:#3730a3;--accent:#06b6d4;--bg:#f5f7fb;--surface:#fff;--surface-2:#f8fafc;--text:#182235;--muted:#64748b;--border:#e5e9f2;--danger:#dc2626;--warning:#d97706;--success:#059669;--shadow:0 10px 32px rgba(15,23,42,.08);--sidebar:280px}
html[data-theme="dark"]{--bg:#0f172a;--surface:#172033;--surface-2:#1e293b;--text:#e5edf8;--muted:#9aa9be;--border:#2e3b51;--shadow:0 12px 34px rgba(0,0,0,.25)}
*{box-sizing:border-box}html,body{min-height:100%}body{margin:0;background:var(--bg);color:var(--text);font-family:"Tahoma","Segoe UI",Arial,sans-serif;font-size:14px}.app-shell{min-height:100vh;display:flex}.app-sidebar{position:fixed;inset-block:0;inset-inline-start:0;width:var(--sidebar);background:linear-gradient(180deg,#111827,#1e1b4b);color:#fff;z-index:1040;display:flex;flex-direction:column;transition:transform .25s ease}.brand-block{height:78px;display:flex;align-items:center;gap:12px;padding:14px 18px;border-bottom:1px solid rgba(255,255,255,.1)}.brand-block strong,.brand-block small{display:block}.brand-block small{opacity:.65;font-size:11px;margin-top:3px}.brand-mark{width:44px;height:44px;border-radius:14px;background:linear-gradient(135deg,#818cf8,#22d3ee);display:grid;place-items:center;font-size:24px;font-weight:800}.sidebar-close{margin-inline-start:auto;color:#fff}.sidebar-nav{padding:16px 12px 28px;overflow:auto}.nav-section{font-size:11px;letter-spacing:.5px;color:#94a3b8;padding:16px 12px 7px}.nav-link{display:flex;align-items:center;gap:11px;color:#cbd5e1;text-decoration:none;padding:10px 12px;border-radius:11px;margin:2px 0;transition:.2s}.nav-link:hover,.nav-link.active{color:#fff;background:rgba(129,140,248,.20)}.nav-link.active{box-shadow:inset -3px 0 #67e8f9}.nav-link i{width:21px;text-align:center;font-size:17px}.app-main{min-height:100vh;display:flex;flex-direction:column;width:calc(100% - var(--sidebar));margin-inline-start:var(--sidebar)}.app-topbar{height:72px;background:var(--surface);border-bottom:1px solid var(--border);display:flex;align-items:center;gap:16px;padding:0 24px;position:sticky;top:0;z-index:1020}.global-search{position:relative;display:flex;align-items:center;background:var(--surface-2);border:1px solid var(--border);border-radius:12px;padding:0 14px;max-width:680px;flex:1}.global-search>i{color:var(--muted)}.global-search input{border:0;background:transparent;outline:0;color:var(--text);width:100%;height:44px;padding:0 10px}.search-suggestions{display:none;position:absolute;top:48px;inset-inline:0;background:var(--surface);border:1px solid var(--border);border-radius:12px;box-shadow:var(--shadow);overflow:hidden;z-index:1060}.search-suggestions.show{display:block}.search-suggestions a{display:block;padding:10px 14px;color:var(--text);text-decoration:none;border-bottom:1px solid var(--border)}.search-suggestions a:hover{background:var(--surface-2)}.search-suggestions small{display:block;color:var(--muted)}.topbar-actions,.user-menu{display:flex;align-items:center;gap:8px}.topbar-actions{margin-inline-start:auto}.icon-btn{border:0;background:transparent;color:var(--text);width:40px;height:40px;border-radius:10px;display:grid;place-items:center;font-size:18px;cursor:pointer}.icon-btn:hover{background:var(--surface-2)}.user-menu{padding-inline-start:8px;border-inline-start:1px solid var(--border)}.user-avatar{width:38px;height:38px;border-radius:50%;background:linear-gradient(135deg,var(--primary),var(--accent));color:white;display:grid;place-items:center;font-weight:700}.user-meta strong,.user-meta small{display:block;max-width:180px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.user-meta small{color:var(--muted);font-size:11px}.content-area{padding:24px;flex:1}.app-footer{padding:16px 24px;color:var(--muted);display:flex;justify-content:space-between;border-top:1px solid var(--border);background:var(--surface)}.page-head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:20px}.page-head h1{font-size:24px;margin:0 0 6px;font-weight:800}.page-head p{margin:0;color:var(--muted)}.page-actions{display:flex;flex-wrap:wrap;gap:8px}.card,.panel{background:var(--surface);border:1px solid var(--border);border-radius:16px;box-shadow:var(--shadow)}.panel{padding:20px;margin-bottom:20px}.panel-title{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.panel-title h2,.panel-title h3{font-size:17px;margin:0}.metric-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-bottom:20px}.metric-card{background:var(--surface);border:1px solid var(--border);border-radius:16px;padding:18px;box-shadow:var(--shadow);position:relative;overflow:hidden}.metric-card::after{content:"";position:absolute;width:90px;height:90px;border-radius:50%;background:linear-gradient(135deg,rgba(79,70,229,.13),rgba(6,182,212,.08));inset-inline-end:-24px;top:-24px}.metric-label{color:var(--muted);font-size:13px}.metric-value{font-size:27px;font-weight:800;margin-top:8px}.metric-sub{font-size:12px;color:var(--muted);margin-top:5px}.dashboard-grid{display:grid;grid-template-columns:2fr 1fr;gap:18px}.chart-box{min-height:330px}.filter-bar{display:grid;grid-template-columns:repeat(6,minmax(130px,1fr));gap:10px;align-items:end}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.form-grid.cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.form-field{display:flex;flex-direction:column;gap:7px}.form-field.full{grid-column:1/-1}.form-label{font-weight:700;font-size:13px}.form-control,.form-select{background:var(--surface);border-color:var(--border);color:var(--text);border-radius:10px;min-height:42px}.form-control:focus,.form-select:focus{border-color:var(--primary);box-shadow:0 0 0 .2rem rgba(79,70,229,.13);background:var(--surface);color:var(--text)}textarea.form-control{min-height:100px}.text-danger{font-size:12px}.table-wrap{overflow:auto;border:1px solid var(--border);border-radius:14px}.data-table{width:100%;border-collapse:collapse;min-width:760px}.data-table th{background:var(--surface-2);color:var(--muted);font-size:12px;font-weight:700;text-align:right;padding:12px;border-bottom:1px solid var(--border);white-space:nowrap}.data-table td{padding:12px;border-bottom:1px solid var(--border);vertical-align:middle}.data-table tr:last-child td{border-bottom:0}.data-table tbody tr:hover{background:rgba(79,70,229,.035)}.row-actions{display:flex;gap:5px;white-space:nowrap}.btn{border-radius:10px}.btn-primary{background:var(--primary);border-color:var(--primary)}.btn-primary:hover{background:var(--primary-dark);border-color:var(--primary-dark)}.btn-light{background:var(--surface-2);border-color:var(--border);color:var(--text)}.badge-soft{display:inline-flex;align-items:center;padding:5px 9px;border-radius:999px;background:rgba(79,70,229,.11);color:var(--primary);font-size:11px;font-weight:700}.badge-success{background:rgba(5,150,105,.12);color:var(--success)}.badge-danger{background:rgba(220,38,38,.12);color:var(--danger)}.badge-warning{background:rgba(217,119,6,.12);color:var(--warning)}.empty-state{text-align:center;padding:46px 20px;color:var(--muted)}.empty-state i{font-size:38px;display:block;margin-bottom:10px}.pager{display:flex;align-items:center;justify-content:center;gap:12px;margin-top:18px}.app-alert{animation:slideIn .25s ease}.stat-list{display:grid;gap:10px}.stat-row{display:flex;justify-content:space-between;align-items:center;padding:10px 0;border-bottom:1px solid var(--border)}.tabs{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:18px;border-bottom:1px solid var(--border);padding-bottom:8px}.tabs a{padding:8px 12px;border-radius:9px;color:var(--muted);text-decoration:none}.tabs a.active,.tabs a:hover{background:rgba(79,70,229,.1);color:var(--primary)}.info-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.info-item{padding:12px;background:var(--surface-2);border-radius:12px}.info-item span{display:block;color:var(--muted);font-size:12px}.info-item strong{display:block;margin-top:5px}.timeline{position:relative;padding-inline-start:22px}.timeline::before{content:"";position:absolute;inset-inline-start:7px;top:8px;bottom:8px;width:2px;background:var(--border)}.timeline-item{position:relative;padding:0 0 18px}.timeline-item::before{content:"";position:absolute;inset-inline-start:-19px;top:5px;width:10px;height:10px;background:var(--primary);border-radius:50%;box-shadow:0 0 0 4px rgba(79,70,229,.12)}.quick-actions{display:flex;flex-wrap:wrap;gap:10px}.quick-action{min-width:130px;text-decoration:none;padding:14px;border-radius:12px;background:var(--surface-2);color:var(--text);display:flex;align-items:center;gap:8px}.quick-action:hover{color:var(--primary);transform:translateY(-1px)}.risk-high{color:var(--danger);font-weight:800}.risk-medium{color:var(--warning);font-weight:800}.risk-low{color:var(--success);font-weight:800}.print-only{display:none}.sidebar-backdrop{display:none}.receipt{max-width:760px;margin:auto;background:#fff;color:#111;padding:28px;border-radius:12px}.id-card{width:86mm;height:54mm;border-radius:14px;background:linear-gradient(135deg,#312e81,#0e7490);color:white;padding:16px;position:relative;overflow:hidden}.id-card::after{content:"";position:absolute;width:160px;height:160px;border-radius:50%;background:rgba(255,255,255,.09);left:-50px;bottom:-90px}.id-card-grid{display:grid;grid-template-columns:1fr 76px;gap:10px}.id-card .qr{width:72px;height:72px;background:white;padding:4px;border-radius:8px}.checkbox-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.check-card{display:flex;align-items:center;gap:8px;padding:10px;border:1px solid var(--border);border-radius:10px;background:var(--surface-2)}
@keyframes slideIn{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}
@media(max-width:1200px){.metric-grid{grid-template-columns:repeat(2,1fr)}.filter-bar{grid-template-columns:repeat(3,1fr)}.form-grid.cols-3{grid-template-columns:repeat(2,1fr)}}
@media(max-width:991.98px){.app-sidebar{transform:translateX(105%)}html.sidebar-open .app-sidebar{transform:none}.sidebar-backdrop{position:fixed;inset:0;background:rgba(15,23,42,.55);z-index:1030}html.sidebar-open .sidebar-backdrop{display:block}.app-main{width:100%;margin-inline-start:0}.dashboard-grid{grid-template-columns:1fr}.global-search{max-width:none}.content-area{padding:18px}}
@media(max-width:767.98px){.metric-grid,.form-grid,.form-grid.cols-3,.info-grid,.filter-bar,.checkbox-grid{grid-template-columns:1fr}.app-topbar{padding:0 12px;gap:8px}.global-search input{font-size:12px}.content-area{padding:14px}.page-head{flex-direction:column}.page-head h1{font-size:21px}.app-footer{font-size:11px}.metric-card{padding:15px}.receipt{padding:16px}}
@media print{.app-sidebar,.app-topbar,.app-footer,.page-actions,.no-print,.sidebar-backdrop{display:none!important}.app-main{margin:0;width:100%}.content-area{padding:0}.panel,.card{box-shadow:none;border:0}.print-only{display:block}.receipt{max-width:none}.id-card{print-color-adjust:exact;-webkit-print-color-adjust:exact}}

/* Shared interaction, accessibility, and dense ERP screen patterns */
html{scroll-behavior:smooth;color-scheme:light}
html[data-theme="dark"]{color-scheme:dark}
.skip-link{position:fixed;inset-block-start:8px;inset-inline-start:50%;z-index:2000;transform:translate(-50%,-160%);padding:10px 16px;border-radius:10px;background:#111827;color:#fff;text-decoration:none;box-shadow:var(--shadow);transition:transform .2s ease}
.skip-link:focus{transform:translate(-50%,0);color:#fff}
:where(a,button,input,select,textarea,[tabindex]):focus-visible{outline:3px solid rgba(6,182,212,.48);outline-offset:2px}
.search-suggestions a.is-active,.search-suggestions a:focus-visible{background:rgba(79,70,229,.1);color:var(--primary);outline:0}
.table-actions,.form-actions,.filter-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.form-actions{margin-top:20px;padding-top:16px;border-top:1px solid var(--border)}
.filter-actions{align-self:end}
.section-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:0 0 14px}
.section-heading h2,.section-heading h3{margin:0}
.required{color:var(--danger);font-weight:800}
.form-hint{display:block;margin-top:3px;color:var(--muted);font-size:12px;line-height:1.6}
.ltr-input{direction:ltr;text-align:left;unicode-bidi:plaintext}
.field-validation-error{display:block;color:var(--danger);font-size:12px;margin-top:2px}
.input-validation-error{border-color:var(--danger)!important;box-shadow:0 0 0 .15rem rgba(220,38,38,.1)!important}
.badge-muted{background:rgba(100,116,139,.13);color:var(--muted)}
.info-item.full{grid-column:1/-1}
.message-preview,.message-cell{display:block;max-width:390px;white-space:normal;overflow:hidden;text-overflow:ellipsis;line-height:1.65}
.message-preview{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.message-cell{max-height:4.95em;overflow-wrap:anywhere}
.permission-module{padding-block:16px;border-bottom:1px solid var(--border)}
.permission-module:last-child{border-bottom:0}
.permission-module .checkbox-grid{margin-top:12px}
.sticky-form-actions{position:sticky;inset-block-end:0;z-index:10;margin:18px -20px -20px;padding:14px 20px;background:rgba(255,255,255,.94);backdrop-filter:blur(12px);box-shadow:0 -10px 25px rgba(15,23,42,.07)}
html[data-theme="dark"] .sticky-form-actions{background:rgba(23,32,51,.94)}
.submit-spinner{margin-inline-end:7px;vertical-align:-.125em}
form[aria-busy="true"]{cursor:progress}
form[aria-busy="true"] :where(input,select,textarea){opacity:.82}

/* Accessible in-page alerts */
.toast-stack{position:fixed;inset-block-start:88px;inset-inline-end:24px;z-index:1085;width:min(420px,calc(100vw - 32px));display:grid;gap:10px;pointer-events:none}
.app-alert{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:start;gap:11px;padding:14px 15px;border:1px solid transparent;border-radius:14px;background:var(--surface);color:var(--text);box-shadow:0 18px 45px rgba(15,23,42,.18);pointer-events:auto;transition:opacity .25s ease,transform .25s ease}
.app-alert-success{border-color:rgba(5,150,105,.3);background:linear-gradient(135deg,var(--surface),rgba(5,150,105,.08))}
.app-alert-danger{border-color:rgba(220,38,38,.3);background:linear-gradient(135deg,var(--surface),rgba(220,38,38,.08))}
.app-alert-icon{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;font-size:18px}
.app-alert-success .app-alert-icon{background:rgba(5,150,105,.13);color:var(--success)}
.app-alert-danger .app-alert-icon{background:rgba(220,38,38,.13);color:var(--danger)}
.app-alert-content{min-width:0;line-height:1.55}
.app-alert-content strong,.app-alert-content span{display:block}
.app-alert-content span,.app-alert-content ul{margin-top:2px;font-size:13px}
.app-alert-content ul{margin-bottom:0;padding-inline-start:18px}
.app-alert-close{border:0;background:transparent;color:var(--muted);font-size:23px;line-height:1;cursor:pointer;padding:1px 4px;border-radius:7px}
.app-alert-close:hover{background:rgba(100,116,139,.12);color:var(--text)}
.app-alert.is-hiding{opacity:0;transform:translateY(-10px) scale(.98)}

/* Confirmation modal */
.confirm-modal{background:var(--surface);color:var(--text);border:1px solid var(--border);border-radius:18px;box-shadow:0 25px 70px rgba(15,23,42,.28)}
.confirm-modal .modal-header,.confirm-modal .modal-footer{border-color:var(--border)}
.confirm-modal .modal-header{align-items:center;gap:12px}
.confirm-modal-icon{flex:0 0 auto;display:grid;place-items:center;width:44px;height:44px;border-radius:13px;background:rgba(217,119,6,.13);color:var(--warning);font-size:21px}
html[data-theme="dark"] .confirm-modal .btn-close{filter:invert(1) grayscale(1)}

/* Student profile and identity form */
.profile-form-head,.profile-identity,.student-profile-head{display:flex;align-items:center;gap:16px}
.profile-form-head{padding:16px;margin-bottom:20px;border:1px solid var(--border);border-radius:15px;background:linear-gradient(135deg,var(--surface-2),rgba(79,70,229,.06))}
.profile-identity{min-width:0}
.profile-identity>div:last-child{min-width:0}
.profile-identity h1{overflow-wrap:anywhere}
.profile-photo-preview,.profile-avatar-xl{position:relative;flex:0 0 auto;display:grid;place-items:center;overflow:hidden;border-radius:22px;background:linear-gradient(135deg,rgba(79,70,229,.16),rgba(6,182,212,.2));color:var(--primary);border:1px solid rgba(79,70,229,.18);font-weight:800}
.profile-photo-preview{width:96px;height:96px;font-size:32px}
.profile-avatar-xl{width:88px;height:88px;font-size:34px;box-shadow:0 10px 25px rgba(79,70,229,.15)}
.profile-photo-preview img,.profile-avatar-xl img{width:100%;height:100%;object-fit:cover}
.profile-form-head .form-field{flex:1;min-width:0}
.eyebrow{margin-bottom:4px;color:var(--primary);font-size:11px;font-weight:800;letter-spacing:.55px}
.student-profile-head{justify-content:space-between;align-items:center}
.student-profile-head .page-actions{justify-content:flex-end}
.profile-alerts{display:grid;grid-template-columns:auto minmax(0,1fr);gap:12px;align-items:start;margin-bottom:18px;padding:15px 17px;border:1px solid rgba(217,119,6,.32);border-radius:15px;background:linear-gradient(135deg,rgba(217,119,6,.11),rgba(220,38,38,.05));color:var(--text)}
.profile-alerts p{margin:5px 0 0;line-height:1.6}
.profile-alerts p span{color:var(--warning);font-weight:800}
.profile-alert-icon{display:grid;place-items:center;width:38px;height:38px;border-radius:11px;background:rgba(217,119,6,.15);color:var(--warning);font-size:19px}
.metric-value-sm{font-size:20px}
.student-notes-summary{grid-template-columns:repeat(2,minmax(0,1fr));margin-bottom:18px}
.student-notes-summary .panel{height:100%;margin-bottom:0;background:linear-gradient(135deg,var(--surface),var(--surface-2))}
.student-notes-summary p{margin-bottom:0;line-height:1.75;white-space:pre-line}
.profile-tabs{position:sticky;inset-block-start:78px;z-index:15;padding:9px;border:1px solid var(--border);border-radius:14px;background:rgba(255,255,255,.92);box-shadow:var(--shadow);backdrop-filter:blur(12px);overflow-x:auto;flex-wrap:nowrap}
html[data-theme="dark"] .profile-tabs{background:rgba(23,32,51,.92)}
.profile-tabs a{display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.profile-tabs a span{display:inline-grid;place-items:center;min-width:22px;height:22px;padding-inline:6px;border-radius:999px;background:rgba(100,116,139,.12);font-size:10px;font-weight:800}
.profile-tabs a.active span,.profile-tabs a:hover span{background:rgba(79,70,229,.14)}
.anchor-section{scroll-margin-block-start:150px}
.note-composer{display:grid;grid-template-columns:minmax(150px,.55fr) minmax(260px,1.45fr);gap:12px;align-items:end;margin-bottom:18px;padding:15px;border:1px solid var(--border);border-radius:14px;background:var(--surface-2)}
.note-composer .note-body{grid-row:span 2}
.note-composer .note-body textarea{min-height:116px}
.note-composer .check-card{align-self:stretch}
.notes-list{display:grid;gap:10px}
.note-card{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;padding:14px 15px;border:1px solid var(--border);border-radius:13px;background:var(--surface-2)}
.note-card>div{display:grid;gap:7px;min-width:0}
.note-card strong{font-weight:600;line-height:1.7;white-space:pre-wrap;overflow-wrap:anywhere}
.note-card small{color:var(--muted)}
.note-card.is-alert{border-inline-start:4px solid var(--warning);background:linear-gradient(135deg,var(--surface-2),rgba(217,119,6,.09))}
.danger-zone{border-color:rgba(220,38,38,.28);background:linear-gradient(135deg,var(--surface),rgba(220,38,38,.045))}
.check-card.compact{display:inline-flex;width:max-content;max-width:100%;padding:7px 10px;font-size:12px}

/* Printable student identification card */
.id-card-preview{display:grid;place-items:center;min-height:360px;padding:32px;background:radial-gradient(circle at top right,rgba(79,70,229,.12),transparent 48%),var(--surface-2)}
.id-card{width:86mm;height:54mm;display:flex;flex-direction:column;padding:13px 15px;border-radius:15px;box-shadow:0 22px 55px rgba(15,23,42,.25)}
.id-card-brand{display:flex;align-items:center;gap:7px;margin-bottom:9px;font-size:12px;position:relative;z-index:1}
.id-card-logo{display:grid;place-items:center;width:25px;height:25px;border-radius:8px;background:rgba(255,255,255,.18);border:1px solid rgba(255,255,255,.24);font-weight:900}
.id-card-logo img{width:100%;height:100%;object-fit:contain;padding:2px;border-radius:7px;background:#fff}
.id-card-grid.has-photo{grid-template-columns:50px minmax(0,1fr) 72px;align-items:center;gap:9px;position:relative;z-index:1;flex:1}
.id-card-grid.has-photo>div{min-width:0}
.id-card-photo{width:50px;height:62px;display:grid;place-items:center;overflow:hidden;border-radius:10px;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.25);font-size:25px}
.id-card-photo img{width:100%;height:100%;object-fit:cover}
.id-card-grid h2{margin:0 0 5px;font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.id-card-meta{margin-top:2px;font-size:9px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;opacity:.88}
.id-card-grid small{display:block;margin-top:4px;font-size:8px;opacity:.72}
.form-panel-narrow{width:min(760px,100%);margin-inline:auto}
.grade-input{width:120px;min-width:100px;direction:ltr;text-align:center;font-weight:700}
.attendance-status{min-width:145px}
.empty-state h2{margin:0 0 7px;color:var(--text);font-size:18px}
details.danger-inline{position:relative;display:inline-block}
details.danger-inline>summary{list-style:none;cursor:pointer}
details.danger-inline>summary::-webkit-details-marker{display:none}
details.danger-inline[open]>summary{background:rgba(220,38,38,.1);color:var(--danger)}
details.danger-inline>form{position:absolute;inset-block-start:calc(100% + 8px);inset-inline-end:0;z-index:50;width:290px;padding:14px;border:1px solid rgba(220,38,38,.28);border-radius:13px;background:var(--surface);box-shadow:0 18px 45px rgba(15,23,42,.2)}
details.danger-inline>form label{display:block;margin-bottom:7px;color:var(--danger);font-size:12px;font-weight:800}

/* Teacher profile editor */
.profile-form-layout{display:grid;grid-template-columns:280px minmax(0,1fr);gap:18px;align-items:start}
.profile-photo-panel{position:sticky;inset-block-start:90px;display:grid;gap:16px;justify-items:stretch}
.profile-photo-panel .profile-photo-preview{width:156px;height:156px;margin-inline:auto;border-radius:30px}
.profile-photo-placeholder{display:grid;place-items:center;width:100%;height:100%;font-size:52px}
.profile-form-main{min-width:0}
.profile-form-main>.panel:last-child{margin-bottom:0}
.field-hint{display:block;margin-top:3px;color:var(--muted);font-size:12px;line-height:1.6}
.check-card-danger{border-color:rgba(220,38,38,.25);background:rgba(220,38,38,.06);color:var(--danger)}
.check-card-danger:has(input:checked){border-color:rgba(220,38,38,.5);background:rgba(220,38,38,.12)}

/* Notifications and compact identity rows */
.notification-list{display:grid;gap:10px}
.notification-item{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:13px;padding:14px 15px;border:1px solid var(--border);border-radius:14px;background:var(--surface-2);transition:border-color .2s ease,background .2s ease,transform .2s ease}
.notification-item:hover{transform:translateY(-1px);border-color:rgba(79,70,229,.28)}
.notification-item.is-unread{border-inline-start:4px solid var(--primary);background:linear-gradient(135deg,rgba(79,70,229,.08),var(--surface))}
.notification-item.is-read{opacity:.82}
.notification-icon{display:grid;place-items:center;width:42px;height:42px;padding:0;border-radius:13px;font-size:18px}
.notification-content{display:grid;gap:3px;min-width:0;color:var(--text);text-decoration:none}
.notification-content:hover{color:var(--primary)}
.notification-content span{line-height:1.65;overflow-wrap:anywhere}
.notification-content small{color:var(--muted)}
.table-person{display:flex;align-items:center;gap:10px;min-width:190px}
.table-person>div{min-width:0}
.table-person strong,.table-person small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.table-avatar{flex:0 0 40px;display:grid;place-items:center;width:40px;height:40px;overflow:hidden;border-radius:12px;background:linear-gradient(135deg,rgba(79,70,229,.18),rgba(6,182,212,.2));color:var(--primary);font-weight:800}
.table-avatar img{width:100%;height:100%;object-fit:cover}

/* Settings and branded identity */
.brand-mark{overflow:hidden}
.brand-mark img{width:100%;height:100%;object-fit:contain;padding:4px;background:#fff}
.course-photo-preview img,.course-details-avatar img{width:100%;height:100%;object-fit:cover}
.course-table-image i,.course-details-avatar i{font-size:20px}
.course-details-avatar{border-radius:24px}
.settings-tabs{position:sticky;inset-block-start:78px;z-index:16;display:flex;gap:7px;margin-bottom:18px;padding:8px;border:1px solid var(--border);border-radius:14px;background:rgba(255,255,255,.93);box-shadow:var(--shadow);backdrop-filter:blur(12px);overflow-x:auto}
html[data-theme="dark"] .settings-tabs{background:rgba(23,32,51,.93)}
.settings-tabs a{display:inline-flex;align-items:center;gap:7px;padding:9px 13px;border-radius:10px;color:var(--muted);text-decoration:none;white-space:nowrap;font-weight:700}
.settings-tabs a:hover,.settings-tabs a.active{background:rgba(79,70,229,.11);color:var(--primary)}
.branding-settings-card{background:radial-gradient(circle at top left,rgba(6,182,212,.09),transparent 42%),var(--surface)}
.branding-settings-card .panel-title p,.setting-card-head p{margin:4px 0 0;color:var(--muted)}
.branding-upload-layout{display:grid;grid-template-columns:170px minmax(0,1fr);gap:22px;align-items:center}
.branding-logo-preview{display:grid;place-items:center;width:150px;height:150px;overflow:hidden;border:1px dashed rgba(79,70,229,.35);border-radius:28px;background:linear-gradient(135deg,rgba(79,70,229,.09),rgba(6,182,212,.1));color:var(--primary)}
.branding-logo-preview img{width:100%;height:100%;object-fit:contain;padding:12px}
.branding-logo-preview span{font-size:47px}
.branding-upload-form{display:grid;gap:12px;max-width:620px}
.branding-upload-form .btn{justify-self:start}
.integration-note,.financial-warning{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:start;gap:12px;margin-bottom:18px;padding:15px 17px;border:1px solid rgba(6,182,212,.28);border-radius:15px;background:linear-gradient(135deg,rgba(6,182,212,.1),rgba(79,70,229,.05))}
.integration-note>i,.financial-warning>i{display:grid;place-items:center;width:38px;height:38px;border-radius:11px;background:rgba(6,182,212,.13);color:#0891b2;font-size:18px}
.integration-note p,.financial-warning p{margin:4px 0 0;color:var(--muted);line-height:1.7}
.financial-warning{border-color:rgba(217,119,6,.3);background:linear-gradient(135deg,rgba(217,119,6,.1),rgba(220,38,38,.04))}
.financial-warning>i{background:rgba(217,119,6,.13);color:var(--warning)}
.settings-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}
.setting-card{display:grid;align-content:start;gap:11px;padding:15px;border:1px solid var(--border);border-radius:14px;background:var(--surface-2)}
.setting-card.is-sensitive{border-color:rgba(217,119,6,.28);background:linear-gradient(135deg,var(--surface-2),rgba(217,119,6,.055))}
.setting-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}
.setting-card-head label{display:block;font-weight:800}
.setting-card-head code{display:block;margin-top:3px;color:var(--muted);font-size:10px;overflow-wrap:anywhere}
.color-setting{display:grid;grid-template-columns:52px minmax(0,1fr);gap:9px;align-items:center}
.color-setting input[type="color"]{width:52px;height:42px;padding:3px;border:1px solid var(--border);border-radius:10px;background:var(--surface);cursor:pointer}
.pre-line{white-space:pre-line;overflow-wrap:anywhere}
.app-breadcrumb{display:flex;align-items:center;gap:7px;min-height:28px;margin:-5px 0 14px;color:var(--muted);font-size:12px;overflow-x:auto;white-space:nowrap}
.app-breadcrumb a{display:inline-flex;align-items:center;gap:5px;color:var(--muted);text-decoration:none}
.app-breadcrumb a:hover{color:var(--primary)}
.app-breadcrumb>i{font-size:9px;opacity:.65}
.app-breadcrumb strong{color:var(--text);font-weight:700}

/* Better mobile top bar and compact layouts */
@media(max-width:991.98px){
    html.sidebar-open,html.sidebar-open body{overflow:hidden}
    .profile-tabs{inset-block-start:71px}
    .profile-form-layout{grid-template-columns:230px minmax(0,1fr)}
    .settings-tabs{inset-block-start:71px}
}
@media(max-width:767.98px){
    .app-topbar{height:64px}
    .global-search{min-width:0;padding-inline:9px}
    .global-search input{min-width:0;padding-inline:7px}
    .topbar-actions{gap:2px}
    .user-menu{gap:2px;padding-inline-start:3px}
    .icon-btn{width:37px;height:37px}
    .toast-stack{inset-block-start:72px;inset-inline:12px;width:auto}
    .table-actions,.form-actions,.filter-actions{width:100%}
    .form-actions>.btn,.filter-actions>.btn{flex:1 1 auto}
    .pager{flex-wrap:wrap}
    .sticky-form-actions{margin-inline:-20px}
    .student-profile-head{align-items:flex-start}
    .student-profile-head,.profile-form-head{flex-direction:column}
    .profile-identity{width:100%}
    .student-profile-head .page-actions{width:100%;justify-content:flex-start}
    .student-notes-summary{grid-template-columns:1fr}
    .profile-tabs{inset-block-start:67px;margin-inline:-4px}
    .note-composer{grid-template-columns:1fr}
    .note-composer .note-body{grid-row:auto}
    .note-composer .btn{width:100%}
    .note-card{align-items:stretch;flex-direction:column}
    .note-card form,.note-card form .btn{width:100%}
    .id-card-preview{min-height:300px;padding:18px;overflow:auto}
    .id-card-preview .id-card{transform:scale(.88);transform-origin:center}
    details.danger-inline>form{position:fixed;inset:auto 12px 12px;width:auto;z-index:1090}
    .profile-form-layout,.branding-upload-layout,.settings-grid{grid-template-columns:1fr}
    .profile-photo-panel{position:static}
    .profile-photo-panel .profile-photo-preview,.branding-logo-preview{width:132px;height:132px;margin-inline:auto}
    .settings-tabs{inset-block-start:67px;margin-inline:-4px}
    .notification-item{grid-template-columns:auto minmax(0,1fr)}
    .notification-item>form,.notification-item>.badge-soft:last-child{grid-column:1/-1;justify-self:stretch}
    .notification-item>form .btn{width:100%}
    .branding-upload-form .btn{width:100%;justify-self:stretch}
}
@media(max-width:575.98px){
    .app-topbar{padding-inline:8px;gap:4px}
    .global-search input::placeholder{color:transparent}
    .topbar-actions,.user-menu{gap:0}
    .user-avatar{display:none}
    .content-area{padding-inline:10px}
    .profile-avatar-xl{width:72px;height:72px;border-radius:18px;font-size:28px}
    .profile-form-head{align-items:stretch}
    .profile-form-head .profile-photo-preview{align-self:center}
    .profile-identity{align-items:flex-start}
    .profile-tabs{margin-inline:-2px}
    .id-card-preview{min-height:260px;padding:10px}
    .id-card-preview .id-card{transform:scale(.72)}
}

@media(prefers-reduced-motion:reduce){
    html{scroll-behavior:auto}
    *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}
}

@media print{
    :root,html[data-theme="dark"]{--bg:#fff;--surface:#fff;--surface-2:#fff;--text:#111827;--muted:#475569;--border:#d1d5db;color-scheme:light}
    body,.content-area,.panel,.card,.metric-card,.info-item{background:#fff!important;color:#111827!important}
    .toast-stack,.modal,.profile-tabs,.skip-link,details.danger-inline{display:none!important}
    .table-wrap{overflow:visible;border-color:#d1d5db}
    .data-table{min-width:0}
    .anchor-section{break-inside:avoid}
    .id-card-preview{display:block!important;min-height:0;padding:0!important;background:none!important;border:0!important}
    .id-card-preview .id-card,.id-card{width:86mm!important;height:54mm!important;transform:none!important;margin:0 auto!important;box-shadow:none!important;border-radius:3mm!important;print-color-adjust:exact!important;-webkit-print-color-adjust:exact!important}
}