/* ── Carbon G100 (dark) + White (light) — Absolute Design Tokens ── */
/*
   Carbon palette reference:
   gray10=#f4f4f4  gray20=#e0e0e0  gray30=#c6c6c6  gray40=#a8a8a8
   gray50=#8d8d8d  gray60=#6f6f6f  gray70=#525252  gray80=#393939
   gray90=#262626  gray100=#161616
   blue10=#edf5ff  blue20=#d0e2ff  blue30=#a6c8ff  blue40=#78a9ff
   blue50=#4589ff  blue60=#0f62fe  blue70=#0043ce  blue80=#002d9c
*/

:root,
[data-theme="dark"] {
  /* ── Carbon G100 backgrounds ── */
  --bg:              #161616;
  --surface:         #262626;
  --card:            rgba(38,38,38,0.65);
  --card-solid:      #262626;
  --nav-bg:          rgba(16,16,20,0.78);

  /* ── Liquid Glass overlays (dark) ── */
  --glass-bg:        linear-gradient(145deg, rgba(255,255,255,0.09), rgba(255,255,255,0.04));
  --glass-border:    rgba(255,255,255,0.13);
  --glass-shadow:    0 8px 32px rgba(0,0,0,0.55), 0 2px 8px rgba(0,0,0,0.35), inset 0 1px 0 rgba(255,255,255,0.14), inset 0 -1px 0 rgba(255,255,255,0.03);
  --glass-shadow-hover: 0 16px 52px rgba(0,0,0,0.52), 0 4px 16px rgba(0,0,0,0.3), inset 0 1px 0 rgba(255,255,255,0.2), 0 0 0 1px rgba(255,255,255,0.05);
  --glass-blur:      blur(22px) saturate(180%);
  --glass-blur-soft: blur(16px) saturate(165%);
  --glass-highlight: linear-gradient(145deg, rgba(255,255,255,0.28), rgba(255,255,255,0.08) 40%, rgba(69,137,255,0.12) 100%);
  --glass-overlay:   radial-gradient(circle at top left, rgba(255,255,255,0.12), transparent 42%);
  --card-radius:     22px;

  /* ── Carbon blue50/blue40 interactive ── */
  --accent:          #4589ff;
  --accent-light:    #78a9ff;
  --accent-hover:    #0f62fe;
  --accent-dim:      rgba(69,137,255,0.15);
  --accent-border:   rgba(69,137,255,0.35);

  /* ── Carbon G100 text ── */
  --text:            #f4f4f4;
  --text-secondary:  #c6c6c6;
  --muted:           #a8a8a8;
  --on-accent:       #ffffff;

  /* ── Carbon G100 borders ── */
  --border:          #393939;
  --border-strong:   #525252;
  --divider:         #262626;

  /* ── Carbon G100 layers ── */
  --layer-01:        #262626;
  --layer-02:        #393939;
  --layer-03:        #525252;

  /* ── Carbon support ── */
  --support-info:    #4589ff;
  --support-success: #42be65;
  --support-warning: #f1c21b;
  --support-error:   #fa4d56;

  /* ── Tag colors (Carbon blue, dark) ── */
  --tag-bg:          rgba(69,137,255,0.2);
  --tag-text:        #78a9ff;

  /* backward-compat aliases */
  --gold:            #4589ff;
  --gold-bright:     #78a9ff;
  --gold-dim:        rgba(69,137,255,0.15);
  --gold-border:     rgba(69,137,255,0.35);
  --subtle:          #c6c6c6;

  --font-heading:    'IBM Plex Sans', sans-serif;
  --font-body:       'IBM Plex Mono', monospace;

  --tracking-tight:  0.01em;
  --tracking-normal: 0.03em;
  --tracking-wide:   0.06em;
  --tracking-wider:  0.1em;

  color-scheme: dark;
}

[data-theme="light"] {
  /* ── Carbon White backgrounds ── */
  --bg:              #e8edf8;
  --surface:         rgba(255,255,255,0.88);
  --card:            rgba(255,255,255,0.62);
  --card-solid:      #ffffff;
  --nav-bg:          rgba(232,237,248,0.78);

  /* ── Liquid Glass overlays (light) ── */
  --glass-bg:        linear-gradient(145deg, rgba(255,255,255,0.68), rgba(255,255,255,0.48));
  --glass-border:    rgba(255,255,255,0.72);
  --glass-shadow:    0 2px 8px rgba(15,50,140,0.07), 0 8px 32px rgba(15,50,140,0.09), inset 0 1px 0 rgba(255,255,255,0.95), inset 0 -1px 0 rgba(0,0,0,0.04);
  --glass-shadow-hover: 0 4px 16px rgba(15,50,140,0.11), 0 18px 52px rgba(15,50,140,0.13), inset 0 1px 0 rgba(255,255,255,1), 0 0 0 1px rgba(255,255,255,0.5);
  --glass-blur:      blur(22px) saturate(190%);
  --glass-blur-soft: blur(16px) saturate(170%);
  --glass-highlight: linear-gradient(145deg, rgba(255,255,255,1) 0%, rgba(255,255,255,0.55) 45%, rgba(15,98,254,0.05) 100%);
  --glass-overlay:   radial-gradient(circle at top left, rgba(255,255,255,0.6), transparent 44%);
  --card-radius:     22px;

  /* ── Carbon blue60/blue70 interactive ── */
  --accent:          #0f62fe;
  --accent-light:    #0043ce;
  --accent-hover:    #0043ce;
  --accent-dim:      rgba(15,98,254,0.1);
  --accent-border:   rgba(15,98,254,0.28);

  /* ── Carbon White text ── */
  --text:            #161616;
  --text-secondary:  #525252;
  --muted:           #525252;
  --on-accent:       #ffffff;

  /* ── Carbon White borders ── */
  --border:          #e0e0e0;
  --border-strong:   #8d8d8d;
  --divider:         #e0e0e0;

  /* ── Carbon White layers ── */
  --layer-01:        #ffffff;
  --layer-02:        #f4f4f4;
  --layer-03:        #e0e0e0;

  /* ── Carbon support ── */
  --support-info:    #0043ce;
  --support-success: #198038;
  --support-warning: #f1c21b;
  --support-error:   #da1e28;

  /* ── Tag colors (Carbon blue, light) ── */
  --tag-bg:          #d0e2ff;
  --tag-text:        #0043ce;

  /* backward-compat aliases */
  --gold:            #0f62fe;
  --gold-bright:     #0043ce;
  --gold-dim:        rgba(15,98,254,0.08);
  --gold-border:     rgba(15,98,254,0.22);
  --subtle:          #525252;

  --font-heading:    'IBM Plex Sans', sans-serif;
  --font-body:       'IBM Plex Mono', monospace;

  --tracking-tight:  0.01em;
  --tracking-normal: 0.03em;
  --tracking-wide:   0.06em;
  --tracking-wider:  0.1em;

  color-scheme: light;
}