/* User-supplied variable font: wght axis 100–700, verified from font metadata. */
@font-face {
  font-family: "OPPO Sans 4.0";
  src: url("assets/fonts/OPPOSans4.0-VF.ttf") format("truetype");
  font-style: normal;
  font-weight: 100 700;
  font-display: swap;
}
/* Exact design.md tokens. No Tailwind build is used by this static app. */
:root {
  color-scheme: light;
  --canvas: #fff;
  --brand: color(srgb 0.9567307829856873 0.4113942086696625 0.11775136739015579);
  --card-frame: color(srgb 0.8999999761581421 0.8999999761581421 0.8999999761581421);
  --surface-light: color(srgb 0.9529411792755127 0.9529411792755127 0.9529411792755127);
  --border-card: color(srgb 0.9234510064125061 0.9240784049034119 0.9269019365310669);
  --border-sidebar: color(srgb 0.8915894627571106 0.8871116638183594 0.9134615659713745);
  --border-top: color(srgb 0.9300000071525574 0.9300000071525574 0.9300000071525574);
  --input-surface: color(srgb 0.9764705896377563 0.9764705896377563 0.9764705896377563);
  --border-input: color(srgb 0.9003921747207642 0.8896862864494324 0.8839215636253357);
  --text-primary: color(srgb 0.08176115155220032 0.09704501926898956 0.18365360796451569);
  --text-secondary: color(srgb 0.41960784792900085 0.4470588266849518 0.501960813999176);
  --text-email: color(srgb 0.31105881929397583 0.3167058825492859 0.34211763739585876);
  --text-placeholder: color(srgb 0.6431372761726379 0.6509804129600525 0.6823529601097107);
  --text-disabled: color(srgb 0.5248627662658691 0.5102823972702026 0.5024313926696777);
  --button-disabled: color(srgb 0.9601568579673767 0.955874502658844 0.9535686373710632);
  --button-outline: color(srgb 0.9661176204681396 0.6853176355361938 0.5341176390647888);
  --button-outline-text: color(srgb 0.7814117670059204 0.4616117477416992 0.2894117534160614);
  --success: color(srgb 0.08627451211214066 0.6392157077789307 0.29019609093666077);
  --success-soft: color(srgb 0.9269019365310669 0.9711372256278992 0.9432156682014465);
  --warning: color(srgb 0.8509804010391235 0.46666666865348816 0.0235294122248888);
  --warning-soft: color(srgb 0.9880784153938293 0.9573333263397217 0.9218823313713074);
  --info: color(srgb 0.14509804546833038 0.38823530077934265 0.9215686321258545);
  --info-soft: color(srgb 0.9316078424453735 0.9510588049888611 0.9937254786491394);
  --purple: color(srgb 0.45490196347236633 0.3529411852359772 0.9529411792755127);
  --purple-soft: color(srgb 0.9563921689987183 0.948235273361206 0.9962353110313416);
  --grey-soft: color(srgb 0.932479977607727 0.932479977607727 0.9399999976158142);
  --nav-marker: color(srgb 1 0.791249692440033 0.6788459420204163 / 0.5799999833106995);
  --option-border: color(srgb 0.891346275806427 0.8827756643295288 0.8827756643295288);
  --option-selected: color(srgb 0.949999988079071 0.949999988079071 0.949999988079071);
  --option-selected-border: color(srgb 0.16057689487934113 0.15285685658454895 0.15285685658454895);
  --option-letter: color(srgb 0.9300000071525574 0.9300000071525574 0.9300000071525574);
  --toggle-off: color(srgb 0.6980392336845398 0.7019608020782471 0.7529411911964417);
  --tooltip-surface: color(srgb 0.21250000596046448 0.21250000596046448 0.21250000596046448);
  --chart-line: color(srgb 0.8682692646980286 0.36630114912986755 0.09601054340600967);
  --font-app: "OPPO Sans 4.0", Arial, sans-serif;
  --text-body-size: 14px;
  --text-body-leading: 20px;
  --text-title-size: 16px;
  --text-title-leading: 24px;
  --text-section-size: 16px;
  --text-section-leading: 20px;
  --text-kpi-size: 28px;
  --text-kpi-leading: 28px;
  --text-meta-size: 12px;
  --text-meta-leading: 18px;
  --text-badge-size: 11px;
  --radius-shell: 0px;
  --radius-card: 12px;
  --radius-well: 10px;
  --radius-input: 8px;
  --radius-button: 10px;
  --radius-badge: 6px;
  --radius-reasoning: 24px;
  --sidebar-width: 220px;
  --sidebar-height: 968px;
  --topbar-height: 48px;
  --shadow-nav-selected: inset 0 4px 10px 0 rgb(255 255 255 / .25);
  /* Dashboard frame 1:1258 geometry from design.md, sections 5–6. */
  --space-4: 4px;
  --space-6: 6px;
  --space-8: 8px;
  --space-12: 12px;
  --space-14: 14px;
  --space-15: 15px;
  --space-16: 16px;
  --space-19: 19px;
  --space-24: 24px;
  --space-25: 25px;
  --space-28: 28px;
  --overview-reasoning-offset: -1px;
  --overview-panels-offset: 4px;
  --panel-grid: minmax(0,614fr) minmax(0,544fr);
  /* Native exported card backgrounds: asset role mapping in figma/manifest.json. */
  --reasoning-image-numerical: url("/assets/figma/images/image-14.jpg");
  --reasoning-image-logical: url("/assets/figma/images/image-14-1.jpg");
  --reasoning-image-diagrammatic: url("/assets/figma/images/image-14-2.jpg");
  --reasoning-height: 194px;
  --reasoning-icon-size: 64px;
  --reasoning-title-size: 24px;
  --reasoning-count-size: 16px;
  --reasoning-count-leading: 20px;
  --on-accent: #fff;
  --on-accent-muted: rgb(255 255 255 / .7);
  /* Compatibility aliases for current pages, pending their later overhaul. */
  --ink: var(--text-primary);
  --muted: var(--text-secondary);
  --green: var(--brand);
  --accent: var(--brand);
  --accent-light: var(--warning-soft);
  --line: var(--border-card);
  --paper: var(--canvas);
  --mint: var(--success-soft);
}
body { background: var(--canvas); color: var(--text-primary); font-family: var(--font-app); font-size: var(--text-body-size); font-weight: 400; line-height: var(--text-body-leading); letter-spacing: 0; }