/* Paper & Slate — hybrid theme tokens */

[data-theme="paper"] {
  --bg:          #F1EFE7;
  --surface:     #FFFDF8;
  --raised:      #EAE7DB;
  --text:        #25261E;
  --muted:       #69695A;

  --accent:      #4F6B47;
  --accent-soft: #E3EBDD;
  --accent-ink:  #3A5236;

  --pop:         #B6893F;
  --pop-soft:    #F2E6CF;
  --pop-ink:     #8A6224;

  --divider:     rgba(37, 38, 30, .13);
  --elevation:   0 12px 34px rgba(35, 32, 20, .10);

  --font-serif:  "Spectral", Georgia, serif;
  --font-sans:   "Figtree", system-ui, -apple-system, sans-serif;
}

[data-theme="slate"] {
  --bg:          #131922;
  --surface:     #1B232E;
  --raised:      #222C39;
  --text:        #E7ECF3;
  --muted:       #93A0B1;

  --accent:      #7FB2EA;
  --accent-soft: rgba(127, 178, 234, .16);
  --accent-ink:  #BCD7F6;

  --pop:         #5FCFC0;
  --pop-soft:    rgba(95, 207, 192, .16);
  --pop-ink:     #9FE4DA;

  --divider:     rgba(255, 255, 255, .10);
  --elevation:   0 12px 34px rgba(0, 0, 0, .28);

  --font-serif:  "Spectral", Georgia, serif;
  --font-sans:   "Figtree", system-ui, -apple-system, sans-serif;
}

/* Themed focus ring — never the browser default */
:where(a, button, input, [tabindex]):focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}