/* ==========================================================================
   how-we-work-brand.css — the ported build diagram, repainted to the brand.

   how-we-work.css reproduced the reference image's own palette (blue, violet,
   green, orange, indigo). That palette is not ours. This file overrides the
   .hww tokens with oxblood, ink and cream, and gives the three stages one hue
   at three intensities so the sequence reads as progress toward the finished
   thing rather than as three unrelated colours. The sprint ring is a soft
   oxblood tint: the lavender-to-magenta charge was tried there and withdrawn,
   because four repeated arcs is not the single thin accent line the guide
   licenses, and it out-shouted the content.

   Loaded after how-we-work.css. Scoped to .hww, so the original port is
   untouched on application-development.html and how-we-work.html.
   Written 3 Sep 2026 for Application Development v2.
   ========================================================================== */

.hww{
  --navy:#3a3230; --navy-deep:#221c1b; --slate:#5c534f; --slate-2:#9a8f8a;
  --line:#e6dfcd; --line-2:#f2ecdd; --page:#FFFDF4;

  /* stage 1 prototype — quietest; stage 2 build; stage 3 production — ours */
  --blue:#6b625e;   --blue-soft:#f2ecdd; --blue-line:#d9ccae;
  --violet:#3a3230; --violet-soft:#fbf6e6; --violet-line:#e6dfcd;
  --green:#8a0609;  --green-soft:#f6e7e4; --green-line:#e0bfbc;

  --amber-bg:#f4ecd8; --amber-fg:#5c534f;
  --orange:#8a0609; --red:#8a0609; --indigo:#8a0609;
}

/* the sprint ring: one soft oxblood tint across all four arcs */
.hww .cycle2__ring path{stroke:url(#ringline)}
.hww .cycle2__ring marker path{fill:#a8807f}

/* the mock Apply control: oxblood on cream, not a grey bar with no label */
.hww .editor__apply{background:#8a0609;color:#fef9e7}

/* the three handwritten notes follow their stage, not a separate palette */
.hww .hand--blue{color:#6b625e}
.hww .hand--violet{color:#3a3230}

/* the mock code bars are recoloured at source in the page, not here */

/* status pills inside the mock dashboard */
.hww .pill--p{background:#f4ecd8;color:#5c534f}
.hww .pill--a{background:#f6e7e4;color:#8a0609}