/* ==========================================================================
   IXLabsNL — tokens-orange.css
   THE ORANGE PRINT (2026-09-14, user: "make the color setting orange with
   white ... the panels in glass style ... very high quality design").

   The same site in daylight: a warm white ground, one orange, glass panels.
   Loaded after chrome.css on every page, before css/orange.css. It rebinds the
   raw palettes that tokens-night.css (the home page and the shared chrome) and
   depth-night.css (the lab pages) already read, so every component follows
   without a light variant of its own.

   Rule, inherited: this file is the only one in the orange print that holds a
   raw colour. Ratios are measured on --p-ground (#FBF8F4) unless stated.
   ========================================================================== */

:root {
  /* ---- grounds ---------------------------------------------------------- */
  --p-ground: #FBF8F4;  /* the page: warm white, never #FFF under glass       */
  --p-up:     #FFFFFF;  /* raised surfaces and the glass tint                 */
  --p-lift:   #F4EDE6;  /* inputs, the pressed state                          */

  /* The one dark value left. Only ever a scrim under a photograph or behind a
     video frame, where white type has to hold whatever the footage does. */
  --p-void:   #1A120C;

  /* ---- text: warm ink --------------------------------------------------- */
  --p-text:   #17110C;  /* 17.68 */
  --p-text-2: #3B3029;  /* 12.09 */
  --p-text-3: #5C5048;  /*  7.36 */
  --p-text-4: #6E625A;  /*  5.58 */

  /* ---- orange ----------------------------------------------------------- */
  --p-orange:       #C9470A;  /* 4.52 on ground, white on it 4.78 — text AND fills */
  --p-orange-deep:  #B8410E;  /* 5.22 — pressed, the dark end of a button gradient  */
  --p-orange-ember: #D6350E;  /* 4.53 */
  --p-flame:        #FF6A13;  /* NON-text: dots, lines, glows, the coast, rules      */
  --p-flame-soft:   #FFE6D5;  /* NON-text: washes behind glass                       */
  --p-flame-light:  #FF9A52;  /* text on the dark photo scrim only                   */
  --p-on-dark:      #FFF8F2;

  /* ---- the counter-hue, now a quiet slate ------------------------------- */
  --p-steel-deep: #EEE7E0;
  --p-steel:      #E3D8CE;
  --p-steel-lit:  #4E6470;  /* 5.87 — the instrument register */

  /* ---- the five labs: five oranges, text-capable, white on each >= 4.78 - */
  --p-ix3:   #D6350E;  /* 4.53 — ember  */
  --p-mix:   #C9470A;  /* 4.52 — orange */
  --p-prime: #A8590A;  /* 4.84 — amber  */
  --p-brix:  #9C4A20;  /* 5.81 — copper */
  --p-shine: #8F6400;  /* 4.97 — gold   */

  /* ---- line, focus, alert ----------------------------------------------- */
  --p-hair: #EADFD5;   /* decorative only */
  --p-rule: #8E8177;   /* 3.57 — every border that means something */
  --p-focus-core: #FFFFFF;
  --p-focus-halo: #17110C;
  --p-alert: #B42318;

  /* ---- depth pages: the light sheet's names (depth-night.css) ------------ */
  --p-sheet:      #FBF8F4;
  --p-sheet-down: #F5EFE9;
  --p-sheet-deep: #EFE6DD;
  --p-sheet-up:   #FFFFFF;
  --p-paper:      #FFFFFF;
  --p-water:      #EEF1F3;
  --p-water-deep: #E3E8EC;
  --p-ink:   #17110C;
  --p-ink-2: #3B3029;
  --p-ink-3: #5C5048;
  --p-ink-4: #6E625A;
  --p-rule-2: #8E8177;
  --p-ix3-signal:   #D6350E;
  --p-mix-signal:   #C9470A;
  --p-prime-signal: #A8590A;
  --p-brix-signal:  #9C4A20;
  --p-shine-signal: #8F6400;
  --p-focus-ring: #17110C;

  /* ---- shadow ink, as channels ------------------------------------------ */
  --shadow-warm:  92 48 18;
  --shadow-flame: 230 90 20;

  /* ---- semantic additions ----------------------------------------------- */
  --c-on-accent:   #FFFFFF;
  --c-on-lab:      #FFFFFF;
  --c-glass:       var(--p-up);
  --c-flame:       var(--p-flame);
  --c-flame-soft:  var(--p-flame-soft);
  --c-flame-light: var(--p-flame-light);
  --c-on-dark:     var(--p-on-dark);

  /* ---- scene colours (read by js/night/scene.js) --------------------------
     Feedback_Puntjes 2026-09-14: the ground round the map is a shade darker and warmer ("achtergrond tint
     aangepast zodat er voldoende contrast is met Nederland kaart") - the white country stands off it instead
     of dissolving into a warm-white page. Page sections below the map keep --p-ground. */
  --c-slab-top:    #FFFFFF;
  --c-slab-side:   #E2CDBA;
  --c-land-shadow: #D8C6B5;
  --c-sea:         #E6DFD7;
  --c-fog:         #E8E1D9;  /* the map ground, one shade under the white land */
  --c-coast:       #FF6A13;
  --c-grid:        #D5C6B8;
  --c-building:    #FFFFFF;
  --c-room-wall:    #F6F0EA;
  --c-room-floor:   #EAE0D6;
  --c-room-ceiling: #FFFFFF;
  --c-light-key:     #FFFFFF;
  --c-light-rim:     #FFB27A;
  --c-light-sky:     #FFFFFF;
  --c-light-bounce:  #F3E4D6;
  --c-light-ambient: #FFFFFF;

  /* ---- photographs: graded warm, never green --------------------------------
     site.css prints every frame through the Chlorotype names (--cy-*) and a
     green hue-rotate. The orange print keeps the frame's own colour and only
     lays a warm dark scrim where type sits on it. */
  --cy-deep:          #1A120C;
  --cy-down:          #21170F;
  --cy-ground:        #2A1D14;
  --cy-line:          #FFF8F2;
  --cy-line-2:        #F3E6DA;
  --cy-mix-signal:    #FF9A52;
  --media-filter:     saturate(1.02) contrast(1.03);
  --media-wash:       linear-gradient(180deg,
                        color-mix(in srgb, #1A120C 22%, transparent) 0%,
                        transparent 40%,
                        color-mix(in srgb, #1A120C 48%, transparent) 100%);
  --media-veil:       color-mix(in srgb, #FBF8F4 70%, transparent);
  --media-grain:      0.02;

  /* ---- the DOM grade, for a light page ------------------------------------ */
  --grade-vignette: radial-gradient(120% 90% at 50% 45%,
                      transparent 0 58%,
                      color-mix(in srgb, #FFE6D5 55%, transparent) 100%);
  --grade-grain: 0.02;

  color-scheme: light;
}

@media (prefers-contrast: more) {
  :root { --c-text-4: #5C5048; --c-hair: #8E8177; }
}
