:root{--color-primary: #4f46e5;--color-primary-dark: #3730a3;--color-primary-light: #e0e7ff;--color-accent: #06b6d4;--color-bg: #f8fafc;--color-surface: #ffffff;--color-border: #e2e8f0;--color-text: #0f172a;--color-text-muted: #64748b;--color-text-light: #94a3b8;--color-success: #10b981;--color-warning: #f59e0b;--color-danger: #ef4444;--color-info: #3b82f6;--sidebar-width: 240px;--sidebar-bg: #1e1b4b;--sidebar-text: #c7d2fe;--sidebar-active-bg: #4f46e5;--sidebar-active-text: #ffffff;--topbar-height: 60px;--layout-accent: #4f46e5;--layout-accent-light: #e0e7ff;--layout-accent-dark: #3730a3;--radius-sm: 4px;--radius-md: 8px;--radius-lg: 12px;--radius-xl: 16px;--shadow-sm: 0 1px 3px rgba(0,0,0,.08);--shadow-md: 0 4px 12px rgba(0,0,0,.1);--shadow-lg: 0 8px 24px rgba(0,0,0,.12);--font-family: "Inter", system-ui, -apple-system, sans-serif;--font-size-xs: 11px;--font-size-sm: 13px;--font-size-base: 14px;--font-size-md: 15px;--font-size-lg: 18px;--font-size-xl: 22px;--font-size-2xl: 28px}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html,body{height:100%;font-family:var(--font-family);font-size:var(--font-size-base);color:var(--color-text);background:var(--color-bg);-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button{font-family:inherit;cursor:pointer;border:none;background:none}input,select,textarea{font-family:inherit}ul,ol{list-style:none}img{max-width:100%;display:block}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--color-border);border-radius:3px}.page-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:24px}.page-header h1{font-size:var(--font-size-xl);font-weight:700;color:var(--color-text)}.page-header p{font-size:var(--font-size-sm);color:var(--color-text-muted);margin-top:2px}.card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:24px;box-shadow:var(--shadow-sm)}.btn{display:inline-flex;align-items:center;gap:6px;padding:8px 16px;border-radius:var(--radius-md);font-size:var(--font-size-sm);font-weight:500;transition:all .15s ease;white-space:nowrap}.btn-primary{background:var(--color-primary);color:#fff}.btn-primary:hover{background:var(--color-primary-dark)}.btn-secondary{background:var(--color-surface);color:var(--color-text);border:1px solid var(--color-border)}.btn-secondary:hover{background:var(--color-bg)}.btn-danger{background:var(--color-danger);color:#fff}.btn-danger:hover{opacity:.9}.btn-ghost{color:var(--color-primary)}.btn-ghost:hover{background:var(--color-primary-light)}.btn:disabled{opacity:.5;cursor:not-allowed}.form-group{display:flex;flex-direction:column;gap:6px;margin-bottom:16px}.form-group label{font-size:var(--font-size-sm);font-weight:500;color:var(--color-text)}.form-group input,.form-group select,.form-group textarea{padding:9px 12px;border:1px solid var(--color-border);border-radius:var(--radius-md);font-size:var(--font-size-base);color:var(--color-text);background:var(--color-surface);transition:border-color .15s;outline:none}.form-group input:focus,.form-group select:focus,.form-group textarea:focus{border-color:var(--color-primary);box-shadow:0 0 0 3px var(--color-primary-light)}.form-group input.ng-invalid.ng-touched,.form-group select.ng-invalid.ng-touched,.form-group textarea.ng-invalid.ng-touched{border-color:var(--color-danger)}.form-group .field-error{font-size:var(--font-size-xs);color:var(--color-danger)}.table-wrapper{overflow-x:auto;border-radius:var(--radius-lg);border:1px solid var(--color-border);background:var(--color-surface)}table.data-table{width:100%;border-collapse:collapse;font-size:var(--font-size-sm)}table.data-table thead tr{background:var(--color-bg);border-bottom:1px solid var(--color-border)}table.data-table th{padding:10px 16px;text-align:left;font-weight:600;color:var(--color-text-muted);white-space:nowrap}table.data-table td{padding:12px 16px;border-bottom:1px solid var(--color-border);color:var(--color-text)}table.data-table tbody tr:last-child td{border-bottom:none}table.data-table tbody tr:hover{background:var(--color-bg)}.badge{display:inline-flex;align-items:center;padding:2px 10px;border-radius:999px;font-size:var(--font-size-xs);font-weight:600;text-transform:uppercase;letter-spacing:.4px}.badge-success{background:#d1fae5;color:#065f46}.badge-warning{background:#fef3c7;color:#92400e}.badge-danger{background:#fee2e2;color:#991b1b}.badge-info{background:#dbeafe;color:#1e40af}.badge-neutral{background:var(--color-border);color:var(--color-text-muted)}.badge-primary{background:var(--color-primary-light);color:var(--color-primary-dark)}.text-muted{color:var(--color-text-muted)}.text-sm{font-size:var(--font-size-sm)}.text-xs{font-size:var(--font-size-xs)}.font-medium{font-weight:500}.font-bold{font-weight:700}.mt-4{margin-top:16px}.mt-6{margin-top:24px}.gap-4{gap:16px}.flex{display:flex}.items-center{align-items:center}.justify-between{justify-content:space-between}.grid{display:grid}.layout-ho{--sidebar-bg: #1e1b4b;--sidebar-active-bg: #4f46e5;--sidebar-active-text: #ffffff;--layout-accent: #4f46e5;--layout-accent-light: #e0e7ff;--layout-accent-dark: #3730a3}.layout-branch{--sidebar-bg: #0f172a;--sidebar-active-bg: #0ea5e9;--sidebar-active-text: #ffffff;--layout-accent: #0ea5e9;--layout-accent-light: #e0f2fe;--layout-accent-dark: #0369a1}.layout-teacher{--sidebar-bg: #134e4a;--sidebar-active-bg: #0d9488;--sidebar-active-text: #ffffff;--layout-accent: #0d9488;--layout-accent-light: #ccfbf1;--layout-accent-dark: #0f766e}.layout-student{--sidebar-bg: #14532d;--sidebar-active-bg: #16a34a;--sidebar-active-text: #ffffff;--layout-accent: #16a34a;--layout-accent-light: #dcfce7;--layout-accent-dark: #15803d}