/* Academy visual system: ink, porcelain, electric indigo and restrained gold. */
:root { --ink:#152039; --muted:#728098; --bg:#f4f6fb; --line:#e7ecf4; --shadow:0 5px 20px #26395c05; }
body { background:radial-gradient(ellipse at 95% 0,#e8edff80,transparent 45%),var(--bg); -webkit-font-smoothing:antialiased; }
.sidebar { background:radial-gradient(ellipse at 5% 0,#1e3049,transparent 48%),#0e1725; padding-top:27px; }
.sidebar .brand { margin-bottom:30px; font-weight:650; letter-spacing:-.6px; }
.brand-logo { width:43px; height:43px; box-shadow:0 0 0 1px #d4b46644,0 5px 18px #0003; }
.sidebar .brand small { font-size:9px; color:#a7b4d0; letter-spacing:1.1px; margin-top:6px; }
.nav-label { font-size:9px; color:#71849f; letter-spacing:1.7px; margin-top:24px; }
.nav-item { padding:12px 13px; font-size:12px; margin:4px 0; border:1px solid transparent; color:#b3c1d8; }
.nav-item.active { background:linear-gradient(105deg,#5654e6,#4141a8); border-color:#ffffff20; box-shadow:0 5px 16px #0002; }
.nav-item:hover { transform:translateX(2px); }
.upgrade { background:linear-gradient(145deg,#24334977,#162232); border-color:#45577699; }
.topbar { height:80px; background:#ffffffda; backdrop-filter:blur(16px); padding:0 32px; }
.searchbox { background:#f8faff; border-color:#e6ebf4; padding:11px 13px; }
.searchbox input { background:transparent; font-size:12px; }
.org-select { background:linear-gradient(135deg,#19273c,#111d2e); box-shadow:0 4px 9px #0b1b3020; padding:14px 17px; }
.user { font-size:12px; }.user small { font-size:11px; }
.demo-notice { background:#ecedfb; padding-top:7px; padding-bottom:7px; font-size:10px; color:#65699a; }
.main { padding:29px 32px 18px; max-width:1750px; }
.page-heading { margin-bottom:24px; }.page-heading h1 { font-size:29px; letter-spacing:-1.1px; font-weight:700; }.page-heading p { font-size:13px; line-height:1.8; color:#7a86a0; }
.page-heading .eyebrow { font-size:9px; letter-spacing:2px; margin-bottom:8px; }
.card { border-radius:14px; padding:22px; border-color:#e5ebf4; box-shadow:0 4px 20px #14284c04; transition:box-shadow .2s,border-color .2s; }
.card:hover { border-color:#d9e1f0; box-shadow:0 8px 25px #25396208; }
.card h2 { font-size:15px; letter-spacing:-.35px; font-weight:650; }.card h3 { font-size:13px; }
.card-title { margin-bottom:21px; }.card-title .badge { font-size:10px; background:#f2f4fa; color:#78869c; }
.button { padding:11px 15px; font-size:12px; border-radius:8px; transition:transform .15s,box-shadow .15s; }
.button:not(.secondary):not(.soft) { box-shadow:0 4px 9px #5754ff18; }.button:hover { transform:translateY(-1px); box-shadow:0 5px 15px #4057a520; }.button:active { transform:translateY(0); }
.select { font-size:12px; padding:11px 13px; }.link { font-size:11px; }.badge { border-radius:6px; font-size:10px; padding:5px 8px; }
.stats { gap:14px; margin-bottom:21px; }.stat { padding:21px 16px; gap:13px; position:relative; overflow:hidden; min-height:120px; }
.stat:after { content:''; height:3px; position:absolute; bottom:0; left:17px; right:17px; background:linear-gradient(90deg,#665cf51c,transparent); border-radius:4px; }
.stat label { font-size:11px; margin-bottom:7px; }.stat strong { font-size:28px; letter-spacing:-1px; font-variant-numeric:tabular-nums; }.stat small { font-size:10px; line-height:1.6; margin-top:6px; color:#8b96aa; }
.stat-icon { width:42px; height:46px; border-radius:13px; box-shadow:inset 0 1px 0 #ffffff50,0 5px 14px #5554ff20; }.stat-icon .icon { width:23px; height:23px; }
.academy-hero { display:grid; grid-template-columns:1.6fr 1fr; align-items:center; gap:30px; border-radius:16px; background:radial-gradient(ellipse at 75% 0,#315d8460,transparent 60%),linear-gradient(105deg,#142238,#182641 70%,#1a2740); color:#fff; padding:27px 31px; margin-bottom:23px; overflow:hidden; position:relative; border:1px solid #273b59; }
.academy-hero:before { content:''; position:absolute; width:260px; height:260px; border:1px solid #ffffff08; border-radius:50%; right:30%; top:-100px; pointer-events:none; box-shadow:0 0 0 35px #ffffff03,0 0 0 70px #ffffff02; }
.hero-copy { display:flex; align-items:center; gap:23px; z-index:1; }.hero-emblem { width:83px; height:83px; border-radius:21px; box-shadow:0 10px 26px #0004,0 0 0 1px #ecc9844a; }
.hero-copy .eyebrow { color:#c8ad79; font-size:9px; letter-spacing:2px; margin-bottom:10px; }.hero-copy h2 { font-size:22px; font-weight:550; letter-spacing:-.5px; margin:0 0 8px; }.hero-copy p { margin:0; font-size:11px; color:#9eafc8; line-height:1.7; }
.hero-scores { display:grid; grid-template-columns:1fr 1fr; gap:23px; z-index:1; }.hero-score { border-left:1px solid #ffffff13; padding-left:23px; }.hero-score label { display:block; color:#a1b0c9; font-size:10px; margin-bottom:8px; }.hero-score strong { font-size:29px; letter-spacing:-1px; font-weight:600; }.hero-score small { display:block; font-size:9px; color:#90a5c2; margin-top:6px; }.hero-progress { height:4px; background:#ffffff12; border-radius:4px; margin-top:12px; max-width:150px; }.hero-progress span { display:block; height:4px; background:linear-gradient(90deg,#9290ff,#bcb2ff); border-radius:4px; }.hero-score:last-child .hero-progress span { background:linear-gradient(90deg,#26cba3,#90e4c6); }
.dashboard-charts { grid-template-columns:1.5fr 1.03fr .94fr; gap:18px; margin-bottom:19px; }.dashboard-lower { gap:18px; margin-bottom:19px; }.dashboard-bottom { gap:18px; }
.chart-summary { display:flex; gap:25px; margin:3px 0 19px; }.chart-summary strong { font-size:25px; letter-spacing:-.8px; font-weight:650; }.chart-summary small { font-size:10px; color:#8d98ab; display:block; margin-top:4px; }.chart-summary .trend { font-size:10px; color:#1fb184; background:#ebfaf4; padding:4px 7px; border-radius:5px; margin-left:7px; letter-spacing:0; vertical-align:middle; }
.premium-chart { position:relative; }.premium-chart svg { width:100%; height:auto; display:block; overflow:visible; }.premium-chart .gridline { stroke:#e9eef6; stroke-width:1; stroke-dasharray:3 5; }.premium-chart text { font-size:10px; fill:#8e9aaf; font-family:inherit; }.premium-chart .chart-line { stroke-width:3; fill:none; stroke-linejoin:round; stroke-linecap:round; }
.chart-legend { display:flex; align-items:center; gap:16px; margin-bottom:15px; flex-wrap:wrap; }.chart-legend button { font-size:10px; color:#6d7c97; padding:4px 0; display:flex; align-items:center; gap:6px; }.chart-legend i { height:7px; width:7px; border-radius:50%; background:var(--series-color); }.chart-legend button[aria-pressed=false] { opacity:.4; text-decoration:line-through; }.chart-point { cursor:crosshair; transition:r .15s; }.chart-point:hover,.chart-point:focus { r:6; outline:none; }
.chart-note { display:flex; justify-content:space-between; gap:12px; font-size:9px; color:#98a3b6; margin:10px 0 0; line-height:1.7; }.chart-hint { font-size:9px; color:#a5adc0; margin-left:auto; }
#chart-tooltip { position:fixed; pointer-events:none; z-index:150; background:#17253e; color:#eef3ff; box-shadow:0 8px 30px #13244030; border:1px solid #344662; border-radius:9px; padding:11px 14px; font-size:11px; white-space:pre-line; line-height:1.8; max-width:245px; }
.donut-layout { height:auto; min-height:205px; justify-content:center; flex-wrap:wrap; gap:16px; }.donut { width:160px; height:160px; box-shadow:0 0 0 8px #fafbfe; }.donut:after { inset:20px; }.donut-center b { font-size:29px; font-weight:650; letter-spacing:-1px; }.donut-center small { font-size:9px; }.weaknesses { min-width:160px; }.weakness { font-size:11px; padding:9px 0; gap:5px; }.weakness .dot { flex-shrink:0; }.weakness b { color:#4c5e7d; font-size:11px; }.insight { font-size:12px; line-height:1.85; gap:12px; margin:19px 0; }.insight .avatar { width:33px; height:33px; }.chart-caption { font-size:9px; line-height:1.8; }
table { font-size:12px; }th { font-size:10px; padding:12px 10px; font-weight:550; background:#f6f8fc; }td { padding:13px 10px; }tbody tr { transition:background .15s; }tbody tr:hover { background:#fafbff; }.person .avatar { width:30px; height:30px; font-size:10px; }.person { font-size:11px; gap:10px; }.activity { padding:13px 0; font-size:11px; }.activity small { font-size:10px; }.class-row { font-size:11px; padding:15px 0; }.class-row small { font-size:10px; line-height:1.7; }.class-row:before { height:39px; }
.insights-card { background:linear-gradient(155deg,#fff,#f9f8ff); }.insights-card h2:before { content:'✦'; color:#8c63ea; margin-right:8px; font-size:20px; }.insights-card .avatar { background:#efebfc; }.quick-grid { gap:11px; }.quick-grid .button { padding:13px 9px; font-size:11px; }.plan-info strong { font-size:13px; }.plan-info small { font-size:11px; }.meter { height:6px; margin:17px 0; }.small { font-size:12px; }.footnote { font-size:10px; margin-bottom:25px; }
.analytics-row { display:grid; grid-template-columns:1fr 1.15fr; gap:18px; margin-bottom:20px; }.analytics-row .card { overflow:hidden; }.performance-bars { display:flex; align-items:flex-end; height:162px; padding:5px 0 0; gap:16px; border-bottom:1px solid #e9edf5; }.performance-column { display:flex; flex:1; height:100%; flex-direction:column; align-items:center; justify-content:flex-end; position:relative; min-width:0; }.performance-column .bar { width:65%; max-width:45px; background:linear-gradient(0deg,#6560ee,#a4a0ff); border-radius:6px 6px 0 0; min-height:3px; transition:filter .15s; }.performance-column:nth-child(2n) .bar { background:linear-gradient(0deg,#24b995,#81dbc0); }.performance-column:hover .bar { filter:brightness(1.12); }.bar-value { font-size:11px; font-weight:650; color:#5c638d; padding-bottom:9px; }.bar-labels { display:flex; gap:16px; margin-top:13px; }.bar-labels span { flex:1; text-align:center; font-size:9px; color:#8692a9; min-width:0; }
.heatmap-scroll { overflow-x:auto; padding:3px 1px; }.heatmap { display:grid; grid-template-rows:repeat(7,12px); grid-auto-flow:column; grid-auto-columns:12px; gap:4px; width:max-content; }.heat-cell { background:#eef1f7; border:1px solid #e8edf4; border-radius:3px; padding:0; }.heat-cell[data-level='1'] { background:#d5ece3; border-color:#c6e7d9; }.heat-cell[data-level='2'] { background:#8bd5b9; border-color:#7bcdaa; }.heat-cell[data-level='3'] { background:#41bb90; border-color:#30ad80; }.heat-cell[data-level='4'] { background:#179568; border-color:#13875e; }.heat-cell:hover,.heat-cell:focus { outline:2px solid #574fff; outline-offset:1px; }.heatmap-meta { display:flex; justify-content:space-between; margin:15px 0 0; font-size:10px; color:#8b97aa; }.heatmap-meta .levels { display:flex; align-items:center; gap:4px; }.levels i { width:9px; height:9px; border-radius:2px; }
.profile-head { border-top:3px solid #6d63f6; background:linear-gradient(110deg,#fff,#f9faff); padding:26px; }.profile-head .avatar { background:linear-gradient(135deg,#5f65ff,#8a67ec); color:#fff; box-shadow:0 7px 20px #6258df24; }.profile-head h2 { font-size:24px; }.metric-row>div { background:#f6f8fd; border:1px solid #edf0f7; }.metric-row strong { font-size:25px; }.batch-card { border-top-width:3px; position:relative; }.batch-card:nth-child(3n+2) { border-top-color:#22bf93; }.batch-card:nth-child(3n) { border-top-color:#e9b84f; }.batch-card h2 { font-size:18px; }.assignment { border-left:3px solid #7d73f3; }.assignment .details h3 { font-size:16px; }.assignment p { font-size:12px; max-width:800px; }.empty { padding:45px 20px; font-size:12px; background:radial-gradient(ellipse at center,#f8faff,transparent); border-radius:10px; }.empty .icon { color:#a9b1d8; }
.main > * { animation:academy-arrive .35s ease-out both; }.main > :nth-child(2) { animation-delay:.04s; }.main > :nth-child(3) { animation-delay:.08s; }.main > :nth-child(4) { animation-delay:.12s; }@keyframes academy-arrive { from { opacity:0; transform:translateY(8px); } to { opacity:1; transform:translateY(0); } }
@media(min-width:1600px) { .sidebar { width:247px; }.shell { grid-template-columns:247px minmax(0,1fr); }.nav-item { font-size:13px; }.main { padding:33px 35px; }.stat { padding:23px 20px; }.stat strong { font-size:31px; }.dashboard-charts { grid-template-columns:1.55fr 1fr .95fr; } }
@media(max-width:1350px) { .dashboard-charts { grid-template-columns:1.4fr 1fr; }.insights-card { grid-column:1/-1; }.insights-list { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }.insight { margin:3px 0 12px; }.stat { padding:18px 12px; }.stat-icon { width:35px; height:39px; }.stat strong { font-size:25px; }.academy-hero { padding:24px; }.hero-copy h2 { font-size:20px; }.hero-emblem { width:72px; height:72px; }.hero-scores { gap:15px; }.hero-score { padding-left:15px; } }
@media(max-width:1100px) { .academy-hero { grid-template-columns:1fr; gap:22px; }.hero-scores { border-top:1px solid #ffffff12; padding-top:20px; }.hero-score:first-child { border-left:0; padding-left:0; }.stats { grid-template-columns:repeat(3,minmax(0,1fr)); }.sidebar .brand { font-size:16px; }.sidebar .brand-logo { width:36px; height:36px; }.main { padding:25px 22px; }.analytics-row { grid-template-columns:1fr; }.stat small { font-size:10px; }.page-heading h1 { font-size:27px; } }
@media(max-width:900px) { .dashboard-charts { grid-template-columns:1fr; }.insights-card { grid-column:auto; }.insights-list { display:block; }.insight { margin:18px 0; }.chart-summary strong { font-size:24px; }.donut-layout { flex-wrap:nowrap; }.donut { width:150px; height:150px; }.topbar { padding:0 20px; } }
@media(max-width:700px) { .main { padding:24px 16px; }.topbar { height:68px; padding:0 14px; }.page-heading h1 { font-size:25px; }.page-heading p { font-size:12px; }.academy-hero { padding:22px; border-radius:13px; }.hero-emblem { width:60px; height:60px; border-radius:16px; }.hero-copy { gap:15px; }.hero-copy h2 { font-size:19px; line-height:1.4; }.hero-copy p { font-size:10px; }.hero-copy .eyebrow { font-size:8px; }.hero-score strong { font-size:25px; }.stats { grid-template-columns:1fr 1fr; gap:11px; }.stat { min-height:117px; padding:18px 13px; gap:12px; }.stat:last-child { grid-column:1/-1; min-height:95px; }.card { padding:20px; }.card h2 { font-size:14px; }.stat-icon { width:36px; height:41px; }.chart-legend { gap:12px; }.chart-hint { display:none; }.chart-summary { gap:20px; }.chart-summary strong { font-size:23px; }.donut-layout { flex-wrap:wrap; }.weaknesses { min-width:135px; }.grid-2 { gap:15px; }.analytics-row { gap:15px; }.heatmap { grid-auto-columns:10px; grid-template-rows:repeat(7,10px); gap:3px; }.org-select { max-width:205px; font-size:11px; }.user { padding-left:8px; }.user .avatar { height:33px; width:33px; }.hero-banner { padding:20px; }.hero-banner h2 { font-size:17px; } }
@media(prefers-reduced-motion:reduce) { *,*:before,*:after { animation:none!important; transition:none!important; scroll-behavior:auto!important; } }
@media print { #chart-tooltip { display:none!important; } }