/* ============================================================
   VEGA OLEFINS DESK  ·  shared design system
   House standard: Fraunces (display) / Inter (body) / IBM Plex Mono (data)
   Dark teal-and-brass, dark default with light toggle.
   Every page links this file so the look is defined in one place.
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,400;9..144,500;9..144,600;9..144,700&family=Inter:wght@400;500;600&family=IBM+Plex+Mono:wght@400;500;600&display=swap');

:root{
  /* --- surfaces --- */
  --v-bg:#11191e; --v-panel:#16232b; --v-panel2:#1b2d36;
  --v-card:#16232b; --v-card-hi:#1b2d36;
  --v-line:#2a3f4a; --v-line-soft:#22343e;
  /* --- ink --- */
  --v-ink:#e9e1d0; --v-ink-soft:#a9b4ba; --v-ink-faint:#6f7e87;
  /* --- brass accent (primary action, sparingly) --- */
  --v-brass:#cb9a4e; --v-brass-soft:#a37e3f; --v-brass-dim:rgba(203,154,78,.14);
  /* --- semantic --- */
  --v-good:#79d8c6; --v-warn:#e0a24a; --v-bad:#e08585;
  /* --- olefin / product hues (consistent across all consoles) --- */
  --v-c2:#5BC8E0;   /* ethylene  */
  --v-c3:#9D8DF1;   /* propylene */
  --v-c4:#F2865E;   /* butadiene / C4 */
  --v-b1:#6FCF97;   /* butene-1  */
  --v-raff:#E7C45A; /* raffinate / mixed C4 */
  --v-vcm:#E06FA0;  /* vcm */
  --v-feed:#8CA0AB; /* feedstock / ethane / fuel gas */
  /* --- extended process-slate hues (terminal) --- */
  --v-arom:#D98C6A; --v-gaso:#6FA8D0; --v-dist:#5E86A0; --v-oth:#41525b;
  /* --- misc --- */
  --v-shadow:rgba(0,0,0,.5); --v-radius:12px;
  --font-disp:'Fraunces',Georgia,'Times New Roman',serif;
  --font-body:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif;
  --font-mono:'IBM Plex Mono',ui-monospace,Menlo,Consolas,monospace;
}

[data-theme="light"]{
  --v-bg:#f3ecdd; --v-panel:#faf4e8; --v-panel2:#efe6d4;
  --v-card:#fbf6ec; --v-card-hi:#f2ead9;
  --v-line:#ddd0b8; --v-line-soft:#e6dcc8;
  --v-ink:#23303a; --v-ink-soft:#51616b; --v-ink-faint:#8a95a0;
  --v-brass:#9a6f1c; --v-brass-soft:#b1852f; --v-brass-dim:rgba(154,111,28,.12);
  --v-good:#1f9d7a; --v-warn:#b07a1c; --v-bad:#bd4a3a;
  --v-c2:#1f8fb0; --v-c3:#6a52c4; --v-c4:#c85a34; --v-b1:#2f9d5f;
  --v-raff:#a97f16; --v-vcm:#b64c86; --v-feed:#5f7480;
  --v-arom:#b8724a; --v-gaso:#3f7aa6; --v-dist:#3d5c74; --v-oth:#9aa7ad;
  --v-shadow:rgba(70,60,35,.12);
}

html{ background:var(--v-bg); }
::selection{ background:var(--v-brass-dim); }

/* --- shared theme toggle button --- */
.vega-toggle{
  display:inline-flex;align-items:center;justify-content:center;
  width:34px;height:34px;cursor:pointer;color:var(--v-ink-soft);
  background:var(--v-panel);border:1px solid var(--v-line);border-radius:8px;
  transition:color .15s,border-color .15s,background .15s;padding:0;
}
.vega-toggle:hover{ color:var(--v-brass);border-color:var(--v-brass-soft); }
.vega-toggle svg{ width:17px;height:17px; }
.vega-toggle .moon{ display:none; }
.vega-toggle .sun{ display:inline; }
[data-theme="light"] .vega-toggle .sun{ display:none; }
[data-theme="light"] .vega-toggle .moon{ display:inline; }

/* --- shared back-to-desk link --- */
.vega-backlink{
  position:fixed;left:14px;bottom:14px;z-index:9999;text-decoration:none;
  font-family:var(--font-mono);font-size:11px;letter-spacing:.14em;
  color:var(--v-brass);background:color-mix(in srgb,var(--v-panel) 88%,transparent);
  border:1px solid var(--v-line);border-radius:8px;padding:6px 12px;
  backdrop-filter:blur(5px);transition:color .15s,border-color .15s;
}
.vega-backlink:hover{ color:var(--v-ink);border-color:var(--v-brass-soft); }