/* Rios Asset — tokens do Design System (cópia de _ds/colors_and_type.css).
   Fontes carregadas via <link> em paginas/_site_css.html; base do body em site.css. */
/* ============================================================
   Rios Asset — ERP Design System — TOKENS + BASE (v3)
   ============================================================ */

:root {
  --rios-navy:#0E2148; --rios-navy-deep:#081535; --rios-navy-soft:#1A2E5C;
  --rios-gold:#C9B17A; --rios-gold-warm:#B89A5E; --rios-gold-soft:#E8DCC0; --gold-light:#DDC58E;
  --rios-teal:#2E8A99; --rios-teal-deep:#1F6573; --rios-teal-soft:#B8D6DC;
  --gray-0:#FFFFFF; --gray-50:#F7F8FA; --gray-100:#EEF1F5; --gray-150:#E2E7EE;
  --gray-200:#CDD4DE; --gray-300:#A8B1BF; --gray-400:#818B9C; --gray-500:#5C6678;
  --gray-600:#3F485A; --gray-700:#2A3142; --gray-800:#1A1F2E; --gray-900:#0F1320;
  --pos:#2F8F5F; --pos-bg:#E6F2EC; --pos-border:#BFE0CE;
  --neg:#C0394A; --neg-hover:#A82E3D; --neg-bg:#FAE6E9; --neg-border:#EFC2C8;
  --warn:#B8740E; --warn-bg:#FBF1DE; --warn-border:#ECD5A0;
  --info:#2E6BB8; --info-bg:#E5EEF8; --info-border:#BFD3EE;
  --neutral-bg:var(--gray-100);
  --bg-app:var(--gray-50); --bg-surface:var(--gray-0); --bg-elevated:var(--gray-0);
  --bg-sunken:var(--gray-100); --bg-sidebar:var(--rios-navy-deep); --bg-topbar:var(--gray-0);
  --bg-overlay:rgba(15, 19, 32, 0.48);
  --fg-1:var(--gray-700); --fg-2:var(--gray-500); --fg-3:var(--gray-400); --fg-disabled:var(--gray-300);
  --fg-inverse:var(--gray-0); --fg-on-navy:var(--gray-0);
  --fg-on-navy-2:rgba(255,255,255,0.68); --fg-on-navy-3:rgba(255,255,255,0.42);
  --fg-link:var(--rios-teal); --fg-link-hover:var(--rios-teal-deep);
  --border-subtle:var(--gray-150); --border-default:var(--gray-200); --border-strong:var(--gray-300);
  --border-focus:var(--rios-teal); --border-on-navy:rgba(201,177,122,0.24);
  --accent:var(--rios-gold); --accent-hover:var(--rios-gold-warm); --accent-bg:var(--rios-gold-soft);
  --font-sans:'Space Grotesk','Helvetica Neue',Arial,sans-serif;
  --font-serif:'Fraunces','Times New Roman',Georgia,serif;
  --font-mono:'JetBrains Mono','SF Mono',Menlo,Consolas,monospace;
  --font-tabular:'Space Grotesk',sans-serif;
  --text-2xs:10px; --text-xs:11px; --text-sm:12px; --text-base:13px; --text-md:14px;
  --text-lg:16px; --text-xl:18px; --text-2xl:22px; --text-3xl:28px; --text-4xl:36px; --text-5xl:48px;
  --fw-regular:400; /* @kind other */
  --fw-medium:500; /* @kind other */
  --fw-semibold:600; /* @kind other */
  --fw-bold:700; /* @kind other */
  --lh-tight:1.15; /* @kind other */
  --lh-snug:1.30; /* @kind other */
  --lh-normal:1.45; /* @kind other */
  --lh-relaxed:1.60; /* @kind other */
  --ls-tight:-0.01em; /* @kind other */
  --ls-normal:0; /* @kind other */
  --ls-wide:0.04em; /* @kind other */
  --ls-wider:0.08em; /* @kind other */
  --chart-1:#0E2148; --chart-2:#C9B17A; --chart-3:#2E8A99; --chart-4:#6B4F8F; --chart-5:#8A6A3E; --chart-6:#5C6678;
  --chart-pos:var(--pos); --chart-pos-soft:rgba(47,143,95,0.18);
  --chart-neg:var(--neg); --chart-neg-soft:rgba(192,57,74,0.18);
  --chart-portfolio:var(--rios-navy); --chart-benchmark:var(--rios-gold-warm);
  --chart-axis:var(--gray-300); --chart-axis-label:var(--gray-500);
  --chart-grid:var(--gray-150); --chart-grid-soft:var(--gray-100); --chart-crosshair:var(--gray-400);
  --chart-tooltip-bg:var(--rios-navy-deep); --chart-tooltip-fg:var(--gray-0); --chart-tooltip-border:var(--rios-navy-soft);
  --chart-heat-neg-3:#8C2231; --chart-heat-neg-2:#C0394A; --chart-heat-neg-1:#E8A6AE;
  --chart-heat-zero:#ECEFF3; --chart-heat-pos-1:#A8D6BE; --chart-heat-pos-2:#2F8F5F; --chart-heat-pos-3:#1B6240;
  --chart-spark:var(--gray-500); --chart-spark-pos:var(--pos); --chart-spark-neg:var(--neg);
  --chart-drawdown:var(--neg); --chart-drawdown-fill:var(--chart-neg-soft);
  --chart-line-w:1.5px; --chart-line-w-bold:2px; --chart-line-w-thin:1px;
  --sp-0:0; /* @kind spacing */
  --sp-1:2px; --sp-2:4px; --sp-3:8px; --sp-4:12px; --sp-5:16px; --sp-6:20px;
  --sp-7:24px; --sp-8:32px; --sp-9:40px; --sp-10:48px; --sp-12:64px; --sp-16:96px;
  --radius-xs:2px; --radius-sm:3px; --radius-md:4px; --radius-lg:6px; --radius-pill:999px;
  --shadow-xs:0 1px 0 rgba(15,19,32,0.04);
  --shadow-sm:0 1px 2px rgba(15,19,32,0.06),0 1px 1px rgba(15,19,32,0.04);
  --shadow-md:0 2px 6px rgba(15,19,32,0.08),0 1px 2px rgba(15,19,32,0.04);
  --shadow-lg:0 8px 24px rgba(15,19,32,0.12),0 2px 6px rgba(15,19,32,0.06);
  --shadow-xl:0 16px 40px rgba(15,19,32,0.18);
  --shadow-focus:0 0 0 3px rgba(46,138,153,0.22);
  --shadow-inset-input:inset 0 1px 2px rgba(15,19,32,0.04);
  --sidebar-w:232px; --sidebar-w-collapsed:56px; --topbar-h:52px;
  --row-h-compact:32px; --row-h-default:40px; --row-h-comfortable:48px;
  --ease-standard:cubic-bezier(0.2,0.0,0.0,1.0); /* @kind other */
  --ease-emphasized:cubic-bezier(0.3,0.0,0.0,1.0); /* @kind other */
  --dur-fast:120ms; /* @kind other */
  --dur-base:180ms; /* @kind other */
  --dur-slow:280ms; /* @kind other */
  --control-h-sm:28px; --control-h-md:32px; --control-h-lg:40px; --input-h:34px;
  --pagenav-w:256px; --pagenav-w-compact:220px; --drawer-w:420px;
  --z-sticky:20; /* @kind other */
  --z-dropdown:40; /* @kind other */
  --z-drawer:80; /* @kind other */
  --z-toast:100; /* @kind other */
}

[data-theme="dark"] {
  --bg-app:#0A1024; --bg-surface:#121A36; --bg-elevated:#172248; --bg-sunken:#0E1530;
  --bg-sidebar:#060B1C; --bg-topbar:#121A36; --bg-overlay:rgba(4,7,18,0.62);
  --fg-1:#E6E9F2; --fg-2:#9AA3B5; --fg-3:#6F7892; --fg-disabled:#4A5168;
  --fg-inverse:var(--gray-900); --fg-on-navy:var(--gray-0);
  --fg-on-navy-2:rgba(255,255,255,0.68); --fg-on-navy-3:rgba(255,255,255,0.42);
  --fg-link:#5BBFD0; --fg-link-hover:#7FCFDD;
  --border-subtle:rgba(255,255,255,0.06); --border-default:rgba(255,255,255,0.10);
  --border-strong:rgba(255,255,255,0.18); --border-focus:#5BBFD0; --border-on-navy:rgba(201,177,122,0.28);
  --accent:var(--rios-gold); --accent-hover:#D8C28F; --accent-bg:rgba(201,177,122,0.10);
  --pos:#5BC48A; --pos-bg:rgba(91,196,138,0.12); --pos-border:rgba(91,196,138,0.30);
  --neg:#E2697A; --neg-hover:#C8505F; --neg-bg:rgba(226,105,122,0.12); --neg-border:rgba(226,105,122,0.32);
  --warn:#E0B25A; --warn-bg:rgba(224,178,90,0.12); --warn-border:rgba(224,178,90,0.32);
  --info:#6FA6E8; --info-bg:rgba(111,166,232,0.12); --info-border:rgba(111,166,232,0.32);
  --neutral-bg:var(--bg-sunken);
  --chart-1:#D4BC8A; --chart-2:#5BBFD0; --chart-3:#9B8AC4; --chart-4:#C99A6B; --chart-5:#7FCFDD; --chart-6:#9AA3B5;
  --chart-pos:var(--pos); --chart-pos-soft:rgba(91,196,138,0.18);
  --chart-neg:var(--neg); --chart-neg-soft:rgba(226,105,122,0.18);
  --chart-portfolio:#D4BC8A; --chart-benchmark:#5BBFD0;
  --chart-axis:rgba(255,255,255,0.20); --chart-axis-label:rgba(255,255,255,0.55);
  --chart-grid:rgba(255,255,255,0.06); --chart-grid-soft:rgba(255,255,255,0.03); --chart-crosshair:rgba(255,255,255,0.32);
  --chart-tooltip-bg:#060B1C; --chart-tooltip-fg:var(--gray-0); --chart-tooltip-border:rgba(255,255,255,0.14);
  --chart-heat-neg-3:#7A1F2C; --chart-heat-neg-2:#B83A4B; --chart-heat-neg-1:#6B2A35;
  --chart-heat-zero:#1A2546; --chart-heat-pos-1:#1F4E3A; --chart-heat-pos-2:#3FA56E; --chart-heat-pos-3:#5BC48A;
  --chart-spark:rgba(255,255,255,0.55);
  --chart-drawdown:var(--neg); --chart-drawdown-fill:rgba(226,105,122,0.18);
  --shadow-xs:0 1px 0 rgba(0,0,0,0.40);
  --shadow-sm:0 1px 2px rgba(0,0,0,0.50),0 1px 1px rgba(0,0,0,0.35);
  --shadow-md:0 2px 6px rgba(0,0,0,0.55),0 1px 2px rgba(0,0,0,0.40);
  --shadow-lg:0 8px 24px rgba(0,0,0,0.62),0 2px 6px rgba(0,0,0,0.45);
  --shadow-xl:0 16px 40px rgba(0,0,0,0.70);
  --shadow-focus:0 0 0 3px rgba(91,191,208,0.32);
  --shadow-inset-input:inset 0 1px 2px rgba(0,0,0,0.30);
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]):not([data-theme="dark"]) { color-scheme: dark; }
}

/* ---- BASE ---- */

.t-display { font-family: var(--font-serif); font-size: var(--text-4xl); font-weight: var(--fw-medium); line-height: var(--lh-tight); letter-spacing: var(--ls-tight); color: var(--fg-1); }
.t-h1 { font-family: var(--font-sans); font-size: var(--text-2xl); font-weight: var(--fw-semibold); line-height: var(--lh-tight); letter-spacing: var(--ls-tight); color: var(--fg-1); }
.t-h2 { font-family: var(--font-sans); font-size: var(--text-xl); font-weight: var(--fw-semibold); line-height: var(--lh-snug); color: var(--fg-1); }
.t-h3 { font-family: var(--font-sans); font-size: var(--text-lg); font-weight: var(--fw-semibold); line-height: var(--lh-snug); color: var(--fg-1); }
.t-section-label { font-family: var(--font-sans); font-size: var(--text-2xs); font-weight: var(--fw-semibold); line-height: var(--lh-tight); letter-spacing: var(--ls-wider); text-transform: uppercase; color: var(--fg-2); }
.t-body { font-family: var(--font-sans); font-size: var(--text-base); font-weight: var(--fw-regular); line-height: var(--lh-normal); color: var(--fg-1); }
.t-body-md { font-family: var(--font-sans); font-size: var(--text-md); font-weight: var(--fw-regular); line-height: var(--lh-normal); color: var(--fg-1); }
.t-caption { font-family: var(--font-sans); font-size: var(--text-xs); font-weight: var(--fw-regular); line-height: var(--lh-snug); color: var(--fg-2); }
.t-meta { font-family: var(--font-sans); font-size: var(--text-xs); font-weight: var(--fw-regular); line-height: var(--lh-snug); color: var(--fg-3); }
.t-mono, .t-num { font-family: var(--font-mono); font-variant-numeric: tabular-nums; font-feature-settings: 'tnum' 1; }
.t-num-tabular { font-family: var(--font-sans); font-variant-numeric: tabular-nums; font-feature-settings: 'tnum' 1, 'cv11' 1; }
.t-kpi { font-family: var(--font-sans); font-size: var(--text-3xl); font-weight: var(--fw-semibold); line-height: var(--lh-tight); letter-spacing: var(--ls-tight); font-variant-numeric: tabular-nums; font-feature-settings: 'tnum' 1; color: var(--fg-1); }
.t-ticker { font-family: var(--font-mono); font-size: var(--text-sm); font-weight: var(--fw-semibold); letter-spacing: var(--ls-wide); text-transform: uppercase; }
.fg-pos{color:var(--pos)} .fg-neg{color:var(--neg)} .fg-warn{color:var(--warn)} .fg-info{color:var(--info)}
.fg-muted{color:var(--fg-2)} .fg-faint{color:var(--fg-3)} .fg-gold{color:var(--rios-gold-warm)} .fg-teal{color:var(--rios-teal)} .fg-navy{color:var(--rios-navy)}
.t-greeting { font-family: var(--font-serif); font-size: var(--text-2xl); font-weight: var(--fw-regular); line-height: var(--lh-tight); letter-spacing: var(--ls-tight); color: var(--fg-1); }