/* =============================================================================
   Lesser Evil — the poisoner's shop.

   A night room again, but not the spy games' navy: aubergine shadows, a dark
   glass cabinet, two bottles that glow. Option A is always the green poison,
   option B always the purple one, everywhere they appear (bottles, votes,
   the tally), so a glance says which is which. Cards are apothecary labels:
   parchment, a dashed inner border, a number and a small skull.

   Creepster (Font Diner, SIL OFL) drips on English headings and the letters
   on the bottles only; Persian stays in Vazirmatn at its heaviest. Running
   text is never in the display face.

   Prefix `pz-`. Parts made by game-kit.js keep their `gk-`/`spy-` names.
   ========================================================================== */

@font-face {
  font-family: 'Creepster';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../fonts/creepster-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2212, U+2215;
}

.pz-page {
  --pz-night: #0f0a16;
  --pz-night-2: #1a1226;
  --pz-night-3: #261a36;
  --pz-line: rgb(214 190 255 / 16%);
  --pz-green: #8af34a;
  --pz-green-hi: #c4ff94;
  --pz-green-deep: #2f7514;
  --pz-purple: #b46cff;
  --pz-purple-hi: #dcb8ff;
  --pz-purple-deep: #4e1c96;
  --pz-bone: #efe6d0;
  --pz-mist: #b9aacd;
  --pz-label: #f1e6c8;
  --pz-label-2: #d8c597;
  --pz-ink: #2a1d14;
  --pz-ink-soft: #6a543c;
  --pz-blood: #ff5d7d;
  --pz-display: 'Creepster', var(--font-sans);
  padding-block-start: calc(var(--header-h) + var(--space-8));
}
.pz-page :lang(fa),
.pz-page:lang(fa) { --pz-display: var(--font-sans); }

.gk-icon { display: inline-grid; place-items: center; flex: none; }
.gk-icon svg { inline-size: 1.2em; block-size: 1.2em; }

/* --- Hero ----------------------------------------------------------------- */
.pz-hero { padding-block: var(--space-4) var(--space-6); }
.pz-hero .h1 { font-family: var(--pz-display); font-size: var(--text-5xl); font-weight: 900; letter-spacing: 0.02em; color: var(--pz-green); text-shadow: 0 0 24px rgb(138 243 74 / 35%), 0 3px 0 var(--pz-green-deep); }
.pz-page:lang(fa) .pz-hero .h1 { letter-spacing: 0; }
.pz-hero .lede { margin-block-start: var(--space-4); color: var(--text-soft); }
.pz-back { display: flex; inline-size: fit-content; align-items: center; gap: var(--space-2); margin-block-end: var(--space-5); color: var(--text-muted); font-size: var(--text-sm); }
.pz-back:hover { color: var(--text); }
ul.pz-badges { display: flex; flex-wrap: wrap; gap: var(--space-2); margin-block-start: var(--space-5); }
.pz-noscript { margin-block-start: var(--space-4); padding: var(--space-3) var(--space-4); border: 1px solid var(--pz-blood); border-radius: var(--r-md); color: var(--pz-blood); }

body.pz-is-playing .pz-hero,
body.pz-is-playing .pz-method { display: none; }
body.pz-is-playing .pz-page { padding-block-start: calc(var(--header-h) + var(--space-3)); }
.pz-game { display: grid; gap: var(--space-4); padding-block-end: var(--space-8); scroll-margin-block-start: calc(var(--header-h) + var(--space-2)); }
body.pz-is-playing .pz-game.shell { max-inline-size: min(100%, 90rem); padding-block-end: var(--space-4); }
.pz-stage { display: grid; gap: var(--space-5); min-inline-size: 0; }

/* --- The cabinet: a dark glass panel in a thin wooden frame -------------- */
.pz-shelf {
  position: relative;
  padding: clamp(1.25rem, 3vw, 2.5rem);
  border-radius: 0.9rem;
  background:
    radial-gradient(120% 70% at 50% 0%, rgb(180 108 255 / 12%), transparent 60%),
    radial-gradient(90% 60% at 100% 100%, rgb(138 243 74 / 7%), transparent 60%),
    linear-gradient(180deg, var(--pz-night-3), var(--pz-night-2) 45%, var(--pz-night));
  box-shadow: inset 0 0 0 1px var(--pz-line), inset 0 1px 0 rgb(255 255 255 / 8%), 0 0 0 4px #2a1d16, 0 0 0 5px #4a3426, 0 26px 50px -24px rgb(0 0 0 / 90%);
  color: var(--pz-bone);
}

/* --- Buttons: a glowing green potion, a purple one, glass -------------- */
.pz-btn {
  --face: linear-gradient(180deg, var(--pz-green-hi), var(--pz-green) 55%, #5fc52a);
  --lip: var(--pz-green-deep);
  --ink: #10200a;
  display: inline-flex; align-items: center; justify-content: center; gap: var(--space-2);
  min-block-size: 2.9rem; padding: 0.55rem 1.3rem;
  border: 0; border-radius: 999px;
  background: var(--face);
  box-shadow: inset 0 1px 0 rgb(255 255 255 / 50%), 0 4px 0 var(--lip), 0 0 22px -6px var(--pz-green), 0 10px 20px -10px rgb(0 0 0 / 80%);
  color: var(--ink); font: inherit; font-weight: 900; line-height: 1.2;
  cursor: pointer; transition: transform 80ms ease-out, box-shadow 80ms ease-out, filter 120ms;
  -webkit-tap-highlight-color: transparent;
}
.pz-btn:hover { filter: brightness(1.06); }
.pz-btn:active { transform: translateY(3px); box-shadow: inset 0 1px 0 rgb(255 255 255 / 50%), 0 1px 0 var(--lip); }
.pz-btn:focus-visible { outline: 3px solid var(--pz-bone); outline-offset: 4px; }
.pz-btn[disabled] { opacity: 0.35; cursor: not-allowed; filter: grayscale(0.6); transform: none; box-shadow: 0 4px 0 var(--lip); }
.pz-btn[hidden] { display: none; }
.pz-btn--ghost { --face: rgb(255 255 255 / 4%); --lip: transparent; box-shadow: inset 0 0 0 2px rgb(214 190 255 / 28%); color: var(--pz-bone); }
.pz-btn--ghost:active { box-shadow: inset 0 0 0 2px rgb(214 190 255 / 28%); }
.pz-btn--sm { min-block-size: 2.4rem; padding: 0.4rem 1rem; font-size: var(--text-sm); }
.pz-btn--lg { min-block-size: 3.3rem; padding-inline: 1.8rem; font-size: var(--text-lg); }
.pz-btn--xl { min-block-size: 4rem; padding-inline: 2.6rem; font-size: var(--text-xl); }

/* --- Setup ---------------------------------------------------------------- */
.pz-setup { display: grid; gap: var(--space-6); }
.pz-setup__title { font-family: var(--pz-display); font-size: var(--text-4xl); font-weight: 900; color: var(--pz-purple-hi); letter-spacing: 0.02em; text-shadow: 0 0 22px rgb(180 108 255 / 40%); }
.pz-page:lang(fa) .pz-setup__title { letter-spacing: 0; }
.pz-setup__intro { margin-block-start: var(--space-2); max-inline-size: 46rem; color: var(--pz-mist); line-height: var(--leading-normal); }
.pz-setup__body { display: grid; gap: var(--space-6); }
.pz-setup__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); gap: var(--space-8); align-items: start; }
.pz-setup__col { display: grid; gap: var(--space-5); min-inline-size: 0; }
.pz-setup__go { justify-self: center; min-inline-size: min(100%, 22rem); }
.pz-join { display: grid; gap: var(--space-6); }
.pz-field { display: grid; gap: var(--space-2); }
.pz-field__label { display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--space-2); color: var(--pz-green-hi); font-size: var(--text-sm); font-weight: 900; }
.pz-field__hint { color: var(--pz-mist); font-size: var(--text-xs); font-weight: 600; }
.pz-input {
  inline-size: 100%; min-block-size: 2.8rem; padding: 0.5rem 0.9rem;
  border: 0; border-radius: 0.5rem;
  background: linear-gradient(180deg, var(--pz-label), var(--pz-label-2));
  box-shadow: inset 0 2px 4px rgb(0 0 0 / 25%);
  color: var(--pz-ink); font: inherit; font-weight: 700;
}
.pz-input::placeholder { color: rgb(42 29 20 / 45%); }
.pz-input:focus { outline: 3px solid var(--pz-green); outline-offset: 2px; }
.pz-codeinput { font-family: var(--font-mono, monospace); font-size: var(--text-2xl); font-weight: 800; letter-spacing: 0.12em; text-align: center; }
.pz-codeinput[aria-invalid='true'] { outline: 3px solid var(--pz-blood); }
.pz-codeinput.is-shake { animation: pz-shake 360ms; }
@keyframes pz-shake { 20%, 60% { transform: translateX(-6px); } 40%, 80% { transform: translateX(6px); } }
.pz-note { min-block-size: 1.2em; color: var(--pz-blood); font-size: var(--text-sm); font-weight: 700; }
.pz-note:empty { display: none; }
.pz-table-intro { color: var(--pz-mist); line-height: var(--leading-normal); }
.pz-resume { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-3); padding: var(--space-3) var(--space-4); border-radius: 0.6rem; background: rgb(0 0 0 / 30%); box-shadow: inset 0 0 0 1px rgb(138 243 74 / 30%); }
.pz-resume__title { font-weight: 900; color: var(--pz-green-hi); }
.pz-resume__note { color: var(--pz-mist); font-size: var(--text-sm); }
.pz-resume__actions { display: flex; flex-wrap: wrap; gap: var(--space-2); }

/* Mode tabs */
.pz-modes { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-2); }
.pz-mode { display: grid; grid-template-columns: auto minmax(0, 1fr); grid-template-areas: 'glyph name' 'glyph sub'; align-items: center; gap: 0 var(--space-3); padding: var(--space-3) var(--space-4); border: 0; border-radius: 0.7rem; background: rgb(0 0 0 / 28%); box-shadow: inset 0 0 0 1px var(--pz-line); color: var(--pz-bone); font: inherit; text-align: start; cursor: pointer; transition: transform 100ms, box-shadow 140ms, background 140ms; }
.pz-mode:hover { transform: translateY(-2px); }
.pz-mode:focus-visible { outline: 3px solid var(--pz-green); outline-offset: 2px; }
.pz-mode.is-on { background: linear-gradient(180deg, rgb(180 108 255 / 22%), rgb(180 108 255 / 8%)); box-shadow: inset 0 0 0 2px var(--pz-purple), 0 0 22px -6px var(--pz-purple); }
.pz-mode__glyph { grid-area: glyph; inline-size: 2.3rem; block-size: 2.3rem; background: var(--pz-purple-hi); -webkit-mask: var(--g) center / contain no-repeat; mask: var(--g) center / contain no-repeat; }
.pz-mode[data-mode='here'] .pz-mode__glyph { --g: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='6' y='2' width='12' height='20' rx='2.5'/%3E%3C/svg%3E"); }
.pz-mode[data-mode='host'] .pz-mode__glyph { --g: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='1' y='5' width='7' height='13' rx='1.5'/%3E%3Crect x='8.5' y='3' width='7' height='15' rx='1.5'/%3E%3Crect x='16' y='5' width='7' height='13' rx='1.5'/%3E%3Crect x='3' y='20' width='18' height='2' rx='1'/%3E%3C/svg%3E"); }
.pz-mode[data-mode='join'] .pz-mode__glyph { --g: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 4h4v4H3zM10 4h4v4h-4zM17 4h4v4h-4zM3 11h4v4H3zM10 11h4v4h-4zM17 11h4v4h-4zM10 18h4v4h-4z'/%3E%3C/svg%3E"); }
.pz-mode__name { grid-area: name; font-weight: 900; color: var(--pz-purple-hi); }
.pz-mode__sub { grid-area: sub; color: var(--pz-mist); font-size: var(--text-xs); }

/* Player names: one corked vial per seat */
.pz-names { display: grid; gap: var(--space-2); margin: 0; padding: 0; list-style: none; }
.pz-names__row { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: var(--space-2); }
.pz-names__vial { display: grid; place-items: center; inline-size: 2rem; block-size: 2.6rem; border-radius: 0.3rem 0.3rem 0.9rem 0.9rem; background: linear-gradient(180deg, transparent 35%, rgb(138 243 74 / 55%) 35%); box-shadow: inset 0 0 0 2px rgb(196 255 148 / 45%); color: #fff; font-size: var(--text-xs); font-weight: 900; }
.pz-names__remove { display: grid; place-items: center; inline-size: 2.4rem; block-size: 2.4rem; border: 0; border-radius: 50%; background: rgb(255 93 125 / 12%); color: var(--pz-blood); cursor: pointer; }
.pz-names__remove:focus-visible { outline: 3px solid var(--pz-blood); outline-offset: 2px; }
.pz-names__add { justify-self: start; }
.pz-names__add[hidden] { display: none; }

/* Option rows (game-kit selector) */
.pz-options { display: grid; gap: var(--space-2); }
.pz-option { display: grid; grid-template-columns: minmax(0, 1fr) minmax(11rem, 14rem); align-items: center; gap: var(--space-3); padding: var(--space-2); padding-inline-start: var(--space-4); border-radius: 0.6rem; background: rgb(0 0 0 / 26%); box-shadow: inset 0 0 0 1px var(--pz-line); }
.pz-option:focus-within { box-shadow: inset 0 0 0 2px rgb(138 243 74 / 55%); }
.pz-option__text { display: grid; min-inline-size: 0; }
.pz-option__label { font-weight: 900; color: var(--pz-bone); }
.pz-option__hint { color: var(--pz-mist); font-size: var(--text-xs); }
.pz-option__control { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: var(--space-2); }
.pz-option__middle { display: grid; justify-items: center; gap: 0.3rem; min-inline-size: 0; }
.pz-option__value { overflow: hidden; max-inline-size: 100%; color: var(--pz-green-hi); font-weight: 900; text-overflow: ellipsis; white-space: nowrap; }
.pz-option__value.is-bump { animation: pz-bump 220ms var(--ease-out); }
@keyframes pz-bump { from { transform: scale(0.8); opacity: 0.4; } }
.pz-option__pips { display: flex; gap: 0.25rem; }
.pz-option__pip { inline-size: 0.5rem; block-size: 0.5rem; border-radius: 50%; background: rgb(255 255 255 / 12%); }
.pz-option__pip.is-on { background: var(--pz-green); box-shadow: 0 0 6px var(--pz-green); }
.pz-option__arrow { display: grid; place-items: center; inline-size: 2.6rem; block-size: 2.6rem; border: 0; border-radius: 50%; background: rgb(180 108 255 / 22%); box-shadow: inset 0 0 0 1px rgb(214 190 255 / 35%); color: var(--pz-purple-hi); cursor: pointer; transition: transform 80ms; }
.pz-option__arrow:hover:not([disabled]) { background: rgb(180 108 255 / 35%); }
.pz-option__arrow:active { transform: scale(0.94); }
.pz-option__arrow[disabled] { opacity: 0.25; cursor: default; }
.pz-option__arrow:focus-visible { outline: 3px solid var(--pz-green); outline-offset: 2px; }

/* --- Overlays: hand-overs, splashes, the lobby, the end ------------------ */
.pz-overlay { position: fixed; inset: 0; z-index: 200; display: grid; place-items: safe center; overflow-y: auto; padding: calc(var(--header-h) + var(--space-3)) var(--space-4) var(--space-4); background: radial-gradient(circle at 50% 40%, rgb(38 26 54 / 88%), rgb(8 5 12 / 96%)); backdrop-filter: blur(6px); animation: pz-fade 200ms ease-out; }
.pz-game:fullscreen .pz-overlay, .pz-game:fullscreen > .pz-overlay { padding-block-start: var(--space-4); }
/* Handing the phone over: solid, so nothing of the last player's screen shows. */
.pz-overlay[data-kind='pass'] { background: radial-gradient(circle at 50% 40%, #241833, #07050b 75%); backdrop-filter: none; }
@keyframes pz-fade { from { opacity: 0; } }
.pz-splash { display: grid; justify-items: center; gap: var(--space-3); inline-size: min(100%, 34rem); text-align: center; animation: pz-rise 360ms cubic-bezier(0.2, 1.3, 0.4, 1); }
@keyframes pz-rise { from { opacity: 0; transform: translateY(1.5rem) scale(0.97); } }
.pz-splash__title { font-family: var(--pz-display); font-size: var(--text-3xl); font-weight: 900; letter-spacing: 0.02em; color: var(--pz-green-hi); outline: none; }
.pz-page:lang(fa) .pz-splash__title, .pz-overlay:lang(fa) .pz-splash__title { letter-spacing: 0; }
.pz-splash__kicker { color: var(--pz-purple-hi); font-size: var(--text-sm); font-weight: 900; letter-spacing: 0.1em; text-transform: uppercase; }
.pz-splash__sub { color: var(--pz-mist); }
.pz-splash__actions { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--space-2); }
.pz-splash--lobby { inline-size: min(100%, 34rem); }
.pz-bigcode__label { color: var(--pz-mist); font-size: var(--text-xs); font-weight: 800; letter-spacing: 0.1em; text-transform: uppercase; }
.pz-bigcode { font-family: var(--font-mono, monospace); font-size: clamp(2.2rem, 1.5rem + 4vw, 3.6rem); font-weight: 800; line-height: 1; color: var(--pz-green-hi); letter-spacing: 0.08em; text-shadow: 0 0 24px rgb(138 243 74 / 45%); unicode-bidi: isolate; }
.pz-overlay:lang(fa) .pz-bigcode { font-family: var(--font-sans); font-weight: 900; letter-spacing: 0.04em; }
.pz-status { min-block-size: 1.2em; color: var(--pz-green-hi); font-size: var(--text-sm); font-weight: 700; }
.pz-lobby-seats { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--space-2); margin: 0; padding: 0; list-style: none; }
.pz-lobby-seat { display: grid; justify-items: center; gap: 0.3rem; padding: 0.45rem 0.6rem; border-radius: 0.5rem; background: rgb(0 0 0 / 28%); color: var(--pz-mist); font-size: var(--text-xs); font-weight: 800; }
.pz-lobby-seat.is-me { box-shadow: inset 0 0 0 2px var(--pz-green); color: var(--pz-green-hi); }

/* A decorative round-bottomed flask */
.pz-flask { position: relative; display: block; inline-size: 4.5rem; aspect-ratio: 3 / 4; }
.pz-flask::before { content: ''; position: absolute; inset-inline: 34%; inset-block-start: 0; block-size: 34%; border-radius: 0.2rem 0.2rem 0 0; box-shadow: inset 0 0 0 3px rgb(214 190 255 / 60%); background: linear-gradient(90deg, rgb(255 255 255 / 12%), transparent); }
.pz-flask::after { content: ''; position: absolute; inset: 28% 0 0; border-radius: 50%; box-shadow: inset 0 0 0 3px rgb(214 190 255 / 60%), 0 0 30px -4px var(--pz-purple); background: linear-gradient(180deg, transparent 40%, var(--pz-purple) 40%, var(--pz-purple-deep)); }
.pz-flask--big { inline-size: 6rem; }

/* --- The play screen ---------------------------------------------------- */
.pz-arena { display: grid; gap: var(--space-3); min-inline-size: 0; padding: clamp(0.6rem, 1.4vw, 1.2rem); border-radius: 1rem; background: linear-gradient(180deg, var(--pz-night-2), var(--pz-night)); box-shadow: inset 0 0 0 1px var(--pz-line), 0 0 0 4px #2a1d16, 0 0 0 5px #4a3426; color: var(--pz-bone); }
.pz-bar { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--space-2) var(--space-4); }
.pz-bar__info { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0.2rem var(--space-3); min-inline-size: 0; }
.pz-bar__round { font-family: var(--pz-display); font-size: var(--text-2xl); color: var(--pz-green-hi); letter-spacing: 0.03em; }
.pz-page:lang(fa) .pz-bar__round { font-weight: 900; letter-spacing: 0; }
.pz-bar__judge { color: var(--pz-mist); font-size: var(--text-sm); font-weight: 800; }
.pz-bar__me { display: inline-flex; flex-wrap: wrap; align-items: baseline; gap: 0.2rem var(--space-2); color: var(--pz-mist); font-size: var(--text-sm); font-weight: 800; }
.pz-bar__score { font-size: var(--text-2xl); color: var(--pz-bone); }
.pz-bar__tools { display: flex; flex: none; gap: var(--space-2); }
.pz-tool { display: inline-flex; align-items: center; justify-content: center; gap: 0.4rem; min-inline-size: 2.5rem; block-size: 2.5rem; padding-inline: 0.6rem; border: 0; border-radius: 999px; background: rgb(0 0 0 / 30%); box-shadow: inset 0 0 0 1px var(--pz-line); color: var(--pz-mist); font: inherit; font-size: var(--text-xs); font-weight: 800; cursor: pointer; }
.pz-tool:hover { color: #fff; box-shadow: inset 0 0 0 1px var(--pz-purple); }
.pz-tool:focus-visible { outline: 3px solid var(--pz-green); outline-offset: 2px; }
.pz-tool--wide { padding-inline: 0.9rem; }

/* Scores: one vial per player, filling toward the target */
.pz-scores { display: flex; align-items: center; gap: var(--space-3); min-inline-size: 0; }
.pz-scores[hidden] { display: none; }
ol.pz-scores__list { display: flex; flex: 1; gap: var(--space-2); min-inline-size: 0; margin: 0; padding: 0.9rem 0 0.2rem; overflow-x: auto; list-style: none; scrollbar-width: thin; }
.pz-scores__target { flex: none; color: var(--pz-mist); font-size: var(--text-xs); font-weight: 800; }
.pz-score { position: relative; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; grid-template-areas: 'vial name pts' 'vial dd judge'; align-items: center; gap: 0 0.45rem; flex: none; min-inline-size: 7.5rem; max-inline-size: 11rem; padding: 0.35rem 0.6rem; border-radius: 0.6rem; background: rgb(0 0 0 / 28%); box-shadow: inset 0 0 0 1px var(--pz-line); }
.pz-score.is-judge { box-shadow: inset 0 0 0 2px var(--pz-purple), 0 0 16px -6px var(--pz-purple); }
.pz-score .pz-vial { grid-area: vial; }
.pz-score__name { grid-area: name; overflow: hidden; font-size: var(--text-sm); font-weight: 800; text-overflow: ellipsis; white-space: nowrap; }
.pz-score__pts { grid-area: pts; font-size: var(--text-lg); color: var(--pz-green-hi); }
.pz-score__dd { grid-area: dd; justify-self: start; padding: 0 0.35rem; border-radius: 0.3rem; background: rgb(180 108 255 / 22%); color: var(--pz-purple-hi); font-size: 0.65rem; font-weight: 900; }
.pz-score__dd.is-gone { background: none; color: rgb(185 170 205 / 40%); text-decoration: line-through; }
.pz-score__judge { grid-area: judge; justify-self: end; padding: 0.05rem 0.45rem; border-radius: 999px; background: var(--pz-purple); color: #fff; font-size: 0.65rem; font-weight: 900; }
.pz-score__delta { position: absolute; inset-block-start: -0.7rem; inset-inline-start: 0.4rem; padding: 0.05rem 0.4rem; border-radius: 999px; background: var(--pz-green); color: #10200a; font-size: 0.7rem; font-weight: 900; animation: pz-pop 420ms cubic-bezier(0.2, 1.6, 0.4, 1) both; }
.pz-score__delta.is-minus { background: var(--pz-blood); color: #fff; }
@keyframes pz-pop { from { transform: scale(0.3); opacity: 0; } }
.pz-vial { position: relative; display: block; inline-size: 1.2rem; block-size: 2.1rem; border-radius: 0.2rem 0.2rem 0.6rem 0.6rem; background: linear-gradient(0deg, var(--pz-green) calc(var(--fill, 0) * 100%), rgb(255 255 255 / 5%) calc(var(--fill, 0) * 100%)); box-shadow: inset 0 0 0 2px rgb(214 190 255 / 45%); transition: background 600ms; }
.pz-vial::before { content: ''; position: absolute; inset-inline: 22%; inset-block-start: -0.35rem; block-size: 0.4rem; border-radius: 0.15rem; background: #8a5a3a; }
.pz-lobby-seat .pz-vial { --fill: 0.5; }

.pz-main { display: grid; min-inline-size: 0; }
.pz-view { display: grid; justify-items: center; gap: var(--space-4); padding-block: var(--space-2) var(--space-3); text-align: center; animation: pz-rise 300ms ease-out; }
.pz-step { display: grid; justify-items: center; gap: 0.3rem; max-inline-size: 44rem; }
.pz-step__who { padding: 0.15rem 0.7rem; border-radius: 999px; background: rgb(180 108 255 / 18%); color: var(--pz-purple-hi); font-size: var(--text-xs); font-weight: 900; }
.pz-step__title { font-family: var(--pz-display); font-size: clamp(1.7rem, 1.2rem + 2vw, 2.6rem); font-weight: 900; line-height: 1.1; letter-spacing: 0.02em; color: var(--pz-green-hi); outline: none; }
.pz-page:lang(fa) .pz-step__title { letter-spacing: 0; }
.pz-step__sub { max-inline-size: 38rem; color: var(--pz-mist); line-height: var(--leading-normal); }

/* --- Cards: apothecary labels ---------------------------------------------- */
.pz-card {
  position: relative; display: grid; align-content: start; gap: 0.4rem;
  padding: 0.7rem 0.8rem 0.85rem;
  border-radius: 0.35rem;
  background: radial-gradient(120% 90% at 50% 0%, #fbf3dd, var(--pz-label) 55%, var(--pz-label-2));
  box-shadow: inset 0 0 0 1px rgb(42 29 20 / 35%), inset 0 0 0 5px var(--pz-label), inset 0 0 0 6px rgb(42 29 20 / 30%), 0 10px 20px -12px rgb(0 0 0 / 90%);
  color: var(--pz-ink); text-align: start;
}
.pz-card__head { display: flex; align-items: center; justify-content: space-between; gap: 0.4rem; padding-block-end: 0.3rem; border-block-end: 1px dashed rgb(42 29 20 / 35%); color: var(--pz-ink-soft); font-size: 0.68rem; font-weight: 900; letter-spacing: 0.06em; text-transform: uppercase; }
.pz-card__skull { inline-size: 1rem; block-size: 1rem; background: currentcolor; -webkit-mask: var(--skull) center / contain no-repeat; mask: var(--skull) center / contain no-repeat;
  --skull: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2C6.9 2 3 5.6 3 10.3c0 2.9 1.5 5.2 3.8 6.6V20a1 1 0 0 0 1 1h1.6v-2h1.6v2h2v-2h1.6v2h1.6a1 1 0 0 0 1-1v-3.1c2.3-1.4 3.8-3.7 3.8-6.6C21 5.6 17.1 2 12 2Zm-3.5 11.5a2.2 2.2 0 1 1 0-4.4 2.2 2.2 0 0 1 0 4.4Zm7 0a2.2 2.2 0 1 1 0-4.4 2.2 2.2 0 0 1 0 4.4ZM12 16.4l-1.3-2.2h2.6Z'/%3E%3C/svg%3E"); }
.pz-card__text { font-size: var(--text-base); font-weight: 800; line-height: 1.35; }
.pz-card__text:lang(fa) { font-family: var(--font-sans); line-height: 1.7; }
.pz-card--mini { padding: 0.5rem 0.6rem; }
.pz-card--mini .pz-card__head { display: none; }
.pz-card--mini .pz-card__text { font-size: var(--text-sm); }

/* A hand to choose from */
.pz-handwrap { display: grid; justify-items: center; gap: var(--space-4); inline-size: 100%; }
.pz-hand { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-3); inline-size: 100%; }
.pz-pick { display: grid; padding: 0; border: 0; border-radius: 0.45rem; background: none; font: inherit; cursor: pointer; transition: transform 160ms cubic-bezier(0.2, 1.4, 0.4, 1), filter 160ms; animation: pz-deal 380ms cubic-bezier(0.2, 1.3, 0.4, 1) both; animation-delay: calc(var(--i, 0) * 50ms); }
@keyframes pz-deal { from { opacity: 0; transform: translateY(1rem) rotate(-3deg); } }
.pz-pick > .pz-card { block-size: 100%; }
.pz-pick:hover { transform: translateY(-3px) rotate(-0.6deg); }
.pz-pick:focus-visible { outline: 3px solid var(--pz-green); outline-offset: 3px; }
.pz-pick.is-on { transform: translateY(-5px) scale(1.02); filter: drop-shadow(0 0 14px rgb(138 243 74 / 75%)); }
.pz-pick.is-on .pz-card { box-shadow: inset 0 0 0 3px var(--pz-green-deep), inset 0 0 0 6px var(--pz-label), inset 0 0 0 7px rgb(42 29 20 / 30%); }
.pz-hand__go { min-inline-size: min(100%, 18rem); }

/* --- Bottles: A is green, B is purple ------------------------------------- */
.pz-bottle { --c: var(--pz-green); --c-hi: var(--pz-green-hi); --c-deep: var(--pz-green-deep); display: grid; justify-items: center; gap: 0; inline-size: min(100%, 20rem); }
.pz-bottle--b { --c: var(--pz-purple); --c-hi: var(--pz-purple-hi); --c-deep: var(--pz-purple-deep); }
.pz-bottle__glass {
  position: relative; inline-size: 6.4rem; aspect-ratio: 3 / 4; overflow: hidden;
  margin-block-end: -1.2rem; z-index: 0;
  border-radius: 38% 38% 0.9rem 0.9rem / 30% 30% 0.9rem 0.9rem;
  background: linear-gradient(90deg, rgb(255 255 255 / 16%), rgb(255 255 255 / 3%) 30%, rgb(255 255 255 / 2%) 75%, rgb(255 255 255 / 12%));
  box-shadow: inset 0 0 0 3px color-mix(in srgb, var(--c-hi) 60%, transparent), 0 0 34px -8px var(--c);
}
.pz-bottle__cork { position: absolute; inset-inline: 36%; inset-block-start: 0; block-size: 16%; border-radius: 0 0 0.25rem 0.25rem; background: linear-gradient(180deg, #a8744d, #7b5134); z-index: 2; }
.pz-bottle__liquid { position: absolute; inset: 42% 0 0; background: linear-gradient(180deg, var(--c-hi), var(--c) 30%, var(--c-deep)); }
.pz-bottle__liquid::before { content: ''; position: absolute; inset-inline: -10%; inset-block-start: -0.35rem; block-size: 0.8rem; border-radius: 50%; background: var(--c-hi); animation: pz-slosh 3.2s ease-in-out infinite; }
@keyframes pz-slosh { 50% { transform: translateX(6%) rotate(2deg); } }
.pz-bottle__letter { position: absolute; inset: 40% 0 auto; z-index: 1; font-family: var(--pz-display); font-size: 2.4rem; line-height: 1; color: #fff; text-shadow: 0 2px 0 rgb(0 0 0 / 35%), 0 0 12px rgb(0 0 0 / 30%); }
.pz-page:lang(fa) .pz-bottle__letter, .pz-overlay:lang(fa) .pz-bottle__letter { font-weight: 900; font-size: 1.9rem; }
.pz-bubble { position: absolute; inset-block-end: 8%; inset-inline-start: calc(18% + var(--i) * 14%); inline-size: 0.4rem; block-size: 0.4rem; border-radius: 50%; background: rgb(255 255 255 / 70%); animation: pz-bubble 2.6s ease-in infinite; animation-delay: calc(var(--i) * -0.55s); }
@keyframes pz-bubble { 0% { transform: translateY(0) scale(0.6); opacity: 0; } 15% { opacity: 0.9; } 70% { opacity: 0.6; } 100% { transform: translateY(-3.4rem) scale(1.1); opacity: 0; } }
.pz-bottle > .pz-card { position: relative; z-index: 1; inline-size: 100%; box-shadow: inset 0 0 0 1px rgb(42 29 20 / 35%), inset 0 0 0 5px var(--pz-label), inset 0 0 0 6px color-mix(in srgb, var(--c-deep) 70%, transparent), 0 0 26px -10px var(--c), 0 12px 22px -14px rgb(0 0 0 / 90%); }
.pz-bottle.is-empty .pz-bottle__liquid { inset-block-start: 88%; opacity: 0.6; }
.pz-bottle.is-empty .pz-bottle__glass { box-shadow: inset 0 0 0 3px rgb(214 190 255 / 35%); }
.pz-bottle.is-empty .pz-bubble { display: none; }
.pz-bottle--hero { inline-size: min(100%, 26rem); }
.pz-bottle--hero .pz-bottle__glass { inline-size: 8rem; }
.pz-bottle--hero .pz-card__text { font-size: var(--text-xl); }
.pz-bottle--splash { inline-size: min(100%, 24rem); }
.pz-bottle--small .pz-bottle__glass { inline-size: 4.5rem; }

.pz-pair { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); align-items: center; justify-items: center; gap: var(--space-3); inline-size: min(100%, 54rem); }
.pz-pair .pz-bottle { inline-size: 100%; max-inline-size: 22rem; }
.pz-pair--small .pz-bottle__glass { inline-size: 4.4rem; }
.pz-pair--small .pz-bottle__letter { font-size: 1.8rem; }
.pz-pair--small .pz-card__text { font-size: var(--text-sm); }
.pz-or { display: grid; place-items: center; inline-size: 3rem; block-size: 3rem; border-radius: 50%; background: var(--pz-night); box-shadow: inset 0 0 0 2px var(--pz-line); color: var(--pz-bone); font-weight: 900; text-transform: uppercase; }
.pz-or--big { inline-size: 4rem; block-size: 4rem; font-family: var(--pz-display); font-size: var(--text-2xl); font-weight: 400; }
.pz-page:lang(fa) .pz-or--big { font-weight: 900; }
.pz-view--board .pz-card__text { font-size: var(--text-lg); }

/* --- Voting -------------------------------------------------------------- */
.pz-votebox { display: grid; justify-items: center; gap: var(--space-3); inline-size: min(100%, 54rem); }
.pz-choices { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-4); inline-size: 100%; }
.pz-choice { display: grid; justify-items: center; padding: var(--space-3) var(--space-2); border: 0; border-radius: 1rem; background: rgb(0 0 0 / 25%); box-shadow: inset 0 0 0 2px var(--pz-line); font: inherit; color: inherit; cursor: pointer; transition: transform 140ms, box-shadow 140ms, background 140ms; }
.pz-choice .pz-bottle { max-inline-size: 22rem; }
.pz-choice:hover { transform: translateY(-3px); }
.pz-choice:focus-visible { outline: 3px solid var(--pz-bone); outline-offset: 3px; }
.pz-choice--a.is-on { background: rgb(138 243 74 / 14%); box-shadow: inset 0 0 0 3px var(--pz-green), 0 0 30px -8px var(--pz-green); }
.pz-choice--b.is-on { background: rgb(180 108 255 / 16%); box-shadow: inset 0 0 0 3px var(--pz-purple), 0 0 30px -8px var(--pz-purple); }
.pz-choices:has(.is-on) .pz-choice:not(.is-on) { opacity: 0.55; }
.is-table .pz-choice .pz-bottle__glass { inline-size: 9rem; }
.is-table .pz-choice .pz-bottle__letter { font-size: 3.6rem; }
.pz-dd { display: inline-flex; align-items: center; gap: var(--space-2); min-block-size: 2.8rem; padding: 0.4rem 1rem 0.4rem 0.5rem; border: 0; border-radius: 999px; background: rgb(180 108 255 / 12%); box-shadow: inset 0 0 0 2px rgb(180 108 255 / 40%); color: var(--pz-purple-hi); font: inherit; font-weight: 900; cursor: pointer; }
.pz-dd__x { display: grid; place-items: center; inline-size: 2rem; block-size: 2rem; border-radius: 50%; background: rgb(180 108 255 / 25%); }
.pz-dd.is-on { background: var(--pz-purple); box-shadow: 0 0 22px -4px var(--pz-purple); color: #fff; }
.pz-dd.is-on .pz-dd__x { background: rgb(255 255 255 / 25%); }
.pz-dd[disabled] { opacity: 0.45; cursor: not-allowed; text-decoration: line-through; }
.pz-dd:focus-visible { outline: 3px solid var(--pz-bone); outline-offset: 3px; }
.pz-dd__hint { max-inline-size: 30rem; color: var(--pz-mist); font-size: var(--text-xs); }
.pz-dd__hint:empty { display: none; }
.pz-dd--sm { min-block-size: 2.4rem; padding: 0.2rem 0.7rem; }
.pz-votebox__lock { min-inline-size: min(100%, 18rem); }

/* Hands up: the Judge taps in each vote */
.pz-hands { display: grid; gap: var(--space-2); inline-size: min(100%, 32rem); margin: 0; padding: 0; list-style: none; }
.pz-hands__row { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; gap: var(--space-3); padding: 0.4rem 0.6rem 0.4rem 0.9rem; border-radius: 0.7rem; background: rgb(0 0 0 / 28%); box-shadow: inset 0 0 0 1px var(--pz-line); }
.pz-hands__name { overflow: hidden; font-weight: 800; text-align: start; text-overflow: ellipsis; white-space: nowrap; }
.pz-seg { display: inline-flex; gap: 0.3rem; }
.pz-seg__btn { min-inline-size: 3rem; min-block-size: 2.4rem; border: 0; border-radius: 999px; background: rgb(255 255 255 / 6%); box-shadow: inset 0 0 0 2px var(--pz-line); color: var(--pz-bone); font: inherit; font-weight: 900; cursor: pointer; }
.pz-seg__btn--a.is-on { background: var(--pz-green); color: #10200a; box-shadow: 0 0 16px -4px var(--pz-green); }
.pz-seg__btn--b.is-on { background: var(--pz-purple); color: #fff; box-shadow: 0 0 16px -4px var(--pz-purple); }
.pz-seg__btn:focus-visible { outline: 3px solid var(--pz-bone); outline-offset: 2px; }

/* --- The count ------------------------------------------------------------ */
.pz-tally { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-4); inline-size: min(100%, 50rem); }
.pz-tally__col { --c: var(--pz-green); display: grid; align-content: start; gap: var(--space-2); padding: var(--space-3); border-radius: 0.9rem; background: rgb(0 0 0 / 25%); box-shadow: inset 0 0 0 1px var(--pz-line); text-align: start; }
.pz-tally__col--b { --c: var(--pz-purple); }
.pz-tally__col.is-majority { box-shadow: inset 0 0 0 2px var(--c), 0 0 26px -10px var(--c); }
.pz-tally__head { display: flex; align-items: baseline; justify-content: space-between; }
.pz-tally__letter { font-family: var(--pz-display); font-size: var(--text-3xl); line-height: 1; color: var(--c); }
.pz-page:lang(fa) .pz-tally__letter { font-weight: 900; }
.pz-tally__count { font-size: var(--text-3xl); line-height: 1; }
.pz-tally__meter { block-size: 0.6rem; border-radius: 999px; background: linear-gradient(90deg, var(--c) calc(var(--share) * 100%), rgb(255 255 255 / 8%) calc(var(--share) * 100%)); }
.pz-tally__col:dir(rtl) .pz-tally__meter, [dir='rtl'] .pz-tally__meter { background: linear-gradient(270deg, var(--c) calc(var(--share) * 100%), rgb(255 255 255 / 8%) calc(var(--share) * 100%)); }
.pz-tally__names { display: flex; flex-wrap: wrap; gap: 0.3rem; margin: 0; padding: 0; list-style: none; }
.pz-tally__names li { display: inline-flex; align-items: center; gap: 0.3rem; padding: 0.1rem 0.6rem; border-radius: 999px; background: color-mix(in srgb, var(--c) 18%, transparent); font-size: var(--text-sm); font-weight: 800; }
.pz-tally__dd { color: var(--pz-purple-hi); font-size: 0.7rem; }
.pz-verdict { --c: var(--pz-blood); }
.pz-lines { display: grid; gap: 0.3rem; }
.pz-lines__main { font-size: var(--text-lg); font-weight: 900; }
.pz-lines__loss { color: var(--pz-blood); font-weight: 800; }

/* --- The end: a giant apothecary label ------------------------------------- */
.pz-label {
  position: relative; display: grid; justify-items: center; gap: var(--space-3);
  inline-size: min(100%, 28rem); padding: 1.8rem 1.6rem 1.5rem;
  border-radius: 0.6rem;
  background: radial-gradient(120% 80% at 50% 0%, #fbf3dd, var(--pz-label) 55%, var(--pz-label-2));
  box-shadow: inset 0 0 0 2px var(--pz-ink), inset 0 0 0 8px var(--pz-label), inset 0 0 0 9px rgb(42 29 20 / 45%), 0 0 60px -10px var(--pz-green), 0 24px 40px -18px rgb(0 0 0 / 90%);
  color: var(--pz-ink); text-align: center;
  animation: pz-rise 420ms cubic-bezier(0.2, 1.3, 0.4, 1);
}
.pz-label__kicker { font-size: var(--text-sm); font-weight: 900; letter-spacing: 0.12em; text-transform: uppercase; color: var(--pz-ink-soft); }
.pz-label__name { font-family: var(--pz-display); font-size: var(--text-3xl); font-weight: 900; letter-spacing: 0.02em; color: var(--pz-green-deep); outline: none; }
.pz-page:lang(fa) .pz-label__name, .pz-overlay:lang(fa) .pz-label__name { letter-spacing: 0; }
ol.pz-label__table { display: grid; gap: 0.2rem; inline-size: 100%; margin: 0; padding: 0.6rem 0; border-block: 2px solid var(--pz-ink); list-style: none; }
.pz-label__table li { display: flex; justify-content: space-between; gap: var(--space-3); padding: 0.15rem 0.4rem; font-weight: 800; }
.pz-label__table li.is-win { border-radius: 0.3rem; background: rgb(47 117 20 / 15%); color: var(--pz-green-deep); }
.pz-label__actions { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--space-2); }
.pz-label .pz-btn--ghost { box-shadow: inset 0 0 0 2px rgb(42 29 20 / 40%); color: var(--pz-ink); }
.pz-label .pz-flask::after { box-shadow: inset 0 0 0 3px var(--pz-ink), 0 0 30px -4px var(--pz-green); background: linear-gradient(180deg, transparent 40%, var(--pz-green) 40%, var(--pz-green-deep)); }
.pz-label .pz-flask::before { box-shadow: inset 0 0 0 3px var(--pz-ink); }

/* --- A phone each ------------------------------------------------------------ */
ol.pz-howto { display: grid; gap: var(--space-2); max-inline-size: 36rem; margin: 0; padding-inline-start: 1.4rem; color: var(--pz-mist); line-height: var(--leading-normal); text-align: start; list-style: decimal; }
.pz-howto li::marker { color: var(--pz-green); font-weight: 900; }
.pz-seen { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-2); inline-size: min(100%, 32rem); }
.pz-seen--two .pz-btn { white-space: normal; }
.pz-seen__btn { white-space: normal; }
.pz-seen__btn--minority, .pz-seen__btn--even { --face: rgb(180 108 255 / 20%); --lip: var(--pz-purple-deep); --ink: var(--pz-bone); box-shadow: inset 0 0 0 2px var(--pz-purple), 0 4px 0 var(--lip); }
.pz-seen__btn--unanimous { --face: rgb(255 255 255 / 8%); --lip: #3b2d4c; --ink: var(--pz-bone); box-shadow: inset 0 0 0 2px var(--pz-line), 0 4px 0 var(--lip); }
.pz-view--locked { padding-block: var(--space-8); }
.pz-bigvote { --c: var(--pz-green); position: relative; display: grid; place-items: center; inline-size: min(70vw, 16rem); aspect-ratio: 1; border-radius: 50%; background: radial-gradient(circle at 50% 35%, var(--c), color-mix(in srgb, var(--c) 40%, black)); box-shadow: 0 0 60px -6px var(--c); animation: pz-pop 420ms cubic-bezier(0.2, 1.6, 0.4, 1) both; }
.pz-bigvote--b { --c: var(--pz-purple); }
.pz-bigvote__letter { font-family: var(--pz-display); font-size: clamp(5rem, 30vw, 9rem); line-height: 1; color: #fff; text-shadow: 0 4px 0 rgb(0 0 0 / 30%); }
.pz-page:lang(fa) .pz-bigvote__letter { font-weight: 900; font-size: clamp(4rem, 24vw, 7rem); }
.pz-bigvote__dd { position: absolute; inset-block-start: 0.4rem; inset-inline-end: 0.2rem; padding: 0.2rem 0.6rem; border-radius: 999px; background: var(--pz-purple); box-shadow: 0 0 0 3px var(--pz-night); color: #fff; font-weight: 900; }
.pz-delta { font-family: var(--pz-display); font-size: clamp(4rem, 20vw, 7rem); line-height: 1; color: var(--pz-green-hi); text-shadow: 0 0 30px rgb(138 243 74 / 50%); animation: pz-pop 420ms cubic-bezier(0.2, 1.6, 0.4, 1) both; }
.pz-page:lang(fa) .pz-delta { font-weight: 900; }
.pz-delta.is-minus { color: var(--pz-blood); text-shadow: 0 0 30px rgb(255 93 125 / 50%); }
.pz-delta.is-zero { color: var(--pz-mist); text-shadow: none; }
.pz-parts { display: grid; gap: 0.3rem; inline-size: min(100%, 26rem); margin: 0; padding: 0; list-style: none; }
.pz-parts li { display: flex; justify-content: space-between; gap: var(--space-3); padding: 0.35rem 0.8rem; border-radius: 0.5rem; background: rgb(0 0 0 / 25%); font-weight: 800; }
.pz-parts b { color: var(--pz-green-hi); }
.pz-total { display: flex; align-items: baseline; gap: var(--space-2); color: var(--pz-mist); font-weight: 800; }
.pz-total b { font-size: var(--text-3xl); color: var(--pz-bone); }

/* --- Method ----------------------------------------------------------------- */
.pz-method { display: grid; gap: var(--space-5); padding-block: var(--space-8) var(--space-12); }
.pz-method__title { font-family: var(--pz-display); font-size: var(--text-2xl); letter-spacing: 0.02em; color: var(--pz-green-hi); }
.pz-page:lang(fa) .pz-method__title { font-weight: 900; letter-spacing: 0; }
.pz-method__intro { max-inline-size: 46rem; color: var(--text-muted); }
ol.pz-method__steps { display: grid; gap: var(--space-3); max-inline-size: 52rem; padding-inline-start: 1.4rem; color: var(--text-soft); line-height: var(--leading-normal); list-style: decimal; }
.pz-method__steps li::marker { color: var(--pz-green); font-weight: 900; }
.pz-method__line { max-inline-size: 52rem; color: var(--text-soft); line-height: var(--leading-normal); }
.pz-method__basis { max-inline-size: 52rem; padding: var(--space-4) var(--space-5); border-inline-start: 3px solid var(--pz-purple); background: rgb(180 108 255 / 8%); color: var(--text-soft); font-size: var(--text-sm); line-height: var(--leading-normal); }

/* --- Full screen -------------------------------------------------------------- */
.pz-game:fullscreen { display: block; overflow-y: auto; padding: clamp(0.5rem, 1.2vw, 1.25rem); background: var(--pz-night); }
.pz-game:fullscreen .pz-arena { min-block-size: calc(100dvh - 2 * clamp(0.5rem, 1.2vw, 1.25rem)); align-content: start; }

/* --- Small screens --------------------------------------------------------------- */
@media (max-width: 52rem) {
  .pz-setup__grid { grid-template-columns: minmax(0, 1fr); gap: var(--space-5); }
}
@media (max-width: 40rem) {
  .pz-modes { grid-template-columns: minmax(0, 1fr); }
  .pz-mode { padding-block: var(--space-2); }
  .pz-mode__glyph { inline-size: 1.8rem; block-size: 1.8rem; }
  .pz-option { grid-template-columns: minmax(0, 1fr); padding-inline-start: var(--space-3); gap: var(--space-2); }
  .pz-setup__go { inline-size: 100%; }
  .pz-tool--wide .gk-text { display: none; }
  .pz-bar__round { font-size: var(--text-xl); }
  .pz-bar__judge { font-size: var(--text-xs); }
  .pz-score { min-inline-size: 6.4rem; padding: 0.3rem 0.5rem; }
  .pz-pair { grid-template-columns: minmax(0, 1fr); gap: var(--space-2); }
  .pz-pair .pz-bottle__glass { display: none; }
  .pz-pair .pz-bottle > .pz-card { border-inline-start: 0.5rem solid var(--c); }
  .pz-or { inline-size: 2.4rem; block-size: 2.4rem; font-size: var(--text-xs); }
  .pz-hand { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-2); }
  .pz-card { padding: 0.55rem 0.6rem 0.7rem; }
  .pz-card__text { font-size: var(--text-sm); }
  .pz-choices { gap: var(--space-2); }
  .pz-choice .pz-bottle__glass { inline-size: 4.6rem; }
  .pz-choice .pz-card__text { font-size: var(--text-xs); }
  .is-table .pz-choice .pz-bottle__glass { inline-size: 7rem; }
  .pz-tally { grid-template-columns: minmax(0, 1fr); gap: var(--space-2); }
  .pz-seen { grid-template-columns: minmax(0, 1fr); }
  .pz-hand__go, .pz-votebox__lock { inline-size: 100%; }
}
@media (prefers-reduced-motion: reduce) {
  .pz-bubble, .pz-bottle__liquid::before, .pz-pick, .pz-view, .pz-splash, .pz-label, .pz-bigvote, .pz-delta, .pz-score__delta, .pz-codeinput.is-shake { animation: none; }
  .pz-bubble { display: none; }
}

/* Signed numbers read left to right in both languages (+۲, not ۲+). */
.pz-delta, .pz-parts b, .pz-score__delta { direction: ltr; unicode-bidi: isolate; }