/* ══ #141 · THE WHITE BLOB BEHIND THE CLOSE BUTTON (CEO 08-13) ═════════════════════════════════
   Measured, not guessed. The Close button on a big modal computes to:

       box-shadow: rgb(238, 244, 252) 10px 10px 0px 0px;  border-radius: 999px

   — an opaque near-white pill, offset ten pixels right and ten down, sitting behind a pill-shaped
   button. That is the blob, exactly as he described it, and it is present in BOTH shells because
   the modal card is pinned dark in both.

   THE CAUSE IS ONE TOKEN DOING TWO OPPOSITE JOBS. style-01.css casts the brutalist hard shadow
   with `box-shadow:10px 10px 0 var(--ink)`, and --ink means "the colour text should be on this
   surface". On paper stock that is near-black and the cast shadow reads as intended. Inside the
   big modal --ink is correctly re-declared to #eef4fc so the body copy stays legible on the dark
   card — and the shadow rule, which never asked for a text colour in the first place, inherits it
   and paints a white slab. Both declarations are right about their own job; the bug is that they
   are the same variable.

   THE FIX IS TO SEPARATE THEM, not to switch the shadow off. `--pn-cast` means "the colour a hard
   cast shadow is thrown in", and it defaults to var(--ink) so every surface that reads correctly
   today is untouched — this file changes nothing on paper stock. Where the surface is dark, the
   token is re-pointed at a dark cast so the shadow behaves like a shadow instead of a highlight.

   Deletion, not dimming, would have meant removing the shadow. That is the wrong call here: the
   hard offset cast is the house language on primary buttons across the game, and losing it on the
   modals alone would make those buttons a different species. The shadow stays; it just stops being
   white.

   Own file, loaded after style-01.css, because style-01.css is a shared surface and a one-line
   token edit inside it is not worth the merge conflict. */

:root, body { --pn-cast: var(--ink); }

/* The dark surfaces. Each of these re-declares --ink to a light value for legibility, which is
   precisely why each needs the cast pointed somewhere else. Named explicitly — a catch-all here
   is how the beige-button defect happened twice. */
.bigmodal,
.bigmodal-card,
.bigmodal-foot,
.pnp2-win,
.pn-ready-scrim { --pn-cast: rgba(4, 8, 14, .55); }

/* Re-cast with the token. The selectors mirror style-01.css's own so specificity lands, and the
   :not(:disabled) guard is kept — a disabled button never carried the cast and must not gain one. */
.bigmodal button.primary:not(:disabled),
.bigmodal-foot button.primary:not(:disabled),
.pnp2-win button.primary:not(:disabled){ box-shadow: 8px 8px 0 var(--pn-cast); }
.bigmodal button.primary:not(:disabled):hover,
.bigmodal-foot button.primary:not(:disabled):hover,
.pnp2-win button.primary:not(:disabled):hover{ box-shadow: 10px 10px 0 var(--pn-cast); }

/* At 390 a 10px offset on a 180px button is a fifth of its width standing proud of it. The cast
   is a texture, not a layout element — it tightens on a phone so it reads as depth rather than as
   a second object next to the button. */
@media (max-width: 480px){
  .bigmodal button.primary:not(:disabled),
  .bigmodal-foot button.primary:not(:disabled),
  .pnp2-win button.primary:not(:disabled){ box-shadow: 5px 5px 0 var(--pn-cast); }
}
