/* ═══════════════════════════════════════════════════════════════════════════
   door1-workspace.css — Door 1 as one desk, not four products
   ────────────────────────────────────────────────────────────────────────────
   Door 1 already held every piece of the truth loop. The claim checker resolved
   a pasted quote, the receipts library held the worked receipts, the issue front
   door ranked people on the formal record, the measure showcase took a bill
   apart. What it did not hold was the loop: those four lived thousands of lines
   apart, each with its own title, its own explanation of itself, and its own
   dead end. This file styles the one surface that carries all four at once —
   a mode rail plus one open desk.

   LAYOUT CONTRACT
   ───────────────
   Two regions, and only two. The rail (.d1-rail) is the four ways in, one of
   them current, with a count beside any the reader has already used this visit.
   The desk (.d1-desk) is exactly one of those modes: the field or the shelf,
   the result, the doors onward, and one footer control. Wide screens set them
   side by side; a phone stacks rail over desk and the rail becomes a horizontal
   strip. Same markup either way — nothing in the JS knows which.

   The rail deliberately mirrors the ballot workspace's seat rail rather than
   inventing a second idiom: a reader who has worked Door 2 should recognise
   this shape on sight, because it is the same promise (you are somewhere, here
   is everywhere else, you will not lose your place).

   COLOUR DISCIPLINE
   ─────────────────
   There is NO good/bad ramp on this surface, because nothing here is graded.
   The rail's counts are counts. The people list is ordered by acts on the
   formal record, and every row is styled identically regardless of who is on
   it — no party colour, no tier colour, no direction colour. The only three
   accents in the file are structural: blue for the current mode, amber for the
   one footer control, and a dashed neutral panel for an honest empty. An
   honest empty is deliberately the quietest block here and not a warning: it
   is a fact about what the record holds, and a red box would read as a finding
   against the person the reader just asked about.

   The claim result hosts the shipped receipt card, which brings its own colour
   with it. This file gives it a container and does not restyle it.

   Targets are 44px minimum on every control, per the mobile brief.
   ═══════════════════════════════════════════════════════════════════════════ */

#pdx-door1-workspace { margin: 0 0 1.5rem; }
#pdx-door1-workspace[hidden] { display: none !important; }

#pdx-d1-body {
  position: relative;
  border-radius: 1.25rem;
  border: 2px solid rgba(96, 165, 250, 0.2);
  background:
    linear-gradient(135deg, rgba(26, 58, 107, 0.2) 0%, rgba(8, 12, 24, 0.94) 46%, rgba(192, 21, 42, 0.1) 100%);
  box-shadow: 0 12px 46px rgba(0, 0, 0, 0.4);
  overflow: hidden;
}
#pdx-d1-body:empty { display: none; }
#pdx-d1-body::before {
  content: ""; position: absolute; left: 0; right: 0; top: 0; height: 3px;
  background: linear-gradient(90deg, transparent, #ef4444 20%, #fff 50%, #3b82f6 80%, transparent);
  opacity: 0.55;
}

/* ── Head ─────────────────────────────────────────────────────────────────── */
.d1-hd { padding: 1.1rem 1.15rem 0.9rem; }
.d1-eyebrow {
  font-family: 'Barlow Condensed', sans-serif; font-weight: 700;
  font-size: 0.7rem; letter-spacing: 0.16em; text-transform: uppercase;
  color: #93c5fd;
}
.d1-title {
  font-family: 'Oswald', 'Barlow Condensed', sans-serif; font-weight: 700;
  font-size: 1.3rem; letter-spacing: 0.02em; color: #fff; margin: 0.15rem 0 0;
}
.d1-sub { font-size: 0.82rem; line-height: 1.5; color: #9fb0c8; margin: 0.35rem 0 0; }

/* ── Body: rail + desk ────────────────────────────────────────────────────── */
.d1-body { display: block; }
@media (min-width: 900px) {
  .d1-body { display: grid; grid-template-columns: 16rem minmax(0, 1fr); align-items: start; }
}

/* ── The rail ─────────────────────────────────────────────────────────────── */
.d1-rail {
  border-top: 1px solid rgba(255, 255, 255, 0.07);
  padding: 0.75rem 1.15rem 0.9rem;
}
@media (min-width: 900px) {
  .d1-rail {
    border-right: 1px solid rgba(255, 255, 255, 0.07);
    padding: 0.9rem 0.85rem 1.1rem 1.15rem;
    position: sticky; top: 1rem; align-self: start;
  }
}
.d1-rail-lbl {
  font-family: 'Barlow Condensed', sans-serif; font-weight: 700;
  font-size: 0.66rem; letter-spacing: 0.14em; text-transform: uppercase;
  color: #7f93b0; margin-bottom: 0.5rem;
}
/* Phone: a horizontal strip that keeps all four modes one thumb away.
   Desktop: a column. Same buttons. */
.d1-modes {
  display: flex; gap: 0.5rem; overflow-x: auto; padding-bottom: 0.35rem;
  scroll-snap-type: x proximity; -webkit-overflow-scrolling: touch;
}
.d1-modes::-webkit-scrollbar { height: 4px; }
.d1-modes::-webkit-scrollbar-thumb { background: rgba(255, 255, 255, 0.14); border-radius: 99px; }
@media (min-width: 900px) {
  .d1-modes { flex-direction: column; overflow: visible; gap: 0.4rem; }
}

.d1-mode {
  position: relative; flex: 0 0 auto; scroll-snap-align: start;
  min-height: 44px; min-width: 9.5rem; max-width: 14rem;
  display: flex; align-items: center; gap: 0.5rem;
  padding: 0.5rem 0.6rem; border-radius: 0.8rem; cursor: pointer; text-align: left;
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-left: 3px solid rgba(255, 255, 255, 0.18);
  background: rgba(255, 255, 255, 0.03);
  color: #cbd5e1; transition: background 0.16s ease, border-color 0.16s ease;
}
@media (min-width: 900px) { .d1-mode { min-width: 0; max-width: none; width: 100%; } }
.d1-mode:hover { background: rgba(96, 165, 250, 0.1); border-color: rgba(96, 165, 250, 0.32); }
/* Used-this-visit is a hairline, not a tick and not a fill. It marks where the
   reader has been; it does not mark anything as complete. */
.d1-mode.is-used { border-left-color: rgba(148, 163, 184, 0.55); }
.d1-mode.is-open {
  background: rgba(96, 165, 250, 0.16);
  border-color: rgba(96, 165, 250, 0.5);
  border-left-color: #60a5fa;
  color: #fff;
}
.d1-mode-ico { font-size: 1rem; flex: none; }
.d1-mode-txt { min-width: 0; display: block; flex: 1 1 auto; }
.d1-mode-lb {
  display: block; font-family: 'Barlow Condensed', sans-serif; font-weight: 700;
  font-size: 0.8rem; letter-spacing: 0.03em; text-transform: uppercase;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.d1-mode-sub {
  display: block; font-size: 0.68rem; line-height: 1.3; color: #8fa2bd;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
/* A count of things that happened. Tabular so it does not jitter, grey so it
   does not read as a score, and absent entirely at zero. */
.d1-mode-n {
  flex: none; font-size: 0.62rem; line-height: 1.2; color: #93a7c2;
  font-variant-numeric: tabular-nums;
  padding: 0.2rem 0.4rem; border-radius: 0.5rem;
  background: rgba(255, 255, 255, 0.05);
}

/* ── The desk: one mode ───────────────────────────────────────────────────── */
.d1-desk {
  border-top: 1px solid rgba(255, 255, 255, 0.07);
  padding: 1rem 1.15rem calc(1.2rem + env(safe-area-inset-bottom, 0px));
  min-width: 0;
}
.d1-desk-hd { margin-bottom: 0.85rem; }
.d1-desk-t {
  font-family: 'Oswald', sans-serif; font-weight: 700; font-size: 1.05rem;
  color: #fff; margin: 0; letter-spacing: 0.02em;
}
.d1-desk-l { font-size: 0.76rem; line-height: 1.5; color: #8fa2bd; margin: 0.2rem 0 0; }

/* One sentence naming what ordered a list, above the list. */
.d1-lead {
  margin: 0.9rem 0 0.5rem; padding: 0.55rem 0.7rem; border-radius: 0.7rem;
  font-size: 0.74rem; line-height: 1.5; color: #a9bad2;
  background: rgba(96, 165, 250, 0.07); border: 1px solid rgba(96, 165, 250, 0.18);
}
.d1-scope {
  margin: 0.7rem 0 0; font-size: 0.74rem; line-height: 1.5; color: #93a7c2;
}
.d1-scope b { color: #dbeafe; }

/* THE FILE DOOR, on the lede of a leaf scope. The same body has an address of
   its own, /i/<key>, and this is the only control on the desk that says so. Sized
   and coloured as a quiet link rather than a chip, deliberately: the chips above
   it change WHAT the desk is scoped to, and this one does not change the scope at
   all — it opens the file for the scope already chosen. The address is printed
   beside the label because a reader who wants this control usually wants the
   string, and a link that shows where it goes needs no tooltip. */
.d1-filedoor { margin: 0.55rem 0 0; }
.d1-filedoor-go {
  display: inline-flex; align-items: baseline; gap: 0.4rem; flex-wrap: wrap;
  padding: 0.3rem 0.6rem; border-radius: 0.6rem;
  font-family: 'Oswald', sans-serif; font-size: 0.7rem; letter-spacing: 0.04em;
  text-transform: uppercase; text-decoration: none; color: #dbeafe;
  background: rgba(96, 165, 250, 0.1); border: 1px solid rgba(96, 165, 250, 0.28);
}
.d1-filedoor-go:hover, .d1-filedoor-go:focus-visible {
  background: rgba(96, 165, 250, 0.18); border-color: rgba(147, 197, 253, 0.5);
  color: #fff;
}
.d1-filedoor-at {
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 0.66rem; letter-spacing: 0; text-transform: none; color: #8fa2bd;
}

/* "X is a family of N keys, not a single file." Printed where a bundle is
   selected and no key is, directly under the child shelf it points at — so it
   reads as a caption on those chips rather than as a finding of its own. Quieter
   than .d1-lead, which names what ordered a list; this names what the surface
   IS. No colour of its own: a family's hue lives on its chips. */
.d1-fam-note {
  margin: 0.75rem 0 0; font-size: 0.76rem; line-height: 1.55; color: #9fb2cb;
}
.d1-fam-note b { color: #e8eefb; }

/* An honest empty. The quietest block on the surface, on purpose: it reports
   what the record holds, and nothing about the person who was asked about. */
.d1-empty {
  margin: 0.8rem 0 0; padding: 0.75rem 0.85rem; border-radius: 0.75rem;
  font-size: 0.78rem; line-height: 1.6; color: #a3b3c9;
  background: rgba(255, 255, 255, 0.025);
  border: 1px dashed rgba(255, 255, 255, 0.16);
}

/* ── Claim mode ───────────────────────────────────────────────────────────── */
.d1-claim-form { display: block; }
.d1-claim-lb {
  display: block; font-family: 'Barlow Condensed', sans-serif; font-weight: 700;
  font-size: 0.66rem; letter-spacing: 0.14em; text-transform: uppercase;
  color: #7f93b0; margin-bottom: 0.35rem;
}
.d1-claim-in {
  width: 100%; box-sizing: border-box; min-height: 5.2rem; resize: vertical;
  padding: 0.7rem 0.8rem; border-radius: 0.8rem;
  font-family: inherit; font-size: 0.88rem; line-height: 1.5; color: #e8eefb;
  background: rgba(4, 8, 18, 0.6); border: 1px solid rgba(255, 255, 255, 0.14);
}
.d1-claim-in:focus { outline: none; border-color: rgba(96, 165, 250, 0.6); }
.d1-claim-in::placeholder { color: #64748b; }
.d1-claim-row {
  display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem 0.8rem;
  margin-top: 0.6rem;
}
.d1-claim-min { font-size: 0.68rem; line-height: 1.4; color: #7f93b0; flex: 1 1 12rem; }
.d1-claim-busy {
  margin: 0.9rem 0 0; font-size: 0.78rem; color: #93c5fd;
}

.d1-go {
  min-height: 44px; padding: 0.6rem 0.95rem; border-radius: 0.75rem; cursor: pointer;
  font-family: 'Barlow Condensed', sans-serif; font-weight: 700;
  font-size: 0.82rem; letter-spacing: 0.05em; text-transform: uppercase;
  color: #dbeafe; background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(255, 255, 255, 0.16);
}
.d1-go:hover { border-color: rgba(96, 165, 250, 0.5); color: #fff; }
.d1-go.is-lead {
  color: #071018; background: linear-gradient(135deg, #93c5fd, #60a5fa);
  border-color: transparent;
}

/* ── A result ─────────────────────────────────────────────────────────────── */
.d1-out {
  margin: 1rem 0 0; padding: 0.85rem 0.9rem; border-radius: 0.9rem;
  background: rgba(255, 255, 255, 0.03); border: 1px solid rgba(255, 255, 255, 0.1);
}
/* A hit is marked as a hit by a hairline, not by a green field. The card inside
   carries its own verdict, and a container colour agreeing with it would be
   this surface adding a second opinion. */
.d1-out-hit { border-left: 3px solid rgba(96, 165, 250, 0.6); }
/* A miss and a refusal look the same, because they are the same kind of thing:
   a statement about what we hold. Dashed, neutral, no alarm colour. */
.d1-out-miss, .d1-out-flat {
  border-style: dashed; border-color: rgba(255, 255, 255, 0.18);
  background: rgba(255, 255, 255, 0.02);
}
.d1-out-k {
  margin: 0 0 0.35rem; font-family: 'Barlow Condensed', sans-serif; font-weight: 700;
  font-size: 0.64rem; letter-spacing: 0.15em; text-transform: uppercase; color: #7f93b0;
}
.d1-out-h {
  margin: 0; font-family: 'Oswald', sans-serif; font-weight: 700;
  font-size: 0.98rem; line-height: 1.4; color: #fff;
}
.d1-out-p { margin: 0.45rem 0 0; font-size: 0.8rem; line-height: 1.55; color: #b8c6da; }
.d1-out-p b { color: #fff; }
.d1-out-meta { margin: 0.35rem 0 0; font-size: 0.72rem; color: #8fa2bd; }
.d1-out-fine { margin: 0.6rem 0 0; font-size: 0.7rem; line-height: 1.5; color: #7f93b0; }
/* The shipped receipt card's container. No restyling — it owns its own look on
   every other surface and must look the same here. */
.d1-card { margin: 0.7rem 0 0; }
.d1-card:empty { display: none; }
.d1-src {
  display: inline-block; margin-top: 0.5rem; font-size: 0.72rem;
  color: #93c5fd; text-decoration: none; border-bottom: 1px dotted rgba(147, 197, 253, 0.5);
}
.d1-src:hover { color: #dbeafe; }

/* The doors onward — the whole reason this is a desk. */
.d1-doors { display: flex; flex-wrap: wrap; gap: 0.5rem; margin: 0.8rem 0 0; }
.d1-door {
  min-height: 44px; display: inline-flex; align-items: center;
  padding: 0.55rem 0.8rem; border-radius: 0.7rem; cursor: pointer;
  font-family: 'Barlow Condensed', sans-serif; font-weight: 700;
  font-size: 0.78rem; letter-spacing: 0.04em; text-transform: uppercase;
  color: #cbd5e1; text-decoration: none;
  background: rgba(255, 255, 255, 0.04); border: 1px solid rgba(255, 255, 255, 0.14);
}
.d1-door:hover { background: rgba(96, 165, 250, 0.12); border-color: rgba(96, 165, 250, 0.45); color: #fff; }
.d1-door.is-lead { border-color: rgba(96, 165, 250, 0.55); color: #dbeafe; }

/* ── Person mode: a strip, never a second profile ─────────────────────────── */
.d1-strip {
  display: flex; flex-wrap: wrap; align-items: baseline; gap: 0.4rem 0.7rem;
  padding: 0.6rem 0.75rem; border-radius: 0.75rem;
  background: rgba(96, 165, 250, 0.08); border: 1px solid rgba(96, 165, 250, 0.22);
}
.d1-strip-k {
  flex: none; font-family: 'Barlow Condensed', sans-serif; font-weight: 800;
  font-size: 0.6rem; letter-spacing: 0.16em; text-transform: uppercase; color: #93c5fd;
}
.d1-strip-n {
  flex: 1 1 auto; min-width: 0; font-family: 'Oswald', sans-serif; font-weight: 700;
  font-size: 1rem; color: #fff;
}
.d1-strip-go {
  flex: none; min-height: 36px; display: inline-flex; align-items: center;
  padding: 0.35rem 0.6rem; border-radius: 0.6rem; cursor: pointer;
  font-size: 0.72rem; color: #dbeafe; text-decoration: none;
  background: transparent; border: 1px solid rgba(147, 197, 253, 0.4);
}
.d1-strip-go:hover { background: rgba(96, 165, 250, 0.16); }

.d1-rows { list-style: none; margin: 0.5rem 0 0; padding: 0; display: grid; gap: 0.45rem; }
.d1-row {
  display: flex; flex-wrap: wrap; align-items: baseline; gap: 0.3rem 0.6rem;
  padding: 0.55rem 0.7rem; border-radius: 0.7rem;
  background: rgba(255, 255, 255, 0.03); border: 1px solid rgba(255, 255, 255, 0.09);
}
.d1-row-a {
  flex: 1 1 10rem; min-width: 0; min-height: 32px; display: inline-flex; align-items: center;
  font-family: 'Barlow Condensed', sans-serif; font-weight: 700;
  font-size: 0.86rem; letter-spacing: 0.02em; color: #e8eefb; text-decoration: none;
  background: transparent; border: 0; cursor: pointer; text-align: left; padding: 0;
}
.d1-row-a:hover { color: #93c5fd; }
.d1-row-m { flex: none; font-size: 0.7rem; color: #8fa2bd; }

/* ── Shelves: the issue set, the measure set ──────────────────────────────── */
.d1-shelf { display: flex; flex-wrap: wrap; gap: 0.4rem; }
.d1-shelf-issues { margin-top: 0.5rem; }
.d1-chip {
  min-height: 40px; display: inline-flex; align-items: center;
  padding: 0.4rem 0.7rem; border-radius: 99px; cursor: pointer;
  font-size: 0.76rem; line-height: 1.2; color: #cbd5e1;
  background: rgba(255, 255, 255, 0.04); border: 1px solid rgba(255, 255, 255, 0.13);
}
.d1-chip:hover { border-color: rgba(96, 165, 250, 0.45); color: #fff; }
.d1-chip.is-open {
  background: rgba(96, 165, 250, 0.16); border-color: rgba(96, 165, 250, 0.55); color: #fff;
}
.d1-chip.is-issue { border-style: dashed; }

/* ── THE ISSUE HUE ─────────────────────────────────────────────────────────── */
/* THERE IS NO PALETTE IN THIS FILE. Not one issue hex, and not one per-issue
   rule: a chip arrives carrying four inline custom properties from
   PDXIssueColors.styleFor() (--pdx-ic, -soft, -wash, -ink) and these rules spend
   them without ever knowing which issue they got. That is the same contract
   stance-tree.css, issue-compare.css, ballot-axes.css and profile-spine.css all
   work under, and `data-ic` is the same gate they use, so Door 1 stopped being
   the one surface that named an issue and painted it an untyped dark pill. The
   fallbacks in the var() calls are the pre-existing neutral chip, so a page
   without issue-colors.js looks exactly as it did before.

   STATE IS THE CONTRAST, NOT IDENTITY. Every child of one core shares that core's
   hue — seventeen green chips on Climate, Energy & Land, because they are
   seventeen questions in one family. So the lit chip is the LOUD step (`wash`,
   full-strength border, white text) and the unlit ones the QUIET step (`soft`,
   hue border, hue ink). That reads as one family with one member selected, which
   is what it is, rather than as thirteen unrelated pills.

   AND IT NEVER READS THE RECORD. There is no rule here keyed to a count, a band,
   a tier or an emptiness. `lands_keep_public` holds no measure yet and paints
   identically to `lands_preserve`, which holds four — because "no measure mapped
   yet" is a fact about the corpus, not a property of the issue, and a chip that
   went grey when its key was empty would be this stylesheet characterising it. */
.d1-chip[data-ic] {
  color: var(--pdx-ic-ink, #cbd5e1);
  background: var(--pdx-ic-soft, rgba(255, 255, 255, 0.04));
  border-color: var(--pdx-ic, rgba(255, 255, 255, 0.13));
}
.d1-chip[data-ic]:hover {
  color: #fff;
  background: var(--pdx-ic-wash, rgba(255, 255, 255, 0.07));
  border-color: var(--pdx-ic, rgba(96, 165, 250, 0.45));
}
.d1-chip[data-ic].is-open {
  color: #fff;
  background: var(--pdx-ic-wash, rgba(96, 165, 250, 0.16));
  border-color: var(--pdx-ic, rgba(96, 165, 250, 0.55));
  box-shadow: inset 0 0 0 1px var(--pdx-ic, transparent);
}
/* KEYBOARD FOCUS, ON EVERY CHIP. This shelf had no focus ring at all, themed or
   not — the browser default was being suppressed by the custom background with
   nothing put back. The ring is drawn in the chip's own hue where it has one and
   in the desk's blue where it does not, and `outline-offset` keeps it clear of
   the pill's border so a focused unlit chip is not read as a selected one. */
.d1-chip:focus-visible {
  outline: 2px solid #7fb4ff; outline-offset: 2px;
}
.d1-chip[data-ic]:focus-visible {
  outline-color: var(--pdx-ic-ink, #7fb4ff);
}
@media (prefers-contrast: more) {
  .d1-chip[data-ic] { border-color: var(--pdx-ic-ink, rgba(255, 255, 255, 0.13)); }
}

/* ── The people on an issue ───────────────────────────────────────────────── */
/* Every row is identical. There is no per-row accent, because a colour that
   varied row to row on this list could only be reading something the order
   deliberately does not read. */
.d1-people { list-style: none; margin: 0.5rem 0 0; padding: 0; display: grid; gap: 0.45rem; }
.d1-person {
  display: flex; flex-wrap: wrap; align-items: baseline; gap: 0.3rem 0.6rem;
  padding: 0.55rem 0.7rem; border-radius: 0.7rem;
  background: rgba(255, 255, 255, 0.03); border: 1px solid rgba(255, 255, 255, 0.09);
}
.d1-person-a {
  flex: 0 1 auto; min-width: 0; min-height: 32px; display: inline-flex; align-items: center;
  font-family: 'Barlow Condensed', sans-serif; font-weight: 700;
  font-size: 0.9rem; letter-spacing: 0.02em; color: #fff; text-decoration: none;
  background: transparent; border: 0; cursor: pointer; padding: 0;
}
.d1-person-a:hover { color: #93c5fd; }
.d1-person-m {
  flex: 1 1 8rem; font-size: 0.72rem; color: #8fa2bd;
  font-variant-numeric: tabular-nums;
}
/* The baseline mark. The alignment lane's own tag, in the alignment lane's own
   register: a small neutral label saying where this row rests, not a grade. */
.d1-base {
  flex: none; font-size: 0.6rem; letter-spacing: 0.1em; text-transform: uppercase;
  font-weight: 700; color: #a3b3c9;
  padding: 0.18rem 0.4rem; border-radius: 0.45rem;
  background: rgba(255, 255, 255, 0.055); border: 1px solid rgba(255, 255, 255, 0.12);
}
.d1-cite {
  flex: none; min-height: 32px; padding: 0.25rem 0.55rem; border-radius: 0.55rem;
  cursor: pointer; font-size: 0.7rem; color: #dbeafe;
  background: transparent; border: 1px solid rgba(147, 197, 253, 0.35);
}
.d1-cite:hover { background: rgba(96, 165, 250, 0.14); }
.d1-more { margin: 0.6rem 0 0; font-size: 0.74rem; color: #8fa2bd; }
.d1-link {
  background: none; border: 0; padding: 0; cursor: pointer;
  font: inherit; color: #93c5fd; text-decoration: underline;
}

/* ── Open any tracked key ─────────────────────────────────────────────────── */
/* A second control on the same pane, not a second pane. The shelf above is the
   thirteen cores and their child chips; this reaches any of the 121 keys by
   name, and lands on the same child the chips do. */
.d1-seek { margin: 0.7rem 0 0; }
.d1-seek-l {
  display: flex; align-items: baseline; gap: 0.45rem;
  font-family: 'Barlow Condensed', sans-serif; font-weight: 800;
  font-size: 0.66rem; letter-spacing: 0.14em; text-transform: uppercase; color: #9fb2cc;
}
.d1-seek-n {
  font-family: inherit; font-size: 0.6rem; letter-spacing: 0.08em;
  color: #7d8ea8; text-transform: none;
}
.d1-seek-row { display: flex; flex-wrap: wrap; gap: 0.4rem; margin-top: 0.3rem; }
.d1-seek-i {
  flex: 1 1 14rem; min-width: 0; min-height: 40px;
  padding: 0.45rem 0.7rem; border-radius: 0.7rem;
  font: inherit; font-size: 0.82rem; color: #e8eefb;
  background: rgba(255, 255, 255, 0.045); border: 1px solid rgba(255, 255, 255, 0.15);
}
.d1-seek-i::placeholder { color: #6d7d95; }
.d1-seek-i:focus { outline: 2px solid rgba(96, 165, 250, 0.55); outline-offset: 1px; }
.d1-seek-go {
  flex: none; min-height: 40px; padding: 0.45rem 0.9rem; border-radius: 0.7rem;
  cursor: pointer; font-family: 'Barlow Condensed', sans-serif; font-weight: 700;
  font-size: 0.78rem; letter-spacing: 0.06em; text-transform: uppercase; color: #dbeafe;
  background: rgba(96, 165, 250, 0.13); border: 1px solid rgba(96, 165, 250, 0.4);
}
.d1-seek-go:hover { background: rgba(96, 165, 250, 0.2); color: #fff; }
.d1-seek-h { margin: 0.35rem 0 0; font-size: 0.7rem; color: #7d8ea8; }
.d1-seek-miss { margin: 0.35rem 0 0; font-size: 0.74rem; line-height: 1.55; color: #fcd34d; }
.d1-chip.is-key { border-style: dotted; font-size: 0.72rem; }

/* ── The record ledger ────────────────────────────────────────────────────── */
/* Counts, then bands. Every band is drawn identically apart from the tone of its
   pattern chips, because a band that looked stronger than another would be a
   ranking, and this is a partition. No bar, no fill, no percentage. */
.d1-led-census {
  margin: 0.8rem 0 0; padding: 0.7rem 0.8rem; border-radius: 0.8rem;
  background: rgba(255, 255, 255, 0.035); border: 1px solid rgba(255, 255, 255, 0.1);
}
/* The crumb: core \2192 child, above the counts. Sized down and lettered up so it
   reads as a location rather than as the headline — the headline is the census
   sentence directly beneath it. The core half is a button because the family it
   names is a real place on this desk; the child half is text, because a reader
   already is there. */
.d1-led-crumb {
  display: flex; align-items: baseline; flex-wrap: wrap; gap: 0.3rem;
  margin: 0 0 0.4rem; font-family: 'Barlow Condensed', sans-serif;
  font-size: 0.7rem; letter-spacing: 0.1em; text-transform: uppercase;
}
.d1-crumb-a {
  background: none; border: 0; padding: 0; cursor: pointer;
  font: inherit; letter-spacing: inherit; text-transform: inherit;
  color: #93c5fd; text-decoration: underline; text-underline-offset: 0.15em;
}
.d1-crumb-a:hover { color: #bfdbfe; }
.d1-crumb-s { color: #6b7f9c; }
.d1-crumb-k { font-weight: 800; color: #e8eefb; }
/* The crumb in its child's hue: the family name keeps its link blue, because it is
   a link, and the child half takes the issue ink. Ink only — no fill and no rule,
   because this is a caption under a census, not a third control. */
.d1-led-crumb[data-ic] .d1-crumb-k { color: var(--pdx-ic-ink, #e8eefb); }
.d1-led-crumb[data-ic] .d1-crumb-s { color: var(--pdx-ic, #6b7f9c); }
.d1-led-n { margin: 0; font-size: 0.9rem; line-height: 1.5; color: #dbeafe; }
.d1-led-n b { color: #fff; }
.d1-led-split {
  margin: 0.35rem 0 0; font-size: 0.78rem; line-height: 1.6; color: #a9bcd6;
  font-variant-numeric: tabular-nums;
}
.d1-led-pkg { margin: 0.4rem 0 0; font-size: 0.74rem; line-height: 1.6; color: #d6c9a8; }
.d1-led-pkg b { color: #fcd34d; }
.d1-led-m { margin: 0.4rem 0 0; font-size: 0.76rem; color: #9fb2cc; }
.d1-led-m b { color: #e8eefb; }

/* ── THE CENSUS WHILE THE READ IS STILL OUT ────────────────────────────────
   A partial count is drawn as one: the box takes the same amber the rest of this
   desk uses for "we are telling you something about our own certainty", and the
   two disclosure lines sit under the headline in the same weight as the headline
   so neither can be skimmed past. No bar, no spinner and no share — the reader is
   being told what the number is a count of, not shown a progress meter. */
.d1-led-census.is-partial {
  border-color: rgba(252, 211, 77, 0.28); background: rgba(252, 211, 77, 0.05);
}
.d1-led-n.is-partial { color: #f4e4bd; }
.d1-led-n.is-partial b { color: #fde68a; }
.d1-led-part {
  margin: 0.35rem 0 0; font-size: 0.76rem; line-height: 1.6; color: #d6c9a8;
}
/* The unfetched people rows, in the same weight as the disclosure above them: it
   is a sentence about the REQUEST, so it reads as the same kind of thing as
   "not the count for this key" and not as a finding about the issue. */
.d1-led-pend {
  margin: 0.35rem 0 0; font-size: 0.78rem; line-height: 1.6; color: #e3d6b4;
}
.d1-led-pend b { color: #fde68a; }
/* The bands nobody has come back for yet. Quieter than the split above it,
   because it is a statement about what is missing rather than a count. */
.d1-led-soon {
  margin: 0.35rem 0 0; font-size: 0.74rem; line-height: 1.6; color: #9fb2cc;
}
.d1-led-sofar { color: #d6c9a8; }
/* A read that landed SHORT. Amber like the waiting copy above it, because it is
   the same class of statement — a fact about the fetch rather than a finding
   about the issue — but with a rule down its edge, because it is the one of the
   three that does not resolve on its own. Left-marked and not tinted or boxed: it
   qualifies the census it sits under, and a filled panel would read as a warning
   about the ISSUE. */
.d1-led-trunc {
  margin: 0.4rem 0 0; padding: 0 0 0 0.55rem; font-size: 0.76rem; line-height: 1.6;
  color: #e3d6b4; border-left: 2px solid rgba(252, 211, 77, 0.4);
}

/* ── THE FILTER ROW ────────────────────────────────────────────────────────
   Above the bands, and deliberately quieter than they are: chips read as a way
   to ask this list a question, not as a second heading competing with the band
   that answers it. A pressed chip takes the blue the rest of this desk gives to
   controls a reader has turned on. No chip here is coloured by side, by tone or
   by team — the chips are counts, and a count has no side. */
.d1-led-slice {
  margin-top: 0.9rem; padding: 0.6rem 0.7rem; border-radius: 0.8rem;
  background: rgba(255, 255, 255, 0.025); border: 1px solid rgba(255, 255, 255, 0.09);
  display: grid; gap: 0.45rem;
}
.d1-led-sl { margin: 0; font-size: 0.71rem; line-height: 1.55; color: #8fa2bd; }
/* The chips' own disclosure while the read is out: the same amber the partial
   census wears, so a reader who has read the headline recognises the claim. */
.d1-led-slpart {
  margin: 0; font-size: 0.71rem; line-height: 1.55; color: #d6c9a8;
}
.d1-led-cg { display: flex; flex-wrap: wrap; align-items: center; gap: 0.35rem 0.4rem; }
.d1-led-cgl, .d1-led-nml {
  flex: none; font-family: 'Barlow Condensed', sans-serif; font-weight: 700;
  font-size: 0.66rem; letter-spacing: 0.11em; text-transform: uppercase;
  color: #7f93b0; min-width: 4.4rem;
}
.d1-led-chip {
  min-height: 30px; cursor: pointer; padding: 0.18rem 0.5rem; border-radius: 99px;
  font-size: 0.72rem; color: #cbd5e1;
  background: rgba(255, 255, 255, 0.04); border: 1px solid rgba(255, 255, 255, 0.13);
}
.d1-led-chip:hover { background: rgba(255, 255, 255, 0.08); color: #e8eefb; }
.d1-led-chip.is-on {
  color: #dbeafe; background: rgba(96, 165, 250, 0.16); border-color: rgba(147, 197, 253, 0.45);
}
.d1-led-cn { font-variant-numeric: tabular-nums; font-weight: 700; opacity: 0.8; }
.d1-led-chip.is-on .d1-led-cn { opacity: 1; }
.d1-led-nm {
  flex: 1 1 9rem; min-width: 0; min-height: 30px;
  padding: 0.2rem 0.5rem; border-radius: 0.5rem; font-size: 0.76rem; color: #e8eefb;
  background: rgba(0, 0, 0, 0.22); border: 1px solid rgba(255, 255, 255, 0.14);
}
.d1-led-nm::placeholder { color: #7f93b0; }
.d1-led-clear {
  flex: none; min-height: 30px; cursor: pointer; padding: 0.18rem 0.5rem;
  border-radius: 0.5rem; font-size: 0.7rem; color: #dbeafe;
  background: transparent; border: 1px solid rgba(147, 197, 253, 0.35);
}
.d1-led-clear:hover { background: rgba(96, 165, 250, 0.14); }
.d1-led-sn {
  margin: 0; font-size: 0.72rem; line-height: 1.55; color: #a9bcd6;
  font-variant-numeric: tabular-nums;
}
.d1-led-sn:empty { display: none; }
/* A row outside the slice is HIDDEN, never removed — see the wall over
   sliceApply. The flex display on .d1-led-p wins over the attribute on its own,
   so the attribute is given the last word here. A band whose rows are all
   hidden closes the same way, and its rows are still in the document. */
.d1-led-p[hidden], .d1-led-band[hidden], .d1-led-tail[hidden], .d1-led-more[hidden] {
  display: none !important;
}

.d1-led-band { margin-top: 1rem; }
.d1-led-bh { display: flex; align-items: baseline; gap: 0.45rem; }
.d1-led-bt {
  font-family: 'Barlow Condensed', sans-serif; font-weight: 800;
  font-size: 0.82rem; letter-spacing: 0.1em; text-transform: uppercase; color: #e8eefb;
}
.d1-led-bn {
  font-size: 0.68rem; font-weight: 700; color: #a3b3c9;
  padding: 0.1rem 0.4rem; border-radius: 99px;
  background: rgba(255, 255, 255, 0.06); border: 1px solid rgba(255, 255, 255, 0.12);
}
.d1-led-bnote { margin: 0.2rem 0 0; font-size: 0.73rem; line-height: 1.55; color: #8fa2bd; }
.d1-led-people { list-style: none; margin: 0.5rem 0 0; padding: 0; display: grid; gap: 0.45rem; }
.d1-led-p {
  display: flex; flex-wrap: wrap; align-items: baseline; gap: 0.3rem 0.55rem;
  padding: 0.55rem 0.7rem; border-radius: 0.7rem;
  background: rgba(255, 255, 255, 0.03); border: 1px solid rgba(255, 255, 255, 0.09);
}
.d1-led-hd { flex: 1 1 12rem; min-width: 0; display: flex; flex-wrap: wrap; align-items: baseline; gap: 0.3rem 0.45rem; }
.d1-led-a {
  min-height: 32px; display: inline-flex; align-items: center;
  font-family: 'Barlow Condensed', sans-serif; font-weight: 700;
  font-size: 0.9rem; letter-spacing: 0.02em; color: #fff; text-decoration: none;
  background: transparent; border: 0; cursor: pointer; padding: 0;
}
.d1-led-a:hover { color: #93c5fd; }
.d1-led-o { font-size: 0.7rem; color: #8fa2bd; }
/* The pattern chip. Its tone is the formal-pattern index's own tone for the row,
   quoted, so the chip here and the chip on the person file read the same. */
.d1-led-pat {
  flex: none; font-size: 0.74rem; line-height: 1.4; font-weight: 600;
  padding: 0.2rem 0.5rem; border-radius: 0.5rem;
  color: #cbd5e1; background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(255, 255, 255, 0.12);
}
.d1-led-pat.is-support { color: #bbf7d0; background: rgba(74, 222, 128, 0.1); border-color: rgba(74, 222, 128, 0.28); }
.d1-led-pat.is-oppose  { color: #fecaca; background: rgba(248, 113, 113, 0.1); border-color: rgba(248, 113, 113, 0.28); }
.d1-led-pat.is-mixed   { color: #fde68a; background: rgba(251, 191, 36, 0.1); border-color: rgba(251, 191, 36, 0.28); }
.d1-led-t { font-weight: 400; font-variant-numeric: tabular-nums; opacity: 0.9; }
.d1-led-say {
  flex: none; font-size: 0.68rem; color: #a5b4fc;
  padding: 0.16rem 0.4rem; border-radius: 0.45rem;
  background: rgba(129, 140, 248, 0.1); border: 1px solid rgba(129, 140, 248, 0.26);
}
.d1-led-veh { flex: 1 1 100%; font-size: 0.7rem; line-height: 1.5; color: #d6c9a8; }
.d1-led-go {
  flex: none; min-height: 32px; padding: 0.25rem 0.55rem; border-radius: 0.55rem;
  cursor: pointer; font-size: 0.7rem; color: #dbeafe;
  background: transparent; border: 1px solid rgba(147, 197, 253, 0.35);
}
.d1-led-go:hover { background: rgba(96, 165, 250, 0.14); }

/* The tail arrives closed and says what is inside it. Closed is not hidden: every
   row is in the document, so a find-in-page and a deep link still land. */
.d1-led-tail { margin-top: 1rem; }
.d1-led-tsum {
  cursor: pointer; list-style: none; padding: 0.5rem 0.7rem; border-radius: 0.7rem;
  font-size: 0.76rem; color: #a9bcd6;
  background: rgba(255, 255, 255, 0.03); border: 1px dashed rgba(255, 255, 255, 0.16);
}
.d1-led-tsum::-webkit-details-marker { display: none; }
.d1-led-tsum b { color: #e8eefb; }

/* The rest of one band. Quieter than the tail summary because it is not a
   different reading — it is the same band, continued, in the same order. */
.d1-led-more { margin: 0.4rem 0 0; }
.d1-led-msum {
  cursor: pointer; list-style: none; padding: 0.35rem 0.6rem; border-radius: 0.6rem;
  font-size: 0.72rem; color: #92a6c2;
  background: rgba(255, 255, 255, 0.025); border: 1px dashed rgba(255, 255, 255, 0.13);
}
.d1-led-msum::-webkit-details-marker { display: none; }
.d1-led-more[open] .d1-led-msum { margin-bottom: 0.4rem; }

.d1-led-meas { margin-top: 1.1rem; }
/* ── The measure list, banded by the label on the card ──────────────────────
   Same heading furniture as a people band, deliberately: one pane, one idea of
   what a band looks like. Quieter than the people bands above it — this is an
   inventory of what was on the table rather than a reading of who did what with
   it — so a measure band gets no tone, no colour and no state. Its own class
   name is what keeps the people slice's walk (over .d1-led-band and .d1-led-p)
   from ever reaching a card in here. */
.d1-led-mband { margin-top: 0.9rem; }
/* The rest of one band. Same control as the people bands' overflow, and each
   band carries its own — opening one leaves the others where the reader left
   them, because they are separate <details> and always were. */
.d1-led-bmore { margin: 0.4rem 0 0; }
.d1-led-bmsum {
  cursor: pointer; list-style: none; padding: 0.35rem 0.6rem; border-radius: 0.6rem;
  font-size: 0.72rem; color: #92a6c2;
  background: rgba(255, 255, 255, 0.025); border: 1px dashed rgba(255, 255, 255, 0.13);
}
.d1-led-bmsum::-webkit-details-marker { display: none; }
.d1-led-bmore[open] .d1-led-bmsum { margin-bottom: 0.4rem; }
.d1-led-bills { list-style: none; margin: 0.5rem 0 0; padding: 0; display: grid; gap: 0.45rem; }
.d1-led-b {
  display: flex; flex-wrap: wrap; align-items: baseline; gap: 0.3rem 0.55rem;
  padding: 0.55rem 0.7rem; border-radius: 0.7rem;
  background: rgba(255, 255, 255, 0.03); border: 1px solid rgba(255, 255, 255, 0.09);
}
/* ── A MEASURE IDENTITY THAT IS A DOOR ──────────────────────────────────────
   Declared ABOVE the slots that use it, at the same one-class depth, so each
   slot keeps ownership of its own type: this rule only removes the browser's
   button chrome. The dotted underline is the whole of the visual change — a
   number that changed weight or colour on becoming tappable would be a restyle
   dressed as a feature. */
.d1-bdoor {
  background: none; border: 0; padding: 0; margin: 0; font: inherit; color: inherit;
  cursor: pointer; text-align: left;
  text-decoration: underline; text-decoration-style: dotted;
  text-decoration-color: rgba(147, 197, 253, 0.5); text-underline-offset: 2px;
}
.d1-bdoor:hover { color: #bfdbfe; text-decoration-color: #93c5fd; }
.d1-bdoor:focus-visible { outline: 2px solid #93c5fd; outline-offset: 2px; border-radius: 0.25rem; }
.d1-bdoor[data-d1-nofile] { cursor: default; text-decoration: none; }
/* The button is the flex item the span used to be, so it takes the span's own
   flex terms: the number never shrinks, the title takes the rest of the line and
   is allowed to wrap. Stated here rather than left to inheritance, because flex
   properties do not inherit and a title that lost `flex: 1 1 12rem` would sit on
   its own line under every card. */
.d1-led-b > .d1-bdoor.is-num { flex: none; }
.d1-led-b > .d1-bdoor.is-ttl { flex: 1 1 12rem; min-width: 0; }
/* The honest refusal, on the control the reader tapped and nowhere else. Amber
   because it is a coverage gap, not a verdict; inline because the number it is
   about has to stay beside it. */
.d1-nofile {
  display: inline-block; margin-left: 0.35rem;
  font-size: 0.6rem; font-weight: 700; letter-spacing: 0.02em; white-space: nowrap;
  color: #fde68a; padding: 0.02rem 0.3rem; border-radius: 0.35rem;
  background: rgba(251, 191, 36, 0.1); border: 1px solid rgba(251, 191, 36, 0.3);
}
.d1-led-bnum {
  flex: none; font-family: 'Oswald', sans-serif; font-weight: 700;
  font-size: 0.84rem; color: #fff; letter-spacing: 0.02em;
}
.d1-led-btitle { flex: 1 1 12rem; min-width: 0; font-size: 0.76rem; line-height: 1.45; color: #cbd5e1; }
/* PRIMARY vs provision is a label on the bill. It is printed and it is read by
   nothing — no count, band or order on this pane consults it. */
.d1-led-btag {
  flex: none; font-size: 0.58rem; letter-spacing: 0.1em; text-transform: uppercase;
  font-weight: 700; color: #a3b3c9;
  padding: 0.16rem 0.38rem; border-radius: 0.4rem;
  background: rgba(255, 255, 255, 0.05); border: 1px solid rgba(255, 255, 255, 0.12);
}
.d1-led-btag.is-primary { color: #bfdbfe; background: rgba(96, 165, 250, 0.12); border-color: rgba(96, 165, 250, 0.32); }
/* Floor machinery, marked. Amber is the vehicle lane's ink on this desk (see
   .d1-led-veh) and this is the same kind of fact: what the act was ON, never a
   judgement of the act. It sits beside the PRIMARY-or-provision tag rather than
   replacing it, because a measure's label does not change when machinery is
   what reached it. */
.d1-led-btag.is-proc { color: #fde68a; background: rgba(251, 191, 36, 0.1); border-color: rgba(251, 191, 36, 0.3); }
/* The folded twin's disclosure. Full width under the tags, because it is a
   sentence about the row and not another pill on it. */
.d1-led-balt { flex: 1 1 100%; font-size: 0.68rem; line-height: 1.5; color: #9fb2cc; }
.d1-led-bwho { flex: 1 1 100%; display: flex; flex-wrap: wrap; gap: 0.2rem 0.7rem; }
.d1-led-w { font-size: 0.7rem; line-height: 1.5; color: #9fb2cc; }
.d1-led-wall {
  margin: 1rem 0 0; padding-top: 0.7rem; font-size: 0.7rem; line-height: 1.6; color: #7d8ea8;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
}

/* ── Measure mode ─────────────────────────────────────────────────────────── */
.d1-meas { margin-top: 0.85rem; }
.d1-meas-n {
  margin: 0; font-family: 'Oswald', sans-serif; font-weight: 700;
  font-size: 1.15rem; color: #fff; letter-spacing: 0.02em;
}
.d1-meas-t { margin: 0.15rem 0 0; font-size: 0.86rem; line-height: 1.45; color: #cbd5e1; }
/* The stowaway note. Marked, quietly, as a fact about the vehicle — the note
   itself is the floor vocabulary's own sentence about packages. */
.d1-stow {
  margin: 0.7rem 0 0; padding: 0.65rem 0.75rem; border-radius: 0.7rem;
  background: rgba(251, 191, 36, 0.07); border: 1px solid rgba(251, 191, 36, 0.22);
}
.d1-stow-t {
  display: block; font-family: 'Barlow Condensed', sans-serif; font-weight: 800;
  font-size: 0.62rem; letter-spacing: 0.14em; text-transform: uppercase; color: #fcd34d;
  margin-bottom: 0.25rem;
}
.d1-stow-n { display: block; font-size: 0.76rem; line-height: 1.6; color: #d6c9a8; }

/* ── The footer: one control ──────────────────────────────────────────────── */
/* One control, and it advances to a mode. There is no bar, no fill and no
   figure here — nothing on this desk is a quantity that could be part-done. */
.d1-foot {
  margin-top: 1.1rem; padding-top: 0.85rem;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
}
.d1-next {
  min-height: 44px; display: inline-flex; align-items: center; gap: 0.4rem;
  padding: 0.6rem 1rem; border-radius: 0.75rem; cursor: pointer;
  font-family: 'Barlow Condensed', sans-serif; font-weight: 700;
  font-size: 0.84rem; letter-spacing: 0.05em; text-transform: uppercase;
  color: #78350f; background: linear-gradient(135deg, #fcd34d, #f59e0b);
  border: 0;
}
.d1-next:hover { filter: brightness(1.06); }

/* ═══════════════════════════════════════════════════════════════════════════
   VIEW CHROME · the four old Door 1 surfaces
   ────────────────────────────────────────────────────────────────────────────
   Same treatment, and the same reasoning, as .d2-view-strip: the quietest band
   in Door 1. Flat, unfilled, one hairline below it, no gradient and no glow.
   Every other header on these surfaces is a heading, and a heading here would be
   the fifth competing title the strip exists to dissolve. It reads as a label ON
   the section, not as a section of its own.
   ═══════════════════════════════════════════════════════════════════════════ */
.d1-strip-slot { display: block; }

.d1-view-strip {
  display: flex; align-items: baseline; flex-wrap: wrap;
  gap: 0.4rem 0.7rem;
  padding: 0 0 0.6rem; margin: 0 0 0.85rem;
  border-bottom: 1px solid rgba(255, 255, 255, 0.09);
  font-family: 'Barlow Condensed', sans-serif; line-height: 1.25;
}
/* What this surface is a view of. The only uppercase element in the strip, so
   the eye reads the relationship first and the detail second. */
.d1-view-kick {
  flex: none; font-size: 0.6rem; font-weight: 800;
  letter-spacing: 0.16em; text-transform: uppercase; color: #7f92b4;
}
.d1-view-kick::after { content: "·"; margin-left: 0.55rem; opacity: 0.5; }
/* The job this view does that the desk does not. Sentence case, normal weight —
   it is a description, not a claim. */
.d1-view-job {
  flex: 1 1 14rem; min-width: 0;
  font-family: 'Barlow', sans-serif; font-size: 0.8rem; font-weight: 400;
  color: #9fb4d4;
}
/* What the collapsed chapter was called. Sized like body text and not like a
   heading: it is the section's own title quoted inside a label, and a title that
   competed with the desk's would put the product back. */
.d1-view-name {
  flex: none; max-width: 100%; min-width: 0;
  font-size: 0.9rem; font-weight: 700; letter-spacing: 0.005em;
  color: #dbe6f7;
}
/* The one control. A real control at a real size, because on a collapsed section
   it is the only thing a reader can do — but outlined in steel, so it never
   out-shouts the desk it points at. */
.d1-view-open {
  flex: none; min-height: 36px; display: inline-flex; align-items: center;
  padding: 0.35rem 0.65rem; border-radius: 0.6rem; cursor: pointer;
  font-family: 'Barlow Condensed', sans-serif; font-weight: 700;
  font-size: 0.72rem; letter-spacing: 0.06em; text-transform: uppercase;
  color: #cbd5e1; background: transparent;
  border: 1px solid rgba(255, 255, 255, 0.2);
}
.d1-view-open:hover { color: #fff; border-color: rgba(96, 165, 250, 0.5); }
.d1-view-open:focus-visible { outline: 2px solid #7fb4ff; outline-offset: 2px; }

/* ═══════════════════════════════════════════════════════════════════════════
   THE COLLAPSE · a view is one line, once the desk exists
   ────────────────────────────────────────────────────────────────────────────
   THIS IS THE WHOLE MECHANISM. door1-workspace.js sets one attribute on each of
   its four sections, and only after sync() has actually painted a desk. Nothing
   is emptied, detached or re-parented: the bodies are still in the document,
   still addressable by id, still paintable by the modules that own them, and a
   reader who opens the section in devtools finds every word of it.

   WHY AN ATTRIBUTE AND NOT A CLASS ON EACH ID. The four ids are not this
   stylesheet's to know — index.html owns them and door1-workspace.js owns the
   list. Keying off the attribute means the rule cannot drift out of step with
   VIEWS, and it cannot reach anything VIEWS does not name.

   WHY THIS IS SAFE WITH NO JS. No script, no attribute, no rule — the four
   sections stand exactly as the static HTML ships them. Expanded-in-place is
   the no-JS state, deliberately.

   THE :not() IS THE CONTRACT. Everything except the stub slot goes. If a future
   pass adds a second child that must survive the collapse, it has to say so
   here, out loud, rather than by accident.
   ═══════════════════════════════════════════════════════════════════════════ */
[data-door1-collapsed="1"] > *:not(.d1-strip-slot) {
  display: none !important;
}
/* The section's own frame collapses with its body. These four carry generous
   chapter padding and, on two of them, a minimum height sized for a full
   product; a one-line stub inside a 60vh box would read as a broken section
   rather than a label. The strip already draws its own hairline, so the
   section's bottom rule is the one that goes. */
[data-door1-collapsed="1"] {
  min-height: 0 !important;
  padding-top: 0.85rem !important;
  padding-bottom: 0.1rem !important;
  margin-bottom: 0 !important;
}
/* Nothing below the strip, so nothing for the strip to be separated FROM. */
[data-door1-collapsed="1"] .d1-view-strip {
  margin-bottom: 0;
  border-bottom: 0;
}

@media (prefers-reduced-motion: reduce) {
  .d1-mode, .d1-next { transition: none; }
}