/* Selectable code syntax themes. One choice drives BOTH the documentation's
   server-rendered RDoc tokens (.ruby-*, see docs_prose.css) and the
   playground editor's tokens (.hljs-*), through the --code-* custom
   properties set on <html data-code-theme>.

   Fingerprinted and cached rather than inlined in shared/_code_theme: the
   block is fully static, so inlining re-sent ~3.9KB in every document and
   again on every Turbo navigation. The <link> is emitted from that partial.
   Nothing here overrides a Tailwind utility, so unlike signature.css (see its
   header) the load order is not load-bearing.

   Every palette answers to two selectors. The attribute form paints the page;
   the .cs-* class form lets a UI element carry a palette that is NOT the one
   the page is using — which is what the settings panel's preview
   swatches need. Before this, the swatch colours were a second copy of all 28
   values living in shared/scripts/code_theme.js, and since the swatches are
   wordless they are the only on-screen identification of a theme: a drift
   there would have advertised one palette while the page painted another,
   with nothing looking broken. */

/* The Ruby pair, and what `auto` resolves to (since 2026-10-09). One hue per
   kind of token, in a Tokyo Night style set: red keywords (the site's accent,
   so code and chrome share one red), cyan operators, green strings, gold
   constants, orange numbers and symbols, blue call names, purple @ivars. The
   two-hue Signature pair below read as far too bland, and Auto is what every
   reader who never opens the settings sees.

   Day is not Night on a light ground: every Night color measures 1.1-3.4:1
   on #FBF8F9, below AA. So Day keeps each token's hue and takes a darker
   shade of it, the way the site's --accent darkens from #FF5C79 to #C40F3F
   in light mode.

   Grounds are the house code grounds, which the settings panel's Auto chip
   paints: #FBF8F9 is a half-step off --paper so a code block still separates
   from the page it sits on, and #0F0E14 is the dark code ground the design
   already named. Measured before being written down. Day on #FBF8F9: text
   10.6:1, keyword 5.71, operator 5.23, string 5.53, regexp 5.30, constant
   5.62, number 5.20, call 6.08, @ivar 5.93, comment 5.16, and every one 4.8
   or more on #F5EFF0, the search and tooltip ground. Night on #0F0E14: text
   13.6, keyword 6.46, operator 12.7, string 10.5, regexp 16.3, constant 9.6,
   number 9.4, call 7.6, @ivar 8.3, comment 5.4. */
html[data-code-theme="ruby-day"], .cs-ruby-day {
  --code-bg:#FBF8F9; --code-bg-soft:#F5EFF0; --code-fg:#343A55;
  --code-keyword:#C40F3F; --code-string:#47701A; --code-comment:#61688A;
  --code-constant:#8A5A00; --code-number:#B04A00; --code-function:#2558C4;
  --code-variable:#7442C8; --code-operator:#00728F; --code-regexp:#0E7470;
  --code-selection:rgba(37,88,196,.16); --code-caret:#C40F3F;
}
html[data-code-theme="ruby-night"], .cs-ruby-night {
  --code-bg:#0F0E14; --code-bg-soft:#1A1922; --code-fg:#D5D8EE;
  --code-keyword:#FF5C79; --code-string:#9ECE6A; --code-comment:#7F86AD;
  --code-constant:#E0AF68; --code-number:#FF9E64; --code-function:#7AA2F7;
  --code-variable:#BB9AF7; --code-operator:#89DDFF; --code-regexp:#B4F9F8;
  --code-selection:rgba(122,162,247,.25); --code-caret:#FF5C79;
}

/* The Signature pair: the house palette before the Ruby pair, still in the
   theme menu. Same grounds as above.

   Light: two hues and the ink ramp. Accent for keywords and operators, the
   deeper accent-adjacent plum for everything quoted, and ink for constants,
   numbers and call names — so a line of Ruby reads as one voice with red as
   punctuation, the same rule the chrome follows. A call name separates by
   weight instead of hue: --code-function-weight is 600 here and 400 in every
   other theme (the :root default below them, so they never spell it out).
   Read by .hljs-title here and by .ruby-identifier in docs_prose.css.

   Dark ("Signature Plus", 2026-10-09): the same red keywords and pink
   strings, plus a hue for each other kind of text: gold constants, blue call
   names, lavender numbers and symbols, coral @ivars, orchid regexps. Its
   first, two-hue version gave 10 kinds of token 4 colors. With a hue of its
   own, a call name needs less weight: 500. The text is a step softer than
   --ink, to cut glare on the near-black ground.

   Measured on those grounds — light: keyword 5.71:1, string 8.53, comment
   4.96; dark: text 15.8, keyword 6.46, string 9.5, regexp 9.7, constant 11.7,
   number 8.9, call 9.4, @ivar 8.9, comment 5.44. The comment is the site's
   own --faint in each mode: the plan proposed #7C7688 for dark, which
   measures 4.39:1 here and fails AA outright. */
html[data-code-theme="signature-light"], .cs-signature-light {
  --code-bg:#FBF8F9; --code-bg-soft:#F5EFF0; --code-fg:#1E1013;
  --code-keyword:#C40F3F; --code-string:#7C2D4A; --code-comment:#7C676C;
  --code-constant:#1E1013; --code-number:#1E1013; --code-function:#1E1013;
  --code-variable:#7C2D4A; --code-operator:#C40F3F; --code-regexp:#7C2D4A;
  --code-function-weight:600;
  --code-selection:rgba(196,15,63,.18); --code-caret:#C40F3F;
}
html[data-code-theme="signature-dark"], .cs-signature-dark {
  --code-bg:#0F0E14; --code-bg-soft:#1A1922; --code-fg:#ECE7F0;
  --code-keyword:#FF5C79; --code-string:#E8A3BA; --code-comment:#8B8696;
  --code-constant:#F2C27E; --code-number:#B9A3FF; --code-function:#8DB6FF;
  --code-variable:#F09A8A; --code-operator:#FF5C79; --code-regexp:#D9A6EC;
  --code-function-weight:500;
  --code-selection:rgba(255,92,121,.25); --code-caret:#FF5C79;
}
html[data-code-theme="light"], .cs-light {
  --code-bg:#ffffff; --code-bg-soft:#f6f8fa; --code-fg:#24292e;
  --code-keyword:#cf222e; --code-string:#0a3069; --code-comment:#6e7781;
  --code-constant:#0550ae; --code-number:#0550ae; --code-function:#8250df;
  --code-variable:#953800; --code-operator:#cf222e; --code-regexp:#116329;
  --code-selection:rgba(84,174,255,.25); --code-caret:#24292e;
}
html[data-code-theme="dark"], .cs-dark {
  --code-bg:#0d1117; --code-bg-soft:#161b22; --code-fg:#c9d1d9;
  --code-keyword:#ff7b72; --code-string:#a5d6ff; --code-comment:#8b949e;
  --code-constant:#79c0ff; --code-number:#79c0ff; --code-function:#d2a8ff;
  --code-variable:#ffa657; --code-operator:#ff7b72; --code-regexp:#7ee787;
  --code-selection:rgba(56,139,253,.30); --code-caret:#c9d1d9;
}
html[data-code-theme="monokai"], .cs-monokai {
  --code-bg:#272822; --code-bg-soft:#3e3d32; --code-fg:#f8f8f2;
  --code-keyword:#f92672; --code-string:#e6db74; --code-comment:#75715e;
  --code-constant:#66d9ef; --code-number:#ae81ff; --code-function:#a6e22e;
  --code-variable:#fd971f; --code-operator:#f92672; --code-regexp:#e6db74;
  --code-selection:rgba(166,226,46,.30); --code-caret:#f8f8f0;
}
html[data-code-theme="dracula"], .cs-dracula {
  --code-bg:#282a36; --code-bg-soft:#343746; --code-fg:#f8f8f2;
  --code-keyword:#ff79c6; --code-string:#f1fa8c; --code-comment:#6272a4;
  --code-constant:#8be9fd; --code-number:#bd93f9; --code-function:#50fa7b;
  --code-variable:#ffb86c; --code-operator:#ff79c6; --code-regexp:#f1fa8c;
  --code-selection:rgba(80,250,123,.25); --code-caret:#f8f8f2;
}
html[data-code-theme="nord"], .cs-nord {
  --code-bg:#2e3440; --code-bg-soft:#3b4252; --code-fg:#d8dee9;
  --code-keyword:#81a1c1; --code-string:#a3be8c; --code-comment:#616e88;
  --code-constant:#8fbcbb; --code-number:#b48ead; --code-function:#88c0d0;
  --code-variable:#d08770; --code-operator:#81a1c1; --code-regexp:#ebcb8b;
  --code-selection:rgba(136,192,208,.25); --code-caret:#d8dee9;
}
html[data-code-theme="solarized-dark"], .cs-solarized-dark {
  --code-bg:#002b36; --code-bg-soft:#073642; --code-fg:#93a1a1;
  --code-keyword:#859900; --code-string:#2aa198; --code-comment:#586e75;
  --code-constant:#b58900; --code-number:#d33682; --code-function:#268bd2;
  --code-variable:#cb4b16; --code-operator:#859900; --code-regexp:#2aa198;
  --code-selection:rgba(38,139,210,.25); --code-caret:#93a1a1;
}
html[data-code-theme="one-dark"], .cs-one-dark {
  --code-bg:#282c34; --code-bg-soft:#21252b; --code-fg:#abb2bf;
  --code-keyword:#c678dd; --code-string:#98c379; --code-comment:#5c6370;
  --code-constant:#e5c07b; --code-number:#d19a66; --code-function:#61afef;
  --code-variable:#e06c75; --code-operator:#56b6c2; --code-regexp:#98c379;
  --code-selection:rgba(97,175,239,.25); --code-caret:#abb2bf;
}

/* The one token with a default. Palettes carry hues; weight is a house
   choice, so only the two Signature blocks name it. The .cs-* form is
   only ever on wordless swatches, so a swatch never needs its own weight. */
:root { --code-function-weight: 400; }

/* "Auto" has no palette of its own — it resolves to the Ruby pair above
   from the site mode, so there is no .cs-auto block. The settings panel's Auto
   chip is those two grounds split diagonally, and it is styled with the rest of
   the panel in shared/_app_header. */

/* ----- Playground editor tokens ----------------------------------------
   CodeMirror (playground/code_editor.js) gives its tokens highlight.js
   class names, which these rules color, so the names stay. */
.hljs { background: var(--code-bg); color: var(--code-fg); }
.hljs-comment, .hljs-quote { color: var(--code-comment); font-style: italic; }
.hljs-keyword, .hljs-selector-tag, .hljs-doctag { color: var(--code-keyword); }
/* --code-operator, as the docs pages' .ruby-operator reads it. */
.hljs-operator { color: var(--code-operator); }
.hljs-literal, .hljs-number { color: var(--code-number); }
.hljs-string, .hljs-meta .hljs-string, .hljs-addition { color: var(--code-string); }
.hljs-regexp { color: var(--code-regexp); }
.hljs-symbol, .hljs-bullet { color: var(--code-number); }
.hljs-title, .hljs-title.function_, .hljs-section {
  color: var(--code-function); font-weight: var(--code-function-weight, 400);
}
.hljs-title.class_, .hljs-class .hljs-title, .hljs-type, .hljs-built_in, .hljs-builtin-name { color: var(--code-constant); }
.hljs-variable, .hljs-template-variable, .hljs-attr, .hljs-attribute { color: var(--code-variable); }
.hljs-params { color: var(--code-fg); }
.hljs-meta { color: var(--code-comment); }
.hljs-emphasis { font-style: italic; }
.hljs-strong { font-weight: 700; }