/* ==========================================================================
   THEME — "Daylight"
   --------------------------------------------------------------------------
   A light counterpart to the dark "Signal" theme. Load AFTER main.css; it
   only redefines tokens, never component rules.

   Not an inversion. The dark theme is a lit console — glowing wires on black.
   This one is cool paper: an off-white ground with a faint blue bias, white
   cards lifted on top of it, and the same blue accent darkened until it holds
   its contrast on white. Shadows are tinted slate rather than black, because
   a neutral-black shadow on a cool ground reads as dirt.
   ========================================================================== */

:root {
  /* Surface — the ground is faintly blue so white cards read as lifted */
  --bg:            #F6F8FB;
  --bg-soft:       #FAFCFE;
  --bg-raised:     #FFFFFF;
  --bg-hover:      rgba(13, 27, 58, .030);
  --surface:       #FFFFFF;

  /* Lines — slate-tinted, never neutral grey */
  --line:          rgba(13, 27, 58, .11);
  --line-soft:     rgba(13, 27, 58, .07);
  --line-strong:   rgba(13, 27, 58, .20);

  /* Text — near-black with the same blue bias as the ground */
  --text:          #0B1220;
  --text-2:        #4F5A6B;
  --text-3:        #667080;

  /* Accent — same hue, darkened until it clears AA on white */
  --accent:        #2F5FE0;
  --accent-soft:   #1E48C0;
  --accent-glow:   rgba(47, 95, 224, .14);
  --accent-line:   rgba(47, 95, 224, .40);

  /* Solid fills — the primary button stays the page's strongest contrast,
     so on a light ground it becomes the dark one */
  --on-solid:      #F6F8FB;
  --on-accent:     #FFFFFF;

  /* Veils */
  --veil-1:        rgba(13, 27, 58, .016);
  --veil-2:        rgba(13, 27, 58, .022);
  --veil-header:   rgba(246, 248, 251, .72);
  --veil-menu:     rgba(246, 248, 251, .95);

  /* Rings and shadows — slate-tinted, soft, never black */
  --ring:          rgba(13, 27, 58, .10);
  --ring-hover:    rgba(13, 27, 58, .16);
  --shadow-btn:    0 8px 22px -12px rgba(13, 27, 58, .45);
  --shadow-panel:  0 34px 70px -44px rgba(13, 27, 58, .40);
  --panel-top:     rgba(255, 255, 255, 0);
  /* The photo was shot for a light ground — it needs almost no settling here */
  --portrait-scrim: rgba(11, 18, 32, .10);
  --portrait-filter: grayscale(1) contrast(1.02);

  /* Accent washes — lighter than the dark theme's, or they turn to smudges */
  --glow-a:        rgba(47, 95, 224, .11);
  --glow-b:        rgba(56, 148, 232, .09);
  --accent-wash:   rgba(47, 95, 224, .055);
  --accent-bloom:  rgba(47, 95, 224, .14);
  --accent-sheen:  rgba(120, 165, 255, .50);
  --accent-shadow: rgba(47, 95, 224, .42);
  --accent-spot:   rgba(47, 95, 224, .085);
  --accent-spot-2: rgba(47, 95, 224, .060);
  --accent-pulse:  rgba(47, 95, 224, .50);

  /* System diagram — the panel is white, so nodes need real borders */
  --node-fill:     rgba(13, 27, 58, .030);
  --node-stroke:   rgba(13, 27, 58, .14);
  --node-fill-hi:  rgba(47, 95, 224, .10);
  --wire:          rgba(13, 27, 58, .22);
  --dot:           rgba(13, 27, 58, .10);

  /* Grain reads as dirt on a light ground — barely there */
  --grain-op:      .045;
}

/* Light text on a light ground needs no synthetic thinning; smoothing that
   helps on black makes type look anaemic here. */
body {
  -webkit-font-smoothing: auto;
  -moz-osx-font-smoothing: auto;
}

/* The dark theme's node labels glow against a near-black panel and read fine
   at 62% opacity. White gives them no such help, so the resting state lifts. */
.node { opacity: .86; }
@keyframes node-live {
  0%, 14%   { opacity: .86; }
  20%       { opacity: 1; }
  34%, 100% { opacity: .86; }
}

/* Same reason: a hairline glyph that reads as a drawing on black turns into a
   smudge on white. */
.work-glyph { opacity: .75; }