/* ═══════════════════════════════════════════════════════════════════════════════════════════
   portal-truth.css — the client portal's DESIGN GROUND TRUTH (2026-09-27, owner-approved)
   ═══════════════════════════════════════════════════════════════════════════════════════════

   WHAT THIS IS. The owner approved the portal rulebook part by part on localhost:5195
   (_prototypes/design-truth/src/data-portal.js, 29 parts: rule · drawn example · values ·
   "now" = what the portal still did differently). This sheet is where the "now" lines are
   fixed for the places the Direction 6 layer (portal-d6.css) never reached — the pop-ups
   (app/scripts/evorrah-dialog.js), the header menus, the event switcher, the Updates drawer,
   the toasts and the phone's ☰ — plus the few room-level rulings the census now measures.

   ── ONE TOKEN BLOCK, READ BY THE CENSUS ──────────────────────────────────────────────────
   The block below is the ONE place the rulebook's numbers live. Every rule in this file reads
   it, and scripts/lib/portal-one-format-probe.mjs `truthProbe()` reads it too: the `--pt-t-*`
   sizes are the only type sizes the census accepts (kind `ladder`), `--pt-c-*` / `--pt-g-*` the
   only inks and grounds (kind `palette`). The owner picked type Way A and colour Way A on
   2026-09-27; the literal sweep of portal-d6.css / portal-nav.css / portal-v15.css onto these
   tokens follows once the portal branches ahead of it have landed.

   ── THE RULES OF THIS FILE (the layer's own four, portal-d6.css:17-28) ───────────────────
   1. Every selector begins `body.d6` (or `html body.d6` where a v15 rule has to be out-ranked).
   2. No raw hex: chapter-08 / d6 token names, `transparent`, `currentColor`, `color-mix()`.
   3. No forced declarations — except where a module writes the look inline (style="…"), which
      no stylesheet reaches any other way. Each such line says so.
   4. No transition and no shadow — except the one pop-up shadow.

   It loads AFTER portal-d6.css (test/portal-v15-touch-floor.test.mjs case 5 names it, with the
   same proof it asks of the layer: it sizes none of the controls the owner measured on a phone).
   ═══════════════════════════════════════════════════════════════════════════════════════════ */

body.d6 {
  /* ══ DESIGN TRUTH — owner 09-27 ("do your picks then and implement", 19:58Z) ═══════════════
     Type: Way A, the CRM's ladder. Colour: portal Way A (pcol-a), eight. The census judges the
     whole portal against exactly these values (kinds `ladder` and `palette`). */

  /* ── TYPE · five sizes, no others. Serif (Crimson Pro 400) for the page title, a figure, a
     panel title and a pop-up title; Inter for everything else. */
  --pt-t-page: 24px;                /* page title (a phone too), a big figure */
  --pt-t-panel: 17px;               /* panel title, pop-up title, the Vision question */
  --pt-t-body: 14px;                /* row title (500), body, a menu option */
  --pt-t-small: 12.5px;             /* second line, button, field, label, note, toast */
  --pt-t-label: 11px;               /* pill, count, table head (600, uppercase), the rail's groups */

  /* ── COLOUR · eight, and three signals. The two new values are declared here and nowhere else. */
  --pt-sand: #F2EADF;               /* the one tint: menu, table heads, filter bar */
  --pt-soft-ink: #5C5955;           /* the one soft ink: 6.86:1 on paper, 5.84:1 on sand */
  /* the inks a client may read */
  --pt-c-ink: var(--ch8-onyx);               /* Ink #141414 — what you read first */
  --pt-c-soft: var(--pt-soft-ink);           /* Soft ink — second lines, hints, labels, counts */
  --pt-c-mark: var(--ch8-bordeaux);          /* Bordeaux — where you are, links */
  --pt-c-hot: var(--ch8-crimson);            /* Crimson — waiting on you, and every error */
  --pt-c-good: var(--ch8-signal-approve);    /* Green — done, selected */
  --pt-c-warn: var(--ch8-amber);             /* Amber — waiting */
  --pt-c-on-dark: var(--ch8-linen);          /* words on the dark button and the toast */
  --pt-c-on-dark-paper: var(--d6-paper);     /* the paper words some dark buttons carry */
  /* the grounds anything may be painted with */
  --pt-g-linen: var(--ch8-linen);            /* the page */
  --pt-g-paper: var(--d6-paper);             /* panels, fields, buttons, menus, pop-ups */
  --pt-g-sand: var(--pt-sand);               /* menu, table heads, filter bar, a neutral pill */
  --pt-g-ink: var(--ch8-onyx);               /* the one dark button, the toast */
  --pt-g-line: var(--ch8-onyx-20);           /* Line #CAC5BD — a bar's track */
  /* the signals' own washes on paper (a pill's ground, the one selected look) */
  --pt-g-good-6: color-mix(in srgb, var(--ch8-signal-approve) 6%, var(--d6-paper));  /* selected; the done pill (4.75:1) */
  --pt-g-warn-12: color-mix(in srgb, var(--ch8-amber) 12%, var(--d6-paper));         /* the waiting pill (4.57:1) */
  --pt-g-hot-10: color-mix(in srgb, var(--ch8-crimson) 10%, var(--d6-paper));        /* "waiting on you", an error pill (6.93:1) */
  --pt-g-hot: var(--ch8-crimson);            /* the one crimson strip: a guest save that failed (linen words, 7.6:1) — never a button */

  /* ── the rest of the rulebook's numbers */
  --pt-err: var(--ch8-crimson);              /* errors are crimson — the separate error red is gone */
  --pt-empty: var(--pt-soft-ink);            /* the empty-state sentence */
  --pt-ring: var(--ch8-crimson);             /* the focus ring */
  --pt-focus-w: 2px;
  --pt-focus-offset: 2px;
  --pt-ctl-h: 30px;                          /* a control with a mouse, above 640px */
  --pt-ctl-h-touch: 44px;                    /* a control on a phone or a touch screen */
  --pt-tick-touch: 24px;                     /* a tick box on a phone */
  --pt-disabled: .45;                        /* disabled = faded, with the reason beside it */
}

/* ══ 1 · THE LAYER'S OWN TOKENS, RE-POINTED AT THE PICK ═══════════════════════════════════════
   portal-d6.css declares its tokens on `body.d6`; this block is the same selector and loads
   later, so every d6 rule that reads a token now draws the owner's values — without editing the
   layer (the literal sweep of its px and hex values waits for the branches ahead of it). The
   chapter-08 names the older sheets read are re-pointed the same way, inside the portal only. */
body.d6 {
  --d6-t-page: var(--pt-t-page);
  --d6-t-panel: var(--pt-t-panel);
  --d6-t-row: var(--pt-t-body);
  --d6-t-base: var(--pt-t-body);
  --d6-t-sec: var(--pt-t-small);
  --d6-t-strip: var(--pt-t-small);
  --d6-t-count: var(--pt-t-label);
  --d6-t-chip: var(--pt-t-label);
  --d6-t-th: var(--pt-t-label);
  --d6-ink-2: var(--pt-soft-ink);
  --d6-ink-3: var(--pt-soft-ink);
  --d6-line-2: var(--ch8-onyx-20);
  --d6-wash: var(--pt-sand);
  --d6-plate: var(--pt-g-ink);               /* the selected-guests plate is the one dark, not its own #221E1C */
  --d6-band: var(--pt-sand);
  --d6-flash: var(--pt-g-hot-10);
  --d6-hot-ring: color-mix(in srgb, var(--ch8-crimson) 30%, var(--d6-paper));   /* the hot count's ring, as drawn */
  --d6-bad: var(--ch8-crimson);
  --ch8-alabaster: var(--pt-sand);
  --ch8-onyx-78: var(--pt-soft-ink);
  --ch8-onyx-62: var(--pt-soft-ink);
  --ch8-onyx-12: var(--ch8-onyx-20);
  --ch8-signal-revise: var(--ch8-crimson);
  --ch8-terracotta: var(--ch8-crimson);
  --ch8-moss: var(--ch8-signal-approve);
  /* the older sheets' own names, inside the portal: links are bordeaux (bloodstone drew them
     crimson); the undeclared quiet inks the modules fall back from are the soft ink */
  --bloodstone: var(--ch8-bordeaux);
  --muted: var(--pt-soft-ink);
  --ash: var(--pt-soft-ink);
  --text-2: var(--pt-soft-ink);
  --red: var(--ch8-crimson);
}

/* ══ 2 · THE HOUSE POP-UP (app/scripts/evorrah-dialog.js, data-format="d6") ══════════════════
   The rulebook's pop-up: a panel — paper, the line, square, the one modal shadow — with a serif
   title and a ×, the words at the body size, and the buttons on a rule at the bottom right. */
body.d6 #portalConfirmOverlay[data-format="d6"] .pdlg {
  display: flex; flex-direction: column;
  width: min(480px, 100%); max-height: calc(100vh - 48px); overflow-y: auto; box-sizing: border-box;
  background: var(--pt-g-paper); border: 1px solid var(--ch8-onyx-20); border-radius: 0;
  box-shadow: 0 18px 50px color-mix(in srgb, var(--ch8-onyx) 24%, transparent);
  font: 400 var(--pt-t-body)/1.45 var(--d6-sans); color: var(--pt-c-ink); text-align: left;
}
body.d6 #portalConfirmOverlay[data-format="d6"] .pdlg-head {
  display: flex; align-items: center; gap: 8px;
  padding: 12px 14px; border-bottom: 1px solid var(--ch8-onyx-20);
}
body.d6 #portalConfirmOverlay[data-format="d6"] .pdlg-title {
  flex: 1; margin: 0;
  font: 400 var(--pt-t-panel)/1.2 var(--d6-serif); letter-spacing: 0; text-transform: none; color: var(--pt-c-ink);
}
body.d6 #portalConfirmOverlay[data-format="d6"] .pdlg-x {
  flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center;
  min-width: var(--pt-ctl-h); min-height: var(--pt-ctl-h); padding: 0; margin: -6px -8px -6px 0;
  border: 0; border-radius: 2px; background: transparent;
  font: 400 var(--pt-t-body)/1 var(--d6-sans); color: var(--pt-c-soft); cursor: pointer;
}
body.d6 #portalConfirmOverlay[data-format="d6"] .pdlg-x:hover { color: var(--pt-c-ink); }
body.d6 #portalConfirmOverlay[data-format="d6"] .pdlg-body { padding: 10px 14px 12px; }
body.d6 #portalConfirmOverlay[data-format="d6"] .pdlg-msg {
  margin: 0 0 10px; font-size: var(--pt-t-body); line-height: 1.45; color: var(--pt-c-ink); white-space: pre-line;
}
body.d6 #portalConfirmOverlay[data-format="d6"] .pdlg-msg:last-child { margin-bottom: 0; }
body.d6 #portalConfirmOverlay[data-format="d6"] .pdlg-lab {
  display: block; margin: 0 0 4px;
  font: 400 var(--pt-t-small)/1.3 var(--d6-sans); letter-spacing: 0; text-transform: none; color: var(--pt-c-soft);
}
body.d6 #portalConfirmOverlay[data-format="d6"] .pdlg-field {
  display: block; width: 100%; box-sizing: border-box; min-height: var(--pt-ctl-h); margin: 0 0 10px; padding: 5px 10px;
  border: 1px solid var(--ch8-onyx-20); border-radius: 2px; background: var(--pt-g-paper);
  font: 400 var(--pt-t-small)/1.3 var(--d6-sans); color: var(--pt-c-ink); outline: 0;   /* the drawn field: 12.5px (owner value, rulebook fixed 09-29) */
}
body.d6 #portalConfirmOverlay[data-format="d6"] textarea.pdlg-field { min-height: 74px; padding: 8px 10px; line-height: 1.45; resize: vertical; }
body.d6 #portalConfirmOverlay[data-format="d6"] .pdlg-field:focus { outline: var(--pt-focus-w) solid var(--pt-ring); outline-offset: var(--pt-focus-offset); }
body.d6 #portalConfirmOverlay[data-format="d6"] .pdlg-field::placeholder { color: var(--pt-c-soft); }
body.d6 #portalConfirmOverlay[data-format="d6"] .pdlg-hint { margin: 0 0 10px; font-size: var(--pt-t-small); line-height: 1.45; color: var(--pt-err); }
body.d6 #portalConfirmOverlay[data-format="d6"] .pdlg-foot {
  display: flex; flex-wrap: wrap; justify-content: flex-end; align-items: center; gap: 8px;
  margin-top: auto; padding: 8px 12px 10px; border-top: 1px solid var(--ch8-onyx-20);
}
body.d6 #portalConfirmOverlay[data-format="d6"] :is(.pdlg-ok, .pdlg-cancel, .pdlg-copy) {
  display: inline-flex; align-items: center; justify-content: center;
  min-height: var(--pt-ctl-h); padding: 0 11px; box-sizing: border-box;
  border: 1px solid var(--ch8-onyx-20); border-radius: 2px; background: var(--pt-g-paper);
  font: 400 var(--pt-t-small)/1.2 var(--d6-sans); letter-spacing: 0; text-transform: none; color: var(--pt-c-ink);
  white-space: nowrap; cursor: pointer; box-shadow: none;
}
body.d6 #portalConfirmOverlay[data-format="d6"] :is(.pdlg-ok, .pdlg-cancel, .pdlg-copy):hover { border-color: var(--pt-c-soft); }
/* the action is the one dark button; Copy is the copy pop-up's action */
body.d6 #portalConfirmOverlay[data-format="d6"] :is(.pdlg-ok:not([data-tone]):not([data-style]), .pdlg-copy) {
  background: var(--pt-g-ink); border-color: var(--pt-g-ink); color: var(--pt-c-on-dark);
}
body.d6 #portalConfirmOverlay[data-format="d6"] :is(.pdlg-ok:not([data-tone]):not([data-style]), .pdlg-copy):hover { background: var(--d6-onyx-hover); border-color: var(--d6-onyx-hover); }
/* a removing action: white, crimson words, a 45% crimson edge — never a crimson block */
body.d6 #portalConfirmOverlay[data-format="d6"] .pdlg-ok[data-tone="danger"] {
  color: var(--pt-err); border-color: color-mix(in srgb, var(--pt-err) 45%, var(--pt-g-paper));
}
body.d6 #portalConfirmOverlay[data-format="d6"] .pdlg-copy { margin: 0 0 4px; }
body.d6 #portalConfirmOverlay[data-format="d6"] button:disabled { opacity: var(--pt-disabled); cursor: not-allowed; }
body.d6 #portalConfirmOverlay[data-format="d6"] button:focus-visible { outline: var(--pt-focus-w) solid var(--pt-ring); outline-offset: var(--pt-focus-offset); }
/* a phone or a touch screen: 44px (portal.css already floors #portalConfirmOverlay's buttons there) */
@media (max-width: 640px), (pointer: coarse) {
  body.d6 #portalConfirmOverlay[data-format="d6"] :is(.pdlg-ok, .pdlg-cancel, .pdlg-copy, .pdlg-x) { min-height: var(--pt-ctl-h-touch); }
  body.d6 #portalConfirmOverlay[data-format="d6"] .pdlg-x { min-width: var(--pt-ctl-h-touch); }
  body.d6 #portalConfirmOverlay[data-format="d6"] .pdlg-field { min-height: var(--pt-ctl-h-touch); font-size: 16px; }   /* 16px: iOS zooms a field under it */
}

/* ══ 3 · THE HEADER MENUS AND THE EVENT SWITCHER ══════════════════════════════════════════════
   The rulebook's menu: a small panel — paper, the line, no shadow — with a heading (who you are,
   or "Your events") and plain options in sentence case at the body size. `html body.d6` out-ranks
   portal-v15.css's QUIET MENUS block (`html body .portal-hdr …`), which set them in spaced
   capitals with a drop shadow (and the owner's 09-24 "keep uppercase buttons", superseded 09-25). */
html body.d6 .portal-hdr .hdr-account-dropdown,
html body.d6 .portal-hdr #hdrEventSwitcher .hdr-event-dropdown {
  min-width: 260px; padding: 0;
  background: var(--pt-g-paper); border: 1px solid var(--ch8-onyx-20); border-radius: 0; box-shadow: none;
}
html body.d6 .portal-hdr .hdr-account-head { padding: 10px 14px; border-bottom: 1px solid var(--ch8-onyx-20); }
html body.d6 .portal-hdr .hdr-account-who { font: 400 var(--pt-t-panel)/1.2 var(--d6-serif); letter-spacing: 0; text-transform: none; color: var(--pt-c-ink); }
html body.d6 .portal-hdr .hdr-account-mail { margin-top: 2px; font: 400 var(--pt-t-small)/1.35 var(--d6-sans); color: var(--pt-c-soft); }
html body.d6 .portal-hdr .hdr-account-dropdown .hdr-account-opt,
html body.d6 .portal-hdr #hdrEventSwitcher .hdr-event-dropdown .hdr-event-opt {
  padding: 9px 14px; border: 0; border-radius: 0; background: transparent;
  font: 400 var(--pt-t-body)/1.35 var(--d6-sans); letter-spacing: 0; text-transform: none; color: var(--pt-c-soft);
}
html body.d6 .portal-hdr .hdr-account-dropdown .hdr-account-opt:hover,
html body.d6 .portal-hdr #hdrEventSwitcher .hdr-event-dropdown .hdr-event-opt:hover { background: var(--pt-g-sand); color: var(--pt-c-ink); }
html body.d6 .portal-hdr .hdr-account-dropdown .hdr-account-sub,
html body.d6 .portal-hdr #hdrEventSwitcher .hdr-event-dropdown .hdr-event-opt-sub { font-size: var(--pt-t-small); letter-spacing: 0; text-transform: none; color: var(--pt-c-soft); }
html body.d6 .portal-hdr .hdr-account-dropdown .hdr-account-signout { border-top: 1px solid var(--ch8-onyx-20); color: var(--pt-c-soft); }
/* the event menu's heading: a small sentence, not 9px spaced capitals */
html body.d6 .portal-hdr #hdrEventSwitcher .hdr-event-dropdown::before {
  padding: 10px 14px; margin-bottom: 0; border-bottom: 1px solid var(--ch8-onyx-20);
  font: 400 var(--pt-t-small)/1.3 var(--d6-sans); letter-spacing: 0; text-transform: none; color: var(--pt-c-soft);
}
html body.d6 .portal-hdr #hdrEventSwitcher .hdr-event-dropdown .hdr-event-opt { padding-left: 14px; }
html body.d6 .portal-hdr #hdrEventSwitcher .hdr-event-dropdown .hdr-event-opt::before { position: static; display: inline-block; margin-right: 8px; vertical-align: 1px; }
/* the chips' small labels ("Event", "Signed in") on the desktop bar: the label size, sentence case */
@media (min-width: 701px) {
  html body.d6 .portal-hdr #hdrEventChip::before,
  html body.d6 .portal-hdr .hdr-client-chip::before {
    font: 400 var(--pt-t-label)/1.1 var(--d6-sans); letter-spacing: 0; text-transform: none; color: var(--pt-c-soft);
  }
}
/* the menu rows draw their ring inside (the rulebook: inside for menu items and tabs) */
html body.d6 .portal-hdr :is(.hdr-account-opt, .hdr-event-opt):focus-visible { outline: var(--pt-focus-w) solid var(--pt-ring); outline-offset: -2px; }

/* ══ 4 · THE BAR'S CONTROLS — the ☰ has no box; Help, search at the control height ══════════════ */
body.d6 .pn-burger { border: 0; border-radius: 0; background: transparent; }
body.d6 .portal-hdr #pnHelp, body.d6 .portal-hdr #pnFind { min-height: var(--pt-ctl-h); border-radius: 2px; }
:root.portal-signed-in body.d6 .portal-hdr #pnFind { min-height: var(--pt-ctl-h); }
@media (max-width: 640px), (pointer: coarse) {
  body.d6 .portal-hdr #pnHelp, body.d6 .portal-hdr #pnFind,
  :root.portal-signed-in body.d6 .portal-hdr #pnFind { min-height: var(--pt-ctl-h-touch); }
}

/* ══ 5 · THE UPDATES DRAWER ═══════════════════════════════════════════════════════════════════
   The Updates room's own parts: a serif panel title, rows, a grey sentence when empty, "Mark all
   read" as a link under the list, and the × bare. */
html body.d6 #inboxDrawer .inbox-hdr-title { font: 400 var(--pt-t-panel)/1.2 var(--d6-serif); letter-spacing: 0; text-transform: none; color: var(--pt-c-ink); }
html body.d6 #inboxDrawer .inbox-close { border: 0; border-radius: 2px; background: transparent; color: var(--pt-c-soft); min-width: var(--pt-ctl-h); min-height: var(--pt-ctl-h); }
html body.d6 #inboxDrawer .inbox-actions .inbox-mark-all {
  min-height: var(--pt-ctl-h); padding: 0 4px;
  font: 400 var(--pt-t-small)/1.2 var(--d6-sans); letter-spacing: 0; text-transform: none;
  color: var(--pt-c-mark); text-decoration: underline; text-decoration-color: currentColor; text-underline-offset: 3px;
}
html body.d6 #inboxDrawer .inbox-empty { text-align: left; }
html body.d6 #inboxDrawer .inbox-empty-text { font-size: var(--pt-t-small); color: var(--pt-empty); text-align: left; font-style: normal; }
html body.d6 #inboxDrawer .inbox-foot { padding: 10px 14px; border-top: 1px solid var(--ch8-onyx-20); font: 400 var(--pt-t-small)/1.45 var(--d6-sans); letter-spacing: 0; color: var(--pt-c-soft); text-align: left; }
html body.d6 #inboxDrawer .inbox-foot a { color: var(--pt-c-mark); text-decoration: underline; text-underline-offset: 3px; }
@media (max-width: 640px), (pointer: coarse) {
  html body.d6 #inboxDrawer .inbox-close, html body.d6 #inboxDrawer .inbox-actions .inbox-mark-all { min-height: var(--pt-ctl-h-touch); min-width: var(--pt-ctl-h-touch); }
}

/* ══ 6 · THE TOASTS — one dark strip, sentence case, no gold rule, no shadow ════════════════════ */
body.d6 .portal-toast--update {
  border-top: 0; border-radius: 2px; box-shadow: none; background: var(--pt-g-ink); color: var(--pt-c-on-dark);
  padding: 10px 16px; gap: 12px; font: 400 var(--pt-t-small)/1.45 var(--d6-sans); letter-spacing: 0; text-transform: none;
}
body.d6 .portal-toast--update .pn-toast-x { background: none; border: 0; padding: 0 0 0 6px; color: var(--pt-c-on-dark); font: 400 var(--pt-t-small)/1 var(--d6-sans); cursor: pointer; }

/* ══ 7 · ROOM RULINGS THE CENSUS NOW MEASURES ═════════════════════════════════════════════════ */
/* disabled — ONE look: the button as it is, faded to 45%, the reason beside it. portal-v15.css's
   `body.d6 button:disabled:not(.pn-i):not(.po-choice)` (0,4,2) painted the retired grey fill at
   full strength and out-ranked the layer's own 45%; this is one step more specific. */
html body.d6 button:disabled:not(.pn-i):not(.po-choice) {
  background: var(--pt-g-paper); border-color: var(--ch8-onyx-20); color: var(--pt-c-ink);
  opacity: var(--pt-disabled); cursor: not-allowed;
}
/* the one selected look is green — a tick box too (portal-v15 and the Guests "select all" were crimson) */
html body.d6 input[type="checkbox"], html body.d6 input[type="radio"] { accent-color: var(--pt-c-good); }
/* Event details' eyebrow: sentence case, like every other label (09-25) */
body.d6 #tab-details .peb-eyebrow { font-size: var(--pt-t-small); font-weight: 500; letter-spacing: 0; text-transform: none; color: var(--pt-c-soft); }
/* focus — 2px crimson, 2px outside, everywhere (the (i) and the older parts said 3px) */
body.d6[data-active-tab] .evo-hint:focus-visible { outline: var(--pt-focus-w) solid var(--pt-ring); outline-offset: var(--pt-focus-offset); }
/* Guests' empty sentence: the soft ink, like every empty sentence */
body.d6 #tab-rsvp .rsvp-empty { color: var(--pt-empty); }
/* the drawer's rows are the Updates room's rows: a small label, a 500 title, a soft second line */
html body.d6 #inboxDrawer .inbox-notif { padding: 9px 14px; border-left: 0; border-bottom: 1px solid var(--ch8-onyx-20); background: transparent; }
html body.d6 #inboxDrawer .inbox-notif:hover { background: var(--pt-g-sand); }
html body.d6 #inboxDrawer .inbox-notif-prod { background: transparent; }
html body.d6 #inboxDrawer .inbox-notif-type { margin-bottom: 2px; font: 400 var(--pt-t-label)/1.3 var(--d6-sans); letter-spacing: 0; text-transform: none; color: var(--pt-c-soft); }
html body.d6 #inboxDrawer .inbox-notif-title { font: 400 var(--pt-t-body)/1.4 var(--d6-sans); color: var(--pt-c-ink); }
html body.d6 #inboxDrawer .inbox-notif.unread .inbox-notif-title { font-weight: 500; }
html body.d6 #inboxDrawer .inbox-notif-body { font: 400 var(--pt-t-small)/1.45 var(--d6-sans); color: var(--pt-c-soft); }
html body.d6 #inboxDrawer :is(.inbox-notif-time, .inbox-notif-meta, .inbox-notif-action) { font: 400 var(--pt-t-small)/1.4 var(--d6-sans); letter-spacing: 0; text-transform: none; color: var(--pt-c-soft); }
html body.d6 #inboxDrawer .inbox-notif-action { color: var(--pt-c-mark); font-weight: 400; }
html body.d6 #inboxDrawer .inbox-notif.unread .inbox-notif-time { color: var(--pt-c-hot); }

/* ══ 8 · ONE DARK NEXT STEP PER VIEW (app/scripts/portal-truth.js marks the others) ═══════════
   Every other dark button in the view is drawn as the white button. Two :not(#…) steps put this
   above any room's own primary rule, however many ids it chains. */
html body.d6:not(#pt-a):not(#pt-b) .tab-panel [data-pt-quiet] {
  /* forced: several rooms write their primary's fill inline or with a forced declaration */
  background: var(--pt-g-paper) !important; border-color: var(--ch8-onyx-20) !important; color: var(--pt-c-ink) !important;
}
html body.d6:not(#pt-a):not(#pt-b) .tab-panel [data-pt-quiet]:hover { background: var(--pt-g-paper); border-color: var(--pt-c-soft); }

/* ══ 9 · CONTROL HEIGHTS — 30 with a mouse above 640px, 44 on a phone or a touch screen ═════════ */
@media (min-width: 641px) and (hover: hover) and (pointer: fine) {
  /* a guest row's actions were 26px (owner 09-25's orderly grid keeps its columns) */
  body.d6 #portalMain .rsvp-acts .ra-grid > .rsvp-edit-btn,
  body.d6 #portalMain .rsvp-acts .ra-grid > .rsvp-del-btn { min-height: var(--pt-ctl-h); }
}

/* ══ 10 · FOCUS — 2px crimson at 2px, outside; inside only on menu rows, tabs, rail items and
   full-width rows (where an outside ring would be cut by the panel). Two :not(#…) steps put the
   ring above every older :focus-visible rule (3px, -3px, bloodstone) without forcing it. ═════ */
html body.d6:not(#pt-a):not(#pt-b) :is(button, a, input, select, textarea, summary, [tabindex], [role="button"]):focus-visible {
  outline: var(--pt-focus-w) solid var(--pt-ring); outline-offset: var(--pt-focus-offset);
}
html body.d6:not(#pt-a):not(#pt-b) :is(input, select, textarea):focus {
  outline: var(--pt-focus-w) solid var(--pt-ring); outline-offset: var(--pt-focus-offset);
}
html body.d6:not(#pt-a):not(#pt-b) :is(.pn-i, .pn-grp, #roomViews button, [role="tab"], [role="menuitem"], .hdr-account-opt, .hdr-event-opt, .inbox-notif, tr, .d6-row, .es-mod-hd, .gj-row):focus-visible {
  outline-offset: calc(var(--pt-focus-w) * -1);
}
@media (min-width: 641px) and (hover: hover) and (pointer: fine) {
  /* Set-up's choice pills (32px) and the house one-line field (the compose subject was 33px) at the
     control height — a mouse above 640px only; the phone's 44 floors are untouched */
  body.d6 #tab-setup .es-pill.po-choice { min-height: var(--pt-ctl-h); padding-top: 0; padding-bottom: 0; }
  html body.d6:not(#pt-a) #portalMain input.evo-field:not([type="checkbox"]):not([type="radio"]) { min-height: var(--pt-ctl-h); height: var(--pt-ctl-h); padding-top: 0; padding-bottom: 0; box-sizing: border-box; }
  /* the bar: the Updates bell and the drawer's × at the control height */
  body.d6 .portal-hdr #inboxBell { min-height: var(--pt-ctl-h); height: var(--pt-ctl-h); }
}
@media (max-width: 640px), (pointer: coarse) {
  /* Messages' tool links drawn as buttons reach the phone's 44 */
  body.d6 #portalMain a.gt-link.d6-btn { min-height: var(--pt-ctl-h-touch); display: inline-flex; align-items: center; }
}
/* the header chips are controls: the control corner */
html body.d6 .portal-hdr :is(#hdrEventChip, .hdr-client-chip) { border-radius: 2px; }
/* People › a saved vendor's role: a label, in sentence case */
body.d6 #portalMain .yp-v-role { letter-spacing: 0; text-transform: none; font-size: var(--pt-t-label); }
/* the canceled screen's title is written inline in Libre Baskerville, which the portal no longer
   loads (design truth); inline, so only a forced declaration reaches it */
#cancelledScreen #cancelledTitle { font-family: var(--d6-serif, 'Crimson Pro', 'Times New Roman', serif) !important; }

/* ══ 11 · THE ROOMS' LAST ODDS AND ENDS ══════════════════════════════════════════════════════
   a softer line is the soft ink, never a faded ink (a faded ink is a colour of its own) */
body.d6 #portalMain :is(.es-part-intro, .es-why, .es-explain, .pd-adv-note) { opacity: 1; color: var(--pt-c-soft); }
/* a link is bordeaux, underlined — Messages' "How to use this" was crimson */
html body.d6:not(#pt-a) #portalMain a.pcm-how { color: var(--pt-c-mark); }
/* the neutral pill sits on sand (the soft ink on the line would read 4.06:1); the done pill on
   the 6% green wash (green on the 12% wash reads 4.39:1 — under AA at 11px) */
body.d6 .d6-pill, body.d6 #portalMain [data-d6-adopt].d6-pill { background: var(--pt-g-sand); }
body.d6 .d6-pill--done, body.d6 #portalMain [data-d6-adopt].d6-pill--done { background: var(--pt-g-good-6); }
body.d6 .d6-pill--you, body.d6 #portalMain [data-d6-adopt].d6-pill--you { background: var(--pt-g-hot-10); }
body.d6 .d6-pill--us, body.d6 #portalMain [data-d6-adopt].d6-pill--us { background: var(--pt-g-sand); color: var(--pt-c-ink); }
body.d6 .d6-pill--wait, body.d6 #portalMain [data-d6-adopt].d6-pill--wait { background: var(--pt-g-warn-12); }
/* one page-title size, a phone too (owner: "the phone page title stays one size, 24") */
@media (max-width: 640px) {
  body.d6 .d6-head h1, body.d6 #portalMain .d6-head h1, body.d6 #portalMain .rm-screen-h h1 { font-size: var(--pt-t-page); }
  /* the phone menu's rooms at the rail's size */
  body.d6 #portalNav .pn-i .pn-l, body.d6 #portalNav .pn-i { font-size: var(--pt-t-body); }
}
@media (min-width: 641px) and (hover: hover) and (pointer: fine) {
  html body.d6:not(#pt-a) #portalMain input.fld-input:not([type="checkbox"]):not([type="radio"]) { min-height: var(--pt-ctl-h); height: var(--pt-ctl-h); padding-top: 0; padding-bottom: 0; box-sizing: border-box; }
}
/* the drawer's empty sentence sits left, where the rows would be */
html body.d6 #inboxDrawer .inbox-empty { align-items: flex-start; justify-content: flex-start; padding: 12px 14px; }
/* the rail's four group names: the label size (the smallest on the ladder), capitals kept — the
   one other uppercase role the rulebook allows. On a phone they open their section, and read at
   the second-line size. */
body.d6 .pn-grp { font-size: var(--pt-t-label); }
@media (max-width: 640px) { body.d6 .pn-grp { font-size: var(--pt-t-small); } }

/* ══ 12 · THE OLDER SHEETS' TYPE TOKENS ON THE LADDER ═════════════════════════════════════════
   tokens.css's rem steps (and portal-v15's phone floors for them) are what most of the older
   rooms still read; re-pointed at the ladder here, inside the portal only. The literal rem and px
   sizes written in the older sheets and modules are the sweep's (census kind `ladder`). */
body.d6 {
  --text-micro: var(--pt-t-label);
  --text-xs: var(--pt-t-small);
  --text-sm: var(--pt-t-small);
  --text-ui: var(--pt-t-small);
  --text-base: var(--pt-t-body);
  --text-body: var(--pt-t-body);
  --text-md: var(--pt-t-body);
}
/* never a faded ink: a softer line is the soft ink at full strength (set-up's "optional" tags and
   its (i), the plan ladder's quiet rows, the door team's notes) */
body.d6 #portalMain :is(.es-opt, .es-sens) { opacity: 1; color: var(--pt-c-soft); }
body.d6 #portalMain .evo-hint { opacity: 1; }
body.d6 #portalMain :is(.s6__rung-add, .s6__rung-label, .s6__rung-delta-from, .s6__rung-delta-amt, .s6__rung-delta-verb, .s6__rung-designs, .s6__rung-refusal, .s6__addon--unavailable, .s6__addon-why) { opacity: 1; color: var(--pt-c-soft); }
/* links are bordeaux — the Updates room's contact line and the header's support line were crimson */
body.d6 .up-wrap .d6-note a[href^="mailto:"] { color: var(--pt-c-mark); border-bottom-color: currentColor; }
body[data-active-tab].d6 .hdr-support a, body.d6 .hdr-support a strong { color: var(--pt-c-mark); }
/* the guests' upsell ("Add pieces") is not the next step: the white button, sentence case, never a
   bordeaux block in tracked capitals. forced: portal-guests-seating.js writes the look inline. */
html body.d6 #guestUpsellNudge button:not([aria-label="Dismiss"]) {
  display: inline-flex !important; align-items: center; justify-content: center;
  min-height: var(--pt-ctl-h) !important; padding: 0 11px !important; box-sizing: border-box;
  border: 1px solid var(--ch8-onyx-20) !important; border-radius: 2px !important; background: var(--pt-g-paper) !important;
  font: 400 var(--pt-t-small)/1.2 var(--d6-sans) !important; letter-spacing: 0 !important; text-transform: none !important;
  color: var(--pt-c-ink) !important; white-space: nowrap;
}
html body.d6 #guestUpsellNudge button:not([aria-label="Dismiss"]):hover { border-color: var(--pt-c-soft) !important; }
html body.d6 #guestUpsellNudge button:focus-visible { outline: var(--pt-focus-w) solid var(--pt-ring); outline-offset: var(--pt-focus-offset); }
@media (max-width: 640px), (pointer: coarse) {
  html body.d6 #guestUpsellNudge button:not([aria-label="Dismiss"]) { min-height: var(--pt-ctl-h-touch) !important; padding: 0 14px !important; font-size: var(--pt-t-body) !important; }
}
/* the lead's initial is a person, not a signal: the one dark with linen, never amber (amber = waiting) */
html body.d6:not(#pt-a):not(#pt-b) .hdr-support[data-lead-initial]::before { background: var(--pt-g-ink); color: var(--pt-c-on-dark); }
/* a phone: a row's actions share the row in equal columns, never a ragged fold */
@media (max-width: 640px) {
  body.d6 .d6-row .d6-acts { display: grid; grid-template-columns: repeat(auto-fit, minmax(128px, 1fr)); gap: 6px; }
}

/* ══ 13 · THE BAR'S WORDS ON THE LADDER ═══════════════════════════════════════════════════════
   the status strip at the body size (its event name serif), the lead's two lines at the second-line
   size, the event and the signed-in name at the body size. `html body.d6 .portal-hdr` out-ranks
   the bar's own rules (portal-nav.css :root.portal-signed-in …, portal-v15.css #hdrEventChip …). */

html body.d6:not(#pt-a) .portal-hdr :is(.hdr-lead-n, .hdr-lead-m) { font-size: var(--pt-t-small); }
/* ⚠ THE BAR'S GEOMETRY IS HELD, NOT REDRAWN, HERE (2026-09-28). The status line, the event and the
   account chips and the bell keep their Direction 11 build: their heights are pinned by
   test/portal-header-reserve-signed-in (the signed-in band portal.css reserves) and the phone header
   is portal-mobile-100's, which lands before this branch. Their words sit on the ladder (above);
   drawing them as the rulebook's bar (the event 17 serif, a 14px status line, "Updates" and the
   account as bare words) is the census's `twin` backlog for that merge. */
html body.d6:not(#pt-a) .portal-hdr #hdrClientName { font-size: var(--pt-t-body); }


/* ══ 14 · EVERY INSTANCE AS DRAWN (the twin rule, owner 2026-09-27 23:1xZ) ═══════════════════════
   what the Direction 6 layer still draws differently from the rulebook's own drawing, set here
   (each moves into portal-d6.css / portal-nav.css with the literal sweep) */
body.d6 .d6-fig, body.d6 #portalMain :is(.hr-num, .er-n, .ech-num, #evoIdentity b) { font-size: var(--pt-t-page); }
body.d6 .d6-tile { border-radius: 2px; }
body.d6 .d6-inline { border-radius: 2px; padding: 10px 12px; }
body.d6 .evo-hint, body.d6[data-active-tab] .evo-hint { font: italic 500 var(--pt-t-body)/1 var(--d6-serif); color: var(--pt-c-soft); padding: 0 4px; opacity: 1; }
@media (min-width: 641px) and (hover: hover) and (pointer: fine) {
  body.d6 .d6-field:not(textarea) { padding-top: 5px; padding-bottom: 5px; }
  body.d6 .d6-chip { padding: 0 12px; font-size: var(--pt-t-small); color: var(--pt-c-soft); }
}
/* the bar: Help is a bare word; the rail's group names, items and counts as drawn */
body.d6 .portal-hdr #pnHelp { border: 0; border-radius: 0; padding: 6px 8px; color: var(--pt-c-soft); font-size: var(--pt-t-small); background: transparent; }
body.d6 .portal-hdr #pnFind { color: var(--pt-c-soft); font-size: var(--pt-t-small); padding: 0 10px; background: var(--pt-g-paper); border-color: var(--ch8-onyx-20); }
html body.d6:not(#pt-a) .pn-grp { font-size: var(--pt-t-label); font-weight: 500; letter-spacing: .1em; text-transform: uppercase; color: var(--pt-c-ink); }
html body.d6:not(#pt-a) .pn-i { font-size: var(--pt-t-body); color: var(--pt-c-soft); }
html body.d6:not(#pt-a) .pn-i[aria-current="page"] { font-weight: 500; color: var(--pt-c-ink); background: var(--ch8-linen); }
html body.d6:not(#pt-a) .pn-i .pn-c { font-size: var(--pt-t-small); font-weight: 500; color: var(--pt-c-soft); }
html body.d6:not(#pt-a) .pn-i .pn-c.is-hot { color: var(--pt-c-hot); }
body.d6 .pn-burger { font-size: var(--pt-t-panel); padding: 1px 6px; }
/* the room tabs */
html body.d6:not(#pt-a) #roomViews button { font-size: var(--pt-t-body); color: var(--pt-c-soft); padding: 0 10px; min-height: 40px; }
html body.d6:not(#pt-a) #roomViews button:is(.on, [aria-selected="true"]) { color: var(--pt-c-ink); }
/* by touch a room tab is a 44px target, like every control on a phone (D036 case 4; the 40px above is
   the drawing's, with a mouse). The 4px it grows is given back by its margins, so the pinned header's
   bands (test/portal-header-reserve-signed-in) do not move. */
@media (max-width: 640px), (pointer: coarse) {
  html body.d6:not(#pt-a) #roomViews button { min-height: var(--pt-ctl-h-touch); margin-top: -2px; margin-bottom: -2px; }
}
/* a removing button: white, crimson words, the 45% crimson edge (a guest row's Remove too) */
html body.d6:not(#pt-a) :is(.d6-btn--warn, .rsvp-acts .rsvp-del-btn) { color: var(--pt-err); border-color: color-mix(in srgb, var(--pt-err) 45%, var(--pt-g-paper)); background: var(--pt-g-paper); }

/* ══ 15 · EVERY INSTANCE AS DRAWN, WHEREVER A ROOM DREW IT ITS OWN WAY ══════════════════════════
   The census's `twin` kind holds each instance to the rulebook's drawing
   (docs/execution/portal-one-format/twin-reference.json). Two :not(#…) steps out-rank a room's
   own id-chained rule without forcing; the phone's 44px / 14px / 14px sides are the rulebook's
   phone part. Each moves into the layer with the literal sweep. */
/* the white button: paper, the line, 2px, 12.5 at 400, 0 11px — a room's ghost / quiet button too */
html body.d6:not(#pt-a):not(#pt-b) :is(.d6-btn:not(.d6-btn--pri):not(.d6-btn--lnk):not(.d6-btn--warn), .d6-btn--pri[data-pt-quiet], .rsvp-acts .rsvp-edit-btn):not(:disabled):not([aria-pressed="true"]):not(.is-on) {
    background: var(--pt-g-paper); border: 1px solid var(--ch8-onyx-20); border-radius: 2px; color: var(--pt-c-ink);
    font-family: var(--d6-sans); font-weight: 400; letter-spacing: 0; text-transform: none; padding: 0 11px;
}
html body.d6:not(#pt-a):not(#pt-b) .d6-btn--pri:not([data-pt-quiet]):not(:disabled) { color: var(--pt-c-on-dark); padding: 0 11px; font-weight: 400; }
html body.d6:not(#pt-a):not(#pt-b) .d6-btn--lnk { border: 1px solid transparent; background: transparent; padding: 0 4px; }
html body.d6:not(#pt-a):not(#pt-b) :is(.d6-btn--warn, .rsvp-acts .rsvp-del-btn):not(:disabled) { color: var(--pt-err); border: 1px solid color-mix(in srgb, var(--pt-err) 45%, var(--pt-g-paper)); background: var(--pt-g-paper); padding: 0 11px; border-radius: 2px; }
html body.d6:not(#pt-a):not(#pt-b) :is(.d6-btn, #portalConfirmOverlay button):disabled:not(.pdlg-x) { background: var(--pt-g-paper); border: 1px solid var(--ch8-onyx-20); color: var(--pt-c-ink); opacity: var(--pt-disabled); }
/* chips: 0 12px, the soft ink; chosen = the green line and the 6% wash */
html body.d6:not(#pt-a):not(#pt-b) .d6-chip { padding: 0 12px; }
html body.d6:not(#pt-a):not(#pt-b) .d6-chip:not(:is([aria-pressed="true"], .is-on, .on, .active, .bb-vtab-active, .bsn-active, .done)) { color: var(--pt-c-soft); background: var(--pt-g-paper); border-color: var(--ch8-onyx-20); }
html body.d6:not(#pt-a):not(#pt-b) .d6-chip:is([aria-pressed="true"], .is-on, .on, .active, .bb-vtab-active, .bsn-active, .done),
html body.d6:not(#pt-a):not(#pt-b) .d6-tile:is([aria-pressed="true"], .is-on, .on, .active, .bb-vtab-active, .bsn-active, .done) { color: var(--pt-c-good); background: var(--pt-g-good-6); border-color: var(--pt-c-good); }
html body.d6:not(#pt-a):not(#pt-b) .d6-tile { padding: 9px 10px; border-radius: 2px; }
/* the table: a cell 7 10 at the body size in ink; its name and second line as drawn */
html body.d6:not(#pt-a):not(#pt-b) .d6-table td { padding: 7px 10px; font-size: var(--pt-t-body); font-weight: 400; color: var(--pt-c-ink); }
html body.d6:not(#pt-a):not(#pt-b) .d6-table td.d6-sub { font-size: var(--pt-t-small); color: var(--pt-c-soft); }
html body.d6:not(#pt-a):not(#pt-b) .d6-table td.d6-nm { font-weight: 500; }
html body.d6:not(#pt-a):not(#pt-b) .d6-table td.d6-empty { font-size: var(--pt-t-small); color: var(--pt-empty); }
html body.d6:not(#pt-a):not(#pt-b) .d6-table :not(td):is(.d6-sub, .d6-nm) { padding: 0; }
html body.d6:not(#pt-a):not(#pt-b) .d6-table th { padding: 9px 10px; }
html body.d6:not(#pt-a):not(#pt-b) .d6-filters { padding: 8px 10px; }
/* every framed block without a head and a body: the panel, with the panel's inset */
html body.d6:not(#pt-a):not(#pt-b) :is(.d6-framed, .d6-detail, .host-card, .cdl-card, .es-booking, .pcm-item, .bb-actions, .es-body, .td-opening, .ndl-approval, .guest-capacity-meter, .keepsake-banner, .d6-flat.eb-card, #scanReportPanel.d6-flat, #dayOfPrintPanel.d6-flat, #rosCard.d6-flat) {
    background: var(--pt-g-paper); border: 1px solid var(--ch8-onyx-20); border-radius: 0; box-shadow: none;
    padding: 9px 12px 10px; font-size: var(--pt-t-body); color: var(--pt-c-ink);
}
html body.d6:not(#pt-a):not(#pt-b) .d6-foot.d6-framed { font-size: var(--pt-t-small); color: var(--pt-c-soft); }
html body.d6:not(#pt-a):not(#pt-b) .d6-tw { background: var(--pt-g-paper); border: 1px solid var(--ch8-onyx-20); border-radius: 0; padding: 0; }
html body.d6:not(#pt-a):not(#pt-b) [data-d6-adopt].d6-ttl { padding: 0; font-size: var(--pt-t-panel); }
html body.d6:not(#pt-a):not(#pt-b) .d6-row .d6-t { color: var(--pt-c-ink); }
html body.d6:not(#pt-a):not(#pt-b) .d6-row .d6-s { color: var(--pt-c-soft); }
html body.d6:not(#pt-a):not(#pt-b) .evo-hint { font: italic 500 var(--pt-t-body)/1 var(--d6-serif); letter-spacing: 0; text-transform: none; color: var(--pt-c-soft); padding: 0 4px; border: 0; background: transparent; opacity: 1; }
html body.d6:not(#pt-a):not(#pt-b) .d6-search { font: 400 var(--pt-t-small)/1.2 var(--d6-sans); color: var(--pt-c-ink); padding: 0 10px; }
/* every field a client types in: paper, the line, 2px, 5 10, 12.5px (the rulebook's field — `--pt-t-small`:
   "second line, button, field, label"; it was drawn at the 14px body size until the 09-30 walk counted 63 fields
   against the corrected reference), 30px tall with a mouse. A phone keeps 14px (the touch block below). */
html body.d6:not(#pt-a):not(#pt-b) :is(#portalMain, #portalConfirmOverlay) :is(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="file"]):not([type="range"]):not([type="color"]):not([type="button"]):not([type="submit"]):not(.d6-search), select) {
    background-color: var(--pt-g-paper); border: 1px solid var(--ch8-onyx-20); border-radius: 2px;
    font-family: var(--d6-sans); font-size: var(--pt-t-small); font-weight: 400; letter-spacing: 0; text-transform: none; color: var(--pt-c-ink);
    padding: 5px 10px; box-sizing: border-box;
}
html body.d6:not(#pt-a):not(#pt-b) :is(#portalMain, #portalConfirmOverlay) textarea {
    background-color: var(--pt-g-paper); border: 1px solid var(--ch8-onyx-20); border-radius: 2px;
    font-family: var(--d6-sans); font-size: var(--pt-t-small); font-weight: 400; letter-spacing: 0; color: var(--pt-c-ink);
    padding: 8px 10px; min-height: 74px; box-sizing: border-box;
}
/* the Updates drawer is a panel at the side */
html body.d6:not(#pt-a):not(#pt-b) #inboxDrawer { background: var(--pt-g-paper); border: 0; border-left: 1px solid var(--ch8-onyx-20); border-radius: 0; padding: 0; font-size: var(--pt-t-body); color: var(--pt-c-ink); }
/* the header menus' own size; the menu has no rule inside it */
html body.d6:not(#pt-a):not(#pt-b) :is(#hdrAccountDropdown, #hdrEventDropdown) { font-size: var(--pt-t-body); color: var(--pt-c-ink); }
html body.d6:not(#pt-a):not(#pt-b) .hdr-account-dropdown .hdr-account-signout { border-top: 0; margin-top: 0; padding-top: 9px; padding-bottom: 9px; }
html body.d6:not(#pt-a):not(#pt-b) .hdr-account-who { font-family: var(--d6-serif); }
html body.d6:not(#pt-a):not(#pt-b) #updateToast .pn-toast-x { padding: 0; }
/* the wordmark, the status line, the rail, as drawn */
html body.d6:not(#pt-a):not(#pt-b) .portal-hdr .hdr-logo { font: 500 var(--pt-t-body)/1 Montserrat, var(--d6-sans); letter-spacing: .34em; text-transform: none; }
/* ⚠ THE WORDMARK IS A LINK, SO ITS BOX KEEPS ITS TARGET (2026-09-30: the a11y walk measured it
   88×14 on every screen once this rule set `padding: 0` — 56 blockers). The rulebook draws the
   letters; the box is portal-nav.css's: 8px above and below with a mouse (30px), and by touch
   44px with the growth given back by negative margins, so no header band moves. */
@media (max-width: 640px), (max-height: 500px) and (orientation: landscape), (hover: none) and (pointer: coarse) {
  html body.d6:not(#pt-a):not(#pt-b) .portal-hdr .hdr-logo { padding: 15px 0; margin-top: -15px; margin-bottom: -15px; }
}

html body.d6:not(#pt-a):not(#pt-b) .pn-side { padding: 4px 0 14px; }
html body.d6:not(#pt-a):not(#pt-b) .pn-grp { padding: 12px 14px 6px 17px; }
html body.d6:not(#pt-a):not(#pt-b) .pn-i { padding: 0 14px 0 24px; }
@media (min-width: 641px) and (hover: hover) and (pointer: fine) {
  html body.d6:not(#pt-a):not(#pt-b) :is(#portalMain, #portalConfirmOverlay) :is(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="file"]):not([type="range"]):not([type="color"]):not([type="button"]):not([type="submit"]):not(.d6-search), select) { height: var(--pt-ctl-h); min-height: var(--pt-ctl-h); }
  html body.d6:not(#pt-a):not(#pt-b) .d6-search { height: var(--pt-ctl-h); min-height: var(--pt-ctl-h); }
}
@media (max-width: 640px), (pointer: coarse) {
  html body.d6:not(#pt-a):not(#pt-b) :is(.d6-btn, .d6-chip, .rsvp-acts .rsvp-edit-btn, .rsvp-acts .rsvp-del-btn, #portalConfirmOverlay :is(.pdlg-ok, .pdlg-cancel, .pdlg-copy)) { padding-left: 14px; padding-right: 14px; font-size: var(--pt-t-body); }
  html body.d6:not(#pt-a):not(#pt-b) .d6-btn--lnk { padding: 0 4px; }
  html body.d6:not(#pt-a):not(#pt-b) :is(#portalMain, #portalConfirmOverlay) :is(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="file"]):not([type="range"]):not([type="color"]):not([type="button"]):not([type="submit"]), select, textarea) { font-size: 16px; min-height: var(--pt-ctl-h-touch); }
}

/* a framed block INSIDE a panel is a section of it, never a box in a box (the rulebook's room part:
   "no box inside a box"): no frame, no ground, the panel's inset already around it */
html body.d6:not(#pt-a):not(#pt-b) :is(.d6-panel, .d6-framed, .d6-detail, #portalConfirmOverlay .pdlg) :is(.d6-framed, .d6-tw, .d6-detail, .host-card, .cdl-card, .es-booking, .pcm-item, .bb-actions, .es-body, .td-opening, .ndl-approval, .guest-capacity-meter, .d6-panel) {
  background: transparent; border: 0; box-shadow: none; padding: 0;
}
html body.d6:not(#pt-a):not(#pt-b) :is(.d6-panel, .d6-framed, .d6-detail) :is(.pcm-item, .host-card, .cdl-card) + :is(.pcm-item, .host-card, .cdl-card) { border-top: 1px solid var(--ch8-onyx-20); padding-top: 9px; margin-top: 9px; }
html body.d6:not(#pt-a):not(#pt-b) #portalMain .d6-foot.d6-framed { font-size: var(--pt-t-small); color: var(--pt-c-soft); }
html body.d6:not(#pt-a):not(#pt-b) .d6-panel { background: var(--pt-g-paper); padding: 0; }
html body.d6:not(#pt-a):not(#pt-b) .d6-search { color: var(--pt-c-soft); }
/* links are bordeaux, underlined — every plain link in a sentence */
html body.d6:not(#pt-a):not(#pt-b) #portalMain :is(p, li, span, div, td, small, label) > a[href]:not([class*="btn"]):not(.d6-chip):not(.d6-tile),
html body.d6:not(#pt-a):not(#pt-b) .hdr-support a, html body.d6:not(#pt-a):not(#pt-b) .hdr-support a strong { color: var(--pt-c-mark); }
/* never faded: the plan ladder's quiet rows, the door set-up's notes, a removed door member */
html body.d6:not(#pt-a):not(#pt-b) #portalMain :is(.s6__rung-add, .s6__rung-label, .s6__rung-delta-from, .s6__rung-delta-amt, .s6__rung-delta-verb, .s6__rung-designs, .s6__rung-refusal, .s6__addon--unavailable, .s6__addon-why, #doorSetupPanel p, #doorSetupPanel code, #doorTeamList span, #doorTeamList .table-card-del) { opacity: 1; color: var(--pt-c-soft); }
/* What we handle's fact labels: sentence case (a label, not a column head) */
html body.d6:not(#pt-a):not(#pt-b) #portalMain .s3__fact-label { text-transform: none; letter-spacing: 0; }
/* Set-up's choice pills at the control height */
@media (min-width: 641px) and (hover: hover) and (pointer: fine) {
  html body.d6:not(#pt-a):not(#pt-b) #portalMain .es-pill.po-choice { min-height: var(--pt-ctl-h); padding-top: 0; padding-bottom: 0; line-height: 1.2; box-sizing: border-box; white-space: nowrap; }   /* a chip is one line, as wide as its words */
}
/* the guestbook's share link: the answer block (sand, the line, 2px) */
html body.d6:not(#pt-a):not(#pt-b) #portalMain #gbShareLink { display: block; background: var(--pt-g-sand); border: 1px solid var(--ch8-onyx-20); border-radius: 2px; padding: 10px 12px; font-size: var(--pt-t-body); color: var(--pt-c-ink); }
/* the rooms' older word buttons, as the white button */
html body.d6:not(#pt-a):not(#pt-b) #portalMain :is(.ds-share-btn, .ag-footer-link, .ndl-fmt-btn:not(.d6-pill), .iframe-expand-btn):not(:disabled) {
  display: inline-flex; align-items: center; justify-content: center; min-height: var(--pt-ctl-h); padding: 0 11px;
  background: var(--pt-g-paper); border: 1px solid var(--ch8-onyx-20); border-radius: 2px;
  font: 400 var(--pt-t-small)/1.2 var(--d6-sans); letter-spacing: 0; text-transform: none; color: var(--pt-c-ink); text-decoration: none;
}
/* the bar's word buttons (Updates, the account) as the rulebook's header button: a bare word */

html body.d6:not(#pt-a):not(#pt-b) #portalNav .pn-tools .pn-find { background: var(--pt-g-paper); border: 1px solid var(--ch8-onyx-20); border-radius: 2px; padding: 0 10px; font: 400 var(--pt-t-small)/1.2 var(--d6-sans); color: var(--pt-c-soft); }

/* ══ 16 · FIELDS THE MODULES WRITE INLINE ═════════════════════════════════════════════════════
   The door set-up, the paste boxes, the seating selects and a dozen more fields are built in JS
   with their look in style="…" (a transparent ground, 8px 12px, a square corner, 44px at every
   width). No selector reaches an inline declaration, so here — and only here — the look is forced
   (this file's rule 3 exception). Width and flex stay the module's: only the drawn field is set. */
html body.d6 :is(#portalMain, .tab-panel, #portalConfirmOverlay) :is(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="file"]):not([type="range"]):not([type="color"]):not([type="button"]):not([type="submit"]):not(.d6-search), select) {
  background-color: var(--pt-g-paper) !important; border: 1px solid var(--ch8-onyx-20) !important; border-radius: 2px !important;
  font-family: var(--d6-sans) !important; font-weight: 400 !important; letter-spacing: 0 !important; color: var(--pt-c-ink) !important;
  padding: 5px 10px !important; box-sizing: border-box !important;
}
html body.d6 :is(#portalMain, #portalConfirmOverlay) textarea {
  background-color: var(--pt-g-paper) !important; border: 1px solid var(--ch8-onyx-20) !important; border-radius: 2px !important;
  font-family: var(--d6-sans) !important; font-weight: 400 !important; letter-spacing: 0 !important; color: var(--pt-c-ink) !important;
  padding: 8px 10px !important; min-height: 74px !important; box-sizing: border-box !important;
}
/* with a mouse a field is the rulebook's 12.5px (`--pt-t-small`), 30px tall — forced for the inline-written ones too */
@media (min-width: 641px) and (hover: hover) and (pointer: fine) {
  html body.d6 :is(#portalMain, .tab-panel, #portalConfirmOverlay) :is(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="file"]):not([type="range"]):not([type="color"]):not([type="button"]):not([type="submit"]):not(.d6-search), select) { min-height: var(--pt-ctl-h) !important; height: var(--pt-ctl-h) !important; font-size: var(--pt-t-small) !important; }
  html body.d6 :is(#portalMain, #portalConfirmOverlay) textarea { font-size: var(--pt-t-small) !important; }
}
/* a framed block's own inset, where a module wrote it inline or by a longer rule */
html body.d6 #portalMain :is(.designs-ask.d6-framed, .cdl-card) { padding: 9px 12px 10px !important; text-align: left; }   /* inline / longer rules */
/* the older word buttons and the guestbook link, at the control corner; a pill-shaped status in Files as the waiting pill */
/* portal-v10.css squares every non-d6 button and span with a forced 0 — these are controls (2px) */
html body.d6 #portalMain :is(.ag-footer-link, .ds-share-btn, .ndl-fmt-btn:not(.d6-pill), .iframe-expand-btn, #gbShareLink) { border-radius: 2px !important; }
html body.d6 #portalMain .table-card-del.d6-btn { color: var(--pt-c-ink) !important; opacity: 1 !important; }   /* inline */
html body.d6 #portalMain :is(#doorSetupPanel p, #doorSetupPanel code, #doorTeamList span) { opacity: 1 !important; color: var(--pt-c-soft) !important; }   /* inline opacity */
html body.d6:not(#pt-a):not(#pt-b) .hdr-support strong { color: var(--pt-c-mark); }
html body.d6:not(#pt-a):not(#pt-b) #portalMain .ndl-fmt-btn.d6-pill { height: 20px; min-height: 0; padding: 0 9px; border: 0; border-radius: 2px; font: 500 var(--pt-t-label)/1 var(--d6-sans); color: var(--pt-c-warn); background: var(--pt-g-warn-12); }
/* the guest-list lock notice sits inside a panel: a section of it (its frame is written inline) */
html body.d6 #portalMain #guestCapacityMeter { background: transparent !important; border: 0 !important; padding: 0 !important; }
html body.d6:not(#pt-a):not(#pt-b) #inboxDrawer { border-top: 1px solid var(--ch8-onyx-20); }

/* the plan ladder's refused rung: full strength, its reason in words beside it (never a faded ink) */
html body.d6:not(#pt-a):not(#pt-b) #portalMain .s6__rung--refused { opacity: 1; }
/* a locked room in the rail: no ground of its own (it says why on its second line) */
html body.d6:not(#pt-a):not(#pt-b) .pn-i.is-locked { background: transparent; }
@media (max-width: 640px), (pointer: coarse) {
  html body.d6:not(#pt-a):not(#pt-b) #portalMain :is(.ds-share-btn, .ag-footer-link, .ndl-fmt-btn:not(.d6-pill), .iframe-expand-btn):not(:disabled) { min-height: var(--pt-ctl-h-touch); padding: 0 14px; font-size: var(--pt-t-body); }
}

/* a block the layer flattened (`.d6-flat`) that still drew a frame: inside a panel, a section of it */
html body.d6:not(#pt-a):not(#pt-b) #portalMain :is(.d6-panel, .d6-framed, .d6-detail, .rm-sec) :is(.d6-flat, .keepsake-banner, .suite-iframe-wrap) { background: transparent; border: 0; box-shadow: none; }
html body.d6 #portalMain #designSuiteGrid.d6-framed { padding: 9px 12px 10px !important; }   /* a longer grid rule */
/* a chosen chip is the one selected look at 400 (the plan lens chips were 500) */
html body.d6:not(#pt-a):not(#pt-b) .d6-chip:is([aria-pressed="true"], .is-on, .on, .active) { font-weight: 400; }
/* Messages' progress alert: a sentence in the error colour, in the panel — no tinted box */
html body.d6:not(#pt-a):not(#pt-b) #portalMain .pcm-alert { background: transparent; border: 0; padding: 0; color: var(--pt-err); }
html body.d6:not(#pt-a):not(#pt-b) #portalMain .pcm-alert * { color: inherit; }

/* the plan's payment state is a state: it wears the pill (a label, 11px 500 on sand) */
html body.d6:not(#pt-a):not(#pt-b) #portalMain #billingPayStatus { border: 0; margin: 0; display: inline-flex; align-items: center; height: 20px; padding: 0 9px; background: var(--pt-g-sand); color: var(--pt-c-soft); letter-spacing: 0; text-transform: none; }
/* forced: portal-v10.css squares every non-d6 span with a forced 0, and a phone rule forces the size */
html body.d6 #portalMain #billingPayStatus { border-radius: 2px !important; font: 500 var(--pt-t-label)/1 var(--d6-sans) !important; }

/* One person, one record: a member's answer is a state, so it wears its pill — coming (done),
   not coming (declined), no answer yet (waiting), not known (neutral); never italic */
html body.d6:not(#pt-a):not(#pt-b) #portalMain .s4__word--rsvp { display: inline-flex; align-items: center; height: 20px; padding: 0 9px; border-radius: 2px; font: 500 var(--pt-t-label)/1 var(--d6-sans); font-style: normal; letter-spacing: 0; text-transform: none; background: var(--pt-g-sand); color: var(--pt-c-soft); }
html body.d6:not(#pt-a):not(#pt-b) #portalMain .s4__word--rsvp[data-s4-attendance="yes"] { background: var(--pt-g-good-6); color: var(--pt-c-good); }
html body.d6:not(#pt-a):not(#pt-b) #portalMain .s4__word--rsvp[data-s4-attendance="no"] { background: var(--pt-g-hot-10); color: var(--pt-c-hot); }
html body.d6:not(#pt-a):not(#pt-b) #portalMain .s4__word--rsvp[data-s4-attendance="pending"] { background: var(--pt-g-warn-12); color: var(--pt-c-warn); }

/* ══ THE VISION FORM, AS DRAWN (2026-09-30: the vision fixture's census) ═════════════════════════
   portal-vision-swiss.css pins these with forced paddings from before the rulebook; the rulebook's
   own values win here, part by part. */
/* language choices are chips: 0 12 with a mouse, 14px sides on a phone */
html body.d6:not(#pt-a):not(#pt-b) #tab-briefing .lang-opt.d6-chip { padding: 0 12px !important; }
@media (max-width: 640px), (pointer: coarse) {
  html body.d6:not(#pt-a):not(#pt-b) #tab-briefing .lang-opt.d6-chip { padding: 0 14px !important; }
}
/* a chip keeps its 2px corner inside the set-up card too: portal-v15.css squares every button in
   `#eventSetupCard`, and the Vision form (AM / PM) is mounted there */
html body.d6:not(#pt-a):not(#pt-b) .d6-chip { border-radius: 2px; }
/* "Let Evorrah choose" (palette, typeface) is a tile: 9 10. Its mark sits in the corner, so the
   words keep clear of it on their own side rather than the tile growing a 52px inset */
html body.d6:not(#pt-a):not(#pt-b) #tab-briefing :is(.pal-default-opt, .type-opt-default).d6-tile { padding: 9px 10px !important; }
html body.d6:not(#pt-a):not(#pt-b) #tab-briefing :is(.pal-default-opt, .type-opt-default).d6-tile > :first-child { padding-right: 30px; }
html body.d6:not(#pt-a):not(#pt-b) #tab-briefing :is(.pal-default-opt .pal-default-mark, .type-opt-default .type-mark) { top: 9px; right: 10px; }
/* "See more styles" and "Clear all" are link buttons: 0 4 */
html body.d6:not(#pt-a):not(#pt-b) #tab-briefing :is(.type-see-more, .dp-bar-clear).d6-btn--lnk { padding: 0 4px !important; }
/* Evorrah's suggestion boxes and the "leave it to us" box are framed blocks: the panel's paper,
   line and inset — and inside a panel a section of it, like every other (no box inside a box).
   Forced, because #dpFillWrap carries its old look inline. */
html body.d6:not(#pt-a):not(#pt-b) :is(.pd-rec-box, #dpFillWrap) {
  background: var(--pt-g-paper) !important; border: 1px solid var(--ch8-onyx-20) !important; border-radius: 0 !important; box-shadow: none;
  padding: 9px 12px 10px !important; font-size: var(--pt-t-body); color: var(--pt-c-ink);
}
html body.d6:not(#pt-a):not(#pt-b) :is(.d6-panel, .d6-framed, .d6-detail, #portalConfirmOverlay .pdlg) :is(.pd-rec-box, #dpFillWrap) {
  background: transparent !important; border: 0 !important; padding: 0 !important;
}
/* the guestbook's share link is an answer, so all of it is readable: it wraps rather than being
   cut with an ellipsis (a phone showed 227px of a 501px address) */
html body.d6:not(#pt-a):not(#pt-b) #portalMain #gbShareLink { white-space: normal; overflow: visible; text-overflow: clip; overflow-wrap: anywhere; }