/* DEMO THEME — "refined indigo" (owner decision 2026-10-15 11:50 PT: minimal, neutral cool greys, near-black text, hairlines, one quiet
   indigo accent on < 5 % of the screen), on the "lab" structure. The :root block below IS block 1 of
   docs/site_assets/theme_final/tokens.css (the single token source shared with the project site; rules: theme_final/README.md), so
   retuning = replacing that block. Served at /_gws/theme.css by the instance itself (code/demo/server.py) and by the doorman, AFTER
   public_ui.css / public_layout.css / public_intro.css; fonts = Inter (opsz) + JetBrains Mono, linked by public_page.FONTS. */
:root {
  /* ---- colour: neutrals (cool grey, hue 280, chroma <= .012) ---- */
  --bg-0: #f3f3f6;                    /* page edge / letterbox */
  --bg-1: #fafafc;                    /* page */
  --app-bg: #fafafc;                  /* flat - no gradient */
  --panel: #ffffff;                   /* HUD plates, cards, frames */
  --panel-2: #f6f6f9;                 /* hover / quiet fill */
  --glass: rgba(255, 255, 255, .94);  /* plates over the video */
  --line: #e4e4e9;                    /* 1-px hairlines */
  --line-hi: #b9bac2;                 /* hover hairline */
  --cap-line: #d0d0d6;                /* new: key-cap / input border (one step darker than --line) */
  --text: #191a20;
  --dim: #676870;
  --faint: #9d9ea3;                   /* decoration only (never text that must be read) */
  /* ---- colour: the one accent (indigo, oklch .49 .185 279) ---- */
  --accent: #504ac5;                  /* you / your control / the primary action */
  --accent-2: #423ea4;                /* accent text on light, hover/pressed of accent fills */
  --accent-ink: #ffffff;              /* text on accent */
  --accent-glow: transparent;         /* no glow (kept so old rules resolve) */
  --accent-wash: #f0f0fb;             /* selected-card / ours fill */
  --focus: #504ac5;                   /* new: focus ring colour (2 px ring, 2 px offset) */
  /* ---- colour: status (small, status-only) ---- */
  --live: #c42354;                    /* someone else is live / critical time */
  --live-glow: transparent;
  --live-wash: #fbeff3;
  --warn: #8a6a00;                    /* REACH LIMIT, low time, turn passed */
  --warn-bg: #fcf7e1; --warn-line: #e0ca72; --warn-ink: #5c4700; --warn-stripe: #d9b52c;
  --ok: #15803d;                      /* state dot "streaming" */
  --info: #423ea4;                    /* operator page only (= --accent-2, no second blue) */
  --arm-l: #8e8f99;                   /* mouse mode: L arm (neutral) */
  --arm-r: #504ac5;                   /* mouse mode: R arm (= accent) */
  --video-bg: #0e0f13;                /* behind the canvases */
  --scrim: rgba(250, 250, 252, .86);  /* overlays: YOUR TURN, round over, how-to */
  --spot: rgba(246, 246, 249, .76);   /* intro: everything but the spotlit target */
  /* ---- elevation: hairline first, shadow barely there ---- */
  --shadow: 0 0 0 1px var(--line);
  --shadow-view: 0 0 0 1px var(--line), 0 1px 2px rgba(25, 26, 32, .04);
  --shadow-pop: 0 0 0 1px var(--line), 0 12px 32px -16px rgba(25, 26, 32, .16);
  --sheen-a: 0;                       /* no sheen */
  --burst-a: 0;                       /* no burst */
  /* ---- type (Inter + JetBrains Mono) ---- */
  --f-display: Inter, system-ui, -apple-system, "Segoe UI", sans-serif;   /* titles, numerals (font-optical-sizing: auto) */
  --f-ui: Inter, system-ui, -apple-system, "Segoe UI", sans-serif;        /* sentences */
  --f-label: "JetBrains Mono", ui-monospace, Menlo, monospace;             /* small labels, key caps, clocks */
  --fw-thin: 300; --fw-reg: 400; --fw-med: 500; --fw-bold: 600;
  --fs-micro: 11px; --fs-cap: 12px; --fs-ui: 14px; --fs-lead: 16px;
  --fs-h1: clamp(30px, 3.6vw, 48px); --fs-card: 20px; --fs-timer: clamp(22px, 2.2vw, 32px);
  --fs-slam: clamp(40px, 5.6vw, 76px); --fs-slam-end: clamp(36px, 4.4vw, 56px); --fs-go: clamp(72px, 12vw, 160px);
  --track-label: .04em; --track-wide: .08em;
  --track-tight: -.025em;             /* new: display tracking (h1, slams, big numerals) */
  /* ---- shape ---- */
  --r: 8px;                           /* plates, cards, inputs */
  --r-cap: 6px;                       /* key caps */
  --r-btn: 999px;                     /* new: buttons (START / START NOW / REJOIN / secondary) are pills */
  --view-pad: 6px;                    /* white frame around each live view */
  --brk: 10px; --brk-w: 1px;          /* corner brackets (views, spotlight, PiP) */
  --cap-h: 30px; --cap-h-mid: 27px;   /* key caps in the controls bar (wide / < 1240 px) */
  --ring: 132px;                      /* YOUR TURN ring */
  --callout-w: 290px;
  /* ---- motion: fast, ease-out, no overshoot ---- */
  --t-tap: 100ms; --t-ui: 180ms; --t-state: 240ms; --t-enter: 480ms; --t-slam: 360ms;
  --ease-out: cubic-bezier(.2, 0, 0, 1);
  --ease-io: cubic-bezier(.65, 0, .35, 1);
  --ease-slam: cubic-bezier(.2, 0, 0, 1);  /* = ease-out: no bounce */
  --stagger: 50ms;                    /* card / stat entrance stagger */
  --pulse-live: 1.6s;                 /* LIVE dot */
  --pulse-turn: 1.2s;                 /* YOUR TURN ring halo, timer < 10 s, YOU'RE NEXT chip */
  --pulse-target: 1.6s;               /* mouse target ring */
  --sheen: 2.6s;                      /* unused while --sheen-a = 0 */
  --reach-hold: 2.6s;                 /* (JS) REACH LIMIT chip stays this long after the last limit sample */
  /* ---- layout (public_layout.js overwrites the band heights per viewport) ---- */
  --top-h: 56px; --bot-h: 86px;
  /* the operator page's own variables (visible behind "details") follow the theme */
  --bg: var(--bg-1); --fg: var(--text); --acc: var(--ok); --err: var(--live); --blue: var(--info);
  color-scheme: light;
}

/* ================================================================================ base */
body.gws-simple { background: var(--app-bg) fixed; color: var(--text); font: var(--fw-reg) var(--fs-ui)/1.4 var(--f-ui); -webkit-font-smoothing: antialiased; }
body.gws-simple.gws-theater { background: var(--app-bg); }
body.gws-simple kbd { display: inline-flex; align-items: center; justify-content: center; min-width: 1.8em; height: 1.7em; padding: 0 .4em; box-sizing: border-box;
  border-radius: var(--r-cap); font: var(--fw-med) .78em/1 var(--f-label); color: var(--text); background: var(--panel); border: 1px solid var(--cap-line); border-bottom-width: 1px; }
body.gws-simple .dot { display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: var(--accent); flex: none; }
body.gws-simple .dot.ok { background: var(--ok); } body.gws-simple .dot.live { background: var(--live); } body.gws-simple .dot.warn { background: var(--warn); }
body.gws-simple .eyebrow { margin: 0 0 8px; display: inline-flex; align-items: center; gap: 8px; font: var(--fw-med) var(--fs-cap)/1 var(--f-label);
  letter-spacing: var(--track-label); color: var(--accent); text-transform: uppercase; }
/* the primary "ready" button (START / START NOW / REJOIN) */
body.gws-simple .ready, body.gws-simple #gws_land .start.ready, body.gws-simple #gws_ended .start.ready, body.gws-simple #gws_ov .start.ready { position: relative; overflow: hidden; display: inline-flex; align-items: center; gap: 14px; height: 52px; padding: 0 26px; border: 0;
  border-radius: var(--r-btn); cursor: pointer; background: var(--accent); color: var(--accent-ink); box-shadow: none;
  font: var(--fw-med) 18px/1 var(--f-ui); letter-spacing: .06em; transition: transform var(--t-tap), filter var(--t-ui), background var(--t-ui); }
body.gws-simple .ready .ready-t { font: var(--fw-med) 18px/1 var(--f-ui); letter-spacing: .06em; }
body.gws-simple .ready kbd { color: var(--accent-ink); background: rgba(255, 255, 255, .15); border-color: rgba(255, 255, 255, .4); }
body.gws-simple .ready:hover:not(:disabled) { filter: brightness(1.06); } body.gws-simple .ready:active:not(:disabled) { transform: scale(.97); }
body.gws-simple .ready:disabled { opacity: .45; cursor: wait; }
body.gws-simple .ready:focus-visible, body.gws-simple button:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
body.gws-simple .ready.busy { filter: saturate(.35); }
body.gws-simple .ready .sheen { position: absolute; top: 0; bottom: 0; left: -40%; width: 30%; pointer-events: none; opacity: var(--sheen-a);
  background: linear-gradient(100deg, transparent, #fff, transparent); transform: skewX(-18deg); animation: gws-sheen var(--sheen) var(--ease-io) infinite; }
@keyframes gws-sheen { 0%, 55% { transform: translateX(0) skewX(-18deg); } 100% { transform: translateX(560%) skewX(-18deg); } }
body.gws-simple .ready-sm { height: 46px; padding: 0 22px; } body.gws-simple .ready-sm .ready-t { font-size: 16px; }

/* ================================================================================ (a) landing / mode select */
body.gws-simple #gws_land { background: var(--app-bg); color: var(--text); font: var(--fw-reg) var(--fs-ui)/1.45 var(--f-ui); display: grid; place-items: center; }
body.gws-simple #gws_land[style*="none"] { display: none !important; }
body.gws-simple #gws_land .wrap { width: min(1120px, 92vw); max-width: none; margin: 0 auto; padding: 32px 0; box-sizing: border-box; }
body.gws-simple #gws_land h1 { margin: 0; font: var(--fw-thin) var(--fs-h1)/1.08 var(--f-display); letter-spacing: var(--track-tight); font-optical-sizing: auto; }
body.gws-simple #gws_land .sub { margin: 10px 0 24px; color: var(--dim); font-size: var(--fs-lead); }
body.gws-simple #gws_land .cards { display: grid; grid-template-columns: repeat(4, 1fr) !important; gap: 1px; margin: 0; background: var(--line); box-shadow: 0 0 0 1px var(--line); }
body.gws-simple #gws_land .card { position: relative; display: flex; flex-direction: column; align-items: flex-start; gap: 6px; min-height: 210px; padding: 22px 22px 18px;
  border: 0; border-radius: 0; text-align: left; cursor: pointer; background: var(--panel); color: var(--text); box-shadow: none; font: inherit;
  transition: background var(--t-ui), box-shadow var(--t-state); }
body.gws-simple #gws_land .card.enter { animation: gws-card-in var(--t-enter) var(--ease-out) both; animation-delay: calc(var(--i, 0) * var(--stagger) + 120ms); }
@keyframes gws-card-in { from { opacity: 0; transform: translateY(18px); } }
body.gws-simple #gws_land .card .c-ico { width: 34px; height: 34px; margin-bottom: auto; color: var(--text); transition: color var(--t-ui), transform var(--t-state) var(--ease-slam); }
body.gws-simple #gws_land .card .c-ico svg { width: 100%; height: 100%; display: block; }
body.gws-simple #gws_land .card b.title { display: block; margin: 18px 0 0; font: var(--fw-med) var(--fs-card)/1.1 var(--f-display); }
body.gws-simple #gws_land .card .desc { color: var(--dim); font-size: 13px; line-height: 1.4; }
body.gws-simple #gws_land .card .tag { position: absolute; right: 18px; top: 18px; font: var(--fw-med) 10px/1 var(--f-label); letter-spacing: var(--track-label); color: var(--accent); }
body.gws-simple #gws_land .card .bar { position: absolute; left: 0; right: 0; bottom: 0; height: 3px; background: var(--accent); transform: scaleX(0); transform-origin: left;
  transition: transform var(--t-state) var(--ease-io); }
body.gws-simple #gws_land .card .cb { display: none; }
body.gws-simple #gws_land .card:hover:not(:disabled) { background: var(--panel-2); }
body.gws-simple #gws_land .card:hover:not(:disabled) .c-ico { transform: translateY(-2px); }
body.gws-simple #gws_land .card.sel { background: var(--panel); }
body.gws-simple #gws_land .card.sel .c-ico { color: var(--accent); } body.gws-simple #gws_land .card.sel .bar { transform: scaleX(1); }
body.gws-simple #gws_land .card:disabled { cursor: not-allowed; background: var(--bg-0); }
body.gws-simple #gws_land .card:disabled > * { opacity: .45; } body.gws-simple #gws_land .card:disabled .tag { color: var(--accent); }
body.gws-simple #gws_land .ready-row { display: flex; align-items: stretch; justify-content: flex-end; gap: 14px; margin: 22px 0 0; flex-wrap: wrap; }
body.gws-simple #gws_land .scene { display: inline-flex; align-items: center; gap: 10px; height: 52px; padding: 0 6px 0 14px; box-sizing: border-box; background: var(--panel);
  box-shadow: var(--shadow); border-radius: var(--r); }
body.gws-simple #gws_land .scene .lab, body.gws-simple #gws_top .lab, body.gws-simple .spec-now .lab {
  font: var(--fw-med) 10px/1 var(--f-label); letter-spacing: var(--track-wide); color: var(--dim); }
body.gws-simple #gws_land select { height: 38px; min-width: 250px; background: var(--panel); color: var(--text); border: 1px solid var(--line); border-radius: var(--r);
  font: var(--fw-med) 14px var(--f-ui); padding: 0 8px; }
body.gws-simple #gws_land .lobby { margin: 12px 0 0; display: flex; justify-content: flex-end; flex-wrap: wrap; gap: 6px 14px; color: var(--dim);
  font: var(--fw-reg) var(--fs-cap)/1.2 var(--f-label); letter-spacing: var(--track-label); }
body.gws-simple #gws_land .lobby .free { display: inline-flex; align-items: center; gap: 8px; color: var(--dim); }
body.gws-simple #gws_land .lobby .wait { color: var(--warn); } body.gws-simple #gws_land .lobby .wait:empty { display: none; }
body.gws-simple #gws_land .hint { display: none; }
body.gws-simple #gws_land .priv { margin: 14px 0 0; padding: 0; border: 0; color: var(--dim); font-size: var(--fs-cap); text-align: right; }
body.gws-simple #gws_land .priv:empty { display: none; }
@media (max-width: 900px) { body.gws-simple #gws_land .cards { grid-template-columns: repeat(2, 1fr) !important; } }
@media (max-width: 520px) {
  body.gws-simple #gws_land .cards { grid-template-columns: 1fr 1fr !important; } body.gws-simple #gws_land .card { min-height: 0; padding: 12px; }
  body.gws-simple #gws_land .card .desc, body.gws-simple #gws_land .card .c-ico { display: none; } body.gws-simple #gws_land .card b.title { margin: 0; font-size: 16px; }
  body.gws-simple #gws_land select { min-width: 0; width: 100%; } body.gws-simple #gws_land .scene { flex: 1 1 100%; }
}

/* ================================================================================ (e) HUD top band */
body.gws-simple #gws_top { background: var(--panel); border-bottom: 1px solid var(--line); color: var(--text); font: var(--fw-reg) 13px/1.4 var(--f-ui); }
body.gws-wide #gws_stage > #gws_top, body.gws-mid #gws_stage > #gws_top { background: none; border: 0; }
body.gws-simple #gws_top .chip { display: inline-flex; align-items: center; gap: 7px; height: 30px; padding: 0 12px; box-sizing: border-box; background: var(--panel);
  box-shadow: var(--shadow); border-radius: var(--r); font: var(--fw-med) var(--fs-cap)/1 var(--f-label); letter-spacing: var(--track-label); white-space: nowrap; min-width: 0; }
body.gws-simple #gws_top .chip-mode b { color: var(--accent); font-weight: var(--fw-bold); text-transform: uppercase; }
body.gws-simple #gws_top .chip-mode .ico { width: 15px; height: 15px; display: inline-block; flex: none; color: var(--text); }
body.gws-simple #gws_top .chip-mode .ico svg { width: 100%; height: 100%; display: block; }
body.gws-simple #gws_top .chip-task { overflow: hidden; cursor: pointer; }
body.gws-simple #gws_top select { appearance: none; -webkit-appearance: none; background: transparent; border: 0; padding: 0 2px; margin: 0; color: var(--text);
  font: var(--fw-reg) 13px/1 var(--f-label); max-width: 34vw; text-overflow: ellipsis; cursor: pointer; outline: none; }
body.gws-simple #gws_top select option { color: #15181d; background: #fff; }
/* timer plate (top-centre round clock): SESSION · tabular numerals · 3-px drain bar */
body.gws-simple #gws_top .timer { display: grid; grid-template-columns: auto auto; align-items: baseline; column-gap: 12px; padding: 8px 22px 9px; background: var(--panel);
  box-shadow: var(--shadow); border-radius: 0 0 var(--r) var(--r); }
body.gws-simple #gws_top .t-lab { font: var(--fw-med) 10px/1 var(--f-label); letter-spacing: var(--track-wide); color: var(--dim); }
body.gws-simple #gws_top .t-num { font: var(--fw-thin) var(--fs-timer)/1 var(--f-label); font-variant-numeric: tabular-nums; color: var(--text); white-space: nowrap; display: inline-block; }
body.gws-simple #gws_top .t-bar { grid-column: 1 / -1; height: 3px; margin-top: 6px; background: var(--bg-0); overflow: hidden; }
body.gws-simple #gws_top .t-bar i { display: block; height: 100%; background: var(--accent); transform-origin: left; transform: scaleX(0); transition: transform 1s linear, background var(--t-state); }
body.gws-simple #gws_top .timer.warn .t-num { color: var(--warn); } body.gws-simple #gws_top .timer.warn .t-bar i { background: var(--warn); }
body.gws-simple #gws_top .timer.crit .t-num { color: var(--live); animation: gws-crit var(--pulse-turn) var(--ease-out) infinite; }
body.gws-simple #gws_top .timer.crit .t-bar i { background: var(--live); }
body.gws-simple #gws_top .timer.spec .t-bar i { background: var(--live); }
@keyframes gws-crit { 0% { transform: scale(1.12); } 40%, 100% { transform: scale(1); } }
/* narrow (< 820 px) status bar: no plate, just the clock */
body.gws-simple:not(.gws-wide):not(.gws-mid) #gws_top .timer { display: inline-flex; padding: 0; box-shadow: none; background: none; gap: 6px; align-items: baseline; }
body.gws-simple:not(.gws-wide):not(.gws-mid) #gws_top .t-bar { display: none; }
body.gws-simple:not(.gws-wide):not(.gws-mid) #gws_top .t-num { font-size: 15px; font-weight: var(--fw-med); }
body.gws-simple:not(.gws-wide):not(.gws-mid) #gws_top .chip-mode { display: none; }
/* state pill: dot colour = class (ok green · warn amber · bad red · on accent) */
body.gws-simple #gws_top .pill { display: inline-flex; align-items: center; gap: 7px; height: 26px; padding: 0 10px; box-sizing: border-box; border: 0; border-radius: 999px;
  background: var(--panel); box-shadow: var(--shadow); color: var(--text); font: var(--fw-med) 10.5px/1 var(--f-label); letter-spacing: var(--track-label); white-space: nowrap;
  max-width: 30vw; overflow: hidden; text-overflow: ellipsis; flex: none; }
body.gws-simple #gws_top .pill::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--warn); flex: none; }
body.gws-simple #gws_top .pill.ok::before { background: var(--ok); } body.gws-simple #gws_top .pill.bad::before { background: var(--live); }
body.gws-simple #gws_top .pill.on::before { background: var(--accent); }
body.gws-simple #gws_top .pill.ok, body.gws-simple #gws_top .pill.warn, body.gws-simple #gws_top .pill.bad, body.gws-simple #gws_top .pill.on { color: var(--text); border: 0; }
/* action buttons: plates with a leading key cap where a real shortcut exists */
body.gws-simple #gws_top button.act { display: inline-flex; align-items: center; gap: 7px; height: 30px; padding: 0 12px; box-sizing: border-box; border: 0; border-radius: var(--r-btn);
  cursor: pointer; background: var(--panel); color: var(--text); box-shadow: 0 0 0 1px var(--cap-line); white-space: nowrap;
  font: var(--fw-med) var(--fs-cap)/1 var(--f-label); letter-spacing: var(--track-label); text-transform: uppercase;
  transition: box-shadow var(--t-ui), transform var(--t-tap), background var(--t-ui); }
body.gws-simple #gws_top button.act:has(kbd) { padding-left: 6px; }
body.gws-simple #gws_top button.act kbd { font-size: 10px; height: 20px; min-width: 22px; text-transform: none; }
body.gws-simple #gws_top button.act:hover { box-shadow: 0 0 0 1px var(--accent); background: var(--accent-wash); }
body.gws-simple #gws_top button.act:active { transform: translateY(1px) scale(.98); }
body.gws-simple #gws_top button.act-end { color: var(--live); } body.gws-simple #gws_top button.act-end:hover { box-shadow: 0 0 0 1px var(--live); background: var(--live-wash); }
body.gws-simple #gws_top button.act-ghost { color: var(--dim); box-shadow: none; background: none; text-transform: none; letter-spacing: 0; padding: 0 6px; }
body.gws-simple #gws_top button#gws_details span::after { content: " ▾"; } body.gws-simple #gws_top button#gws_details.on { color: var(--accent-2); }
body.gws-simple #gws_top button#gws_details.on span::after { content: " ▴"; }
body.gws-simple #gws_top .hint { color: var(--dim); }
body.gws-simple #gws_top .hint kbd { background: var(--panel); border: 1px solid var(--line); color: var(--text); font-family: var(--f-label); }
body.gws-simple #gws_top .spec-now { display: none; }
body.gws-spectate #gws_top .spec-now:not(:empty) { display: inline-flex; align-items: center; gap: 8px; height: 30px; padding: 0 10px; box-sizing: border-box; background: var(--panel);
  box-shadow: inset 2px 0 0 var(--live), var(--shadow); border-radius: var(--r); font: var(--fw-reg) var(--fs-cap)/1 var(--f-ui); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
@media (max-width: 1599px) {     /* the operator "details" toggle and Engage's key cap only when the band has room */
  body.gws-wide #gws_top #gws_engage kbd { display: none; }
  body.gws-wide #gws_top #gws_details span, body.gws-mid #gws_top #gws_details span { font-size: 0; }      /* just the chevron */
  body.gws-wide #gws_top #gws_details span::after, body.gws-mid #gws_top #gws_details span::after { font-size: 15px; content: "▾"; }
  body.gws-wide #gws_top #gws_details.on span::after, body.gws-mid #gws_top #gws_details.on span::after { content: "▴"; }
  body.gws-wide #gws_top button#gws_engage { padding-left: 12px; }
}
@media (max-width: 1239px) {     /* mid: action buttons drop their key caps, the state pill becomes a dot, the TASK label hides */
  body.gws-wide #gws_top button.act kbd, body.gws-mid #gws_top button.act kbd { display: none; }
  body.gws-wide #gws_top button.act, body.gws-mid #gws_top button.act { padding: 0 10px; }
  body.gws-wide #gws_top .pill, body.gws-mid #gws_top .pill { font-size: 0; gap: 0; padding: 0 9px; }
  body.gws-wide #gws_top .chip-task .lab, body.gws-mid #gws_top .chip-task .lab { display: none; }
  body.gws-wide #gws_top select, body.gws-mid #gws_top select { max-width: 22vw; }
  body.gws-wide #gws_top .actions, body.gws-mid #gws_top .actions { gap: 4px; }
}
@media (max-width: 1000px) { body.gws-mid #gws_top .chip-mode b { display: none; } }

/* ================================================================================ views: white frames, captions, corner brackets */
body.gws-simple #views figure { background: var(--panel); border: 0; border-radius: var(--r); padding: var(--view-pad); box-shadow: var(--shadow-view); overflow: hidden; }
body.gws-simple #views figure > canvas { background: var(--video-bg); border-radius: 1px; }
body.gws-simple #views figcaption { left: calc(var(--view-pad) + 6px); top: calc(var(--view-pad) + 6px); padding: 4px 7px; border-radius: var(--r); background: var(--glass);
  color: var(--text); text-shadow: none; opacity: 1; font: var(--fw-med) var(--fs-micro)/1 var(--f-label); letter-spacing: var(--track-label); }
body.gws-simple #views figure.mz-top figcaption, body.gws-wide #views figure:nth-child(2) figcaption, body.gws-mid #views figure:nth-child(2) figcaption { color: var(--accent); }
body.gws-simple #views figure::before, body.gws-simple #views figure::after { content: ""; position: absolute; width: var(--brk); height: var(--brk); pointer-events: none; z-index: 3; }
body.gws-simple #views figure::before { left: 1px; top: 1px; border-left: var(--brk-w) solid var(--line-hi); border-top: var(--brk-w) solid var(--line-hi); }
body.gws-simple #views figure::after { right: 1px; bottom: 1px; border-right: var(--brk-w) solid var(--line-hi); border-bottom: var(--brk-w) solid var(--line-hi); }
body.gws-wide #views figure:nth-child(2)::before, body.gws-wide #views figure:nth-child(2)::after,
body.gws-mid #views figure:nth-child(2)::before, body.gws-mid #views figure:nth-child(2)::after { border-color: var(--accent); }
/* mouse overlay: aligned to the canvas inside the frame; recoloured gauge; crosshair cursor */
body.gws-simple .mz { inset: var(--view-pad); }
body.gws-simple .mz .mz-gauge { background: var(--glass); border-color: var(--line); }
body.gws-simple .mz .mz-zl { font-family: var(--f-label); }
body.gws-simple.gws-mouse-on #views figure.mz-top { outline: 0; box-shadow: 0 0 0 1px var(--mzc, var(--line)), var(--shadow-view); }

/* ================================================================================ (e) HUD bottom band: arm selector + controls bar */
body.gws-simple #gws_info { background: none; border: 0; color: var(--text); font: var(--fw-reg) var(--fs-cap)/1.3 var(--f-ui); }
body.gws-simple #gws_info .arm { position: relative; width: 58px; height: 54px; box-sizing: border-box; display: grid; place-items: center; align-content: center; gap: 3px;
  background: var(--panel); box-shadow: var(--shadow); border-radius: var(--r); transition: box-shadow var(--t-ui), transform var(--t-ui) var(--ease-slam); }
body.gws-simple #gws_info .arm b { font: var(--fw-med) 20px/1 var(--f-display); color: var(--faint); }
body.gws-simple #gws_info .arm .grip { font: var(--fw-med) 8.5px/1 var(--f-label); letter-spacing: var(--track-label); color: var(--dim); }
body.gws-simple #gws_info .arm .grip.closed { color: var(--text); }
body.gws-simple #gws_info .arm.on { box-shadow: inset 0 -3px 0 var(--arm-r), var(--shadow); } body.gws-simple #gws_info .arm.on b { color: var(--arm-r); }
body.gws-simple #gws_info .arm[data-arm="L"].on { box-shadow: inset 0 -3px 0 var(--arm-l), var(--shadow); } body.gws-simple #gws_info .arm[data-arm="L"].on b { color: var(--arm-l); }
body.gws-simple #gws_info .ctrl { display: flex; align-items: stretch; gap: 0; padding: 7px 10px; background: var(--panel); box-shadow: var(--shadow); border-radius: var(--r); flex-wrap: nowrap; }
body.gws-simple #gws_info .slot { display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 1px 8px; }
body.gws-simple #gws_info .slot + .slot { border-left: 1px solid var(--line); }
body.gws-simple #gws_info .sep { width: 1px; margin: 0 6px; background: var(--line-hi); align-self: stretch; }
body.gws-simple #gws_info .sep + .slot { border-left: 0; }
body.gws-simple #gws_info .caps { display: flex; gap: 3px; }
body.gws-simple #gws_info kbd.cap { min-width: var(--cap-h); height: var(--cap-h); padding: 0 7px; margin: 0; box-sizing: border-box; display: grid; place-items: center;
  background: var(--panel); border: 1px solid var(--line); border-bottom-width: 2px; border-radius: var(--r-cap); color: var(--text);
  font: var(--fw-med) 13px/1 var(--f-label); transition: background var(--t-tap), border-color var(--t-tap), transform var(--t-tap), color var(--t-tap); }
body.gws-simple #gws_info kbd.cap.wide { min-width: 64px; font-size: 11.5px; letter-spacing: .04em; }
body.gws-simple #gws_info kbd.cap.ico svg { width: 16px; height: 16px; display: block; }
body.gws-simple #gws_info kbd.cap.sm { min-width: 20px; height: 20px; font-size: 10px; display: inline-grid; }
body.gws-simple #gws_info kbd.cap.on { background: var(--accent); color: var(--accent-ink); border-color: var(--accent-2); transform: translateY(1px); border-bottom-width: 1px; }
body.gws-simple #gws_info .slot i { font: var(--fw-reg) 10px/1 var(--f-ui); font-style: normal; color: var(--dim); white-space: nowrap; }
body.gws-simple #gws_info .ctrl-note { align-self: center; padding: 0 10px; color: var(--dim); font-size: var(--fs-cap); max-width: 300px; }
body.gws-simple #gws_info .gi_state { color: var(--accent-2); font: var(--fw-med) 11px var(--f-label); margin-left: 6px; }
body.gws-simple #gws_info ol.gi_steps { display: flex; gap: 6px 14px; margin: 0; padding: 0 10px; list-style: none; counter-reset: st; max-width: none; flex-wrap: wrap; }
body.gws-simple #gws_info ol.gi_steps li { counter-increment: st; color: var(--faint); white-space: nowrap; }
body.gws-simple #gws_info ol.gi_steps li::before { content: counter(st) " "; font-family: var(--f-label); }
body.gws-simple #gws_info ol.gi_steps li.cur { color: var(--accent-2); font-weight: var(--fw-med); }
body.gws-simple #gws_info .gi_priv { color: var(--dim); font-size: 11px; }
@media (max-width: 1239px) {
  body.gws-simple #gws_info kbd.cap { min-width: var(--cap-h-mid); height: var(--cap-h-mid); font-size: 12px; padding: 0 5px; }
  body.gws-simple #gws_info kbd.cap.wide { min-width: 54px; } body.gws-simple #gws_info .slot { padding: 1px 5px; }
}

/* ================================================================================ transient chips on the video */
/* REACH LIMIT: drops in under the TOP view's edge, two 3-px shakes, auto-hides (public_layout.js) */
body.gws-simple #gws_reach { align-items: center; gap: 10px; height: 32px; padding: 0 14px 0 0; box-sizing: border-box; background: var(--warn-bg); color: var(--warn-ink);
  box-shadow: 0 0 0 1px var(--warn-line); border-radius: var(--r); font: var(--fw-reg) var(--fs-cap)/1 var(--f-ui); white-space: nowrap; overflow: hidden;
  transform: translate(-50%, -12px); opacity: 0; pointer-events: none; transition: opacity var(--t-ui), transform var(--t-state) var(--ease-slam); }
body.gws-simple #gws_reach b { font: var(--fw-bold) var(--fs-cap)/1 var(--f-label); letter-spacing: var(--track-wide); color: var(--warn); }
body.gws-simple #gws_reach .stripes { width: 26px; align-self: stretch; background: repeating-linear-gradient(-45deg, var(--warn-stripe) 0 5px, transparent 5px 10px); }
body.gws-simple #gws_reach.on { opacity: 1; transform: translate(-50%, 0); animation: gws-shake .32s var(--ease-out) .12s 2; }
@keyframes gws-shake { 0%, 100% { margin-left: 0; } 25% { margin-left: -3px; } 75% { margin-left: 3px; } }
/* hand-cam PiP: bottom-right inside TOP, glass frame + two accent corner brackets */
body.gws-wide #pip, body.gws-mid #pip { padding: 4px; background: var(--glass); border: 0; border-radius: var(--r); box-shadow: var(--shadow-pop); }
body.gws-wide #pip.on, body.gws-mid #pip.on { display: block; }
body.gws-wide #pip::before, body.gws-mid #pip::before { content: "HAND CAM"; position: absolute; left: 10px; top: 9px; z-index: 2; padding: 2px 5px; border-radius: var(--r);
  background: var(--glass); color: var(--text); font: var(--fw-med) 9px/1 var(--f-label); letter-spacing: var(--track-wide); }
body.gws-wide #pip::after, body.gws-mid #pip::after { content: ""; position: absolute; inset: -3px; pointer-events: none;
  background: linear-gradient(var(--accent), var(--accent)) 0 0 / var(--brk) 2px no-repeat, linear-gradient(var(--accent), var(--accent)) 0 0 / 2px var(--brk) no-repeat,
              linear-gradient(var(--accent), var(--accent)) 100% 100% / var(--brk) 2px no-repeat, linear-gradient(var(--accent), var(--accent)) 100% 100% / 2px var(--brk) no-repeat; }
body.gws-wide #pip img, body.gws-mid #pip img { border-radius: 1px; background: var(--video-bg); }
body.gws-wide #pip .cap, body.gws-mid #pip .cap { margin-top: 3px; padding: 0 2px; font: var(--fw-reg) 10px/1.3 var(--f-label); color: var(--dim); }
body.gws-wide #pip .cap b, body.gws-mid #pip .cap b { color: var(--text); }
/* narrow layout PiP: the operator style, light */
body.gws-simple:not(.gws-wide):not(.gws-mid) #pip { background: var(--panel); border-color: var(--line); }

/* ================================================================================ (b) queue / spectating */
body.gws-simple #gws_spec { align-items: stretch; height: 44px; box-sizing: border-box; padding: 0; margin: 0 0 10px; border: 0; border-radius: var(--r); overflow: hidden;
  background: var(--panel); box-shadow: var(--shadow); color: var(--text); font: var(--fw-reg) 13px/1 var(--f-ui); white-space: nowrap; width: max-content; max-width: 100%;
  animation: gws-banner-in var(--t-enter) var(--ease-out) both; }
@keyframes gws-banner-in { from { opacity: 0; transform: translateY(14px); } }
body.gws-simple #gws_spec .live-tag { display: inline-flex; align-items: center; gap: 7px; padding: 0 16px 0 14px; background: var(--live); color: #fff;
  font: var(--fw-bold) 13px/1 var(--f-label); letter-spacing: var(--track-wide); }
body.gws-simple #gws_spec .live-tag i { width: 7px; height: 7px; border-radius: 50%; background: #fff; animation: gws-live var(--pulse-live) ease-in-out infinite; }
body.gws-simple #gws_spec .live-tag.off { background: var(--warn); } body.gws-simple #gws_spec .live-tag.off i { animation: none; }
@keyframes gws-live { 0%, 100% { opacity: 1; } 50% { opacity: .25; } }
body.gws-simple #gws_spec .spec-t { display: inline-flex; align-items: center; padding: 0 16px; font: var(--fw-med) 13px/1 var(--f-label); letter-spacing: .12em; text-transform: uppercase; }
body.gws-simple #gws_spec .q-chip { position: relative; display: inline-flex; align-items: center; gap: 10px; padding: 0 16px; border-left: 1px solid var(--line); }
body.gws-simple #gws_spec .q-lab { font: var(--fw-med) 10px/1 var(--f-label); letter-spacing: var(--track-wide); color: var(--dim); }
body.gws-simple #gws_spec .q-n { position: relative; display: inline-block; height: 26px; overflow: hidden; font: var(--fw-thin) 24px/26px var(--f-label); min-width: 2ch; }
body.gws-simple #gws_spec .q-n span { display: block; } body.gws-simple #gws_spec .q-n span.out { position: absolute; left: 0; top: 0; animation: gws-flip-out .4s var(--ease-io) both; }
body.gws-simple #gws_spec .q-n span.in { animation: gws-flip-in .4s var(--ease-io) both; }
@keyframes gws-flip-out { to { transform: translateY(-100%); opacity: 0; } } @keyframes gws-flip-in { from { transform: translateY(100%); opacity: 0; } }
body.gws-simple #gws_spec .q-eta { font: var(--fw-reg) 14px/1 var(--f-label); font-variant-numeric: tabular-nums; }
body.gws-simple #gws_spec .q-bar { position: absolute; left: 0; right: 0; bottom: 0; height: 2px; background: var(--bg-0); }
body.gws-simple #gws_spec .q-bar i { display: block; height: 100%; background: var(--accent); transform-origin: left; transform: scaleX(.02); transition: transform 1s linear; }
body.gws-simple #gws_spec .sub { display: inline-flex; align-items: center; padding: 0 14px; border-left: 1px solid var(--line); color: var(--dim); font-size: var(--fs-cap); overflow: hidden; text-overflow: ellipsis; }
body.gws-simple #gws_spec .sub:empty { display: none; }
body.gws-wide #gws_spec .sub, body.gws-mid #gws_spec .sub { display: none; }        /* the top band's NOW PLAYING tag has it */
body.gws-simple #gws_spec.next { box-shadow: 0 0 0 1px var(--accent), 0 0 24px var(--accent-glow); }
body.gws-simple #gws_spec.next .spec-t { color: var(--accent-2); }
body.gws-simple #gws_spec.next .q-chip { animation: gws-next var(--pulse-turn) ease-in-out infinite; }
@keyframes gws-next { 0%, 100% { background: transparent; } 50% { background: var(--accent-wash); } }
body.gws-theater #gws_spec { height: 34px; font-size: 12px; } body.gws-theater #gws_spec .q-n { font-size: 18px; height: 20px; line-height: 20px; }
body.gws-theater.gws-wide #gws_spec { position: relative; top: auto; left: auto; transform: none; height: 44px; }
/* GET READY toast (YOU'RE NEXT pre-alert) */
body.gws-simple .gws-toast { position: fixed; right: 16px; top: calc(var(--top-h) + 10px); z-index: 45; display: grid !important; gap: 4px; padding: 10px 16px 10px 14px;
  background: var(--panel); box-shadow: inset 3px 0 0 var(--accent), var(--shadow-pop); border-radius: var(--r);
  transform: translateX(calc(100% + 40px)); transition: transform var(--t-enter) var(--ease-slam); }
body.gws-simple:not(.gws-spectate) .gws-toast { visibility: hidden; }
body.gws-simple .gws-toast b { font: var(--fw-bold) 13px/1 var(--f-label); letter-spacing: var(--track-wide); color: var(--accent); }
body.gws-simple .gws-toast span { font-size: var(--fs-cap); color: var(--dim); }
body.gws-simple .gws-toast.on { transform: none; }
body.gws-simple:not(.gws-wide):not(.gws-mid) .gws-toast { display: none !important; }
/* letterbox bars while watching */
body.gws-simple #gws_stage > .lbox { position: fixed; left: 0; right: 0; height: 14px; z-index: 5; background: var(--bg-0); transition: transform var(--t-enter) var(--ease-io); pointer-events: none; }
body.gws-simple #gws_stage > .lbox-t { top: 0; transform: translateY(-100%); } body.gws-simple #gws_stage > .lbox-b { bottom: 0; transform: translateY(100%); }
body.gws-spectate #gws_stage > .lbox-t, body.gws-spectate #gws_stage > .lbox-b { transform: none; }
/* hand-over (spectators): a diagonal wipe + a centred banner when the next player's session goes live */
body.gws-simple .gws-handover { position: fixed; inset: 0; z-index: 44; pointer-events: none; overflow: hidden; opacity: 0; }
body.gws-simple .gws-handover.on { opacity: 1; }
body.gws-simple .gws-handover .wipe { position: absolute; top: -10%; bottom: -10%; left: -60%; width: 50%; transform: skewX(-14deg);
  background: linear-gradient(90deg, transparent, var(--live-glow) 45%, var(--scrim) 52%, var(--scrim) 100%); }
body.gws-simple .gws-handover.on .wipe { animation: gws-wipe 1.6s var(--ease-io) .1s both; }
@keyframes gws-wipe { from { transform: translateX(0) skewX(-14deg); } to { transform: translateX(420%) skewX(-14deg); } }
body.gws-simple .gws-handover .ho-t { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); display: inline-flex; align-items: center; height: 44px;
  padding-right: 18px; background: var(--panel); box-shadow: var(--shadow-pop); border-radius: var(--r); overflow: hidden;
  font: var(--fw-med) 13px/1 var(--f-label); letter-spacing: var(--track-wide); color: var(--text); }
body.gws-simple .gws-handover.on .ho-t { animation: gws-fade-up .5s var(--ease-out) .4s both; }
body.gws-simple .gws-handover .live-tag { display: inline-flex; align-items: center; gap: 7px; align-self: stretch; margin-right: 14px; padding: 0 14px; background: var(--live); color: #fff; font-weight: var(--fw-bold); }
body.gws-simple .gws-handover .live-tag i { width: 7px; height: 7px; border-radius: 50%; background: #fff; }
@keyframes gws-fade-up { from { opacity: 0; transform: translate(-50%, calc(-50% + 10px)); } }

/* ================================================================================ (c) YOUR TURN */
body.gws-simple #gws_turn { background: var(--scrim); animation: gws-fade-in var(--t-state) var(--ease-out) both; }
@keyframes gws-fade-in { from { opacity: 0; } }
body.gws-simple #gws_turn .burst { position: absolute; left: 50%; top: 50%; width: 900px; height: 900px; margin: -450px 0 0 -450px; border-radius: 50%; pointer-events: none; opacity: var(--burst-a);
  background: radial-gradient(circle, var(--accent-glow) 0%, transparent 62%); }
body.gws-simple #gws_turn .box { position: relative; display: grid; justify-items: center; gap: 16px; padding: 0; text-align: center; max-width: 92vw;
  background: none; border: 0; box-shadow: none; color: var(--text); font: var(--fw-reg) 14px/1.5 var(--f-ui); }
body.gws-simple #gws_turn .slam, body.gws-simple .end-card .slam { margin: 0; font: var(--fw-thin) var(--fs-slam)/.95 var(--f-display); letter-spacing: var(--track-tight); color: var(--text); text-shadow: none; }
body.gws-simple #gws_turn.on .slam { animation: gws-slam var(--t-slam) var(--ease-slam) both; }
@keyframes gws-slam { 0% { opacity: 0; transform: scale(2.3); letter-spacing: .3em; } 60% { opacity: 1; } 100% { transform: scale(1); letter-spacing: var(--track-tight); } }
body.gws-simple #gws_turn .ring { position: relative; width: var(--ring); height: var(--ring); }
body.gws-simple #gws_turn .ring svg { width: 100%; height: 100%; transform: rotate(-90deg); display: block; overflow: visible; }
body.gws-simple #gws_turn .r-bg { fill: var(--panel); stroke: var(--bg-0); stroke-width: 3; }
body.gws-simple #gws_turn .r-fg { fill: none; stroke: var(--accent); stroke-width: 3; stroke-dasharray: 326.73; stroke-dashoffset: 0; transition: stroke-dashoffset var(--t-ui) linear; }
body.gws-simple #gws_turn .r-fg.run { animation: gws-ring var(--ring-s, 10s) linear both; }
@keyframes gws-ring { to { stroke-dashoffset: 326.73; } }
body.gws-simple #gws_turn .r-ticks line { stroke: var(--line-hi); stroke-width: 1.5; }
body.gws-simple #gws_turn .ring::after { content: ""; position: absolute; inset: -8px; border-radius: 50%; box-shadow: 0 0 0 1px var(--accent-glow); animation: gws-halo var(--pulse-turn) ease-out infinite; }
@keyframes gws-halo { from { opacity: 1; transform: scale(.94); } to { opacity: 0; transform: scale(1.12); } }
body.gws-simple #gws_turn .r-num { position: absolute; inset: 0; display: grid; place-items: center; font: var(--fw-thin) 52px/1 var(--f-label); font-variant-numeric: tabular-nums; color: var(--text); }
body.gws-simple #gws_turn .r-num.pop { animation: gws-pop .26s var(--ease-slam); }
@keyframes gws-pop { from { transform: scale(1.35); opacity: .4; } }
body.gws-simple #gws_turn .r-num.low { color: var(--live); } body.gws-simple #gws_turn .ring.low .r-fg { stroke: var(--live); }
body.gws-simple #gws_turn .turn-p { color: var(--dim); font-size: var(--fs-cap); max-width: 460px; }
body.gws-simple #gws_turn.passed .slam { color: var(--warn); } body.gws-simple #gws_turn.passed .burst { display: none; }
body.gws-simple #gws_turn button#gws_turn_go { margin: 0; }
@media (max-width: 560px), (max-height: 300px) {
  body.gws-simple #gws_turn .slam { font-size: 22px !important; letter-spacing: .02em !important; } body.gws-simple #gws_turn .ring { width: 44px; height: 44px; }
  body.gws-simple #gws_turn .r-num { font-size: 18px; } body.gws-simple #gws_turn .ring::after, body.gws-simple #gws_turn .turn-p { display: none; }
  body.gws-simple #gws_turn .box { gap: 4px; } body.gws-simple #gws_turn .ready { height: 28px; padding: 0 14px; } body.gws-simple #gws_turn .ready .ready-t { font-size: 12px; }
  body.gws-simple #gws_turn .ready kbd { display: none; }
}

/* ================================================================================ (d) intro: spotlight + callout boxes + SVG arrows */
body.gws-simple .gws-intro { background: none; color: var(--text); font: var(--fw-reg) 14px/1.4 var(--f-ui); }
body.gws-simple .gws-intro[data-layout=text] { background: var(--scrim); }
body.gws-simple .gws-intro svg.arrows path.dim { fill: var(--spot); stroke: none; }
body.gws-simple .gws-intro svg.arrows path.arrow { stroke: var(--accent); stroke-width: 1.75; fill: none; stroke-dasharray: 1; stroke-dashoffset: 0; }
body.gws-simple .gws-intro svg.arrows path.arrow:not(.on) { display: none; }
body.gws-simple .gws-intro svg.arrows path.arrow.on { animation: gws-draw .42s var(--ease-out) .18s both; }
@keyframes gws-draw { from { stroke-dashoffset: 1; } to { stroke-dashoffset: 0; } }
body.gws-simple .gws-intro svg.arrows marker path { fill: var(--accent); stroke: none; }
body.gws-simple .gws-intro .gws-callout .box { border: 0; border-radius: 0; box-shadow: none; background-color: transparent;
  background-image: linear-gradient(var(--accent), var(--accent)), linear-gradient(var(--accent), var(--accent)), linear-gradient(var(--accent), var(--accent)), linear-gradient(var(--accent), var(--accent)),
                    linear-gradient(var(--accent), var(--accent)), linear-gradient(var(--accent), var(--accent)), linear-gradient(var(--accent), var(--accent)), linear-gradient(var(--accent), var(--accent));
  background-repeat: no-repeat;
  background-size: 16px 3px, 3px 16px, 16px 3px, 3px 16px, 16px 3px, 3px 16px, 16px 3px, 3px 16px;
  background-position: 0 0, 0 0, 100% 0, 100% 0, 0 100%, 0 100%, 100% 100%, 100% 100%; }
body.gws-simple .gws-intro .beat.is-active .gws-callout .box { animation: gws-brk-in .45s var(--ease-slam) both; }
@keyframes gws-brk-in { from { opacity: 0; transform: scale(1.06); } }
body.gws-simple .gws-intro .gws-callout .lbl { display: grid; gap: 4px; width: var(--callout-w); max-width: 80vw; white-space: normal; box-sizing: border-box; padding: 14px 16px 14px 18px;
  border: 0; border-radius: var(--r); background: var(--panel); box-shadow: inset 3px 0 0 var(--accent), var(--shadow-pop); color: var(--text); font: inherit; }
body.gws-simple .gws-intro .gws-callout .lbl .step { font: var(--fw-med) 10px/1 var(--f-label); letter-spacing: var(--track-wide); color: var(--accent); }
body.gws-simple .gws-intro .gws-callout .lbl .ttl { font: var(--fw-med) 19px/1.15 var(--f-display); }
body.gws-simple .gws-intro .gws-callout .lbl .say { font-size: 13px; color: var(--dim); }
body.gws-simple .gws-intro .gws-callout .lbl .say:empty { display: none; }
body.gws-simple .gws-intro .beat.is-active .gws-callout .lbl > * { animation: gws-call-in .38s var(--ease-out) both; }
body.gws-simple .gws-intro .beat.is-active .gws-callout .lbl .say { animation-delay: 60ms; }
@keyframes gws-call-in { from { opacity: 0; transform: translateY(6px); } }
body.gws-simple .gws-intro .gws-intro-card { background: var(--panel); border: 0; border-radius: var(--r); box-shadow: inset 0 3px 0 var(--accent), var(--shadow-pop); padding: 26px 34px; color: var(--text); }
body.gws-simple .gws-intro .gws-intro-card b { font: var(--fw-thin) clamp(26px, 3vw, 42px)/1.1 var(--f-display); color: var(--text); }
body.gws-simple .gws-intro .beat[data-step=go] .gws-intro-card b { color: var(--accent); }
body.gws-simple .gws-intro .gws-intro-card p { color: var(--dim); font-size: clamp(14px, 1.3vw, 18px); }
body.gws-simple .gws-intro[data-layout=callouts][data-motion=full] .beat[data-step=go] .gws-intro-card { background: none; box-shadow: none; padding: 0; }
body.gws-simple .gws-intro[data-layout=callouts][data-motion=full] .beat[data-step=go] .gws-intro-card b { font: var(--fw-thin) var(--fs-go)/1 var(--f-display); color: var(--accent); }
body.gws-simple .gws-intro[data-motion=full] .beat[data-step=go].is-active .gws-intro-card b { animation: gws-go 1.1s var(--ease-slam) both; }
@keyframes gws-go { 0% { opacity: 0; transform: scale(2.6); } 25% { opacity: 1; transform: scale(1); } 70% { opacity: 1; transform: scale(1.04); } 100% { opacity: .9; transform: scale(1.08); } }
body.gws-simple .gws-intro .foot { right: 16px; top: calc(var(--top-h) + 18px); bottom: auto; }
body.gws-simple .gws-intro[data-layout=text] .foot { top: auto; bottom: 6px; right: 8px; }
body.gws-simple .gws-intro .dots { gap: 5px; } body.gws-simple .gws-intro .dots i { width: 22px; height: 3px; border-radius: 0; background: var(--line); transition: background var(--t-ui); }
body.gws-simple .gws-intro .dots i.is-on { background: var(--accent); }
body.gws-simple .gws-intro .skip { display: inline-flex; align-items: center; gap: 8px; height: 30px; padding: 0 12px; border: 0; border-radius: var(--r); cursor: pointer;
  background: var(--panel); color: var(--text); box-shadow: var(--shadow); font: var(--fw-med) var(--fs-cap)/1 var(--f-label); letter-spacing: var(--track-label); }
body.gws-simple .gws-intro .skip:hover { box-shadow: 0 0 0 1px var(--accent); }

/* ================================================================================ (f) round over */
body.gws-simple #gws_ended { background: var(--scrim); color: var(--text); font: var(--fw-reg) 14px/1.5 var(--f-ui); }
body.gws-simple .end-card, body.gws-simple #gws_ended .box.end-card { position: relative; display: grid; justify-items: center; gap: 12px; padding: 30px 46px 26px; max-width: min(620px, 92vw); box-sizing: border-box; text-align: center;
  background: var(--panel); border: 0; border-radius: var(--r); box-shadow: inset 0 3px 0 var(--accent), var(--shadow-pop); color: var(--text); }
body.gws-simple #gws_ended.on .end-card, body.gws-simple .th-end .end-card { animation: gws-card-up var(--t-enter) var(--ease-out) both; }
@keyframes gws-card-up { from { opacity: 0; transform: translateY(24px) scale(.98); } }
body.gws-simple .end-card .eyebrow { margin: 0; }
body.gws-simple .end-card .slam, body.gws-simple #gws_ended .end-card h2.slam { margin: 0; font-size: var(--fs-slam-end); }
body.gws-simple #gws_ended.on .end-card .slam, body.gws-simple .th-end .end-card .slam { animation: gws-slam var(--t-slam) var(--ease-slam) .1s both; }
body.gws-simple .end-card .stats { display: flex; margin: 6px 0 2px; }
body.gws-simple .end-card .stats:empty { display: none; }
body.gws-simple .end-card .stats div { display: grid; gap: 5px; padding: 0 20px; animation: gws-card-in .45s var(--ease-out) both; }
body.gws-simple .end-card .stats div:nth-child(1) { animation-delay: .45s; } body.gws-simple .end-card .stats div:nth-child(2) { animation-delay: .52s; }
body.gws-simple .end-card .stats div:nth-child(3) { animation-delay: .59s; } body.gws-simple .end-card .stats div:nth-child(4) { animation-delay: .66s; }
body.gws-simple .end-card .stats div + div { border-left: 1px solid var(--line); }
body.gws-simple .end-card .stats b { font: var(--fw-thin) 26px/1 var(--f-label); } body.gws-simple .end-card .stats span { font: var(--fw-med) 10px/1 var(--f-label); letter-spacing: var(--track-wide); color: var(--dim); text-transform: uppercase; }
body.gws-simple .end-card .end-p, body.gws-simple .end-card p, body.gws-simple #gws_ended .end-card p { margin: 0; color: var(--dim); font-size: 13px; }
body.gws-simple #gws_ended .end-card p.eyebrow { color: var(--accent); font-size: var(--fs-cap); }
body.gws-simple .end-card p.small, body.gws-simple #gws_ended .end-card p.small { font-size: 11.5px; color: var(--faint); }
body.gws-simple .end-card .end-btns { display: flex; gap: 12px; align-items: center; margin-top: 6px; }

/* ================================================================================ /embed theater (overlay layout < wide; the picker; the ended card) */
body.gws-simple.gws-theater .views figure { background: var(--video-bg); }
body.gws-theater .views figure:nth-child(1), body.gws-theater .views figure:nth-child(3) { border-color: var(--line) !important; }
body.gws-theater:not(.gws-wide) .views figure { padding: 0; box-shadow: none; border-radius: 0; }
body.gws-theater:not(.gws-wide) .views figure::before, body.gws-theater:not(.gws-wide) .views figure::after { display: none; }
body.gws-theater:not(.gws-wide) .mz { inset: 0; }
body.gws-simple #gws_ov { color: var(--text); font-family: var(--f-ui); }
body.gws-simple #gws_ov .pill, body.gws-simple #gws_ov .time { background: var(--glass); border: 0; box-shadow: var(--shadow); color: var(--text); backdrop-filter: none; font-family: var(--f-label); }
body.gws-simple #gws_ov .pill.ok { color: var(--ok); } body.gws-simple #gws_ov .pill.on { color: var(--accent-2); } body.gws-simple #gws_ov .pill.warn { color: var(--warn); } body.gws-simple #gws_ov .pill.bad { color: var(--live); }
body.gws-simple #gws_ov .time.gws_warn { color: var(--warn); } body.gws-simple #gws_ov .time.gws_over { color: var(--live); }
body.gws-simple #gws_ov .btns button, body.gws-simple #gws_ov .chip { background: var(--glass); color: var(--text); border: 0; box-shadow: var(--shadow); backdrop-filter: none; font-family: var(--f-ui); }
body.gws-simple #gws_ov .btns button:hover, body.gws-simple #gws_ov .chip:hover:not(:disabled) { box-shadow: 0 0 0 1px var(--accent); }
body.gws-simple #gws_ov .chip { border-radius: var(--r); position: relative; }
body.gws-simple #gws_ov .chip.sel { color: var(--text); box-shadow: inset 0 -3px 0 var(--accent), var(--shadow); }
body.gws-simple #gws_ov .chip .c-ico { display: none; } body.gws-simple #gws_ov .chip .tag { display: none; }
body.gws-simple #gws_ov .chip .title { font-weight: var(--fw-med); } body.gws-simple #gws_ov .chip.sel .title { color: var(--accent-2); }
body.gws-simple #gws_ov .chip .desc { color: var(--dim); }
body.gws-simple #gws_ov .hint { background: var(--scrim); }
body.gws-simple.gws-pick #gws_ov .hint { background: var(--app-bg); }
body.gws-simple #gws_ov .hint h2, body.gws-simple #gws_ov .hint p { color: var(--text); text-shadow: none; }
body.gws-simple #gws_ov .hint h2 { font-weight: var(--fw-reg); font-family: var(--f-display); }
body.gws-simple #gws_ov .hint p.mdesc, body.gws-simple #gws_ov .hint .sub, body.gws-simple #gws_ov .priv { color: var(--dim); }
body.gws-simple #gws_ov .hint kbd { background: var(--panel); border-color: var(--line); color: var(--text); }
body.gws-simple #gws_ov select.tiny { background: var(--panel); color: var(--text); border: 1px solid var(--line); border-radius: var(--r); }
body.gws-simple #gws_ov .start.ready { height: auto; gap: 8px; padding: clamp(4px, 1vh, 9px) clamp(12px, 2.6vw, 22px); border-radius: var(--r); }
body.gws-simple #gws_ov .start.ready .ready-t { font: var(--fw-med) clamp(11px, 1.5vw + 4px, 14px)/1.2 var(--f-ui); letter-spacing: .06em; }
body.gws-simple #gws_ov .start.ready kbd { height: 1.5em; font-size: 10px; }
body.gws-simple #gws_ov .wait { color: var(--warn); }
body.gws-simple #gws_ov .hint.th-end { background: var(--scrim); }
body.gws-simple #gws_ov .hint .end-card { padding: clamp(8px, 3vh, 28px) clamp(14px, 4vw, 40px); gap: clamp(4px, 1.2vh, 12px); }
body.gws-simple #gws_ov .hint .end-card .slam { font-size: clamp(18px, 5vw, 56px); }
@media (max-width: 700px), (max-height: 420px) { body.gws-simple #gws_ov .hint .end-card .stats, body.gws-simple #gws_ov .hint .end-card .eyebrow { display: none; } }
@media (max-height: 240px) {
  body.gws-simple #gws_ov .start.ready { padding: 3px 12px; } body.gws-simple #gws_ov .start.ready .ready-t { font-size: 11px; line-height: 1.5; }
  body.gws-simple #gws_ov .start.ready kbd { display: none; }
  body.gws-simple #gws_ov .hint .end-card { padding: 6px 12px; gap: 2px; } body.gws-simple #gws_ov .hint .end-card .slam { font-size: 16px; }
}
@media (max-width: 500px) { body.gws-simple #gws_ov .start.ready { padding: 6px 14px; } body.gws-simple #gws_ov .start.ready kbd { display: none; } }
@media (max-width: 480px) and (max-height: 240px) {    /* tiny iframe (348x195): the mode chips as a 2x2 grid so START stays on screen */
  body.gws-simple #gws_ov #th_chips { display: grid; grid-template-columns: 1fr 1fr; width: min(260px, 92vw); }
  body.gws-simple #gws_ov #th_chips .chip { width: auto; }
}

/* theater picker in a big frame (>= 900 x 480): the mode chips grow into the landing's cards */
@media (min-width: 900px) and (min-height: 480px) {
  body.gws-simple.gws-pick #gws_ov .hint h2 { font: var(--fw-thin) clamp(26px, 3vw, 40px)/1.1 var(--f-display); max-width: 900px; }
  body.gws-simple.gws-pick #gws_ov .hint .sub { font-size: 15px; margin-bottom: 8px; }
  body.gws-simple.gws-pick #gws_ov #th_chips { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px; background: var(--line); box-shadow: 0 0 0 1px var(--line); width: min(980px, 90vw); }
  body.gws-simple.gws-pick #gws_ov #th_chips .chip { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; min-height: 170px; padding: 18px; text-align: left;
    border-radius: 0; box-shadow: none; background: var(--panel); font-size: 14px; }
  body.gws-simple.gws-pick #gws_ov #th_chips .chip .c-ico { display: block; width: 30px; height: 30px; margin-bottom: auto; color: var(--text); }
  body.gws-simple.gws-pick #gws_ov #th_chips .chip .c-ico svg { width: 100%; height: 100%; display: block; }
  body.gws-simple.gws-pick #gws_ov #th_chips .chip .title { font: var(--fw-med) 20px/1.1 var(--f-display); color: var(--text); }
  body.gws-simple.gws-pick #gws_ov #th_chips .chip .desc { display: block; max-width: none; font-size: 12.5px; line-height: 1.4; }
  body.gws-simple.gws-pick #gws_ov #th_chips .chip .tag { display: block; position: absolute; right: 14px; top: 14px; font: var(--fw-med) 10px/1 var(--f-label); letter-spacing: var(--track-label); color: var(--accent); }
  body.gws-simple.gws-pick #gws_ov #th_chips .chip.sel { box-shadow: inset 0 -3px 0 var(--accent); } body.gws-simple.gws-pick #gws_ov #th_chips .chip.sel .c-ico { color: var(--accent); }
  body.gws-simple.gws-pick #gws_ov #th_chips .chip:disabled > * { opacity: .45; }
  body.gws-simple.gws-pick #gws_ov .hint p.mdesc { display: none; }
  body.gws-simple.gws-pick #gws_ov select.tiny { height: 44px; min-width: 260px; font-size: 14px; }
  body.gws-simple.gws-pick #gws_ov .start.ready { height: 46px; padding: 0 24px; } body.gws-simple.gws-pick #gws_ov .start.ready .ready-t { font-size: 16px; }
}
/* theater while watching: the banner carries the queue state (no pill / clock duplicates); a 20-px banner in tiny frames */
body.gws-theater.gws-spectate #gws_ov .pill, body.gws-theater.gws-spectate #gws_ov .time { display: none !important; }
@media (max-width: 560px), (max-height: 300px) {
  body.gws-simple.gws-theater #gws_spec { top: 4px; height: 20px; font-size: 9px; }
  body.gws-simple.gws-theater #gws_spec .live-tag { font-size: 9px; padding: 0 6px; gap: 4px; } body.gws-simple.gws-theater #gws_spec .live-tag i { width: 5px; height: 5px; }
  body.gws-simple.gws-theater #gws_spec .spec-t { font-size: 9px; padding: 0 6px; letter-spacing: .06em; }
  body.gws-simple.gws-theater #gws_spec .q-chip { padding: 0 6px; gap: 4px; } body.gws-simple.gws-theater #gws_spec .q-lab, body.gws-simple.gws-theater #gws_spec .sub { display: none; }
  body.gws-simple.gws-theater #gws_spec .q-n { font-size: 11px; height: 14px; line-height: 14px; } body.gws-simple.gws-theater #gws_spec .q-eta { font-size: 9px; }
}

/* ================================================================================ touch keypad, toasts, details */
body.gws-simple #gws_pad .arm { background: var(--panel); border: 0; box-shadow: var(--shadow); border-radius: var(--r); }
body.gws-simple #gws_pad .arm h4 { color: var(--dim); font-family: var(--f-label); }
body.gws-simple #gws_pad button { background: var(--panel); color: var(--text); border: 1px solid var(--line); border-bottom-width: 2px; border-radius: var(--r-cap); font-family: var(--f-label); }
body.gws-simple #gws_pad button.on { background: var(--accent); border-color: var(--accent-2); color: var(--accent-ink); }
body.gws-simple #gws_pad button small { color: var(--dim); } body.gws-simple #gws_pad button.on small { color: var(--accent-ink); }
body.gws-simple #toasts .toast { background: var(--panel); color: var(--text); border: 0; box-shadow: inset 3px 0 0 var(--live), var(--shadow-pop); border-radius: var(--r); }
body.gws-simple #toasts .toast.info { box-shadow: inset 3px 0 0 var(--accent), var(--shadow-pop); }
body.gws-simple #gws_priv { color: var(--dim); }

/* ================================================================================ reduced motion: same states, no movement */
@media (prefers-reduced-motion: reduce) {
  body.gws-simple *, body.gws-simple *::before, body.gws-simple *::after { animation-duration: 1ms !important; animation-iteration-count: 1 !important; animation-delay: 0ms !important; transition-duration: 1ms !important; }
  body.gws-simple .ready .sheen, body.gws-simple #gws_turn .ring::after, body.gws-simple #gws_turn .burst { display: none !important; }
  body.gws-simple #gws_spec .live-tag i { animation: none !important; }
  body.gws-simple #gws_turn .r-fg.run { animation: none !important; }       /* public_spectate.js steps the ring once per second instead */
  body.gws-simple #gws_top .timer.crit .t-num { animation: none !important; }
  body.gws-simple .gws-handover .wipe { display: none; }
}

/* ================================================================================ details drop-down (operator dashboard) */
body.gws-simple #gws_dd { background: var(--glass); box-shadow: var(--shadow-pop); border-radius: var(--r); color: var(--text); font: var(--fw-reg) 13px/1.4 var(--f-ui); }
body.gws-simple #gws_dd .dd-head { background: var(--glass); border-bottom: 1px solid var(--line); }
body.gws-simple #gws_dd .dd-head b { font: var(--fw-med) var(--fs-cap)/1 var(--f-label); letter-spacing: var(--track-label); }
body.gws-simple #gws_dd .dd-k { color: var(--dim); font-size: var(--fs-cap); }
body.gws-simple #gws_dd .dd-links a { color: var(--accent-2); font: var(--fw-reg) var(--fs-cap)/1 var(--f-label); }
body.gws-simple #gws_dd button.act { height: 28px; padding: 0 12px; border: 0; border-radius: var(--r-btn); background: var(--panel); color: var(--text); box-shadow: 0 0 0 1px var(--cap-line);
  font: var(--fw-med) var(--fs-cap)/1 var(--f-label); text-transform: uppercase; letter-spacing: var(--track-label); cursor: pointer; }
body.gws-simple #gws_dd header, body.gws-simple #gws_dd .panel { background: var(--panel); border: 0; box-shadow: var(--shadow); border-radius: var(--r); }
body.gws-simple #gws_dd .badge, body.gws-simple #gws_dd .pill, body.gws-simple #gws_dd .bar, body.gws-simple #gws_dd .spark, body.gws-simple #gws_dd .memtile,
body.gws-simple #gws_dd #camwrap { background: var(--panel-2); border-color: var(--line); }
body.gws-simple #gws_dd .badge b { color: var(--text); }
body.gws-simple #gws_dd .memtile.on { background: var(--accent-wash); border-color: var(--accent); color: var(--text); }
body.gws-simple #gws_dd .panel h2, body.gws-simple #gws_dd .kv .k, body.gws-simple #gws_dd .two .k { color: var(--dim); font-family: var(--f-label); }
body.gws-simple #gws_dd .big, body.gws-simple #gws_dd .kv .v { font-family: var(--f-label); color: var(--text); }
body.gws-simple #gws_dd .ok { color: var(--ok); } body.gws-simple #gws_dd .warn { color: var(--warn); } body.gws-simple #gws_dd .bad { color: var(--live); }
body.gws-simple #gws_dd button, body.gws-simple #gws_dd select { background: var(--panel); color: var(--text); border: 1px solid var(--line); border-radius: var(--r); font-family: var(--f-ui); }
body.gws-simple #gws_dd button:hover { border-color: var(--accent); }
body.gws-simple #gws_dd button.primary { background: var(--accent-wash); border-color: var(--accent); }
body.gws-simple #gws_dd button.rec { color: var(--live); border-color: var(--live); background: var(--live-wash); }
body.gws-simple #gws_dd button.rec.on { background: var(--live); color: #fff; }
body.gws-simple #gws_top .pill.rec::before { animation: blink 1s steps(2) infinite; }
body.gws-simple #gws_top .rec-clock { display: inline-flex; align-items: center; gap: 7px; height: 26px; padding: 0 10px; box-sizing: border-box; border-radius: 999px;
  background: var(--panel); box-shadow: var(--shadow); color: var(--text); font: var(--fw-med) 10.5px/1 var(--f-label); letter-spacing: var(--track-label); white-space: nowrap; flex: none; }
body.gws-simple #gws_top .rec-clock[hidden] { display: none; }
body.gws-simple #gws_top .rec-clock i { width: 7px; height: 7px; border-radius: 50%; background: var(--live); animation: blink 1s steps(2) infinite; }
body.gws-simple #gws_top .rec-clock b { font-weight: var(--fw-med); font-variant-numeric: tabular-nums; }
/* leader mode without a bridge (direct instances): hint under the controls bar; Enter flashes it */
body.gws-simple #gws_leadhint { flex-basis: 100%; margin: 0; padding: 3px 10px; border-radius: var(--r); color: var(--warn-ink);
  font: var(--fw-reg) var(--fs-cap)/1.3 var(--f-label); text-align: center; }
body.gws-simple #gws_leadhint[hidden] { display: none; }
body.gws-simple #gws_leadhint.flash { animation: gws-lhflash .9s var(--ease-out) 1; }
/* in-page GELLO bridge (public_leader_serial.js): hint-row buttons, the manual-bridge line, the L ✓ R ✓ chips, the card status line */
body.gws-simple #gws_leadhint button.act { display: inline-flex; align-items: center; height: 24px; padding: 0 10px; margin: 0 4px; border: 0; border-radius: var(--r-btn);
  background: var(--panel); color: var(--text); font: var(--fw-med) var(--fs-cap)/1 var(--f-label); letter-spacing: var(--track-label); cursor: pointer; box-shadow: var(--shadow); vertical-align: middle; }
body.gws-simple #gws_leadhint button.act:hover { box-shadow: 0 0 0 1px var(--accent); background: var(--accent-wash); }
body.gws-simple #gws_leadhint .man { display: block; margin-top: 2px; color: var(--dim); font-size: 10.5px; }
body.gws-simple #gws_leadhint .man code { font: 10.5px/1.3 var(--f-mono, ui-monospace, Menlo, monospace); color: var(--text); word-break: break-all; }
body.gws-simple #gws_top #gws_lchips { display: inline-flex; align-items: center; gap: 4px; margin-right: 6px; }
body.gws-simple #gws_top #gws_lchips[hidden] { display: none; }
body.gws-simple #gws_top .lchip { height: 24px; padding: 0 9px; border-radius: var(--r-btn); background: var(--panel); display: inline-flex; align-items: center; white-space: nowrap;
  font: var(--fw-med) var(--fs-cap)/1 var(--f-label); letter-spacing: var(--track-label); color: var(--text); box-shadow: var(--shadow); }
body.gws-simple #gws_top .lchip.ok { box-shadow: inset 0 -2px 0 var(--ok), var(--shadow); }
body.gws-simple #gws_top .lchip.bad { box-shadow: inset 0 -2px 0 var(--live), var(--shadow); }
body.gws-simple #gws_top #gws_lchips button.act { height: 24px; padding: 0 8px; }
body.gws-simple #gws_land .mode .lstat { display: block; margin-top: 4px; color: var(--dim); font-size: 10.5px; letter-spacing: 0; }
@keyframes gws-lhflash { 0%, 45% { background: var(--warn-bg); box-shadow: 0 0 0 1px var(--warn-line); } 100% { background: transparent; box-shadow: none; } }

/* Leader-arms setup row (landing, under the cards; theater, under the chips): hardware line + USB grant + calibration buttons */
body.gws-simple .lsetup { margin: 10px 0 0; padding: 10px 12px; border: 1px solid var(--line); border-radius: var(--r); background: var(--panel); color: var(--dim); font-size: 12px; text-align: left; }
body.gws-simple .lsetup[hidden] { display: none; }
body.gws-simple .lsetup .ls-row { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; }
body.gws-simple .lsetup .ls-k { font: var(--fw-med) 10px/1 var(--f-label); letter-spacing: var(--track-wide); color: var(--faint); text-transform: uppercase; }
body.gws-simple .lsetup .ls-v { color: var(--text); }
body.gws-simple .lsetup button.act { display: inline-flex; align-items: center; height: 26px; padding: 0 10px; border: 0; border-radius: var(--r-btn); background: var(--panel-2, var(--bg)); color: var(--text); font: var(--fw-med) 11px/1 var(--f-label); cursor: pointer; box-shadow: 0 0 0 1px var(--line); }
body.gws-simple .lsetup button.act:hover { box-shadow: 0 0 0 1px var(--accent); background: var(--accent-wash); }
body.gws-simple .lsetup .ls-need { margin: 8px 0 0; font-size: 11.5px; line-height: 1.45; color: var(--dim); }
body.gws-simple .lsetup .ls-msg { margin: 8px 0 0; padding: 4px 8px; border-radius: var(--r); background: var(--warn-bg); color: var(--warn-ink); font-size: 12px; }
body.gws-simple .lsetup .ls-need kbd { font: 10px/1 var(--f-mono, ui-monospace, monospace); padding: 1px 4px; border-radius: 3px; box-shadow: inset 0 -1px 0 var(--line), 0 0 0 1px var(--line); }
body.gws-simple .lsetup.compact { margin: 6px auto 0; max-width: 560px; padding: 6px 10px; font-size: 11px; }
body.gws-simple .lsetup.compact .ls-need { margin-top: 4px; font-size: 10.5px; }
@media (max-width: 700px), (max-height: 420px) { body.gws-simple #gws_ov .lsetup.compact .ls-need { display: none; } }
/* GELLO calibration stepper (modal over the page: home pose -> left trigger -> right trigger) */
body.gws-simple #gws_cal { position: fixed; inset: 0; z-index: 60; display: grid; place-items: center; background: var(--scrim); color: var(--text); font: var(--fw-reg) 14px/1.5 var(--f-ui); }
body.gws-simple #gws_cal[hidden] { display: none; }
body.gws-simple #gws_cal .cal-card { text-align: left; justify-items: stretch; max-width: min(720px, 94vw); max-height: 92vh; overflow: auto; }
body.gws-simple #gws_cal .cal-card .slam { font-size: clamp(20px, 3.4vw, 34px); }
body.gws-simple #gws_cal .cal-p { margin: 0; color: var(--text); font-size: 13.5px; }
body.gws-simple #gws_cal .cal-pose b { font: var(--fw-med) 10px/1 var(--f-label); letter-spacing: var(--track-wide); color: var(--accent); text-transform: uppercase; }
body.gws-simple #gws_cal .cal-pose ul { margin: 6px 0 0; padding-left: 18px; color: var(--dim); font-size: 12.5px; }
body.gws-simple #gws_cal .cal-pose:empty, body.gws-simple #gws_cal .cal-live:empty, body.gws-simple #gws_cal .cal-warn:empty { display: none; }
body.gws-simple #gws_cal .cal-live table { border-collapse: collapse; font: 11.5px/1.4 var(--f-mono, ui-monospace, monospace); color: var(--dim); }
body.gws-simple #gws_cal .cal-live th, body.gws-simple #gws_cal .cal-live td { padding: 2px 8px; text-align: right; border-bottom: 1px solid var(--line); }
body.gws-simple #gws_cal .cal-live td:first-child { text-align: left; color: var(--text); }
body.gws-simple #gws_cal .cal-warn { margin: 0; color: var(--warn-ink); font-size: 12.5px; }
body.gws-simple #gws_cal .end-btns { justify-content: flex-start; }
body.gws-simple #gws_cal button.act { display: inline-flex; align-items: center; height: 32px; padding: 0 12px; border: 0; border-radius: var(--r-btn); background: var(--panel); color: var(--text); font: var(--fw-med) 11px/1 var(--f-label); cursor: pointer; box-shadow: 0 0 0 1px var(--line); }