:root{--color-black: #000000FF;--color-gray-700: #555555FF;--color-gray-600: #666666FF;--color-gray-500: #767676FF;--color-gray-400: #888888FF;--color-white: #FFFFFFFF;--color-ai-icon-secondary: #F37A20FF;--color-secondary-900: #7A4000FF;--color-secondary-500: #FF7B00FF;--color-secondary-glass-500: #FF7B0026;--color-bg-button-glass-bg: #FFFFFF12;--color-secondary-100: #E5D2C6FF;--color-secondary-50: #FFF3E0FF;--color-yellow-50: #FFF8E1FF;--color-green-900: #1B5E20FF;--color-green-50: #E8F5E9FF;--color-ai-icon-green: #00C288FF;--color-primary-950: #1A1A2EFF;--color-primary-900: #010050FF;--color-primary-500: #020069FF;--color-primary-400: #0D47A1FF;--color-primary-100: #E8F0FEFF;--color-primary-50: #F5F7FFFF;--color-primary-40: #F0F2FFFF;--color-primary-25: #F8F9FFFF;--color-secondary-700: #BC4A00FF;--color-blue-gray-400: #949BB5FF;--color-red-50: #FFCDD2FF;--color-red-900: #B71C1CFF;--color-ai-icon-green-dark: #00875FFF;--color-provider-gemini-dark: #206FF2FF;--font-family-arial: Arial;--font-family-segoe: Segoe;--font-sans: "Segoe UI", Arial, sans-serif;--font-size-10: 10px;--font-size-11: 11px;--font-size-12: 12px;--font-size-13: 13px;--font-size-14: 14px;--font-size-16: 16px;--font-size-21: 21px;--font-size-24: 24px;--font-size-27: 27px;--font-weight-normal: 400;--font-weight-bold: 700;--spacing-2: 2px;--spacing-3: 3px;--spacing-4: 4px;--spacing-5: 5px;--spacing-6: 6px;--spacing-7: 7px;--spacing-9: 9px;--spacing-10: 10px;--spacing-11: 11px;--spacing-12: 12px;--spacing-13: 13px;--spacing-14: 14px;--spacing-15: 15px;--spacing-25: 25px;--spacing-28: 28px;--spacing-34: 34px;--spacing-36: 36px;--horizontal-padding-4: 4px;--horizontal-padding-6: 6px;--horizontal-padding-7: 7px;--horizontal-padding-8: 8px;--horizontal-padding-10: 10px;--horizontal-padding-12: 12px;--horizontal-padding-13: 13px;--horizontal-padding-14: 14px;--horizontal-padding-15: 15px;--horizontal-padding-16: 16px;--horizontal-padding-17: 17px;--horizontal-padding-19: 19px;--horizontal-padding-20: 20px;--horizontal-padding-42: 42px;--horizontal-padding-73: 73px;--horizontal-padding-187: 187px;--vertical-padding-3: 3px;--vertical-padding-4: 4px;--vertical-padding-5: 5px;--vertical-padding-6: 6px;--vertical-padding-8: 8px;--vertical-padding-9: 9px;--vertical-padding-10: 10px;--vertical-padding-11: 11px;--vertical-padding-12: 12px;--vertical-padding-16: 16px;--vertical-padding-18: 18px;--vertical-padding-19: 19px;--vertical-padding-32: 32px;--vertical-padding-219: 219px;--radius-6: 6px;--radius-8: 8px;--radius-10: 10px;--radius-14: 14px;--radius-15: 15px;--radius-16: 16px;--radius-17: 17px;--radius-20: 20px;--radius-30: 30px;--bg-page: var(--color-primary-25);--bg-surface: var(--color-white);--bg-surface-alt: var(--color-primary-50);--bg-sunken: var(--color-primary-40);--border-color: var(--color-primary-100);--border-hover: var(--color-primary-400);--border-strong: var(--color-gray-400);--text-primary: var(--color-primary-950);--text-secondary: var(--color-gray-700);--text-muted: var(--color-gray-500);--brand-primary: var(--color-primary-500);--brand-primary-hover: var(--color-primary-400);--brand-secondary: var(--color-secondary-500);--brand-secondary-glass: var(--color-secondary-glass-500);--brand-secondary-text-safe: var(--color-secondary-900);--success-bg: var(--color-green-50);--success-fg: var(--color-green-900);--warning-bg: var(--color-yellow-50);--warning-fg: var(--color-secondary-900);--danger-bg: var(--color-red-50);--danger-fg: var(--color-red-900);--radius-lg: var(--radius-16);--radius-md: var(--radius-10);--radius-sm: var(--radius-6);--transition-smooth: all .3s cubic-bezier(.4, 0, .2, 1)}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-sans);background:var(--bg-page);color:var(--text-primary);min-height:100vh;overflow-x:hidden;line-height:1.5;font-size:var(--font-size-14);font-weight:var(--font-weight-normal)}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:var(--bg-surface-alt)}::-webkit-scrollbar-thumb{background:var(--color-primary-100);border-radius:var(--radius-sm)}::-webkit-scrollbar-thumb:hover{background:var(--border-hover)}.glass-panel{background:var(--bg-surface);border:1px solid var(--border-color);border-radius:var(--radius-lg);box-shadow:0 2px 12px #0200690f;transition:var(--transition-smooth)}.portal-container{display:grid;grid-template-columns:minmax(280px,1fr) minmax(320px,1.4fr);min-height:100vh}.login-brand-panel{background:var(--color-primary-900);display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:var(--spacing-36)}.login-brand-logo{max-width:220px;height:auto;margin-bottom:var(--spacing-25)}.login-brand-tagline{color:var(--color-white);font-size:var(--font-size-16);max-width:340px;line-height:1.5}.login-form-panel{background:var(--bg-page);display:flex;align-items:center;justify-content:center;padding:var(--horizontal-padding-20)}.login-card{width:100%;max-width:440px;padding:var(--spacing-36)}@media(max-width:780px){.portal-container{grid-template-columns:1fr}.login-brand-panel{padding:var(--spacing-25)}.login-brand-tagline{display:none}}.login-header{text-align:center;margin-bottom:var(--spacing-28)}.app-logo{display:inline-flex;align-items:center;justify-content:center;width:64px;height:64px;border-radius:var(--radius-16);background:var(--color-primary-100);color:var(--brand-primary);margin-bottom:var(--spacing-15)}.login-header h1{font-size:var(--font-size-27);font-weight:var(--font-weight-bold);letter-spacing:-.5px;color:var(--brand-primary)}.login-header p{color:var(--text-secondary);font-size:var(--font-size-13);margin-top:var(--spacing-4)}.form-group{margin-bottom:var(--spacing-15)}.form-group label{display:block;font-size:var(--font-size-12);font-weight:var(--font-weight-bold);color:var(--text-secondary);margin-bottom:var(--spacing-6)}.field-desc{display:block;font-size:var(--font-size-11);color:var(--text-muted);margin-bottom:var(--spacing-6);line-height:1.2}.form-group input,.form-group textarea,.form-group select{width:100%;padding:var(--vertical-padding-12) var(--horizontal-padding-16);background:var(--bg-surface);border:1px solid var(--border-color);border-radius:var(--radius-md);color:var(--text-primary);font-family:var(--font-sans);font-size:var(--font-size-14);outline:none;transition:var(--transition-smooth)}.form-group input:focus,.form-group textarea:focus,.form-group select:focus{border-color:var(--brand-primary);box-shadow:0 0 0 3px var(--color-primary-100);background:var(--bg-surface)}.divider{display:flex;align-items:center;text-align:center;color:var(--text-muted);font-size:var(--font-size-11);margin:var(--spacing-25) 0}.divider:before,.divider:after{content:"";flex:1;border-bottom:1px solid var(--border-color)}.divider span{padding:0 var(--horizontal-padding-10);font-weight:var(--font-weight-bold);letter-spacing:.5px}.app-header{display:flex;align-items:center;background:var(--brand-primary);border-bottom:1px solid rgba(255,255,255,.12);padding:var(--font-size-11) var(--horizontal-padding-20)}.app-header img{height:30px}.app-container{display:grid;grid-template-columns:230px 1fr;height:calc(100vh - 52px)}.app-container:has(.sidebar.mode-staff){grid-template-columns:1fr;grid-template-rows:auto 1fr}.sidebar{z-index:10;transition:var(--transition-smooth)}.sidebar.mode-student{display:flex;flex-direction:column;height:100%;background:var(--color-primary-900);border-right:1px solid rgba(255,255,255,.08);padding:var(--font-size-11) var(--font-size-14)}.sidebar.mode-student .sidebar-menu{margin-top:0}.sidebar.mode-student .menu-label{color:var(--color-white);font-size:var(--font-size-10);letter-spacing:.6px;margin-top:var(--font-size-13)}.sidebar.mode-student .new-chat-btn{margin-bottom:0}.sidebar.mode-student .chat-nav-item:hover{background:#ffffff0f;border-color:#ffffff1a}.sidebar.mode-student .chat-nav-item.active{background:#ff7b0026;border-color:var(--brand-secondary)}.sidebar.mode-student .chat-nav-details h4{color:var(--color-white)}.sidebar.mode-student .chat-nav-details span{color:#ffffff8c}.sidebar-user{display:flex;flex-direction:column;gap:var(--spacing-6);padding-bottom:var(--font-size-11);margin-bottom:var(--spacing-7);border-bottom:1px solid rgba(255,255,255,.1)}.sidebar-user .user-avatar{width:34px;height:34px;background:var(--brand-secondary);font-size:var(--font-size-13)}.sidebar-user h3{color:var(--color-white);font-size:var(--font-size-13);font-weight:var(--font-weight-bold)}.sidebar-user .user-meta{display:flex;flex-direction:column;gap:var(--spacing-2);color:var(--color-white);font-size:var(--font-size-11)}.sidebar-user .user-actions{display:flex;gap:var(--spacing-5);margin-top:var(--spacing-4)}.btn-glass{background:#ffffff12;border:1px solid rgba(255,255,255,.4);border-radius:var(--radius-6);color:var(--color-white);font-family:var(--font-sans);font-size:var(--font-size-10);padding:var(--spacing-3) var(--horizontal-padding-10);cursor:pointer;transition:var(--transition-smooth)}.btn-glass:hover:not(:disabled){background:#ffffff26}.btn-glass:disabled{opacity:.55;cursor:not-allowed}.sidebar.mode-student .new-chat-btn{width:100%;background:var(--brand-secondary-glass);border:1px solid var(--color-secondary-700);border-radius:var(--radius-8);color:var(--brand-secondary);font-family:var(--font-sans);font-size:var(--font-size-12);font-weight:var(--font-weight-bold);padding:var(--vertical-padding-8) 0;cursor:pointer;box-shadow:none;transition:var(--transition-smooth)}.sidebar.mode-student .new-chat-btn:hover{background:#ff7b0047;transform:none}.sidebar.mode-student .new-chat-btn:active{background:var(--color-secondary-700);color:var(--color-white);transform:scale(.97)}.sidebar.mode-student .new-chat-btn:disabled{background:#ffffff0f;border-color:#ffffff26;color:#ffffff59}.sidebar.mode-staff{display:grid;grid-template-columns:auto 1fr auto;grid-template-areas:"header . footer" "nav nav nav";align-items:center;row-gap:var(--vertical-padding-16);background:var(--bg-surface);border-bottom:1px solid var(--border-color);padding:var(--vertical-padding-16) var(--horizontal-padding-20)}.sidebar.mode-staff .sidebar-header{grid-area:header}.sidebar.mode-staff .school-branding{padding-bottom:0;border-bottom:none}.sidebar.mode-staff .sidebar-footer{grid-area:footer;padding-top:0;border-top:none}.sidebar.mode-staff .sidebar-menu{grid-area:nav;margin-top:0;flex:none;overflow:visible}.sidebar.mode-staff .staff-nav{flex-direction:row;gap:var(--horizontal-padding-8)}.school-branding{display:flex;align-items:center;gap:var(--horizontal-padding-12);padding-bottom:var(--vertical-padding-19);border-bottom:1px solid var(--border-color)}.school-branding img{width:44px;height:44px;object-fit:contain;border-radius:var(--radius-sm);background:var(--bg-surface-alt);padding:var(--spacing-4)}.school-branding h2{font-size:var(--font-size-14);font-weight:var(--font-weight-bold);color:var(--text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:170px}.role-badge{display:inline-block;font-size:var(--font-size-10);font-weight:var(--font-weight-bold);text-transform:uppercase;letter-spacing:.5px;color:var(--brand-primary);background:var(--color-primary-100);padding:var(--spacing-2) var(--horizontal-padding-8);border-radius:var(--radius-20);margin-top:var(--spacing-2)}.sidebar-menu{flex:1;margin-top:var(--spacing-25);overflow-y:auto}.new-chat-btn{margin-bottom:var(--spacing-25)}.menu-label{font-size:var(--font-size-11);font-weight:var(--font-weight-bold);text-transform:uppercase;letter-spacing:1px;color:var(--text-muted);margin-bottom:var(--vertical-padding-12);padding-left:var(--horizontal-padding-8)}.chats-nav{display:flex;flex-direction:column;gap:var(--spacing-6)}.chat-nav-item{display:flex;align-items:center;justify-content:space-between;padding:var(--vertical-padding-10) var(--horizontal-padding-12);border-radius:var(--radius-md);cursor:pointer;transition:var(--transition-smooth);border:1px solid transparent}.chat-nav-item:hover{background:var(--bg-surface-alt);border-color:var(--border-color)}.chat-nav-item.active{background:var(--color-primary-100);border-color:var(--color-primary-100)}.chat-nav-details{display:flex;flex-direction:column;gap:var(--spacing-2);width:80%}.chat-nav-details h4{font-size:var(--font-size-13);font-weight:var(--font-weight-bold);color:var(--text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.chat-nav-details span{font-size:var(--font-size-11);color:var(--text-secondary)}.staff-nav{display:flex;flex-direction:column;gap:var(--horizontal-padding-8)}.sidebar-toggle-btn{display:none;position:fixed;top:var(--horizontal-padding-16);left:var(--horizontal-padding-16);z-index:60;width:40px;height:40px;align-items:center;justify-content:center;background:var(--bg-surface);border:1px solid var(--border-color);border-radius:var(--radius-md);color:var(--text-primary);cursor:pointer;box-shadow:0 2px 8px #0200691f}.sidebar-backdrop{position:fixed;inset:0;background:#1a1a2e80;z-index:40}.nav-item{display:flex;align-items:center;gap:var(--horizontal-padding-12);padding:var(--vertical-padding-12) var(--horizontal-padding-14);border-radius:var(--radius-md);color:var(--text-secondary);text-decoration:none;font-weight:var(--font-weight-bold);font-size:var(--font-size-14);border:1px solid transparent;transition:var(--transition-smooth)}.nav-item:hover{color:var(--text-primary);background:var(--bg-surface-alt)}.nav-item.active{color:var(--brand-primary);background:var(--color-primary-100);border-color:var(--color-primary-100)}.count-badge{background:var(--danger-fg);color:var(--color-white);font-size:var(--font-size-11);font-weight:var(--font-weight-bold);padding:var(--spacing-2) var(--horizontal-padding-6);border-radius:var(--radius-10);margin-left:auto}.sidebar-footer{display:flex;align-items:center;justify-content:space-between;padding-top:var(--vertical-padding-16);border-top:1px solid var(--border-color)}.user-profile{display:flex;align-items:center;gap:var(--horizontal-padding-10);overflow:hidden}.user-info{overflow:hidden}.user-info h3{font-size:var(--font-size-13);font-weight:var(--font-weight-bold);color:var(--text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.user-info span{display:block;font-size:var(--font-size-11);color:var(--text-secondary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.btn-logout{background:none;border:none;color:var(--text-secondary);cursor:pointer;padding:var(--spacing-6);border-radius:var(--radius-sm);transition:var(--transition-smooth)}.btn-logout:hover{color:var(--danger-fg);background:var(--danger-bg)}.main-viewport{display:flex;flex-direction:column;overflow:hidden;height:100%}.viewport-topbar{display:flex;align-items:center;gap:var(--horizontal-padding-12);flex-shrink:0;background:var(--bg-surface);border-bottom:1px solid var(--border-color);padding:var(--vertical-padding-10) var(--horizontal-padding-20)}.viewport-topbar h2{font-size:var(--font-size-16);font-weight:var(--font-weight-bold);color:var(--brand-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.hamburger-btn{display:flex;align-items:center;justify-content:center;width:30px;height:30px;flex-shrink:0;background:var(--bg-surface);border:1px solid #e0e2ea;border-radius:var(--radius-6);color:var(--text-primary);cursor:pointer;transition:var(--transition-smooth)}.hamburger-btn:hover{background:var(--color-primary-40);border-color:#c5caee;color:var(--brand-primary)}.hamburger-btn:active{background:#e6e9ff;transform:scale(.94)}.app-container.sidebar-collapsed{grid-template-columns:0 1fr}.app-container.sidebar-collapsed .sidebar{overflow:hidden;padding:0;border-right:none}.viewport-content{flex:1;overflow-y:auto;padding:var(--spacing-34)}.viewport-panel{animation:fade-in .4s ease-out}.panel-header{margin-bottom:var(--spacing-28);border-bottom:1px solid var(--border-color);padding-bottom:var(--vertical-padding-16)}.panel-header h1{font-size:var(--font-size-24);font-weight:var(--font-weight-bold);letter-spacing:-.5px;color:var(--text-primary)}.panel-header p{color:var(--text-secondary);font-size:var(--font-size-14)}.setup-container{max-width:680px;margin:var(--spacing-36) auto}.setup-header{margin-bottom:var(--spacing-34)}.setup-header h1{font-size:var(--font-size-27);font-weight:var(--font-weight-bold);margin-bottom:var(--horizontal-padding-8);color:var(--brand-primary)}.form-group label.step-label{color:var(--color-secondary-700);font-size:var(--font-size-11);text-transform:uppercase;letter-spacing:.5px;margin-bottom:var(--spacing-10)}.subject-pills{display:flex;gap:var(--horizontal-padding-12);flex-wrap:wrap}.subject-pill,.testchat-subject-pill{padding:var(--vertical-padding-8) var(--horizontal-padding-19);border-radius:var(--radius-20);border:1px solid var(--color-blue-gray-400);background:var(--bg-surface);color:var(--text-primary);cursor:pointer;font-family:var(--font-sans);font-size:var(--font-size-14);font-weight:var(--font-weight-bold);transition:var(--transition-smooth)}.subject-pill:hover,.testchat-subject-pill:hover{border-color:var(--border-hover);color:var(--text-primary)}.subject-pill.selected,.testchat-subject-pill.selected{background:var(--brand-primary);border-color:var(--brand-primary);color:var(--color-white)}.role-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--horizontal-padding-16)}.role-card,.testchat-role-card{padding:var(--horizontal-padding-20);border-radius:var(--radius-lg);background:var(--bg-surface);border:1px solid var(--color-blue-gray-400);cursor:pointer;transition:var(--transition-smooth)}.role-card:hover,.testchat-role-card:hover{background:var(--bg-surface-alt);border-color:var(--border-hover);transform:translateY(-2px)}.role-card.selected,.testchat-role-card.selected{background:var(--color-primary-40);border-color:var(--brand-primary);box-shadow:0 4px 8px #0200691f}.role-icon{width:36px;height:36px;border-radius:var(--radius-sm);display:flex;align-items:center;justify-content:center;font-weight:var(--font-weight-bold);margin-bottom:var(--vertical-padding-12)}.role-card .role-icon,.testchat-role-card .role-icon{font-size:var(--font-size-21);justify-content:flex-start}.math-color{background:var(--color-primary-100);color:var(--color-primary-500)}.science-color{background:var(--color-green-50);color:var(--color-green-900)}.english-color{background:var(--color-secondary-50);color:var(--color-secondary-900)}.history-color{background:var(--color-yellow-50);color:var(--color-secondary-900)}.superadmin-color{background:var(--danger-bg);color:var(--danger-fg)}.skills-editor-layout{display:grid;grid-template-columns:260px 1fr;gap:var(--horizontal-padding-20);align-items:start}.skills-list{display:flex;flex-direction:column;padding:var(--horizontal-padding-8);max-height:70vh;overflow-y:auto}.skill-list-item{display:flex;flex-direction:column;gap:var(--spacing-2);padding:var(--vertical-padding-10) var(--horizontal-padding-12);border-radius:var(--radius-8);text-decoration:none;color:var(--text-primary);margin-bottom:var(--spacing-4)}.skill-list-item span{font-size:var(--font-size-11);color:var(--text-muted)}.skill-list-item:hover{background:var(--bg-surface-alt)}.skill-list-item.active{background:var(--color-primary-100)}#skill-edit-body{font-family:monospace;font-size:var(--font-size-13)}@media(max-width:900px){.skills-editor-layout{grid-template-columns:1fr}}.role-card h3,.testchat-role-card h3{font-size:var(--font-size-16);font-weight:var(--font-weight-bold);margin-bottom:var(--spacing-4);color:var(--brand-primary)}.role-card p,.testchat-role-card p{font-size:var(--font-size-12);color:var(--color-gray-600);line-height:1.3}.chat-container{display:flex;flex-direction:column;height:100%}.chat-header{display:flex;align-items:center;justify-content:space-between;padding-bottom:var(--vertical-padding-16);border-bottom:1px solid var(--border-color);margin-bottom:var(--vertical-padding-16)}.chat-info-meta h2{font-size:var(--font-size-21);font-weight:var(--font-weight-bold);color:var(--text-primary)}.meta-pills{display:flex;gap:var(--horizontal-padding-8);margin-top:var(--spacing-4)}.chat-messages{flex:1;overflow-y:auto;padding:var(--horizontal-padding-12);display:flex;flex-direction:column;gap:var(--horizontal-padding-16)}.typing-dots{display:flex;gap:var(--spacing-4);padding:var(--spacing-4) var(--spacing-6)}.typing-dots span{width:6px;height:6px;background:var(--text-muted);border-radius:50%;animation:jump-dots 1.4s infinite ease-in-out both}.typing-dots span:nth-child(2){animation-delay:.2s}.typing-dots span:nth-child(3){animation-delay:.4s}.chat-input-area{display:flex;gap:var(--horizontal-padding-12);margin-top:var(--vertical-padding-16);padding-top:var(--vertical-padding-16);border-top:1px solid var(--border-color)}.chat-input-area textarea{flex:1;background:var(--bg-surface);border:1px solid var(--border-color);border-radius:var(--radius-md);color:var(--text-primary);padding:var(--horizontal-padding-12);font-family:var(--font-sans);resize:none;outline:none;font-size:var(--font-size-14);transition:var(--transition-smooth)}.chat-input-area textarea:focus{border-color:var(--brand-primary)}.metrics-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--horizontal-padding-20);margin-bottom:var(--spacing-25)}.metric-card{padding:var(--horizontal-padding-20)}.metric-card h3{font-size:var(--font-size-12);font-weight:var(--font-weight-bold);text-transform:uppercase;letter-spacing:.5px;color:var(--text-secondary)}.metric-value{font-size:var(--font-size-27);font-weight:var(--font-weight-bold);margin:var(--horizontal-padding-8) 0;color:var(--color-green-900)}.metric-card p{font-size:var(--font-size-12);color:var(--text-muted)}.chart-container-panel{padding:var(--horizontal-padding-20)}.chart-sub{font-size:var(--font-size-12);color:var(--text-secondary);margin-bottom:var(--vertical-padding-16)}.mock-chart-wrapper{background:var(--bg-surface-alt);border-radius:var(--radius-md);padding:var(--horizontal-padding-16)}.table-container{padding:var(--horizontal-padding-20);margin-top:var(--spacing-25)}.table-filters{display:flex;gap:var(--horizontal-padding-16);margin-bottom:var(--spacing-25)}.table-filters input,.table-filters select{padding:var(--vertical-padding-8) var(--horizontal-padding-12);background:var(--bg-surface);border:1px solid var(--border-color);border-radius:var(--radius-sm);color:var(--text-primary);font-size:var(--font-size-13)}.responsive-table{width:100%;overflow-x:auto}table{width:100%;border-collapse:collapse;text-align:left}th,td{padding:var(--vertical-padding-16) var(--horizontal-padding-16);border-bottom:1px solid var(--border-color);font-size:var(--font-size-14)}th{font-weight:var(--font-weight-bold);color:var(--text-secondary);background:var(--bg-surface-alt)}tr:hover td{background:var(--bg-surface-alt)}.warning-alert-box{background:var(--danger-bg);border-left:4px solid var(--danger-fg);padding:var(--horizontal-padding-16);border-radius:var(--radius-md);margin-bottom:var(--spacing-25)}.warning-alert-box strong{color:var(--danger-fg);display:block;margin-bottom:var(--spacing-4);font-size:var(--font-size-14)}.warning-alert-box p{font-size:var(--font-size-13);color:var(--text-secondary)}.modal{position:fixed;top:0;left:0;width:100%;height:100%;background:#1a1a2e80;display:flex;align-items:center;justify-content:center;z-index:100;animation:fade-in .2s ease-out}.modal-content{padding:var(--horizontal-padding-20);max-height:90vh;overflow-y:auto;display:flex;flex-direction:column;background:var(--bg-surface)}.large-modal{width:90%;max-width:800px;height:80vh}.small-modal{width:90%;max-width:440px}.modal-header{display:flex;align-items:center;justify-content:space-between;padding-bottom:var(--vertical-padding-16);border-bottom:1px solid var(--border-color);margin-bottom:var(--vertical-padding-16)}.btn-close{background:none;border:none;color:var(--text-secondary);font-size:var(--font-size-24);cursor:pointer}.btn-close:hover{color:var(--text-primary)}.toast{position:fixed;top:var(--spacing-25);right:var(--spacing-25);padding:var(--vertical-padding-12) var(--horizontal-padding-20);border-radius:var(--radius-md);background:var(--bg-surface);border:1px solid var(--border-color);color:var(--text-primary);box-shadow:0 10px 30px #1a1a2e26;z-index:200;font-weight:var(--font-weight-normal);font-size:var(--font-size-14);animation:slide-in-toast .3s ease-out}.toast.success{border-left:4px solid var(--success-fg)}.toast.error{border-left:4px solid var(--danger-fg)}.toast.info{border-left:4px solid var(--brand-primary)}.hidden{display:none!important}@keyframes fade-in{0%{opacity:0}to{opacity:1}}@keyframes slide-up{0%{transform:translateY(10px);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes slide-in-toast{0%{transform:translate(100%);opacity:0}to{transform:translate(0);opacity:1}}@keyframes jump-dots{0%,80%,to{transform:scale(0)}40%{transform:scale(1)}}@keyframes pulse-red{0%,to{box-shadow:0 0 #b71c1c59}50%{box-shadow:0 0 0 8px #b71c1c00}}@media(max-width:900px){.metrics-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:768px){.main-viewport{padding:var(--horizontal-padding-20)}.app-container:has(.sidebar-toggle-btn:not(.hidden)) .main-viewport{padding-top:64px}.app-container:has(.sidebar.mode-student){grid-template-columns:1fr}.sidebar.mode-student{position:fixed;top:0;left:0;width:280px;max-width:82vw;height:100vh;transform:translate(-100%);box-shadow:0 0 40px #00000059}.sidebar.mode-student.sidebar-open{transform:translate(0)}.sidebar-toggle-btn{display:flex}.sidebar.mode-staff{grid-template-columns:1fr auto;grid-template-areas:"header footer" "nav nav";padding:var(--vertical-padding-12) var(--horizontal-padding-16)}.sidebar.mode-staff .school-branding h2{max-width:110px;font-size:var(--font-size-13)}.sidebar.mode-staff .staff-nav{flex-direction:row;overflow-x:auto;padding-bottom:var(--spacing-4)}.sidebar.mode-staff .nav-item{white-space:nowrap;flex-shrink:0}.sidebar.mode-staff .user-info span{display:none}}@media(max-width:640px){.role-grid,.metrics-grid{grid-template-columns:1fr}.table-filters{flex-wrap:wrap}.message-bubble{max-width:88%}.setup-header h1{font-size:var(--font-size-21)}.modal-content{padding:var(--horizontal-padding-16)}}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--horizontal-padding-8);font-family:var(--font-sans);font-size:var(--font-size-14);font-weight:var(--font-weight-bold);padding:var(--vertical-padding-10) var(--horizontal-padding-20);border-radius:var(--radius-md);border:none;cursor:pointer;transition:var(--transition-smooth);-webkit-user-select:none;user-select:none}.btn:focus-visible{outline:2px solid var(--brand-primary);outline-offset:2px}.btn-block{display:flex;width:100%}.btn-sm{padding:var(--vertical-padding-6) var(--horizontal-padding-12);font-size:var(--font-size-12)}.btn-primary{background:var(--brand-primary);color:var(--color-white);box-shadow:0 4px 14px #02006940}.btn-primary:hover{background:var(--brand-primary-hover);transform:translateY(-2px);box-shadow:0 6px 20px #0d47a14d}.btn-primary:active{background:#010040;transform:scale(.97)}.btn-primary:disabled{background:var(--color-primary-100);color:var(--text-muted);box-shadow:none;transform:none;cursor:not-allowed}.btn-secondary{background:var(--bg-surface-alt);color:var(--brand-primary);border:1px solid var(--border-strong)}.btn-secondary:hover{color:var(--brand-primary);border-color:var(--brand-primary-hover);box-shadow:0 4px 2px var(--bg-sunken)}.btn-secondary:active{background:var(--color-primary-100);transform:scale(.97)}.btn-secondary:disabled{border-color:var(--border-color);color:var(--color-primary-100);cursor:not-allowed}.btn-danger{background:var(--danger-fg);color:var(--color-white);box-shadow:0 4px 14px #b71c1c40}.btn-danger:hover{transform:translateY(-2px);box-shadow:0 6px 20px #b71c1c59}#btn-send-message,#btn-send-test-message{width:34px;height:34px;padding:0;border-radius:50%;flex-shrink:0}#btn-send-message:hover,#btn-send-test-message:hover{background:var(--color-secondary-700);box-shadow:0 0 0 4px #ff7b002e}#btn-send-message:active,#btn-send-test-message:active{background:#cc6200;transform:scale(.93)}#btn-send-message:disabled,#btn-send-test-message:disabled{background:var(--border-color);cursor:not-allowed}.sidebar-toggle-btn{border:1px solid var(--border-strong)}.sidebar-toggle-btn:hover{background:var(--color-primary-100);color:var(--brand-primary);border-color:var(--border-hover)}.sidebar-toggle-btn:active{background:var(--color-primary-100);transform:scale(.94)}.sidebar.mode-student .btn-logout{color:#ffffff80}.sidebar.mode-student .btn-logout:hover{color:var(--color-white);background:#ffffff29}.badge{display:inline-block;font-size:var(--font-size-10);font-weight:var(--font-weight-bold);padding:var(--spacing-2) var(--horizontal-padding-8);border-radius:var(--radius-8);background:var(--bg-page);color:var(--brand-primary);border:1px solid var(--border-strong)}.bg-purple{background:var(--color-secondary-50);color:var(--color-secondary-900);border-color:transparent}.badge-level{display:inline-block;font-size:var(--font-size-11);font-weight:var(--font-weight-bold);padding:var(--spacing-2) var(--horizontal-padding-8);border-radius:var(--radius-8)}.badge-level.safe{background:var(--success-bg);color:var(--success-fg)}.badge-level.warning{background:var(--warning-bg);color:var(--warning-fg)}.badge-level.critical{background:var(--danger-bg);color:var(--danger-fg);animation:pulse-red 2s infinite}.badge-tier{display:inline-block;font-size:var(--font-size-11);font-weight:var(--font-weight-bold);padding:var(--spacing-2) var(--horizontal-padding-8);border-radius:var(--radius-8)}.badge-tier-1{background:var(--color-yellow-50);color:var(--brand-secondary-text-safe)}.badge-tier-2{background:#ffe0b2;color:var(--brand-secondary-text-safe)}.badge-tier-3{background:var(--danger-bg);color:var(--danger-fg)}.badge-tier-4{background:var(--text-primary);color:var(--color-white)}.badge-status{display:inline-block;font-size:var(--font-size-11);font-weight:var(--font-weight-bold);padding:var(--spacing-2) var(--horizontal-padding-8);border-radius:var(--radius-8)}.badge-status-reviewed{background:#f3e5f5;color:#6a1b9a}.badge-status-unreviewed{background:#e3f2fd;color:var(--color-primary-400)}.badge-status-approved{background:var(--success-bg);color:var(--success-fg)}.badge-status-action-needed{background:var(--color-secondary-50);color:var(--brand-secondary-text-safe)}.badge-status-escalated{background:#fce4ec;color:#880e4f}.badge-admin-only{display:inline-block;font-size:var(--font-size-11);font-weight:var(--font-weight-bold);padding:var(--spacing-2) var(--horizontal-padding-8);border-radius:var(--radius-8);background:var(--color-secondary-50);color:var(--brand-secondary-text-safe);border:1px solid var(--border-strong)}.badge-corner{display:inline-block;font-size:var(--font-size-10);font-weight:var(--font-weight-bold);text-transform:uppercase;letter-spacing:.4px;padding:var(--spacing-3) var(--horizontal-padding-10);border-radius:var(--radius-20);color:var(--color-white)}.badge-corner-recommended{background:var(--color-ai-icon-green-dark)}.badge-corner-connected{background:var(--brand-primary)}.badge-corner-connected-gemini{background:var(--color-provider-gemini-dark)}.badge-connected-pill{display:inline-flex;align-items:center;gap:var(--spacing-4);font-size:var(--font-size-11);font-weight:var(--font-weight-bold);padding:var(--spacing-2) var(--horizontal-padding-8);border-radius:var(--radius-20);background:var(--success-bg);color:var(--success-fg);border:1px solid var(--border-strong);transition:var(--transition-smooth)}.badge-connected-pill:hover{background:var(--color-white);box-shadow:0 4px 4px #81c78426}.user-avatar{width:38px;height:38px;border-radius:50%;background:linear-gradient(135deg,var(--brand-primary),var(--brand-secondary-text-safe));color:var(--color-white);font-weight:var(--font-weight-bold);display:flex;align-items:center;justify-content:center;flex-shrink:0}.avatar-ai{width:32px;height:32px;border-radius:50%;background:var(--brand-primary);border:2px solid var(--color-ai-icon-green);display:flex;align-items:center;justify-content:center;flex-shrink:0}.avatar-ai img,.avatar-ai svg{width:18px;height:18px}.message-bubble{max-width:75%;padding:var(--vertical-padding-11) var(--horizontal-padding-16);border-radius:var(--radius-lg);line-height:1.45;font-size:var(--font-size-14);position:relative;animation:slide-up .3s ease-out;white-space:pre-wrap;overflow-wrap:break-word}.student-bubble{align-self:flex-end;background:var(--color-primary-500);color:var(--color-white);border:1px solid var(--color-primary-500);border-bottom-right-radius:4px}.assistant-bubble{align-self:flex-start;background:var(--bg-surface);border:1px solid var(--border-strong);border-bottom-left-radius:4px;margin-left:40px}.assistant-bubble:before{content:"";position:absolute;left:-40px;top:0;width:30px;height:30px;border-radius:50%;background-image:url(/static/assets/AI_icon_round.svg);background-size:cover;background-position:center}.message-bubble.bubble-warning{align-self:flex-start;background:var(--color-secondary-50);color:var(--brand-secondary-text-safe);border:1px solid var(--brand-secondary-text-safe);margin-left:40px}.message-bubble.bubble-redirect{align-self:flex-start;background:var(--success-bg);color:var(--success-fg);border:1px solid var(--success-fg);margin-left:40px}.message-bubble.bubble-prompt-tip{align-self:flex-start;background:var(--color-yellow-50);color:#5d4037;border:1px solid var(--border-strong);border-radius:var(--radius-10);margin-left:40px}.message-bubble.bubble-prompt-tip strong{color:var(--brand-secondary-text-safe)}.message-bubble.bubble-stuck{align-self:flex-start;background:var(--color-primary-100);color:var(--color-primary-400);border:1px solid var(--color-primary-400);border-radius:var(--radius-10);margin-left:40px}.message-bubble.bubble-stuck strong{color:var(--color-primary-400)}.sidebar.mode-staff .staff-nav{gap:var(--horizontal-padding-20)}.sidebar.mode-staff .nav-item{padding:var(--vertical-padding-12) var(--spacing-2);border-radius:0;border:none;border-bottom:2px solid transparent;color:var(--text-muted);font-weight:var(--font-weight-normal)}.sidebar.mode-staff .nav-item:hover{color:var(--brand-primary);background:transparent}.sidebar.mode-staff .nav-item.active{color:var(--brand-primary);background:transparent;border-bottom-color:var(--brand-primary);font-weight:var(--font-weight-bold)}.sidebar.mode-staff .count-badge{background:var(--brand-secondary)}.form-group input,.form-group textarea,.form-group select,.chat-input-area textarea,.table-filters input,.table-filters select{border-color:var(--border-strong)}.form-group input::placeholder,.form-group textarea::placeholder,.chat-input-area textarea::placeholder{color:var(--text-muted)}.toggle-row{display:flex;align-items:center;justify-content:space-between;gap:var(--horizontal-padding-16);padding:var(--vertical-padding-12) 0}.toggle-row-text{display:flex;flex-direction:column;gap:var(--spacing-2)}.toggle-row-text .toggle-label{font-size:var(--font-size-14);font-weight:var(--font-weight-bold);color:var(--text-primary)}.toggle-row-text .toggle-desc{font-size:var(--font-size-12);color:var(--text-secondary)}.toggle-switch{position:relative;display:inline-flex;align-items:center;width:38px;height:24px;flex-shrink:0;cursor:pointer}.toggle-switch input{position:absolute;opacity:0;width:100%;height:100%;margin:0;cursor:pointer}.toggle-switch .track{position:absolute;top:50%;left:0;transform:translateY(-50%);width:38px;height:21px;border-radius:999px;background:var(--border-strong);transition:var(--transition-smooth)}.toggle-switch .track:before{content:"";position:absolute;top:2px;left:2px;width:17px;height:17px;border-radius:50%;background:var(--color-white);box-shadow:0 1px 2px #02006940;transition:var(--transition-smooth)}.toggle-switch input:checked~.track{background:var(--brand-primary)}.toggle-switch input:checked~.track:before{transform:translate(17px)}.toggle-switch input:hover~.track{background:var(--color-gray-500)}.toggle-switch input:checked:hover~.track{background:var(--brand-primary-hover)}.toggle-switch input:focus-visible~.track{outline:2px solid var(--brand-primary);outline-offset:2px}.toggle-switch input:disabled~.track{opacity:.5;cursor:not-allowed}.segmented-control{display:inline-flex;gap:var(--spacing-6);padding:var(--spacing-3);background:var(--bg-surface);border-radius:var(--radius-20)}.segmented-control input{position:absolute;opacity:0;width:1px;height:1px;overflow:hidden}.segmented-control label{display:inline-flex;align-items:center;justify-content:center;padding:var(--vertical-padding-8) var(--horizontal-padding-16);min-height:24px;border-radius:var(--radius-20);border:1.5px solid var(--border-strong);color:var(--text-muted);font-size:var(--font-size-13);font-weight:var(--font-weight-normal);cursor:pointer;transition:var(--transition-smooth)}.segmented-control label:hover{border-color:var(--border-hover);color:var(--text-secondary)}.segmented-control input:checked+label{background:var(--bg-sunken);border-color:var(--brand-primary);color:var(--brand-primary);font-weight:var(--font-weight-bold)}.segmented-control input:focus-visible+label{outline:2px solid var(--brand-primary);outline-offset:2px}.domain-tags-field{display:flex;flex-wrap:wrap;gap:var(--horizontal-padding-8);padding:var(--horizontal-padding-12);background:var(--bg-surface);border:1px solid var(--border-strong);border-radius:var(--radius-md);min-height:48px}.domain-tag{display:inline-flex;align-items:center;gap:var(--spacing-6);padding:var(--vertical-padding-6) var(--horizontal-padding-10);border-radius:var(--radius-8);background:var(--bg-page);color:var(--brand-primary);border:1px solid var(--border-strong);font-size:var(--font-size-13);font-weight:var(--font-weight-bold)}.domain-tag .domain-tag-remove{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;margin:-4px -6px -4px 0;border:none;background:transparent;color:var(--text-muted);border-radius:50%;cursor:pointer;font-size:var(--font-size-16);line-height:1;transition:var(--transition-smooth)}.domain-tag .domain-tag-remove:hover{background:var(--danger-bg);color:var(--danger-fg)}.domain-tag .domain-tag-remove:focus-visible{outline:2px solid var(--brand-primary);outline-offset:1px}.domain-tag-add{display:inline-flex;align-items:center;gap:var(--spacing-4);padding:var(--vertical-padding-6) var(--horizontal-padding-10);border-radius:var(--radius-8);background:transparent;color:var(--text-muted);border:1px dashed var(--border-strong);font-size:var(--font-size-13);font-weight:var(--font-weight-bold);cursor:pointer;transition:var(--transition-smooth)}.domain-tag-add:hover{border-color:var(--brand-primary);color:var(--brand-primary)}.domain-tag-input{flex:1;min-width:140px;border:none;outline:none;font-family:var(--font-sans);font-size:var(--font-size-13);color:var(--text-primary);background:transparent}.group-chip{display:inline-flex;align-items:center;gap:var(--spacing-4);padding:var(--vertical-padding-6) var(--horizontal-padding-12);border-radius:var(--radius-20);background:var(--bg-sunken);color:var(--brand-primary);border:1px solid var(--border-strong);font-size:var(--font-size-13);font-weight:var(--font-weight-bold)}.group-chip-add{display:inline-flex;align-items:center;gap:var(--spacing-4);padding:var(--vertical-padding-6) var(--horizontal-padding-12);border-radius:var(--radius-20);background:var(--success-bg);color:var(--success-fg);border:1px solid var(--border-strong);font-size:var(--font-size-13);font-weight:var(--font-weight-bold);cursor:pointer;transition:var(--transition-smooth)}.group-chip-add:hover{background:#dffce6}.role-card,.testchat-role-card{border-color:var(--border-strong)}.provider-card{display:flex;flex-direction:column;gap:var(--vertical-padding-12);padding:var(--horizontal-padding-20);border-radius:var(--radius-md);background:var(--bg-surface);border:1.5px solid var(--border-strong);position:relative;transition:var(--transition-smooth)}.provider-card:hover{border-color:var(--border-strong);box-shadow:0 4px 14px #02006914}.provider-card.selected{background:var(--bg-sunken);border-color:var(--brand-primary)}.provider-card-head{display:flex;align-items:center;justify-content:space-between;gap:var(--horizontal-padding-12)}.provider-card-title{font-size:var(--font-size-16);font-weight:var(--font-weight-bold);color:var(--text-primary)}.provider-card-desc{font-size:var(--font-size-12);color:var(--text-secondary)}.provider-card input[type=password],.provider-card input[type=text]{width:100%;padding:var(--vertical-padding-10) var(--horizontal-padding-12);border:1px solid var(--border-strong);border-radius:var(--radius-sm);font-family:var(--font-sans);font-size:var(--font-size-13);color:var(--text-primary);background:var(--bg-surface)}.dropdown{position:relative;display:inline-block}.dropdown-trigger{display:flex;align-items:center;gap:var(--horizontal-padding-8);padding:var(--vertical-padding-8) var(--horizontal-padding-12);background:var(--bg-surface);border:1px solid var(--border-strong);border-radius:var(--radius-sm);color:var(--text-secondary);font-family:var(--font-sans);font-size:var(--font-size-13);cursor:pointer;transition:var(--transition-smooth)}.dropdown-trigger:hover{color:var(--brand-primary);border-color:var(--border-hover)}.dropdown-trigger.open,.dropdown-trigger[aria-expanded=true]{color:var(--brand-primary);border-color:var(--brand-primary);font-weight:var(--font-weight-bold)}.dropdown-trigger .chevron{transition:transform .15s ease-out}.dropdown-trigger[aria-expanded=true] .chevron{transform:rotate(180deg)}.dropdown-menu{position:absolute;top:calc(100% + 6px);left:0;min-width:200px;max-height:320px;overflow-y:auto;background:var(--bg-surface);border:1px solid var(--border-strong);border-radius:var(--radius-md);box-shadow:0 10px 30px #1a1a2e26;z-index:50;padding:var(--spacing-4)}.dropdown-item{display:flex;align-items:center;justify-content:space-between;gap:var(--horizontal-padding-8);padding:var(--vertical-padding-8) var(--horizontal-padding-12);min-height:28px;border-radius:var(--radius-sm);color:#333;font-size:var(--font-size-13);cursor:pointer;border-left:2px solid transparent}.dropdown-item:hover{background:#e0e3f059}.dropdown-item.selected{background:var(--bg-sunken);color:var(--brand-primary);border-left-color:var(--brand-primary);font-weight:var(--font-weight-bold)}.dropdown-item:focus-visible{outline:2px solid var(--brand-primary);outline-offset:-2px}.support-email-link{color:var(--brand-primary);text-decoration:underline;font-weight:var(--font-weight-bold)}.support-email-link:hover{color:var(--brand-secondary-text-safe)}.support-email-link:focus-visible{outline:2px solid var(--brand-primary);outline-offset:2px}.prompt-row{border-bottom:1px solid var(--border-color);transition:var(--transition-smooth)}.prompt-row:hover{background:#fafbff;box-shadow:inset 3px 0 0 var(--border-strong)}.prompt-row.filtered-out{background:var(--bg-surface-alt)}.prompt-row.filtered-out .filtered-tag{display:inline-flex;align-items:center;gap:var(--spacing-4);font-size:var(--font-size-10);font-weight:var(--font-weight-bold);text-transform:uppercase;letter-spacing:.4px;color:var(--text-muted);margin-left:var(--horizontal-padding-8)}.filtered-tag{display:none}