/* ── Workstation · Light — the fifth colorway (2026-10-02) ──────────────
   Source: the Claude Design handoff "Add a 5th appearance: Workstation ·
   Light" — the look of the Design workstation: warm off-white panels on a
   soft grey ground, a burnt-orange accent, near-black primary buttons,
   serif titles over sans body text, and no tape-measure rule.

   The design project's build/skin-workstation.css is the reference; it
   was not reachable from the build seat, so every rule below is the
   handoff's own, mapped onto this screen's classes:
     .nav.primary → button.nav-primary      .seg → .view-seg
     .ghost-btn   → button.ghost            .search-wrap input → #benchBar .bench-search input
     .rule-ember / .rule-tape / .rule-paired → .rule-paired (the tape)
     .card → .anchor-area (the Bench's first-run cards) + .tool-card
   The handoff's !important was only for its override layer; here every
   rule is scoped to html[data-palette="workstation"], so the other four
   colorways never read a line of this file. Loaded after the inline skins.

   Light only: there is no Workstation dark twin, so the palette never
   pairs with data-theme="dark" (setTheme() stays put; see index.html).

   Contrast — the handoff's own acceptance line is "no 4.5:1 failures",
   and four of its hexes fail it as text on these surfaces (#D4622C is
   3.8:1 even on pure white). Each is the same hue taken darker until it
   clears 4.5:1 on panel, chassis, well, hover and select. The design's
   values, kept here for the taste pass (one line each to put back):
     --ember     #D4622C → #A54C22   design: 2.9:1 on --select, 3.6:1 on panel
     --select    #F9DEC8 → #FAE2CE
     --ink-3     #7C817C → #636763   design: 3.3:1 on chassis
     --verified  #5E7A55 → #536C4B   design: 4.0:1 on chassis
     --warn      #B07A2E → #875D23   design: 3.1:1 on chassis
   web/tests/test_workstation_appearance.py recomputes every pair. */

html[data-palette="workstation"] {
  --chassis:#ECEAE3; --panel:#FAF9F5; --hover:#F3F1EB; --well:#EFEDE7;
  --ink:#1E2320; --ink-2:#4E544F; --ink-3:#636763;
  --ember:#A54C22;
  --line:rgba(30,35,32,.10); --line-strong:rgba(30,35,32,.18);
  --verified:#536C4B; --warn:#875D23;
  --on-accent:#FAF9F5;
  --select:#FAE2CE; --btn:#2B302C; --btn-hover:#3A403B;
}

/* Type: sans body, serif titles. Buttons already inherit the body face
   (`select, button { font: inherit }`), so the mono labels keep their own. */
html[data-palette="workstation"] body { font-family:'Manrope', system-ui, sans-serif; }
html[data-palette="workstation"] :is(input, textarea) { font-family:'Manrope', system-ui, sans-serif; }
html[data-palette="workstation"] :is(h1, h2, .wordmark, .mono-mark, .reed-mark, .proj-title, .tc-type,
  .anchor-title, .aa-name, .pv-title, .bs-title, .build-title, .flags-head, .pv-change-title, .wp-title) {
  font-family:'IBM Plex Serif', Georgia, serif; font-weight:500; }
html[data-palette="workstation"] .mono-label { font-family:'Manrope', system-ui, sans-serif;
  font-weight:600; letter-spacing:.2em; font-size:10px; }
/* Controls that name the serif themselves go sans with the body. */
html[data-palette="workstation"] :is(button.nav-primary, #anchorGo, .anchor-bench-skip, .rail-tip) {
  font-family:'Manrope', system-ui, sans-serif; }
/* The serif italics would set as a faked Manrope oblique; same answer as Clean. */
html[data-palette="workstation"] :is(.bs-brief, .pv-bench-note, .nb-own, .pv-quiet, .cl-caveat,
  .onboard .broker, .pv-lede) { font-style:normal; }

/* No tape-measure rule; the top bar carries a hairline instead. */
html[data-palette="workstation"] .rule-paired { display:none; }
html[data-palette="workstation"] .topbar { background:var(--panel); border-bottom:1px solid var(--line); height:72px; }

/* Cards: off-white on grey, 12px, the faintest shadow. */
html[data-palette="workstation"] :is(.tool-card, .anchor-area) { background:var(--panel); border-radius:12px;
  box-shadow:0 1px 2px rgba(30,35,32,.04); }
html[data-palette="workstation"] :is(.tool-card, .anchor-area):hover { border-color:var(--line-strong);
  box-shadow:0 1px 2px rgba(30,35,32,.06), 0 6px 16px -10px rgba(30,35,32,.16); }

/* Selected: the peach wash with a burnt-orange edge. */
html[data-palette="workstation"] :is(.tool-card.fresh, .anchor-area[aria-pressed="true"]) {
  background:var(--select); border-color:var(--ember);
  box-shadow:0 0 0 3px color-mix(in srgb, var(--ember) 12%, transparent); }
html[data-palette="workstation"] :is(.rail-btn.active, .rail-btn.active:hover) {
  background:var(--select); color:var(--ember); box-shadow:inset 0 0 0 1px var(--ember); }
html[data-palette="workstation"] .rail-btn.active::before { display:none; }

/* Primary actions are near-black, not ember (the Bench's "Set up my bench"
   is #anchorGo). Other filled buttons keep the burnt-orange accent. */
html[data-palette="workstation"] :is(button.nav-primary, .reed-input button, #anchorGo) {
  background:var(--btn); border-color:var(--btn); color:var(--panel); border-radius:6px; }
html[data-palette="workstation"] :is(button.nav-primary, .reed-input button, #anchorGo):hover {
  background:var(--btn-hover); border-color:var(--btn-hover); color:var(--panel); }

/* Smaller radii on the quiet controls. */
html[data-palette="workstation"] :is(button.ghost, .acc, .chip, .bench-chip, .qa-chip, select,
  input[type=text]) { border-radius:6px; }

/* The segmented control (Live / Read-ahead). */
html[data-palette="workstation"] .view-seg { background:var(--well); padding:3px; border-radius:7px; gap:2px; }
html[data-palette="workstation"] .view-seg button { background:transparent; border-color:transparent; border-radius:5px; }
html[data-palette="workstation"] .view-seg button.on { background:var(--panel); border-color:var(--line);
  box-shadow:0 1px 2px rgba(0,0,0,.06); }

/* Search fields sit in the well. */
html[data-palette="workstation"] :is(#benchBar .bench-search input, .reed-input input) {
  background:var(--well); border-color:var(--line); border-radius:6px; }
html[data-palette="workstation"] :is(#benchBar .bench-search input, .reed-input input):focus {
  border-color:var(--ember); }