@import"https://fonts.googleapis.com/css2?family=Syne:wght@400;500;600;700;800&family=DM+Sans:wght@300;400;500;600&display=swap";:root{--primary: #1a1f36;--primary-light: #252d4a;--accent: #4f6ef7;--accent-hover: #3a5ae8;--accent-light: rgba(79, 110, 247, .12);--accent2: #f7934f;--success: #10b981;--success-light: rgba(16, 185, 129, .12);--warning: #f59e0b;--warning-light: rgba(245, 158, 11, .12);--danger: #ef4444;--danger-light: rgba(239, 68, 68, .12);--info: #06b6d4;--info-light: rgba(6, 182, 212, .12);--bg: #f0f2f8;--bg-card: #ffffff;--bg-sidebar: #1a1f36;--bg-header: #ffffff;--text-primary: #1a1f36;--text-secondary: #64748b;--text-muted: #94a3b8;--text-white: #ffffff;--border: #e2e8f0;--border-focus: #4f6ef7;--shadow-sm: 0 1px 3px rgba(0,0,0,.06), 0 1px 2px rgba(0,0,0,.04);--shadow: 0 4px 6px -1px rgba(0,0,0,.07), 0 2px 4px -1px rgba(0,0,0,.04);--shadow-md: 0 10px 15px -3px rgba(0,0,0,.08), 0 4px 6px -2px rgba(0,0,0,.04);--shadow-lg: 0 20px 25px -5px rgba(0,0,0,.1), 0 10px 10px -5px rgba(0,0,0,.04);--shadow-accent: 0 8px 25px rgba(79, 110, 247, .25);--sidebar-width: 260px;--header-height: 64px;--radius-sm: 8px;--radius: 12px;--radius-lg: 16px;--radius-xl: 24px;--transition: all .2s ease;--transition-slow: all .35s cubic-bezier(.4, 0, .2, 1)}[data-theme=dark]{--bg: #0f1117;--bg-card: #1a1f2e;--bg-sidebar: #0d1117;--bg-header: #1a1f2e;--text-primary: #e2e8f0;--text-secondary: #94a3b8;--text-muted: #64748b;--border: #2a3040;--primary: #252d4a}*{margin:0;padding:0;box-sizing:border-box}body{font-family:DM Sans,sans-serif;background:var(--bg);color:var(--text-primary);min-height:100vh;overflow-x:hidden}.welcome-banner{background:linear-gradient(135deg,#4f6ef7,#8b5cf6);border-radius:var(--radius-lg);padding:24px 28px;color:#fff;margin-bottom:24px;display:flex;align-items:center;justify-content:space-between;gap:16px;overflow:hidden;position:relative}.welcome-banner:before{content:"🏫";position:absolute;right:20px;top:50%;transform:translateY(-50%);font-size:80px;opacity:.15}.welcome-title{font-family:Syne,sans-serif;font-size:22px;font-weight:800;margin-bottom:4px}.welcome-sub{font-size:13px;opacity:.8}.access-denied{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:80px 24px}.charts-grid{display:grid;grid-template-columns:2fr 1fr;gap:20px;margin-bottom:24px}.chart-wrap{position:relative;width:100%;height:220px}.app-layout{display:flex;min-height:100vh;width:100%;max-width:100vw;overflow-x:hidden}.sidebar{width:var(--sidebar-width);background:var(--bg-sidebar);position:fixed;left:0;top:0;bottom:0;z-index:100;display:flex;flex-direction:column;transition:var(--transition-slow);overflow-y:auto;scrollbar-width:none}.sidebar::-webkit-scrollbar{display:none}.sidebar-brand{padding:20px 20px 16px;border-bottom:1px solid rgba(255,255,255,.07);display:flex;align-items:center;gap:12px}.sidebar-logo{width:38px;height:38px;background:var(--accent);border-radius:10px;display:flex;align-items:center;justify-content:center;font-family:Syne,sans-serif;font-weight:800;font-size:16px;color:#fff;box-shadow:0 4px 12px #4f6ef766;flex-shrink:0}.sidebar-brand-text h2{font-family:Syne,sans-serif;font-size:14px;font-weight:700;color:#fff;line-height:1.2}.sidebar-brand-text span{font-size:11px;color:#ffffff73;font-weight:400}.sidebar-section{padding:16px 12px 4px}.sidebar-section-label{font-size:10px;font-weight:600;letter-spacing:1.2px;color:#ffffff4d;text-transform:uppercase;padding:0 8px;margin-bottom:4px}.nav-item{display:flex;align-items:center;gap:10px;padding:9px 12px;border-radius:var(--radius-sm);color:#ffffff8c;text-decoration:none;font-size:13px;font-weight:500;transition:var(--transition);cursor:pointer;margin-bottom:2px}.nav-item:hover{background:#ffffff12;color:#ffffffe6}.nav-item.active{background:var(--accent);color:#fff;box-shadow:0 4px 12px #4f6ef759}.nav-icon{font-size:16px;width:20px;text-align:center;flex-shrink:0}.sidebar-footer{margin-top:auto;padding:12px;border-top:1px solid rgba(255,255,255,.07)}.sidebar-user{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:var(--radius-sm);cursor:pointer;transition:var(--transition)}.sidebar-user:hover{background:#ffffff12}.sidebar-avatar{width:32px;height:32px;border-radius:50%;background:linear-gradient(135deg,var(--accent),var(--accent2));display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;color:#fff;flex-shrink:0}.sidebar-user-info{flex:1;min-width:0}.sidebar-user-name{font-size:12px;font-weight:600;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sidebar-user-role{font-size:10px;color:#fff6}.main-content{margin-left:var(--sidebar-width);flex:1;display:flex;flex-direction:column;min-height:100vh;transition:margin-left .25s ease;min-width:0;width:100%;max-width:100%;overflow-x:hidden}@media (min-width: 901px){.sidebar.collapsed{transform:translate(-100%)}.main-content.expanded{margin-left:0}}.header-toggle{margin-right:12px}.header{height:var(--header-height);background:var(--bg-header);border-bottom:1px solid var(--border);display:flex;align-items:center;padding:0 24px;gap:16px;position:sticky;top:0;z-index:50;box-shadow:var(--shadow-sm)}.header-title{flex:1}.header-title h1{font-family:Syne,sans-serif;font-size:18px;font-weight:700;color:var(--text-primary)}.header-title p{font-size:12px;color:var(--text-muted)}.header-actions{display:flex;align-items:center;gap:8px}.header-btn{width:36px;height:36px;border-radius:50%;border:1px solid var(--border);background:var(--bg);cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:16px;color:var(--text-secondary);transition:var(--transition)}.header-btn:hover{background:var(--accent-light);color:var(--accent);border-color:var(--accent)}.header-user{display:flex;align-items:center;gap:8px;padding:4px 10px 4px 4px;border-radius:50px;border:1px solid var(--border);cursor:pointer;transition:var(--transition)}.header-user:hover{background:var(--bg)}.header-avatar{width:30px;height:30px;border-radius:50%;background:linear-gradient(135deg,var(--accent),var(--accent2));display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;color:#fff}.header-user-info{font-size:12px}.header-user-name{font-weight:600;color:var(--text-primary)}.header-user-role{color:var(--text-muted);font-size:10px}.page-content{flex:1;padding:24px;min-width:0;width:100%;max-width:100%;overflow-x:hidden}.stats-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:16px;margin-bottom:24px}.stat-card{background:var(--bg-card);border-radius:var(--radius);padding:20px;border:1px solid var(--border);box-shadow:var(--shadow-sm);transition:var(--transition);position:relative;overflow:hidden}.stat-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-md)}.stat-card:before{content:"";position:absolute;top:0;left:0;right:0;height:3px}.stat-card.blue:before{background:var(--accent)}.stat-card.green:before{background:var(--success)}.stat-card.orange:before{background:var(--warning)}.stat-card.red:before{background:var(--danger)}.stat-card.teal:before{background:var(--info)}.stat-card.purple:before{background:#8b5cf6}.stat-icon{width:44px;height:44px;border-radius:var(--radius-sm);display:flex;align-items:center;justify-content:center;font-size:20px;margin-bottom:14px}.stat-card.blue .stat-icon{background:var(--accent-light)}.stat-card.green .stat-icon{background:var(--success-light)}.stat-card.orange .stat-icon{background:var(--warning-light)}.stat-card.red .stat-icon{background:var(--danger-light)}.stat-card.teal .stat-icon{background:var(--info-light)}.stat-card.purple .stat-icon{background:#8b5cf61f}.stat-value{font-family:Syne,sans-serif;font-size:24px;font-weight:800;color:var(--text-primary);line-height:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.stat-label{font-size:12px;color:var(--text-secondary);margin-top:4px}.card{background:var(--bg-card);border-radius:var(--radius);border:1px solid var(--border);box-shadow:var(--shadow-sm);overflow:hidden;margin-bottom:20px}.card-header{padding:16px 20px;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;gap:12px}.card-title{font-family:Syne,sans-serif;font-size:15px;font-weight:700;color:var(--text-primary)}.card-subtitle{font-size:12px;color:var(--text-muted);margin-top:2px}.card-body{padding:20px}.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:8px 16px;border-radius:var(--radius-sm);font-size:13px;font-weight:600;cursor:pointer;border:none;transition:var(--transition);white-space:nowrap;text-decoration:none}.btn-primary{background:var(--accent);color:#fff}.btn-primary:hover{background:var(--accent-hover);transform:translateY(-1px)}.btn-secondary{background:var(--bg);color:var(--text-primary);border:1px solid var(--border)}.btn-secondary:hover{background:var(--border)}.btn-success{background:var(--success);color:#fff}.btn-danger{background:var(--danger);color:#fff}.btn-sm{padding:5px 10px;font-size:12px}.table-container{overflow-x:auto;border-radius:var(--radius);border:1px solid var(--border)}table{width:100%;border-collapse:collapse;font-size:13px}thead th{background:var(--bg);padding:11px 14px;text-align:left;font-weight:600;color:var(--text-secondary);font-size:12px;text-transform:uppercase;border-bottom:1px solid var(--border);white-space:nowrap}tbody td{padding:12px 14px;border-bottom:1px solid var(--border);color:var(--text-primary)}tbody tr:hover{background:#4f6ef70a}.form-group{margin-bottom:16px}.form-label{display:block;font-size:12px;font-weight:600;color:var(--text-secondary);margin-bottom:6px}.form-control{width:100%;padding:9px 12px;border:1.5px solid var(--border);border-radius:var(--radius-sm);background:var(--bg-card);color:var(--text-primary);font-size:13px;outline:none}.form-control:focus{border-color:var(--accent)}.form-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000080;z-index:1000;display:flex;align-items:center;justify-content:center;padding:20px}.modal{background:var(--bg-card);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);width:100%;max-width:600px}.modal-header{padding:20px 24px;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between}.modal-title{font-family:Syne,sans-serif;font-size:17px;font-weight:700}.modal-close{background:none;border:none;cursor:pointer;font-size:18px;color:var(--text-secondary)}.modal-body{padding:20px 24px}.modal-footer{padding:16px 24px;border-top:1px solid var(--border);display:flex;justify-content:flex-end;gap:10px}.badge{display:inline-flex;align-items:center;padding:3px 8px;border-radius:20px;font-size:11px;font-weight:600}.badge-primary{background:var(--accent-light);color:var(--accent)}.badge-success{background:var(--success-light);color:var(--success)}.badge-warning{background:var(--warning-light);color:var(--warning)}.badge-danger{background:var(--danger-light);color:var(--danger)}.badge-gray{background:#64748b1f;color:var(--text-secondary)}.quick-actions{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:12px;margin-bottom:24px}.qa-btn{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:16px 12px;text-align:center;cursor:pointer;transition:all .2s;text-decoration:none;display:block}.qa-btn:hover{border-color:var(--accent);box-shadow:0 4px 16px #4f6ef726;transform:translateY(-2px)}.qa-icon{font-size:26px;margin-bottom:8px}.qa-label{font-size:12px;font-weight:600;color:var(--text-secondary)}.bottom-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}.activity-item{display:flex;align-items:flex-start;gap:12px;padding:12px 0;border-bottom:1px solid var(--border)}.activity-item:last-child{border-bottom:none}.activity-dot{width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:14px;flex-shrink:0}.activity-text{font-size:13px;line-height:1.4}.activity-time{font-size:11px;color:var(--text-muted);margin-top:2px}.demo-accounts-panel{margin-top:20px;padding:15px;background:var(--bg);border-radius:var(--radius-sm);border:1px solid var(--border);font-size:12px}.demo-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:10px;margin-top:10px}.demo-account-card{background:var(--bg-card);padding:10px;border-radius:6px;border:1px solid var(--border);cursor:pointer;transition:var(--transition)}.demo-account-card:hover{border-color:var(--accent);background:var(--accent-light)}.sidebar-overlay{display:none}@media (max-width: 900px){.sidebar{transform:translate(-100%)}.sidebar.open{transform:translate(0)}.main-content{margin-left:0}.charts-grid,.bottom-grid{grid-template-columns:1fr}.sidebar-overlay.active{display:block;position:fixed;top:0;right:0;bottom:0;left:0;background:#0006;z-index:99}}.timetable-page .tt-table{width:100%;border-collapse:collapse;font-size:12px;margin-top:10px}.timetable-page .tt-table th{background:var(--primary);color:#fff;padding:10px 8px;text-align:center;font-weight:600;white-space:nowrap}.timetable-page .tt-table td{border:1px solid var(--border);padding:0;vertical-align:top;min-width:120px}.timetable-page .tt-cell{padding:8px;min-height:60px;cursor:pointer;transition:background .15s;position:relative}.timetable-page .tt-cell:hover{background:var(--accent-light)}.timetable-page .tt-cell.break{background:var(--warning-light);cursor:default}.timetable-page .tt-cell.break:hover{background:var(--warning-light)}.timetable-page .tt-subject{font-weight:700;color:var(--text-primary);font-size:12px}.timetable-page .tt-teacher{font-size:10px;color:var(--text-muted);margin-top:2px}.timetable-page .tt-day-header{background:var(--accent-light);color:var(--accent);font-weight:700;padding:10px;text-align:center;font-size:12px}.timetable-page .period-label{background:var(--bg);font-weight:600;padding:10px 8px;text-align:center;font-size:11px;color:var(--text-secondary);white-space:nowrap}.timetable-page .color-dot{width:8px;height:8px;border-radius:50%;display:inline-block;margin-right:4px}.attendance-page .mode-banner{display:flex;align-items:center;gap:10px}.attendance-page .period-strip{display:flex;gap:8px;overflow-x:auto;padding-bottom:8px;margin-bottom:18px;margin-top:10px}.attendance-page .period-chip{flex-shrink:0;padding:9px 14px;border-radius:10px;border:1.5px solid var(--border);background:var(--bg-card);cursor:pointer;font-size:12px;font-weight:600;color:var(--text-secondary);transition:all .15s;white-space:nowrap}.attendance-page .period-chip .pc-sub{font-size:10px;color:var(--text-muted);font-weight:500;margin-top:2px}.attendance-page .period-chip.active{border-color:var(--accent);background:var(--accent-light);color:var(--accent)}.attendance-page .period-chip.done{border-color:var(--success)}.attendance-page .period-chip.done:after{content:" ✓";color:var(--success)}.attendance-page .roster-row{display:flex;align-items:center;gap:12px;padding:12px 14px;border-bottom:1px solid var(--border);background:var(--bg-card)}.attendance-page .roster-row:last-child{border-bottom:none}.attendance-page .roster-name{flex:1;min-width:0;text-align:left}.attendance-page .roster-name b{font-size:13px;color:var(--text-primary)}.attendance-page .roster-name span{display:block;font-size:11px;color:var(--text-muted);margin-top:2px}.attendance-page .mark-btns{display:flex;gap:6px}.attendance-page .mark-btn{padding:7px 12px;border-radius:8px;border:1.5px solid var(--border);background:var(--bg);font-size:11.5px;font-weight:700;cursor:pointer;transition:all .15s;color:var(--text-secondary)}.attendance-page .mark-btn.present:hover,.attendance-page .mark-btn.present.picked{background:var(--success)!important;border-color:var(--success)!important;color:#fff!important}.attendance-page .mark-btn.absent:hover,.attendance-page .mark-btn.absent.picked{background:var(--danger)!important;border-color:var(--danger)!important;color:#fff!important}.attendance-page .mark-btn.late:hover,.attendance-page .mark-btn.late.picked{background:var(--warning)!important;border-color:var(--warning)!important;color:#fff!important}.attendance-page .summary-strip{display:flex;gap:16px;margin-bottom:18px}.attendance-page .summary-pill{flex:1;background:var(--bg-card);border:1px solid var(--border);border-radius:10px;padding:12px 14px;text-align:center}.attendance-page .summary-pill b{display:block;font-family:Syne,sans-serif;font-size:20px}.attendance-page .summary-pill span{font-size:10.5px;color:var(--text-muted)}.fees-page .receipt{background:#fff;padding:30px;max-width:440px;margin:0 auto;border:1px solid #ddd;border-radius:12px}.fees-page .receipt-header{text-align:center;margin-bottom:16px;padding-bottom:16px;border-bottom:2px dashed #ddd}.fees-page .receipt-school{font-weight:800;font-size:18px;font-family:Syne,sans-serif;color:var(--text-primary)}.fees-page .receipt-row{display:flex;justify-content:space-between;padding:6px 0;font-size:13px;border-bottom:1px solid #f0f0f0;color:var(--text-primary)}.fees-page .receipt-row.total{font-weight:800;font-size:15px;border-top:2px solid #333;margin-top:8px;padding-top:12px}.payroll-page .slip{background:#fff;padding:28px;max-width:500px;margin:0 auto;border:1px solid #ddd;border-radius:12px;font-size:13px}.payroll-page .slip-header{text-align:center;margin-bottom:16px;padding-bottom:12px;border-bottom:2px solid #333}.payroll-page .slip-row{display:flex;justify-content:space-between;padding:5px 0;border-bottom:1px solid #f0f0f0;color:var(--text-primary)}.payroll-page .slip-row.total{font-weight:800;font-size:15px;border-top:2px solid #333;margin-top:8px;padding-top:10px}.payroll-page .slip-section{background:#f8f9fa;padding:10px 12px;border-radius:8px;margin:10px 0}.payroll-page .slip-section-title{font-weight:700;margin-bottom:8px;font-size:12px;text-transform:uppercase;letter-spacing:.5px;color:var(--text-secondary)}.tabs{display:flex;gap:8px;background:var(--bg-card);padding:6px;border-radius:12px;border:1px solid var(--border);margin-bottom:20px;width:fit-content}.tab-btn{padding:10px 18px;font-size:13px;font-weight:700;color:var(--text-secondary);background:transparent;border:none;border-radius:9px;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;gap:6px}.tab-btn:hover{color:var(--text-primary);background:var(--bg)}.tab-btn.active{color:#fff!important;background:var(--primary)!important;box-shadow:0 4px 12px #4f6ef740}.login-wrap{display:flex;background:#ffffff08;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.08);border-radius:24px;overflow:hidden;width:1000px;max-width:95%;box-shadow:0 20px 50px #0000004d}.login-card{flex:1;padding:48px;background:#1a1f3699;border-right:1px solid rgba(255,255,255,.08);display:flex;flex-direction:column;justify-content:center}.login-logo{width:48px;height:48px;background:linear-gradient(135deg,#4f6ef7,#7c3aed);border-radius:12px;display:flex;align-items:center;justify-content:center;font-family:Syne,sans-serif;font-size:20px;font-weight:800;color:#fff;margin-bottom:24px}.login-title{font-family:Syne,sans-serif;font-size:28px;font-weight:800;color:#fff;margin-bottom:8px;line-height:1.2}.login-subtitle{font-size:13.5px;color:#94a3b8;margin-bottom:32px}.login-error{background:#ef444426;border:1px solid rgba(239,68,68,.3);color:#f87171;padding:12px 16px;border-radius:10px;font-size:13px;margin-bottom:24px;display:none}.login-error.show{display:block}.login-label{display:block;font-size:12.5px;font-weight:600;color:#94a3b8;margin-bottom:8px}.login-input{width:100%;padding:12px 16px;background:#ffffff0a;border:1.5px solid rgba(255,255,255,.1);border-radius:10px;color:#fff;font-size:14px;outline:none;transition:all .2s ease}.login-input:focus{border-color:#4f6ef7;background:#ffffff12;box-shadow:0 0 0 3px #4f6ef733}.login-input.err{border-color:#f87171;box-shadow:0 0 0 3px #ef444433}.login-input:-webkit-autofill,.login-input:-webkit-autofill:hover,.login-input:-webkit-autofill:focus,.login-input:-webkit-autofill:active{-webkit-box-shadow:0 0 0 1000px #1a1f36 inset!important;-webkit-text-fill-color:#fff!important;caret-color:#fff;transition:background-color 5000s ease-in-out 0s}.password-wrap{position:relative}.toggle-pw{position:absolute;right:14px;top:50%;transform:translateY(-50%);background:none;border:none;cursor:pointer;font-size:16px;color:#94a3b8;padding:4px}.forgot-link{display:inline-block;font-size:12.5px;color:#4f6ef7;text-decoration:none;font-weight:600;margin-top:12px;margin-bottom:24px;transition:color .15s ease}.forgot-link:hover{color:#7c3aed}.login-btn{width:100%;padding:14px;background:linear-gradient(135deg,#4f6ef7,#7c3aed);color:#fff;border:none;border-radius:10px;font-size:14px;font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px;transition:all .25s ease}.login-btn:hover{transform:translateY(-1px);box-shadow:0 8px 24px #4f6ef759}.login-btn:disabled{opacity:.7;cursor:not-allowed}.demo-panel{width:420px;background:#0f172a66;padding:40px;display:flex;flex-direction:column}.demo-head{margin-bottom:24px}.demo-eyebrow{font-size:11px;font-weight:700;color:#4f6ef7;text-transform:uppercase;letter-spacing:1px;margin-bottom:6px}.demo-heading{font-family:Syne,sans-serif;font-size:18px;font-weight:700;color:#fff;margin-bottom:6px}.demo-sub{font-size:12px;color:#94a3b8;line-height:1.4}.role-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;overflow-y:auto;max-height:380px;padding-right:6px}.role-grid::-webkit-scrollbar{width:4px}.role-grid::-webkit-scrollbar-thumb{background:#ffffff1a;border-radius:4px}.role-btn{background:#ffffff05;border:1px solid rgba(255,255,255,.05);border-radius:10px;padding:10px;cursor:pointer;display:flex;align-items:center;gap:8px;text-align:left;transition:all .2s ease}.role-btn:hover{background:#ffffff0f;border-color:#ffffff26}.role-btn.picked{background:#4f6ef726;border-color:#4f6ef7}.role-emoji{font-size:18px}.role-txt{min-width:0}.role-name{font-size:12px;font-weight:700;color:#fff}.role-email{font-size:9.5px;color:#94a3b8;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}@media (max-width: 900px){.login-wrap{flex-direction:column;max-width:450px}.login-card{border-right:none;border-bottom:1px solid rgba(255,255,255,.08);padding:32px}.demo-panel{width:100%;padding:32px}.role-grid{max-height:250px}}.pc-shell{background:var(--bg);min-height:100vh;padding:24px}.pc-top{display:flex;justify-content:space-between;align-items:center;padding-bottom:20px;border-bottom:1px solid var(--border);margin-bottom:24px}.pc-brand{display:flex;align-items:center;gap:10px;font-family:Syne,sans-serif;font-weight:800;font-size:18px;color:var(--text-primary)}.pc-brand-logo{font-size:24px}.pc-badge{background:linear-gradient(135deg,#7c3aed,#4f6ef7);color:#fff;font-size:10px;font-weight:700;padding:3px 8px;border-radius:12px;text-transform:uppercase}.pc-signout{background:transparent;border:1px solid var(--border);padding:8px 16px;border-radius:8px;color:var(--text-secondary);font-size:12.5px;font-weight:600;cursor:pointer;transition:all .2s ease}.pc-signout:hover{background:var(--danger-light);color:var(--danger);border-color:var(--danger)}.pc-hero{background:linear-gradient(135deg,#1e1b4b,#0f172a);border:1px solid rgba(255,255,255,.05);border-radius:16px;padding:32px;color:#fff;margin-bottom:24px;box-shadow:0 10px 30px #00000026}.pc-hero-title{font-family:Syne,sans-serif;font-size:22px;font-weight:800;margin-bottom:8px}.pc-hero-sub{font-size:13.5px;color:#94a3b8;line-height:1.5;max-width:750px}.pc-tabs{display:flex;gap:8px;margin-bottom:20px;border-bottom:1.5px solid var(--border);padding-bottom:10px;overflow-x:auto;white-space:nowrap;-webkit-overflow-scrolling:touch}.pc-tabs::-webkit-scrollbar{display:none}.pc-tab{background:transparent;border:none;color:var(--text-secondary);font-size:13.5px;font-weight:700;padding:8px 16px;cursor:pointer;position:relative;transition:all .2s ease}.pc-tab:hover{color:var(--text-primary)}.pc-tab.active{color:var(--accent)}.pc-tab.active:after{content:"";position:absolute;bottom:-11.5px;left:0;right:0;height:3px;background:var(--accent);border-radius:3px}.plan-badge{display:inline-block;padding:3px 8px;border-radius:6px;font-size:10.5px;font-weight:700;text-transform:uppercase}.plan-badge.BASIC{background:#3b82f61f;color:#3b82f6}.plan-badge.PRO{background:#6366f11f;color:#6366f1}.plan-badge.ENTERPRISE{background:#f59e0b1f;color:#f59e0b;border:1px solid rgba(245,158,11,.3)}.status-badge{display:inline-block;padding:3px 8px;border-radius:6px;font-size:10.5px;font-weight:700}.status-badge.ACTIVE{background:var(--success-light);color:var(--success)}.status-badge.SUSPENDED{background:var(--danger-light);color:var(--danger)}.status-badge.TRIAL{background:var(--warning-light);color:var(--warning)}.al-item{display:flex;align-items:flex-start;gap:16px;padding:16px;border-radius:12px;background:var(--bg-card);border:1px solid var(--border);margin-bottom:12px;transition:all .2s ease}.al-item:hover{border-color:var(--accent);box-shadow:var(--shadow-sm);transform:translate(4px)}.timetable-page .tt-cell.my-period{background:#10b98112;border:1px dashed var(--success);border-radius:8px;box-shadow:inset 0 0 10px #10b9810d;padding:10px}.timetable-page .tt-cell.my-period:hover{background:#10b9811f;border-color:var(--success)}.timetable-page .tt-cell.my-period .tt-subject{font-size:13.5px;font-weight:800;color:var(--success)}.timetable-page .tt-cell.my-period .tt-teacher{font-size:11px;color:var(--text-primary);font-weight:700;margin-top:4px}.exams-page .card{border-radius:16px;overflow:hidden;border:1px solid var(--border);box-shadow:0 4px 20px #0000000a}.exams-page .form-row select.form-control,.exams-page .form-row input.form-control{border-radius:8px;border:1.5px solid var(--border);padding:8px 12px;font-size:13px;color:var(--text-primary);background:var(--bg-card);transition:all .2s ease}.exams-page .form-row select.form-control:focus,.exams-page .form-row input.form-control:focus{border-color:var(--accent);box-shadow:0 0 0 3px #4f6ef71f;outline:none}.exams-page table td{padding:14px 16px;vertical-align:middle}.exams-page table th{font-family:Syne,sans-serif;font-weight:700;text-transform:uppercase;font-size:11px;letter-spacing:.5px;background:#4f6ef70d;color:var(--accent);padding:12px 16px}.exams-page table input.form-control{border-radius:6px;border:1px solid var(--border);padding:6px 10px;font-size:12.5px;transition:all .15s ease}.exams-page table input.form-control:focus{border-color:var(--accent);background:var(--bg)}.attendance-page .mark-btn{border-radius:6px;font-size:11px;padding:6px 10px;font-weight:600;transition:all .2s cubic-bezier(.4,0,.2,1)}.attendance-page .mark-btn:active{transform:scale(.96)}.attendance-page .period-chip{border-radius:8px;padding:8px 12px;border-width:1px;transition:all .2s ease}.attendance-page .period-chip:hover{transform:translateY(-1px);border-color:var(--accent)}.attendance-page .roster-row{padding:14px 16px;transition:background .15s ease}.attendance-page .roster-row:hover{background:#4f6ef705}.page-header{display:flex;justify-content:space-between;align-items:center;background:var(--bg-card);padding:18px 24px!important;border-radius:16px!important;border:1px solid var(--border)!important;box-shadow:0 4px 18px #00000004!important;margin-bottom:24px!important}.page-header-text{display:flex;flex-direction:column;gap:6px}.breadcrumb{font-size:10px!important;font-weight:800!important;text-transform:uppercase!important;letter-spacing:1px!important;color:var(--accent)!important;display:flex;align-items:center;gap:6px;margin-bottom:4px}.breadcrumb-sep{color:var(--text-muted)!important;font-weight:500!important;font-size:11px}.page-header h2{font-family:Syne,sans-serif!important;font-size:20px!important;font-weight:800!important;color:var(--text-primary)!important;margin:0!important;letter-spacing:-.3px!important}.page-header p{font-size:12px!important;color:var(--text-secondary)!important;margin:0!important;font-weight:500!important}.page-header-actions{display:flex;gap:10px;align-items:center}.notice{display:flex;align-items:center;gap:16px;background:#4f6ef714;border:1px solid rgba(79,110,247,.2);border-radius:12px;padding:16px 20px;color:var(--text-primary);font-size:13.5px;font-weight:500;line-height:1.5;box-shadow:0 4px 12px #00000003}.notice.success{background:#10b98114!important;border:1px solid rgba(16,185,129,.2)!important;color:var(--success)!important}.notice-icon{font-size:20px;display:flex;align-items:center;justify-content:center;flex-shrink:0}.notice strong{font-weight:700;font-family:Syne,sans-serif;color:inherit}.search-bar{position:relative;display:flex;align-items:center;width:100%}.search-bar .search-icon{position:absolute;left:14px;font-size:13.5px;color:var(--text-muted);pointer-events:none;display:flex;align-items:center;justify-content:center}.search-bar .form-control{width:100%;padding:10px 16px 10px 38px!important;border-radius:10px!important;border:1.5px solid var(--border)!important;background:var(--bg)!important;font-size:13px!important;color:var(--text-primary)!important;transition:all .2s cubic-bezier(.4,0,.2,1)!important}.search-bar .form-control:focus{border-color:var(--accent)!important;background:var(--bg-card)!important;box-shadow:0 0 0 3px #4f6ef71f!important;outline:none}.search-bar .form-control::placeholder{color:var(--text-muted);opacity:.7}.sp-shell,.pp-shell,.bp-shell{max-width:600px;margin:0 auto;padding:16px;display:flex;flex-direction:column;gap:16px}.sp-top,.pp-top,.bp-top{display:flex;justify-content:space-between;align-items:center;padding:12px 0;border-bottom:1px solid var(--border)}.sp-brand,.pp-brand,.bp-brand{font-family:Syne,sans-serif;font-weight:800;font-size:18px;color:var(--text-primary);display:flex;align-items:center;gap:8px}.sp-brand-logo,.pp-brand-logo,.bp-brand-logo{font-size:20px}.sp-signout,.pp-signout,.bp-signout{background:transparent;border:none;font-size:12px;font-weight:600;color:var(--danger);cursor:pointer;padding:4px 8px;border-radius:6px;transition:all .2s ease}.sp-signout:hover,.pp-signout:hover,.bp-signout:hover{background:var(--danger-light)}.sp-hero,.pp-hero,.bp-hero{background:linear-gradient(135deg,var(--primary-light),var(--primary));padding:24px;border-radius:16px;color:#fff;display:flex;align-items:center;gap:16px;box-shadow:var(--shadow)}.sp-hero-avatar,.pp-hero-avatar,.bp-hero-avatar{width:54px;height:54px;border-radius:50%;background:var(--accent);color:#fff;font-family:Syne,sans-serif;font-weight:800;font-size:18px;display:flex;align-items:center;justify-content:center;border:2px solid rgba(255,255,255,.2);box-shadow:0 4px 12px #4f6ef74d}.sp-tabs,.pp-tabs,.bp-tabs{display:flex;gap:6px;overflow-x:auto;padding-bottom:8px;scrollbar-width:none}.sp-tabs::-webkit-scrollbar,.pp-tabs::-webkit-scrollbar,.bp-tabs::-webkit-scrollbar{display:none}.sp-tab,.pp-tab,.bp-tab{flex-shrink:0;padding:10px 16px;border-radius:10px;border:1px solid var(--border);background:var(--bg-card);color:var(--text-secondary);font-size:12.5px;font-weight:700;cursor:pointer;transition:all .2s ease}.sp-tab:hover,.pp-tab:hover,.bp-tab:hover{border-color:var(--accent);color:var(--text-primary)}.sp-tab.active,.pp-tab.active,.bp-tab.active{background:var(--accent)!important;color:#fff!important;border-color:var(--accent)!important;box-shadow:var(--shadow-accent)}.ov-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:16px}.ov-card{background:var(--bg-card);border:1px solid var(--border);border-radius:14px;padding:16px 12px;text-align:center;box-shadow:var(--shadow-sm);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px}.ov-val{font-family:Syne,sans-serif;font-size:20px;font-weight:800;color:var(--text-primary)}.ov-lbl{font-size:10.5px;color:var(--text-secondary);font-weight:600}.hw-row,.subj-row,.fee-row{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;border-bottom:1px solid var(--border)}.hw-row:last-child,.subj-row:last-child,.fee-row:last-child{border-bottom:none}.hw-row:hover,.subj-row:hover,.fee-row:hover{background:#4f6ef705}.fee-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:20px}.fee-sum-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:20px 14px;text-align:center;box-shadow:var(--shadow-sm);transition:var(--transition);position:relative;overflow:hidden}.fee-sum-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-md)}.fee-sum-card:before{content:"";position:absolute;top:0;left:0;right:0;height:4px}.fee-sum-card.total:before{background:var(--accent)}.fee-sum-card.paid:before{background:var(--success)}.fee-sum-card.due:before{background:var(--danger)}.fee-sum-val{font-family:Syne,sans-serif;font-size:22px;font-weight:800;line-height:1.2}.fee-sum-card.total .fee-sum-val{color:var(--accent)}.fee-sum-card.paid .fee-sum-val{color:var(--success)}.fee-sum-card.due .fee-sum-val{color:var(--danger)}.fee-sum-lbl{font-size:11px;color:var(--text-secondary);font-weight:600;margin-top:6px;text-transform:uppercase;letter-spacing:.5px}.subj-bar-track{flex:1;height:8px;background:var(--bg);border-radius:4px;margin:0 16px;overflow:hidden}.subj-bar-fill{height:100%;border-radius:4px;transition:width .3s ease}.bus-live{background:#4f6ef70f;border:1px solid rgba(79,110,247,.15);border-radius:14px;padding:16px;display:flex;align-items:center;gap:12px;margin-bottom:8px}.bus-live-icon{font-size:26px}.bus-live-title{font-size:13.5px;font-weight:700;display:flex;align-items:center;gap:8px;color:var(--text-primary)}.bus-live-sub{font-size:11.5px;color:var(--text-secondary);margin-top:2px}.live-dot{width:8px;height:8px;background:var(--success);border-radius:50%;display:inline-block;animation:pulse 1.5s infinite}@keyframes pulse{0%{transform:scale(.95);box-shadow:0 0 #10b981b3}70%{transform:scale(1);box-shadow:0 0 0 5px #10b98100}to{transform:scale(.95);box-shadow:0 0 #10b98100}}.child-tabs{display:flex;gap:8px;overflow-x:auto;padding-bottom:6px}.child-tab{display:flex;align-items:center;gap:10px;padding:8px 12px;background:var(--bg-card);border:1px solid var(--border);border-radius:12px;cursor:pointer;transition:all .2s ease;min-width:150px}.child-tab.active{border-color:var(--accent);background:var(--accent-light)}.child-avatar{width:32px;height:32px;border-radius:50%;background:var(--accent);color:#fff;display:flex;align-items:center;justify-content:center;font-size:14px}.child-name{font-size:12.5px;font-weight:700;color:var(--text-primary)}.child-class{font-size:10px;color:var(--text-secondary)}.sp-layout,.pp-layout{display:flex;min-height:100vh;background:var(--bg)}.sp-sidebar,.pp-sidebar{width:var(--sidebar-width);background:var(--bg-sidebar);position:fixed;left:0;top:0;bottom:0;z-index:100;display:flex;flex-direction:column;transition:var(--transition-slow);border-right:1px solid rgba(255,255,255,.05)}.sp-sidebar-brand,.pp-sidebar-brand{padding:20px;border-bottom:1px solid rgba(255,255,255,.07);display:flex;align-items:center;gap:12px;color:#fff;font-family:Syne,sans-serif;font-weight:800;font-size:16px}.sp-sidebar-menu,.pp-sidebar-menu{flex:1;padding:16px 12px;display:flex;flex-direction:column;gap:4px}.sp-menu-item,.pp-menu-item{display:flex;align-items:center;gap:10px;padding:10px 14px;border-radius:var(--radius-sm);color:#fff9;text-decoration:none;font-size:13.5px;font-weight:600;cursor:pointer;transition:var(--transition)}.sp-menu-item:hover,.pp-menu-item:hover{background:#ffffff0d;color:#fff}.sp-menu-item.active,.pp-menu-item.active{background:var(--accent)!important;color:#fff!important;box-shadow:var(--shadow-accent)}.sp-sidebar-footer,.pp-sidebar-footer{padding:16px;border-top:1px solid rgba(255,255,255,.07)}.sp-user-card,.pp-user-card{display:flex;align-items:center;gap:10px;padding:8px;border-radius:var(--radius-sm)}.sp-user-avatar,.pp-user-avatar{width:36px;height:36px;border-radius:50%;background:linear-gradient(135deg,var(--accent),var(--accent2));display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:700;color:#fff}.sp-user-info,.pp-user-info{flex:1;min-width:0;color:#fff}.sp-user-name,.pp-user-name{font-size:12.5px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sp-user-role,.pp-user-role{font-size:10.5px;color:#fff6;cursor:pointer;transition:color .2s}.sp-user-role:hover,.pp-user-role:hover{color:var(--danger)}.sp-main-content,.pp-main-content{margin-left:var(--sidebar-width);flex:1;display:flex;flex-direction:column;padding:24px;min-height:100vh}.sp-mobile-header,.pp-mobile-header{display:none;height:var(--header-height);background:var(--bg-card);border-bottom:1px solid var(--border);align-items:center;padding:0 16px;gap:12px;position:sticky;top:0;z-index:50;box-shadow:var(--shadow-sm)}.sp-menu-toggle,.pp-menu-toggle{background:none;border:none;font-size:20px;cursor:pointer;color:var(--text-primary);display:flex;align-items:center;justify-content:center}.sp-mobile-title,.pp-mobile-title{font-family:Syne,sans-serif;font-size:16px;font-weight:800;color:var(--text-primary);flex:1}.sp-sidebar-overlay,.pp-sidebar-overlay{display:none}@media (max-width: 768px){.sp-sidebar,.pp-sidebar{transform:translate(-100%)}.sp-sidebar.open,.pp-sidebar.open{transform:translate(0)}.sp-main-content,.pp-main-content{margin-left:0;padding:16px}.sp-mobile-header,.pp-mobile-header{display:flex}.sp-sidebar-overlay.active,.pp-sidebar-overlay.active{display:block;position:fixed;top:0;right:0;bottom:0;left:0;background:#00000080;z-index:99}.sp-tabs{display:flex!important}}@media (min-width: 769px){.sp-tabs{display:none!important}}.ba-wrap{max-width:520px;margin:0 auto;padding-bottom:100px;display:flex;flex-direction:column;gap:16px}@media (min-width: 769px){.ba-wrap{max-width:1200px;display:grid;grid-template-columns:360px 1fr;gap:28px;padding:24px}.ba-left-column{position:sticky;top:24px;z-index:20}.ba-top{border-radius:16px!important;box-shadow:0 10px 30px #0000004d!important}.progress-wrap{background:var(--bg-card)!important;border:1px solid var(--border)!important;border-radius:16px!important;margin-top:16px!important;box-shadow:var(--shadow-sm)!important;padding:16px 20px!important}.stop-group{margin:0 0 24px!important}}.ba-top{background:linear-gradient(135deg,#0d1117,#1a1f36);padding:20px 18px 22px;color:#fff;position:sticky;top:0;z-index:20;box-shadow:0 4px 20px #00000040;border-bottom-left-radius:16px;border-bottom-right-radius:16px}.ba-top-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}.ba-brand{display:flex;align-items:center;gap:9px;font-family:Syne,sans-serif;font-weight:800;font-size:15px}.ba-logo{width:30px;height:30px;border-radius:9px;background:var(--accent);display:flex;align-items:center;justify-content:center;font-size:14px}.ba-logout{background:#ffffff14;border:1px solid rgba(255,255,255,.14);color:#fff;font-size:11px;padding:6px 11px;border-radius:8px;cursor:pointer;transition:all .2s}.ba-logout:hover{background:#ffffff26}.gps-badge{display:inline-flex;align-items:center;gap:6px;font-size:10.5px;color:#86efac;background:#22c55e1f;border:1px solid rgba(34,197,94,.3);padding:4px 10px;border-radius:99px;margin-bottom:12px}.gps-dot{width:6px;height:6px;border-radius:50%;background:#22c55e;animation:pulse 1.6s infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.3}}.trip-toggle{display:flex;background:#ffffff0f;border-radius:11px;padding:4px;gap:4px}.trip-btn{flex:1;text-align:center;padding:9px 8px;border-radius:8px;font-size:12px;font-weight:700;cursor:pointer;color:#ffffff80;transition:all .15s;border:none;background:none;font-family:inherit}.trip-btn.active{background:var(--accent);color:#fff}.route-card{background:#ffffff0d;border:1px solid rgba(255,255,255,.1);border-radius:12px;padding:14px;margin-top:14px;display:flex;align-items:center;gap:12px}.route-icon{width:38px;height:38px;border-radius:10px;background:var(--accent);display:flex;align-items:center;justify-content:center;font-size:18px;flex-shrink:0}.route-name{font-weight:700;font-size:13.5px;color:#fff}.route-meta{font-size:11px;color:#ffffff73;margin-top:2px;font-family:DM Sans,sans-serif}.progress-wrap{padding:16px 18px 4px}.progress-head{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:8px}.progress-count{font-family:Syne,sans-serif;font-size:20px;font-weight:800;color:var(--text-primary)}.progress-lbl{font-size:11.5px;color:var(--text-muted)}.pbar-track{height:8px;background:var(--border);border-radius:99px;overflow:hidden}.pbar-fill{height:100%;background:linear-gradient(90deg,#4f6ef7,#22d3ee);border-radius:99px;transition:width .3s}.stop-group{margin:18px 18px 0}.stop-head{display:flex;align-items:center;gap:8px;margin-bottom:10px}.stop-pin{width:26px;height:26px;border-radius:50%;background:var(--accent-light);color:var(--accent);display:flex;align-items:center;justify-content:center;font-size:12px;flex-shrink:0}.stop-name{font-weight:700;font-size:13px;color:var(--text-primary)}.stop-time{font-size:11px;color:var(--text-muted);font-family:DM Sans,sans-serif}.student-row{background:var(--bg-card);border:1px solid var(--border);border-radius:12px;padding:12px 14px;margin-bottom:8px;display:flex;align-items:center;gap:12px;transition:all .2s}.student-row.done{opacity:.65}.stu-avatar{width:38px;height:38px;border-radius:10px;background:var(--accent-light);color:var(--accent);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:13px;flex-shrink:0}.stu-info{flex:1;min-width:0}.stu-name{font-weight:700;font-size:13px;color:var(--text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.stu-class{font-size:11px;color:var(--text-muted)}.stu-actions{display:flex;gap:6px;flex-shrink:0}.stu-btn{width:38px;height:38px;border-radius:10px;border:1.5px solid var(--border);background:var(--bg);font-size:16px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .15s}.stu-btn:active{transform:scale(.92)}.stu-btn.board:hover,.stu-btn.board.picked{background:var(--success);border-color:var(--success);color:#fff}.stu-btn.miss:hover,.stu-btn.miss.picked{background:var(--danger);border-color:var(--danger);color:#fff}.status-pill{font-size:10px;font-weight:700;padding:3px 9px;border-radius:99px}.status-pill.boarded{background:var(--success-light);color:var(--success)}.status-pill.missed{background:var(--danger-light);color:var(--danger)}.ba-footer{position:fixed;bottom:0;left:0;right:0;background:var(--bg-card);border-top:1px solid var(--border);padding:14px 18px;box-shadow:0 -6px 24px #00000026;z-index:10}.ba-footer-inner{max-width:520px;margin:0 auto}.finish-btn{width:100%;padding:14px;background:var(--accent);color:#fff;border:none;border-radius:12px;font-weight:700;font-size:14px;cursor:pointer;font-family:DM Sans,sans-serif;box-shadow:0 8px 20px #4f6ef759;transition:all .2s}.finish-btn:disabled{opacity:.5;cursor:not-allowed;box-shadow:none}.override-note{background:var(--warning-light);color:#92400e;font-size:11.5px;padding:9px 14px;text-align:center;font-weight:600;border-radius:8px;margin:10px 18px 0}.done-screen{max-width:420px;margin:60px auto;text-align:center;padding:0 20px}.done-ring{width:72px;height:72px;border-radius:50%;background:var(--success-light);display:flex;align-items:center;justify-content:center;font-size:32px;margin:0 auto 18px}@media (max-width: 768px){.charts-grid,.bottom-grid,.stats-grid,.ov-grid,.fee-summary{grid-template-columns:1fr!important;gap:12px!important}.homework-page>div{grid-template-columns:1fr!important}}@media (max-width: 600px){.header{padding:0 10px;gap:6px}.header-title h1{font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:140px}.header-title p,.header-user-info{display:none}.header-user{padding:4px}.header-actions{gap:4px}.header-btn{width:32px;height:32px;font-size:14px}.card-body,.card{padding:12px!important}.form-grid,.modal-body .form-row,.modal-body .grid-2{grid-template-columns:1fr!important;gap:10px!important}}.id-card{width:270px;height:410px;background:linear-gradient(135deg,#fff,#f3f6ff);border:1.5px solid #e1e7ff;border-radius:20px;box-shadow:0 12px 30px #4f6ef72e;position:relative;overflow:hidden;font-family:Outfit,Inter,sans-serif;display:flex;flex-direction:column;align-items:center;padding:0;transition:all .3s cubic-bezier(.4,0,.2,1);box-sizing:border-box}.id-card:before{content:"";position:absolute;top:0;left:0;right:0;height:95px;background:linear-gradient(135deg,#1a237e,#3f51b5);z-index:1}.id-card:after{content:"DPS";position:absolute;bottom:60px;right:-20px;font-size:110px;font-weight:950;color:#4f6ef708;font-family:Syne,sans-serif;pointer-events:none;z-index:0;transform:rotate(-15deg)}.id-card.teacher-card{background:linear-gradient(135deg,#fff,#fffbf2);border-color:#ffd8a8;box-shadow:0 12px 30px #f59e0b26}.id-card.teacher-card:before{background:linear-gradient(135deg,#450a0a,#7f1d1d)}.id-card.teacher-card:after{content:"STAFF";color:#f59e0b08}.id-card-school{position:relative;z-index:2;color:#fff;font-family:Syne,sans-serif;font-weight:800;font-size:12.5px;letter-spacing:1.5px;text-align:center;margin-top:18px;text-shadow:0 2px 4px rgba(0,0,0,.25);text-transform:uppercase;width:100%}.id-card-profile-section{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;margin-top:25px;width:100%}.id-card .avatar{width:90px!important;height:90px!important;border-radius:50%!important;border:4px solid #ffffff!important;box-shadow:0 6px 16px #00000026!important;z-index:2;margin-bottom:8px;transition:transform .2s ease;background-size:cover;background-position:center}.id-card:hover .avatar{transform:scale(1.05)}.id-card-name{font-size:16px;font-weight:800;color:#1a237e;text-align:center;margin:4px 0 2px;font-family:Outfit,sans-serif;z-index:2}.id-card.teacher-card .id-card-name{color:#450a0a}.id-card-designation{font-size:9.5px;font-weight:800;color:#f59e0b;text-transform:uppercase;letter-spacing:1.2px;z-index:2;background:#fef3c7;padding:3px 10px;border-radius:20px;margin-bottom:12px;display:inline-block}.id-card.teacher-card .id-card-designation{color:#b45309;background:#fef3c7}.id-card-details{width:84%;background:#ffffffd9;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);border:1px solid rgba(225,231,255,.7);border-radius:12px;padding:10px 12px;display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:4px;z-index:2;box-shadow:0 4px 12px #4f6ef708;box-sizing:border-box}.id-card.teacher-card .id-card-details{border-color:#ffd8a880;box-shadow:0 4px 12px #f59e0b05}.id-card-details>div{display:flex;flex-direction:column}.id-card-field{font-size:8px;font-weight:700;color:#7a829a;text-transform:uppercase;letter-spacing:.5px;margin-bottom:2px}.id-card-val{font-size:11px;font-weight:750;color:#1f2937;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.id-card-bar{width:100%;height:42px;margin-top:auto;border-bottom-left-radius:18px;border-bottom-right-radius:18px;background:repeating-linear-gradient(90deg,#111,#111 2px,#fff 2px,#fff 5px,#111 5px,#111 7px,#fff 7px,#fff 9px);z-index:2;position:relative;border-top:1px solid #e5e7eb}.id-card-bar:before{content:"* DPS-SYSTEM-SECURE *";position:absolute;bottom:2px;left:50%;transform:translate(-50%);background:#fff;padding:0 6px;font-size:7.5px;font-weight:600;letter-spacing:.5px;color:#374151;font-family:monospace}@keyframes shimmerAnim{0%{background-position:-600px 0}to{background-position:600px 0}}.shimmer{background:#e2e8f0;background-image:linear-gradient(90deg,#e2e8f0,#f1f5f9,#e2e8f0 120px);background-size:600px 100%;background-repeat:no-repeat;animation:shimmerAnim 1.6s infinite linear;border-radius:var(--radius-sm);display:inline-block;vertical-align:middle}.btn:disabled,button:disabled,.btn-disabled{opacity:.65!important;cursor:not-allowed!important;pointer-events:none!important;box-shadow:none!important;transform:none!important}.btn-spinner{display:inline-block;width:13px;height:13px;border:2px solid currentColor;border-right-color:transparent!important;border-radius:50%;animation:btn-spin .6s linear infinite;margin-right:6px;vertical-align:middle}@keyframes btn-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}[data-theme=dark] .shimmer{background:#202636;background-image:linear-gradient(90deg,#202636,#2d354a,#202636 120px)}.shimmer-block{width:100%;height:20px}.shimmer-card{width:100%;height:120px;border-radius:var(--radius)}.shimmer-circle{width:40px;height:40px;border-radius:50%}.shimmer-title{width:200px;height:28px;margin-bottom:12px}.shimmer-sub{width:350px;height:16px;margin-bottom:24px}.shimmer-row{width:100%;height:45px;margin-bottom:8px}.shimmer-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:16px;margin-bottom:24px}.shimmer-table{width:100%;border-radius:var(--radius);overflow:hidden}@media (max-width: 900px){div[style*="display: grid"],div[style*="display:grid"],div[style*=grid-template-columns],div[style*=gridTemplateColumns],.form-grid,.form-row,.grid-2,.grid-3{grid-template-columns:1fr!important;gap:12px!important}div[style*="justify-content: space-between"],div[style*="justify-content:space-between"],div[style*=space-between],.card-header,.toolbar{flex-direction:column!important;align-items:stretch!important;gap:12px!important}.card-header>div,.card-header>form,.toolbar>div,.toolbar>form{flex-direction:column!important;align-items:stretch!important;width:100%!important;gap:8px!important}.card-header button,.toolbar button,.toolbar select,.toolbar input,.btn{width:100%!important}div[style*="overflow: hidden"]:has(table),div[style*="overflow:hidden"]:has(table){overflow-x:auto!important}}@media print{header,.header,.shell-header,.app-header,.nav-header,.sp-mobile-header,.pp-mobile-header,.sidebar,.pp-sidebar,.sp-sidebar,.sidebar-overlay,.pp-sidebar-overlay,.sp-sidebar-overlay,.page-header,.breadcrumb,.page-header-actions,.no-print,.tab-btn,.tabs,.pc-tabs,.sp-tabs,.pp-tabs,.btn,button,.modal-close,.modal-header,.modal-footer,.form-row,.filters,.search-bar,select,input,textarea,.pp-menu-toggle,.sp-menu-toggle,.card-header select,.card-header button,.demo-accounts-panel{display:none!important}.filter-card,.card:has(select),.card:has(input){display:none!important}html,body,#root,.app-layout,.main-content,.page-content,.shell-main,.pp-content,.sp-content,.timetable-page,.exams-page{margin:0!important;padding:0!important;width:100%!important;max-width:100%!important;min-height:auto!important;left:0!important;top:0!important;position:static!important;background:#fff!important;color:#000!important;box-shadow:none!important;border:none!important}.card{border:1px solid #cbd5e1!important;box-shadow:none!important;margin:0 0 16px!important;background:#fff!important;border-radius:8px!important;break-inside:avoid}.card-header{border-bottom:1px solid #cbd5e1!important;background:#f8fafc!important;padding:12px 16px!important;color:#000!important;display:block!important}.card-title{color:#0f172a!important;font-size:16px!important;font-weight:800!important}.card-subtitle{color:#475569!important;font-size:11px!important}.timetable-page .tt-table{width:100%!important;border-collapse:collapse!important;margin-top:8px!important;font-size:11px!important}.timetable-page .tt-table th{background:#1a1f36!important;color:#fff!important;-webkit-print-color-adjust:exact!important;print-color-adjust:exact!important;padding:8px 6px!important;border:1px solid #1a1f36!important;text-align:center!important}.timetable-page .tt-table td{border:1px solid #94a3b8!important;padding:6px!important;color:#000!important;background:#fff!important}.timetable-page .tt-cell{padding:4px!important;min-height:48px!important}.timetable-page .tt-cell.break{background:#fef3c7!important;-webkit-print-color-adjust:exact!important;print-color-adjust:exact!important}.timetable-page .tt-subject{color:#0f172a!important;font-weight:800!important;font-size:11.5px!important}.timetable-page .tt-teacher{color:#334155!important;font-size:9.5px!important}.timetable-page .period-label{background:#f1f5f9!important;color:#0f172a!important;font-weight:700!important;-webkit-print-color-adjust:exact!important;print-color-adjust:exact!important}.modal-overlay{position:static!important;background:none!important;padding:0!important;margin:0!important;display:block!important;box-shadow:none!important;border:none!important}.modal-overlay.active{display:block!important}body:has(.modal-overlay) .timetable-page>*:not(.modal-overlay),body:has(.modal-overlay) .page-content>*:not(.modal-overlay),body:has(.modal-overlay) .main-content>*:not(.modal-overlay),body:has(.modal-overlay) .sp-main-content>*:not(.modal-overlay),body:has(.modal-overlay) .pp-main-content>*:not(.modal-overlay){display:none!important}.modal{border:none!important;box-shadow:none!important;max-width:100%!important;width:100%!important;margin:0!important;padding:0!important;background:#fff!important}.modal-body{padding:0!important}.fees-page .receipt,.payroll-page .slip{max-width:500px!important;border:2px solid #000000!important;box-shadow:none!important;margin:20px auto!important;padding:24px!important;background:#fff!important;color:#000!important}.id-card{-webkit-print-color-adjust:exact!important;print-color-adjust:exact!important;margin:20px auto!important;box-shadow:none!important}@page{size:auto;margin:10mm}}