/* Reset, type fragments, .hidden — shared by every surface. */
/* ── Reset ──────────────────────────────────────────────── */
* { box-sizing: border-box; }
html, body { height: 100%; margin: 0; }
body {
  font-family: var(--body);
  background: var(--black);
  color: var(--white);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  overscroll-behavior: none;
  user-select: none;
  -webkit-user-select: none;
  -webkit-tap-highlight-color: transparent;
}
a { color: var(--red); text-decoration: none; }
button { font: inherit; color: inherit; }

/* (court-grid background removed — plain surface) */

/* Transparent surfaces — let the grid show through */
.surface, .shell, .umpire, .viewer, .login, .setup {
  background: transparent;
}
/* Broadcast TV scoreboard carries the brand pattern motif */
.viewer { background: #000 url('../img/pattern.png') center / cover no-repeat; }

/* ── Type fragments ─────────────────────────────────────── */
.eyebrow   { font-family: var(--body); font-size: 11px; font-weight: 600;
             letter-spacing: 0.34em; text-transform: uppercase; color: var(--red); }
.smallcaps { font-family: var(--body); font-size: 10px; font-weight: 600;
             letter-spacing: 0.24em; text-transform: uppercase; color: var(--stone); }
/* .script / .serif kept for index.html markup compatibility */
.script    { font-family: var(--display); color: var(--red);
             letter-spacing: 0.02em; font-style: normal; }
.serif     { font-family: var(--head); font-weight: 700; }
.muted     { color: var(--muted); }

/* ── Hidden ─────────────────────────────────────────────── */
.hidden { display: none !important; }