:root {
  /* Backgrounds */
  --bg:               #FAFAF8;
  --bg-raised:        #F4F2EF;
  --bg-hover:         #F0EDF8;
  --bg-active:        #E8E4F4;
  --bg-focus:         #ECEAFF;
  --surface:          #FFFFFF;

  /* Borders */
  --border:           #E5E1DB;
  --border-strong:    #CCC8C0;

  /* Text */
  --text-1:           #1A1917;
  --text-2:           #68655F;
  --text-3:           #A39F99;

  /* Public pill (blue/indigo) */
  --pill-pub-bg:      #EEF0FF;
  --pill-pub-bd:      #C5CAEE;
  --pill-pub-txt:     #3D3999;
  --pill-pub-dot:     #5B58E0;
  --pill-pub-hover:   #E0E3FF;

  /* Private pill (green/emerald) */
  --pill-priv-bg:     #EDFDF4;
  --pill-priv-bd:     #B8EACE;
  --pill-priv-txt:    #1A5C38;
  --pill-priv-dot:    #23A55A;
  --pill-priv-hover:  #D8F7E8;
  --pill-priv-solid:  #23A55A;

  /* Misc */
  --search-hl:        #FFF176;
  --accent:           #5B58E0;
  --toast-bg:         #1A1917;

  /* Spacing (4px base) */
  --sp-1:  2px;
  --sp-2:  4px;
  --sp-3:  6px;
  --sp-4:  8px;
  --sp-5: 12px;
  --sp-6: 16px;
  --sp-7: 20px;
  --sp-8: 24px;

  /* Typography */
  --font-ui:   'Inter', system-ui, -apple-system, sans-serif;
  --font-mono: 'JetBrains Mono', 'Fira Code', monospace;

  /* Border radius */
  --r-sm:    3px;
  --r-md:    4px;
  --r-inp:   5px;
  --r-lg:    6px;
  --r-sheet: 12px;
}

/* Hide Alpine-controlled elements until Alpine resolves x-show (prevents icon flash) */
[x-cloak] { display: none !important; }

[data-theme="dark"] {
  --bg:               #111110;
  --bg-raised:        #1A1918;
  --bg-hover:         #1E1D2C;
  --bg-active:        #252336;
  --bg-focus:         #1F1F3A;
  --surface:          #161514;
  --border:           #2A2825;
  --border-strong:    #3A3733;
  --text-1:           #EDEAE5;
  --text-2:           #908C85;
  --text-3:           #5A5750;
  --pill-pub-bg:      #1A1B35;
  --pill-pub-bd:      #2E2E6A;
  --pill-pub-txt:     #A5ABEF;
  --pill-pub-dot:     #7B7FE0;
  --pill-pub-hover:   #232458;
  --pill-priv-bg:     #0E2018;
  --pill-priv-bd:     #1A4D2E;
  --pill-priv-txt:    #7FD4A0;
  --pill-priv-dot:    #3DB87A;
  --pill-priv-hover:  #153325;
  --pill-priv-solid:  #3DB87A;
  --search-hl:        rgba(255, 241, 118, 0.20);
  --accent:           #7B7FE0;
  --toast-bg:         #EDEAE5;
}