/* Phase 1 materials: lighting variables and the passive surfaces (panel, gap between modules, top strip).
   Colours come from tokens.generated.css (sampled from the reference). Textures come from js/materials.js (seeded, pre-rendered). */
:root {
  --light-x: -0.62;          /* direction TO the light: up and to the left */
  --light-y: -0.78;
  --shadow-dx: 2.5;          /* contact shadow offset in px (always down and to the right) */
  --shadow-dy: 3.5;
  --shadow-blur: 4.5;
  --shadow-opacity: 0.5;
  --grain-level: 1;          /* 0 = no grain, 1 = as sampled, 1.5 = rougher */
}
.ssl-bay { display: flex; align-items: stretch; background: var(--c-channel); position: relative; }
/* a module: textured carbon paint, a faint vignette toward the edges, and a little brightness variation from module to module */
.ssl-module { position: relative; flex: 1 1 auto; background-color: var(--c-panel);
  background-image: radial-gradient(ellipse 85% 80% at 50% 45%, rgb(0 0 0 / 0), rgb(0 0 0 / 0.26) 100%), linear-gradient(rgb(var(--lift-rgb, 0 0 0) / var(--lift, 0)), rgb(var(--lift-rgb, 0 0 0) / var(--lift, 0))), var(--tex-panel);
  background-position: 0 0, 0 0, var(--ox, 0px) var(--oy, 0px);
  box-shadow: inset 1px 1px 0 rgb(255 255 255 / 0.07), inset -1px -1px 0 rgb(0 0 0 / 0.5); }
/* the vertical channel between modules: almost black, a fine line of light on its top/left edge, inner shadow on the opposite one */
.ssl-gap { flex: 0 0 11px; background: var(--c-channel); box-shadow: inset 1px 0 0 rgb(255 255 255 / 0.1), inset 0 1px 0 rgb(255 255 255 / 0.08), inset -2px 0 3px #000, inset 0 -2px 3px #000; }
/* the metal strip on top of the console: light, slightly brushed (a horizontal streak texture) */
.ssl-strip { height: 11px; background-color: var(--c-strip); background-image: var(--tex-strip), linear-gradient(rgb(255 255 255 / 0.35), rgb(255 255 255 / 0) 40%, rgb(0 0 0 / 0.3)); box-shadow: inset 0 -1px 0 rgb(0 0 0 / 0.55); }
ssl-screw { position: absolute; }

/* ---- Phase 2 ---- */
:root {
  --silk-font: "Helvetica Neue", Helvetica, Arial, "Instrument Sans", sans-serif;
  --silk: #d8d8d4;                        /* printed lettering. The sampled bright band (--c-label-hi) is lower because of antialiasing; #d8d8d4 is the brief's value and matches the zoomed letters */
  --silk-line: var(--c-divider-hi);       /* section lines: bone white, sampled */
  --c-key-ink: #2e2f2f;                   /* engraved text on the keys: read from the zoomed reference crop (the darkest letter pixels) */
  --press-ms: 70ms;                       /* how fast a key goes down */
  --led-glow: 1;                          /* 0 = no halo, 1 = as in the reference, 1.5 = stronger */
}