:root {
  --navy: #082B57;
  --gold: #CDA43A;
  --soft: #F4F7FA;
  --white: #ffffff;
  --ink: #10233d;
  --muted: #6b7a90;
  --border: #dfe6ee;
  --success: #16794c;
  --shadow: 0 16px 40px rgba(8,43,87,.10);
}
* { box-sizing: border-box; }
body { margin: 0; font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; background: var(--soft); color: var(--ink); }
button, input { font: inherit; }
button { cursor: pointer; }
.shell { min-height: 100vh; }
.topbar { background: var(--navy); color: #fff; padding: 14px 28px; display:flex; align-items:center; justify-content:space-between; gap:20px; }
.brand { display:flex; align-items:center; gap:12px; font-weight:800; letter-spacing:.02em; }
.brand img { width:46px; height:46px; object-fit:contain; background:#fff; border-radius:10px; padding:4px; }
.brand small { display:block; color:#dfe8f4; font-size:11px; font-weight:600; letter-spacing:.18em; margin-top:3px; }
.container { width:min(1180px, calc(100% - 36px)); margin: 26px auto 60px; }
.grid { display:grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap:16px; }
.card { background:var(--white); border:1px solid var(--border); border-radius:18px; box-shadow:var(--shadow); padding:20px; }
.metric strong { display:block; font-size:31px; margin-top:10px; }
.metric span { color:var(--muted); font-size:13px; }
.hero { display:flex; align-items:flex-end; justify-content:space-between; gap:20px; margin-bottom:22px; }
h1 { margin: 0 0 8px; font-size: clamp(28px, 4vw, 44px); line-height:1.05; color:var(--navy); }
h2 { margin:0 0 12px; color:var(--navy); }
h3 { margin:0 0 8px; }
p { color:var(--muted); line-height:1.6; }
.badge { display:inline-flex; align-items:center; padding:6px 10px; border-radius:999px; background:#eef3f8; color:var(--navy); font-size:12px; font-weight:800; }
.badge.gold { background:#fbf3db; color:#785b00; }
.course-grid { display:grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap:18px; }
.course-card { position:relative; overflow:hidden; }
.course-card::before { content:""; position:absolute; inset:0 auto 0 0; width:5px; background:var(--gold); }
.row { display:flex; justify-content:space-between; align-items:center; gap:16px; }
.progress { height:9px; border-radius:999px; background:#edf1f6; overflow:hidden; margin-top:12px; }
.progress > span { display:block; height:100%; background:linear-gradient(90deg, var(--navy), var(--gold)); }
.actions { display:flex; gap:10px; flex-wrap:wrap; }
.btn { border:0; border-radius:12px; padding:11px 16px; font-weight:800; }
.btn.primary { background:var(--navy); color:#fff; }
.btn.secondary { background:#edf3f8; color:var(--navy); }
.btn.gold { background:var(--gold); color:#fff; }
.table-wrap { overflow:auto; }
table { width:100%; border-collapse:collapse; }
th, td { padding:12px 10px; border-bottom:1px solid var(--border); text-align:left; font-size:14px; }
th { color:var(--muted); font-size:12px; text-transform:uppercase; letter-spacing:.08em; }
.login { min-height:100vh; display:grid; place-items:center; padding:20px; background:linear-gradient(135deg, var(--navy), #0f3f78); }
.login-card { width:min(470px, 100%); background:#fff; border-radius:24px; box-shadow:0 30px 80px rgba(0,0,0,.22); padding:30px; }
.login-card .brand { color:var(--navy); margin-bottom:24px; }
.form { display:grid; gap:14px; }
label { font-size:13px; color:var(--muted); font-weight:700; }
input { width:100%; border:1px solid var(--border); border-radius:12px; padding:13px 14px; outline:none; }
input:focus { border-color:var(--navy); box-shadow:0 0 0 3px rgba(8,43,87,.08); }
.demo-note { background:#fff8df; border:1px solid #f0df9d; color:#6c5500; padding:11px 13px; border-radius:12px; font-size:12px; line-height:1.5; }
.alert { background:#fff0f0; color:#a12727; border:1px solid #f3bcbc; padding:10px 12px; border-radius:12px; }
.footer-note { margin-top:28px; color:var(--muted); font-size:12px; text-align:center; }
@media (max-width: 900px) { .grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .course-grid { grid-template-columns:1fr; } }
@media (max-width: 620px) { .grid { grid-template-columns:1fr; } .topbar { padding:12px 16px; } .container { width:min(100% - 24px, 1180px); } .hero { align-items:flex-start; flex-direction:column; } }
select { width:100%; border:1px solid var(--border); border-radius:12px; padding:12px 13px; background:#fff; color:var(--ink); }
select:focus { border-color:var(--navy); outline:none; box-shadow:0 0 0 3px rgba(8,43,87,.08); }
.form-inline { display:grid; grid-template-columns: 1.2fr 1.2fr .7fr .8fr 1fr auto; gap:10px; align-items:center; }
.profile-list { display:grid; gap:10px; }
.profile-list > div { display:flex; justify-content:space-between; gap:20px; padding:10px 0; border-bottom:1px solid var(--border); }
.profile-list span { color:var(--muted); font-size:13px; }
.grade-cell { display:flex; flex-direction:column; gap:6px; min-width:130px; }
@media (max-width: 1000px) { .form-inline { grid-template-columns: 1fr 1fr 1fr; } }
@media (max-width: 620px) { .form-inline { grid-template-columns:1fr; } }

.course-upload { margin-bottom: 22px; }
.course-upload-heading, .course-upload-saved-header { display:flex; justify-content:space-between; align-items:flex-start; gap:18px; }
.course-upload-heading h2 { margin-top:8px; }
.course-upload-state { color:var(--navy); border:1px solid var(--border); border-radius:999px; padding:7px 10px; font-size:11px; font-weight:800; letter-spacing:.08em; white-space:nowrap; }
.course-upload-note { margin:16px 0; }
.course-upload-controls { display:grid; grid-template-columns:minmax(0, 1fr) auto; gap:16px; align-items:end; }
.course-upload-actions { justify-content:flex-end; }
.course-upload-help, .course-upload-file-name, .course-upload-status { margin:8px 0 0; font-size:13px; }
.course-upload-file-name { color:var(--navy); font-weight:700; overflow-wrap:anywhere; }
.course-upload-status { min-height:20px; }
.course-upload-preview { margin-top:16px; box-shadow:none; }
.course-upload-preview h3, .course-upload-detail h3 { color:var(--navy); margin-bottom:8px; }
.course-upload-preview h4, .course-upload-detail h4 { color:var(--navy); margin:18px 0 10px; }
.course-upload-release-state { color:var(--success); font-size:12px; font-weight:800; letter-spacing:.04em; }
.course-upload-meta { display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:10px 18px; margin:16px 0; }
.course-upload-field { min-width:0; }
.course-upload-field dt { color:var(--muted); font-size:11px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; }
.course-upload-field dd { margin:4px 0 0; overflow-wrap:anywhere; }
.course-upload-field-wide { grid-column:1 / -1; }
.course-upload-lessons { display:grid; gap:9px; }
.course-upload-lesson { border:1px solid var(--border); border-radius:12px; padding:10px 12px; background:#fbfcfe; }
.course-upload-lesson summary { cursor:pointer; color:var(--navy); font-weight:800; }
.course-upload-body { white-space:pre-wrap; overflow-wrap:anywhere; margin:12px 0 4px; font:inherit; line-height:1.55; color:var(--ink); }
.course-upload-hash { font-size:11px; overflow-wrap:anywhere; }
.course-upload-confirmation { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-top:18px; padding-top:16px; border-top:1px solid var(--border); }
.course-upload-check { display:flex; align-items:flex-start; gap:10px; color:var(--ink); font-size:13px; line-height:1.45; }
.course-upload-check input { width:auto; margin-top:3px; }
.course-upload-saved-header { margin-top:28px; padding-top:22px; border-top:1px solid var(--border); }
.course-upload-saved-header h3 { margin:0 0 4px; color:var(--navy); }
.course-upload-saved-header p { margin:0; font-size:13px; }
.course-upload-saved-list { display:grid; gap:10px; margin-top:12px; }
.course-upload-saved-item { border:1px solid var(--border); border-radius:14px; padding:14px; background:#fbfcfe; }
.course-upload-saved-heading { display:flex; justify-content:space-between; align-items:flex-start; gap:12px; }
.course-upload-saved-item p { margin:7px 0 0; font-size:13px; }
.course-upload-saved-item .btn { margin-top:11px; }
.course-upload-detail { margin-top:14px; box-shadow:none; }
.course-upload-media { margin-top:16px; padding-top:14px; border-top:1px solid var(--border); }
.course-upload-media h5 { margin:0 0 8px; color:var(--navy); font-size:14px; }
.course-upload-media-list { display:grid; gap:10px; }
.course-upload-video { display:grid; gap:7px; border:1px solid var(--border); border-radius:12px; padding:12px; background:#fff; }
.course-upload-video video { display:block; width:min(100%, 720px); max-height:405px; background:#0b1324; border-radius:8px; }
.course-upload-media-meta, .course-upload-media-hash, .course-upload-media-note, .course-upload-media-empty { margin:0; font-size:12px; overflow-wrap:anywhere; }
.course-upload-media-note { color:var(--muted); }
.course-upload-media-upload { display:grid; grid-template-columns:minmax(0, 1fr) auto; align-items:end; gap:10px; margin-top:12px; padding-top:12px; border-top:1px dashed var(--border); }
.course-upload-media-upload label { display:grid; gap:6px; color:var(--navy); font-size:12px; font-weight:800; }
.course-upload-media-upload input { font-weight:400; }
.course-upload-media-status { grid-column:1 / -1; min-height:18px; margin:0; font-size:12px; }
.course-upload button:focus-visible, .course-upload input:focus-visible, .course-upload summary:focus-visible { outline:3px solid rgba(205,164,58,.75); outline-offset:2px; }
.live-classes { margin-bottom: 22px; }
.live-class-heading { align-items:flex-start; }
.live-class-heading h2 { margin-top:8px; }
.live-class-state { color:var(--navy); border:1px solid var(--border); border-radius:999px; padding:7px 10px; font-size:11px; font-weight:800; letter-spacing:.08em; white-space:nowrap; }
.live-class-note { margin:16px 0; }
.live-class-form-grid { display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:14px; }
.live-class-form-grid > div { display:grid; gap:6px; }
.live-class-form-wide { grid-column:1 / -1; }
.live-class-form textarea { width:100%; border:1px solid var(--border); border-radius:12px; padding:12px 13px; resize:vertical; font:inherit; color:var(--ink); }
.live-class-form textarea:focus { border-color:var(--navy); outline:none; box-shadow:0 0 0 3px rgba(8,43,87,.08); }
.live-class-status { min-height:20px; margin:8px 0 0; font-size:13px; }
.live-class-list-heading { margin-top:24px; padding-top:18px; border-top:1px solid var(--border); }
.live-class-list-heading h3 { margin-bottom:4px; color:var(--navy); }
.live-class-list-heading p { margin:0; }
.live-class-list { display:grid; gap:12px; margin-top:12px; }
.live-class-card { border:1px solid var(--border); border-radius:14px; padding:15px; background:#fbfcfe; }
.live-class-card h3 { margin:9px 0 4px; color:var(--navy); }
.live-class-card p { margin:7px 0; font-size:13px; }
.live-class-actions { margin-top:12px; }
.live-class-empty { margin:12px 0; }
.live-classes button:focus-visible, .live-classes input:focus-visible, .live-classes textarea:focus-visible, .live-classes select:focus-visible { outline:3px solid rgba(205,164,58,.75); outline-offset:2px; }
@media (max-width: 760px) {
  .course-upload-controls, .course-upload-meta { grid-template-columns:1fr; }
  .course-upload-actions { justify-content:flex-start; }
  .course-upload-confirmation, .course-upload-heading, .course-upload-saved-header { flex-direction:column; align-items:stretch; }
  .course-upload-media-upload { grid-template-columns:1fr; align-items:stretch; }
  .course-upload-state { align-self:flex-start; }
  .course-upload-field-wide { grid-column:auto; }
  .live-class-form-grid { grid-template-columns:1fr; }
  .live-class-form-wide { grid-column:auto; }
  .live-class-heading { flex-direction:column; align-items:stretch; }
  .live-class-state { align-self:flex-start; }
}

.accounting-card { overflow:hidden; }
.accounting-card [hidden] { display:none !important; }
.accounting-metrics { margin:16px 0; grid-template-columns:repeat(4, minmax(0, 1fr)); }
.accounting-two-column { margin:18px 0; grid-template-columns:repeat(2, minmax(0, 1fr)); }
.accounting-inner-card { background:#fbfcfe; box-shadow:none; }
.accounting-form-section { margin:18px 0; padding-top:18px; border-top:1px solid var(--border); }
.accounting-form-grid { display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:12px; }
.accounting-form-wide { grid-column:1 / -1; }
.accounting-status { min-height:1.4em; color:var(--muted); }
.finance-lock { padding:10px 12px; color:#7a4b00; background:#fff7df; border:1px solid #e4c36a; border-radius:8px; }
.accounting-search { max-width:260px; }
.btn-small { padding:6px 9px; font-size:12px; }
@media (max-width:760px) {
  .accounting-metrics, .accounting-two-column, .accounting-form-grid { grid-template-columns:1fr; }
  .accounting-form-wide { grid-column:auto; }
}
