:root{--ink:#172033;--muted:#728096;--blue:#3859d9;--blue2:#6a7ff0;--aqua:#14b8a6;--bg:#f3f6fb;--panel:#fff;--line:#e4e9f2;--danger:#dc3545;--shadow:0 14px 40px rgba(36,50,89,.09)}*{box-sizing:border-box}html{font-size:15px}body{margin:0;font-family:"Segoe UI",Tahoma,Arial,sans-serif;background:var(--bg);color:var(--ink)}button,input,select,textarea{font:inherit}button{cursor:pointer}.login-page{min-height:100vh;display:grid;grid-template-columns:1.08fr .92fr;background:#fff}.login-art{position:relative;overflow:hidden;background:linear-gradient(145deg,#243a92,#435fdc 55%,#16a99c);color:#fff;padding:10vh 9vw;display:flex;flex-direction:column;justify-content:center}.login-art:after{content:"";position:absolute;width:430px;height:430px;border:80px solid #ffffff10;border-radius:50%;left:-180px;bottom:-180px}.brand-symbol{width:68px;height:68px;border-radius:21px;background:#fff;color:var(--blue);display:grid;place-items:center;font-size:36px;font-weight:900;box-shadow:var(--shadow);object-fit:cover}.brand-symbol.small{width:48px;height:48px;border-radius:15px;font-size:25px}.eyebrow{margin-top:50px;opacity:.78}.login-art h1{font-size:clamp(38px,5vw,70px);line-height:1.22;margin:18px 0}.login-art p{max-width:630px;font-size:18px;line-height:1.9;opacity:.88}.feature-pills{display:flex;gap:10px;flex-wrap:wrap}.feature-pills span{padding:9px 13px;border:1px solid #ffffff3b;border-radius:99px;background:#ffffff12}.login-panel{display:grid;place-items:center;padding:30px}.login-card{width:min(440px,100%)}.login-card h2{font-size:30px;margin:25px 0 8px}.login-card>p{color:var(--muted);margin-bottom:30px}.login-card label,.form-grid label{display:flex;flex-direction:column;gap:8px;margin-bottom:17px;color:#536078;font-weight:600}.login-card input,input,select,textarea{border:1px solid #d9e0ec;border-radius:12px;padding:12px 14px;background:#fff;min-width:0;width:100%}.login-card input:focus,input:focus,select:focus{outline:3px solid #3859d921;border-color:var(--blue)}.mobile-brand{display:none;align-items:center;gap:10px}.mobile-brand span{width:40px;height:40px;border-radius:12px;background:var(--blue);color:#fff;display:grid;place-items:center}.primary,.secondary,.danger{border:0;border-radius:11px;padding:11px 17px;font-weight:700}.primary{background:linear-gradient(135deg,var(--blue),var(--blue2));color:#fff}.secondary{background:#edf1ff;color:#334fc0}.danger{background:#ffedf0;color:#b51e32}.wide{width:100%;padding:14px}.login-card small{display:block;color:var(--danger);margin-top:12px}.app{display:grid;grid-template-columns:270px minmax(0,1fr);min-height:100vh}aside{height:100vh;position:sticky;top:0;background:#151d38;color:#d7dffb;padding:18px 14px;display:flex;flex-direction:column;z-index:30}.side-brand{display:flex;align-items:center;gap:12px;padding:8px 7px 20px;border-bottom:1px solid #ffffff14}.side-brand>div:nth-child(2){display:flex;flex-direction:column;gap:5px;min-width:0}.side-brand small{color:#9ba8d0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.side-brand>button{margin-right:auto;background:none;border:0;color:#fff;font-size:28px}nav{display:flex;flex-direction:column;gap:5px;margin-top:20px;overflow:auto}nav button{border:0;background:transparent;color:#aeb9de;border-radius:11px;padding:12px 14px;text-align:right;display:flex;gap:12px;align-items:center}nav button:hover,nav button.active{background:#ffffff12;color:#fff}nav button.active{box-shadow:inset -3px 0 var(--aqua)}.side-user{margin-top:auto;display:flex;align-items:center;gap:10px;padding:15px 7px 4px;border-top:1px solid #ffffff14}.side-user>div:nth-child(2){display:flex;flex-direction:column;gap:4px;min-width:0}.side-user small{color:#8e9bc4}.side-user button{margin-right:auto;border:0;background:none;color:#fff;font-size:20px}.avatar{width:39px;height:39px;border-radius:12px;background:linear-gradient(135deg,#20c8b5,#5771ec);display:grid;place-items:center;color:#fff;font-weight:800}.workspace{min-width:0}.workspace header{height:88px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:16px;padding:0 30px;position:sticky;top:0;z-index:20}.workspace header h1{margin:0;font-size:23px}.workspace header p{margin:6px 0 0;color:var(--muted)}.header-end{margin-right:auto}.online-dot{color:#159478;background:#e7faf5;border-radius:99px;padding:7px 11px;font-size:12px}.only-mobile{display:none}#content{padding:26px}.cards{display:grid;grid-template-columns:repeat(4,minmax(150px,1fr));gap:16px}.stat{background:#fff;border:1px solid var(--line);border-radius:17px;padding:19px;box-shadow:0 5px 20px #2432590a;display:flex;justify-content:space-between;align-items:center}.stat span{color:var(--muted)}.stat b{display:block;font-size:30px;margin-top:9px}.stat i{width:49px;height:49px;border-radius:14px;background:#edf1ff;color:var(--blue);display:grid;place-items:center;font-style:normal;font-size:22px}.panel{background:#fff;border:1px solid var(--line);border-radius:17px;box-shadow:0 5px 20px #24325908;margin-top:19px;overflow:hidden}.panel-head{padding:17px 20px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;gap:12px}.panel-head h2{font-size:18px;margin:0}.toolbar{display:flex;gap:9px;flex-wrap:wrap;align-items:center}.toolbar input,.toolbar select{width:auto;min-width:170px}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse}th,td{padding:12px 14px;border-bottom:1px solid #edf0f5;text-align:right;white-space:nowrap}th{background:#f8f9fc;color:#5d6981;font-size:13px}td{font-size:14px}.actions{display:flex;gap:6px}.actions button{padding:6px 9px;border:0;border-radius:8px}.empty{text-align:center;padding:45px;color:var(--muted)}dialog{border:0;border-radius:19px;padding:0;width:min(720px,94vw);box-shadow:0 40px 100px #10182d66}dialog::backdrop{background:#11182a99}.modal-head,.modal-actions{display:flex;align-items:center;justify-content:space-between;padding:18px 21px;border-bottom:1px solid var(--line)}.modal-head h2{margin:0}.modal-head button{border:0;background:none;font-size:26px}.modal-actions{justify-content:flex-start;gap:9px;border-top:1px solid var(--line);border-bottom:0}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;padding:21px}.form-grid label{margin:0}.form-grid .full{grid-column:1/-1}.check{flex-direction:row!important;align-items:center}.check input{width:auto}.color-dot{display:inline-block;width:15px;height:15px;border-radius:5px;margin-left:6px}.schedule-tools{display:flex;gap:9px;flex-wrap:wrap;align-items:center;margin-bottom:15px}.quality{background:#e8faf5;color:#12816d;padding:10px 14px;border-radius:10px}.day-card{background:#fff;border:1px solid var(--line);border-radius:16px;margin-bottom:17px;padding:16px;overflow:auto}.day-card h2{margin:0 0 14px}.schedule-table{min-width:900px}.lesson{border-right:4px solid var(--subject);background:#f7f9ff;border-radius:8px;padding:7px;white-space:normal;min-width:120px}.lesson b,.lesson small{display:block}.lesson small{color:var(--muted);margin-top:4px}.settings-grid{padding:20px}.logo-preview{width:80px;height:80px;border-radius:16px;object-fit:contain;border:1px solid var(--line);padding:5px}.device-list{display:grid;gap:8px}.device-row{display:flex;gap:10px;align-items:center;padding:12px;background:#f7f9fc;border-radius:11px}.device-row button{margin-right:auto}.admin-status{padding:5px 9px;border-radius:99px;font-size:12px}.admin-status.active{background:#e6f8f2;color:#168069}.admin-status.suspended{background:#ffebee;color:#b42332}#toast{position:fixed;left:25px;bottom:25px;background:#17223e;color:#fff;border-radius:11px;padding:13px 18px;z-index:100;opacity:0;transform:translateY(15px);transition:.2s;pointer-events:none;max-width:min(420px,90vw)}#toast.show{opacity:1;transform:none}
@media(max-width:1050px){.cards{grid-template-columns:repeat(2,1fr)}}
@media(max-width:760px){.login-page{display:block;background:linear-gradient(160deg,#263d98,#13a99d);padding:24px;min-height:100vh}.login-art{display:none}.login-panel{padding:0;min-height:calc(100vh - 48px)}.login-card{background:#fff;padding:25px 20px;border-radius:22px}.mobile-brand{display:flex}.app{display:block}.only-mobile{display:block}aside{position:fixed;right:0;top:0;width:285px;transform:translateX(105%);transition:.25s;box-shadow:-20px 0 60px #0004}aside.open{transform:none}.workspace header{padding:0 15px;height:76px}.workspace header h1{font-size:19px}.workspace header p,.online-dot{display:none}.icon-btn{border:0;background:#edf1ff;color:var(--blue);border-radius:10px;padding:9px 11px}#content{padding:15px}.cards{grid-template-columns:1fr 1fr;gap:10px}.stat{padding:14px}.stat b{font-size:24px}.stat i{width:42px;height:42px}.panel-head{align-items:flex-start;flex-direction:column}.form-grid{grid-template-columns:1fr;padding:16px}.form-grid .full{grid-column:auto}.actions{position:sticky;left:0;background:#fff}.schedule-tools>*{flex:1}.day-card{padding:10px}.toolbar input,.toolbar select{width:100%}}
@media print{aside,.workspace header,.schedule-tools,.no-print{display:none!important}.app{display:block}#content{padding:0}.day-card{box-shadow:none;break-inside:avoid;border:0;padding:0}.schedule-table{min-width:0;font-size:9px}.lesson{min-width:0;padding:3px}body{background:#fff}}
.schedule-table td{cursor:pointer;min-height:55px}.schedule-table td:hover{background:#f2f5ff}.lesson{cursor:pointer}.lesson.selected{outline:3px solid var(--aqua);background:#e8faf5}
.device-agent{max-width:360px;overflow:hidden;text-overflow:ellipsis}.device-row small{display:block;color:var(--muted);margin-top:4px}

/* Weekly timetable — grouped school-style layout */
.schedule-title{background:#fff;border:1px solid #dbe6e2;border-radius:18px;padding:20px 24px;margin:0 0 15px;text-align:center;box-shadow:0 2px 8px #183b2b0a}
.schedule-title .school-label{color:#62746f;font-size:14px;font-weight:800;margin-bottom:4px}
.schedule-title h2{margin:0;color:#071b36;font-size:clamp(22px,3vw,34px);font-weight:900}
.day-card{background:#eef7f4;border:1px solid #d9e9e4;border-radius:18px;margin-bottom:17px;padding:0;overflow:auto}
.day-card h2{margin:0;padding:12px 18px;text-align:right;color:#07694e;font-size:26px;font-weight:900}
.schedule-table{width:100%;min-width:1100px;border-collapse:collapse;border-spacing:0;background:#fff;direction:rtl;table-layout:fixed}
.schedule-table th,.schedule-table td{border:1px solid #17201e;text-align:center;vertical-align:middle}
.schedule-table .grade-head{padding:9px 6px;color:#fff;font-size:16px;font-weight:900}
.schedule-table .section-head{padding:8px 5px;color:#33415a;font-size:14px;font-weight:800}
.schedule-table .grade-0{background:#2679bf}.schedule-table .grade-0-light{background:#cce8f7}
.schedule-table .grade-1{background:#2f9049}.schedule-table .grade-1-light{background:#cff2d5}
.schedule-table .grade-2{background:#9b3bb7}.schedule-table .grade-2-light{background:#f0d4f5}
.schedule-table .grade-3{background:#ed7d00}.schedule-table .grade-3-light{background:#ffea9b}
.schedule-table .grade-4{background:#117f91}.schedule-table .grade-4-light{background:#c4f0f2}
.schedule-table .period-head,.schedule-table .period-cell{width:66px;min-width:66px;background:#ffd5a2;color:#8a3400;font-weight:900}
.schedule-table .period-head{font-size:14px;padding:7px 4px}
.schedule-table .period-cell{font-size:15px}
.schedule-table .schedule-slot{height:72px;min-width:126px;padding:0;background:#fff;cursor:pointer}
.schedule-table .schedule-slot:hover{background:#f6faf8}
.schedule-table .lesson{position:relative;margin:7px;border:0;border-right:5px solid var(--subject);border-radius:10px;background:#dcfce7;padding:7px 8px;min-width:0;box-shadow:none;text-align:right;line-height:1.35}
.schedule-table .lesson b{display:flex;align-items:center;gap:6px;color:#12243a;font-size:13px;font-weight:900}
.schedule-table .lesson b i{width:10px;height:10px;flex:0 0 10px;border-radius:50%;background:var(--subject)}
.schedule-table .lesson small{display:block;margin-top:4px;color:#65746f;font-size:11px}
.schedule-table .lesson .lesson-lock{color:#d79300;margin-left:4px}
.schedule-table .lesson.selected{outline:3px solid #16a99d;outline-offset:1px;background:#cff8dc}
@media(max-width:760px){.schedule-title{padding:16px 12px}.schedule-title h2{font-size:21px}.day-card{padding:0}.day-card h2{font-size:22px}.schedule-table{min-width:980px}.schedule-table .schedule-slot{height:68px}}
@media print{.schedule-title{border:1px solid #bbb;border-radius:0;padding:10px;margin-bottom:8px}.schedule-title .school-label{font-size:10px}.schedule-title h2{font-size:19px}.day-card{border:1px solid #aaa;border-radius:0;margin-bottom:8px;overflow:visible}.day-card h2{padding:6px 8px;font-size:15px}.schedule-table{min-width:0;font-size:8px;table-layout:fixed}.schedule-table .grade-head,.schedule-table .section-head{padding:4px 2px}.schedule-table .schedule-slot{height:40px;min-width:0}.schedule-table .period-head,.schedule-table .period-cell{width:35px;min-width:35px}.schedule-table .lesson{margin:2px;padding:2px 3px;border-right-width:3px}.schedule-table .lesson b{font-size:7px}.schedule-table .lesson small{font-size:6px;margin-top:1px}}

@page{size:A3 landscape;margin:4mm}
@media print{
 html,body{width:100%;height:auto;margin:0!important;padding:0!important;background:#fff!important;-webkit-print-color-adjust:exact!important;print-color-adjust:exact!important}
 #content{width:100%!important;margin:0!important;padding:0!important;overflow:visible!important}
 .schedule-title{height:auto;margin:0 0 3px!important;padding:4px 8px!important;border:1px solid #777!important;border-radius:0!important;box-sizing:border-box}
 .schedule-title .school-label{font-size:7px!important;line-height:1.1}
 .schedule-title h2{font-size:13px!important;line-height:1.15}
 .day-card{width:100%!important;margin:0 0 3px!important;padding:0!important;border:1px solid #555!important;border-radius:0!important;overflow:visible!important;break-inside:avoid!important;page-break-inside:avoid!important;box-sizing:border-box}
 .day-card h2{height:15px;margin:0!important;padding:1px 5px!important;font-size:9px!important;line-height:13px!important;box-sizing:border-box}
 .schedule-table{width:100%!important;min-width:0!important;margin:0!important;border-collapse:collapse!important;table-layout:fixed!important;font-size:6px!important}
 .schedule-table th,.schedule-table td{border:.5px solid #222!important;line-height:1.05!important}
 .schedule-table .grade-head{height:14px;padding:1px!important;font-size:7px!important;white-space:nowrap!important}
 .schedule-table .section-head{height:12px;padding:1px!important;font-size:6px!important;white-space:nowrap!important}
 .schedule-table .schedule-slot{height:19px!important;min-width:0!important;padding:0!important}
 .schedule-table .period-head,.schedule-table .period-cell{width:25px!important;min-width:25px!important;padding:0!important;font-size:6px!important}
 .schedule-table .lesson{margin:1px!important;padding:1px 2px!important;border-right-width:2px!important;border-radius:2px!important;line-height:1!important}
 .schedule-table .lesson b{display:block!important;overflow:hidden!important;white-space:nowrap!important;text-overflow:ellipsis!important;font-size:5.5px!important;line-height:1!important}
 .schedule-table .lesson b i{display:none!important}
 .schedule-table .lesson small{overflow:hidden!important;white-space:nowrap!important;text-overflow:ellipsis!important;font-size:5px!important;line-height:1!important;margin:1px 0 0!important}
}

/* Fill one A3 landscape sheet vertically (five school days). */
@media print{
 #content{height:288mm!important;display:flex!important;flex-direction:column!important}
 .schedule-title{flex:0 0 9mm!important;height:9mm!important;margin:0 0 .8mm!important;padding:1.3mm 2mm!important}
 .schedule-title .school-label{font-size:8px!important}
 .schedule-title h2{font-size:15px!important}
 .day-card{flex:0 0 54.2mm!important;height:54.2mm!important;margin:0 0 .8mm!important;display:flex!important;flex-direction:column!important}
 .day-card:last-child{margin-bottom:0!important}
 .day-card h2{flex:0 0 5mm!important;height:5mm!important;padding:.6mm 2mm!important;font-size:11px!important;line-height:3.8mm!important}
 .schedule-table{flex:1 1 auto!important;height:49.2mm!important}
 .schedule-table thead{height:8mm!important}
 .schedule-table tbody{height:41.2mm!important}
 .schedule-table tbody tr{height:5.88mm!important}
 .schedule-table .grade-head{height:4.2mm!important;font-size:9px!important}
 .schedule-table .section-head{height:3.8mm!important;font-size:8px!important}
 .schedule-table .schedule-slot{height:5.88mm!important}
 .schedule-table .period-head,.schedule-table .period-cell{font-size:8px!important}
 .schedule-table .lesson b{font-size:7px!important}
 .schedule-table .lesson small{font-size:6px!important}
}