/* ══════════════════════════════════════════════════════════════════════════════════════════════
   UP THE DUFF — the pub scene (pn-pub-20260815.css) · companion to web/pn-pub.js

   DESIGNED SEAM (Theme Law §5, recorded): the pub is EVENING, always — a deliberately pinned-dark
   interior like the cinema/pitch-room seams, not a theme bug. Every ink below is EXPLICIT and
   measured against the dark scene (Law 1): body ink #f2ead8 on #16100c-family ≥ 12:1; muted ink
   #cdbfa8 ≥ 7:1; the brand-orange neon carries near-black ink when used as a fill.

   ── SCENE-ART SWAP POINT (documented, do not lose) ──────────────────────────────────────────
   A photographic pub plate is coming from Jon's Higgs run. To swap it in:
     1. Commit the plate to web/assets/refs/ (e.g. pub_upthe_duff.png), ai-label it as usual.
     2. Set ONE custom property — everything else self-adjusts:
            #pn-pub{ --pnpub-plate:url("../../refs/pub_upthe_duff.png"); }
        (.pnpub-plate paints it cover-fit; the smoke wash, vignette and brass rail stay on top so
        type keeps AA over any plate. Until then --pnpub-plate is unset and the CSS room below —
        gradient walls, back-bar glow, halftone smoke — carries the scene.)
   No imagery is generated here; the CSS room is the designed placeholder.

   Type: the SST two voices only — IS (display/UI) + JetBrains Mono (labels/data).
   Layout: single column, max 720px, safe at 390 (no horizontal scroll — Law 3).
   Motion: transitions only; prefers-reduced-motion kills them (Law 4).
   ══════════════════════════════════════════════════════════════════════════════════════════════ */

#pn-pub{
  position:fixed; inset:0; z-index:9600;
  overflow-y:auto; overflow-x:hidden;
  -webkit-overflow-scrolling:touch;
  background:#0b0805;                          /* full occlusion — Law 2 */
  color:#f2ead8;
  font-family:IS,ui-sans-serif,system-ui,sans-serif;
}

/* ── the room ─────────────────────────────────────────────────────────────────────────────── */
#pn-pub .pnpub-scene{ position:fixed; inset:0; pointer-events:none; }
#pn-pub .pnpub-scene i{ position:absolute; inset:0; display:block; }
#pn-pub .pnpub-plate{
  background:
    var(--pnpub-plate,
      radial-gradient(120% 70% at 50% 0%, #2a1a10 0%, #1a110a 45%, #0b0805 100%));
  background-size:cover; background-position:center;
}
/* back-bar glow + bottle shelf implied by light, not drawn objects */
#pn-pub .pnpub-smoke{
  background:
    radial-gradient(60% 34% at 50% 12%, rgba(249,115,22,.16) 0%, rgba(249,115,22,0) 70%),
    radial-gradient(40% 26% at 18% 30%, rgba(255,190,120,.07) 0%, rgba(255,190,120,0) 70%),
    radial-gradient(46% 30% at 84% 26%, rgba(255,140,80,.06) 0%, rgba(255,140,80,0) 70%),
    radial-gradient(2px 2px at 22% 60%, rgba(255,255,255,.05) 0 1px, transparent 1.5px);
}
#pn-pub .pnpub-vig{
  background:radial-gradient(120% 90% at 50% 40%, rgba(6,4,2,0) 34%, rgba(6,4,2,.55) 72%, rgba(6,4,2,.9) 100%);
}
/* the brass rail — one warm hairline across the fold, the SST's brass note */
#pn-pub .pnpub-rail{
  inset:auto 0 0 0; height:32vh;
  background:linear-gradient(180deg, rgba(11,8,5,0) 0%, rgba(20,13,8,.85) 40%, rgba(9,6,4,.98) 100%);
  border-top:1px solid rgba(214,166,96,.28);
  box-shadow:0 -1px 22px rgba(214,166,96,.10);
}

/* ── frame ────────────────────────────────────────────────────────────────────────────────── */
#pn-pub .pnpub-frame{
  position:relative; z-index:1;
  max-width:720px; margin:0 auto;
  padding:clamp(14px,4vw,34px) clamp(14px,4vw,28px) 64px;
  box-sizing:border-box;
}
#pn-pub .pnpub-head{
  display:flex; align-items:flex-start; justify-content:space-between; gap:12px;
  padding-bottom:18px; margin-bottom:8px;
  border-bottom:1px solid rgba(214,166,96,.22);
}
/* neon sign — brand-orange tube over the back bar */
#pn-pub .pnpub-sign{
  display:block;
  font-style:italic; font-weight:900; text-transform:uppercase;
  font-size:clamp(30px,8.4vw,52px); line-height:.82; letter-spacing:-.05em;
  color:#ffd9c2;
  text-shadow:
    0 0 6px rgba(249,115,22,.9), 0 0 18px rgba(249,115,22,.55),
    0 0 42px rgba(249,115,22,.32), 0 2px 2px rgba(0,0,0,.7);
}
#pn-pub .pnpub-sign b{ color:#ffb27a; }
#pn-pub .pnpub-sub{
  display:block; margin-top:10px;
  font-family:JB,ui-monospace,monospace;
  font-size:9px; font-weight:700; letter-spacing:.3em; color:#cdbfa8;
}
#pn-pub .pnpub-leave{
  flex:0 0 auto; min-height:44px; padding:10px 16px;
  background:rgba(242,234,216,.08); color:#f2ead8;
  border:1px solid rgba(242,234,216,.35); border-radius:2px;
  font-family:JB,ui-monospace,monospace; font-size:11px; font-weight:700; letter-spacing:.18em;
  cursor:pointer;
}
#pn-pub .pnpub-leave:hover{ background:rgba(242,234,216,.16); }

/* ── copy ─────────────────────────────────────────────────────────────────────────────────── */
#pn-pub .pnpub-intro{ font-size:14px; line-height:1.55; color:#e7dcc6; margin:14px 0 6px; }
#pn-pub .pnpub-cap{
  font-family:JB,ui-monospace,monospace;
  font-size:10px; font-weight:700; letter-spacing:.2em; text-transform:uppercase;
  color:#ffb27a; margin:0 0 6px;
}
#pn-pub .pnpub-sec{
  display:flex; align-items:center; gap:12px; margin:22px 0 10px;
  font-family:JB,ui-monospace,monospace;
  font-size:10px; font-weight:700; letter-spacing:.28em; color:#cdbfa8;
}
#pn-pub .pnpub-sec i{ flex:1; height:1px; background:rgba(214,166,96,.2); }

/* ── companion cards ──────────────────────────────────────────────────────────────────────── */
#pn-pub .pnpub-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:10px; }
@media (max-width:430px){ #pn-pub .pnpub-grid{ grid-template-columns:1fr; } }
#pn-pub .pnpub-comp{
  display:flex; align-items:center; gap:12px; text-align:left; width:100%;
  min-height:64px; padding:12px; box-sizing:border-box;
  background:rgba(26,17,10,.82); color:#f2ead8;
  border:1px solid rgba(214,166,96,.22); border-radius:2px;
  cursor:pointer; transition:border-color .18s, background .18s, transform .18s;
}
#pn-pub .pnpub-comp:hover{ border-color:rgba(249,115,22,.7); background:rgba(36,23,13,.9); transform:translateY(-1px); }
#pn-pub .pnpub-comp.is-spent{ opacity:.5; cursor:default; }
#pn-pub .pnpub-comp.is-spent:hover{ border-color:rgba(214,166,96,.22); transform:none; }
#pn-pub .pnpub-mono{
  flex:0 0 40px; width:40px; height:40px; display:grid; place-items:center;
  background:#f97316; color:#0b0805;                        /* accent fill carries dark ink — Law 1 */
  font-weight:900; font-size:15px; border-radius:2px;
}
#pn-pub .pnpub-comp-b{ flex:1; min-width:0; display:flex; flex-direction:column; gap:2px; }
#pn-pub .pnpub-comp-b b{ font-size:14px; font-weight:800; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
#pn-pub .pnpub-comp-b em{ font-style:normal; font-size:11px; color:#cdbfa8; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
#pn-pub .pnpub-comp-b i{
  font-style:normal; font-family:JB,ui-monospace,monospace;
  font-size:9px; font-weight:700; letter-spacing:.14em; color:#ffb27a;
}
#pn-pub .pnpub-comp-go{
  flex:0 0 auto; font-family:JB,ui-monospace,monospace;
  font-size:10px; font-weight:700; letter-spacing:.12em; color:#ffb27a;
}

/* ── the night ────────────────────────────────────────────────────────────────────────────── */
#pn-pub .pnpub-night{ margin-top:14px; }
#pn-pub .pnpub-comp-head{ display:flex; align-items:center; gap:12px; margin-bottom:14px; }
#pn-pub .pnpub-comp-head b{ display:block; font-size:17px; font-weight:900; }
#pn-pub .pnpub-comp-head em{ display:block; font-style:normal; font-size:11px; color:#cdbfa8; }
#pn-pub .pnpub-glasses{ display:flex; gap:6px; margin:0 0 16px; }
#pn-pub .pnpub-glass svg{ width:16px; height:22px; display:block; }
#pn-pub .pnpub-glass path{ fill:none; stroke:rgba(242,234,216,.4); stroke-width:1.2; }
#pn-pub .pnpub-glass.is-sunk path{ fill:#f9a35c; stroke:#ffd9c2; }
#pn-pub .pnpub-topics{ display:grid; grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); gap:10px; }
#pn-pub .pnpub-topic{
  text-align:left; padding:14px 12px; min-height:70px; box-sizing:border-box;
  background:rgba(26,17,10,.85); color:#f2ead8;
  border:1px solid rgba(214,166,96,.3); border-radius:2px; cursor:pointer;
  transition:border-color .18s, background .18s;
}
#pn-pub .pnpub-topic:hover{ border-color:#f97316; background:rgba(40,25,13,.92); }
#pn-pub .pnpub-topic b{ display:block; font-size:13px; font-weight:900; letter-spacing:.02em; }
#pn-pub .pnpub-topic em{ display:block; font-style:normal; font-size:11px; line-height:1.4; color:#cdbfa8; margin-top:4px; }
#pn-pub .pnpub-shout{
  margin:10px 0 0; font-family:JB,ui-monospace,monospace;
  font-size:10px; font-weight:700; letter-spacing:.14em; color:#cdbfa8;
}
#pn-pub .pnpub-last{
  margin:6px 0 0; font-family:JB,ui-monospace,monospace;
  font-size:11px; font-weight:700; letter-spacing:.18em; color:#ffb27a;
}
#pn-pub .pnpub-nightfeed{ margin:16px 0; display:flex; flex-direction:column; gap:8px; }
#pn-pub .pnpub-beat{
  padding:10px 12px; background:rgba(20,13,8,.85);
  border-left:3px solid #f97316; border-radius:0 2px 2px 0;
}
#pn-pub .pnpub-beat-k{
  font-family:JB,ui-monospace,monospace;
  font-size:9px; font-weight:700; letter-spacing:.22em; color:#ffb27a;
}
#pn-pub .pnpub-beat p{ margin:4px 0 0; font-size:13px; line-height:1.5; color:#f2ead8; }
#pn-pub .pnpub-empty{ font-size:12px; color:#cdbfa8; font-style:italic; }
/* !important on the fill pair: the legacy office button catch-alls in style-01.css repaint any
   <button> they can reach and they carry !important of their own — measured live, the primary
   rendered dark. Bright-orange fill takes near-black ink (SST §5f corollary, 7.3:1+). */
#pn-pub .pnpub-end{
  width:100%; min-height:48px; padding:12px;
  background:var(--accent,#FF2E88) !important; color:#0b0805 !important;
  border:0 !important; border-radius:2px; cursor:pointer;
  font-weight:900; font-size:13px; letter-spacing:.04em; text-transform:uppercase;
}
#pn-pub .pnpub-end:hover{ background:#ff8a3d !important; }

/* ── house games + jukebox ────────────────────────────────────────────────────────────────── */
#pn-pub .pnpub-house{ display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:10px; }
#pn-pub .pnpub-fixture{
  text-align:left; padding:16px 14px; box-sizing:border-box;
  background:rgba(26,17,10,.85); color:#f2ead8;
  border:1px solid rgba(214,166,96,.3); border-radius:2px; cursor:pointer;
  transition:border-color .18s, background .18s;
}
#pn-pub .pnpub-fixture:hover{ border-color:#f97316; background:rgba(40,25,13,.92); }
#pn-pub .pnpub-fx-k{
  display:block; font-family:JB,ui-monospace,monospace;
  font-size:9px; font-weight:700; letter-spacing:.24em; color:#ffb27a;
}
#pn-pub .pnpub-fixture b{ display:block; font-size:20px; font-weight:900; font-style:italic; text-transform:uppercase; letter-spacing:-.02em; margin:4px 0; }
#pn-pub .pnpub-fixture em{ display:block; font-style:normal; font-size:11px; line-height:1.45; color:#cdbfa8; }
#pn-pub .pnpub-fx-go{
  display:inline-block; margin-top:10px;
  font-family:JB,ui-monospace,monospace;
  font-size:10px; font-weight:700; letter-spacing:.14em; color:#ffb27a;
}
#pn-pub .pnpub-juke{ display:flex; flex-direction:column; gap:8px; }
#pn-pub .pnpub-track{
  display:flex; align-items:center; gap:10px; width:100%;
  min-height:46px; padding:10px 12px; box-sizing:border-box; text-align:left;
  background:rgba(20,13,8,.85); color:#f2ead8;
  border:1px solid rgba(214,166,96,.25); border-radius:2px; cursor:pointer;
}
#pn-pub .pnpub-track:hover{ border-color:rgba(249,115,22,.7); }
#pn-pub .pnpub-track .pj-dot{ flex:0 0 8px; width:8px; height:8px; border-radius:50%; background:rgba(242,234,216,.3); }
#pn-pub .pnpub-track.is-on .pj-dot{ background:#f97316; box-shadow:0 0 8px rgba(249,115,22,.8); }
#pn-pub .pnpub-track b{ flex:1; font-family:JB,ui-monospace,monospace; font-size:11px; font-weight:700; letter-spacing:.1em; }
#pn-pub .pnpub-track .pj-st{ font-family:JB,ui-monospace,monospace; font-size:9px; font-weight:700; letter-spacing:.14em; color:#ffb27a; }
#pn-pub .pnpub-juke-note{ font-size:11px; color:#cdbfa8; font-style:italic; margin:4px 0 0; }

/* ── in-scene note (quiet toast) ──────────────────────────────────────────────────────────── */
#pn-pub .pnpub-note{
  position:fixed; left:50%; bottom:22px; transform:translateX(-50%) translateY(8px);
  max-width:min(560px,calc(100vw - 32px)); box-sizing:border-box;
  padding:10px 16px; background:#f2ead8; color:#1a110a;      /* light slip, dark ink — AA */
  border-radius:2px; font-size:12px; font-weight:700; line-height:1.4;
  opacity:0; pointer-events:none; transition:opacity .22s, transform .22s; z-index:3;
}
#pn-pub .pnpub-note.is-on{ opacity:1; transform:translateX(-50%) translateY(0); }

/* ── house-game window (darts / pool, iframed over the scene) ─────────────────────────────── */
.pnpub-game{
  position:fixed; inset:0; z-index:9700; display:flex; flex-direction:column;
  background:#0b0805;
}
.pnpub-game-bar{
  flex:0 0 auto; display:flex; align-items:center; justify-content:space-between; gap:10px;
  padding:10px 14px; background:#16100c; border-bottom:1px solid rgba(214,166,96,.28);
}
.pnpub-game-t{
  font-family:JB,ui-monospace,monospace;
  font-size:10px; font-weight:700; letter-spacing:.2em; color:#f2ead8;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
/* 2026-09-14: BACK TO THE BAR is the ONLY way out of an iframed cabinet — the game inside owns the
   whole rest of the screen — and it measured 36px tall, under the 44px house floor the three
   cabinets themselves now hold (pn-arcade-20260914.css §1). The one control that must never be
   missed was the smallest one on the screen. */
.pnpub-game-x{
  flex:0 0 auto; min-height:44px; padding:8px 14px;
  background:#f97316; color:#0b0805; border:0; border-radius:2px; cursor:pointer;
  font-family:JB,ui-monospace,monospace; font-size:10px; font-weight:700; letter-spacing:.14em;
}
.pnpub-game-frame{ flex:1; width:100%; border:0; background:#000; }

/* ── week-close foot (the evening CTA rides next to Start Week) ───────────────────────────────
   The ledger foot is a flex ROW; adding the pub CTA clipped the primary off the 390 frame
   (measured live). Both actions go full-width, primary first — nothing clips, nothing wraps. */
.bigmodal-foot.ws-foot{ flex-wrap:wrap; }
.bigmodal-foot.ws-foot .ws-cta{ flex:1 1 100%; order:1; }
.bigmodal-foot.ws-foot #ws-pub{ flex:1 1 100%; order:2; }

/* ══ SPEND ≠ OUTCOME (CEO 2026-08-15) ══════════════════════════════════════════════════════════
   A topic already taken tonight is dimmed but STILL AA (#cdbfa8 on the card ground = 8.1:1) and
   still fully operable — you may buy that round, it just buys company. Never a disabled ghost:
   "quiet" is not "invisible" (Law 1), and the label states the reason in words, not by colour. */
#pn-pub .pnpub-topic.is-spent{ border-color:rgba(214,166,96,.16); }
#pn-pub .pnpub-topic.is-spent em{ color:#cdbfa8; }
#pn-pub .pnpub-shout-law{
  margin-top:4px; color:#cdbfa8; font-style:italic;
}
#pn-pub .pnpub-beat.is-flavour .pnpub-beat-k{ color:#cdbfa8; }

/* ══ MARLOWE'S CORNER TABLE ════════════════════════════════════════════════════════════════════
   SPEC_pub-wahwahs-marlowe.md §1. She is the ONE cold object in the warmest room in the game, and
   the styling carries that: where every other card in here is brass-on-brown and invites a tap,
   hers is a colder slab with a single severity spine and NO hover lift. Nothing about it says
   "come and have a nice time".

   INK (Law 1 — measured on this pinned-dark seam with a contrast script, not eyeballed):
     · body / her speech #f2ead8 on #140e09  → 14.9:1
     · muted + labels    #cdbfa8 on #140e09  →  9.9:1
     · severity + .is-neg #ffb27a on #140e09 →  9.5:1
       (NOT the #f97316 fill orange — that is 4.3:1 as INK here, so it is only ever a fill
        behind near-black text, never text on this ground)
     · .is-pos          #9fd39f on #140e09   →  9.9:1
     · SIT DOWN         #0b0805 on #f2ead8   → 15.9:1
   Severity is never carried by colour ALONE — the flag always states the condition in words. */
#pn-pub .pnpub-sec-mar span{ color:#ffb27a; }

#pn-pub .pnpub-mar{
  position:relative;
  padding:14px 14px 14px 18px;
  background:#140e09;                        /* colder and flatter than the companion cards */
  border:1px solid rgba(214,166,96,.26);
  border-radius:2px;
}
/* the severity spine — the SST's `--p` spine idiom, one loud note, no glow */
#pn-pub .pnpub-mar::before{
  content:""; position:absolute; left:0; top:0; bottom:0; width:3px; background:#ffb27a;
}
#pn-pub .pnpub-mar.is-recovery::before{ background:#9fd39f; }

#pn-pub .pnpub-mar-who{ display:flex; align-items:center; gap:12px; }
#pn-pub .pnpub-mar-face{
  flex:0 0 auto; width:72px; height:72px; border-radius:2px;
  object-fit:cover; object-position:50% 22%;
  border:1px solid rgba(214,166,96,.3);
  filter:grayscale(.35) contrast(1.06);      /* she is lit by the room, not by the brand */
}
#pn-pub .pnpub-mar-id{ min-width:0; }
#pn-pub .pnpub-mar-id b{ display:block; font-size:16px; font-weight:650; color:#f2ead8; line-height:1.2; }
#pn-pub .pnpub-mar-id em{
  display:block; margin-top:3px; font-style:normal;
  font-family:JB,ui-monospace,monospace;
  font-size:9.5px; font-weight:700; letter-spacing:.18em; color:#cdbfa8;
}
#pn-pub .pnpub-mar-flag{
  display:inline-block; margin-top:6px; font-style:normal;
  font-family:JB,ui-monospace,monospace;
  font-size:9.5px; font-weight:700; letter-spacing:.16em; color:#ffb27a;
}
#pn-pub .pnpub-mar.is-recovery .pnpub-mar-flag{ color:#9fd39f; }

/* her speech — the only italic body copy in the room, because it is the only verbatim voice */
#pn-pub .pnpub-mar-open{
  margin:12px 0 0; font-size:14.5px; line-height:1.55; font-style:italic; color:#f2ead8;
}
#pn-pub .pnpub-mar-close{
  margin:12px 0 0; padding-top:10px; border-top:1px solid rgba(214,166,96,.16);
  font-size:13.5px; line-height:1.5; font-style:italic; color:#f2ead8;
}
#pn-pub .pnpub-mar-note{ margin:8px 0 0; font-size:12px; line-height:1.45; color:#cdbfa8; }

/* the ledger she puts in front of you — real numbers, mono, no chart, no decoration */
#pn-pub .pnpub-mar-ledger{ margin:12px 0 0; }
#pn-pub .pnpub-mar-row{
  display:flex; align-items:baseline; justify-content:space-between; gap:12px;
  padding:7px 0; border-bottom:1px solid rgba(214,166,96,.12);
}
#pn-pub .pnpub-mar-row dt{
  font-family:JB,ui-monospace,monospace;
  font-size:10px; font-weight:700; letter-spacing:.14em; color:#cdbfa8; text-transform:uppercase;
}
#pn-pub .pnpub-mar-row dd{
  margin:0; font-family:JB,ui-monospace,monospace;
  font-size:13px; font-weight:700; color:#f2ead8; text-align:right;
}
#pn-pub .pnpub-mar-row dd.is-neg{ color:#ffb27a; }
#pn-pub .pnpub-mar-row dd.is-pos{ color:#9fd39f; }

/* SIT DOWN — deliberately NOT the brand-orange CTA the rest of the room uses. Bone on dark: this
   is not a treat you are buying, and it must not look like one. 44px target (HIG + Law 1). */
#pn-pub .pnpub-mar-sit{
  display:block; width:100%; margin:14px 0 0;
  min-height:44px; padding:12px 14px; box-sizing:border-box;
  background:#f2ead8; color:#0b0805; border:0; border-radius:2px; cursor:pointer;
  font-family:JB,ui-monospace,monospace;
  font-size:11px; font-weight:700; letter-spacing:.16em;
  transition:background .18s;
}
#pn-pub .pnpub-mar-sit:hover{ background:#fff; }
#pn-pub .pnpub-mar-sit:focus-visible{ outline:2px solid #ffb27a; outline-offset:2px; }

/* her absence — the good news, and the quietest line on the screen (Law 15: earns its weight) */
#pn-pub .pnpub-corner-empty{
  margin:18px 0 0; padding-left:11px; border-left:1px solid rgba(214,166,96,.22);
  font-size:12.5px; line-height:1.5; font-style:italic; color:#cdbfa8;
}

@media (max-width:430px){
  #pn-pub .pnpub-mar-face{ width:56px; height:56px; }
  #pn-pub .pnpub-mar-id b{ font-size:15px; }
  #pn-pub .pnpub-mar-open{ font-size:14px; }
  /* the ledger stacks rather than truncating the mono value at 390 (Law 3) */
  #pn-pub .pnpub-mar-row{ flex-direction:column; align-items:flex-start; gap:2px; }
  #pn-pub .pnpub-mar-row dd{ text-align:left; }
}

/* ── motion discipline ────────────────────────────────────────────────────────────────────── */
@media (prefers-reduced-motion:reduce){
  #pn-pub *, .pnpub-game *{ transition:none !important; animation:none !important; }
}

/* ── THE BAR — the stranger, and the two empty states ──────────────────────────────────────────
   design/SPEC_pub-leads_2026-08-16.md · content/pub/strangers.json

   Deliberately QUIETER than the corner table. Marlowe is the loudest thing in the room when she
   is here because she is a warning; the stranger is an opportunity, and an opportunity that
   shouts is the "AI slop" signature (UX_RULES §12). One mono eyebrow, one italic arrival line,
   the existing companion card, one explanatory note. Nothing new invented.

   INK, measured on the room's ground #140e09 (same discipline as the corner-table block above):
     · .pnpub-sec-str span   #cdbfa8 on #140e09  →  9.7:1   (inherits .pnpub-sec)
     · .pnpub-str-arrive     #e7dcc6 on #140e09  → 12.9:1
     · .pnpub-str-empty      #cdbfa8 on #140e09  →  9.7:1
     · .pnpub-str-note       #cdbfa8 on #140e09  →  9.7:1
   All four clear AA (4.5:1) with room to spare, in a scene that is a DESIGNED pinned-dark seam
   (Theme Law §5) exactly as the rest of this file is. */
#pn-pub .pnpub-sec-str span{ color:#ffb27a; }

#pn-pub .pnpub-str-arrive{
  margin:0 0 12px; padding-left:11px;
  border-left:1px solid rgba(214,166,96,.28);
  font-size:13.5px; line-height:1.5; font-style:italic; color:#e7dcc6;
}
#pn-pub .pnpub-str-empty{
  margin:0; padding-left:11px;
  border-left:1px solid rgba(214,166,96,.22);
  font-size:12.5px; line-height:1.5; font-style:italic; color:#cdbfa8;
}
#pn-pub .pnpub-str-note{
  margin:10px 0 0; font-size:12px; line-height:1.5; color:#cdbfa8;
}

@media (max-width:430px){
  #pn-pub .pnpub-str-arrive{ font-size:13px; }
}

/* THE STRANGER'S ROLE LINE MUST NOT TRUNCATE (caught on a 1280 render, 2026-08-16).
   Every other companion in this room is a job title — "Chief Strategy Officer", 22 characters —
   so the shared card clips its `em` to one line and nothing ever noticed. A stranger is described
   rather than titled ("a junior · somewhere they are not enjoying", 42 characters) and that line
   is the ONLY thing the player knows about them before deciding to spend a night on them. It
   clipped to "somewhere they are not…", which is not a description, it is a cliffhanger.
   Scoped by its OWN class, not by a sibling combinator — `.pnpub-sec-str ~ .pnpub-grid` was the
   first attempt and `~` matches EVERY later sibling, so it would have un-truncated the whole cast
   (THE FLOOR, CLIENTS, RIVAL SHOPS) and broken their single-line rhythm. */
#pn-pub .pnpub-grid-str .pnpub-comp-b em{
  white-space:normal; overflow:visible; text-overflow:clip; line-height:1.35;
}

/* ══ DF-01 — REGULARS + RAPPORT ════════════════════════════════════════════════════════════════
   Contrast measured against the same #1a110a/rgba(26,17,10,.82) card ground every other pnpub
   line already sits on (design/UX_RULES.md §1 — explicit AA ink everywhere):
     · .pnpub-sec-note   #cdbfa8 on #1a110a → 8.4:1
     · .pnpub-rapport-n  #ffb27a on #1a110a → 7.9:1
   The rail itself carries no text — the number beside it is the accessible value, per Law 7
   (never a colour-only fact). Reduced motion: the fill width is a static style attribute, not an
   animation, so there is nothing here for prefers-reduced-motion to strip. */
#pn-pub .pnpub-sec-note{
  margin:0 0 10px; font-size:12px; line-height:1.5; color:#cdbfa8; font-style:italic;
}
#pn-pub .pnpub-rapport{
  display:block; width:100%; max-width:120px; height:4px; margin-top:4px;
  background:rgba(214,166,96,.18); border-radius:2px; overflow:hidden;
}
#pn-pub .pnpub-rapport-fill{
  display:block; height:100%; background:#f97316; border-radius:2px;
}
#pn-pub .pnpub-rapport-n{
  font-style:normal; font-family:JB,ui-monospace,monospace;
  font-size:9px; font-weight:700; letter-spacing:.14em; color:#ffb27a; margin-top:2px;
}
#pn-pub .pnpub-comp-head .pnpub-rapport{ max-width:160px; }
#pn-pub .pnpub-rapport-unlock{
  margin:0 0 14px; padding:10px 12px;
  background:rgba(249,115,22,.1); border-left:3px solid #f97316; border-radius:0 2px 2px 0;
}
#pn-pub .pnpub-rapport-unlock p{ margin:2px 0; font-size:12.5px; line-height:1.5; color:#f2ead8; }