/* pn-wahwahs-invite-20260913.css — THE WAHWAHS ARE AN INVITATION, NOT A STATUS CHIP.
   =============================================================================================
   CEO, 13 Sep 2026, two crops: the BUILD window titlebar ("02 BUILD | PITCH SET-PIECE // 3 OF …"
   truncated, "WAHWAHS / Next week" crammed against the right edge as a tracked mono chip) and a
   wire notice slip sat over the floor hero with a struck "NOT RANKED / WK 11" stamp under a band
   that already said WK 11. Verbatim: "this design is all to shit" · "and NOT how we alert or treat
   the WahWahs".

   THREE FIXES, ONE SHEET (loads last):
   1 · THE INVITATION. The ceremony is the season's night. It is announced the way a night is —
       a printed card on the desk: cream stock in every theme (a card is an object, it does not
       re-ink for the room), a gold rule, the cabinet face for the name, the night named, the cut
       named, one action. Markup: script-01 pnWahwahsInviteHTML(), mounted under the floor hero.
       The chip is gone from the pitch window titlebar (pn-pitch2 beatWin) and the stage rail.
   2 · THE TITLE. With the chip gone the pitch window title has its width back; it is also set at
       a titlebar size (the type cabinet's window tier put 25px cabinet type in a 44px bar and
       ellipsised it at "3 OF …").
   3 · THE WIRE. The stamp is not printed any more (toast() no longer emits it — pn-final §21's
       kill lost to that sheet's own `.wire-body > span{display:inline}` by one class). The slip
       anchors top-right under the masthead at a notice width, so it never sits on the hero.
   ============================================================================================= */

/* ── 1 · THE INVITATION ────────────────────────────────────────────────────────────────────── */
html body .pn-ww-invite{
  --wwi-stock:#F4EFE4; --wwi-stock-2:#EDE6D8; --wwi-ink:#1B1A17; --wwi-ink-dim:#5E574C;
  /* WHAT THIS CARD PINS ITS INK AGAINST. Published for the design system, which paints
     var(--ds-ink) with !important from a dozen rules and has no other way to know that this
     object's ground is cream in both themes. See pn-ds.css, "WHERE THE DESIGN SYSTEM STOPS". */
  --pn-surface-ink:#1B1A17; --pn-surface-ink-2:#5E574C;
  /* ⛔ THE GOLD IS TWO DIFFERENT JOBS AND WAS ONE COLOUR. #B8891F is right for the printed rule
     and the foil seal, which are decoration and answer to nobody. It was also carrying the
     eyebrow - 9.5px of tracked uppercase TEXT, measured 2.74:1 on the cream stock, a long way
     under AA for small type. Found while re-measuring this card after the surface fix, i.e. it
     had been shipping since the card was drawn. Text gets its own, darker gold: 5.4:1 on the
     stock, still unmistakably gold and still the same family as the rule beside it. */
  --wwi-gold-ink:#7E5A10;
  --wwi-gold:#B8891F; --wwi-gold-2:#E0B650; --wwi-cta:#B4380D;
  margin:18px 0 6px; padding:0;
}
html body .pn-ww-invite-card{
  position:relative; overflow:hidden;
  display:grid; grid-template-columns:minmax(0,1fr) auto; grid-template-areas:"eye seal" "h seal" "when seal" "race seal" "act seal";
  column-gap:18px; row-gap:4px; align-items:start;
  padding:20px 22px 20px 24px; border-radius:6px;
  background:linear-gradient(168deg,var(--wwi-stock),var(--wwi-stock-2));
  color:var(--wwi-ink);
  box-shadow:0 1px 0 rgba(255,255,255,.6) inset, 0 18px 40px -18px rgba(0,0,0,.55), 0 0 0 1px rgba(27,26,23,.10);
}
/* the gold rule — a printed edge, not a border box */
html body .pn-ww-invite-card::before{
  content:""; position:absolute; left:0; top:0; bottom:0; width:6px;
  background:linear-gradient(180deg,var(--wwi-gold-2),var(--wwi-gold) 60%,#8C6614);
}
html body .pn-ww-invite-eye{
  grid-area:eye; font:800 9.5px/1 var(--mono),ui-monospace,monospace !important; letter-spacing:.24em !important;
  text-transform:uppercase !important; color:var(--wwi-gold-ink) !important;
}
html body .pn-ww-invite .pn-ww-invite-h{
  grid-area:h; margin:6px 0 2px !important;
  font-family:var(--pn-type-face) !important; font-weight:900 !important;
  font-size:clamp(28px,3.2vw,44px) !important; line-height:.95 !important; letter-spacing:-.03em !important;
  color:var(--wwi-ink) !important; text-transform:none !important;
}
html body .pn-ww-invite-when{
  grid-area:when; margin:4px 0 0 !important; max-width:62ch;
  font:400 15px/1.45 IS,ui-sans-serif,system-ui,sans-serif !important; color:var(--wwi-ink) !important; letter-spacing:0 !important;
}
html body .pn-ww-invite-when b{ font-weight:800; color:var(--wwi-ink); }
html body .pn-ww-invite-race{
  grid-area:race; margin:2px 0 0 !important;
  font:700 10.5px/1.4 var(--mono),ui-monospace,monospace !important; letter-spacing:.08em !important; text-transform:uppercase !important;
  color:var(--wwi-ink-dim) !important;
}
html body .pn-ww-invite-act{ grid-area:act; margin-top:12px; }
/* The CTA sits INSIDE the card but is not on the card's ground - it has its own #B4380D fill, so
   it publishes its own ink rather than inheriting the stock's. Measured in light theme before
   this line: the shell repainted the label #221C16 on that red, 2.4:1, which had been shipping
   since the card was drawn and only became visible once the stock came back. */
html body .pn-ww-invite-cta{
  --pn-surface-ink:#fff; --pn-surface-ink-2:#fff;
  display:inline-flex; align-items:center; min-height:44px; padding:0 18px; border:0; border-radius:8px; cursor:pointer;
  background:var(--wwi-cta); color:#fff;
  font-family:var(--pn-type-face); font-weight:800; font-size:14px; letter-spacing:-.005em;
  box-shadow:0 6px 0 rgba(88,34,0,.35);
}
html body .pn-ww-invite-cta:hover{ background:#C94413; }
html body .pn-ww-invite-cta:active{ transform:translateY(2px); box-shadow:0 4px 0 rgba(88,34,0,.35); }
html body .pn-ww-invite-cta:focus-visible{ outline:2px solid var(--wwi-ink); outline-offset:2px; }
/* the trophy — the one flourish: the actual gold WahWah, top right (CEO 2026-09-26: "This should
   feature the gold WahWah trophy" — it replaces a "WW" foil disc that nobody could read as the prize) */
html body .pn-ww-invite-trophy{
  grid-area:seal; align-self:center; justify-self:end;
  display:block; height:150px; width:auto; max-width:120px; object-fit:contain;
  filter:drop-shadow(0 10px 14px rgba(60,40,5,.35));
}
/* the night itself: the card warms */
html body .pn-ww-invite.is-tonight .pn-ww-invite-card{ background:linear-gradient(168deg,#FBF3DD,#F1E4C0); }
html body .pn-ww-invite.is-tonight .pn-ww-invite-eye{ color:var(--wwi-cta) !important; }
@media (max-width:640px){
  html body .pn-ww-invite-card{ grid-template-columns:minmax(0,1fr) auto; grid-template-areas:"eye seal" "h seal" "when when" "race race" "act act"; padding:18px 18px 18px 20px; }
  html body .pn-ww-invite-trophy{ height:84px; max-width:66px; }
  html body .pn-ww-invite-cta{ width:100%; justify-content:center; }
}

/* ── 2 · THE PITCH WINDOW TITLE gets its room ──────────────────────────────────────────────── */
html body .pnp2-win .lg-titlebar .lg-tb-title{
  flex:1 1 auto !important; min-width:0 !important;
  font-family:var(--pn-type-face) !important; font-weight:800 !important;
  font-size:14px !important; line-height:1.15 !important; letter-spacing:-.01em !important;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
@media (max-width:560px){
  /* a phone titlebar lets the title run to two lines rather than ellipsise at "3 OF …" */
  html body .pnp2-win .lg-titlebar .lg-tb-title{ font-size:12.5px !important; white-space:normal; line-height:1.2 !important; text-overflow:clip; }
  html body .pnp2-win .lg-titlebar{ align-items:center; min-height:48px; }
}

/* ── 3 · THE WIRE ───────────────────────────────────────────────────────────────────────────── */
/* ⛔ THE CORNER PLACEMENT IS WITHDRAWN (CEO, 2026-09-20): "I want this pop up that currently
   appears top right to appear center screen and in a different highlight colour so its clear it
   needs to be closed - I want this on all Popups."
   This block put the wire in the top-right corner as "a notice, off the hero". style-01.css had
   already centred it (top/left 50%, translate(-50%,-50%)); being a later sheet, this quietly won.
   A notice a player must dismiss does not belong in the corner - the corner is where the eye goes
   last, and a message that blocks progress while looking like an ornament is the worst of both.
   Only the POSITION is withdrawn; the typography below was right and is kept. */
html body .toast.pn-wire .wire-body > .wire-stamp,
html body .toast.pn-wire .wire-body > .pn-stamp{ display:none !important; }
html body .toast.pn-wire .wire-body{ font-size:15px !important; line-height:1.45 !important; padding:14px 18px 16px !important; }

/* ── late fixes from the render pass ────────────────────────────────────────────────────────── */
/* the CTA lost its fill to the button-unify sheet's dark-theme rule (0,5,2 + !important) — same
   pin as the numerals sheet §4: repeat the class token to out-rank it, the fill is the card's own
   (the card is cream in every theme, so one ink pair is right in both) */
html body .pn-ww-invite-cta.pn-ww-invite-cta.pn-ww-invite-cta.pn-ww-invite-cta.pn-ww-invite-cta{
  background:#B4380D !important; color:#fff !important; border:0 !important;
}
html body .pn-ww-invite-cta.pn-ww-invite-cta.pn-ww-invite-cta.pn-ww-invite-cta.pn-ww-invite-cta:hover{ background:#C94413 !important; }
/* the wire band's traffic lights (style-01 ::before) were painting over "INTERNAL WIRE": style-01
   reserves 62px for them, pn-final's `padding:10px 16px !important` took it back. Reserved again. */
html body .toast.pn-wire .wire-band{ padding-left:62px !important; }
