/* TokenRoc site theme tokens, shared by every public page.
   Light is the default for every visitor and whenever JavaScript is off.
   /theme.js sets data-theme="dark" on <html> before first paint when the
   visitor has chosen Dark; that block keeps the original dark palette.
   Load this file after page styles so it is the single source of colour. */

:root {
  color-scheme: light;

  --ink: #F7F8FB;
  --ink-rgb: 247, 248, 251;
  --surface: #FFFFFF;
  --surface-2: #EEF0F5;
  --surface-glass: rgba(255, 255, 255, .88);
  --header-bg: rgba(247, 248, 251, .88);
  --tint-bg: #EFF1F6;
  --line: #E1E5EE;
  --line-strong: #C9CFDC;
  --field-line: #838DA3;

  --text: #0F1320;
  --text-soft: #2E3444;
  --muted: #555E73;

  --violet: #5B3BD9;
  --violet-label: #5B3BD9;
  --violet-text: #5B3BD9;
  --violet-soft: rgba(91, 59, 217, .08);
  --violet-line: rgba(91, 59, 217, .28);
  --cyan: #0B7069;
  --cyan-hover: #075750;
  --cyan-soft: rgba(11, 112, 105, .07);
  --cyan-line: rgba(11, 112, 105, .28);

  --action: #5A38E0;
  --action-hover: #4A2FC0;
  --action-active: #3F27A8;
  --on-action: #FFFFFF;

  --amber: #8A5A00;
  --amber-mark: #B98010;
  --callout-bg: #FDF6E7;
  --callout-line: rgba(185, 128, 16, .4);
  --callout-text: #3A3526;
  --green: #12703F;
  --green-soft: #EAF6EF;
  --green-line: rgba(18, 112, 63, .3);
  --red: #B42335;
  --red-soft: #FBECEE;
  --red-line: rgba(180, 35, 53, .3);
  --success-text: #12703F;
  --error-text: #9E1F30;

  --code-bg: #F2F4F8;
  --code-text: #1D2233;
  --code-key: #5B2FC2;
  --code-str: #0A6B5E;
  --code-com: #5A6479;
  --code-dot: #C9CFDC;

  --violet-rgb: 91, 59, 217;
  --cyan-rgb: 11, 112, 105;
  --glow: .5;
  --glow-violet: rgba(91, 59, 217, .06);
  --glow-cyan: rgba(11, 112, 105, .05);
  --grid-line: rgba(15, 19, 32, .035);
  --decor-line: rgba(15, 19, 32, .06);
  --decor-edge: rgba(15, 19, 32, .18);
  --card-start: #FFFFFF;
  --card-end: #F9FAFC;
  --hover-fill: rgba(15, 19, 32, .05);
  --shadow: rgba(15, 19, 32, .10);
  --shadow-strong: rgba(15, 19, 32, .18);
}

:root[data-theme="dark"] {
  color-scheme: dark;

  --ink: #0A0C13;
  --ink-rgb: 10, 12, 19;
  --surface: #11141D;
  --surface-2: #161A26;
  --surface-glass: rgba(17, 20, 29, .8);
  --header-bg: rgba(10, 12, 19, .82);
  --tint-bg: rgba(17, 20, 29, .72);
  --line: #252A39;
  --line-strong: #323950;
  --field-line: #5C6479;

  --text: #E8EAF2;
  --text-soft: #C8CDDA;
  --muted: #98A0B3;

  --violet: #7C5CFF;
  --violet-label: #8F74FF;
  --violet-text: #B7A6FF;
  --violet-soft: rgba(124, 92, 255, .14);
  --violet-line: rgba(124, 92, 255, .38);
  --cyan: #3DD6D0;
  --cyan-hover: #7BE0C9;
  --cyan-soft: rgba(61, 214, 208, .08);
  --cyan-line: rgba(61, 214, 208, .28);

  --amber: #F2B441;
  --amber-mark: #F2B441;
  --callout-bg: rgba(242, 180, 65, .06);
  --callout-line: rgba(242, 180, 65, .26);
  --callout-text: #C7CBD6;
  --green: #45D483;
  --green-soft: rgba(69, 212, 131, .08);
  --green-line: rgba(69, 212, 131, .25);
  --red: #FF6B7A;
  --red-soft: rgba(255, 107, 122, .08);
  --red-line: rgba(255, 107, 122, .3);
  --success-text: #A7E9C3;
  --error-text: #FFC1C8;

  --code-bg: #0D1018;
  --code-text: #D8DCEF;
  --code-key: #BDAEFF;
  --code-str: #7BE0C9;
  --code-com: #8792AB;
  --code-dot: #2E3547;

  --violet-rgb: 124, 92, 255;
  --cyan-rgb: 61, 214, 208;
  --glow: 1;
  --glow-violet: rgba(124, 92, 255, .11);
  --glow-cyan: rgba(61, 214, 208, .07);
  --grid-line: rgba(255, 255, 255, .022);
  --decor-line: rgba(255, 255, 255, .05);
  --decor-edge: rgba(232, 234, 242, .22);
  --card-start: rgba(22, 26, 38, .92);
  --card-end: rgba(13, 16, 24, .92);
  --hover-fill: rgba(255, 255, 255, .07);
  --shadow: rgba(0, 0, 0, .45);
  --shadow-strong: rgba(0, 0, 0, .8);
}