/* ═══════════════════════════════════════════════════════════════
   NOX DESIGN SYSTEM — TOKENS, THEMES & RESET
   (Extracted verbatim from monolith, lines 10–137)
   ═══════════════════════════════════════════════════════════════ */
/* === TRADING HIDDEN — FEATURE UPDATE === */
.btn-buy, .btn-sell, .post-trade-btn, .reel-trade-bar, .token-trade-panel, .trade-hidden { display: none !important; }
/* ═══════════════════════════════════════════════════════════════
   NOX DESIGN SYSTEM — CSS VARIABLES & RESET
   ═══════════════════════════════════════════════════════════════ */
:root {
  /* Shared tokens — Institutional */
  --accent: #00C472;
  --accent-hover: #00D97F;
  --accent-dim: rgba(0,196,114,.07);
  --accent-border: rgba(0,196,114,.18);
  --red: #C44040;
  --red-dim: rgba(196,64,64,.07);
  --red-border: rgba(196,64,64,.18);
  --green: #00A86B;
  --green-dim: rgba(0,168,107,.07);
  --gold: #BFA24E;
  --silver: #8A919A;
  --bronze: #8E6A3A;
  --blue: #3D7FC4;
  --blue-dim: rgba(61,127,196,.07);
  --purple: #6B5CAE;
  --purple-dim: rgba(107,92,174,.07);
  --orange: #C47D2A;
  --font: 'IBM Plex Sans', -apple-system, BlinkMacSystemFont, sans-serif;
  --mono: 'IBM Plex Mono', 'Menlo', monospace;
  --radius-s: 3px;
  --radius: 6px;
  --radius-l: 8px;
  --radius-xl: 9999px;
  --shadow-sm: 0 1px 4px rgba(0,0,0,.1);
  --shadow: 0 4px 16px rgba(0,0,0,.15);
  --shadow-lg: 0 8px 32px rgba(0,0,0,.2);
  --transition: .15s ease;
  --sidebar-w: 210px;
  --right-w: 240px;
  --header-h: 56px;
  --ticker-h: 32px;
  --top-offset: 88px;
}

/* ═══ BLACK THEME — Institutional Terminal ═══ */
[data-theme="black"], :root {
  --bg-0: #060808;
  --bg-1: #080A0A;
  --bg-2: #0A0D0C;
  --bg-3: #111514;
  --bg-4: #171C1A;
  --bg-5: #222927;
  --bg-hover: rgba(0,196,114,.03);
  --border: rgba(255,255,255,.06);
  --border-hover: rgba(255,255,255,.10);
  --border-active: rgba(0,196,114,.15);
  --text-0: #E0E4E2;
  --text-1: #C4CAC7;
  --text-2: #8A938F;        /* P65.276 — was #6B7572.  Bumped one tier for readability. */
  --text-3: #6A7570;        /* P65.276 — was #4A5552.  Brighter so faint hints are still readable. */
  --text-4: rgba(255,255,255,.42);  /* P65.276 — was .12.  Now actually visible. */
}

/* ═══ DIM THEME — Institutional Dark ═══ */
[data-theme="dim"] {
  --bg-0: #0C100F;
  --bg-1: #0C100F;
  --bg-2: #0F1412;
  --bg-3: #151A18;
  --bg-4: #1C2220;
  --bg-5: #2A3230;
  --bg-hover: rgba(0,196,114,.03);
  --border: rgba(255,255,255,.07);
  --border-hover: rgba(255,255,255,.12);
  --border-active: rgba(0,196,114,.15);
  --text-0: #E0E4E2;
  --text-1: #C4CAC7;
  --text-2: #98A29F;        /* P65.276 — was #7A8582.  Bumped for readability. */
  --text-3: #79847F;        /* P65.276 — was #5A6562.  Brighter for legibility. */
  --text-4: rgba(255,255,255,.42);  /* P65.276 — was .12.  Now actually visible. */
}

/* ═══ WHITE THEME — Institutional Light ═══ */
[data-theme="white"] {
  --bg-0: #F5F7F6;
  --bg-1: #F5F7F6;
  --bg-2: #FFFFFF;
  --bg-3: #EDF0EE;
  --bg-4: #E3E8E5;
  --bg-5: #D5DCD8;
  --bg-hover: rgba(0,196,114,.03);
  --border: rgba(0,20,10,.07);
  --border-hover: rgba(0,20,10,.13);
  --border-active: rgba(0,196,114,.18);
  --text-0: #0A0F0C;
  --text-1: #1A221E;
  --text-2: #3A4540;        /* P65.276 — was #4A5550.  Bumped for readability on light bg. */
  --text-3: #5A6560;        /* P65.276 — was #7A8580.  Darker so faint hints are readable. */
  --text-4: rgba(0,0,0,.42); /* P65.276 — was .10.  Now actually visible. */
  --shadow-sm: 0 1px 3px rgba(0,20,10,.05);
  --shadow: 0 2px 10px rgba(0,20,10,.07);
  --shadow-lg: 0 6px 24px rgba(0,20,10,.09);
  --accent-dim: rgba(0,196,114,.05);
  --red-dim: rgba(196,64,64,.05);
  --green-dim: rgba(0,168,107,.05);
  --blue-dim: rgba(0,196,114,.05);
  --purple-dim: rgba(107,92,174,.05);
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { height: 100%; scroll-behavior: smooth; }
body {
  font-family: var(--font); background: var(--bg-0); color: var(--text-1);
  min-height: 100%; -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale; line-height: 1.55; font-size: 14px;
  overflow-x: hidden; text-rendering: optimizeLegibility;
}
a { color: inherit; text-decoration: none; }
button { font-family: inherit; cursor: pointer; border: none; background: none; color: inherit; }
input, textarea, select { font-family: inherit; color: inherit; }
img { max-width: 100%; display: block; }
::-webkit-scrollbar { width: 0px; height: 0px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: transparent; }
::-webkit-scrollbar-thumb:hover { background: transparent; }
html { scrollbar-width: none; }
[data-theme="white"] ::selection { background: rgba(0,196,114,.2); color: #0f1419; }
[data-theme="white"] ::-webkit-scrollbar-thumb { background: rgba(0,0,0,.1); }
::selection { background: rgba(0,196,114,.25); color: #fff; }
[data-theme="white"] ::selection { background: rgba(0,196,114,.2); color: #0f1419; }