:root { --blue:#135cff; --orange:#f5a000; --green:#078957; --red:#c92f2a; --ink:#101219; --muted:#5f6876; --line:#d7deea; --soft:#f4f7fb; --white:#fff; }
* { box-sizing:border-box; min-width:0; }
html, body { margin:0; min-height:100%; max-width:100%; overflow-x:hidden; color:var(--ink); background:var(--soft); font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; letter-spacing:0; }
button, input { font:inherit; letter-spacing:0; }
button { cursor:pointer; }
a { color:var(--blue); }
:focus-visible { outline:3px solid var(--orange); outline-offset:3px; }
.skip-link { position:fixed; left:14px; top:-80px; z-index:100; padding:10px 14px; color:var(--ink); background:var(--white); border:2px solid var(--ink); }
.skip-link:focus { top:14px; }
.auth-view { min-height:100svh; display:grid; grid-template-columns:minmax(220px,340px) minmax(0,620px); gap:70px; place-content:center; align-items:center; padding:32px; background:var(--white); }
.auth-view img { width:280px; max-width:100%; }
.auth-view h1, .page-head h1 { margin:0; font-size:clamp(38px,5vw,60px); line-height:1.04; }
.auth-view p:not(.eyebrow), .page-head p { color:var(--muted); font-size:18px; }
.eyebrow { margin:0 0 8px; color:var(--blue); font-size:13px; font-weight:900; text-transform:uppercase; }
.primary-button, .secondary-button, .danger-button, .text-button, .icon-button, .menu-button { min-height:44px; padding:10px 16px; border:2px solid transparent; border-radius:8px; font-weight:800; }
.primary-button { color:var(--white); background:var(--blue); }
.secondary-button { color:var(--blue); background:var(--white); border-color:var(--line); }
.danger-button { color:var(--red); background:#fff; border-color:#efb4b1; }
.text-button, .icon-button, .menu-button { color:var(--blue); background:transparent; }
.status { min-height:24px; color:var(--muted); font-weight:700; }
.status[data-state="error"] { color:var(--red); }
.status[data-state="success"] { color:var(--green); }
.dashboard { min-height:100svh; display:grid; grid-template-columns:250px minmax(0,1fr); }
.side-nav { position:sticky; top:0; height:100svh; padding:28px 20px; color:var(--white); background:var(--ink); }
.dashboard-brand img { width:138px; filter:brightness(0) invert(1); }
.side-nav nav { display:grid; gap:5px; margin-top:42px; }
.side-nav nav button { width:100%; min-height:46px; padding:11px 12px; color:#c9d0da; background:transparent; border:0; border-left:4px solid transparent; text-align:left; font-weight:750; }
.side-nav nav button.active { color:var(--white); background:#242832; border-left-color:var(--orange); }
.app-link { position:absolute; left:20px; right:20px; bottom:28px; padding:12px; color:var(--white); border:1px solid #555e6c; border-radius:8px; text-align:center; text-decoration:none; font-weight:800; }
.dashboard-shell { min-height:100svh; }
.topbar { height:74px; display:grid; grid-template-columns:1fr auto auto; gap:12px; align-items:center; padding:0 34px; background:var(--white); border-bottom:1px solid var(--line); }
.topbar div { display:grid; }
.topbar span { color:var(--muted); font-size:13px; }
.menu-button { display:none; }
.main-content { width:min(1080px,calc(100% - 56px)); margin:0 auto; padding:42px 0 80px; }
.page-head { max-width:780px; margin-bottom:32px; }
.page-head h1 { font-size:46px; }
.metric-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }
.metric-grid article { min-height:138px; padding:24px; background:var(--white); border:1px solid var(--line); border-top:6px solid var(--blue); border-radius:8px; }
.metric-grid article.orange { border-top-color:var(--orange); }
.metric-grid article.green { border-top-color:var(--green); }
.metric-grid article span { display:block; color:var(--muted); font-weight:750; }
.metric-grid article strong { display:block; margin-top:16px; font-size:34px; }
.content-section { margin-top:22px; padding:26px; background:var(--white); border:1px solid var(--line); border-radius:8px; }
.content-section h2 { margin:0 0 12px; font-size:24px; }
.content-section p { color:var(--muted); }
.section-title, .data-row, .source-row { display:flex; justify-content:space-between; gap:20px; align-items:center; }
.source-list, .data-list { display:grid; gap:10px; }
.source-row, .data-row { padding:18px 20px; background:var(--white); border:1px solid var(--line); border-radius:8px; }
.source-row div, .data-row div { display:grid; gap:3px; }
.source-row span, .data-row span, .empty-state { color:var(--muted); }
.status-chip { padding:7px 10px; border-radius:999px; color:var(--green); background:#ddf5e9; font-size:13px; font-weight:850; }
.status-chip.muted { color:var(--muted); background:#e9edf4; }
.toolbar { display:flex; justify-content:flex-end; margin-bottom:14px; }
.account-actions button { margin:8px 8px 0 0; }
@media (max-width:800px) {
  .auth-view { grid-template-columns:1fr; gap:28px; }
  .auth-view img { width:170px; }
  .dashboard { display:block; }
  .side-nav { position:fixed; inset:0 auto 0 0; z-index:20; width:min(300px,86vw); transform:translateX(-105%); transition:transform .18s ease; }
  .side-nav.open { transform:translateX(0); }
  .topbar { grid-template-columns:auto 1fr auto auto; padding:0 14px; }
  .menu-button { display:block; }
  .main-content { width:min(100% - 28px,1080px); padding-top:28px; }
  .page-head h1 { font-size:38px; }
  .metric-grid { grid-template-columns:1fr; }
  .source-row, .data-row { align-items:flex-start; }
}
@media (prefers-reduced-motion:reduce) { * { scroll-behavior:auto !important; transition:none !important; } }