/* reef — petrol and orange. The deeper reading of the same two hues lagoon uses:
   here they sit in the TEXT rather than the surfaces, which makes the palette
   calmer and heavier. Kept because that is a real preference, and because it is
   the honest before-picture for lagoon's rule. THE LAW: LIGHT FLOATS.

   Unlike lagoon, --accent is the working colour AND the fill (white label on
   deep petrol), so there is no --accent-br here. --accent-rgb is still the
   bright turquoise, so the washes stay fresh. */
:root[data-theme="reef"]{
  color-scheme:light;

  --bg:#eef1f2;
  --surface:#f7fafa;
  --panel:#ffffff;
  --panel-2:#eaf0f1;
  --field:#f0f4f4;
  --rail:#e5ebec;

  --ink:#141a1b;
  --ink-dim:#3f4a4c;
  --ink-dimmer:#5f6c6e;

  --accent:#0b737c;
  --accent-hi:#06585f;
  --accent-lo:#2a9aa4;
  --on-accent:#ffffff;

  --red:#c93a2b;
  --red-ink:#b33322;
  --green:#1a6b4f;
  --green-ink:#14563f;

  /* --t-qa leaves teal for mint, as in lagoon: the accent owns turquoise, and a
     teal dot beside a teal interface reads as "selected" rather than as a type.
     --green went deep pine so success does not collide with that mint. */
  --t-source:#6f7787; --t-atomic:#3b6fd4; --t-qa:#1f9c7a;
  --t-claim:#dc5a3c;  --t-summary:#a87a0c; --t-pattern:#7a4bd0;
  --t-finding:#c3357f;
  --atomic-ink:#3c5aa8;
  --pattern-ink:#6b45a5;

  --accent-rgb:63,191,201;
  --deep-rgb:214,224,226;
  --panel-rgb:226,234,236;
  --panel2-rgb:234,240,241;
  --red-rgb:201,58,43;
  --green-rgb:26,107,79;
  --claim-rgb:220,90,60;
  --atomic-rgb:59,111,212;
  --pattern-rgb:122,75,208;
  --ink-dimmer-rgb:95,108,110;
  --shadow-rgb:84,110,112;
  --sheen-rgb:20,26,27;

  --line:rgba(20,26,27,.10);
  --line-soft:rgba(20,26,27,.06);
  --rust:#a2542c;
  --hm1:#fdeedd; --hm2:#f6c894; --hm3:#e2853a; --hm4:#a24d13;
  --s-ignored:#6b7679;
  /* The wash, on the two FIXED layers (see cockpit.css) rather than on --lamp.
     --lamp is painted on the body, so its percentages resolve against the
     DOCUMENT: on a long page the blooms sit against a box several screens tall
     and the slice that reaches the top of the SCREEN collapses to nothing —
     measured at exactly the flat page colour on a 7,244px page. Fixed layers
     are sized to the viewport and cannot care how tall the document is.
     the light arrives in the corner the utility cluster sits in and fades out
     across the page, so the top of every screen sits INSIDE a colour.
     Left-to-right as it always was: petrol on the left, sun in the RIGHT corner.
     reef is a two-colour palette and the wash is the main place its orange reaches
     a page at all, so the corner carries it.
  */
  --lamp:none;   /* painted on the fixed layer instead — see --lamp-fixed */
  --lamp-fixed:
    radial-gradient(105vw 72vh at 118% -14%,rgba(245,185,66,.32),transparent 64%),
    radial-gradient(112vw 76vh at 88% -18%,rgba(242,145,63,.26),transparent 66%),
    radial-gradient(95vw 66vh at 58% -22%,rgba(111,203,143,.15),transparent 62%),
    radial-gradient(105vw 72vh at 22% -24%,rgba(63,191,201,.22),transparent 60%);
  /* …and the half that moves: soft blooms, meant to be noticed after a minute
     rather than watched. Its own layer because it animates TRANSFORM only. */
  --lamp-drift:
    radial-gradient(92vw 64vh at 92% 0%,rgba(245,185,66,.20),transparent 62%),
    radial-gradient(88vw 60vh at 62% 6%,rgba(63,191,201,.14),transparent 62%);
  --lift:0 1px 2px rgba(84,110,112,.10),0 10px 28px -14px rgba(84,110,112,.45);
  --veil:rgba(238,241,242,.75);
  --dial-on:rgba(63,191,201,.16);
  --graph-bg:#f7fafa;
  --graph-veil:rgba(255,255,255,.78);

  /* reef DOES give orange its own text colour — burnt, so it clears the amber
     --t-summary dot by 71. That is the difference from lagoon, which keeps the
     note in ink and lets the border carry the orange. */
  --panel-lift:0 1px 2px rgba(84,110,112,.10),0 10px 28px -14px rgba(84,110,112,.45);
  --card-flow:linear-gradient(90deg,#0b737c 0%,#3fbfc9 42%,#f6c894 78%,#e2853a 100%);

  --attn-ink:#9e3f0e; --attn-rgb:242,145,63; --attn-bed:.13; --attn-bd:.55;
}

:root[data-theme="reef"]{
  --bd:1px solid rgba(20,26,27,.10);
  --bd-soft:1px solid rgba(20,26,27,.06);
  --bd-firm:1px solid rgba(20,26,27,.20);
  --wash:rgba(var(--accent-rgb),.12);
}