/* Blindrise, the Quiet Luxury board (Issue #32: Step-0 spec 6328417238, Muse's rulings 6328611548).
   Preview only: loaded when the server runs with UI_BOARD=1, and every rule sits under html[data-ui="board"], so
   without the switch nothing here applies. Phase B1: the token sheet (spec §2) and the older --lx-* / --q-* names
   pointed at it, so the current components take the board's palette and type. No geometry changes here (B2 on).
   test/t_board.js counts the hard-coded colours in this file: that count may only go down. Colours belong in the
   token block below; components use the tokens. */

/* ---------- tokens (§2) ---------- */
[data-ui="board"]{
  /* Values sampled from the owner's board (board-master.jpg, owner ruling: the board is the exact visual standard;
     the spec's §2.1 value follows where the board differs, and t_board checks both). The board is a rendering:
     each value is the median (fills) or the brightest eighth (text) of a patch, within the image's JPEG noise. */
  /* §2.1 surfaces */
  --b-bg:#00050c;        /* spec #03070d; board ground beside the rail and under the dock */
  --b-surface:#0b1620;   /* spec #0a1420; board header card, ⋯ button */
  --b-surface-2:#111f2b; /* spec #101c2b; board Lobby pill */
  --b-hair:rgba(255,255,255,.08); --b-hair-gold:rgba(217,166,81,.30); /* spec rgba(212,178,108,.30): the board's gold, same alpha */
  --b-suit-red:#b51f29;  /* hearts and diamonds on the table: #d62a33 measured 2.93:1 where a large suit meets the card edge (Muse, Oct 25) */
  --b-felt:#074c2a;      /* spec #05472a; board felt centre */
  --b-felt-edge:#01180c; /* spec #01261a; board felt just inside the rail */
  --b-rail:#0d1214;      /* spec #07111a; board rail band (graphite) */
  --b-rail-hi:rgba(217,166,81,.18);
  /* §2.1 text and accents. --b-text is the board's neutral white (spec #f4f0e7, warmer); --b-text-3 is .48, not the
     spec's .42: .42 measures 3.8:1, under AA, and .48 is the nearest that passes (t_board) */
  --b-text:#f5f6f3; --b-text-2:rgba(245,246,243,.64); --b-text-3:rgba(245,246,243,.48);
  --b-gold:#d9a651;      /* spec #d4b26c; board Join Now / Send Connection Request / active segment */
  --b-gold-text:#ebe1b9; /* spec #f1d48c; board stacks (#e6dfbd) and prize line (#f0e9b6): pale champagne */
  --b-live:#e5484d; --b-online:#3fcf6e; --b-away:#8a93a3; --b-warn:#f0a24a; /* spec (the board's dots are too small to sample) */
  /* §2.1 action buttons, gradients top to bottom, and their labels (board: Fold #bc2c34 to #85131b, Call #206ab6 to
     #0b3063, Raise #ca9a4d to #855c2f; spec Raise #d8ad5f to #9c7238). The Raise label stays dark (#1a1206), as Muse
     ruled: the board draws it white, which fails AA on gold. */
  --b-fold-top:#bc2c34; --b-fold-bot:#85131b; --b-fold-label:#fff;
  --b-call-top:#206ab6; --b-call-bot:#0b3063; --b-call-label:#fff;
  --b-raise-top:#ca9a4d; --b-raise-bot:#855c2f; --b-raise-label:#1a1206;
  --b-fold:linear-gradient(180deg,var(--b-fold-top),var(--b-fold-bot));
  --b-call:linear-gradient(180deg,var(--b-call-top),var(--b-call-bot));
  /* (B8, measured contrast: the gold gradient ends a little lighter than the board's sampled #855c2f, so the dark label
     reads at 4.5:1 or more wherever it sits on every gold button, the second line ("2,600") included: --b-raise-foot is
     the board's bottom stop 30% of the way to its top, about the spec's #9c7238. --b-raise-bot itself, the logo's deep
     gold, is unchanged) */
  --b-raise-foot:color-mix(in oklab,var(--b-raise-bot),var(--b-raise-top) 30%);
  --b-raise:linear-gradient(180deg,var(--b-raise-top),var(--b-raise-foot));
  --b-more:var(--b-surface); --b-more-line:var(--b-hair); --b-more-icon:var(--b-text-2);
  --b-gold-fill:rgba(217,166,81,.14);
  --b-lb-silver:color-mix(in oklab,var(--b-text),var(--b-away) 35%); --b-lb-bronze:color-mix(in oklab,var(--b-gold),var(--b-fold-top) 24%); /* the leaderboard's 2nd and 3rd place discs */
  /* §2.2 type: the device's own face (San Francisco on Apple devices), no hosted font */
  --b-font:-apple-system,BlinkMacSystemFont,"SF Pro Text",Inter,"IBM Plex Sans",sans-serif;
  --b-t-11:11px; --b-t-13:13px; --b-t-14:14px; --b-t-15:15px; --b-t-17:17px; --b-t-20:20px; --b-t-22:22px; --b-t-28:28px;
  /* §2.3 shape */
  --b-r-chip:8px; --b-r-plate:12px; --b-r-btn:12px; --b-r-card:16px; --b-r-sheet:16px; --b-r-hero:24px; --b-r-pill:999px;
  /* §2.3 space and touch */
  --b-s1:4px; --b-s2:8px; --b-s3:12px; --b-s4:16px; --b-s5:20px; --b-s6:28px;
  --b-tap:44px; --b-act-h:60px;
  /* §2.3 motion */
  --b-press-scale:.97; --b-press-dur:120ms;
  --b-sheet-dur:340ms; --b-sheet-ease:cubic-bezier(.32,.72,0,1);
  --b-seat-dur:220ms; --b-glow-dur:400ms;
  --b-slide:1;

  /* B2, the table: tones mixed from the tokens above (no new colour: each is a token, a share of one, or two mixed) */
  --b-shadow:color-mix(in srgb,var(--b-bg) 60%,transparent);       /* drop shadows under the rail, plates, cards and buttons */
  --b-scrim:color-mix(in srgb,var(--b-bg) 55%,transparent);        /* behind the table menu */
  --b-ground-hi:color-mix(in oklab,var(--b-surface-2) 70%,var(--b-bg)); /* the navy lift at the top of the table screen */
  --b-rail-top:color-mix(in oklab,var(--b-rail),var(--b-text) 7%); --b-rail-foot:color-mix(in oklab,var(--b-rail),var(--b-bg) 40%);
  --b-felt-hi:color-mix(in oklab,var(--b-felt),var(--b-text) 9%);   /* the felt's lit middle (radial: lit middle, --b-felt, --b-felt-edge at the rail) */
  --b-watermark:color-mix(in srgb,var(--b-ring) 88%,transparent); /* the felt's name: the champagne gold of the rings, quieter (Issue #32 item 9) */
  --b-pill:color-mix(in srgb,var(--b-surface) 80%,transparent);     /* the pot and the chips: --b-surface at 80% (§3.4) */
  --b-slot:color-mix(in srgb,var(--b-bg) 25%,transparent);          /* an undealt board card (§3.4) */
  --b-plate:color-mix(in srgb,var(--b-bg) 86%,transparent);         /* a name plate (§3.3) */
  --b-av-hi:color-mix(in srgb,var(--b-text) 12%,transparent);       /* the initials disc's soft light */
  --b-gold-glow:color-mix(in srgb,var(--b-gold) 45%,transparent);   /* the glow round the player to act and the winner */
  /* B3: an avatar's ring at rest, the board's champagne gold (the board's resting rings sample a light champagne; --b-hair-gold at 30% read as no ring) */
  --b-ring:color-mix(in oklab,var(--b-gold),var(--b-text) 22%);   /* the initials disc's ring at rest: opaque champagne gold, at least 3:1 on the felt and the ground */
  --b-btn-hi:color-mix(in srgb,var(--b-text) 18%,transparent);      /* an action button's top edge */
  --b-act-call:color-mix(in oklab,var(--b-online),var(--b-text) 45%); /* "Call" / "Check" in a name line (spec #9fe3c2) */
  --b-good:var(--b-online); --b-bad:color-mix(in oklab,var(--b-live),var(--b-text) 22%); /* the helper's chance to win */
  --b-on-warn:var(--b-raise-label);                                 /* "Disconnected" on the warning orange */
  --b-dealer:var(--b-text); --b-on-dealer:var(--b-bg);              /* the dealer button */

  /* the luxury Home (Issue #32, the Oct 29 board): a serif display face for headings only (Cormorant Garamond, already in
     the page's own Google Fonts request, so nothing new is fetched; a system serif when fonts are blocked), and the
     dark and gold grounds of its cards, mixed from the tokens above (no new colour) */
  --b-serif:"Cormorant Garamond","Iowan Old Style","Palatino Linotype",Palatino,"Book Antiqua",Georgia,serif;
  --b-gold-line:color-mix(in srgb,var(--b-gold) 22%,transparent);   /* the inner hairline of a frame */
  --b-gold-glow-soft:color-mix(in srgb,var(--b-gold) 14%,transparent); /* the light in a panel's corner */
  --b-glass-hi:color-mix(in srgb,var(--b-text) 9%,transparent);     /* the glass's lit top edge */
  --b-lux-card:radial-gradient(90% 70% at 100% 0%,var(--b-gold-glow-soft),transparent 60%),linear-gradient(165deg,var(--b-surface-2) 0%,var(--b-surface) 55%,var(--b-ground-hi) 100%);
  --b-lux-depth:inset 0 1px 0 var(--b-glass-hi),0 18px 40px var(--b-shadow); /* glassy navy and gold cards, warm depth (owner's texture reference) */
  --b-lux-panel:radial-gradient(120% 90% at 85% 0%,var(--b-gold-glow-soft),transparent 62%),linear-gradient(160deg,var(--b-surface-2),var(--b-bg));
  --b-lux-row:linear-gradient(100deg,var(--b-surface-2) 0%,var(--b-surface) 70%);
  --b-veil:color-mix(in srgb,var(--b-bg) 55%,transparent);           /* under the play button */

  /* B2, the dock (§3.5): its padding, the info line's height, the gap, the action row (upright), the row sideways */
  --bd-pad:8px; --bd-band:48px; --bd-gap:8px; --bd-row:var(--b-act-h); --bd-land-row:48px;

  /* the older names, pointed at the board's (palette and type only: radii and spacing stay as they are until B2) */
  --display:var(--b-font); --body:var(--b-font); --cond:var(--b-font); --lx-serif:var(--b-font);
  --ink:var(--b-bg); --panel:var(--b-surface); --panel2:var(--b-surface-2); --text:var(--b-text); --muted:var(--b-text-2);
  --felt:var(--b-felt); --rail:var(--b-rail); --red:var(--b-live); --good:var(--b-online);
  --lx-ink:var(--b-bg); --lx-ink2:var(--b-bg); --lx-navy:var(--b-surface); --lx-navy2:var(--b-surface-2); --lx-navy3:var(--b-surface-2);
  --lx-gold:var(--b-gold); --lx-gold-hi:var(--b-gold-text); --lx-gold-deep:var(--b-raise-bot);
  --lx-ivory:var(--b-text); --lx-mute:var(--b-text-2); --lx-mute2:var(--b-text-3);
  --lx-hair:var(--b-hair); --lx-hair2:var(--b-hair-gold); --lx-emerald:var(--b-online); --lx-garnet:var(--b-fold-top);
  --lx-glass:linear-gradient(var(--b-surface),var(--b-surface));
  --lx-gold-grad:var(--b-raise);
  --lx-t-xs:var(--b-t-11); --lx-t-sm:var(--b-t-13); --lx-t-md:var(--b-t-15); --lx-t-lg:var(--b-t-17); --lx-t-xl:var(--b-t-22);
  --q-bg:var(--b-bg); --q-bg2:var(--b-bg); --q-surface:var(--b-surface); --q-surface2:var(--b-surface-2);
  --q-text:var(--b-text); --q-text2:var(--b-text-2); --q-text3:var(--b-text-3);
  --q-gold:var(--b-gold); --q-gold-hi:var(--b-gold-text); --q-gold-fill:var(--b-gold-fill);
  --q-hair:var(--b-hair); --q-hair-gold:var(--b-hair-gold); --q-good:var(--b-online); --q-alert:var(--b-live);
  --q-felt:var(--b-felt-edge); --q-felt-hi:var(--b-felt); --q-rail:var(--b-rail);
  --q-font:var(--b-font);
  --q-t-cap:var(--b-t-11); --q-t-foot:var(--b-t-13); --q-t-sub:var(--b-t-15); --q-t-body:var(--b-t-17); --q-t-title:var(--b-t-20); --q-t-large:var(--b-t-28);
  --q-ease:var(--b-sheet-ease); --q-fast:var(--b-press-dur); --q-slow:var(--b-sheet-dur);
}
/* the signed-in screens point the slate names at --lx-* on their own elements (style.css); the board's names win there too */
[data-ui="board"] :is(#lobby,#game,#modalRoot,.toast,.offline){--ink:var(--b-bg); --panel:var(--b-surface); --panel2:var(--b-surface-2); --line:var(--b-hair); --text:var(--b-text); --muted:var(--b-text-2)}

/* the welcome screen keeps its own short names (style.css, #auth.lux): the same mapping there */
[data-ui="board"] #auth.lux{--g:var(--b-gold); --g2:var(--b-gold-text); --gd:var(--b-raise-bot); --iv:var(--b-text); --mu:var(--b-text-2); --serif:var(--b-font)}

/* ---------- type (§2.2) ---------- */
[data-ui="board"] body{font-family:var(--b-font);background:var(--b-bg);color:var(--b-text);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
/* tabular numbers on every chip, stack, clock and count */
[data-ui="board"] :is(.num,.st,.pot,.bet,.chips,#cTime,#cBlinds,.stats b,.lvl b,.time b,.blinds b){font-variant-numeric:tabular-nums}
/* the scale as utility classes, for the B2+ components */
[data-ui="board"] .b-cap{font-size:var(--b-t-11);font-weight:500;line-height:1.3}
[data-ui="board"] .b-meta{font-size:var(--b-t-13);font-weight:600;line-height:1.3}
[data-ui="board"] .b-name{font-size:var(--b-t-14);font-weight:600;line-height:1.25}
[data-ui="board"] .b-body{font-size:var(--b-t-15);font-weight:400;line-height:1.4}
[data-ui="board"] .b-title{font-size:var(--b-t-17);font-weight:600;line-height:1.25}
[data-ui="board"] .b-head{font-size:var(--b-t-20);font-weight:600;line-height:1.2}
[data-ui="board"] .b-clock{font-size:var(--b-t-22);font-weight:600;line-height:1.1;font-variant-numeric:tabular-nums}
[data-ui="board"] .b-hero{font-size:var(--b-t-28);font-weight:700;line-height:1.1}
[data-ui="board"] .b-num{font-variant-numeric:tabular-nums}

/* ---------- motion (§2.3) ---------- */
[data-ui="board"] .b-press{transition:transform var(--b-press-dur) ease-out}
[data-ui="board"] .b-press:active{transform:scale(var(--b-press-scale))}
/* reduced motion: no scale, no slide, fades only */
@media (prefers-reduced-motion:reduce){
  [data-ui="board"]{--b-press-scale:1; --b-slide:0; --b-sheet-dur:0ms}
  [data-ui="board"] .b-press,[data-ui="board"] .b-press:active{transform:none;transition:none}
}

/* ======================================================================================================================
   B2: the table (spec §3). Upright and sideways, the table is laid out in public/app.js (boardGeo): the rail box per
   size class, the seats on the middle of the rail, the pot, the board and the chips. Here: how each piece looks.
   The size class is on the table area (data-bcls: P-L, P-M, P-S, L); the seat sizes come from it as custom properties
   (--av avatar, --pw/--ph name plate, --cwb card back, --hw your cards, --hph/--hpw your plate).
   ====================================================================================================================== */
[data-ui="board"] #game{background:radial-gradient(120% 70% at 50% 0%,var(--b-ground-hi) 0%,var(--b-bg) 62%);color:var(--b-text)}
[data-ui="board"] #game .table-area{margin:0 4px}

/* ---------- the rail and the felt (§3.1): a racetrack, the dark rail with its gold hairline, the felt lit in the middle ---------- */
[data-ui="board"] #game .felt{border-radius:999px;background:linear-gradient(180deg,var(--b-rail-top),var(--b-rail) 40%,var(--b-rail) 70%,var(--b-rail-foot));
  box-shadow:0 0 0 1px var(--b-hair-gold),0 18px 40px var(--b-shadow),0 4px 10px var(--b-shadow),inset 0 1px 0 var(--b-hair)}
[data-ui="board"] #game .felt::before{inset:var(--rw);border-radius:999px;background:radial-gradient(ellipse 72% 58% at 50% 42%,var(--b-felt-hi) 0%,var(--b-felt) 46%,var(--b-felt-edge) 100%);
  box-shadow:0 0 0 1px var(--b-rail-hi),inset 0 0 0 1px var(--b-rail-hi),inset 0 0 44px var(--b-shadow)}
/* the felt's name (Issue #32 item 9): an element placed by the layout (--wm-y, under the board and clear of the result
   line, the chips, the D and the plates), champagne gold and readable, smaller and quieter than any card, chip or plate.
   Where it has to take the result line's place it gives way while a result is written there */
[data-ui="board"] #game .felt::after{content:none}
[data-ui="board"] #game .felt .b-wm{position:absolute;left:var(--wm-x,50%);top:var(--wm-y,60%);transform:translate(-50%,-50%);z-index:0;pointer-events:none;font-style:normal;white-space:nowrap;
  font-family:var(--b-font);font-weight:700;font-size:11px;line-height:1;letter-spacing:.34em;margin-right:-.34em;color:var(--b-watermark);transition:opacity .25s}
[data-ui="board"] #game .felt .b-wm.big{font-size:15px;letter-spacing:.3em;margin-right:-.3em}
[data-ui="board"] #game .table-area.msg-on .felt .b-wm.on-msg{opacity:0}

/* ---------- the middle (§3.4): the pot pill with its chip, the board, the winner line ---------- */
[data-ui="board"] #game .pot{background:var(--b-pill);box-shadow:inset 0 0 0 1px var(--b-hair);color:var(--b-text);font-size:var(--b-t-14);font-weight:600;padding:3px 12px 3px 6px;min-height:26px;gap:6px}
[data-ui="board"] #game .board{gap:6px}
[data-ui="board"] #game .slot{border-radius:6px;border:1px solid var(--b-hair);background:var(--b-slot)}
[data-ui="board"] #game .card.board{border-radius:6px}
[data-ui="board"] #game .card.red{color:var(--b-suit-red)}
[data-ui="board"] #game .center .msg{color:var(--b-text);font-size:var(--b-t-13);font-weight:600;line-height:1.3;text-shadow:0 1px 2px var(--b-shadow)}

/* ---------- a seat (§3.3): drawn round its avatar's centre ---------- */
[data-ui="board"] #game #seats .seat.b-seat{width:0;height:0;display:block;transform:none;transition:opacity var(--b-seat-dur) ease}
[data-ui="board"] #game #seats .seat.b-seat:not(.hero) .av{position:absolute;left:calc(var(--av) / -2);top:calc(var(--av) / -2);width:var(--av);height:var(--av);z-index:3}
[data-ui="board"] #game #seats .seat .av.b-av{border:2px solid var(--b-ring);background:radial-gradient(circle at 34% 28%,var(--b-av-hi),transparent 60%),var(--b-surface-2);color:var(--b-text);
  font-weight:600;font-size:calc(var(--av) * .34);letter-spacing:.02em;box-shadow:0 4px 10px var(--b-shadow);box-sizing:border-box}
[data-ui="board"] #game #seats .seat .av.b-av .emo{font-size:calc(var(--av) * .5)}
[data-ui="board"] #game #seats .seat .av.b-av.photo{overflow:hidden;padding:0}
[data-ui="board"] #game #seats .seat .av.b-av.photo img{width:100%;height:100%;border-radius:50%;object-fit:cover;display:block}
/* the player to act: a bright gold ring with a glow; the ring's sweep is their time running out (--f, app.js tickClock) */
[data-ui="board"] #game #seats .seat.acting .av.b-av{border:3px solid var(--b-gold);box-shadow:0 0 0 2px var(--b-gold-glow),0 0 18px var(--b-gold-glow)}
[data-ui="board"] #game #seats .seat.b-seat:not(.hero) .shot{position:absolute;left:calc(var(--av) / -2 - 4px);top:calc(var(--av) / -2 - 4px);right:auto;bottom:auto;width:calc(var(--av) + 8px);height:calc(var(--av) + 8px);
  border-radius:50%;background:conic-gradient(var(--b-gold) calc(var(--f,1) * 360deg),transparent 0);-webkit-mask:radial-gradient(closest-side,transparent calc(100% - 3px),var(--b-bg) calc(100% - 3px));mask:radial-gradient(closest-side,transparent calc(100% - 3px),var(--b-bg) calc(100% - 3px));z-index:4;overflow:visible}
[data-ui="board"] #game #seats .seat.b-seat:not(.hero) .shot i{display:none}
[data-ui="board"] #game #seats .seat.b-seat:not(.hero) .shot:has(.dc){background:conic-gradient(var(--b-warn) calc(var(--f,1) * 360deg),transparent 0)}
/* the presence dot, at about seven o'clock: online, away, disconnected (the word is under the plate too) */
[data-ui="board"] #game #seats .b-dot{position:absolute;left:calc(var(--av) * -.42);top:calc(var(--av) * .22);width:8px;height:8px;border-radius:50%;background:var(--b-online);box-shadow:0 0 0 2px var(--b-bg);z-index:5}
[data-ui="board"] #game #seats .b-dot.away{background:var(--b-away)}
[data-ui="board"] #game #seats .b-dot.dc{background:var(--b-warn)}
/* the name plate under the avatar: the name, the stack in gold; moved in from the screen's edge by --sx */
[data-ui="board"] #game #seats .seat.b-seat:not(.hero) .plate{position:absolute;left:0;top:calc(var(--av) / 2 - 6px);margin:0;transform:translateX(calc(-50% + var(--sx,0px)));
  min-width:64px;max-width:var(--pw);height:var(--ph);box-sizing:border-box;padding:6px 7px 1px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0;z-index:2;
  background:var(--b-plate);border:1px solid var(--b-hair);border-radius:var(--b-r-plate);box-shadow:0 4px 10px var(--b-shadow);text-align:center}
[data-ui="board"] #game #seats .seat.b-seat.pl-l:not(.hero) .plate{top:calc(var(--ph) / -2);padding:3px 7px;transform:translateX(calc(-100% - var(--av) / 2 - 4px))}
[data-ui="board"] #game #seats .seat.b-seat.pl-r:not(.hero) .plate{top:calc(var(--ph) / -2);padding:3px 7px;transform:translateX(calc(var(--av) / 2 + 4px))}
[data-ui="board"] #game #seats .seat.b-seat .nm{font-size:var(--b-t-14);font-weight:600;line-height:1.12;color:var(--b-text);max-width:calc(var(--pw) - 14px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;letter-spacing:0}
[data-ui="board"] #game #seats .seat.b-seat .st{font-size:var(--b-t-13);font-weight:600;line-height:1.12;color:var(--b-gold-text);font-variant-numeric:tabular-nums}
[data-ui="board"] #game .table-area[data-bcls="P-S"] #seats .seat.b-seat .nm{font-size:var(--b-t-13)}
[data-ui="board"] #game .table-area[data-bcls="P-S"] #seats .seat.b-seat .st,[data-ui="board"] #game .table-area[data-bcls="L"] #seats .seat.b-seat .st{font-size:12px}
[data-ui="board"] #game .table-area[data-bcls="L"] #seats .seat.b-seat .nm{font-size:var(--b-t-13)}
[data-ui="board"] #game #seats .seat.b-seat .st.allin{color:var(--b-gold-text)}
/* a folded seat: its avatar, dot and cards at half; its plate stays readable, the name and stack in --b-text-2 */
[data-ui="board"] #game #seats .seat.b-seat.folded:not(.hero){opacity:1}
[data-ui="board"] #game #seats .seat.b-seat.folded:not(.hero) :is(.av,.b-dot,.hole){opacity:.5;filter:none}
[data-ui="board"] #game #seats .seat.b-seat.folded:not(.hero) .plate{opacity:1;filter:none}
[data-ui="board"] #game #seats .seat.b-seat.folded:not(.hero) .plate :is(.nm,.nm.nm-act.act-fold,.st){color:var(--b-text-2)}
[data-ui="board"] #game #seats .seat.b-seat.win .plate{border-color:var(--b-gold);box-shadow:0 0 0 1px var(--b-gold),0 0 18px var(--b-gold-glow)}
/* the status in words under the plate (Muse's amendment 1): Away, Disconnected */
[data-ui="board"] #game #seats .seat.b-seat .badge.b-st{position:absolute;left:0;bottom:auto;top:calc(var(--av) / 2 - 6px + var(--ph) + 2px);transform:translateX(calc(-50% + var(--sx,0px) + var(--stx,0px)));
  font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;line-height:14px;padding:1px 6px;border-radius:var(--b-r-chip);white-space:nowrap;z-index:2;
  background:var(--b-surface-2);color:var(--b-text);box-shadow:inset 0 0 0 1px var(--b-hair)}
[data-ui="board"] #game #seats .seat.b-seat .badge.b-st.dc{background:var(--b-warn);color:var(--b-on-warn);box-shadow:none}
/* the last action, "Winner" or a showdown hand: in the status line in its colour, the name line keeps the name (owner,
   Issue #32 item 7). A plate's width at most; a showdown hand in words as written, not in capitals */
[data-ui="board"] #game #seats .seat.b-seat .badge.b-st.b-act{max-width:var(--pw);overflow:hidden;text-overflow:ellipsis;box-sizing:border-box}
[data-ui="board"] #game #seats .seat.b-seat .badge.b-st.b-act.hand{max-width:calc(var(--pw) + 20px)}
[data-ui="board"] #game #seats .seat.b-seat .badge.b-st.b-act:is(.act-raise,.act-bet,.act-all-in,.hand){color:var(--b-gold-text)}
[data-ui="board"] #game #seats .seat.b-seat .badge.b-st.b-act:is(.act-call,.act-check){color:var(--b-act-call)}
[data-ui="board"] #game #seats .seat.b-seat .badge.b-st.b-act.act-fold{color:var(--b-text-2)}
[data-ui="board"] #game #seats .seat.b-seat .badge.b-st.b-act.hand{text-transform:none;letter-spacing:0;font-size:11px}
[data-ui="board"] #game #seats .seat.b-seat .badge.b-st.b-act.won{background:var(--b-gold);color:var(--b-raise-label);box-shadow:none}
[data-ui="board"] #game #seats .seat.b-seat.pl-l .badge.b-st{top:calc(var(--ph) / 2 + 2px);transform:translateX(calc(-50% - var(--av) / 2 - 4px - var(--pw) / 2))}
[data-ui="board"] #game #seats .seat.b-seat.pl-r .badge.b-st{top:calc(var(--ph) / 2 + 2px);transform:translateX(calc(-50% + var(--av) / 2 + 4px + var(--pw) / 2))}
/* a plate beside its avatar low on the table: its status line over the plate, inside the area (Issue #32 item 12) */
[data-ui="board"] #game #seats .seat.b-seat.st-up .badge.b-st{top:calc(var(--ph) / -2 - 18px)}
/* the two cards, tucked behind the avatar at its top, on the outer side (--hx); face up at a showdown */
[data-ui="board"] #game #seats .seat.b-seat:not(.hero)>.hole{position:absolute;left:calc(var(--hx,0px) - var(--cwb) * 1.15);top:calc(var(--av) / -2 + 8px - var(--cwb) * 1.4 + var(--hy,0px));bottom:auto;right:auto;
  transform:none;margin:0;width:auto;min-height:0;display:flex;z-index:1}
[data-ui="board"] #game #seats .seat.b-seat:not(.hero)>.hole .card.mini{--w:var(--cwb);border-width:1.5px;box-shadow:0 2px 4px var(--b-shadow)}
[data-ui="board"] #game #seats .seat.b-seat:not(.hero)>.hole .card.mini:first-child{transform:rotate(-8deg)}
[data-ui="board"] #game #seats .seat.b-seat:not(.hero)>.hole .card.mini+.card.mini{margin-left:calc(var(--cwb) * -.45);transform:rotate(8deg)}
[data-ui="board"] #game #seats .seat.b-seat:not(.hero)>.hole.shown{left:calc(var(--cwb) * -1.45);top:calc(var(--av) / -2 - var(--cwb) * 1.75 + var(--hys,var(--hy,0px)));z-index:4}
[data-ui="board"] #game #seats .seat.b-seat:not(.hero)>.hole.shown .card.show{--w:calc(var(--cwb) * 1.45)}
[data-ui="board"] #game #seats .seat.b-seat:not(.hero)>.hole.shown .card.show:first-child{transform:rotate(-5deg)}
[data-ui="board"] #game #seats .seat.b-seat:not(.hero)>.hole.shown .card.show+.card.show{margin-left:-4px;transform:rotate(5deg)}

/* ---------- your seat (§3.4): your cards over the bottom rail, "You" and your stack on the plate under it ---------- */
[data-ui="board"] #game #seats .seat.b-seat.hero{z-index:6}
[data-ui="board"] #game #seats .seat.b-seat.hero .plate{position:absolute;left:0;top:calc(var(--hph) / -2);margin:0;transform:translateX(-50%);width:var(--hpw);min-width:0;height:var(--hph);box-sizing:border-box;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0;padding:2px 10px;background:var(--b-plate);border:1px solid var(--b-hair-gold);border-radius:var(--b-r-plate);box-shadow:0 6px 16px var(--b-shadow);overflow:hidden}
[data-ui="board"] #game #seats .seat.b-seat.hero .plate .av{display:none}
[data-ui="board"] #game #seats .seat.b-seat.hero .pl-txt{text-align:center;min-width:0;max-width:100%}
[data-ui="board"] #game #seats .seat.b-seat.hero.acting .plate{border-color:var(--b-gold);box-shadow:0 0 0 1px var(--b-gold),0 0 18px var(--b-gold-glow)}
/* your turn: the gold glow round your plate breathes, so a glance at the phone shows it is you (owner, game night) */
[data-ui="board"] #game #seats .seat.b-seat.hero.acting .plate{animation:b-myturn 1.4s ease-in-out 3}
@keyframes b-myturn{50%{box-shadow:0 0 0 2px var(--b-gold),0 0 28px var(--b-gold-glow)}}
[data-ui="board"] #game #seats .seat.b-seat.hero .shot{left:8px;right:8px;bottom:2px;height:2px;background:var(--b-hair)}
[data-ui="board"] #game #seats .seat.b-seat.hero .shot i{background:var(--b-gold)}
[data-ui="board"] #game #seats .seat.b-seat.hero>.hole{position:absolute;left:0;bottom:calc(var(--hph) / 2 + 1px);top:auto;transform:translateX(-50%);margin:0;display:flex;gap:0;width:max-content;min-height:0}
[data-ui="board"] #game #seats .seat.b-seat.hero.hside>.hole{left:calc(var(--hpw) / 2 + var(--hw) * .16 + 4px);transform:none;bottom:calc(var(--hph) / -2 + 14px)}
[data-ui="board"] #game #seats .seat.b-seat.hero .card.hero{--w:var(--hw);box-shadow:0 6px 14px var(--b-shadow)}
/* (fanned on their outer bottom corners, so no corner dips onto your plate) */
[data-ui="board"] #game #seats .seat.b-seat.hero .card.hero:first-child{transform:rotate(-6deg);transform-origin:0 100%;margin-right:-4px}
[data-ui="board"] #game #seats .seat.b-seat.hero .card.hero+.card.hero{transform:rotate(6deg);transform-origin:100% 100%}
[data-ui="board"] #game #seats .seat.b-seat.hero .badge.b-st{position:absolute;left:calc(var(--hpw) / 2 + 6px);top:-9px;bottom:auto;transform:none}

/* ---------- an empty seat: "+" (not tappable, hidden from screen readers: tournament seats are assigned, §9.4) ---------- */
[data-ui="board"] #game .empty-seat.b-plus{width:var(--av);height:var(--av);border:1px solid var(--b-hair);border-style:solid;background:var(--b-surface);color:var(--b-text-3);font-size:20px;font-weight:300;letter-spacing:0;pointer-events:none;box-sizing:border-box}

/* ---------- chips and the dealer button ---------- */
[data-ui="board"] #game .bet{background:var(--b-pill);box-shadow:inset 0 0 0 1px var(--b-hair);color:var(--b-text);font-size:var(--b-t-13);font-weight:600;padding:2px 8px 2px 3px;gap:5px}
[data-ui="board"] #game .dealer{width:22px;height:22px;background:var(--b-dealer);color:var(--b-on-dealer);font-size:11px;font-weight:800;box-shadow:0 2px 5px var(--b-shadow)}

/* ---------- the dock (§3.5): the info line, then the action row; one height in every state ---------- */
[data-ui="board"] #game .dock{position:relative;flex:none;display:block;margin:0;padding:0 12px;min-height:0;z-index:25;background:none;
  height:calc(var(--bd-pad) * 2 + var(--bd-band) + var(--bd-gap) + var(--bd-row) + var(--sa-b))}
[data-ui="board"] #game .dock .controls{position:static;display:block;min-height:0;height:auto;padding:0;margin:calc(var(--bd-pad) + var(--bd-band) + var(--bd-gap)) 0 0;background:none}
/* the smallest phones (P-S): a tighter dock, so the table keeps 0.90 of the width at h/w 1.25 or more */
[data-ui="board"] #game[data-bcls="P-S"]{--bd-pad:6px; --bd-band:44px; --bd-gap:6px; --bd-row:52px}
[data-ui="board"] #game[data-bcls="P-S"] .dock #helper.b-info{font-size:12px;line-height:14px}
/* the info line's place: the hand helper; else the table's news (whose turn, the result) over the free-play line */
[data-ui="board"] #game .dock :is(#helper,.info-line,#playLine,#playNote,#coachTip){position:absolute;left:12px;right:12px;top:var(--bd-pad);margin:0;box-sizing:border-box;text-align:center;background:none;border:0;border-radius:0;box-shadow:none}
[data-ui="board"] #game .dock #helper.b-info{height:var(--bd-band);display:flex;align-items:center;justify-content:center;flex-wrap:wrap;align-content:center;column-gap:5px;padding:0 4px;
  font-size:var(--b-t-13);font-weight:500;line-height:15px;color:var(--b-text-2);cursor:default;overflow:hidden}
[data-ui="board"] #game .dock #helper.b-info[hidden]{display:none}
[data-ui="board"] #game .dock #helper.b-info .h-top{display:inline;height:auto}
/* (the chance to win a little larger, on the line's own height: three lines fit the band) */
[data-ui="board"] #game .dock #helper.b-info :is(.h-top,.h-top *){line-height:inherit}
[data-ui="board"] #game .dock #helper.b-info .h-eq{font-size:1.15em;line-height:0}
[data-ui="board"] #game .dock #helper.b-info .h-eq *{line-height:0}
[data-ui="board"] #game .dock #helper.b-info .h-name{display:inline;font-size:inherit;color:var(--b-text);font-weight:600;white-space:normal;overflow:visible}
[data-ui="board"] #game .dock #helper.b-info .h-eq{font-weight:600;color:var(--b-text)}
[data-ui="board"] #game .dock #helper.b-info .h-eq small{display:inline;font-size:inherit;font-weight:500;color:var(--b-text-2)}
[data-ui="board"] #game .dock #helper.b-info .h-eq.good{color:var(--b-good)}
[data-ui="board"] #game .dock #helper.b-info .h-eq.mid{color:var(--b-gold-text)}
[data-ui="board"] #game .dock #helper.b-info .h-eq.bad{color:var(--b-bad)}
[data-ui="board"] #game .dock #helper.b-info .h-line{display:inline;white-space:normal;line-height:inherit;color:var(--b-text-2);-webkit-line-clamp:unset;overflow:visible}
[data-ui="board"] #game .dock #helper.b-info .h-line::before{content:'· '}
[data-ui="board"] #game .dock #helper.b-info :is(.h-have,.h-odds,.h-w,.h-bar,.h-more){display:none}
[data-ui="board"] #game .dock #helper.b-info .h-odds-s{display:inline}
/* (a block, centred by align-content, not a flex box: a flex box would split "Winning hand: <b>…</b>" into items and drop the space) */
[data-ui="board"] #game .dock .info-line{height:calc(var(--bd-band) - 15px);display:block;align-content:center;padding:0 4px;font-size:var(--b-t-13);font-weight:500;line-height:1.3;color:var(--b-text-2);overflow:hidden}
[data-ui="board"] #game .dock .info-line b{color:var(--b-text);font-weight:600}
[data-ui="board"] #game .dock .info-line .btn{min-height:40px}
[data-ui="board"] #game .dock #playLine{top:calc(var(--bd-pad) + var(--bd-band) - 15px);height:15px;padding:0;font-size:11px;line-height:15px;color:var(--b-text-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;z-index:1}
[data-ui="board"] #game .dock:has(#helper:not([hidden])) :is(.info-line:not(#controls>:only-child),#playLine),[data-ui="board"] #game .dock:has(.sizing) :is(#helper,.info-line,#playLine,#playNote,#coachTip){display:none}
/* the free-play notice at the start of a game (§3.4): on the info line, one line (two at most), over the helper for its
   four seconds or until your first action (app.js placePlayNote); no box, no × */
[data-ui="board"] #game .dock #playNote{z-index:3;height:var(--bd-band);flex-direction:row;flex-wrap:wrap;align-content:center;column-gap:.4em;padding:0 4px;background:var(--b-bg);font-size:var(--b-t-13);font-weight:500;line-height:1.3}
[data-ui="board"] #game .dock #playNote b{color:var(--b-gold-text);letter-spacing:0;font-weight:600}
[data-ui="board"] #game .dock #playNote span{color:var(--b-text-2);white-space:normal}
[data-ui="board"] #game .dock #playNote i{display:none}
/* (an action on its way: "Call · sending…" stands in the action row, in place of the buttons, the info line kept above it) */
[data-ui="board"] #game .dock #controls>.info-line:only-child{position:static;width:auto;height:var(--bd-row);color:var(--b-text-2)}
/* your turn: "+30s" at the right of the info line (44 px tall), the time bar over the action row for the last 10 s */
[data-ui="board"] #game .dock .turnrow{position:absolute;left:12px;right:12px;top:var(--bd-pad);height:var(--bd-band);margin:0;display:block;pointer-events:none;z-index:2}
[data-ui="board"] #game .dock .turnrow .xtime{position:absolute;right:0;top:calc((var(--bd-band) - 44px) / 2);height:44px;min-height:44px;min-width:60px;padding:0 10px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0;
  pointer-events:auto;border-radius:var(--b-r-btn);background:var(--b-surface);border:1px solid var(--b-hair-gold);color:var(--b-gold-text);font-size:var(--b-t-13);font-weight:600;line-height:1.1}
[data-ui="board"] #game .dock .turnrow .xtime small{font-size:10px;font-weight:500;color:var(--b-text-2)}
[data-ui="board"] #game .dock .turnrow .xtime:disabled{display:none}
[data-ui="board"] #game .dock .turnrow .xtime::after{display:none}
[data-ui="board"] #game .dock:has(.xtime:not(:disabled)) :is(#helper.b-info,#playNote,#coachTip){right:80px}
[data-ui="board"] #game .dock .turnrow .turnbar{position:absolute;left:0;right:0;top:calc(var(--bd-band) + var(--bd-gap) / 2 - 1px);height:2px;margin:0;border-radius:1px;background:none;opacity:0;transition:opacity .2s}
[data-ui="board"] #game .dock .turnrow .turnbar.late{opacity:1}
[data-ui="board"] #game .dock .turnrow .turnbar i,[data-ui="board"] #game .dock .turnrow .turnbar i.low,[data-ui="board"] #game .dock .turnrow .turnbar i.bank{background:var(--b-gold);border-radius:1px}
[data-ui="board"] #game .dock .turnrow .turnbar span{display:none}
[data-ui="board"] #game .dock:has(.sizing) .turnrow .xtime{display:none}
/* the action row: Fold, Call and Raise a third each, "⋯" 44 wide; 60 tall */
[data-ui="board"] #game .dock .b-acts{display:grid;grid-template-columns:repeat(var(--n,3),minmax(0,1fr)) 44px;gap:8px;height:var(--bd-row);align-items:stretch}
[data-ui="board"] #game .dock .b-acts.b-idle{grid-template-columns:minmax(0,1fr) 44px}
[data-ui="board"] #game .dock .b-acts.b-idle::before{content:''}
[data-ui="board"] #game .dock .act-btn{min-height:0;height:100%;border-radius:var(--b-r-btn);border:0;gap:1px;padding:0 4px;box-shadow:inset 0 1px 0 var(--b-btn-hi),0 6px 14px var(--b-shadow);transition:transform var(--b-press-dur) ease-out}
[data-ui="board"] #game .dock .act-btn:active{transform:scale(var(--b-press-scale));filter:none}
[data-ui="board"] #game .dock .act-btn b{font-family:var(--b-font);font-size:var(--b-t-15);font-weight:600;letter-spacing:0;text-transform:none;line-height:1.15}
[data-ui="board"] #game .dock .act-btn span{font-size:var(--b-t-17);font-weight:600;opacity:1;line-height:1.15}
[data-ui="board"] #game .dock .act-btn.fold{background:var(--b-fold);color:var(--b-fold-label);border:0}
[data-ui="board"] #game .dock .act-btn.fold b{font-size:var(--b-t-17)}
[data-ui="board"] #game .dock .act-btn.call{background:var(--b-call);color:var(--b-call-label)}
[data-ui="board"] #game .dock .act-btn.raise,[data-ui="board"] #game .dock .act-btn.raise.allin{background:var(--b-raise);color:var(--b-raise-label);box-shadow:inset 0 1px 0 var(--b-btn-hi),0 6px 14px var(--b-shadow)}
[data-ui="board"] #game .dock .act-btn.raise span,[data-ui="board"] #game .dock .act-btn.raise.allin span{color:var(--b-raise-label)}
[data-ui="board"] #game .dock .act-btn.back{background:var(--b-surface);border:1px solid var(--b-hair);color:var(--b-text);box-shadow:none}
[data-ui="board"] #game .dock .act-btn.back b{font-size:24px;font-weight:400}
[data-ui="board"] #game .dock .b-more{position:relative;height:100%;min-height:44px;border-radius:var(--b-r-btn);background:var(--b-more);border:1px solid var(--b-more-line);color:var(--b-more-icon);font-size:20px;font-weight:600;line-height:1;padding:0}
[data-ui="board"] #game .dock .b-more .b-unread{position:absolute;top:8px;right:8px;width:8px;height:8px;border-radius:50%;background:var(--b-live);display:none}
[data-ui="board"] #game .dock .b-more.unread .b-unread{display:block}
/* not your turn: the quick actions in the same row, neutral (§3.5) */
[data-ui="board"] #game .dock .preacts.b-acts{grid-template-columns:repeat(var(--n,3),minmax(0,1fr)) 44px;gap:8px}
[data-ui="board"] #game .dock .preacts.b-acts button:not(.b-more){min-height:0;height:100%;border-radius:var(--b-r-btn);background:var(--b-surface);border:1px solid var(--b-hair);color:var(--b-text);font-size:var(--b-t-13);font-weight:600;padding:0 4px;gap:6px;line-height:1.2;text-align:center}
[data-ui="board"] #game .dock .preacts.b-acts button[aria-pressed=true]{background:var(--b-gold-fill);border-color:var(--b-gold);color:var(--b-text)}
[data-ui="board"] #game .dock .preacts.b-acts button i{border-color:var(--b-text-3)}
[data-ui="board"] #game .dock .preacts.b-acts button[aria-pressed=true] i{background:var(--b-gold);border-color:var(--b-gold)}
/* the sizing: the presets in the info line's place, the slider in the action row, the gold button confirms */
[data-ui="board"] #game .dock .sizing.b-sizing{position:absolute;left:12px;right:12px;top:var(--bd-pad);height:var(--bd-band);margin:0;padding:0;display:block;background:none;border:0;box-shadow:none;z-index:3}
[data-ui="board"] #game .dock .sizing.b-sizing .amt{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
[data-ui="board"] #game .dock .sizing.b-sizing .sz-presets{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);grid-template-columns:none;gap:6px;height:100%}
[data-ui="board"] #game .dock .sizing.b-sizing .sz-presets button{min-height:44px;height:100%;padding:0 2px;border-radius:var(--b-r-btn);background:var(--b-surface);border:1px solid var(--b-hair);color:var(--b-text);font-size:var(--b-t-13);font-weight:600;letter-spacing:0;white-space:nowrap}
[data-ui="board"] #game .dock .sizing.b-sizing .sz-presets button[aria-pressed=true]{background:var(--b-gold-fill);border-color:var(--b-gold);color:var(--b-gold-text)}
[data-ui="board"] #game .dock .sizing.b-sizing .sz-presets button::after{display:none}
[data-ui="board"] #game .dock .b-acts.b-sz{grid-template-columns:44px minmax(0,1fr) minmax(96px,.9fr)}
[data-ui="board"] #game .dock .b-sz .sz-slider{display:flex;align-items:center;gap:4px;min-width:0}
[data-ui="board"] #game .dock .b-sz .sz-slider .step{width:44px;height:44px;flex:none;border-radius:50%;background:var(--b-surface);border:1px solid var(--b-hair);color:var(--b-text);font-size:20px}
[data-ui="board"] #game .dock .b-sz .sz-slider .step::after{display:none}
[data-ui="board"] #game .dock .b-sz .sz-slider input{flex:1;min-width:0;width:100%;height:44px;background:linear-gradient(90deg,var(--b-gold),var(--b-gold-text)) center/100% 8px no-repeat;border-radius:4px;accent-color:var(--b-gold);font-size:16px;margin:0}
/* no double-tap zoom at the table (the owner's iPhone, 2026-10-22: quick taps on − / + and the presets zoomed iPhone
   Safari in to about 1.6x, the action row off the screen): taps are taps, pinch zoom and scrolling stay */
[data-ui="board"] #game,[data-ui="board"] #game :is(.dock,#controls,.sizing,.sz-presets,.sz-slider,.b-acts,.b-sheet,.b-sheet-in,button,input,a,[role=button]){touch-action:manipulation}

/* ---------- "⋯": the table menu, a sheet from the bottom ---------- */
[data-ui="board"] #game .b-sheet{position:absolute;inset:0;z-index:60;display:flex;align-items:flex-end;background:var(--b-scrim)}
[data-ui="board"] #game .b-sheet[hidden]{display:none}
[data-ui="board"] #game .b-sheet-in{width:100%;box-sizing:border-box;padding:10px 12px calc(12px + var(--sa-b));background:var(--b-surface);border-top:1px solid var(--b-hair-gold);border-radius:var(--b-r-sheet) var(--b-r-sheet) 0 0;display:grid;gap:6px;max-height:100%;overflow-y:auto;overscroll-behavior:contain;
  animation:b-up var(--b-sheet-dur) var(--b-sheet-ease) both}
/* a sideways phone (owner, Oct 31 game night: the menu stretched across the whole screen and hid the table): the menu
   is a compact panel at the right, its rows two by two, the table still in view beside it, the whole menu on the screen
   down to 320 tall. Sound takes a full row (its "On · music on breaks"); the two rows that only explain themselves
   (Hand history, Leave table) drop their second line here */
@media (orientation:landscape) and (max-height:600px){
  [data-ui="board"] #game .b-sheet:not(.b-hsheet){align-items:center;justify-content:flex-end;padding:8px max(12px,env(safe-area-inset-right,0px)) 8px 8px;box-sizing:border-box}
  [data-ui="board"] #game .b-sheet:not(.b-hsheet) .b-sheet-in{width:min(440px,60vw);max-height:100%;padding:8px 10px 10px;grid-template-columns:1fr 1fr;grid-auto-flow:row dense;gap:6px;
    border:1px solid var(--b-hair-gold);border-radius:var(--b-r-sheet);animation-name:b-in-r}
  [data-ui="board"] #game .b-sheet:not(.b-hsheet) .b-sheet-t,[data-ui="board"] #game .b-sheet:not(.b-hsheet) .b-row.b-close,[data-ui="board"] #game .b-sheet:not(.b-hsheet) .b-row[data-bm="sound"]{grid-column:1 / -1}
  [data-ui="board"] #game .b-sheet:not(.b-hsheet) .b-row{min-height:44px;padding:0 10px;gap:8px;font-size:var(--b-t-15);min-width:0}
  [data-ui="board"] #game .b-sheet:not(.b-hsheet) .b-row>span{white-space:nowrap}
  [data-ui="board"] #game .b-sheet:not(.b-hsheet) .b-row[data-bm="hands"] small,[data-ui="board"] #game .b-sheet:not(.b-hsheet) .b-row[data-bm="leave"] small{display:none}
}
@media (orientation:landscape) and (max-height:600px) and (max-width:620px){   /* a small phone sideways (568 wide): "Add 30 seconds · 3 left" in its half */
  [data-ui="board"] #game .b-sheet:not(.b-hsheet) .b-sheet-in{width:min(440px,66vw)}
  [data-ui="board"] #game .b-sheet:not(.b-hsheet) .b-row{padding:0 8px;font-size:var(--b-t-14)}
}
@keyframes b-in-r{from{transform:translateX(calc(24px * var(--b-slide)));opacity:0}}
[data-ui="board"] #game .b-sheet-t{font-size:var(--b-t-13);font-weight:600;color:var(--b-text-2);padding:2px 4px 4px;letter-spacing:.02em}
[data-ui="board"] #game .b-row{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:48px;padding:0 14px;border-radius:var(--b-r-btn);background:var(--b-surface-2);border:1px solid var(--b-hair);color:var(--b-text);font-size:var(--b-t-15);font-weight:600;text-align:left}
[data-ui="board"] #game .b-row small{font-size:var(--b-t-13);font-weight:500;color:var(--b-text-2)}
[data-ui="board"] #game .b-row[data-unread] small{color:var(--b-gold-text)}
[data-ui="board"] #game .b-row:disabled{opacity:.5}
[data-ui="board"] #game .b-row.b-close{justify-content:center;background:none}
@keyframes b-up{from{transform:translateY(calc(100% * var(--b-slide)))}}

/* ---------- the coach's tip floats just over the dock ---------- */
/* the coach's tip (Issue #32 item 14): a slim one-line banner in the dock's band, over the helper's line and the play
   line as the "Free social play" notice is, never over the table or the action buttons; a tap opens the whole tip */
[data-ui="board"] #game .dock>#coachTip.b-tip{bottom:auto;z-index:4;height:var(--bd-band);display:flex;align-items:center;justify-content:center;gap:6px;padding:0 4px;
  background:var(--b-bg);font-size:var(--b-t-13);line-height:1.3;color:var(--b-text-2);cursor:pointer;overflow:hidden}
[data-ui="board"] #game .dock>#coachTip.b-tip[hidden]{display:none}
[data-ui="board"] #game .dock>#coachTip.b-tip .ct-ic{font-size:13px;line-height:1;flex:none}
[data-ui="board"] #game .dock>#coachTip.b-tip .ct-tx{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:left}
[data-ui="board"] #game .dock>#coachTip.b-tip b{font-size:inherit;font-weight:600;color:var(--b-gold-text)}
[data-ui="board"] #game .dock>#coachTip.b-tip.mistake b{color:var(--b-text)}
[data-ui="board"] #game .dock>#coachTip.b-tip.open .ct-tx{white-space:normal;font-size:12px;line-height:15px;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;max-height:45px}
[data-ui="board"] #game.land .dock>#coachTip.b-tip{height:var(--bd-land-row)}
[data-ui="board"] #game.land.b-col .dock>#coachTip.b-tip{height:var(--bd-band)}

/* ---------- sideways (§3.1 L, §9.10): the table in the middle, the action row under it, the info line beside the buttons ---------- */
[data-ui="board"] #game.land{display:flex;flex-direction:column;padding:0 var(--sa-r) var(--sa-b) var(--sa-l)}
[data-ui="board"] #game.land .table-area{flex:1;min-height:0}
[data-ui="board"] #game.land .dock{height:calc(6px * 2 + var(--bd-land-row));padding:0 12px;align-self:stretch}
[data-ui="board"] #game.land .dock .controls{margin:6px 0 0 auto;width:min(520px,58%)}
[data-ui="board"] #game.land .dock .b-acts{height:var(--bd-land-row)}
[data-ui="board"] #game.land .dock :is(#helper,.info-line,#playLine,#playNote,#coachTip){top:6px;right:auto;width:calc(42% - 24px);left:12px}
[data-ui="board"] #game.land .dock #helper.b-info{height:var(--bd-land-row);justify-content:center;text-align:center;font-size:12px;line-height:14px}
[data-ui="board"] #game.land .dock .info-line{height:calc(var(--bd-land-row) - 15px);justify-content:center;text-align:center;font-size:12px}
[data-ui="board"] #game.land .dock #playLine{top:calc(6px + var(--bd-land-row) - 15px);text-align:center}
[data-ui="board"] #game.land .dock #playNote{height:var(--bd-land-row);justify-content:center;text-align:center;font-size:12px;line-height:14px}
[data-ui="board"] #game.land .dock .act-btn{flex-direction:row;gap:5px}
[data-ui="board"] #game.land .dock .act-btn b,[data-ui="board"] #game.land .dock .act-btn span{font-size:var(--b-t-15)}
/* (sideways the time row is the dock's own: "+30s" left of the buttons, the time bar over them; the buttons are
   min(520px, 58%) of the dock's inside, which is the dock less its 12 px sides) */
[data-ui="board"] #game.land .dock .turnrow{display:contents}
[data-ui="board"] #game.land .dock .turnrow .xtime{top:6px;right:calc(12px + min(520px,(100% - 24px) * .58) + 8px);width:64px;min-width:0;height:var(--bd-land-row)}
[data-ui="board"] #game.land .dock .turnrow .turnbar{left:auto;right:12px;width:min(520px,(100% - 24px) * .58);top:3px}
[data-ui="board"] #game.land .dock:has(.xtime:not(:disabled)) :is(#helper.b-info,#playNote,#coachTip){width:calc(42% - 100px)}
[data-ui="board"] #game.land .dock .sizing.b-sizing{left:12px;right:auto;width:calc(42% - 24px);top:6px;height:var(--bd-land-row)}
[data-ui="board"] #game.land .dock .sizing.b-sizing .sz-presets{gap:4px}
[data-ui="board"] #game.land .dock .sizing.b-sizing .sz-presets button{font-size:12px}
[data-ui="board"] #game.land .seat.b-seat.hero{margin:0}
[data-ui="board"] #game.land .dock #controls>.info-line:only-child{height:var(--bd-land-row);justify-content:center;text-align:center}
/* narrow sideways phones (under 760 wide): "+30s" joins the action row, before "⋯", so the info line keeps its width;
   the buttons read on two lines, as upright */
@media (max-width:759px){
  [data-ui="board"] #game.land .dock .controls{width:62%}
  [data-ui="board"] #game.land .dock :is(#helper,.info-line,#playLine,#playNote,#coachTip),[data-ui="board"] #game.land .dock:has(.xtime:not(:disabled)) :is(#helper.b-info,#playNote,#coachTip),[data-ui="board"] #game.land .dock .sizing.b-sizing{width:calc(38% - 24px)}
  [data-ui="board"] #game.land .dock .turnrow .xtime{right:64px;width:56px;padding:0 2px}
  [data-ui="board"] #game.land .dock .turnrow .turnbar{width:calc((100% - 24px) * .62)}
  [data-ui="board"] #game.land .dock:has(.xtime:not(:disabled)) .b-acts:not(.b-sz){grid-template-columns:repeat(var(--n,3),minmax(0,1fr)) 56px 44px}
  [data-ui="board"] #game.land .dock:has(.xtime:not(:disabled)) .b-acts:not(.b-sz) .b-more{grid-column:-2}
  [data-ui="board"] #game.land .dock .act-btn{flex-direction:column;gap:0}
  [data-ui="board"] #game.land .dock .act-btn b,[data-ui="board"] #game.land .dock .act-btn span{font-size:var(--b-t-14)}
}
@media (max-height:359px){
  [data-ui="board"] #game.land{--bd-land-row:44px}
}
@media (max-width:639px),(max-height:359px){
  [data-ui="board"] #game.land .dock #helper.b-info{font-size:11px;line-height:13px}
  [data-ui="board"] #game.land .dock #helper.b-info:has(.h-line) .h-name{display:none}
}
/* ======================================================================================================================
   B3: the header and the tournament sheet (spec §4). Upright: the header card (Level, blinds and ante, your rank, the
   clock over "32/48 players") and the Lobby pill. Sideways: one centred pill, Chat top left, Lobby top right. The card
   opens the sheet: the board's four tiles, "Your place", the sponsor. Today's clock row, stats row and HUD bar are not
   drawn (their cells stay in the page, written as before). Sideways on a wide phone during a tournament, the column
   beside the table (owner): the four tiles, the sponsor, then the info line and the action row at its foot.
   ====================================================================================================================== */
[data-ui="board"] #game>.clock,[data-ui="board"] #game>.stats{display:none}
[data-ui="board"] #game:not(.b-col):not(.b-ncol)>#fieldBar{display:none}
[data-ui="board"] #game .b-top{flex:none;position:relative;z-index:30;display:flex;align-items:center;gap:8px;padding:8px 12px}
[data-ui="board"] #game:not(.land) .b-top-l{display:none}
[data-ui="board"] #game .b-top-l,[data-ui="board"] #game .b-top-r{flex:none;display:flex;align-items:center}
[data-ui="board"] #game .b-hudw{position:relative;flex:1;min-width:0;display:flex}
/* the card: one button */
[data-ui="board"] #game .b-hud{flex:1;min-width:0;height:56px;box-sizing:border-box;display:flex;align-items:center;gap:12px;padding:0 12px;margin:0;
  background:var(--b-surface);border:1px solid var(--b-hair-gold);border-radius:var(--b-r-card);color:var(--b-text);font:inherit;text-align:left;overflow:hidden;cursor:pointer;
  box-shadow:0 6px 16px var(--b-shadow);-webkit-tap-highlight-color:transparent;transition:transform var(--b-press-dur) ease-out}
[data-ui="board"] #game .b-hud:active{transform:scale(var(--b-press-scale))}
[data-ui="board"] #game .b-hud:focus-visible{outline:2px solid var(--b-gold);outline-offset:2px}
[data-ui="board"] #game .b-hud>span{flex:none;display:flex;flex-direction:column;justify-content:center;white-space:nowrap}
[data-ui="board"] #game .b-hud>span[hidden]{display:none}
[data-ui="board"] #game .b-hud small{font-size:var(--b-t-11);font-weight:500;line-height:1.3;color:var(--b-text-2);font-variant-numeric:tabular-nums}
[data-ui="board"] #game .b-hud small:empty{display:none}
[data-ui="board"] #game .b-hud b{font-size:var(--b-t-20);font-weight:600;line-height:1.15;color:var(--b-text);font-variant-numeric:tabular-nums}
[data-ui="board"] #game .b-hud .bh-rk b{color:var(--b-gold-text)}
[data-ui="board"] #game .b-hud .bh-tm{margin-left:auto;align-items:flex-end}
[data-ui="board"] #game .b-hud .bh-tm b{font-size:var(--b-t-22)}
[data-ui="board"] #game .b-top.b-brk .b-hud .bh-tm b{color:var(--b-gold-text)}
/* (a quiet "›" at the card's right edge: the card opens the tournament details; owner, 2026-10-23: nothing said it could
   be tapped. Upright it stands in the card's right padding, 4 px wider for it, so it takes no room from the values) */
[data-ui="board"] #game .b-hud>.bh-go{font-weight:400;line-height:1;color:var(--b-gold);opacity:.8}
[data-ui="board"] #game:not(.land) #bHud{position:relative;padding-right:16px}
[data-ui="board"] #game:not(.land) #bHud>.bh-go{position:absolute;right:4px;top:50%;transform:translateY(-50%);font-size:var(--b-t-15)}
/* (the tightest card, 320 wide: no room to spare, the "›" a size smaller in the card's own 10 px padding) */
[data-ui="board"] #game:not(.land) #bHud.tighter{padding-right:10px}
[data-ui="board"] #game:not(.land) #bHud.tighter>.bh-go{right:3px;font-size:var(--b-t-13)}
[data-ui="board"] #game.land .b-hud>.bh-go{order:7;margin-left:8px;font-size:var(--b-t-17);align-self:center}
[data-ui="board"] #game .b-hud .bh-idle{display:none;font-size:var(--b-t-15);font-weight:600}
[data-ui="board"] #game .b-top.idle .b-hud>span{display:none}
[data-ui="board"] #game .b-top.idle .b-hud>.bh-idle{display:flex}
/* short screens (today's one-row header: the smallest phones, and upright phones with the browser's bars showing): a
   44 px card, the header as tall as today's one row (49 px at 320 wide, 51 px wider), so the table keeps B2's room to
   the pixel. (The top inset is the page's own: body padding, index.html) */
[data-ui="board"] #game.row1:not(.land) .b-top{padding-top:4px;padding-bottom:3px}
[data-ui="board"] #game.row1[data-bcls="P-S"] .b-top{padding-bottom:1px}
[data-ui="board"] #game.row1:not(.land) .b-hud{height:44px;gap:10px;padding:0 10px}
[data-ui="board"] #game.row1:not(.land) .b-hud b{font-size:var(--b-t-17)}
[data-ui="board"] #game.row1:not(.land) .b-hud .bh-tm b{font-size:var(--b-t-20)}
[data-ui="board"] #game[data-bcls="P-S"] .b-top #lobbyBtn{padding:0 10px;font-size:var(--b-t-14)}
/* (long blinds on a narrow phone) */
[data-ui="board"] #game .b-hud.tight{gap:8px;padding:0 12px}
[data-ui="board"] #game .b-hud.tight b{font-size:var(--b-t-17)}
[data-ui="board"] #game .b-hud.tight .bh-tm b{font-size:var(--b-t-20)}
[data-ui="board"] #game .b-hud.tighter{gap:8px;padding:0 10px}
[data-ui="board"] #game .b-hud.tighter b{font-size:var(--b-t-15)}
[data-ui="board"] #game .b-hud.tighter .bh-tm b{font-size:var(--b-t-17)}
[data-ui="board"] #game .b-hud .bh-r,[data-ui="board"] #game .b-hud.tighter .bh-yr,[data-ui="board"] #game .b-hud.tighter .bh-plw{display:none}
[data-ui="board"] #game .b-hud.tighter .bh-r{display:inline}
/* "N watching" (owner's ruling, Issue #32 item 11): upright, one line under the Lobby pill, in the card's height (the
   one-row header's card is 44 tall: there the pill is 32 tall, its hit area still 44, as the sideways pill's); sideways,
   in the pill after the players */
[data-ui="board"] #game .b-hud .bh-wt{display:none}
[data-ui="board"] #game .b-top .b-watch{display:block;font-size:var(--b-t-11);font-weight:500;line-height:12px;color:var(--b-text-2);text-align:center;white-space:nowrap;font-variant-numeric:tabular-nums}
[data-ui="board"] #game .b-top .b-watch[hidden],[data-ui="board"] #game.land .b-top .b-watch{display:none}
[data-ui="board"] #game:not(.land) .b-top-r{flex-direction:column;align-items:stretch;justify-content:center}
[data-ui="board"] #game.row1:not(.land) .b-top-r:has(.b-watch:not([hidden])) #lobbyBtn{min-height:32px;height:32px;position:relative}
[data-ui="board"] #game.land .b-hud .bh-wt:not([hidden]){display:flex;order:4}
[data-ui="board"] #game.land .b-hud .bh-wt b{color:var(--b-text)}
/* Lobby: a pill; Chat (sideways): a round button */
[data-ui="board"] #game .b-top #lobbyBtn{min-height:44px;min-width:44px;padding:0 16px;border-radius:var(--b-r-pill);background:var(--b-surface-2);border:1px solid var(--b-hair);color:var(--b-text);
  font-family:var(--b-font);font-size:var(--b-t-15);font-weight:600;letter-spacing:0;text-transform:none;box-shadow:none}
[data-ui="board"] #game .b-top #chatBtn{min-height:44px;width:44px;min-width:44px;padding:0;border-radius:var(--b-r-pill);background:var(--b-surface);border:1px solid var(--b-hair);color:var(--b-text);font-size:17px;box-shadow:none}
[data-ui="board"] #game .b-top #chatBtn[hidden]{display:none}
/* the sponsor intro (the start, the end of a break): over the card for its seconds, as today */
[data-ui="board"] #game .b-hudw .spn{inset:0;border-radius:var(--b-r-card);border:1px solid var(--b-gold);background:var(--b-surface);box-shadow:0 6px 16px var(--b-shadow);padding:0 12px;gap:10px;justify-content:flex-start}
[data-ui="board"] #game .b-hudw .spn::after{border-radius:inherit}
[data-ui="board"] #game .b-hudw .spn .sp-card{display:flex;align-items:center;gap:10px;min-width:0}
[data-ui="board"] #game .b-hudw .spn .sp-txt{display:flex;flex-direction:column;min-width:0}
[data-ui="board"] #game .b-hudw .spn .sp-txt small{font-size:10px;font-weight:600;letter-spacing:.08em;color:var(--b-gold-text)}
[data-ui="board"] #game .b-hudw .spn .sp-txt b{font-family:var(--b-font);font-size:var(--b-t-15);font-weight:600;color:var(--b-text)}
[data-ui="board"] #game .b-hudw .spn .sp-prize{display:none}
[data-ui="board"] #game .b-hudw .spn .sp-logo .bz-logo.sp{width:36px;height:36px}

/* ---------- sideways: one centred pill, Chat top left, Lobby top right ---------- */
/* (35 px in all, the room today's sideways header and its hairline take, so the table keeps B2's room to the pixel:
   §3.1's L budget says 36 + 4, which took 7 px from the felt; the hit area of the pill reaches 44 px tall) */
[data-ui="board"] #game.land .b-top{padding:2px 12px 3px}
[data-ui="board"] #game.land .b-top-l,[data-ui="board"] #game.land .b-top-r{flex:1 1 0;min-width:max-content}
[data-ui="board"] #game.land .b-top-r{justify-content:flex-end}
[data-ui="board"] #game.land .b-hudw{flex:0 1 auto;min-width:0}
[data-ui="board"] #game.land .b-hud{height:30px;border-radius:var(--b-r-pill);gap:0;padding:0 16px;box-shadow:none;overflow:visible;position:relative}
[data-ui="board"] #game.land .b-hud::after{content:"";position:absolute;left:0;right:0;top:-7px;bottom:-7px}
[data-ui="board"] #game.land .b-hud>span{flex-direction:row;align-items:baseline;gap:5px}
[data-ui="board"] #game.land .b-hud .bh-tm{display:contents}
[data-ui="board"] #game.land .b-hud b,[data-ui="board"] #game.land .b-hud .bh-tm b{font-size:var(--b-t-15)}
[data-ui="board"] #game.land .b-hud small{font-size:var(--b-t-13);color:var(--b-text-2)}
[data-ui="board"] #game.land .b-hud #bhAnte{display:none}
[data-ui="board"] #game.land .b-hud .bh-lvl{order:1}
[data-ui="board"] #game.land .b-hud .bh-bl{order:2}
[data-ui="board"] #game.land .b-hud #bhPl{order:3;color:var(--b-text)}
[data-ui="board"] #game.land .b-hud .bh-rk{order:5}
[data-ui="board"] #game.land .b-hud #bhTime{order:6;color:var(--b-gold)}
[data-ui="board"] #game.land .b-hud :is(.bh-bl,#bhPl,.bh-wt,.bh-rk,#bhTime)::before{content:'·';margin:0 8px;color:var(--b-text-3);font-weight:400}
[data-ui="board"] #game.land .b-hud.tight .bh-rk small,[data-ui="board"] #game.land .b-hud.tighter .bh-lvl small,[data-ui="board"] #game.land .b-hud.tighter .bh-plw{display:none}
[data-ui="board"] #game.land .b-hud.tight b{font-size:var(--b-t-14)}
[data-ui="board"] #game.land .b-hud.snug :is(.bh-bl,#bhPl,.bh-wt,.bh-rk,#bhTime)::before{margin:0 4px}
[data-ui="board"] #game.land .b-hud.snug{padding:0 12px}
[data-ui="board"] #game.land .b-hud.snug .bh-plw{display:none}
[data-ui="board"] #game.land .b-hud.tight small{font-size:12px}
[data-ui="board"] #game.land .b-top #lobbyBtn{min-height:30px;height:30px;padding:0 14px;font-size:var(--b-t-14)}
[data-ui="board"] #game.land .b-top #chatBtn{min-height:30px;width:44px;height:30px;font-size:15px}

/* ---------- the tiles (the sheet; sideways, the column) ---------- */
[data-ui="board"] #game .b-tiles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
[data-ui="board"] #game .b-tile{min-width:0;display:flex;flex-direction:column;gap:1px;padding:8px 12px;border-radius:var(--b-r-plate);background:var(--b-surface-2);border:1px solid var(--b-hair)}
[data-ui="board"] #game .b-tile small{font-size:var(--b-t-11);font-weight:500;line-height:1.3;color:var(--b-text-2)}
[data-ui="board"] #game .b-tile b{font-size:var(--b-t-17);font-weight:600;line-height:1.2;color:var(--b-text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-variant-numeric:tabular-nums}
[data-ui="board"] #game .b-tile span{font-size:var(--b-t-13);font-weight:600;line-height:1.25;color:var(--b-gold-text);font-variant-numeric:tabular-nums}
[data-ui="board"] #game .b-tile.bt-watch{display:grid;grid-template-columns:auto 1fr;column-gap:5px;align-items:baseline}
[data-ui="board"] #game .b-tile.bt-watch small{grid-column:1/-1}
[data-ui="board"] #game .b-tile.bt-watch span{color:var(--b-text-2);font-weight:500}
/* the sheet: the four tiles, two by two upright, four across sideways */
[data-ui="board"] #game .b-hsheet .b-sheet-in{gap:10px;padding-top:14px}
[data-ui="board"] #game .b-hsheet .bs-head{display:flex;flex-direction:column;gap:2px;padding:0 4px}
[data-ui="board"] #game .b-hsheet .bs-head .b-sheet-t{font-size:var(--b-t-17);color:var(--b-text);padding:0;letter-spacing:0}
[data-ui="board"] #game .b-hsheet .bs-head small{font-size:var(--b-t-13);color:var(--b-text-2);font-variant-numeric:tabular-nums}
[data-ui="board"] #game.land .b-hsheet .b-tiles{grid-template-columns:repeat(4,minmax(0,1fr))}
/* the sheet fits the screen at every phone width, with larger text too (owner's priority, Issue #32 item 8): its one
   column is the sheet's width, never its widest line's (an implicit grid column grew to the longest name, the "Your
   place" line or the sponsor's, past the screen's edge); the type follows the reader's text size (rem: 16 px at the
   default size, as before); and every line wraps whole words instead of being cut off */
[data-ui="board"] #game .b-hsheet{--b-t-11:.6875rem;--b-t-13:.8125rem;--b-t-15:.9375rem;--b-t-17:1.0625rem}
[data-ui="board"] #game .b-hsheet .b-sheet-in{grid-template-columns:minmax(0,1fr);max-width:100%;min-width:0;overflow-x:hidden}
[data-ui="board"] #game .b-hsheet .b-sheet-in>*{min-width:0;max-width:100%}
[data-ui="board"] #game .b-hsheet :is(.bs-head small,.b-tile small,.b-tile b,.b-tile span,.b-place span,.b-place b,.b-place small,.sp-txt small,.sp-txt b,.side-prize b,.side-prize small){white-space:normal;overflow:visible;text-overflow:clip;overflow-wrap:break-word;min-width:0}
[data-ui="board"] #game .b-hsheet .b-place{min-width:0}
[data-ui="board"] #game .b-hsheet .b-tile.bt-watch{display:flex;flex-direction:row;flex-wrap:wrap;align-content:flex-start;align-items:baseline;column-gap:5px}
[data-ui="board"] #game .b-hsheet .b-tile.bt-watch small{flex:1 0 100%}
[data-ui="board"] #game .b-hsheet .b-tile.bt-watch span{overflow-wrap:normal}
[data-ui="board"] #game .b-hsheet .b-pres .sp-card{min-width:0;max-width:100%;box-sizing:border-box}
[data-ui="board"] #game .b-hsheet .b-pres .sp-txt{flex:1 1 auto}

[data-ui="board"] #game .b-place{display:flex;flex-wrap:wrap;align-items:baseline;column-gap:8px;row-gap:0;padding:10px 12px;border-radius:var(--b-r-plate);border:1px solid var(--b-hair-gold);background:var(--b-gold-fill)}
[data-ui="board"] #game .b-place span{font-size:var(--b-t-13);font-weight:500;color:var(--b-text-2)}
[data-ui="board"] #game .b-place b{font-size:var(--b-t-17);font-weight:600;color:var(--b-gold-text)}
[data-ui="board"] #game .b-place small{font-size:var(--b-t-13);color:var(--b-text-2);font-variant-numeric:tabular-nums}
[data-ui="board"] #game .b-pres .sp-card{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:var(--b-r-plate);background:var(--b-surface-2);border:1px solid var(--b-hair);min-width:0}
[data-ui="board"] #game .b-pres .sp-txt{display:flex;flex-direction:column;min-width:0;gap:1px}
[data-ui="board"] #game .b-pres .sp-txt small{font-size:var(--b-t-11);font-weight:600;letter-spacing:.06em;color:var(--b-gold-text)}
[data-ui="board"] #game .b-pres .sp-txt b{font-family:var(--b-font);font-size:var(--b-t-15);font-weight:600;color:var(--b-text)}
[data-ui="board"] #game .b-pres .sp-txt small.sp-cat{letter-spacing:0;font-weight:500;color:var(--b-text-2)}
[data-ui="board"] #game .b-pres .sp-txt small.sp-prize,[data-ui="board"] #game .b-pres .sp-txt small.sp-more{text-transform:none;letter-spacing:0;font-size:var(--b-t-13);font-weight:500;color:var(--b-gold-text)}
[data-ui="board"] #game .b-pres [data-spbiz]{cursor:pointer}
[data-ui="board"] #game .b-pres .side-prize{display:grid;gap:2px;padding:10px 12px;border-radius:var(--b-r-plate);border:1px solid var(--b-hair-gold);background:var(--b-gold-fill)}
[data-ui="board"] #game .b-pres .side-prize small{font-size:var(--b-t-11);color:var(--b-text-2)}
[data-ui="board"] #game .b-pres .side-prize b{font-size:var(--b-t-15);color:var(--b-gold-text)}

/* ---------- the break card (§3.4, restyled): the sponsor's spotlight on the felt ---------- */
[data-ui="board"] #game .brk-card{background:var(--b-surface);border:1px solid var(--b-hair-gold);border-radius:var(--b-r-card);box-shadow:0 18px 40px var(--b-shadow)}
[data-ui="board"] #game .brk-eye{font-size:var(--b-t-11);font-weight:600;color:var(--b-gold-text)}
[data-ui="board"] #game .brk-time{font-family:var(--b-font);font-weight:600;color:var(--b-text);font-variant-numeric:tabular-nums}
[data-ui="board"] #game .brk-sub{font-size:12px;color:var(--b-text-2)}
[data-ui="board"] #game .brk-lead{font-family:var(--b-font);color:var(--b-gold-text)}
[data-ui="board"] #game .pot.beat{color:var(--b-gold-text);font-weight:700;font-size:var(--b-t-15);padding:3px 12px;background:var(--b-surface)}
[data-ui="board"] #game #tableArea.win-beat .center .msg.up{background:var(--b-surface)}
[data-ui="board"] #game #tableArea.win-beat .center .msg{color:var(--b-gold-text)}
[data-ui="board"] #game .brk .sp-card{border-top-color:var(--b-hair)}
[data-ui="board"] #game .brk .sp-txt small{color:var(--b-gold-text)}
[data-ui="board"] #game .brk .sp-txt small.sp-cat{color:var(--b-text-2)}
[data-ui="board"] #game .brk .sp-txt b{font-family:var(--b-font);color:var(--b-text)}
[data-ui="board"] #game .brk .sp-txt small.sp-prize,[data-ui="board"] #game .brk-prize{color:var(--b-gold-text)}
/* (sideways the felt is low: the card is compact, so it stands between the top seats and yours) */
[data-ui="board"] #game.land .brk-card{padding:8px 14px 8px;gap:2px}
[data-ui="board"] #game.land .brk-time{font-size:26px}
[data-ui="board"] #game.land .brk .sp-card{margin-top:4px;padding-top:6px}
[data-ui="board"] #game.land .brk .sp-txt small.sp-cat,[data-ui="board"] #game.land .brk-sub{display:none}

/* ---------- sideways with the column (a tournament on a phone 740 px wide or more) ---------- */
[data-ui="board"] #game.land.b-col{display:grid;--b-colw:clamp(250px,33vw,320px);grid-template-columns:minmax(0,1fr) var(--b-colw);grid-template-rows:auto auto minmax(0,1fr) auto;
  --bd-pad:6px;--bd-band:44px;--bd-gap:6px;--bd-row:var(--bd-land-row)}
[data-ui="board"] #game.land.b-col>.b-top{grid-column:1/-1;grid-row:1}
[data-ui="board"] #game.land.b-col>.table-area{grid-column:1;grid-row:2/5;min-height:0}
[data-ui="board"] #game.land.b-col>#fieldBar{grid-column:2;grid-row:2;display:block;margin:2px 8px 0 4px;padding:0;border:0;border-radius:0;background:none!important;box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none}
[data-ui="board"] #game.land.b-col .b-tiles{gap:6px}
[data-ui="board"] #game.land.b-col .b-tile{padding:5px 10px}
[data-ui="board"] #game.land.b-col .b-tile b{font-size:var(--b-t-15)}
[data-ui="board"] #game.land.b-col .b-tile.bt-lead{display:grid;grid-template-columns:minmax(0,auto) auto;column-gap:6px;align-items:baseline;justify-content:start}
[data-ui="board"] #game.land.b-col .b-tile.bt-lead small{grid-column:1/-1}
[data-ui="board"] #game.land.b-col .dock #helper.b-info{font-size:12px;line-height:14px}
[data-ui="board"] #game.land.b-col .dock #helper.b-info:has(.h-line) .h-name{display:none}
[data-ui="board"] #game.land.b-col>.side:not([hidden]){grid-column:2;grid-row:3;margin:8px 8px 0 4px}
[data-ui="board"] #game.land.b-col .side .sp-card{background:var(--b-surface);border:1px solid var(--b-hair-gold);border-radius:var(--b-r-plate);box-shadow:none}
[data-ui="board"] #game.land.b-col .side .sp-txt small{color:var(--b-gold-text)}
[data-ui="board"] #game.land.b-col .side .sp-txt small.sp-cat{color:var(--b-text-2)}
[data-ui="board"] #game.land.b-col .side .sp-txt b{font-family:var(--b-font);font-size:var(--b-t-17);color:var(--b-text)}
[data-ui="board"] #game.land.b-col .side .sp-txt small.sp-prize{color:var(--b-gold-text);border-top-color:var(--b-hair)}
[data-ui="board"] #game.land.b-col .side .sp-more{color:var(--b-gold-text)}
[data-ui="board"] #game.land.b-col .side-prize{border:1px solid var(--b-hair-gold);background:var(--b-gold-fill);border-radius:var(--b-r-plate)}
[data-ui="board"] #game.land.b-col .side-prize small{color:var(--b-text-2)}
[data-ui="board"] #game.land.b-col .side-prize b{color:var(--b-gold-text)}
/* (the dock at the column's foot: the info line over the action row, as upright, the row reaching the screen's bottom) */
[data-ui="board"] #game.land.b-col>.dock{grid-column:2;grid-row:4;align-self:end;padding:0;margin:0 8px 0 4px;height:calc(var(--bd-pad) + var(--bd-band) + var(--bd-gap) + var(--bd-row) + var(--bd-pad))}
[data-ui="board"] #game.land.b-col .dock .controls{margin:calc(var(--bd-pad) + var(--bd-band) + var(--bd-gap)) 0 0;width:auto;padding:0 0 var(--bd-pad)}
/* (the home-screen inset is the screen's own padding sideways, #game.land: counted once, not again in the dock; Issue #19's class) */
[data-ui="board"] #game.land.b-col .dock :is(#helper,.info-line,#playLine,#playNote,#coachTip),[data-ui="board"] #game.land.b-col .dock:has(.xtime:not(:disabled)) :is(#helper.b-info,#playNote,#coachTip),[data-ui="board"] #game.land.b-col .dock .sizing.b-sizing{left:0;right:0;width:auto;top:var(--bd-pad)}
[data-ui="board"] #game.land.b-col .dock #helper.b-info{height:var(--bd-band);justify-content:center;text-align:center}
[data-ui="board"] #game.land.b-col .dock .info-line{height:calc(var(--bd-band) - 15px);text-align:center}
[data-ui="board"] #game.land.b-col .dock #playLine{top:calc(var(--bd-pad) + var(--bd-band) - 15px);text-align:center}
[data-ui="board"] #game.land.b-col .dock #playNote{height:var(--bd-band);justify-content:center;text-align:center}
[data-ui="board"] #game.land.b-col .dock:has(.xtime:not(:disabled)) :is(#helper.b-info,#playNote,#coachTip){right:64px}
[data-ui="board"] #game.land.b-col .dock .turnrow{display:block;position:absolute;left:0;right:0;top:var(--bd-pad);height:var(--bd-band);margin:0;pointer-events:none;z-index:2}
[data-ui="board"] #game.land.b-col .dock .turnrow .xtime{top:0;right:0;width:58px;height:var(--bd-band);min-height:44px;padding:0 2px}
[data-ui="board"] #game.land.b-col .dock .turnrow .turnbar{left:0;right:0;width:auto;top:calc(var(--bd-band) + var(--bd-gap) / 2 - 1px)}
[data-ui="board"] #game.land.b-col .dock .b-acts:not(.b-sz):not(.b-idle),[data-ui="board"] #game.land.b-col .dock:has(.xtime:not(:disabled)) .b-acts:not(.b-sz):not(.b-idle){grid-template-columns:repeat(var(--n,3),minmax(0,1fr)) 44px;gap:6px}
[data-ui="board"] #game.land.b-col .dock:has(.xtime:not(:disabled)) .b-acts:not(.b-sz) .b-more{grid-column:auto}
[data-ui="board"] #game.land.b-col .dock .b-acts.b-sz{grid-template-columns:44px minmax(0,1fr) minmax(84px,.9fr);gap:6px}
/* (the column is too narrow for − and + beside the slider: they left it no track, only its knob (owner's iPhone in an
   in-app browser, 844x350). There the slider takes their room; the presets over it still step the amount) */
[data-ui="board"] #game.land.b-col .dock .b-sz .sz-slider .step{display:none}
[data-ui="board"] #game.land.b-col .dock .act-btn{flex-direction:column;gap:0;padding:0 2px}
[data-ui="board"] #game.land.b-col .dock .act-btn b,[data-ui="board"] #game.land.b-col .dock .act-btn span{font-size:var(--b-t-14)}
[data-ui="board"] #game.land.b-col .dock .preacts.b-acts button:not(.b-more){font-size:12px}
[data-ui="board"] #game.land.b-col .dock #controls>.info-line:only-child{height:var(--bd-row)}
@media (prefers-reduced-motion:reduce){
  [data-ui="board"] #game #seats .seat.b-seat{transition:none}
  [data-ui="board"] #game #seats .seat.b-seat.hero.acting .plate{animation:none}
  [data-ui="board"] #game .dock .act-btn{transition:none}
  [data-ui="board"] #game .dock .act-btn:active{transform:none}
  [data-ui="board"] #game .b-hud,[data-ui="board"] #game .b-hud:active{transition:none;transform:none}
}

/* ---------- sideways under 740 wide during a tournament (the owner's iPhone with Safari's bars, 667-700 x 307-330):
   a narrow column right of the table, the four tiles compact over the sponsor (logo or initials, "Presented by", the
   name); the action row stays full width under the table and the column, as on any sideways phone. With no sponsor and
   no prize the column holds the tiles only. (owner's ruling, 2026-10-23) ---------- */
[data-ui="board"] #game.land.b-ncol{display:grid;--b-ncolw:clamp(148px,26vw,184px);grid-template-columns:minmax(0,1fr) var(--b-ncolw);grid-template-rows:auto auto minmax(0,1fr) auto}
[data-ui="board"] #game.land.b-ncol>.b-top{grid-column:1/-1;grid-row:1;min-width:0}
[data-ui="board"] #game.land.b-ncol>.table-area{grid-column:1;grid-row:2/4;min-height:0}
[data-ui="board"] #game.land.b-ncol>.dock{grid-column:1/-1;grid-row:4}
[data-ui="board"] #game.land.b-ncol>#fieldBar{grid-column:2;grid-row:2;display:block;margin:0 8px 0 0;padding:0;border:0;border-radius:0;background:none!important;box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none;min-width:0}
[data-ui="board"] #game.land.b-ncol .b-tiles{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-flow:row dense;gap:4px}
[data-ui="board"] #game.land.b-ncol .b-tile{padding:3px 7px;gap:0;border-radius:10px}
[data-ui="board"] #game.land.b-ncol .b-tile small{font-size:10px;line-height:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
[data-ui="board"] #game.land.b-ncol .b-tile b{font-size:13px;line-height:16px}
[data-ui="board"] #game.land.b-ncol .b-tile span{font-size:12px;line-height:16px}
[data-ui="board"] #game.land.b-ncol .b-tile.bt-lead{grid-column:1/-1;display:grid;grid-template-columns:minmax(0,auto) auto;column-gap:6px;align-items:baseline;justify-content:start}
[data-ui="board"] #game.land.b-ncol .b-tile.bt-lead small{grid-column:1/-1}
[data-ui="board"] #game.land.b-ncol .b-tile.bt-watch>span{display:none}
[data-ui="board"] #game.land.b-ncol>.side:not([hidden]){grid-column:2;grid-row:3;margin:6px 8px 0 0;min-width:0}
[data-ui="board"] #game.land.b-ncol .side .sp-card{gap:8px;padding:6px 8px;background:var(--b-surface);border:1px solid var(--b-hair-gold);border-radius:var(--b-r-plate);box-shadow:none}
[data-ui="board"] #game.land.b-ncol .side .sp-logo .bz-logo.sp{width:32px;height:32px;border-radius:8px;font-size:12px}
[data-ui="board"] #game.land.b-ncol .side .sp-txt{min-width:0}
[data-ui="board"] #game.land.b-ncol .side .sp-txt small{font-size:9px;letter-spacing:.08em;color:var(--b-gold-text)}
[data-ui="board"] #game.land.b-ncol .side .sp-txt b{font-family:var(--b-font);font-size:13px;line-height:1.2;color:var(--b-text);white-space:normal;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
[data-ui="board"] #game.land.b-ncol .side .sp-txt small.sp-cat,[data-ui="board"] #game.land.b-ncol .side .sp-more{display:none}
[data-ui="board"] #game.land.b-ncol .side .sp-txt small.sp-prize{font-size:11px;letter-spacing:0;-webkit-line-clamp:2;margin-top:2px;padding-top:2px;border-top-color:var(--b-hair)}
[data-ui="board"] #game.land.b-ncol .side.s2 .sp-txt>small:first-child{display:block}
[data-ui="board"] #game.land.b-ncol .side.s2 .sp-txt small.sp-prize{display:none}
[data-ui="board"] #game.land.b-ncol .side-prize{padding:5px 8px;border:1px solid var(--b-hair-gold);background:var(--b-gold-fill);border-radius:var(--b-r-plate)}
[data-ui="board"] #game.land.b-ncol .side-prize small{color:var(--b-text-2)}
[data-ui="board"] #game.land.b-ncol .side-prize b{font-size:12px;color:var(--b-gold-text)}

/* ---------- your turn with "+30s": the free-play line ends before the button (owner's game, 2026-10-23: sideways
   "+30s · 5 left" stood over "No real money") ---------- */
/* (the line keeps its foot where it was; where it no longer fits on one line it takes two, "Free social play ·" over
   "No betting · No real money", never cut short) */
[data-ui="board"] #game .dock:has(.xtime:not(:disabled)):not(:has(.sizing)) #playLine{height:30px;top:calc(var(--bd-pad) + var(--bd-band) - 30px);display:flex;flex-wrap:wrap;justify-content:center;align-content:flex-end;
  column-gap:.3em;white-space:normal;text-overflow:clip}
[data-ui="board"] #game .dock:has(.xtime:not(:disabled)) #playLine span{white-space:nowrap}
[data-ui="board"] #game:not(.land) .dock:has(.xtime:not(:disabled)) #playLine{right:80px}
[data-ui="board"] #game.land .dock:has(.xtime:not(:disabled)) #playLine{top:calc(6px + var(--bd-land-row) - 30px)}
@media (min-width:760px){ [data-ui="board"] #game.land:not(.b-col) .dock:has(.xtime:not(:disabled)) #playLine{width:calc(42% - 100px)} }
[data-ui="board"] #game.land.b-col .dock:has(.xtime:not(:disabled)) #playLine{top:calc(var(--bd-pad) + var(--bd-band) - 30px);right:64px}

/* ---------- sitting out: the words on the info line, "I'm back" in the action row before "⋯" (owner's iPhone,
   2026-10-23: the button in the line overflowed it, cut by the free-play line, and the words rose under your plate) ---------- */
[data-ui="board"] #game .dock .b-acts.b-back::before{display:none}
[data-ui="board"] #game .dock .b-acts.b-back #backBtn{justify-self:center;align-self:center;height:44px;min-height:44px;margin:0;padding:0 28px;border-radius:var(--b-r-btn);font-size:var(--b-t-15);font-weight:600}
/* (where the words take two lines, the smallest phones and sideways: a size smaller, two lines fit the line's height) */
[data-ui="board"] #game[data-bcls="P-S"] .dock .info-line.b-away,[data-ui="board"] #game.land .dock .info-line.b-away{font-size:12px;line-height:14px}
/* (sideways, beside the table: the row holds only "I'm back" and "⋯", so it takes only their room and the words and the
   free-play line beside it get the rest, whole) */
[data-ui="board"] #game.land:not(.b-col) .dock:has(.b-back) .controls{width:184px}
[data-ui="board"] #game.land:not(.b-col) .dock:has(.b-back) :is(.info-line,#playLine){width:calc(100% - 24px - 184px - 12px)}

/* ---------- B4, navigation (§5): the top bar, the five tabs at the bottom, the rows that open today's pages ---------- */
/* the top bar: BLINDRISE left; the bell, Director (the club director only) and the avatar right, each 44x44 */
[data-ui="board"] #lobby .topbar{min-height:56px;padding:6px 12px 6px 16px;gap:var(--b-s2);background:var(--b-bg);border-bottom:1px solid var(--b-hair)}
[data-ui="board"] #lobby .me-chip{gap:var(--b-s1);flex:none}
[data-ui="board"] #lobby .b-topbtn{display:inline-grid;place-items:center;width:var(--b-tap);height:var(--b-tap);min-height:var(--b-tap);padding:0;border:0;border-radius:var(--b-r-pill);background:transparent;color:var(--b-text-2);position:relative}
[data-ui="board"] #lobby .b-topbtn[hidden]{display:none}
[data-ui="board"] #lobby .b-topbtn .b-ic{width:22px;height:22px}
[data-ui="board"] #lobby .b-topbtn:active{transform:scale(var(--b-press-scale))}
[data-ui="board"] #lobby .b-topbtn:focus-visible,[data-ui="board"] #lobby .tabs button:focus-visible,[data-ui="board"] #lobby .b-row:focus-visible,[data-ui="board"] #lobby .b-back:focus-visible{outline:2px solid var(--b-gold);outline-offset:2px}
/* (the bell on: a gold dot) */
[data-ui="board"] #lobby .b-bell.on,[data-ui="board"] #lobby #dirTab.on{color:var(--b-gold)}
[data-ui="board"] #lobby #dirTab.on{background:var(--b-gold-fill)}
[data-ui="board"] #lobby .b-bell.on::after{content:"";position:absolute;top:10px;right:11px;width:7px;height:7px;border-radius:50%;background:var(--b-gold);box-shadow:0 0 0 2px var(--b-bg)}
[data-ui="board"] #lobby .b-avbtn .av{width:32px;height:32px;font-size:12px}
[data-ui="board"] .b-ic{fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;flex:none}

/* the bottom bar: 56 tall plus the bottom inset, counted once (Issue #19); the active tab gold on a 14% gold pill */
[data-ui="board"] #lobby .tabs{min-height:0;height:calc(56px + var(--sa-b));box-sizing:border-box;padding:0 6px var(--sa-b);gap:2px;align-items:stretch;overflow:visible;
  background:var(--b-surface);border-top:1px solid var(--b-hair);box-shadow:none}
[data-ui="board"] #lobby .tabs button{flex:1 1 0;min-width:0;min-height:0;height:48px;margin:4px 0;padding:0 2px;gap:2px;border-radius:var(--b-r-btn);
  font-family:var(--b-font);font-size:var(--b-t-11);font-weight:500;letter-spacing:0;text-transform:none;color:var(--b-text-2);background:transparent}
[data-ui="board"] #lobby .tabs button svg{width:22px;height:22px;stroke-width:1.6;filter:none;color:inherit}
[data-ui="board"] #lobby .tabs button[aria-selected="true"],[data-ui="board"] #lobby .tabs .biz-tab[aria-selected="true"]{color:var(--b-gold);background:var(--b-gold-fill)}
[data-ui="board"] #lobby .tabs button[aria-selected="true"] svg{color:var(--b-gold);filter:none}
[data-ui="board"] #lobby .tabs button[aria-selected="true"]::before{display:none}
[data-ui="board"] #lobby .tabs .biz-tab:not([aria-selected="true"]){color:var(--b-text-2)}
[data-ui="board"] #lobby .tabs button:active{transform:scale(var(--b-press-scale))}

/* a tab's title, the way back from one of today's pages, and the rows */
[data-ui="board"] #lobby .b-pagehead{display:grid;gap:2px;padding:4px 2px 2px}
[data-ui="board"] #lobby .b-pagehead h2{margin:0;font-size:var(--b-t-22);font-weight:600;color:var(--b-text)}
[data-ui="board"] #lobby .b-pagehead small{font-size:var(--b-t-13);color:var(--b-text-2)}
[data-ui="board"] #lobby .b-back{align-self:flex-start;display:inline-flex;align-items:center;gap:4px;min-height:var(--b-tap);padding:0 14px 0 8px;border-radius:var(--b-r-pill);
  background:var(--b-surface);border:1px solid var(--b-hair);color:var(--b-text);font-size:var(--b-t-15);font-weight:600}
[data-ui="board"] #lobby .b-back .b-ic{width:18px;height:18px;transform:scaleX(-1)}
[data-ui="board"] #lobby .b-rows{display:flex;flex-direction:column;background:var(--b-surface);border:1px solid var(--b-hair);border-radius:var(--b-r-card);overflow:hidden}
[data-ui="board"] #lobby .b-row{display:flex;align-items:center;gap:var(--b-s3);min-height:60px;padding:8px var(--b-s4);background:transparent;border:0;border-radius:0;color:var(--b-text);text-align:left;width:100%}
[data-ui="board"] #lobby .b-row+.b-row{border-top:1px solid var(--b-hair)}
[data-ui="board"] #lobby .b-row:active{background:var(--b-surface-2)}
[data-ui="board"] #lobby .b-row-ic{width:22px;height:22px;color:var(--b-gold)}
[data-ui="board"] #lobby .b-row-t{flex:1;min-width:0;display:grid;gap:2px}
[data-ui="board"] #lobby .b-row-t b{font-size:var(--b-t-15);font-weight:600}
[data-ui="board"] #lobby .b-row-t small{font-size:var(--b-t-13);color:var(--b-text-2);line-height:1.3}
[data-ui="board"] #lobby .b-chev{width:18px;height:18px;color:var(--b-text-3)}
/* Profile: who you are, then the rows */
[data-ui="board"] #lobby .b-me{display:flex;align-items:center;gap:var(--b-s4);padding:var(--b-s4);background:var(--b-surface-2);border:1px solid var(--b-hair-gold);border-radius:var(--b-r-card)}
[data-ui="board"] #lobby .b-me-t{min-width:0}
[data-ui="board"] #lobby .b-me h2{margin:0;font-size:var(--b-t-20);font-weight:600;color:var(--b-text);overflow-wrap:anywhere}
/* (the wordmark stays on every width: the top bar's right side is three icons now) */
[data-ui="board"] #lobby .mini-logo{min-width:0}
[data-ui="board"] #lobby .mini-logo .lx-word{display:inline}

/* ---------- B4 on a wide screen (owner, desktop Chrome, 2026-10-23): one column on every tab, the page scrolls as one ----------
   The top bar, the content and the tab bar share the lobby's one centred 540 px column on every tab (the lobby no longer
   widens for Home and Exchange). While the lobby shows, the page itself scrolls (no inner scroll box): the top bar
   sticks at the top, the tab bar is fixed at the foot, and the content ends clear of it (56 + the inset + 24). The table
   keeps its own fixed screen: these rules apply only while the lobby is the screen showing. */
[data-ui="board"]:has(#lobby:not([hidden])),[data-ui="board"]:has(#lobby:not([hidden])) body{height:auto;min-height:100%;overflow:visible}
[data-ui="board"]:has(#lobby:not([hidden])) body{overflow-x:clip}
[data-ui="board"] .app:has(>#lobby:not([hidden])){height:auto;min-height:100vh;min-height:100dvh;overflow:visible}
[data-ui="board"] #lobby:not([hidden]){position:relative;inset:auto;display:block;min-height:100vh;min-height:100dvh}
[data-ui="board"] #lobby .topbar{position:sticky;top:env(safe-area-inset-top,0px);z-index:10}
/* the band behind the phone's status bar: a scrolled page passes under it, never under the clock (owner, Oct 27) */
[data-ui="board"] body:has(#lobby:not([hidden]))::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);background:var(--b-bg);z-index:11;pointer-events:none}
[data-ui="board"] #lobby #lobbyBody{overflow:visible;padding-bottom:calc(56px + var(--sa-b) + 24px)}
[data-ui="board"] #lobby .tabs{position:fixed;left:0;right:0;bottom:0;z-index:20;width:100%;max-width:540px;margin:0 auto}
[data-ui="board"] #lobby .bz-find{top:56px}
/* (a sideways row, the Exchange spotlight: it keeps its own sideways scroll; with a mouse, a thin quiet bar under the
   cards, well clear of the tab bar) */
[data-ui="board"] #lobby .bz-rail{scrollbar-width:thin;scrollbar-color:var(--b-hair) transparent}
/* (with a mouse, Oct 26: on a computer the industry chips wrap onto a second line inside the column instead of running
   off its edge, and a sideways row gets round ‹ › buttons at its ends; on a phone both still swipe) */
@media (hover:hover) and (pointer:fine){
  [data-ui="board"] #lobby .bz-chips{flex-wrap:wrap;overflow:visible;margin-inline:0;padding-inline:0}
  [data-ui="board"] .bz-railnav{display:grid;place-items:center;position:absolute;top:calc(50% - 22px);z-index:2;width:40px;height:40px;padding:0;border-radius:50%;
    background:var(--b-surface);border:1px solid var(--b-hair-gold);color:var(--b-gold);box-shadow:0 6px 18px var(--b-shadow);cursor:pointer}
  [data-ui="board"] .bz-railnav[hidden]{display:none}
  [data-ui="board"] .bz-railnav:hover{background:var(--b-surface-2,var(--b-surface));border-color:var(--b-gold)}
  [data-ui="board"] .bz-railnav:focus-visible{outline:2px solid var(--b-gold);outline-offset:2px}
  [data-ui="board"] .bz-railnav.prev{left:-6px}
  [data-ui="board"] .bz-railnav.next{right:-6px}
  [data-ui="board"] .bz-railnav svg{width:18px;height:18px}
}

/* ---------- the first visit (Issue #39): the welcome, Next game and First steps on Home (tokens only) ---------- */
/* the welcome: a card over Home; the scrim covers the page, and the card keeps clear of the tab bar (it scrolls inside
   itself when the screen is short) */
[data-ui="board"] .b-onb{position:fixed;inset:0;z-index:40;display:flex;align-items:center;justify-content:center;
  padding:calc(12px + env(safe-area-inset-top,0px)) 16px calc(56px + var(--sa-b) + 12px);background:color-mix(in srgb,var(--b-bg) 82%,transparent)}
[data-ui="board"] .b-onb-card{box-sizing:border-box;width:100%;max-width:420px;max-height:100%;overflow:auto;display:grid;gap:var(--b-s3);padding:var(--b-s5);
  background:var(--b-surface);border:1px solid var(--b-hair-gold);border-radius:var(--b-r-sheet);box-shadow:0 18px 48px var(--b-shadow);color:var(--b-text)}
[data-ui="board"] .b-onb-top{display:flex;align-items:center;justify-content:space-between;gap:var(--b-s2);margin:-10px -10px -4px 0}
[data-ui="board"] .b-onb-skip{min-height:var(--b-tap);min-width:var(--b-tap);padding:0 12px;border:0;border-radius:var(--b-r-pill);background:transparent;color:var(--b-text-2);font-size:var(--b-t-15);font-weight:600}
[data-ui="board"] .b-onb-card h2{margin:0;font-size:var(--b-t-22);font-weight:600;line-height:1.2}
[data-ui="board"] .b-onb-card p{margin:0;font-size:var(--b-t-15);line-height:1.45;color:var(--b-text-2)}
[data-ui="board"] .b-onb-card p b{color:var(--b-text)}
[data-ui="board"] .b-onb-tabs{list-style:none;margin:0;padding:0;display:grid;gap:var(--b-s3)}
[data-ui="board"] .b-onb-tabs li{display:flex;align-items:flex-start;gap:var(--b-s3)}
[data-ui="board"] .b-onb-tabs .b-ic{width:22px;height:22px;color:var(--b-gold);margin-top:1px}
[data-ui="board"] .b-onb-tabs span{display:grid;gap:2px}
[data-ui="board"] .b-onb-tabs b{font-size:var(--b-t-15);font-weight:600}
[data-ui="board"] .b-onb-tabs small{font-size:var(--b-t-14);color:var(--b-text-2);line-height:1.35}
[data-ui="board"] .b-onb-game{display:grid;gap:2px}
[data-ui="board"] .b-onb-game span{color:var(--b-gold-text);font-weight:600}
[data-ui="board"] .b-onb-btns{display:flex;gap:var(--b-s2)}
[data-ui="board"] .b-onb-btns .btn{flex:1;min-height:48px}
[data-ui="board"] .b-onb :is(.btn,.b-onb-skip):focus-visible{outline:2px solid var(--b-gold);outline-offset:2px}
/* Next game: compact, first on Home */
[data-ui="board"] #lobby .b-next{gap:var(--b-s2)}
[data-ui="board"] #lobby .b-next .b-next-when{color:var(--b-gold-text);font-weight:600}
[data-ui="board"] #lobby .b-next .b-next-reg{display:flex;align-items:center;gap:6px;color:var(--b-online)}
[data-ui="board"] #lobby .b-next .b-next-reg .b-ic{width:18px;height:18px;stroke-width:2.2}
[data-ui="board"] #lobby .b-next .b-next-reg b{color:var(--b-text)}
[data-ui="board"] #lobby .b-next .btn-row{margin-top:var(--b-s1)}
/* First steps: three rows that tick, and a way to hide the card */
[data-ui="board"] #lobby .b-steps{gap:var(--b-s1);padding-bottom:var(--b-s1)}
[data-ui="board"] #lobby .b-steps-head{display:flex;align-items:center;justify-content:space-between;gap:var(--b-s2);margin:-6px -6px 0 0}
[data-ui="board"] #lobby .b-steps-t{display:grid;gap:2px}
[data-ui="board"] #lobby .b-steps-t small{font-size:var(--b-t-13);color:var(--b-text-2)}
[data-ui="board"] #lobby .b-steps-x{display:inline-grid;place-items:center;width:var(--b-tap);height:var(--b-tap);padding:0;border:0;border-radius:var(--b-r-pill);background:transparent;color:var(--b-text-2)}
[data-ui="board"] #lobby .b-steps-x .b-ic{width:20px;height:20px}
[data-ui="board"] #lobby .b-steps-list{list-style:none;margin:0;padding:0;display:grid}
[data-ui="board"] #lobby .b-steps-list li+li{border-top:1px solid var(--b-hair)}
[data-ui="board"] #lobby .b-step{display:flex;align-items:center;gap:var(--b-s3);width:100%;min-height:56px;padding:6px 0;background:transparent;border:0;color:var(--b-text);text-align:left}
[data-ui="board"] #lobby .b-step .b-row-t b{font-size:var(--b-t-15);font-weight:600}
[data-ui="board"] #lobby .b-step.done .b-row-t b{color:var(--b-text-2);text-decoration:line-through}
[data-ui="board"] #lobby .b-tick{flex:none;display:inline-grid;place-items:center;width:24px;height:24px;border-radius:50%;border:1.5px solid var(--b-text-3);box-sizing:border-box}
[data-ui="board"] #lobby .b-step.done .b-tick{background:var(--b-gold);border-color:var(--b-gold);color:var(--b-bg)}
[data-ui="board"] #lobby .b-tick .b-ic{width:16px;height:16px;stroke-width:2.4}
[data-ui="board"] #lobby :is(.b-step,.b-steps-x):focus-visible{outline:2px solid var(--b-gold);outline-offset:2px}
/* the line before the reminder question: you're registered */
[data-ui="board"] #modalRoot .b-reg-line{margin:0 0 6px;color:var(--b-gold-text);font-weight:600}
/* Home (spec §7): a section's head, Live at Blindrise (a drawn mini felt per table), Community Activity (rows) */
[data-ui="board"] #lobby .b-sec-head{display:flex;align-items:center;justify-content:space-between;gap:var(--b-s2);min-height:var(--b-tap)}
[data-ui="board"] #lobby .b-sec-head h2{display:flex;align-items:center;gap:var(--b-s2);margin:0;font-size:var(--b-t-17);font-weight:600;color:var(--b-text)}
[data-ui="board"] #lobby .b-sec-link{display:inline-flex;white-space:nowrap;align-items:center;gap:2px;min-height:var(--b-tap);padding:0 4px 0 10px;border:0;background:transparent;color:var(--b-gold-text);font-size:var(--b-t-14);font-weight:600}
[data-ui="board"] #lobby .b-sec-link .b-ic{width:16px;height:16px}
[data-ui="board"] #lobby .b-live-dot{width:9px;height:9px;border-radius:50%;background:var(--b-text-3);flex:none}
[data-ui="board"] #lobby .b-live-dot.on{background:var(--b-live);box-shadow:0 0 0 4px color-mix(in srgb,var(--b-live) 22%,transparent)}
[data-ui="board"] #lobby .b-live{gap:var(--b-s2);padding-top:var(--b-s2)}
[data-ui="board"] #lobby .b-live-none{display:grid;gap:2px;margin:0 0 var(--b-s1)}
[data-ui="board"] #lobby .b-live-none b{color:var(--b-text);font-size:var(--b-t-15);font-weight:600}
[data-ui="board"] #lobby .b-live-none small{color:var(--b-text-2);font-size:var(--b-t-14)}
/* (B6) a live table: a card with a drawn mini felt (CSS: rail, felt, the seated avatars round it), the table's name,
   level, blinds and clock; one table fills the width, several scroll sideways */
/* Live at Blindrise, Direction A (Oct 27): the seated members' pictures, the count, the level, a pill per table, Watch */
[data-ui="board"] #lobby .b-lnow{display:grid;gap:var(--b-s2);padding:var(--b-s3);border-radius:var(--b-r-card);background:var(--b-surface-2);border:1px solid var(--b-hair);min-width:0}
[data-ui="board"] #lobby .b-lstrip{display:flex;align-items:center;min-width:0}
[data-ui="board"] #lobby .b-lstrip .b-lav{width:44px;height:44px;font-size:14px;margin-left:-10px;border:2px solid var(--b-surface-2);box-shadow:0 0 0 1px var(--b-hair-gold);flex:none}
[data-ui="board"] #lobby .b-lstrip .b-lav:first-child{margin-left:0}
[data-ui="board"] #lobby .b-lstrip .b-lav .tier-ic{display:none}
[data-ui="board"] #lobby .b-lstrip .b-lmore{width:44px;height:44px;margin-left:-10px;border-radius:50%;border:2px solid var(--b-surface-2);box-shadow:0 0 0 1px var(--b-hair-gold);flex:none;display:grid;place-items:center;background:var(--b-surface);color:var(--b-gold-text);font-size:13px;font-weight:600}
[data-ui="board"] #lobby .b-lcount{display:flex;align-items:baseline;gap:8px;margin:0;flex-wrap:wrap}
[data-ui="board"] #lobby .b-lcount b{font-family:var(--b-serif,Georgia,serif);font-size:32px;line-height:1;font-weight:600;color:var(--b-text)}
[data-ui="board"] #lobby .b-lcount small{font-size:var(--b-t-15);color:var(--b-text-2);font-weight:500}
[data-ui="board"] #lobby .b-lmeta{margin:0;font-size:var(--b-t-14);color:var(--b-text-2);font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
[data-ui="board"] #lobby .b-lmeta b{color:var(--b-text);font-weight:600}
[data-ui="board"] #lobby .b-ltables{display:flex;flex-wrap:wrap;gap:var(--b-s1);min-width:0}
[data-ui="board"] #lobby .b-ltable{min-height:var(--b-tap);padding:0 14px;border-radius:var(--b-r-pill);border:1px solid var(--b-hair-gold);background:none;color:var(--b-gold-text);font-size:var(--b-t-13);font-weight:500;font-variant-numeric:tabular-nums}
[data-ui="board"] #lobby .b-ltable.mine{background:color-mix(in srgb,var(--b-gold) 14%,transparent)}
[data-ui="board"] #lobby .b-ltable:active{transform:scale(var(--b-press-scale))}
[data-ui="board"] #lobby .b-ltable:focus-visible{outline:2px solid var(--b-gold);outline-offset:2px}
[data-ui="board"] #lobby .b-lwatch{width:100%}
/* (B6) the winner's day: the result card and the winner's Exchange card side by side, for one day */
[data-ui="board"] #lobby .b-win{min-width:0}
[data-ui="board"] #lobby .b-win-rail{display:flex;gap:var(--b-s2);overflow-x:auto;scroll-snap-type:x mandatory;overscroll-behavior-x:contain;scrollbar-width:none;margin:0 -14px;padding:2px 14px 4px;scroll-padding:0 14px}
[data-ui="board"] #lobby .b-win-rail::-webkit-scrollbar{display:none}
[data-ui="board"] #lobby .b-win-card{position:relative;flex:1 0 200px;min-width:0;display:grid;align-content:start;gap:var(--b-s2);padding:var(--b-s4);border-radius:var(--b-r-card);
  background:var(--b-surface-2);border:1px solid var(--b-hair-gold);color:var(--b-text);text-align:left;scroll-snap-align:start}
[data-ui="board"] #lobby .b-win-rail.one .b-win-card{flex:1 1 100%}
[data-ui="board"] #lobby .b-win-card:active{transform:scale(var(--b-press-scale))}
[data-ui="board"] #lobby .b-win-card:focus-visible{outline:2px solid var(--b-gold);outline-offset:2px}
[data-ui="board"] #lobby .b-win-card .av{width:56px;height:56px;font-size:18px;border:2px solid var(--b-gold);box-shadow:0 0 0 4px var(--b-gold-fill)}
[data-ui="board"] #lobby .b-win-ic{position:absolute;top:var(--b-s4);right:var(--b-s4);width:28px;height:28px;color:var(--b-gold)}
[data-ui="board"] #lobby .b-win-t{display:grid;gap:2px;min-width:0}
[data-ui="board"] #lobby .b-win-t .b-feed-k{font-size:var(--b-t-11);font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--b-gold-text)}
[data-ui="board"] #lobby .b-win-t b{font-size:var(--b-t-17);font-weight:600;line-height:1.25;overflow-wrap:anywhere}
[data-ui="board"] #lobby .b-win-t small{font-size:var(--b-t-13);color:var(--b-text-2);font-variant-numeric:tabular-nums}
[data-ui="board"] #lobby .b-win-more{display:inline-flex;align-items:center;gap:2px;min-height:var(--b-tap);font-size:var(--b-t-14);font-weight:600;color:var(--b-gold-text)}
[data-ui="board"] #lobby .b-win-more .b-ic{width:16px;height:16px}
[data-ui="board"] #lobby .b-win-rail .bz-vcard{flex:0 0 168px}
@media (prefers-reduced-motion: reduce){[data-ui="board"] #lobby :is(.b-ltable,.b-win-card):active{transform:none}}
[data-ui="board"] #lobby .b-feed{display:grid;gap:var(--b-s2)}
[data-ui="board"] #lobby .b-feed .b-sec-head{padding:0 2px}
[data-ui="board"] #lobby .b-feed-row .av{width:40px;height:40px;font-size:14px;flex:none}
[data-ui="board"] #lobby .b-feed-row .b-row-ic{width:24px;height:24px;margin:0 8px}
[data-ui="board"] #lobby .b-feed-row .b-feed-k{font-size:var(--b-t-11);font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--b-text-3)}
[data-ui="board"] #lobby .b-feed-row .b-feed-sub{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere}
[data-ui="board"] #lobby .b-feed-prize{color:var(--b-gold-text);font-weight:600}
[data-ui="board"] #lobby .b-feed-none{margin:0;color:var(--b-text-2);font-size:var(--b-t-14)}
/* (B6) Community Activity: the filters (All / Tournaments / Business / Highlights), a 40 lead on every row (avatar,
   logo or icon), and the Bulletin's listings with their own request button */
[data-ui="board"] #lobby .b-fchips{display:flex;gap:var(--b-s2);overflow-x:auto;scrollbar-width:none;margin:0 -14px;padding:0 14px}
[data-ui="board"] #lobby .b-fchips::-webkit-scrollbar{display:none}
[data-ui="board"] #lobby .b-fchip{flex:none;min-height:var(--b-tap);padding:0 var(--b-s4);border-radius:var(--b-r-pill);border:1px solid var(--b-hair);background:var(--b-surface);color:var(--b-text-2);font-size:var(--b-t-14);font-weight:600}
[data-ui="board"] #lobby .b-fchip[aria-pressed="true"]{background:var(--b-gold-fill);border-color:var(--b-hair-gold);color:var(--b-gold)}
[data-ui="board"] #lobby .b-fchip:focus-visible,[data-ui="board"] #lobby .b-fi-act:focus-visible{outline:2px solid var(--b-gold);outline-offset:2px}
[data-ui="board"] #lobby .b-feed-list>.b-fi+.b-fi{border-top:1px solid var(--b-hair)}
[data-ui="board"] #lobby .b-feed-row .b-feed-ic,[data-ui="board"] #lobby .b-feed-logo{flex:none;display:grid;place-items:center;width:40px;height:40px;border-radius:var(--b-r-btn);background:var(--b-gold-fill);color:var(--b-gold)}
[data-ui="board"] #lobby .b-feed-row .b-feed-ic svg{width:22px;height:22px}
[data-ui="board"] #lobby .b-feed-logo{background:none}
[data-ui="board"] #lobby .b-feed-logo>*{width:40px !important;height:40px !important;font-size:14px;border-radius:var(--b-r-btn)}
[data-ui="board"] #lobby .b-feed-row .b-row-t b{overflow-wrap:anywhere}
[data-ui="board"] #lobby .b-fi-acts{display:flex;align-items:center;justify-content:flex-start;gap:var(--b-s2);padding:0 var(--b-s4) var(--b-s3) calc(var(--b-s4) + 40px + var(--b-s3))}
[data-ui="board"] #lobby .b-fi-acts small{font-size:var(--b-t-13);font-weight:600;color:var(--b-text-2)}
[data-ui="board"] #lobby .b-fi-act{min-height:var(--b-tap);padding:0 var(--b-s4);border-radius:var(--b-r-pill);border:1px solid var(--b-hair-gold);background:var(--b-gold-fill);color:var(--b-gold-text);font-size:var(--b-t-14);font-weight:600}
[data-ui="board"] #lobby .b-fi-act:active,[data-ui="board"] #lobby .b-fchip:active{transform:scale(var(--b-press-scale))}
[data-ui="board"] #lobby .b-fi-opp .b-feed-row{padding-bottom:4px}

/* ---------- the Poker tab (owner instruction, Issue #32, 2026-10-24: the filed lobby reference's form) ----------
   Section heads in small gold capitals; "Active tables tonight": one large card per game, the game-object art on the
   left (cards and chips on the felt; dominoes on the rail), its state and the count on the right, the one gold action
   across the foot. Then this week's leaderboard: rank, picture, name with the member's line, points. Every tap 44+. */
[data-ui="board"] #lobby .b-tables,[data-ui="board"] #lobby .b-lb,[data-ui="board"] #lobby .b-mine{display:grid;gap:var(--b-s3);min-width:0}
[data-ui="board"] #lobby .b-psec-h{font-family:var(--b-font) !important;font-size:var(--b-t-13) !important;font-weight:700 !important;letter-spacing:.1em;text-transform:uppercase;color:var(--b-gold-text) !important;flex-wrap:wrap;column-gap:6px !important}
[data-ui="board"] #lobby .b-psec-h span{letter-spacing:.06em;color:var(--b-text-2)}
[data-ui="board"] #lobby .b-tcard{display:grid;grid-template-columns:96px minmax(0,1fr);gap:var(--b-s3) var(--b-s4);min-width:0;padding:var(--b-s4);background:var(--b-lux-card);border:1px solid var(--b-hair-gold);border-radius:var(--b-r-hero);box-shadow:var(--b-lux-depth)}
[data-ui="board"] #lobby .b-tcard-art{display:grid;place-items:center;min-height:128px;border-radius:var(--b-r-card);overflow:hidden;border:1px solid var(--b-rail-hi);
  background:radial-gradient(ellipse 80% 70% at 50% 40%,var(--b-felt-hi) 0%,var(--b-felt) 50%,var(--b-felt-edge) 100%);box-shadow:inset 0 0 22px var(--b-shadow)}
[data-ui="board"] #lobby .b-tcard-art.dom{background:radial-gradient(ellipse 80% 70% at 50% 35%,var(--b-rail-top) 0%,var(--b-rail) 60%,var(--b-bg) 100%)}
[data-ui="board"] #lobby .b-tart{width:88px;height:110px}
[data-ui="board"] #lobby .b-tart-card rect{fill:var(--b-text);stroke:var(--b-hair-gold)}
[data-ui="board"] #lobby .b-tart-card text{font:700 12px/1 var(--b-font);fill:var(--b-bg)}
[data-ui="board"] #lobby .b-tart-blk{fill:var(--b-bg)}
[data-ui="board"] #lobby .b-tart-red{fill:var(--b-fold-top)}
[data-ui="board"] #lobby .b-tart-chips ellipse{fill:var(--b-gold);stroke:var(--b-raise-label);stroke-width:1;stroke-dasharray:3 4}
[data-ui="board"] #lobby .b-tart-chips .b-tart-chip2{fill:var(--b-fold-top);stroke:var(--b-text)}
[data-ui="board"] #lobby .b-tart-tile rect{fill:var(--b-text);stroke:var(--b-gold)}
[data-ui="board"] #lobby .b-tart-tile path{stroke:var(--b-bg);stroke-width:1.5}
[data-ui="board"] #lobby .b-tart-tile circle{fill:var(--b-bg)}
[data-ui="board"] #lobby .b-tcard-main{display:grid;align-content:center;gap:var(--b-s1);min-width:0}
[data-ui="board"] #lobby .b-tcard-foot{grid-column:1 / -1;display:grid;gap:var(--b-s3);min-width:0}
[data-ui="board"] #lobby .b-tcard h3{margin:0;font-size:var(--b-t-20);font-weight:700;line-height:1.2;color:var(--b-text);overflow-wrap:anywhere}
[data-ui="board"] #lobby .b-tcard-count{display:flex;flex-wrap:wrap;align-items:baseline;column-gap:6px;margin:2px 0 0}
[data-ui="board"] #lobby .b-tcard-count b{font-size:var(--b-t-28);font-weight:700;line-height:1.1;color:var(--b-gold-text);font-variant-numeric:tabular-nums}
[data-ui="board"] #lobby .b-tcard-count small{font-size:var(--b-t-14);font-weight:600;color:var(--b-text)}
[data-ui="board"] #lobby .b-hero-acts .btn.b-gold:only-child,[data-ui="board"] #lobby .b-hero-acts .btn.b-gold:first-child:not(:only-child){flex-basis:100%}
[data-ui="board"] #lobby .b-hero-acts .btn.b-gold{min-height:56px;font-size:var(--b-t-17);font-weight:700;box-shadow:0 8px 20px var(--b-shadow),inset 0 1px 0 var(--b-btn-hi)}
/* Tournament leaderboard (this week) */
[data-ui="board"] #lobby .b-lb-list{display:flex;flex-direction:column;background:var(--b-surface);border:1px solid var(--b-hair);border-radius:var(--b-r-card);overflow:hidden}
[data-ui="board"] #lobby .b-lb-row{display:grid;grid-template-columns:28px 44px minmax(0,1fr) auto;align-items:center;gap:var(--b-s3);min-height:68px;width:100%;padding:var(--b-s2) var(--b-s4);background:transparent;border:0;color:var(--b-text);text-align:left;font:inherit}
[data-ui="board"] #lobby .b-lb-row+.b-lb-row{border-top:1px solid var(--b-hair)}
[data-ui="board"] #lobby .b-lb-row.me{background:var(--b-gold-fill)}
[data-ui="board"] #lobby .b-lb-row:active{background:var(--b-surface-2)}
[data-ui="board"] #lobby .b-lb-row:focus-visible{outline:2px solid var(--b-gold);outline-offset:-2px}
[data-ui="board"] #lobby .b-lb-rk{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--b-surface-2);color:var(--b-text-2);font-size:var(--b-t-13);font-weight:700;font-variant-numeric:tabular-nums}
[data-ui="board"] #lobby .b-lb-rk.r1{background:var(--b-raise);color:var(--b-raise-label)}
[data-ui="board"] #lobby .b-lb-rk.r2{background:var(--b-lb-silver);color:var(--b-bg)}
[data-ui="board"] #lobby .b-lb-rk.r3{background:var(--b-lb-bronze);color:var(--b-bg)}
[data-ui="board"] #lobby .b-lb-row .av.b-lb-av{width:44px;height:44px;font-size:15px;border:2px solid var(--b-ring)}
[data-ui="board"] #lobby .b-lb-t{display:grid;gap:2px;min-width:0}
[data-ui="board"] #lobby .b-lb-t b{font-size:var(--b-t-15);font-weight:600;overflow-wrap:anywhere}
[data-ui="board"] #lobby .b-lb-you{font-size:var(--b-t-11);font-weight:600;color:var(--b-gold-text);letter-spacing:.04em;text-transform:uppercase}
[data-ui="board"] #lobby .b-lb-pro{font-size:var(--b-t-13);color:var(--b-text-2);line-height:1.3;overflow:hidden;overflow-wrap:anywhere;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2}
[data-ui="board"] #lobby .b-lb-pts{display:grid;justify-items:end;gap:0}
[data-ui="board"] #lobby .b-lb-pts b{font-size:var(--b-t-17);font-weight:700;color:var(--b-gold-text);font-variant-numeric:tabular-nums}
[data-ui="board"] #lobby .b-lb-pts small{font-size:var(--b-t-11);color:var(--b-text-2)}
[data-ui="board"] #lobby .b-hero-k{display:inline-flex;align-items:center;gap:6px;font-size:var(--b-t-11);font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--b-text-2)}
[data-ui="board"] #lobby .b-hero-k.live{color:var(--b-text)}
[data-ui="board"] #lobby .b-hero-prize{margin:0;font-size:var(--b-t-17);font-weight:700;line-height:1.2;color:var(--b-gold-text);font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
[data-ui="board"] #lobby .b-hero-sp{display:flex;align-items:center;gap:var(--b-s3);min-height:var(--b-tap);padding:var(--b-s2) var(--b-s3);margin:0;width:100%;border-radius:var(--b-r-btn);background:var(--b-surface);border:1px solid var(--b-hair);color:var(--b-text);text-align:left}
[data-ui="board"] #lobby .b-hero-logo{flex:none;display:grid;place-items:center;width:28px;height:28px;border-radius:var(--b-r-chip);overflow:hidden}
[data-ui="board"] #lobby .b-hero-logo>*{width:28px !important;height:28px !important;min-width:0;font-size:12px;border-radius:var(--b-r-chip)}
[data-ui="board"] #lobby .b-hero-sp-t{flex:1;min-width:0;display:grid;gap:1px}
[data-ui="board"] #lobby .b-hero-sp-t small{font-size:var(--b-t-11);font-weight:500;color:var(--b-text-2)}
[data-ui="board"] #lobby .b-hero-sp-t b{font-size:var(--b-t-15);font-weight:600;overflow-wrap:anywhere}
[data-ui="board"] #lobby .b-hero-meta{margin:0;font-size:var(--b-t-13);font-weight:600;color:var(--b-text-2);font-variant-numeric:tabular-nums}
[data-ui="board"] #lobby .b-hero-acts{display:flex;flex-wrap:wrap;align-items:center;gap:var(--b-s2)}
[data-ui="board"] #lobby .b-hero-acts .btn{flex:1 1 140px;min-width:0;min-height:52px;margin:0;border-radius:var(--b-r-btn);font-size:var(--b-t-17);font-weight:600}
[data-ui="board"] #lobby .btn.b-gold{background:var(--b-raise);border:0;color:var(--b-raise-label)}
[data-ui="board"] #lobby .btn.b-gold:active{transform:scale(var(--b-press-scale))}
[data-ui="board"] #lobby .b-hero-reg{flex:1;display:inline-flex;align-items:center;gap:6px;min-height:52px;font-size:var(--b-t-17);font-weight:600;color:var(--b-online)}
[data-ui="board"] #lobby .b-hero-reg .b-ic{width:20px;height:20px;stroke-width:2.4}
[data-ui="board"] #lobby .b-textbtn{min-height:var(--b-tap);padding:0 var(--b-s3);border:0;background:transparent;color:var(--b-text-2);font-size:var(--b-t-15);font-weight:600;text-decoration:underline;text-underline-offset:3px}
[data-ui="board"] #lobby .b-textbtn:focus-visible,[data-ui="board"] #lobby .b-hero-sp:focus-visible,[data-ui="board"] #lobby .b-hero-more summary:focus-visible{outline:2px solid var(--b-gold);outline-offset:2px}
[data-ui="board"] #lobby .b-hero-note{margin:0;font-size:var(--b-t-14);color:var(--b-text-2)}
[data-ui="board"] #lobby .b-tcard .btn-row{margin:0}
[data-ui="board"] #lobby .b-hero-more{display:block;border-top:1px solid var(--b-hair);padding-top:var(--b-s1)}
[data-ui="board"] #lobby .b-hero-more summary{display:flex;align-items:center;min-height:var(--b-tap);font-size:var(--b-t-15);font-weight:600;color:var(--b-gold-text);cursor:pointer}
[data-ui="board"] #lobby .b-hero-more[open]>summary{margin-bottom:var(--b-s2)}
[data-ui="board"] #lobby .b-hero-more>:not(summary)+:not(summary){margin-top:var(--b-s3)}
[data-ui="board"] #lobby .b-tcard .kv{background:var(--b-surface);border:1px solid var(--b-hair);border-radius:var(--b-r-btn);padding:10px 12px}
/* my results: place, name, when and the points */
[data-ui="board"] #lobby .b-trow-ic{flex:none;display:grid;place-items:center;width:36px;height:36px;border-radius:var(--b-r-btn);background:var(--b-gold-fill);color:var(--b-gold)}
[data-ui="board"] #lobby .b-trow-ic .b-ic{width:20px;height:20px}
[data-ui="board"] #lobby .b-trow-ic.b-place{font-size:var(--b-t-15);font-weight:700;font-variant-numeric:tabular-nums}
[data-ui="board"] #lobby .b-trow .b-row-t b{overflow-wrap:anywhere}
[data-ui="board"] #lobby .b-pempty h3{margin:0;font-size:var(--b-t-17);font-weight:600;color:var(--b-text)}
[data-ui="board"] #lobby .b-pempty p{margin:0}
@media (prefers-reduced-motion: reduce){[data-ui="board"] #lobby .btn.b-gold:active{transform:none}}

/* ---------- B7: the player profile sheet (§8, the board's "Player Profile (Optional)") ----------
   Over every screen (a seat, or a picture on Home and the lists): the picture 64 with its presence dot, the name and
   the chips at the table, "View Profile"; About | Business and the gold Send Connection Request only where the member
   turned them on (the server leaves the rest out). No backdrop blur (it can open at the table). Every tap 44 or more. */
[data-ui="board"].b-psheet-open body{overflow:hidden}
[data-ui="board"] .b-psheet{position:fixed;inset:0;z-index:55;display:flex;align-items:flex-end;justify-content:center;background:var(--b-scrim);font-family:var(--b-font);color:var(--b-text)}
[data-ui="board"] .b-psheet[hidden]{display:none}
[data-ui="board"] .b-psheet .bp-in{width:100%;max-width:560px;box-sizing:border-box;display:grid;gap:var(--b-s3);padding:var(--b-s4) var(--b-s4) calc(var(--b-s3) + var(--sa-b,0px));background:var(--b-surface-2);border-top:1px solid var(--b-hair-gold);border-radius:var(--b-r-sheet) var(--b-r-sheet) 0 0;
  max-height:min(92dvh,100%);overflow-y:auto;overscroll-behavior:contain;animation:b-up var(--b-sheet-dur) var(--b-sheet-ease) both}
[data-ui="board"] .b-psheet .bp-in>*{min-width:0}
[data-ui="board"] .b-psheet .bp-head{display:grid;grid-template-columns:64px minmax(0,1fr) auto;align-items:center;gap:var(--b-s3)}
[data-ui="board"] .b-psheet .bp-avw{position:relative;width:64px;height:64px}
[data-ui="board"] .b-psheet .bp-av{width:64px;height:64px;box-sizing:border-box;border:2px solid var(--b-ring);background:radial-gradient(circle at 34% 28%,var(--b-av-hi),transparent 60%),var(--b-surface);color:var(--b-text);font-size:var(--b-t-20);font-weight:600;box-shadow:none;overflow:hidden}
[data-ui="board"] .b-psheet .bp-av .emo{font-size:30px}
[data-ui="board"] .b-psheet .bp-dot{position:absolute;left:4px;bottom:5px;width:12px;height:12px;border-radius:50%;background:var(--b-online);box-shadow:0 0 0 2px var(--b-surface-2);z-index:3}
[data-ui="board"] .b-psheet .bp-dot.away{background:var(--b-away)}
[data-ui="board"] .b-psheet .bp-dot.dc{background:var(--b-warn)}
[data-ui="board"] .b-psheet .bp-id{display:grid;gap:2px;min-width:0}
[data-ui="board"] .b-psheet .bp-id h2{margin:0;font-size:var(--b-t-20);font-weight:600;line-height:1.2;overflow-wrap:anywhere;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
[data-ui="board"] .b-psheet .bp-chips{font-size:var(--b-t-13);font-weight:600;color:var(--b-gold-text);font-variant-numeric:tabular-nums}
[data-ui="board"] .b-psheet .bp-view{min-height:var(--b-tap);padding:0 var(--b-s3);border-radius:var(--b-r-pill);border:1px solid var(--b-hair-gold);background:transparent;color:var(--b-gold-text);font:600 var(--b-t-13)/1 var(--b-font);white-space:nowrap}
[data-ui="board"] .b-psheet .bp-seg{display:grid;grid-template-columns:1fr 1fr;gap:4px;padding:4px;border-radius:var(--b-r-btn);background:var(--b-bg)}
[data-ui="board"] .b-psheet .bp-seg button{min-height:var(--b-tap);border:0;border-radius:var(--b-r-chip);background:transparent;color:var(--b-text-2);font:600 var(--b-t-15)/1 var(--b-font)}
[data-ui="board"] .b-psheet .bp-seg button[aria-selected="true"]{background:var(--b-gold-fill);color:var(--b-gold-text);box-shadow:inset 0 0 0 1px var(--b-hair-gold)}
[data-ui="board"] .b-psheet .bp-pane{display:grid;gap:var(--b-s2)}
[data-ui="board"] .b-psheet .bp-kv{display:grid;gap:2px;padding:var(--b-s2) var(--b-s3);border-radius:var(--b-r-btn);background:var(--b-surface);border:1px solid var(--b-hair)}
[data-ui="board"] .b-psheet .bp-kv small{font-size:var(--b-t-11);font-weight:500;color:var(--b-text-2);letter-spacing:.04em;text-transform:uppercase}
[data-ui="board"] .b-psheet .bp-kv b{font-size:var(--b-t-15);font-weight:600;overflow-wrap:anywhere}
[data-ui="board"] .b-psheet .bp-club{display:grid;gap:var(--b-s2);padding:var(--b-s2) var(--b-s3) var(--b-s3);border-radius:var(--b-r-btn);background:var(--b-surface);border:1px solid var(--b-hair)}
[data-ui="board"] .b-psheet .bp-club small{font-size:var(--b-t-11);font-weight:500;color:var(--b-text-2);letter-spacing:.04em;text-transform:uppercase}
[data-ui="board"] .b-psheet .bp-club b{font-size:var(--b-t-15);font-weight:600;overflow-wrap:anywhere}
[data-ui="board"] .b-psheet .bp-club a.bp-btn{display:flex;align-items:center;justify-content:center;text-decoration:none}
[data-ui="board"] .b-psheet .bp-open{display:flex;align-items:center;gap:var(--b-s2);min-height:var(--b-tap);font-size:var(--b-t-15);font-weight:600}
[data-ui="board"] .b-psheet .bp-open i{width:10px;height:10px;border-radius:50%;background:var(--b-online);flex:none}
[data-ui="board"] .b-psheet .bp-note{margin:0;font-size:var(--b-t-14);color:var(--b-text-2);line-height:1.4}
[data-ui="board"] .b-psheet .bp-btn{width:100%;min-height:52px;border-radius:var(--b-r-btn);border:1px solid var(--b-hair);background:var(--b-surface);color:var(--b-text);font:600 var(--b-t-15)/1.2 var(--b-font)}
[data-ui="board"] .b-psheet .bp-btn.bp-gold{background:var(--b-raise);border:0;color:var(--b-raise-label);font-size:var(--b-t-17)}
[data-ui="board"] .b-psheet .bp-btn.bp-done{background:transparent;min-height:var(--b-tap)}
[data-ui="board"] .b-psheet .bp-btn:active,[data-ui="board"] .b-psheet .bp-view:active{transform:scale(var(--b-press-scale))}
[data-ui="board"] .b-psheet .bp-btn:disabled{opacity:.6}
[data-ui="board"] .b-psheet .bp-foot{display:block;margin-top:calc(var(--b-s2) * -1);text-align:center;font-size:var(--b-t-11);font-weight:500;color:var(--b-text-2)}
[data-ui="board"] .b-psheet .bp-state{display:grid;gap:var(--b-s1);padding:var(--b-s2) var(--b-s3);border-radius:var(--b-r-btn);background:var(--b-surface);border:1px solid var(--b-hair)}
[data-ui="board"] .b-psheet .bp-state>b{font-size:var(--b-t-15);font-weight:600;color:var(--b-gold-text);min-height:24px;display:flex;align-items:center}
[data-ui="board"] :is(.b-psheet,.modal) .bp-text{min-height:var(--b-tap);padding:0;border:0;background:transparent;color:var(--b-text-2);font:600 var(--b-t-14)/1 var(--b-font);text-decoration:underline;text-underline-offset:3px;justify-self:start}
[data-ui="board"] :is(.b-psheet,.modal) .bp-shared{display:grid;gap:2px}
[data-ui="board"] :is(.b-psheet,.modal) .bp-shared p{margin:0;font-size:var(--b-t-14);color:var(--b-text-2)}
[data-ui="board"] :is(.b-psheet,.modal) .bp-link{display:flex;align-items:center;min-height:var(--b-tap);color:var(--b-gold-text);font-size:var(--b-t-15);font-weight:600;overflow-wrap:anywhere}
/* the Business segment: the member's Exchange card, compact */
[data-ui="board"] .b-psheet .bz-sheet{display:grid;gap:var(--b-s2);padding:var(--b-s3);border-radius:var(--b-r-card);background:var(--b-surface);border:1px solid var(--b-hair-gold)}
[data-ui="board"] .b-psheet .bz-sheet-h{display:grid;grid-template-columns:44px minmax(0,1fr);gap:var(--b-s3);align-items:center}
[data-ui="board"] .b-psheet .bz-sheet-logo{width:44px;height:44px;border-radius:var(--b-r-btn);overflow:hidden;display:grid;place-items:center;font-size:var(--b-t-15);font-weight:700}
[data-ui="board"] .b-psheet .bz-sheet-logo img{width:100%;height:100%;object-fit:cover}
[data-ui="board"] .b-psheet .bz-sheet-t{display:grid;gap:2px;min-width:0}
[data-ui="board"] .b-psheet .bz-sheet-t b{font-size:var(--b-t-15);font-weight:600;overflow-wrap:anywhere}
[data-ui="board"] .b-psheet .bz-sheet-t small{font-size:var(--b-t-13);color:var(--b-text-2);overflow-wrap:anywhere}
[data-ui="board"] .b-psheet .bz-sheet-d{margin:0;font-size:var(--b-t-14);line-height:1.4;color:var(--b-text-2);overflow-wrap:anywhere}
[data-ui="board"] .b-psheet .bz-sheet-acts{display:flex;flex-wrap:wrap;gap:var(--b-s2)}
[data-ui="board"] .b-psheet .bz-sheet-acts .bz-act{display:inline-flex;align-items:center;gap:6px;min-height:var(--b-tap);max-width:100%;box-sizing:border-box;padding:0 var(--b-s3);border-radius:var(--b-r-pill);border:1px solid var(--b-hair);color:var(--b-text);font-size:var(--b-t-14);font-weight:600;text-decoration:none;overflow-wrap:anywhere}
[data-ui="board"] .b-psheet .bz-sheet-acts .bz-act svg{width:18px;height:18px;flex:none}
[data-ui="board"] .b-psheet :is(button,a):focus-visible{outline:2px solid var(--b-gold);outline-offset:2px}
/* Profile, "What members see" and "Connection requests" (in the app's dialog) */
[data-ui="board"] .modal .bp-prefs,[data-ui="board"] .modal .bp-conns{display:grid;gap:var(--b-s3);text-align:left}
[data-ui="board"] .modal :is(.bp-prefs,.bp-conns) h2{margin:0}
[data-ui="board"] .modal .bp-prefs>p{margin:0;font-size:var(--b-t-14);color:var(--b-text-2)}
[data-ui="board"] .modal .bp-tog{display:grid;grid-template-columns:24px minmax(0,1fr);gap:var(--b-s3);align-items:start;min-height:var(--b-tap);padding:var(--b-s2) 0;cursor:pointer}
[data-ui="board"] .modal .bp-tog input{width:24px;height:24px;margin:2px 0 0;accent-color:var(--b-gold)}
[data-ui="board"] .modal .bp-tog span{display:grid;gap:2px}
[data-ui="board"] .modal .bp-tog b{font-size:var(--b-t-15);font-weight:600}
[data-ui="board"] .modal .bp-tog small{font-size:var(--b-t-13);color:var(--b-text-2);line-height:1.35}
[data-ui="board"] .modal .bp-fields{display:grid;gap:var(--b-s2);padding-left:36px}
[data-ui="board"] .modal .bp-fields label{display:grid;gap:4px;font-size:var(--b-t-13);color:var(--b-text-2)}
[data-ui="board"] .modal .bp-fields input{min-height:var(--b-tap);box-sizing:border-box;width:100%;padding:0 var(--b-s3);border-radius:var(--b-r-btn);border:1px solid var(--b-hair);background:var(--b-bg);color:var(--b-text);font:400 16px/1.2 var(--b-font)}
[data-ui="board"] .modal .bp-creq{display:grid;gap:4px;padding:var(--b-s3);border-radius:var(--b-r-btn);background:var(--b-surface);border:1px solid var(--b-hair)}
[data-ui="board"] .modal .bp-creq>b{font-size:var(--b-t-15)}
[data-ui="board"] .modal .bp-creq>small{font-size:var(--b-t-13);color:var(--b-text-2)}
[data-ui="board"] .modal .bp-cacts{display:flex;gap:var(--b-s2);margin-top:4px}
[data-ui="board"] .modal .bp-cacts button{flex:1;min-height:var(--b-tap)}
/* a new connection request's notice (never during your turn) */
[data-ui="board"] .b-cnote{position:fixed;z-index:70;left:var(--b-s4);right:var(--b-s4);top:calc(var(--b-s2) + env(safe-area-inset-top,0px));max-width:520px;margin:0 auto;display:flex;align-items:center;gap:var(--b-s1);padding:2px 2px 2px var(--b-s4);box-sizing:border-box;
  background:var(--b-surface-2);border:1px solid var(--b-hair-gold);border-radius:var(--b-r-card);box-shadow:0 8px 24px var(--b-shadow);color:var(--b-text);font-family:var(--b-font)}
[data-ui="board"] .b-cnote[hidden]{display:none}
[data-ui="board"] .b-cnote-t{flex:1;min-width:0;font-size:var(--b-t-14);line-height:1.3;padding:var(--b-s2) 0}
[data-ui="board"] .b-cnote-v{min-height:var(--b-tap);padding:0 var(--b-s3);border:0;border-radius:var(--b-r-btn);background:var(--b-gold-fill);color:var(--b-gold-text);font:600 var(--b-t-14)/1 var(--b-font)}
[data-ui="board"] .b-cnote-x{display:grid;place-items:center;width:var(--b-tap);height:var(--b-tap);border:0;background:transparent;color:var(--b-text-2)}
[data-ui="board"] .b-cnote-x .b-ic{width:18px;height:18px}
/* a member's photo at a seat and in the lists: shown from the blob once it has come (initials until then) */
[data-ui="board"] .av img[data-avk][hidden]{display:none}
@media (prefers-reduced-motion: reduce){[data-ui="board"] .b-psheet :is(.bp-btn,.bp-view):active{transform:none}}

/* ======================================================================================================================
   B8: the motion and accessibility pass (spec §2.3, §10). Measured in Chromium by test/ui/t_board_a11y.js: every text on
   every board screen against what is drawn under it, at least 4.5:1 (3:1 large), and nothing that moves under
   prefers-reduced-motion. Tokens only: no new colour.
   ====================================================================================================================== */
/* a seat's status word (Raise, Call, Away) stays over the chips in front of it: sideways a bet's chips could cover the
   word's last letters (844x390, "RA" then the chip) */
[data-ui="board"] #game #seats .seat.b-seat:not(.hero){z-index:7}
/* the count on Live (a red badge): white on --b-live measured 3.9:1; the deeper red of Fold carries white at 5.9:1 */
[data-ui="board"] #lobby .b-seg-n{background:var(--b-fold-top)}
/* initials discs in the tabs to the table's standard (§3.3, Muse condition 1): navy with the champagne ring, not a
   bright hashed colour (white on some of those measured 3.7:1); a photo covers the disc as before */
[data-ui="board"] #lobby .av:not(.b-av){background:var(--b-surface-2);color:var(--b-text);border-color:var(--b-ring)}
/* a tier's name in its pill: the tier's colour lifted toward the text colour (the "New" grey measured 2.8:1) */
[data-ui="board"] .tier-pill{color:color-mix(in oklab,var(--tc),var(--b-text) 50%)}
/* the Exchange search's hint text */
[data-ui="board"] #lobby .bz-search::placeholder{color:var(--b-text-2);opacity:1}
/* reduced motion (§2.3: no scale, no slide, fades only, none longer than 150 ms). Already still before B8: the deal,
   the flop's turn, the chips in, the winner's chips (app.js reducedMotion: they are placed, not flown), the sheets
   (--b-sheet-dur 0), confetti, the presses, the pulsing dots, the sponsor's slide-in and sheen. Here the rest that
   t_board_a11y found moving: the time bars glide between ticks (they step instead, five times a second), a chat bubble
   grows in (a fade instead), the winner's word pops in, and the bubble and the winner's chips fade out over 400 ms */
@keyframes b-fade{from{opacity:0}}
@media (prefers-reduced-motion:reduce){
  [data-ui="board"] #game :is(.shot i,.turnbar i){transition:none}
  [data-ui="board"] #game .bubble{animation:b-fade .15s ease-out,bubOut .15s ease-in 4.35s forwards}
  [data-ui="board"] #game #seats .badge.won{animation:none}
  [data-ui="board"] #game .winpile{transition-duration:.15s}
}
/* another player's seat is a button (B8, reachable from the keyboard): its focus ring round the avatar */
[data-ui="board"] #game #seats .seat.b-seat:focus{outline:none}
[data-ui="board"] #game #seats .seat.b-seat:focus-visible .av{outline:2px solid var(--b-gold);outline-offset:3px}
/* the slim header's buttons (sideways 30 tall, upright 32 over the watching count) reach 44 for a finger, as the
   header card already does: an invisible strip above and below, the drawn pill unchanged */
[data-ui="board"] #game.land .b-top :is(#lobbyBtn,#chatBtn),[data-ui="board"] #game.row1:not(.land) .b-top-r:has(.b-watch:not([hidden])) #lobbyBtn{position:relative}
[data-ui="board"] #game.land .b-top :is(#lobbyBtn,#chatBtn)::after,[data-ui="board"] #game.row1:not(.land) .b-top-r:has(.b-watch:not([hidden])) #lobbyBtn::after{content:"";position:absolute;left:0;right:0;top:50%;height:44px;margin-top:-22px}
/* (the header card sideways: its strip reaches from the screen's top edge to 44 px, a little over the table's empty
   top margin, so it is a 44 px target on the screen itself, not partly above it) */
[data-ui="board"] #game.land .b-hud::after{top:-2px;bottom:-12px}

/* ---------- B8: the D class (§3.1), a tablet or a computer, 900 px wide or more (#game.b-d, data-bcls="D") ----------
   The table leaves the phone column: the table area takes the screen's width and the wide table sits centred in it
   (app.js boardGeo); the header card and the dock stay one centred column the width of the table and its seats.
   Seats a size up: avatar 44, name 15, stack 14. */
[data-ui="board"] .app:has(>#game.b-d:not([hidden])){max-width:none}
[data-ui="board"] #game.b-d>:is(.b-top,.dock){width:100%;max-width:820px;margin-left:auto;margin-right:auto;box-sizing:border-box}
[data-ui="board"] #game .table-area[data-bcls="D"] #seats .seat.b-seat .nm{font-size:var(--b-t-15)}
[data-ui="board"] #game .table-area[data-bcls="D"] #seats .seat.b-seat .st{font-size:var(--b-t-14)}

/* ======================================================================================================================
   The luxury Home (Issue #32, the Oct 29 board): a private members' club. The Next game is a rich card with the night's
   sponsor on a dark and gold media panel; "The club" keeps a 16:9 frame for the real welcome video (until then: the
   night's host, a real member); the activity rows lead with a large round picture or logo. Headings in the serif display
   face; restrained gold, more air, fewer borders. Tokens only: no new colour. Every slot without real media still ends
   in a finished state: a logo alone on the panel, the host's initials, a row's quiet gradient.
   ====================================================================================================================== */
/* the serif face: headings only */
[data-ui="board"] #lobby :is(.b-next h3,.b-sec-head h2,.hsec-head h2,.b-club-host b,.b-next-media-t b,.b-win-t b,.b-club-zero>span){font-family:var(--b-serif);letter-spacing:.005em;font-variant-numeric:lining-nums}
[data-ui="board"] #lobby .b-sec-head h2,[data-ui="board"] #lobby .hsec-head h2{font-size:var(--b-t-22);font-weight:600;line-height:1.15}
/* (more air between Home's sections; by day the club comes first, so the air goes under it, above the Next game) */
[data-ui="board"] #lobby #lobbyBody>:is(.b-club,.b-feed,.hsec-biz):not(:first-child),[data-ui="board"] #lobby #lobbyBody>.b-club+.b-next{margin-top:var(--b-s3)}

/* ---- the Next game ---- */
[data-ui="board"] #lobby .b-next{position:relative;gap:var(--b-s2);padding:var(--b-s5);overflow:hidden;border:1px solid var(--b-hair-gold);border-radius:var(--b-r-hero);
  background:var(--b-lux-card);box-shadow:var(--b-lux-depth)}
[data-ui="board"] #lobby .b-next-main{display:grid;gap:var(--b-s2);min-width:0}
[data-ui="board"] #lobby .b-next .eyebrow{display:inline-flex;align-items:center;gap:6px;font-size:var(--b-t-11);font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--b-gold-text)}
[data-ui="board"] #lobby .b-next .eyebrow .b-ic{width:16px;height:16px;color:var(--b-gold)}
[data-ui="board"] #lobby .b-next h3{margin:2px 0 0;font-size:30px;font-weight:600;line-height:1.08;color:var(--b-text);overflow-wrap:anywhere;text-wrap:balance}
[data-ui="board"] #lobby .b-next .b-next-when{font-size:var(--b-t-15);color:var(--b-text)}
[data-ui="board"] #lobby .b-next .b-next-reg{display:inline-flex;justify-self:start;align-items:center;gap:6px;padding:4px 12px 4px 8px;border-radius:var(--b-r-pill);background:var(--b-gold-fill)}
[data-ui="board"] #lobby .b-next-prize{display:flex;align-items:flex-start;gap:var(--b-s2);padding-top:var(--b-s1);color:var(--b-text-2);font-size:var(--b-t-14)}
[data-ui="board"] #lobby .b-next-prize .b-ic{width:20px;height:20px;color:var(--b-gold);margin-top:-1px}
[data-ui="board"] #lobby .b-next-prize b{color:var(--b-gold-text);font-weight:600}
[data-ui="board"] #lobby .b-next .btn-row{margin-top:var(--b-s2)}
/* the media panel: the sponsor's logo on the dark and gold ground; on a phone a band across the top, beside the text
   from 600 wide. (.has-cover: a real cover photo under the logo, when a sponsor ever has one) */
[data-ui="board"] #lobby .b-next-media{position:relative;display:flex;align-items:center;gap:var(--b-s4);min-height:96px;margin:var(--b-s2) calc(-1 * var(--b-s5)) calc(-1 * var(--b-s5));
  padding:var(--b-s4) var(--b-s5);border:0;border-top:1px solid var(--b-gold-line);border-radius:0;background:var(--b-lux-panel);color:var(--b-text);text-align:left;font:inherit;width:auto;overflow:hidden}
[data-ui="board"] #lobby button.b-next-media{cursor:pointer}
[data-ui="board"] #lobby .b-next-media:focus-visible{outline:2px solid var(--b-gold);outline-offset:-4px}
[data-ui="board"] #lobby .b-next-cover{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.32}
[data-ui="board"] #lobby .b-next-logo{position:relative;flex:none;display:grid;place-items:center;width:64px;height:64px;border-radius:50%;overflow:hidden;box-shadow:0 0 0 1px var(--b-hair-gold),0 0 0 5px var(--b-gold-fill)}
[data-ui="board"] #lobby .b-next-logo>*{width:64px !important;height:64px !important;min-width:0;font-size:22px;border-radius:50%}
[data-ui="board"] #lobby .b-next-logo img{width:100%;height:100%;object-fit:cover}
[data-ui="board"] #lobby .b-next-media-t{position:relative;display:grid;gap:2px;min-width:0}
[data-ui="board"] #lobby .b-next-media-t small{font-size:var(--b-t-11);font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--b-gold-text)}
[data-ui="board"] #lobby .b-next-media-t b{font-size:var(--b-t-22);font-weight:600;line-height:1.1;overflow-wrap:anywhere}
[data-ui="board"] #lobby .b-next-media-t .b-next-media-c{font-size:var(--b-t-13);font-weight:500;letter-spacing:0;text-transform:none;color:var(--b-text-2)}
@media (min-width:600px){
  [data-ui="board"] #lobby .b-next.has-media{grid-template-columns:minmax(0,1fr) minmax(168px,36%);column-gap:var(--b-s5)}
  [data-ui="board"] #lobby .b-next.has-media .b-next-main{grid-column:1;grid-row:1}
  [data-ui="board"] #lobby .b-next.has-media .b-next-media{grid-column:2;grid-row:1;flex-direction:column;justify-content:center;text-align:center;margin:calc(-1 * var(--b-s5)) calc(-1 * var(--b-s5)) calc(-1 * var(--b-s5)) 0;
    padding:var(--b-s5) var(--b-s4);border-top:0;border-left:1px solid var(--b-gold-line)}
  [data-ui="board"] #lobby .b-next.has-media .b-next-logo,[data-ui="board"] #lobby .b-next.has-media .b-next-logo>*{width:84px !important;height:84px !important}
  [data-ui="board"] #lobby .b-next.has-media .b-next-media-t{justify-items:center}
}
/* a short screen (a phone on its side): the whole card still fits between the bars */
@media (max-height:500px){
  [data-ui="board"] #lobby .b-next{padding:var(--b-s3) var(--b-s4) 14px;gap:6px}
  [data-ui="board"] #lobby .b-next h3{font-size:var(--b-t-28);margin-top:0}
  [data-ui="board"] #lobby .b-next .b-next-reg{padding-top:2px;padding-bottom:2px}
  [data-ui="board"] #lobby .b-next .btn-row{margin-top:var(--b-s1)}
  [data-ui="board"] #lobby .b-next-media{margin:var(--b-s1) calc(-1 * var(--b-s4)) -14px}
}
@media (max-height:500px) and (min-width:600px){
  [data-ui="board"] #lobby .b-next.has-media .b-next-media{margin:calc(-1 * var(--b-s3)) calc(-1 * var(--b-s4)) -14px 0}
}

/* ---- The club: the welcome video's 16:9 frame, the host until there is a video, the zero-catch line ---- */
[data-ui="board"] #lobby .b-club{display:grid;gap:var(--b-s3);min-width:0}
[data-ui="board"] #lobby .b-club .b-sec-head{padding:0 2px}
[data-ui="board"] #lobby .b-club-frame{position:relative;aspect-ratio:16 / 9;display:flex;align-items:center;gap:var(--b-s4);padding:var(--b-s5);
  border-radius:var(--b-r-card);background:var(--b-lux-panel);border:1px solid var(--b-hair-gold);overflow:hidden;box-shadow:var(--b-lux-depth)}
/* (the frame's inner hairline, as a picture frame) */
[data-ui="board"] #lobby .b-club-frame::before{content:"";position:absolute;inset:8px;border:1px solid var(--b-gold-line);border-radius:calc(var(--b-r-card) - 6px);pointer-events:none}
/* (photo-forward: the host's face carries the frame, at 96, the photo's own 192 px on a 2x screen) */
[data-ui="board"] #lobby .b-club-frame .b-club-av{position:relative;flex:none;width:96px;height:96px;font-size:32px;border:2px solid var(--b-gold);box-shadow:0 0 0 6px var(--b-gold-fill)}
[data-ui="board"] #lobby .b-club-frame .b-club-av .tier-ic{display:none}
[data-ui="board"] #lobby .b-club-host{position:relative;display:grid;gap:4px;min-width:0}
[data-ui="board"] #lobby .b-club-host small{font-size:var(--b-t-11);font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--b-gold-text)}
[data-ui="board"] #lobby .b-club-host b{font-size:26px;font-weight:600;line-height:1.08;color:var(--b-text);overflow-wrap:anywhere}
[data-ui="board"] #lobby .b-club-line{font-size:var(--b-t-14);line-height:1.4;color:var(--b-text-2)}
[data-ui="board"] #lobby .b-club-play{position:absolute;left:50%;top:50%;width:64px;height:64px;margin:-32px 0 0 -32px;display:grid;place-items:center;padding:0;border-radius:50%;
  border:1.5px solid var(--b-gold-text);background:var(--b-veil);color:var(--b-gold-text);transition:transform var(--b-press-dur) ease-out}
[data-ui="board"] #lobby .b-club-play .b-ic{width:30px;height:30px;fill:currentColor;stroke:none;margin-left:3px}
[data-ui="board"] #lobby .b-club-play:active{transform:scale(var(--b-press-scale))}
[data-ui="board"] #lobby .b-club-play:focus-visible,[data-ui="board"] #lobby .b-club-try:focus-visible{outline:2px solid var(--b-gold);outline-offset:2px}
[data-ui="board"] #lobby .b-club-vid{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;background:var(--b-bg)}
[data-ui="board"] #lobby .b-club-zero{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:2px var(--b-s3);margin:0;padding:0 2px}
[data-ui="board"] #lobby .b-club-zero>span{flex:1 1 220px;font-size:var(--b-t-20);font-weight:600;line-height:1.2;color:var(--b-text)}
[data-ui="board"] #lobby .b-club-try{display:inline-flex;align-items:center;gap:2px;min-height:var(--b-tap);min-width:var(--b-tap);padding:0 2px;border:0;background:transparent;color:var(--b-gold-text);font-size:var(--b-t-14);font-weight:600}
[data-ui="board"] #lobby .b-club-try .b-ic{width:16px;height:16px}
@media (max-width:359px){
  [data-ui="board"] #lobby .b-next-media{min-height:76px;padding-top:var(--b-s3);padding-bottom:var(--b-s3);gap:var(--b-s3)}
  [data-ui="board"] #lobby .b-next-logo,[data-ui="board"] #lobby .b-next-logo>*{width:48px !important;height:48px !important;font-size:17px}
  [data-ui="board"] #lobby .b-next-media-t b{font-size:var(--b-t-20)}
  [data-ui="board"] #lobby .b-next h3{font-size:var(--b-t-28)}
  [data-ui="board"] #lobby .b-club-frame{padding:var(--b-s4);gap:var(--b-s3)}
  [data-ui="board"] #lobby .b-club-frame .b-club-av{width:72px;height:72px;font-size:24px}
  [data-ui="board"] #lobby .b-club-host b{font-size:var(--b-t-22)}
  [data-ui="board"] #lobby .b-club-line{font-size:var(--b-t-13)}
}

/* ---- Community activity: each row its own quiet card, a 56 round lead, an uppercase gold kicker ---- */
[data-ui="board"] #lobby .b-feed{gap:var(--b-s3)}
[data-ui="board"] #lobby .b-feed-list{gap:var(--b-s2);background:transparent;border:0;border-radius:0;overflow:visible}
[data-ui="board"] #lobby .b-feed-list>.b-fi+.b-fi{border-top:0}
[data-ui="board"] #lobby .b-feed-list>.b-fi{position:relative;border-radius:var(--b-r-card);background:var(--b-lux-row);border:1px solid var(--b-hair);overflow:hidden;box-shadow:inset 0 1px 0 var(--b-glass-hi)}
[data-ui="board"] #lobby .b-feed-row{position:relative;min-height:84px;padding:var(--b-s3) var(--b-s4);gap:14px;overflow:hidden;transition:background .15s ease-out}
[data-ui="board"] #lobby .b-feed-row>:not(.b-feed-bg){position:relative}
[data-ui="board"] #lobby .b-feed-row .av{width:56px;height:56px;font-size:18px;flex:none;border:1.5px solid var(--b-ring)}
[data-ui="board"] #lobby .b-feed-row .av .tier-ic{display:none}
[data-ui="board"] #lobby .b-feed-row .b-feed-ic,[data-ui="board"] #lobby .b-feed-logo{width:56px;height:56px;border-radius:50%}
[data-ui="board"] #lobby .b-feed-row .b-feed-ic{box-shadow:inset 0 0 0 1px var(--b-hair-gold)}
[data-ui="board"] #lobby .b-feed-row .b-feed-ic svg{width:24px;height:24px}
[data-ui="board"] #lobby .b-feed-logo{box-shadow:0 0 0 1.5px var(--b-ring);overflow:hidden}
[data-ui="board"] #lobby .b-feed-logo>*{width:56px !important;height:56px !important;font-size:18px;border-radius:50%}
[data-ui="board"] #lobby .b-feed-logo img{width:100%;height:100%;object-fit:cover}
[data-ui="board"] #lobby .b-feed-row .b-row-ic{width:24px;height:24px;margin:0 16px}
[data-ui="board"] #lobby .b-feed-row .b-feed-k{font-size:var(--b-t-11);font-weight:600;letter-spacing:.1em;color:var(--b-gold-text)}
[data-ui="board"] #lobby .b-feed-row .b-row-t{gap:3px}
[data-ui="board"] #lobby .b-feed-row .b-row-t b{font-size:var(--b-t-15);line-height:1.3}
[data-ui="board"] #lobby .b-feed-row .b-chev{color:var(--b-gold-text)}
/* the row's wide picture: a real image only (today a business's uploaded logo), quiet, fading into the row from the right */
[data-ui="board"] #lobby .b-feed-bg{position:absolute;top:0;right:0;bottom:0;width:58%;pointer-events:none;-webkit-mask-image:linear-gradient(90deg,transparent,var(--b-bg) 75%);mask-image:linear-gradient(90deg,transparent,var(--b-bg) 75%)}
[data-ui="board"] #lobby .b-feed-bg img{width:100%;height:100%;object-fit:cover;opacity:.16}
/* the Exchange still loading: a blank row holds its place */
[data-ui="board"] #lobby .b-feed-wait{pointer-events:none}
[data-ui="board"] #lobby .b-feed-wait .b-feed-ic{background:var(--b-gold-fill)}
[data-ui="board"] #lobby .b-fi-acts{padding:0 var(--b-s4) var(--b-s3) calc(var(--b-s4) + 56px + 14px)}
/* the latest result: the winner's name in the serif */
[data-ui="board"] #lobby .b-win-card{background:var(--b-lux-card);box-shadow:var(--b-lux-depth)}
[data-ui="board"] #lobby .b-win-t b{font-size:var(--b-t-22);line-height:1.15}
@media (prefers-reduced-motion:reduce){
  [data-ui="board"] #lobby :is(.b-club-play,.b-feed-row){transition:none}
  [data-ui="board"] #lobby .b-club-play:active{transform:none}
}
/* watching on the shortest phones: the "Watching Table N." words give way to the bottom seat (watchLineClear), still read out */
[data-ui="board"] #game #controls>.info-line.wl-off{opacity:0}
[data-ui="board"] #game #seats .seat.b-seat .badge.b-st.wait{color:var(--b-gold-text)}
[data-ui="board"] #lobby .b-win [data-wincard]{margin-top:var(--b-s2);width:100%}
/* the Club page's Join QR, folded to its name row (Issue #32 fix list item 2): the whole row opens it, a chevron turns */
[data-ui="board"] #lobby .qr-fold>details>summary{display:flex;align-items:center;gap:var(--b-s3);min-height:var(--b-tap);list-style:none;cursor:pointer;border-radius:var(--b-r-btn)}
[data-ui="board"] #lobby .qr-fold>details>summary::-webkit-details-marker{display:none}
[data-ui="board"] #lobby .qr-fold>details>summary:focus-visible{outline:2px solid var(--b-gold);outline-offset:4px}
[data-ui="board"] #lobby .qr-fold-h{flex:1;display:grid;gap:var(--b-s2);min-width:0}
[data-ui="board"] #lobby .qr-fold-ic{flex:none;transform:rotate(90deg);transition:transform .2s}
[data-ui="board"] #lobby .qr-fold>details[open] .qr-fold-ic{transform:rotate(-90deg)}
[data-ui="board"] #lobby .qr-fold-b{display:grid;gap:var(--b-s3);margin-top:var(--b-s3)}
@media (prefers-reduced-motion:reduce){ [data-ui="board"] #lobby .qr-fold-ic{transition:none} }

/* Next game with no game open: one slim line (Muse's Home concept, owner Oct 26) */
[data-ui="board"] #lobby .b-next.b-next-none{display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:var(--b-s3);padding:14px var(--b-s4)}
[data-ui="board"] #lobby .b-next-none-t{display:grid;gap:2px;min-width:0}
[data-ui="board"] #lobby .b-next.b-next-none h3{margin:0;font-size:var(--b-t-20)}
[data-ui="board"] #lobby .b-next-none-t small{font-size:12px;line-height:1.3;color:var(--b-text-2)}
[data-ui="board"] #lobby .b-next.b-next-none .btn{flex:none;width:auto;min-height:var(--b-tap);padding:0 14px;font-size:var(--b-t-13)}
@media (max-width:359px){ [data-ui="board"] #lobby .b-next-none-t small{display:none} }
[data-ui="board"] #lobby .b-feed-ic.photo{overflow:hidden;padding:0}
[data-ui="board"] #lobby .b-feed-ic.photo img{width:100%;height:100%;object-fit:cover;border-radius:50%;display:block}
/* the table chat on an upright phone (owner, Oct 28: with a few messages in it the open chat covered the lower half of
   the table, his own cards with it): its message list holds about two lines, newest at the bottom, so the sheet stays a
   slim strip under the player's cards; each message also shows as a bubble at its seat */
[data-ui="board"] #game:not(.land) .chat-log{max-height:56px;min-height:0}
/* (owner, Oct 28: "Notifications on" beside Add to calendar broke onto two lines on an iPhone, ON alone below) */
[data-ui="board"] #lobby .btn-row .status-pill{white-space:nowrap;letter-spacing:.05em!important;font-size:12px;padding-inline:10px;gap:6px;min-width:0}
/* the break card's sponsor, Direction A (#32, Oct 27), in the board's own tokens */
[data-ui="board"] #game .brk-pres{color:var(--b-gold-text)}
[data-ui="board"] #game .brk-name{font-family:var(--b-serif,var(--lx-serif,Georgia,serif));color:var(--b-text)}
[data-ui="board"] #game .brk-trade{color:var(--b-text-2)}
[data-ui="board"] #game .brk-perk{color:var(--b-text)}
[data-ui="board"] #game .brk-bar{background:var(--b-hair)}
[data-ui="board"] #game.land .brk-media,[data-ui="board"] #game.land .brk-perk,[data-ui="board"] #game.land .brk-trade{display:none}
[data-ui="board"] #game.land .brk-name{font-size:17px}
[data-ui="board"] #game.land .brk-go{margin-top:4px;min-height:30px;padding:6px 14px}
/* the owner's arrangement (Oct 28): a room not open here, greyed with its reason; My business's steps */
[data-ui="board"] #lobby .b-row-off{opacity:.55;cursor:default}
[data-ui="board"] #lobby .b-row-off .b-row-ic{color:var(--b-text-2)}
[data-ui="board"] #lobby [data-banchor]{scroll-margin-top:84px}
[data-ui="board"] #lobby .b-hub-steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}
[data-ui="board"] #lobby .b-hub-steps>li>*{display:grid;justify-items:center;align-content:start;gap:6px;width:100%;padding:8px 2px;background:transparent;border:0;color:var(--b-text-2);font-size:var(--b-t-12,12px);line-height:1.25;text-align:center}
[data-ui="board"] #lobby .b-hub-n{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;border:1px solid var(--b-hair);background:var(--b-surface-2);color:var(--b-text);font-weight:700;font-size:13px}
[data-ui="board"] #lobby .b-hub-steps .done .b-hub-n{background:var(--b-gold);border-color:var(--b-gold);color:var(--b-bg)}
[data-ui="board"] #lobby .b-hub-steps .next .b-hub-n{border-color:var(--b-gold);color:var(--b-gold);box-shadow:0 0 0 3px var(--b-rail-hi)}
[data-ui="board"] #lobby .b-hub-steps .next .b-hub-t{color:var(--b-gold)}
[data-ui="board"] #lobby .b-hub-steps .off{opacity:.55}
[data-ui="board"] #lobby .b-hub-steps small{font-size:11px;color:var(--b-text-2)}
[data-ui="board"] #lobby .b-hub-badge{display:inline-grid;place-items:center;min-width:20px;height:20px;padding:0 6px;margin-left:6px;border-radius:10px;background:var(--b-live);color:var(--b-text);font-size:12px;font-weight:700;vertical-align:1px}
[data-ui="board"] #lobby .b-hub-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* the page's waiting message (index.html #bootMsg, public/boot.js) sits under the shell's Blindrise mark: no ground or
   name of its own here, only the "taking longer than usual" line when it comes */
[data-ui="board"] #bootMsg{background:none;justify-content:flex-end;padding-bottom:18vh}
[data-ui="board"] #bootMsg b,[data-ui="board"] #bootMsg .boot-open{display:none}

/* club events on the Club tab (public/cevents.js): the board's navy card with the gold hairline, the title in the serif,
   the three answers as one segmented row; the member's own answer in gold */
[data-ui="board"] #lobby .cev{display:flex;flex-direction:column;gap:var(--b-s3);margin-top:var(--b-s4)}
[data-ui="board"] #lobby .cev-sub{margin:var(--b-s2) 0 0;font-size:var(--b-t-13);font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--b-gold-text)}
[data-ui="board"] #lobby .cev-card{display:flex;flex-direction:column;gap:var(--b-s1);padding:var(--b-s4);border-radius:var(--b-r-card);background:var(--b-surface);border:1px solid var(--b-hair-gold);min-width:0}
[data-ui="board"] #lobby .cev-card.is-cancelled,[data-ui="board"] #lobby .cev-card.is-declined,[data-ui="board"] #lobby .cev-card.is-past{border-color:var(--b-hair);opacity:.72}
[data-ui="board"] #lobby .cev-kick{display:flex;flex-wrap:wrap;align-items:center;gap:var(--b-s2);font-size:var(--b-t-11);font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--b-gold)}
[data-ui="board"] #lobby .cev-st{font-style:normal;letter-spacing:.04em;text-transform:none;font-size:var(--b-t-11);padding:2px var(--b-s2);border-radius:var(--b-r-pill);border:1px solid var(--b-hair);color:var(--b-text-2)}
[data-ui="board"] #lobby .cev-st-pending{border-color:var(--b-hair-gold);color:var(--b-gold-text)}
[data-ui="board"] #lobby .cev-t{margin:var(--b-s1) 0 0;font-family:var(--b-serif);font-size:var(--b-t-22);font-weight:600;line-height:1.15;color:var(--b-text);overflow-wrap:anywhere;text-wrap:balance}
[data-ui="board"] #lobby .cev-when{margin:0;font-size:var(--b-t-15);font-weight:600;color:var(--b-gold-text)}
[data-ui="board"] #lobby .cev-place,[data-ui="board"] #lobby .cev-note{margin:0;font-size:var(--b-t-14);color:var(--b-text-2);overflow-wrap:anywhere}
[data-ui="board"] #lobby .cev-note{color:var(--b-text)}
[data-ui="board"] #lobby .cev-count{margin:var(--b-s1) 0 0;font-size:var(--b-t-13);color:var(--b-text-2)}
[data-ui="board"] #lobby .cev-rs{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--b-s2);margin-top:var(--b-s2)}
[data-ui="board"] #lobby .cev-r{min-height:var(--b-tap);border-radius:var(--b-r-btn);border:1px solid var(--b-hair);background:var(--b-surface-2);color:var(--b-text);font:600 var(--b-t-14)/1 var(--b-font);cursor:pointer}
[data-ui="board"] #lobby .cev-r.on{background:var(--b-gold-fill);border-color:var(--b-gold);color:var(--b-gold-text)}
[data-ui="board"] #lobby .cev-r:disabled{opacity:.45;cursor:default}
[data-ui="board"] #lobby .cev-r:active:not(:disabled){transform:scale(var(--b-press-scale))}
[data-ui="board"] #lobby .cev-who,[data-ui="board"] #lobby .cev-past{margin-top:var(--b-s2);font-size:var(--b-t-14);color:var(--b-text-2)}
[data-ui="board"] #lobby .cev-who summary,[data-ui="board"] #lobby .cev-past summary{min-height:var(--b-tap);display:flex;align-items:center;color:var(--b-gold-text);font-weight:600;cursor:pointer}
[data-ui="board"] #lobby .cev-who p{margin:var(--b-s1) 0;overflow-wrap:anywhere}
[data-ui="board"] #lobby .cev-past{display:flex;flex-direction:column;gap:var(--b-s3)}
[data-ui="board"] #lobby .cev-btns{margin-top:var(--b-s2)}
[data-ui="board"] #lobby .cev-form{padding:var(--b-s4);border-radius:var(--b-r-card);background:var(--b-surface);border:1px solid var(--b-hair-gold)}
[data-ui="board"] #lobby .cev-fh{margin:0;font-family:var(--b-serif);font-size:var(--b-t-22);color:var(--b-text)}
[data-ui="board"] #lobby .cev-empty{margin:0}
/* the event's photo or video: whole, on the card's own navy (never cropped); the form's picker and preview */
[data-ui="board"] #lobby .cev-media{margin:calc(-1 * var(--b-s4)) calc(-1 * var(--b-s4)) var(--b-s2);border-radius:var(--b-r-card) var(--b-r-card) 0 0;overflow:hidden;background:var(--b-bg);display:flex;justify-content:center}
[data-ui="board"] #lobby .cev-media img,[data-ui="board"] #lobby .cev-media video{display:block;width:100%;max-height:420px;object-fit:contain}
[data-ui="board"] #lobby .cev-prev{display:flex;align-items:center;gap:var(--b-s3)}
[data-ui="board"] #lobby .cev-prev img{width:72px;height:72px;object-fit:cover;border-radius:var(--b-r-chip);border:1px solid var(--b-hair-gold)}
[data-ui="board"] #lobby .cev-up{margin:0;font-size:var(--b-t-13);color:var(--b-gold-text)}
/* iPhone: a date field keeps to the card's width and its height even when empty */
[data-ui="board"] #lobby .cev-form input[type="datetime-local"]{-webkit-appearance:none;appearance:none;display:block;width:100%;max-width:100%;min-width:0;box-sizing:border-box;min-height:48px;text-align:left}
[data-ui="board"] #lobby .cev-form input[type="datetime-local"]::-webkit-date-and-time-value{text-align:left}
/* the Research Lab (owner + council, Oct 29; public/research.js): its card under "Your business", and its own screen */
[data-ui="board"] #lobby .rl-entry{display:grid;gap:var(--b-s2);justify-items:start;border:1px solid var(--b-gold);background:radial-gradient(90% 120% at 0% 0%,var(--b-gold-fill),transparent 70%),var(--b-surface);margin-top:var(--b-s3)}
[data-ui="board"] .rl-k{color:var(--b-gold);letter-spacing:.2em}
[data-ui="board"] #lobby .rl-entry h3{margin:0;font-family:var(--b-serif);font-size:var(--b-t-22);font-weight:500;color:var(--b-text)}
[data-ui="board"] .rl-pill{display:inline-block;padding:4px 10px;border-radius:var(--b-r-pill);background:var(--b-gold-fill);border:1px solid var(--b-hair-gold);color:var(--b-gold-text);font-size:12px;font-weight:600}
[data-ui="board"] #lobby .rl-entry .btn{width:100%}
[data-ui="board"] #lobby .rl-entry{margin-top:0;margin-bottom:var(--b-s3)}
[data-ui="board"] #lobby .rl-entry-top{display:flex;align-items:center;gap:10px}
[data-ui="board"] #lobby .rl-bulb{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:var(--b-gold-fill);border:1px solid var(--b-hair-gold);color:var(--b-gold)}
[data-ui="board"] #lobby .rl-entry.is-ready .rl-bulb{box-shadow:0 0 0 4px color-mix(in srgb,var(--b-gold) 18%,transparent),0 0 22px color-mix(in srgb,var(--b-gold) 35%,transparent)}
[data-ui="board"] .rl-new{font-style:normal;margin-left:6px;padding:2px 8px;border-radius:var(--b-r-pill);background:var(--b-gold);color:var(--b-bg);letter-spacing:.08em;font-size:11px}
[data-ui="board"] #lobby .rl-today{margin:0;color:var(--b-text-2);font-size:var(--b-t-15, 15px);line-height:1.4}
[data-ui="board"] #lobby .rl-today b{color:var(--b-gold-text)}
[data-ui="board"] .rl-sheet{position:fixed;inset:0;z-index:60;overflow-y:auto;overscroll-behavior:contain;background:var(--b-bg);color:var(--b-text);padding:env(safe-area-inset-top,0px) 0 calc(24px + env(safe-area-inset-bottom,0px))}
[data-ui="board"] .rl-bar{position:sticky;top:0;z-index:1;display:flex;align-items:center;min-height:52px;padding:0 max(16px,env(safe-area-inset-left,0px));background:var(--b-bg);border-bottom:1px solid var(--b-hair)}
[data-ui="board"] .rl-body{display:grid;gap:var(--b-s4);max-width:640px;margin:0 auto;padding:var(--b-s4) max(16px,env(safe-area-inset-right,0px)) 0 max(16px,env(safe-area-inset-left,0px))}
[data-ui="board"] .rl-head{display:grid;gap:4px}
[data-ui="board"] .rl-head h2{margin:0;font-family:var(--b-serif);font-size:var(--b-t-28);font-weight:500;line-height:1.1;text-wrap:balance}
[data-ui="board"] .rl-where{margin:0;color:var(--b-text-2);font-size:var(--b-t-14)}
[data-ui="board"] .rl-idea,[data-ui="board"] .rl-empty{display:grid;gap:6px;padding:var(--b-s4);border-radius:var(--b-r-card);border:1px solid var(--b-hair-gold);background:var(--b-surface)}
[data-ui="board"] .rl-idea h3,[data-ui="board"] .rl-empty h3{margin:0;font-family:var(--b-serif);font-size:var(--b-t-22);font-weight:500;line-height:1.2;text-wrap:balance}
[data-ui="board"] .rl-empty p,[data-ui="board"] .rl-idea p{margin:0;line-height:1.45}
[data-ui="board"] .rl-len{color:var(--b-text-2);font-size:var(--b-t-13)}
[data-ui="board"] .rl-idea h4{margin:var(--b-s2) 0 0;font-size:var(--b-t-11);font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--b-gold)}
[data-ui="board"] .rl-steps{margin:0;padding-left:1.3em;display:grid;gap:6px;line-height:1.45}
[data-ui="board"] .rl-proof{display:grid;gap:4px;margin-top:var(--b-s2);padding:10px 12px;border-radius:12px;background:var(--b-surface-2);border:1px solid var(--b-hair)}
[data-ui="board"] .rl-proof-k{font-size:var(--b-t-11);font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--b-text-2)}
[data-ui="board"] .rl-vid{display:grid;gap:2px;color:var(--b-text);text-decoration:none;min-width:0}
[data-ui="board"] .rl-vid b{font-size:var(--b-t-14);font-weight:600;line-height:1.3;overflow-wrap:anywhere}
[data-ui="board"] .rl-vid small{font-size:12px;color:var(--b-text-2)}
[data-ui="board"] .rl-vid .num{font-variant-numeric:tabular-nums;color:var(--b-text)}
[data-ui="board"] .rl-acts{display:grid;grid-template-columns:1fr 1fr;gap:var(--b-s2);margin-top:var(--b-s2)}
[data-ui="board"] .rl-acts .btn{width:100%;min-height:var(--b-tap)}
[data-ui="board"] .rl-done{color:var(--b-gold-text);font-weight:600;margin-top:var(--b-s2)!important}
[data-ui="board"] .rl-note,[data-ui="board"] .rl-wait{margin:0;color:var(--b-text-2);font-size:var(--b-t-13)}
[data-ui="board"] .rl-err{margin:0;color:var(--b-live);font-size:var(--b-t-13)}
[data-ui="board"] .rl-sec{display:grid;gap:var(--b-s2)}
[data-ui="board"] .rl-sec h3{margin:0;font-family:var(--b-serif);font-size:var(--b-t-22);font-weight:500}
[data-ui="board"] .rl-sec h3 small{font-family:var(--b-font);font-size:var(--b-t-13);color:var(--b-text-2)}
[data-ui="board"] .rl-form{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:var(--b-s2)}
[data-ui="board"] .rl-form input{min-width:0;min-height:var(--b-tap);padding:0 14px;border-radius:var(--b-r-btn);border:1px solid var(--b-hair);background:var(--b-surface);color:var(--b-text);font:inherit;font-size:16px}
[data-ui="board"] .rl-form .btn{min-height:var(--b-tap);padding:0 18px}
[data-ui="board"] .rl-list{margin:0;padding:0;list-style:none;display:grid;gap:var(--b-s2)}
[data-ui="board"] .rl-list li{padding:10px 12px;border-radius:12px;background:var(--b-surface);border:1px solid var(--b-hair)}
[data-ui="board"] .rl-saved{border-radius:12px;background:var(--b-surface);border:1px solid var(--b-hair);padding:0 12px}
[data-ui="board"] .rl-saved summary{display:grid;gap:2px;min-height:var(--b-tap);padding:10px 0;cursor:pointer}
[data-ui="board"] .rl-saved summary small{color:var(--b-text-2);font-size:12px}
[data-ui="board"] .rl-saved[open]{padding-bottom:12px}
[data-ui="board"] .rl-saved > p{margin:0 0 6px;line-height:1.45}
[data-ui="board"] .rl-link{min-height:var(--b-tap);padding:0;border:0;background:none;color:var(--b-gold);font:inherit;font-size:var(--b-t-13);font-weight:600;cursor:pointer}
/* today's idea, bigger and plainer (owner, Oct 30: the thin serif and the small text were hard to read): the card's and
   the screen's titles in the app's own sans, bold; reading text at 17 px; the real example still the smallest, at 14 */
[data-ui="board"] #lobby .rl-entry h3,[data-ui="board"] .rl-head h2,[data-ui="board"] .rl-idea h3,[data-ui="board"] .rl-empty h3,[data-ui="board"] .rl-sec h3{font-family:var(--b-font);font-weight:700;letter-spacing:-.01em;line-height:1.2;text-wrap:balance}
[data-ui="board"] #lobby .rl-entry h3{font-size:26px}
[data-ui="board"] .rl-head h2{font-size:30px}
[data-ui="board"] .rl-idea h3,[data-ui="board"] .rl-empty h3{font-size:24px}
[data-ui="board"] .rl-sec h3{font-size:22px}
[data-ui="board"] .rl-k{font-size:13px}
[data-ui="board"] #lobby .rl-today,[data-ui="board"] .rl-idea p,[data-ui="board"] .rl-empty p,[data-ui="board"] .rl-steps,[data-ui="board"] .rl-saved > p{font-size:17px;line-height:1.5;color:var(--b-text)}
[data-ui="board"] .rl-where,[data-ui="board"] .rl-len,[data-ui="board"] .rl-note,[data-ui="board"] .rl-wait,[data-ui="board"] .rl-err{font-size:16px}
[data-ui="board"] .rl-idea h4{font-size:13px;margin-top:var(--b-s3)}
[data-ui="board"] .rl-steps{gap:10px}
[data-ui="board"] .rl-proof-k{font-size:12px}
[data-ui="board"] .rl-vid b{font-size:16px}
[data-ui="board"] .rl-vid small,[data-ui="board"] .rl-saved summary small{font-size:14px}
[data-ui="board"] .rl-saved summary b{font-size:17px}
[data-ui="board"] .rl-link{font-size:15px}
[data-ui="board"] .rl-new{font-size:12px}
/* today's three ideas to pick from (owner, Oct 30): titles always showing, one opens at a time */
[data-ui="board"] #lobby .rl-titles{margin:0;padding-left:1.2em;display:grid;gap:4px;color:var(--b-text);font-size:16px;line-height:1.4}
[data-ui="board"] .rl-today-ideas{display:grid;gap:var(--b-s2)}
[data-ui="board"] .rl-today-ideas > h3{margin:0;font-family:var(--b-font);font-weight:700;font-size:24px;line-height:1.2}
[data-ui="board"] .rl-idea{display:block;padding:0}
[data-ui="board"] .rl-idea > summary{display:grid;grid-template-columns:auto minmax(0,1fr);gap:12px;align-items:start;padding:var(--b-s3) var(--b-s4);min-height:var(--b-tap);cursor:pointer;list-style:none}
[data-ui="board"] .rl-idea > summary::-webkit-details-marker{display:none}
[data-ui="board"] .rl-idea[open]{border-color:var(--b-gold)}
[data-ui="board"] .rl-num{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:var(--b-gold-fill);border:1px solid var(--b-hair-gold);color:var(--b-gold);font-weight:700;font-size:17px}
[data-ui="board"] .rl-sum{display:grid;gap:4px;min-width:0}
[data-ui="board"] .rl-kind{font-size:14px;font-weight:600;color:var(--b-gold-text)}
[data-ui="board"] .rl-idea .rl-sum h3{font-size:20px}
[data-ui="board"] .rl-tag{justify-self:start;padding:2px 10px;border-radius:var(--b-r-pill);background:var(--b-gold);color:var(--b-bg);font-size:13px;font-weight:700}
[data-ui="board"] .rl-more{display:grid;gap:6px;padding:0 var(--b-s4) var(--b-s4)}
/* a plan written for the member's business (owner, Oct 30): the first line in large type, the rest plain */
[data-ui="board"] .rl-ai-k{margin:0 0 4px!important;font-size:14px!important;color:var(--b-text-2)!important}
[data-ui="board"] .rl-hook{font-size:20px!important;font-weight:700;line-height:1.35;color:var(--b-text)}
[data-ui="board"] .rl-script{white-space:pre-line}
[data-ui="board"] .rl-shots small{color:var(--b-text-2);font-size:14px;margin-left:4px}
[data-ui="board"] .rl-tags{color:var(--b-gold-text)}
[data-ui="board"] .rl-more .rl-link,[data-ui="board"] .rl-saved .rl-link{justify-self:start}