:root { --navy:#102d4e; --blue:#1769aa; --gold:#f0b42d; --ink:#182230; --muted:#5b6776; --line:#d9e0e8; --paper:#fff; --mist:#f2f6f9; }
* { box-sizing: border-box; }
body { margin:0; min-height:100vh; color:var(--ink); background:radial-gradient(circle at 10% 0%,#dfeaf3,transparent 35%),var(--mist); font:16px/1.55 "DM Sans",Arial,sans-serif; }
.page-shell { width:min(680px,calc(100% - 32px)); margin:0 auto; padding:38px 0 56px; }
.card,.lesson { background:var(--paper); border:1px solid var(--line); border-radius:18px; box-shadow:0 18px 42px rgba(27,53,79,.1); }
.card { overflow:hidden; padding:36px; }
.brand-row { display:flex; align-items:center; gap:16px; padding-bottom:25px; border-bottom:1px solid var(--line); }
.university-logo { width:200px; height:auto; max-height:110px; object-fit:contain; object-position:left center; }
.eyebrow { margin:0; color:var(--muted); font-size:.74rem; font-weight:700; letter-spacing:.09em; text-transform:uppercase; }
h1,h2,h3 { margin:0; line-height:1.2; } h1 { color:var(--navy); font:600 1.45rem Fraunces,Georgia,serif; } h2 { font:600 2rem/1.2 Fraunces,Georgia,serif; } h3 { margin-top:28px; font-size:1.05rem; }
.message { display:flex; gap:16px; margin:30px 0 22px; } .message p:not(.eyebrow),.lead { margin:11px 0 0; color:var(--muted); }
.alert-icon { flex:0 0 auto; display:grid; width:30px; height:30px; place-items:center; border-radius:50%; color:#915a00; background:#fff1cc; font-weight:700; }.warning { color:#a16100; margin-bottom:5px; }
.details { display:grid; grid-template-columns:1fr auto; gap:9px 18px; padding:17px; border-radius:10px; background:#f6f8fa; font-size:.92rem; }.details span { color:var(--muted); }.details strong { text-align:right; }
button { width:100%; border:0; border-radius:9px; padding:14px 18px; margin-top:26px; cursor:pointer; font:700 .98rem "DM Sans",sans-serif; transition:transform .15s,filter .15s; }button:hover { transform:translateY(-1px); filter:brightness(.97); }.primary-button { color:#fff; background:var(--blue); }.primary-button span { margin-left:8px; font-size:1.2rem; }.url-hint { margin:12px 0 0; color:var(--muted); text-align:center; font-size:.8rem; }.url-hint span { font-family:monospace; }
.lesson { padding:38px; text-align:center; }.lesson-icon { display:grid; width:48px; height:48px; place-items:center; margin:0 auto 15px; border-radius:50%; color:#146c43; background:#d9f3e4; font-weight:700; font-size:1.4rem; }.lesson .lead { max-width:540px; margin-right:auto; margin-left:auto; }.lesson ul { padding-left:22px; color:var(--muted); text-align:left; }.lesson li { margin:11px 0; }.lesson li strong,.safe-action strong { color:var(--ink); }.safe-action { margin-top:26px; padding:17px; border-left:4px solid var(--gold); background:#fff9e9; text-align:left; }.safe-action p { margin:5px 0 0; color:var(--muted); }.secondary-button { color:var(--navy); background:#e5edf4; }.hidden { display:none; }
@media (max-width:520px) { .page-shell { width:min(100% - 22px,680px); padding-top:18px; }.card,.lesson { padding:25px 20px; } h2 { font-size:1.65rem; }.details { grid-template-columns:1fr; gap:3px; }.details strong { margin-bottom:7px; text-align:left; }.message { gap:11px; } }
.admin-shell { display:block; min-height:100vh; padding:42px 24px; background:linear-gradient(135deg,#edf4f8 0%,#f9fafb 52%,#e8f0f5 100%); }.admin-card { width:min(440px,100%); margin:7vh auto; padding:38px; border:1px solid var(--line); border-radius:20px; background:#fff; box-shadow:0 18px 42px rgba(27,53,79,.1); }.admin-card h1 { margin:5px 0 12px; color:var(--navy); font:600 2rem Fraunces,Georgia,serif; }.admin-card h2 { margin:4px 0 12px; font:600 1.3rem Fraunces,Georgia,serif; }.admin-copy { color:var(--muted); }.admin-card label { display:block; margin-top:22px; font-size:.9rem; font-weight:700; }.admin-card input { width:100%; margin-top:7px; padding:13px; border:1px solid #b9c5d0; border-radius:8px; font:1rem "DM Sans",sans-serif; }.admin-card button { margin-top:18px; }.admin-logo { display:block; width:160px; max-height:90px; margin-bottom:22px; object-fit:contain; object-position:left center; }.form-error { padding:10px 12px; border-radius:8px; color:#8c2424; background:#fff0f0; }.dashboard { width:min(1040px,100%); margin:0 auto; padding:0; border:0; border-radius:0; background:transparent; box-shadow:none; }.dashboard-header { display:flex; align-items:center; gap:24px; padding:0 4px 28px; }.dashboard-header .admin-logo { flex:0 0 auto; width:150px; margin:0; }.admin-heading { display:flex; flex:1; align-items:start; justify-content:space-between; gap:15px; }.logout-link { color:var(--blue); font-weight:700; text-decoration:none; white-space:nowrap; }.logout-link span { margin-left:5px; }.success-message { padding:12px 15px; border-radius:10px; color:#146c43; background:#e9f6ee; }.stat-grid { display:grid; grid-template-columns:2fr 1fr 1fr; gap:16px; }.stat-featured,.stat-small,.activity-card,.control-card { border:1px solid var(--line); border-radius:16px; background:#fff; box-shadow:0 9px 23px rgba(27,53,79,.06); }.stat-featured { position:relative; overflow:hidden; padding:26px 28px; color:#fff; background:linear-gradient(125deg,#123d67,#1769aa); }.stat-featured:after { content:""; position:absolute; right:-55px; bottom:-84px; width:210px; height:210px; border:35px solid rgba(255,255,255,.08); border-radius:50%; }.stat-featured p { margin:0; font-weight:600; }.stat-featured strong { display:block; margin:2px 0; font:600 3.8rem Fraunces,Georgia,serif; }.stat-featured small { opacity:.78; }.stat-icon { position:absolute; top:24px; right:27px; display:grid; width:38px; height:38px; place-items:center; border-radius:10px; background:rgba(255,255,255,.15); font-size:1.35rem; }.stat-small { padding:25px 21px; }.stat-small span,.activity-label { color:var(--muted); font-size:.72rem; font-weight:700; letter-spacing:.08em; }.stat-small strong { display:block; margin-top:13px; color:var(--navy); font:600 2rem Fraunces,Georgia,serif; }.stat-small p { margin:3px 0 0; color:var(--muted); font-size:.85rem; }.stat-small .active-status { color:#16814f; font-size:1.65rem; }.dashboard-grid { display:grid; grid-template-columns:1.75fr .85fr; gap:16px; margin-top:16px; }.activity-card,.control-card { padding:25px; }.section-title { display:flex; align-items:start; justify-content:space-between; }.section-title h2 { margin:4px 0 0; }.activity-label { padding:6px 9px; border-radius:6px; background:#edf5fb; }.chart-list { margin-top:26px; }.chart-row { display:grid; grid-template-columns:91px 1fr 35px; gap:12px; align-items:center; margin:15px 0; color:var(--muted); font-size:.88rem; }.chart-row strong { color:var(--ink); text-align:right; }.bar-track { height:9px; overflow:hidden; border-radius:20px; background:#edf1f4; }.bar-track i { display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg,#2880bf,#0d4f88); }.empty-state { padding:35px 15px; color:var(--muted); text-align:center; }.empty-state span { display:grid; width:44px; height:44px; place-items:center; margin:0 auto 8px; border-radius:50%; color:#47718e; background:#edf5fb; font-size:1.5rem; }.empty-state p { margin:0; color:var(--ink); font-weight:700; }.empty-state small { display:block; margin-top:5px; }.control-card { background:#f9fbfc; }.control-card p:not(.eyebrow) { color:var(--muted); }.reset-form { margin-top:26px; }.reset-button { color:#9b2929; background:#fff0f0; }.reset-button:hover { background:#ffe4e4; }@media (max-width:750px) { .admin-shell { padding:24px 14px; }.dashboard-header { align-items:start; gap:15px; }.dashboard-header .admin-logo { width:100px; }.admin-heading { display:block; }.logout-link { display:inline-block; margin-top:11px; }.stat-grid,.dashboard-grid { grid-template-columns:1fr; }.stat-featured strong { font-size:3.2rem; }.chart-row { grid-template-columns:82px 1fr 30px; gap:8px; }.admin-card { padding:26px 20px; } }
.chart-visual { margin-top:24px; }.chart-visual svg { width:100%; overflow:visible; }.chart-visual text { fill:#6d7a87; font:12px "DM Sans",sans-serif; }.chart-grid { stroke:#e5ebef; stroke-width:1; }.chart-line { fill:none; stroke:#1872af; stroke-linecap:round; stroke-linejoin:round; stroke-width:3; }.chart-dot { fill:#fff; stroke:#1872af; stroke-width:3; }.chart-summary { display:flex; gap:22px; padding-top:7px; color:var(--muted); font-size:.85rem; }.chart-summary strong { margin-left:4px; color:var(--navy); }.password-section { margin-top:29px; padding-top:26px; border-top:1px solid var(--line); }.password-section h2 { margin-top:5px; }.password-section .form-error { margin-top:14px; }.password-form label { display:block; margin-top:14px; color:var(--ink); font-size:.82rem; font-weight:700; }.password-form input { width:100%; margin-top:5px; padding:10px 11px; border:1px solid #c8d3dc; border-radius:7px; background:#fff; font:14px "DM Sans",sans-serif; }.save-password { color:#fff; background:var(--blue); }.save-password:hover { background:#115b94; }