/* ==========================================================================
   ZONX PRISM — COLOR TOKENS
   Long-session, low-glare dark system. Matte liquid glass over obsidian.
   No neon, no oversaturation. Muted, ergonomic accents only.
   ========================================================================== */

:root {
  /* --- Brand identity / AI focus --- */
  --brand-main: #FFAA71;        /* Warm Papaya — primary signature, logos, primary UI states */
  --brand-main-hover: #FFC09B;  /* +lightness on hover */
  --brand-main-press: #F09A6A;  /* -lightness on press */
  --brand-main-soft: rgba(255, 170, 113, 0.14);  /* tint fill for selected / hover surfaces */
  --brand-main-glow: rgba(255, 170, 113, 0.30);  /* radial glow / focus aura */
  --brand-on-accent: #1A0E07;   /* near-black text/icon sitting on papaya fills */

  /* --- Base layers (non-translucent) --- */
  --bg-obsidian: #0A0C10;       /* deepest base background */
  --bg-obsidian-raised: #0F1218;/* one step up — non-glass cards on obsidian */
  --bg-void: #06070A;           /* below-obsidian wells, behind glass */

  /* --- Liquid glass surfaces --- */
  --glass-panel: rgba(24, 27, 35, 0.45);   /* core frosted window/panel fill */
  --glass-panel-strong: rgba(24, 27, 35, 0.62); /* denser glass — modals, popovers */
  --glass-panel-soft: rgba(32, 36, 47, 0.32);   /* lighter glass — hover rows, nested */
  --glass-raise: rgba(255, 255, 255, 0.04);  /* additive sheen on top of glass */

  /* --- Glass edges & strokes --- */
  --glass-edge: rgba(255, 255, 255, 0.06);   /* ultra-thin 1px light-catching stroke */
  --glass-edge-strong: rgba(255, 255, 255, 0.10); /* emphasized edge / focus ring base */
  --glass-divider: rgba(255, 255, 255, 0.05); /* hairline separators inside panels */
  --glass-inner-light: rgba(255, 255, 255, 0.08); /* top inner-stroke highlight */
  --glass-inner-shade: rgba(0, 0, 0, 0.30);  /* bottom inner shadow for depth */

  /* --- Typography colors --- */
  --text-primary: #F1F5F9;      /* soft off-white, low glare */
  --text-secondary: #AEB7C7;    /* body secondary */
  --text-muted: #64748B;        /* slate — metadata, timestamps, captions */
  --text-faint: #3E4759;        /* disabled / placeholder */
  --text-on-glass: #E7ECF3;     /* text over heavy blur, slightly brighter for legibility */

  /* --- Multi-user call spectrum (4 balanced muted co-colors) --- */
  --user-blue: #84B0FF;         /* Speaker 1 — Muted Steel Blue */
  --user-mint: #98EBCD;         /* Speaker 2 — Soft Mint Tech (toned down) */
  --user-lavender: #CBB0FF;     /* Speaker 3 — Dusty Lavender */
  --user-rose: #FF84A1;         /* Speaker 4 — Muted Rose */
  --user-blue-soft: rgba(132, 176, 255, 0.16);
  --user-mint-soft: rgba(152, 235, 205, 0.16);
  --user-lavender-soft: rgba(203, 176, 255, 0.16);
  --user-rose-soft: rgba(255, 132, 161, 0.16);

  /* --- Semantic status (muted, ergonomic) --- */
  --status-online: #98EBCD;     /* presence / connected — reuse mint */
  --status-success: #7BD7A8;    /* muted green */
  --status-warning: #F2C879;    /* muted amber */
  --status-danger: #F0879A;     /* muted rose-red */
  --status-info: #84B0FF;       /* muted blue */
  --status-success-soft: rgba(123, 215, 168, 0.14);
  --status-warning-soft: rgba(242, 200, 121, 0.14);
  --status-danger-soft: rgba(240, 135, 154, 0.14);

  /* --- AI agent accent (papaya-leaning, distinct from human) --- */
  --agent-accent: #FFAA71;
  --agent-surface: rgba(255, 170, 113, 0.07);
  --agent-edge: rgba(255, 170, 113, 0.22);

  /* --- Control surfaces (opaque, on obsidian) --- */
  --surface-input: rgba(12, 14, 19, 0.55);
  --surface-input-focus: rgba(16, 19, 25, 0.70);
  --surface-hover: rgba(255, 255, 255, 0.035);
  --surface-active: rgba(255, 255, 255, 0.06);
  --surface-selected: rgba(255, 170, 113, 0.10);

  /* --- Focus --- */
  --focus-ring: rgba(255, 170, 113, 0.55);
  --focus-ring-neutral: rgba(132, 176, 255, 0.50);
}