:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}body{margin:0}:root{--paper:#faf8f1;--paper-2:#f4f1e6;--card-bg:#fff;--ink:#1c2b3a;--ink-soft:#4a5a68;--ink-muted:#788896;--rule:#d4e0e7;--rule-light:#e8eff3;--margin-red:#a13a3a;--accent:#a13a3a;--accent-hover:#882e2e;--accent-ink:#fff;--navy:#1f3a5c;--navy-hover:#14273f;--ok:#207248;--ok-bg:#e6f4ec;--ok-border:#b8e2cb;--err:#b83232;--err-bg:#faebeb;--err-border:#f0c2c2;--radius:6px;--radius-lg:10px;--shadow-sm:0 1px 3px #1c2b3a0f, 0 1px 2px #1c2b3a0a;--shadow-md:0 4px 12px #1c2b3a14, 0 2px 4px #1c2b3a0a;--shadow-lg:0 12px 32px #1c2b3a1f, 0 4px 12px #1c2b3a14}*{box-sizing:border-box}html,body,#root{background:var(--paper);color:var(--ink);-webkit-font-smoothing:antialiased;min-height:100vh;margin:0;padding:0;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}body{background-image:linear-gradient(var(--rule) 1px, transparent 1px);background-size:100% 42px;background-attachment:local}.page{border-left:2px solid var(--margin-red);background:linear-gradient(90deg,#a13a3a09 0 2px,#0000 2px);max-width:680px;min-height:100vh;margin:0 auto;padding:40px 24px 80px 36px;transition:max-width .25s;position:relative}.page.admin-mode{max-width:1140px;padding:32px 24px 80px 32px}@media (width<=768px){.page,.page.admin-mode{border-left-width:2px;padding:24px 16px 64px 20px}}@media (width<=480px){.page,.page.admin-mode{border-left-width:2px;padding:20px 12px 60px 14px}}h1{color:var(--ink);margin:0 0 6px;font-family:"Source Serif 4",Georgia,serif;font-size:28px;font-weight:700;line-height:1.25}@media (width<=480px){h1{font-size:23px}}.subtitle{color:var(--ink-soft);margin:0 0 28px;font-size:14px;line-height:1.45}.section-label{color:var(--navy);border-bottom:1px solid var(--rule);margin:0 0 14px;padding-bottom:6px;font-family:"Source Serif 4",Georgia,serif;font-size:16px;font-weight:600}.field{margin-bottom:16px}.field label{color:var(--ink-soft);margin-bottom:6px;font-size:13px;font-weight:600;display:block}.field input[type=text],.field input[type=password],.otr-input,.search-input,.filter-select{width:100%;color:var(--ink);background:var(--card-bg);border:1px solid var(--rule);border-radius:var(--radius);padding:10px 12px;font-family:inherit;font-size:14px;transition:border-color .15s,box-shadow .15s}.field input[type=text]:focus,.field input[type=password]:focus,.otr-input:focus,.search-input:focus,.filter-select:focus{border-color:var(--navy);outline:none;box-shadow:0 0 0 3px #1f3a5c1f}.row-2{grid-template-columns:1fr 1fr;gap:12px;display:grid}@media (width<=520px){.row-2{grid-template-columns:1fr;gap:10px}}.top-card{background:var(--paper-2);border:1px solid var(--rule);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);margin-bottom:24px;padding:18px 18px 6px}.students-header{justify-content:space-between;align-items:baseline;margin-bottom:14px;display:flex}#student-count{color:var(--navy);background:var(--paper-2);border:1px solid var(--rule);border-radius:12px;padding:2px 8px;font-size:13px;font-weight:600}.student-card{border:1px solid var(--rule);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);background:#fff;margin-bottom:16px;padding:18px 16px 16px;transition:transform .15s,box-shadow .15s;position:relative}.student-card:hover{box-shadow:var(--shadow-md)}.student-card .index{color:var(--navy);background:var(--paper);border:1px solid var(--rule-light);border-radius:4px;padding:0 8px;font-family:"Source Serif 4",Georgia,serif;font-size:13px;font-weight:600;position:absolute;top:-10px;left:14px}.remove-btn{color:var(--ink-muted);cursor:pointer;background:0 0;border:none;border-radius:4px;padding:6px;font-size:20px;line-height:1;transition:color .15s,background .15s;position:absolute;top:10px;right:10px}.remove-btn:hover{color:var(--err);background:var(--err-bg)}.radio-group{gap:8px;margin-top:4px;display:flex}.radio-pill{text-align:center;flex:1}.radio-pill input{display:none}.radio-pill label{color:var(--ink-soft);background:var(--paper);border:1px solid var(--rule);border-radius:var(--radius);cursor:pointer;-webkit-user-select:none;user-select:none;margin:0;padding:9px 0;font-size:13px;font-weight:600;transition:all .15s;display:block}.radio-pill.yes input:checked+label{background:var(--ok);border-color:var(--ok);color:#fff;box-shadow:0 2px 4px #20724840}.radio-pill.no input:checked+label{background:var(--accent);border-color:var(--accent);color:#fff;box-shadow:0 2px 4px #a13a3a40}.field-pair{grid-template-columns:1.2fr 1fr;gap:12px;margin-top:12px;display:grid}@media (width<=520px){.field-pair{grid-template-columns:1fr;gap:10px}}.field-pair .field-label{color:var(--ink-soft);margin-bottom:6px;font-size:12px;font-weight:600}.btn{border-radius:var(--radius);cursor:pointer;border:1px solid #0000;justify-content:center;align-items:center;gap:8px;padding:11px 18px;font-family:inherit;font-size:14px;font-weight:600;text-decoration:none;transition:background-color .15s,border-color .15s,box-shadow .15s,transform .1s;display:inline-flex}.btn:active{transform:translateY(1px)}.btn-sm{padding:7px 12px;font-size:13px}.btn-add{border:1.5px dashed var(--navy);color:var(--navy);background:#fff;width:100%;padding:13px;font-size:14px}.btn-add:hover{background:var(--paper-2);border-color:var(--navy-hover)}.btn-primary{background:var(--accent);color:var(--accent-ink);width:100%;padding:13px;font-size:15px;box-shadow:0 2px 4px #a13a3a33}.btn-primary:disabled{opacity:.55;cursor:not-allowed}.btn-primary:hover:not(:disabled){background:var(--accent-hover)}.btn-secondary{background:var(--navy);color:#fff}.btn-secondary:hover{background:var(--navy-hover)}.btn-ghost{border:1px solid var(--rule);color:var(--ink-soft);background:#fff}.btn-ghost:hover{background:var(--paper-2);color:var(--ink)}.btn-danger{background:var(--err);color:#fff}.btn-danger:hover{background:#9b2828}.banner{border-radius:var(--radius);box-shadow:var(--shadow-sm);justify-content:space-between;align-items:center;gap:12px;margin-bottom:20px;padding:12px 16px;font-size:14px;line-height:1.4;display:flex}.banner.ok{background:var(--ok-bg);color:var(--ok);border:1px solid var(--ok-border)}.banner.err{background:var(--err-bg);color:var(--err);border:1px solid var(--err-border)}.banner-close{cursor:pointer;color:inherit;background:0 0;border:none;border-radius:4px;padding:2px 6px;font-size:18px}.banner-close:hover{opacity:.7}.admin-link{text-align:center;color:var(--navy);border-top:1px solid var(--rule);margin-top:32px;padding-top:16px;font-size:13px;font-weight:500;text-decoration:none;transition:color .15s;display:block}.admin-link:hover{color:var(--accent);text-decoration:underline}.gate{text-align:center;border-radius:var(--radius-lg);border:1px solid var(--rule);max-width:360px;box-shadow:var(--shadow-md);background:#fff;margin:60px auto;padding:32px 24px}.gate .field{text-align:left}.admin-container{width:100%}.admin-header{flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:24px;display:flex}.admin-header-actions{gap:8px;display:flex}.stats-grid{grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:20px;display:grid}@media (width<=840px){.stats-grid{grid-template-columns:repeat(2,1fr)}}@media (width<=480px){.stats-grid{grid-template-columns:1fr 1fr;gap:8px}}.stat-card{border:1px solid var(--rule);border-radius:var(--radius);box-shadow:var(--shadow-sm);background:#fff;padding:14px 16px}.stat-label{text-transform:uppercase;letter-spacing:.5px;color:var(--ink-soft);margin-bottom:6px;font-size:12px;font-weight:600}.stat-value{color:var(--navy);font-family:"Source Serif 4",Georgia,serif;font-size:24px;font-weight:700}.filters-card{border:1px solid var(--rule);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);background:#fff;margin-bottom:20px;padding:16px}.search-box{margin-bottom:12px;position:relative}.search-icon{color:var(--ink-muted);pointer-events:none;font-size:14px;position:absolute;top:50%;left:12px;transform:translateY(-50%)}.search-input{padding-left:36px;padding-right:32px}.clear-search-btn{color:var(--ink-muted);cursor:pointer;background:0 0;border:none;padding:2px 6px;font-size:16px;position:absolute;top:50%;right:10px;transform:translateY(-50%)}.clear-search-btn:hover{color:var(--ink)}.filter-controls-row{flex-wrap:wrap;align-items:center;gap:12px;display:flex}.filter-item{color:var(--ink-soft);align-items:center;gap:6px;font-size:13px;display:flex}.filter-item label{white-space:nowrap;font-weight:600}.filter-select{width:auto;min-width:120px;padding:6px 10px;font-size:13px}@media (width<=640px){.filter-controls-row{flex-direction:column;align-items:stretch}.filter-item{justify-content:space-between}.filter-select{width:60%}}.data-toolbar{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;margin-bottom:16px;display:flex}.toolbar-left,.toolbar-right{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.results-count{color:var(--ink-soft);font-size:13px;font-weight:500}.view-toggle{border:1px solid var(--rule);border-radius:var(--radius);background:#fff;display:inline-flex;overflow:hidden}.view-btn{cursor:pointer;color:var(--ink-soft);background:0 0;border:none;padding:6px 12px;font-size:12px;font-weight:600;transition:all .15s}.view-btn.active{background:var(--navy);color:#fff}.table-wrap{border:1px solid var(--rule);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);background:#fff;margin-bottom:24px;overflow-x:auto}table.data-table{border-collapse:collapse;width:100%;font-size:13px}table.data-table th,table.data-table td{border-bottom:1px solid var(--rule-light);text-align:left;padding:10px 14px}table.data-table th{background:var(--paper-2);color:var(--navy);text-transform:uppercase;letter-spacing:.4px;border-bottom:2px solid var(--rule);white-space:nowrap;font-size:12px;font-weight:700;position:sticky;top:0}table.data-table tbody tr{transition:background-color .15s}table.data-table tbody tr:hover{background-color:#1f3a5c08}table.data-table tbody tr.row-selected{background-color:#1f3a5c14}.row-action-btns{align-items:center;gap:6px;display:inline-flex}.btn-action{border:1px solid var(--rule);cursor:pointer;background:#fff;border-radius:4px;align-items:center;gap:4px;padding:4px 8px;font-size:12px;font-weight:600;transition:all .15s;display:inline-flex}.btn-action.edit:hover{background:var(--navy);color:#fff;border-color:var(--navy)}.btn-action.delete:hover{background:var(--err);color:#fff;border-color:var(--err)}.tag{letter-spacing:.3px;text-transform:uppercase;border-radius:12px;padding:3px 8px;font-size:11px;font-weight:700;display:inline-block}.tag-yes{background:var(--ok-bg);color:var(--ok);border:1px solid var(--ok-border)}.tag-no{background:var(--err-bg);color:var(--err);border:1px solid var(--err-border)}.otr-badge{background:var(--paper-2);border:1px solid var(--rule);color:var(--ink);border-radius:4px;padding:2px 6px;font-family:monospace;font-size:13px}.class-badge{color:var(--navy);font-weight:600}.cards-grid{grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:14px;margin-bottom:24px;display:grid}.record-card{border:1px solid var(--rule);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);background:#fff;flex-direction:column;justify-content:space-between;padding:16px;transition:transform .15s,box-shadow .15s;display:flex}.record-card:hover{box-shadow:var(--shadow-md)}.record-card.card-selected{border-color:var(--navy);background:#1f3a5c05}.record-card-top{justify-content:space-between;align-items:center;margin-bottom:10px;display:flex}.record-card-select{align-items:center;gap:8px;display:flex}.record-num{color:var(--ink-muted);font-size:12px;font-weight:600}.record-name{color:var(--ink);margin:0 0 12px;font-family:"Source Serif 4",Georgia,serif;font-size:18px;font-weight:700}.record-details{flex-direction:column;gap:6px;margin-bottom:16px;font-size:13px;display:flex}.detail-row{border-bottom:1px dashed var(--rule-light);justify-content:space-between;align-items:center;padding-bottom:4px;display:flex}.detail-label{color:var(--ink-soft);font-size:12px}.detail-val{color:var(--ink);font-weight:500}.record-card-actions{grid-template-columns:1fr 1fr;gap:8px;margin-top:auto;padding-top:10px;display:grid}.modal-overlay{-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);z-index:999;background:#1c2b3a73;justify-content:center;align-items:center;padding:16px;animation:.15s fadeIn;display:flex;position:fixed;inset:0}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.modal-card{border-radius:var(--radius-lg);border:1px solid var(--rule);box-shadow:var(--shadow-lg);background:#fff;width:100%;max-width:520px;max-height:90vh;padding:24px;animation:.2s slideUp;overflow-y:auto}.modal-card.modal-delete{max-width:440px}@keyframes slideUp{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}.modal-header{border-bottom:1px solid var(--rule-light);justify-content:space-between;align-items:center;margin-bottom:18px;padding-bottom:12px;display:flex}.modal-header h2{color:var(--navy);margin:0;font-family:"Source Serif 4",Georgia,serif;font-size:20px;font-weight:700}.modal-close-btn{color:var(--ink-muted);cursor:pointer;background:0 0;border:none;border-radius:4px;padding:4px 8px;font-size:24px;line-height:1}.modal-close-btn:hover{color:var(--ink);background:var(--paper-2)}.modal-body{margin-bottom:20px}.modal-actions{border-top:1px solid var(--rule-light);justify-content:flex-end;gap:10px;padding-top:16px;display:flex}.empty-state{text-align:center;color:var(--ink-soft);border-radius:var(--radius-lg);border:1px dashed var(--rule);background:#fff;margin-bottom:24px;padding:48px 20px;font-size:14px}.spinner{border:3px solid var(--rule);border-top-color:var(--navy);border-radius:50%;width:32px;height:32px;margin:0 auto 12px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.font-semibold{font-weight:600}