@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Space+Grotesk:wght@400;500;600;700&display=swap');

:root { --bg:#070b18; --panel:rgba(14,21,42,.72); --panel-strong:#111a35; --line:rgba(150,170,255,.16); --text:#f4f7ff; --muted:#91a0c0; --cyan:#6de7ff; --violet:#9177ff; --green:#5be6a1; --red:#ff788b; --shadow:0 22px 70px rgba(0,0,0,.3); }
* { box-sizing:border-box; }
html,body { margin:0; min-height:100%; overflow-x:hidden; }
body { background:var(--bg); color:var(--text); font-family:'DM Sans',sans-serif; }
body:before { content:''; position:fixed; inset:0; z-index:-2; background:radial-gradient(circle at 15% 5%,rgba(53,111,255,.2),transparent 35%),radial-gradient(circle at 90% 35%,rgba(139,63,242,.16),transparent 32%),linear-gradient(145deg,#070b18,#0b1022 48%,#070b18); }
a { color:inherit; text-decoration:none; }
button,input,select,textarea { font:inherit; }
.particles { position:fixed; inset:0; z-index:-1; pointer-events:none; opacity:.75; }
.app-shell { min-height:100vh; }
.sidebar { width:260px; padding:24px 18px; border-right:1px solid var(--line); background:rgba(5,9,22,.68); backdrop-filter:blur(22px); display:flex; flex-direction:column; gap:30px; position:fixed; inset:0 auto 0 0; z-index:10; }
.brand { display:flex; align-items:center; gap:12px; padding:0 10px; }
.brand-mark { width:39px; height:39px; display:grid; place-items:center; border:1px solid rgba(109,231,255,.65); border-radius:13px; color:var(--cyan); background:linear-gradient(145deg,rgba(109,231,255,.2),rgba(145,119,255,.2)); box-shadow:0 0 22px rgba(109,231,255,.2); font-family:'Space Grotesk'; font-weight:700; }
.brand strong { display:block; font:700 17px 'Space Grotesk'; letter-spacing:-.5px; }
.brand small { color:var(--muted); font-size:10px; letter-spacing:1.2px; text-transform:uppercase; }
.nav-label { color:#5d6a89; font-size:10px; letter-spacing:1.7px; padding:0 12px; text-transform:uppercase; }
.nav { display:grid; gap:5px; }
.nav a { color:var(--muted); padding:12px 13px; border:1px solid transparent; border-radius:13px; display:flex; gap:12px; align-items:center; font-size:14px; transition:.2s; }
.nav a:hover,.nav a.active { color:var(--text); background:linear-gradient(90deg,rgba(109,231,255,.12),rgba(145,119,255,.06)); border-color:rgba(109,231,255,.18); }
.nav a.active .nav-icon { color:var(--cyan); }
.nav-icon { width:22px; text-align:center; font-size:18px; color:#667697; }
.sidebar-bottom { margin-top:auto; }
.user-mini { border:1px solid var(--line); padding:12px; border-radius:15px; display:flex; gap:10px; align-items:center; background:rgba(255,255,255,.03); }
.avatar { width:33px; height:33px; display:grid; place-items:center; border-radius:10px; background:linear-gradient(135deg,var(--violet),#4ec8fc); font-weight:700; color:#061022; }
.user-mini strong { display:block; font-size:12px; }
.user-mini span { color:var(--muted); font-size:11px; }
.main { width:100%; min-width:0; padding:26px clamp(20px,4vw,54px) 50px; }
.topbar-left { display:flex; align-items:center; gap:30px; min-width:0; }
.page-context { border-left:1px solid var(--line); padding-left:30px; }
.topbar { display:flex; align-items:center; justify-content:space-between; gap:18px; margin-bottom:36px; }
.eyebrow { color:var(--cyan); text-transform:uppercase; letter-spacing:2px; font-size:10px; font-weight:700; }
h1,h2,h3 { font-family:'Space Grotesk',sans-serif; margin:5px 0 0; letter-spacing:-1px; }
h1 { font-size:clamp(26px,3vw,38px); }
h2 { font-size:21px; }
h3 { font-size:17px; }
.top-actions { display:flex; align-items:center; gap:12px; }
.time-chip { border:1px solid var(--line); color:var(--muted); border-radius:11px; padding:9px 12px; font-size:12px; }
.btn { border:1px solid rgba(109,231,255,.4); color:#061421; border-radius:11px; padding:11px 16px; cursor:pointer; background:linear-gradient(135deg,var(--cyan),#87baff); font-weight:700; font-size:13px; box-shadow:0 10px 28px rgba(73,183,255,.15); transition:.2s; }
.btn:hover { transform:translateY(-1px); filter:brightness(1.08); }
.btn.secondary { color:var(--text); background:rgba(255,255,255,.04); border-color:var(--line); box-shadow:none; }
.btn.danger { background:rgba(255,120,139,.1); color:var(--red); border-color:rgba(255,120,139,.3); box-shadow:none; }
.btn.small { padding:8px 11px; font-size:12px; }
.grid { display:grid; gap:18px; }
.stats-grid { grid-template-columns:repeat(4,minmax(0,1fr)); margin-bottom:22px; }
.card { min-width:0; background:var(--panel); border:1px solid var(--line); border-radius:20px; box-shadow:var(--shadow); backdrop-filter:blur(18px); }
.stat { padding:20px; position:relative; overflow:hidden; }
.stat:after { content:''; position:absolute; width:90px; height:90px; border-radius:50%; background:var(--glow,rgba(109,231,255,.15)); filter:blur(25px); right:-20px; top:-30px; }
.stat-label { color:var(--muted); font-size:12px; }
.stat-value { font:700 30px 'Space Grotesk'; margin:8px 0 4px; }
.stat-meta { color:var(--green); font-size:11px; }
.two-col { grid-template-columns:minmax(0,1.5fr) minmax(280px,1fr); }
.card-head { display:flex; justify-content:space-between; align-items:center; gap:12px; padding:20px 22px; border-bottom:1px solid var(--line); }
.card-head p { margin:4px 0 0; color:var(--muted); font-size:12px; }
.table-wrap { overflow:auto; }
.directory-filters { display:flex; align-items:center; gap:9px; flex:1; }
.directory-filters .search { flex:1; }
.level-filter { width:180px; flex:0 0 180px; }
table { width:100%; border-collapse:collapse; min-width:520px; }
th { color:#6c7a9b; text-align:left; font-size:10px; text-transform:uppercase; letter-spacing:1px; font-weight:600; padding:14px 22px; }
td { padding:15px 22px; border-top:1px solid rgba(150,170,255,.08); color:#dfe6fb; font-size:13px; }
tr:hover td { background:rgba(109,231,255,.025); }
.person { display:flex; gap:10px; align-items:center; }
.person-avatar { width:31px; height:31px; border-radius:10px; display:grid; place-items:center; background:rgba(145,119,255,.18); color:#b8aaff; font-weight:700; font-size:11px; }
.person strong { display:block; font-size:13px; }
.person span { color:var(--muted); font-size:11px; }
.row-actions { display:flex; justify-content:flex-end; gap:7px; }
.pill { display:inline-flex; align-items:center; gap:5px; padding:5px 9px; border-radius:20px; background:rgba(91,230,161,.1); color:var(--green); font-size:11px; white-space:nowrap; }
.pill.blue { background:rgba(109,231,255,.1); color:var(--cyan); }
.pill.red { background:rgba(255,120,139,.1); color:var(--red); }
.progress { height:6px; border-radius:8px; background:#1b2645; overflow:hidden; margin-top:9px; }
.progress i { display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg,var(--cyan),var(--violet)); }
.level-list { padding:10px 22px 18px; }
.level-row { padding:13px 0; }
.level-line { display:flex; justify-content:space-between; font-size:12px; }
.level-line span { color:var(--muted); }
.empty { color:var(--muted); text-align:center; padding:38px 20px; }
.welcome-card { padding:28px 30px; display:flex; align-items:center; justify-content:space-between; gap:20px; margin-bottom:18px; background:linear-gradient(110deg,rgba(109,231,255,.1),rgba(145,119,255,.08)); }
.welcome-card p { color:var(--muted); font-size:13px; margin:8px 0 0; }
.welcome-orb { width:70px; height:70px; display:grid; place-items:center; flex:0 0 auto; border-radius:22px; color:var(--cyan); font:700 22px 'Space Grotesk'; border:1px solid rgba(109,231,255,.45); background:radial-gradient(circle,rgba(109,231,255,.25),rgba(145,119,255,.12)); box-shadow:0 0 35px rgba(109,231,255,.18); }
.quick-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:13px; margin-bottom:18px; }
.quick-card { display:flex; align-items:center; gap:12px; padding:17px; transition:.2s; }
.quick-card:hover { transform:translateY(-2px); border-color:rgba(109,231,255,.35); }
.quick-card strong,.quick-card small { display:block; }
.quick-card strong { font-size:13px; }
.quick-card small { color:var(--muted); font-size:11px; margin-top:4px; }
.quick-card b { margin-left:auto; color:var(--cyan); font-size:18px; }
.quick-icon { width:33px; height:33px; display:grid; place-items:center; color:var(--cyan); border-radius:10px; background:rgba(109,231,255,.1); font-size:20px; }
.mini-metrics { display:flex; gap:13px; margin-bottom:18px; }
.mini-metric { padding:14px 18px; min-width:155px; }
.mini-metric span,.mini-metric small { color:var(--muted); font-size:11px; }
.mini-metric strong { font:700 24px 'Space Grotesk'; margin:0 6px; }
.reveal-stack { display:grid; gap:12px; }
.reveal-card { overflow:hidden; }
.reveal-card summary { list-style:none; cursor:pointer; padding:18px 21px; display:flex; align-items:center; justify-content:space-between; gap:15px; }
.reveal-card summary::-webkit-details-marker { display:none; }
.reveal-card summary strong,.reveal-card summary small { display:block; }
.reveal-card summary strong { font-size:14px; }
.reveal-card summary small { color:var(--muted); font-size:11px; margin-top:4px; }
.reveal-card summary i { font-style:normal; color:var(--cyan); font-size:20px; transition:.2s; }
.reveal-card[open] summary i { transform:rotate(45deg); }
.reveal-content { border-top:1px solid var(--line); }
.levels-compact { display:grid; grid-template-columns:repeat(2,1fr); gap:15px; padding:18px 21px; }
.progressive-form,.progressive-panel { display:none; }
.progressive-form.open,.progressive-panel.open { display:block; }
.progressive-panel.open.grid { display:grid; }
.reveal-trigger { cursor:pointer; }
.modal { display:none; position:fixed; inset:0; z-index:50; place-items:center; padding:20px; }
.modal.open { display:grid; }
.modal-backdrop { position:absolute; inset:0; background:rgba(2,5,16,.78); backdrop-filter:blur(8px); }
.modal-dialog { position:relative; width:min(720px,100%); max-height:min(720px,calc(100vh - 40px)); overflow:auto; padding:24px; border:1px solid rgba(109,231,255,.24); border-radius:22px; background:#0d1530; box-shadow:0 30px 100px rgba(0,0,0,.58); animation:modalIn .2s ease-out; }
.modal-wide { width:min(920px,100%); }
.modal-head { display:flex; align-items:flex-start; justify-content:space-between; gap:18px; margin-bottom:20px; }
.modal-head p { color:var(--muted); font-size:12px; margin:5px 0 0; }
.modal-head-actions { display:flex; align-items:center; gap:8px; }
.modal-content { min-height:80px; }
.loading { color:var(--muted); text-align:center; padding:35px 15px; }
.notes-level { color:var(--cyan); text-transform:uppercase; letter-spacing:1.5px; font-size:10px; font-weight:700; padding:13px 0 7px; }
.modal-table { width:100%; min-width:620px; border-collapse:collapse; }
.modal-table th { padding:11px 12px; }
.modal-table td { padding:12px; }
.modal-table th,.modal-table td { border-bottom:1px solid rgba(150,170,255,.1); text-align:left; font-size:12px; }
.modal-table input { width:63px; padding:7px 8px; }
.grade-entry-table { min-width:760px; }
.grade-entry-table td { vertical-align:middle; }
.grade-entry-table .grade-input { width:82px; text-align:center; }
.grade-average { display:inline-grid; min-width:64px; place-items:center; padding:8px; border-radius:8px; color:var(--cyan); background:rgba(109,231,255,.08); font-weight:800; font-variant-numeric:tabular-nums; }
.modal-table .wide-input { width:150px; }
.notes-toolbar { display:flex; align-items:center; justify-content:space-between; gap:14px; margin:4px 0 2px; flex-wrap:wrap; }
.level-tabs { display:flex; gap:6px; padding:4px; border:1px solid rgba(150,170,255,.14); border-radius:13px; background:rgba(3,8,22,.35); }
.level-tab { border:0; border-radius:9px; padding:9px 14px; color:var(--muted); background:transparent; cursor:pointer; font:600 11px 'Space Grotesk'; transition:.2s; }
.level-tab:hover { color:var(--text); background:rgba(255,255,255,.05); }
.level-tab.active { color:#071223; background:linear-gradient(135deg,var(--cyan),#8ba7ff); box-shadow:0 7px 20px rgba(109,231,255,.18); }
.notes-context { color:var(--muted); font-size:11px; }
.modal-report { width:min(1000px,100%); }
.report-preview-content { border-radius:16px; overflow:hidden; }
.report-sheet { padding:32px; color:#17233d; background:#fff; border:1px solid #d9e3f4; border-radius:16px; box-shadow:0 15px 40px rgba(0,0,0,.18); }
.report-sheet-header { display:grid; grid-template-columns:minmax(210px,1fr) minmax(260px,1.25fr) auto; align-items:center; gap:22px; padding:0 0 22px; border-bottom:2px solid #d9e3f4; }
.report-institution { display:flex; align-items:center; gap:11px; min-width:0; }
.report-institution img { width:57px; height:57px; object-fit:contain; flex:0 0 auto; }
.report-institution strong,.report-institution span { display:block; }
.report-institution strong { color:#1c3d78; font:700 18px 'Space Grotesk'; letter-spacing:1.1px; }
.report-institution span { max-width:190px; margin-top:3px; color:#65718a; font-size:9px; line-height:1.35; }
.report-title { padding-left:22px; border-left:1px solid #d9e3f4; }
.report-kicker { color:#3d6baf; font-size:10px; font-weight:800; letter-spacing:2px; }
.report-sheet h1 { margin:7px 0 3px; font-size:clamp(24px,3.5vw,34px); color:#18233a; }
.report-sheet-header p { margin:0; color:#66758f; font-size:12px; }
.report-level-badge { padding:10px 14px; border-radius:12px; color:#fff; background:linear-gradient(135deg,#326cc5,#735bd7); font-size:12px; font-weight:800; white-space:nowrap; }
.report-student { display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:12px; margin:20px 0 12px; }
.report-student div,.report-summary div { padding:12px 14px; border:1px solid #d9e3f4; border-radius:10px; background:#fff; }
.report-student span,.report-summary span { display:block; margin-bottom:5px; color:#74839c; font-size:10px; text-transform:uppercase; letter-spacing:.6px; }
.report-student strong,.report-summary strong { display:block; color:#1b2942; font-size:13px; }
.report-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:22px; }
.report-summary strong { font-size:18px; }
.report-status.is-ok { color:#198754; }
.report-status.is-danger { color:#c53e56; }
.report-table { width:100%; border-collapse:collapse; background:#fff; }
.report-table th { padding:11px 9px; color:#fff; background:#1b2942; font-size:10px; text-align:left; white-space:nowrap; }
.report-table td { padding:10px 9px; color:#283752; border-bottom:1px solid #e1e8f2; font-size:11px; }
.report-table .report-prom { font-weight:800; color:#285da9; }
.report-table .report-muted td { color:#9aa7b9; }
.report-single-row tbody td { padding:17px 9px; font-size:13px; text-align:center; font-variant-numeric:tabular-nums; }
.report-single-row tbody td:first-child { text-align:left; }
.report-single-row td small { display:block; margin-top:4px; color:#75849c; font-size:10px; font-weight:400; }
.report-single-row .report-overall-score { color:#123d7c; background:#dbeafe; font-size:15px; }
.report-official-sheet { width:min(760px,100%); min-height:860px; margin:auto; padding:58px 72px 42px; color:#17233d; background:#fff; border:1px solid #d8d8d8; border-radius:0; box-shadow:0 15px 40px rgba(0,0,0,.18); font-family:'DM Sans',Arial,sans-serif; }
.report-official-brand { display:flex; flex-direction:column; align-items:center; text-align:center; }
.report-official-brand img { width:65px; height:65px; object-fit:contain; }
.report-official-brand strong { margin-top:7px; color:#173d7a; font:700 15px 'Space Grotesk',Arial,sans-serif; letter-spacing:1.2px; }
.report-official-brand span { margin-top:4px; color:#53637e; font-size:10px; letter-spacing:.1px; }
.report-official-sheet .report-official-title { margin:58px 0 44px; color:#17233d; text-align:center; text-decoration:underline; text-decoration-color:#7896c6; text-underline-offset:4px; font:600 15px 'Space Grotesk',Arial,sans-serif; letter-spacing:.45px; }
.report-official-details { display:grid; gap:25px; margin:0; color:#283752; font-size:12px; line-height:1.3; }
.report-official-details p { margin:0; }
.report-official-details span { color:#173d7a; font-weight:700; }
.report-official-table-wrap { margin-top:72px; overflow:visible; }
.report-official-table { min-width:0; border:1px solid #263959; color:#17233d; background:#fff; font-family:'DM Sans',Arial,sans-serif; }
.report-official-table th,.report-official-table td { padding:12px 7px; color:#17233d; border:1px solid #50627e; text-align:center; font-size:10px; }
.report-official-table th { background:#fff3c9; color:#17233d; font:700 9px 'Space Grotesk',Arial,sans-serif; letter-spacing:.3px; text-transform:uppercase; white-space:normal; }
.report-official-table td { font-size:11px; font-weight:500; }
.report-official-table td:first-child { text-align:center; white-space:nowrap; }
.report-official-table .report-overall-score { color:#173d7a; background:#edf4ff; font:700 12px 'Space Grotesk',Arial,sans-serif; }
.report-official-footer { margin-top:50px; color:#677791; text-align:center; font-size:9px; letter-spacing:.15px; }
.report-table .report-overall th,.report-table .report-overall td { padding:15px 10px; color:#172d55; background:#dbeafe; font-weight:800; border-top:2px solid #7eabd9; }
.report-table .report-overall th { text-align:right; font-size:11px; letter-spacing:.3px; text-transform:uppercase; }
.report-table .report-overall td { color:#173f7b; font-size:14px; text-align:center; }
.report-footer { display:flex; justify-content:space-between; gap:15px; margin-top:20px; color:#74839c; font-size:10px; }
.report-footer strong { color:#3d6baf; }
.payment-total { display:flex; justify-content:flex-end; color:var(--muted); font-size:12px; padding-top:16px; }
.payment-void-row td { color:#8290aa; background:rgba(255,120,139,.035); }
.payment-void-row td:not(:last-child) { text-decoration:none; }
.payment-void-detail { display:block; margin-top:5px; color:#e897a7; font-size:10px; white-space:nowrap; }
.payment-void-label { color:#8493ae; font-size:10px; white-space:nowrap; }
.modal-footer { display:flex; justify-content:flex-end; gap:9px; margin-top:18px; }
.schedule-toolbar { display:flex; justify-content:flex-end; margin-bottom:14px; }
.schedule-toolbar label { display:flex; align-items:center; gap:9px; color:var(--muted); font-size:12px; }
.schedule-toolbar .form-control { width:120px; }
.schedule-table input { min-width:150px; }
.modal-close { width:34px; height:34px; border:1px solid var(--line); border-radius:10px; background:rgba(255,255,255,.04); color:var(--text); cursor:pointer; font-size:20px; }
body.modal-open { overflow:hidden; }
.pagination { display:flex; align-items:center; justify-content:space-between; gap:15px; padding:16px 22px; border-top:1px solid var(--line); color:var(--muted); font-size:12px; }
.pagination div { display:flex; gap:8px; }
@keyframes modalIn { from { opacity:0; transform:translateY(10px) scale(.98); } to { opacity:1; transform:none; } }
@media print { @page { size:A4 portrait; margin:12mm; } body.print-mode * { visibility:hidden !important; } body.print-mode .modal.printing, body.print-mode .modal.printing * { visibility:visible !important; } body.print-mode .modal.printing { display:block; position:static; padding:0; background:#fff; color:#111; } body.print-mode .modal.printing .modal-backdrop, body.print-mode .modal.printing .modal-head-actions, body.print-mode .modal.printing .modal-close, body.print-mode .modal.printing .report-actions { display:none !important; } body.print-mode .modal.printing .modal-dialog { width:100%; max-height:none; overflow:visible; border:0; box-shadow:none; color:#111; background:#fff; } body.print-mode .modal.printing .eyebrow, body.print-mode .modal.printing .modal-head p { color:#555; } body.print-mode .modal.printing .modal-table th, body.print-mode .modal.printing .modal-table td { color:#111; border-color:#ccc; } body.print-mode .modal.printing .report-sheet { border:0; box-shadow:none; border-radius:0; } }
@media print { body.print-mode .app-shell, body.print-mode .main { display:block !important; width:100% !important; min-height:0 !important; padding:0 !important; margin:0 !important; } body.print-mode .main > *:not(.modal.printing) { display:none !important; } body.print-mode .modal.printing { display:block !important; position:static !important; inset:auto !important; width:100% !important; min-height:0 !important; padding:0 !important; margin:0 !important; } body.print-mode .modal.printing .modal-head { display:none !important; } body.print-mode .modal.printing .modal-dialog { display:block !important; width:100% !important; max-width:none !important; min-height:0 !important; padding:0 !important; margin:0 !important; overflow:visible !important; } body.print-mode .modal.printing .report-preview-content { overflow:visible !important; } body.print-mode .modal.printing .report-sheet { min-height:0; padding:12mm 10mm 9mm; page-break-before:avoid; break-before:avoid; page-break-inside:avoid; break-inside:avoid; -webkit-print-color-adjust:exact; print-color-adjust:exact; } body.print-mode .modal.printing .report-sheet-header { padding-bottom:12px; } body.print-mode .modal.printing .report-sheet h1 { font-size:29px; } body.print-mode .modal.printing .report-student { margin:12px 0 8px; } body.print-mode .modal.printing .report-summary { margin-bottom:12px; } body.print-mode .modal.printing .report-table th { padding:8px 7px; } body.print-mode .modal.printing .report-table td { padding:7px; } body.print-mode .modal.printing .report-footer { margin-top:12px; } }
.toolbar { display:flex; justify-content:space-between; align-items:center; gap:14px; margin-bottom:18px; flex-wrap:wrap; }
.toolbar-actions { display:flex; align-items:center; gap:9px; }
.search { position:relative; flex:1; min-width:230px; }
.search input { width:100%; padding-left:40px; }
.search span { position:absolute; left:14px; top:10px; color:#7383a7; }
.form-control { width:100%; padding:11px 13px; border-radius:10px; border:1px solid var(--line); background:rgba(3,8,22,.42); color:var(--text); outline:none; transition:.2s; }
.form-control:focus { border-color:rgba(109,231,255,.6); box-shadow:0 0 0 3px rgba(109,231,255,.08); }
select.form-control option { background:#101932; }
.form-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:15px; }
.form-group { display:grid; gap:7px; }
.form-group.full { grid-column:1/-1; }
.form-group label { color:#9eabcd; font-size:11px; }
.form-help { color:var(--muted); font-size:10px; line-height:1.4; }
.form-card { padding:22px; }
.form-actions { display:flex; justify-content:flex-end; gap:10px; margin-top:20px; }
.alert { border:1px solid; border-radius:12px; padding:12px 15px; margin-bottom:18px; font-size:13px; }
.alert.success { color:var(--green); border-color:rgba(91,230,161,.3); background:rgba(91,230,161,.08); }
.alert.error { color:var(--red); border-color:rgba(255,120,139,.3); background:rgba(255,120,139,.08); }
.detail-head { display:flex; justify-content:space-between; align-items:center; gap:18px; margin-bottom:22px; }
.detail-person { display:flex; gap:14px; align-items:center; }
.detail-avatar { width:60px; height:60px; display:grid; place-items:center; border-radius:17px; background:linear-gradient(135deg,rgba(109,231,255,.22),rgba(145,119,255,.25)); color:var(--cyan); font:700 22px 'Space Grotesk'; }
.detail-person p { color:var(--muted); margin:5px 0 0; font-size:13px; }
.info-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; padding:20px 22px; }
.info-box { background:rgba(255,255,255,.025); border:1px solid rgba(150,170,255,.1); padding:12px; border-radius:12px; }
.info-box span { display:block; color:var(--muted); font-size:10px; margin-bottom:5px; }
.info-box strong { font-size:13px; }
.login-page { min-height:100vh; display:grid; place-items:center; padding:24px; }
.login-wrap { width:min(950px,100%); display:grid; grid-template-columns:1.05fr .95fr; border:1px solid var(--line); border-radius:27px; overflow:hidden; background:rgba(11,17,36,.65); box-shadow:var(--shadow); backdrop-filter:blur(22px); }
.login-visual { padding:50px; min-height:550px; background:radial-gradient(circle at 70% 30%,rgba(109,231,255,.23),transparent 35%),linear-gradient(145deg,rgba(47,71,166,.26),rgba(116,65,199,.12)); display:flex; flex-direction:column; justify-content:space-between; }
.login-visual h1 { max-width:390px; font-size:clamp(34px,5vw,58px); line-height:1.02; }
.login-visual p { color:#adbad7; max-width:350px; line-height:1.7; font-size:14px; }
.signal { display:flex; gap:8px; align-items:center; color:var(--cyan); font-size:11px; text-transform:uppercase; letter-spacing:1.5px; }
.signal i { width:8px; height:8px; background:var(--green); border-radius:50%; box-shadow:0 0 12px var(--green); }
.login-box { padding:50px; display:flex; flex-direction:column; justify-content:center; }
.login-box h2 { font-size:28px; margin:7px 0; }
.login-box > p { color:var(--muted); font-size:13px; margin:0 0 30px; }
.login-box form { display:grid; gap:17px; }
.login-box .btn { width:100%; margin-top:7px; }
.login-note { color:#667694; font-size:11px; line-height:1.5; margin-top:24px; }
.mobile-toggle { display:none; }
@media (max-width:1050px) { .stats-grid { grid-template-columns:repeat(2,1fr); } .two-col { grid-template-columns:1fr; } }
@media (max-width:760px) { .main { width:100%; padding:20px 15px 35px; } .topbar { margin-bottom:27px; align-items:flex-start; } .topbar-left { gap:15px; } .brand { flex:0 0 auto; } .brand strong,.brand small { display:none; } .brand-mark { width:38px; height:38px; } .page-context { padding-left:15px; } .top-actions .time-chip { display:none; } .info-grid { grid-template-columns:repeat(2,1fr); } .detail-head { align-items:flex-start; flex-direction:column; } .login-wrap { grid-template-columns:1fr; } .login-visual { min-height:260px; padding:30px; } .login-visual h1 { font-size:39px; } .login-visual p { margin-bottom:0; } .login-box { padding:30px; } .quick-grid { grid-template-columns:1fr; } .welcome-card { padding:22px; } .welcome-orb { width:52px; height:52px; border-radius:16px; } }
@media (max-width:480px) { .stats-grid { grid-template-columns:1fr 1fr; gap:10px; } .stat { padding:15px; } .stat-value { font-size:24px; } .form-grid { grid-template-columns:1fr; } .form-group.full { grid-column:auto; } .card-head { padding:17px; } td,th { padding-left:15px; padding-right:15px; } .modal { padding:10px; } .modal-dialog { padding:18px; max-height:calc(100vh - 20px); } .pagination { padding:14px 15px; flex-direction:column; align-items:flex-start; } .row-actions { flex-wrap:wrap; } .row-actions .btn { padding:7px 8px; font-size:11px; } .toolbar-actions { width:100%; } .toolbar-actions .btn { flex:1; } .directory-filters { flex-wrap:wrap; } .directory-filters .search,.level-filter { flex:1 1 100%; width:100%; } .level-tabs { width:100%; } .level-tab { flex:1; padding:8px 6px; font-size:10px; } .notes-context { width:100%; } .report-sheet { padding:18px; } .report-sheet-header { grid-template-columns:1fr; } .report-title { padding:0; border:0; } .report-level-badge { justify-self:start; } .report-student,.report-summary { grid-template-columns:1fr 1fr; } .report-footer { flex-direction:column; } }
@media print { body.print-mode .modal.printing .report-official-sheet { width:100%; min-height:0; padding:18mm 21mm 13mm; } body.print-mode .modal.printing .report-official-title { margin:18mm 0 15mm; font-size:14px; } body.print-mode .modal.printing .report-official-table-wrap { margin-top:25mm; } }


/* ═══════════════════════════════════════════════════════════
   REPORTE CONSOLIDADO PROFESIONAL
   ═══════════════════════════════════════════════════════════ */

.rpt {
    --rpt-ink: #1a2233;
    --rpt-muted: #5a6478;
    --rpt-line: #d8dee9;
    --rpt-accent: #1e4fa3;
    --rpt-pass: #1e7d4a;
    --rpt-pass-bg: #e6f4ec;
    --rpt-fail: #b3261e;
    --rpt-fail-bg: #fbeae9;
    --rpt-empty: #8a93a3;
    --rpt-empty-bg: #f0f2f6;

    background: #fff;
    color: var(--rpt-ink);
    font-family: 'Georgia', 'Times New Roman', serif;
    font-size: 11pt;
    line-height: 1.5;
    padding: 32px 40px;
    max-width: 820px;
    margin: 0 auto;
    border: 1px solid var(--rpt-line);
    border-radius: 4px;
    box-shadow: 0 2px 24px rgba(0,0,0,.08);
}

/* ── Encabezado ── */
.rpt-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    padding-bottom: 16px;
    border-bottom: 3px double var(--rpt-accent);
    margin-bottom: 24px;
}
.rpt-brand { display: flex; align-items: center; gap: 14px; }
.rpt-logo { width: 56px; height: 56px; object-fit: contain; }
.rpt-brand-text { display: flex; flex-direction: column; line-height: 1.2; }
.rpt-brand-text strong {
    font-family: 'Helvetica Neue', Arial, sans-serif;
    font-size: 14pt;
    letter-spacing: .5px;
    color: var(--rpt-accent);
}
.rpt-brand-text span {
    font-size: 8.5pt;
    color: var(--rpt-muted);
    font-style: italic;
    letter-spacing: .3px;
}
.rpt-meta { text-align: right; font-family: 'Helvetica Neue', Arial, sans-serif; font-size: 8.5pt; }
.rpt-meta div { display: flex; flex-direction: column; margin-bottom: 6px; }
.rpt-meta span { color: var(--rpt-muted); text-transform: uppercase; letter-spacing: .8px; }
.rpt-meta strong { font-size: 10pt; color: var(--rpt-ink); }

/* ── Título ── */
.rpt-title-block { text-align: center; margin-bottom: 28px; }
.rpt-title-block h1 {
    font-family: 'Helvetica Neue', Arial, sans-serif;
    font-size: 15pt;
    letter-spacing: 2px;
    color: var(--rpt-accent);
    margin: 0 0 4px;
    text-transform: uppercase;
}
.rpt-title-block p {
    font-size: 9.5pt;
    color: var(--rpt-muted);
    font-style: italic;
    margin: 0;
}

/* ── Ficha del estudiante ── */
.rpt-card {
    border: 1px solid var(--rpt-line);
    border-left: 4px solid var(--rpt-accent);
    border-radius: 3px;
    padding: 16px 20px;
    margin-bottom: 24px;
    background: #fafbfd;
}
.rpt-card-title {
    font-family: 'Helvetica Neue', Arial, sans-serif;
    font-size: 9pt;
    letter-spacing: 1.2px;
    text-transform: uppercase;
    color: var(--rpt-accent);
    margin: 0 0 12px;
    padding-bottom: 6px;
    border-bottom: 1px solid var(--rpt-line);
}
.rpt-info-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px 20px;
}
.rpt-info-item { display: flex; flex-direction: column; }
.rpt-info-item span {
    font-size: 7.5pt;
    text-transform: uppercase;
    letter-spacing: .8px;
    color: var(--rpt-muted);
    font-family: 'Helvetica Neue', Arial, sans-serif;
}
.rpt-info-item strong {
    font-size: 10.5pt;
    color: var(--rpt-ink);
    font-weight: 600;
}

/* ── Secciones ── */
.rpt-section { margin-bottom: 24px; }
.rpt-section-title {
    font-family: 'Helvetica Neue', Arial, sans-serif;
    font-size: 9pt;
    letter-spacing: 1.2px;
    text-transform: uppercase;
    color: var(--rpt-accent);
    margin: 0 0 10px;
}

/* ── Tabla de básicos ── */
.rpt-table {
    width: 100%;
    border-collapse: collapse;
    font-family: 'Helvetica Neue', Arial, sans-serif;
    font-size: 10pt;
}
.rpt-table thead th {
    background: var(--rpt-accent);
    color: #fff;
    text-align: left;
    padding: 10px 12px;
    font-size: 8.5pt;
    letter-spacing: 1px;
    text-transform: uppercase;
    font-weight: 600;
}
.rpt-table thead th.rpt-col-avg,
.rpt-table thead th.rpt-col-bar,
.rpt-table thead th.rpt-col-status { text-align: center; }

.rpt-table tbody td {
    padding: 10px 12px;
    border-bottom: 1px solid var(--rpt-line);
    vertical-align: middle;
}
.rpt-table tbody tr:last-child td { border-bottom: 2px solid var(--rpt-accent); }
.rpt-table tbody tr.rpt-row-pass { background: #f4faf6; }
.rpt-table tbody tr.rpt-row-fail { background: #fdf6f5; }
.rpt-table tbody tr.rpt-row-empty { background: #f8f9fb; color: var(--rpt-empty); }

.rpt-col-bs { width: 22%; }
.rpt-col-avg { width: 22%; text-align: center; }
.rpt-col-bar { width: 30%; }
.rpt-col-status { width: 26%; text-align: center; }

.rpt-avg {
    font-size: 13pt;
    font-weight: 700;
    color: var(--rpt-ink);
}
.rpt-col-avg small {
    font-size: 8pt;
    color: var(--rpt-muted);
    margin-left: 2px;
}

/* ── Barra de progreso ── */
.rpt-bar {
    width: 100%;
    height: 8px;
    background: #e8ecf2;
    border-radius: 4px;
    overflow: hidden;
}
.rpt-bar i {
    display: block;
    height: 100%;
    border-radius: 4px;
    transition: width .4s ease;
}
.rpt-row-pass .rpt-bar i { background: linear-gradient(90deg, #2ecc71, #1e7d4a); }
.rpt-row-fail .rpt-bar i { background: linear-gradient(90deg, #ff6b5b, #b3261e); }
.rpt-row-empty .rpt-bar i { background: #ccd2dc; }

/* ── Badges de estado ── */
.rpt-badge {
    display: inline-block;
    padding: 4px 10px;
    border-radius: 12px;
    font-size: 8.5pt;
    font-weight: 600;
    letter-spacing: .5px;
    text-transform: uppercase;
}
.rpt-badge-pass { background: var(--rpt-pass-bg); color: var(--rpt-pass); }
.rpt-badge-fail { background: var(--rpt-fail-bg); color: var(--rpt-fail); }
.rpt-badge-empty { background: var(--rpt-empty-bg); color: var(--rpt-empty); }

/* ── Resumen general ── */
.rpt-summary {
    text-align: center;
    padding: 20px;
    border-radius: 4px;
    margin-bottom: 24px;
    border: 2px solid;
}
.rpt-summary-pass { background: var(--rpt-pass-bg); border-color: var(--rpt-pass); }
.rpt-summary-fail { background: var(--rpt-fail-bg); border-color: var(--rpt-fail); }

.rpt-summary-label {
    font-family: 'Helvetica Neue', Arial, sans-serif;
    font-size: 9pt;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    color: var(--rpt-muted);
    margin-bottom: 6px;
}
.rpt-summary-value {
    font-size: 32pt;
    line-height: 1;
    margin-bottom: 4px;
}
.rpt-summary-value strong { font-weight: 700; color: var(--rpt-ink); }
.rpt-summary-value span { font-size: 14pt; color: var(--rpt-muted); margin-left: 4px; }
.rpt-summary-status {
    font-family: 'Helvetica Neue', Arial, sans-serif;
    font-size: 11pt;
    letter-spacing: 2px;
    font-weight: 700;
    text-transform: uppercase;
}
.rpt-summary-pass .rpt-summary-status { color: var(--rpt-pass); }
.rpt-summary-fail .rpt-summary-status { color: var(--rpt-fail); }

/* ── Observaciones ── */
.rpt-notes {
    padding: 14px 18px;
    background: #f8f9fb;
    border-left: 3px solid var(--rpt-accent);
    margin-bottom: 32px;
}
.rpt-notes h3 {
    font-family: 'Helvetica Neue', Arial, sans-serif;
    font-size: 9pt;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: var(--rpt-accent);
    margin: 0 0 6px;
}
.rpt-notes p {
    margin: 0;
    font-size: 10pt;
    color: var(--rpt-ink);
    line-height: 1.6;
}

/* ── Firmas ── */
.rpt-signatures {
    display: flex;
    justify-content: space-around;
    margin: 48px 0 32px;
}
.rpt-sign { text-align: center; width: 220px; }
.rpt-sign-line {
    border-top: 1px solid var(--rpt-ink);
    margin-bottom: 8px;
}
.rpt-sign strong {
    display: block;
    font-family: 'Helvetica Neue', Arial, sans-serif;
    font-size: 9.5pt;
    letter-spacing: .5px;
}
.rpt-sign span {
    display: block;
    font-size: 8pt;
    color: var(--rpt-muted);
    font-style: italic;
}

/* ── Pie ── */
.rpt-footer {
    border-top: 1px solid var(--rpt-line);
    padding-top: 12px;
    font-family: 'Helvetica Neue', Arial, sans-serif;
    font-size: 7.5pt;
    color: var(--rpt-muted);
    display: flex;
    justify-content: space-between;
    gap: 12px;
}
.rpt-footer div { flex: 1; }
.rpt-footer div:last-child { text-align: right; }

/* ═══════════════════════════════════════════════════════════
   IMPRESIÓN
   ═══════════════════════════════════════════════════════════ */
@media print {
    body.print-mode * { visibility: hidden; }
    body.print-mode #report-consolidated-modal,
    body.print-mode #report-consolidated-modal * { visibility: visible; }

    body.print-mode #report-consolidated-modal {
        position: absolute;
        top: 0; left: 0;
        width: 100%;
    }
    body.print-mode .modal-head,
    body.print-mode .report-actions,
    body.print-mode .modal-backdrop {
        display: none !important;
    }
    body.print-mode .rpt {
        box-shadow: none;
        border: none;
        padding: 0;
        max-width: 100%;
    }
    @page { size: A4; margin: 15mm; }
}


/* ═══════════════════════════════════════════════════════════
   TABLA DETALLADA (BS1–BS6 × Habilidades)
   ═══════════════════════════════════════════════════════════ */

.rpt-table-wrap { overflow-x: auto; }

.rpt-table-detailed {
    table-layout: fixed;
    font-size: 9.5pt;
}
.rpt-table-detailed .rpt-col-bs { width: 12%; }
.rpt-table-detailed .rpt-col-num { width: 13%; text-align: center; }
.rpt-table-detailed .rpt-col-final { width: 17%; text-align: center; }

.rpt-table-detailed thead th {
    padding: 9px 6px;
    font-size: 7.5pt;
    letter-spacing: .5px;
}
.rpt-table-detailed tbody td {
    padding: 8px 6px;
    text-align: center;
}
.rpt-table-detailed tbody td.rpt-col-bs { text-align: left; }

.rpt-score {
    display: inline-block;
    font-weight: 500;
    font-variant-numeric: tabular-nums;
}
.rpt-empty {
    color: #b9c0cc;
    font-style: italic;
}

/* Promedio final por BS destacado */
.rpt-avg {
    display: inline-block;
    min-width: 48px;
    padding: 4px 8px;
    border-radius: 4px;
    font-weight: 700;
    font-size: 10pt;
    font-variant-numeric: tabular-nums;
}
.rpt-avg-pass { background: var(--rpt-pass-bg); color: var(--rpt-pass); }
.rpt-avg-fail { background: var(--rpt-fail-bg); color: var(--rpt-fail); }
.rpt-avg-empty { background: var(--rpt-empty-bg); color: var(--rpt-empty); }

/* Fila de promedios por columna */
.rpt-table-detailed tfoot .rpt-row-average td {
    background: #eef2f8;
    color: #253153;
    font-size: 10pt;
    border-top: 2px solid var(--rpt-accent);
    border-bottom: none;
    padding: 10px 6px;
}
.rpt-table-detailed tfoot .rpt-row-average td.rpt-col-bs {
    letter-spacing: 1px;
    font-size: 9pt;
}