/* round.online design tokens — colors, type, spacing, motion
   Single source of truth — overrides mdBook's --bg/--fg/--sidebar-bg etc. */

:root {
  /* Brand colors */
  --color-ink:    #15161A;
  --color-paper:  #F5F1E9;
  --color-teal:   #166B63;
  --color-gold:   #A68942;
  --color-gray:   #8a867e;

  --color-border:        #E5DCC8;
  --color-border-strong: #C4B898;

  /* Type families */
  --font-display: 'Fraunces', 'Sarabun', Georgia, serif;
  --font-body:    'Inter', 'Sarabun', -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif;
  --font-mono:    ui-monospace, 'SF Mono', Menlo, Consolas, monospace;

  /* Scale — values in rem assuming mdBook's :root { font-size: 62.5% } (1rem = 10px).
     We keep mdBook's base intact so chrome (menu-bar, sidebar, scrollbar) stays correct,
     and scale our content tokens to absolute pixel sizes via 10px-base rem. */
  --fs-xs:   1.2rem;   /* 12px */
  --fs-sm:   1.4rem;   /* 14px */
  --fs-base: 1.6rem;   /* 16px — same as mdBook body */
  --fs-md:   1.8rem;   /* 18px */
  --fs-lg:   2.2rem;   /* 22px */
  --fs-xl:   2.8rem;   /* 28px */
  --fs-2xl:  3.6rem;   /* 36px */
  --fs-3xl:  4.8rem;   /* 48px */

  --lh-tight: 1.15;
  --lh-snug:  1.35;
  --lh-base:  1.7;     /* slightly looser than round (1.55) — Thai script breathes better */
  --lh-loose: 1.85;

  /* Spacing (8px base, expressed in 10px-base rem) */
  --sp-1: 0.4rem;   /* 4px */
  --sp-2: 0.8rem;   /* 8px */
  --sp-3: 1.2rem;   /* 12px */
  --sp-4: 1.6rem;   /* 16px */
  --sp-5: 2.4rem;   /* 24px */
  --sp-6: 3.2rem;   /* 32px */
  --sp-7: 4.8rem;   /* 48px */
  --sp-8: 6.4rem;   /* 64px */

  /* Reading */
  --container-prose: 70.4rem;   /* 704px — wider than round (608px) for code blocks */

  /* Radii / motion */
  --radius-sm: 0.25rem;
  --radius-md: 0.5rem;
  --ease-out:  cubic-bezier(0.16, 1, 0.3, 1);
  --dur-fast:  150ms;
}

/* LIGHT theme (mdBook .light class) — round.online brand */
.light, html:not(.light):not(.coal):not(.navy):not(.rust):not(.ayu) {
  --bg:                   var(--color-paper);
  --fg:                   var(--color-ink);
  --sidebar-bg:           #EDE7D8;
  --sidebar-fg:           var(--color-ink);
  --sidebar-non-existant: var(--color-gray);
  --sidebar-active:       var(--color-teal);
  --sidebar-spacer:       var(--color-border);
  --scrollbar:            var(--color-border-strong);
  --icons:                var(--color-gray);
  --icons-hover:          var(--color-teal);
  --links:                var(--color-teal);
  --inline-code-color:    #8B3A3A;
  --theme-popup-bg:       var(--color-paper);
  --theme-popup-border:   var(--color-border);
  --theme-hover:          var(--color-border);
  --quote-bg:             #ECE5D2;
  --quote-border:         var(--color-accent, var(--color-teal));
  --table-border-color:   var(--color-border);
  --table-header-bg:      #ECE5D2;
  --table-alternate-bg:   #F0EADD;
  --searchbar-border-color:  var(--color-border-strong);
  --searchbar-bg:         #FBF8EF;
  --searchbar-fg:         var(--color-ink);
  --searchbar-shadow-color: rgba(21, 22, 26, 0.08);
  --searchresults-header-fg: var(--color-gray);
  --searchresults-border-color: var(--color-border);
  --searchresults-li-bg:  #FBF8EF;
  --search-mark-bg:       var(--color-gold);

  /* Code block (mdBook syntax highlight uses these) */
  --code-bg:              var(--color-ink);
  --code-fg:              var(--color-paper);
}

/* DARK theme — inverted round palette
   Applied to mdBook's coal/navy/ayu classes for consistency. */
.coal, .navy, .rust, .ayu {
  --bg:                   #15161A;
  --fg:                   #ECE5D2;
  --sidebar-bg:           #1B1D22;
  --sidebar-fg:           #ECE5D2;
  --sidebar-non-existant: #6F6B62;
  --sidebar-active:       #5BB8A9;
  --sidebar-spacer:       #2A2C32;
  --scrollbar:            #3A3C42;
  --icons:                #8a867e;
  --icons-hover:          #5BB8A9;
  --links:                #5BB8A9;
  --inline-code-color:    #E89A9A;
  --theme-popup-bg:       #1B1D22;
  --theme-popup-border:   #2A2C32;
  --theme-hover:          #2A2C32;
  --quote-bg:             #1B1D22;
  --quote-border:         #5BB8A9;
  --table-border-color:   #2A2C32;
  --table-header-bg:      #1B1D22;
  --table-alternate-bg:   #1F2126;
  --searchbar-border-color: #3A3C42;
  --searchbar-bg:         #1B1D22;
  --searchbar-fg:         #ECE5D2;
  --searchbar-shadow-color: rgba(0, 0, 0, 0.4);
  --searchresults-header-fg: #8a867e;
  --searchresults-border-color: #2A2C32;
  --searchresults-li-bg:  #1B1D22;
  --search-mark-bg:       #C9A75A;

  --code-bg:              #0F1014;
  --code-fg:              #ECE5D2;
}