/* Generated from sce-study-hub/src/lib/skin.ts (npm run theme:css). Do not edit by hand.
   Skin tokens: typefaces, shapes, frame parts and each skin's own palette. Content colours are never set here. */
:root:where([data-skin="blueprint"]) {
  color-scheme: light;
  --color-canvas: #f2efe6;
  --color-surface: #f7f5ee;
  --color-ink: #16202e;
  --color-steel: #465265;
  --color-ash: #56617a;
  --color-hairline: #c3cad8;
  --color-hairline-strong: #8e9bb3;
  --color-lintel: #1d4ed8;
  --color-on-lintel: #ffffff;
  --color-accent: #1d4ed8;
  --font-sans: "IBM Plex Sans Hebrew", "Segoe UI", system-ui, sans-serif;
  --font-display: "IBM Plex Sans Hebrew", "Segoe UI", system-ui, sans-serif;
  --font-num: "IBM Plex Mono", ui-monospace, "IBM Plex Sans Hebrew", monospace;
  --radius-card: 0px;
  --radius-control: 0px;
  --radius-image: 0px;
  --sk-bench: #e3dfd3;
  --sk-grid: rgb(29 78 216 / 0.055);
  --sk-grid-major: rgb(29 78 216 / 0.10);
  --sk-frame: #16202e;
  --sk-tint: rgb(29 78 216 / 0.07);
  --sk-note: #465265;
  --sk-accent-ink: #1e3a8a;
  --sk-panel-hi: #f7f5ee;
  --sk-panel-lo: #f2efe6;
  --sk-glass: #f7f5ee;
  --sk-glow: transparent;
  --sk-led-off: #c3cad8;
  --sk-plate: #16202e;
  --sk-screw-hi: #8e9bb3;
  --sk-screw-lo: #465265;
  --sk-amber-dim: #1d4ed8;
  --sk-island-bg: #f7f5ee;
  --sk-island-ink: #16202e;
  --sk-island-steel: #465265;
  --sk-island-ash: #56617a;
  --sk-island-hairline: #c3cad8;
  --sk-island-hairline-strong: #8e9bb3;
}

:root:where([data-skin="textbook"]) {
  color-scheme: light;
  --color-canvas: #f6f0e2;
  --color-surface: #efe6d1;
  --color-ink: #231f1a;
  --color-steel: #4f4639;
  --color-ash: #665337;
  --color-hairline: #ddd0b3;
  --color-hairline-strong: #bfae8c;
  --color-lintel: #22375a;
  --color-on-lintel: #f6f0e2;
  --color-accent: #22375a;
  --font-sans: "Assistant", "Segoe UI", system-ui, sans-serif;
  --font-display: "Frank Ruhl Libre", "David", Georgia, serif;
  --font-num: "Frank Ruhl Libre", "David", Georgia, serif;
  --radius-card: 2px;
  --radius-control: 2px;
  --radius-image: 0px;
  --sk-bench: #f6f0e2;
  --sk-grid: transparent;
  --sk-grid-major: transparent;
  --sk-frame: #231f1a;
  --sk-tint: transparent;
  --sk-note: #665337;
  --sk-accent-ink: #22375a;
  --sk-panel-hi: #efe6d1;
  --sk-panel-lo: #f6f0e2;
  --sk-glass: #efe6d1;
  --sk-glow: transparent;
  --sk-led-off: #ddd0b3;
  --sk-plate: #231f1a;
  --sk-screw-hi: #bfae8c;
  --sk-screw-lo: #665337;
  --sk-amber-dim: #22375a;
  --sk-island-bg: #efe6d1;
  --sk-island-ink: #231f1a;
  --sk-island-steel: #4f4639;
  --sk-island-ash: #665337;
  --sk-island-hairline: #ddd0b3;
  --sk-island-hairline-strong: #bfae8c;
}

html:root[data-skin="instrument"] {
  color-scheme: dark;
  --color-canvas: #2a2e33;
  --color-surface: #23272b;
  --color-ink: #c3cad1;
  --color-steel: #9aa3ac;
  --color-ash: #959ea7;
  --color-hairline: #16181b;
  --color-hairline-strong: #454b52;
  --color-lintel: #ffb340;
  --color-on-lintel: #1b1305;
  --color-accent: #ffb340;
  --font-sans: "Rubik", "Segoe UI", system-ui, sans-serif;
  --font-display: "Secular One", "Rubik", system-ui, sans-serif;
  --font-num: "Share Tech Mono", ui-monospace, "Rubik", monospace;
  --radius-card: 5px;
  --radius-control: 4px;
  --radius-image: 6px;
  --sk-bench: #141618;
  --sk-grid: transparent;
  --sk-grid-major: transparent;
  --sk-frame: #0a0b0c;
  --sk-tint: rgb(255 179 64 / 0.07);
  --sk-note: #9aa3ac;
  --sk-accent-ink: #ffb340;
  --sk-panel-hi: #353a40;
  --sk-panel-lo: #1f2226;
  --sk-glass: #0c0e0b;
  --sk-glow: rgb(255 179 64 / 0.55);
  --sk-led-off: #3b3a33;
  --sk-plate: #e6eaee;
  --sk-screw-hi: #8a9096;
  --sk-screw-lo: #3c4146;
  --sk-amber-dim: #c98a2e;
  --sk-island-bg: #e4e8dc;
  --sk-island-ink: #1b1f24;
  --sk-island-steel: #3f4750;
  --sk-island-ash: #4b545e;
  --sk-island-hairline: #c6ccbf;
  --sk-island-hairline-strong: #a3ab9c;
}

/* A shop theme over a skin that honours themes: derive the frame tokens from the theme. */
:root[data-theme]:where([data-skin="blueprint"], [data-skin="textbook"]) {
  --sk-bench: color-mix(in srgb, var(--color-canvas) 86%, var(--color-ink));
  --sk-grid: color-mix(in srgb, var(--color-accent) 7%, transparent);
  --sk-grid-major: color-mix(in srgb, var(--color-accent) 13%, transparent);
  --sk-frame: var(--color-ink);
  --sk-tint: color-mix(in srgb, var(--color-accent) 12%, transparent);
  --sk-note: var(--color-steel);
  --sk-accent-ink: var(--color-accent);
  --sk-panel-hi: var(--color-surface);
  --sk-panel-lo: var(--color-canvas);
  --sk-glass: var(--color-surface);
  --sk-led-off: var(--color-hairline-strong);
  --sk-plate: var(--color-ink);
  --sk-amber-dim: var(--color-accent);
  --sk-island-bg: var(--color-surface);
  --sk-island-ink: var(--color-ink);
  --sk-island-steel: var(--color-steel);
  --sk-island-ash: var(--color-ash);
  --sk-island-hairline: var(--color-hairline);
  --sk-island-hairline-strong: var(--color-hairline-strong);
}