/* Projector view. Charcoal panel with the grid motif, as the house style
   prescribes for heroes and dark surfaces. Readable from the back row. */
* { box-sizing: border-box; }
body { margin:0; background: var(--neutral-700); color:#fff;
       font-family: var(--font-sans); }
.board { padding: var(--sp-7) var(--sp-8); position: relative; min-height: 100vh; }
.board::before {
  content:''; position:absolute; inset:0; pointer-events:none; opacity:.04;
  background-image:
    repeating-linear-gradient(to right,  #fff 0 1px, transparent 1px 96px),
    repeating-linear-gradient(to bottom, #fff 0 1px, transparent 1px 96px);
}
.board > * { position: relative; }
.board-head { display:flex; align-items:flex-end; gap:var(--sp-7); margin-bottom:var(--sp-6); }
.board-head h1 { font-size:40px; margin:0; font-weight:800; letter-spacing:-.02em; }
.board-head .eyebrow { color:rgba(255,255,255,.55); margin:0 0 2px;
                       font-size:11px; text-transform:uppercase; letter-spacing:.1em; }
.legend { margin-left:auto; color:rgba(255,255,255,.6); font-size:15px;
          display:flex; align-items:center; gap:var(--sp-2); }
.legend .badge { margin-left: var(--sp-4); }
.board table { width:100%; border-collapse:collapse; }
.board th, .board td { padding:var(--sp-3) var(--sp-2); text-align:left; }
.board thead th { font-size:12px; font-weight:600; text-transform:uppercase;
                  letter-spacing:.1em; color:rgba(255,255,255,.5);
                  border-bottom:1px solid rgba(255,255,255,.14); }
.board tbody tr { border-bottom:1px solid rgba(255,255,255,.09); }
.board .rank { width:3.5rem; }
.board .finding { width:4rem; text-align:center; }
.board .points { text-align:right; }
.board tbody .rank { font-family:var(--font-mono); color:rgba(255,255,255,.45); font-size:22px; }
.board tbody .name { font-size:30px; font-weight:700; letter-spacing:-.02em; }
.board tbody .points { font-family:var(--font-mono); font-variant-numeric:tabular-nums;
                       font-size:30px; font-weight:500; }
.badge { display:inline-block; width:2.25rem; height:2.25rem; line-height:2.25rem;
         border-radius:var(--radius-md); text-align:center; font-size:17px;
         background:rgba(255,255,255,.08); color:rgba(255,255,255,.3); }
.badge.done  { background:var(--sage-500);  color:#1e3d10; font-weight:700; }
.badge.first { background:var(--mauve-600); color:#fff;    font-weight:700; }
#empty { color:rgba(255,255,255,.55); font-size:20px; margin-top:var(--sp-6); }
#empty code { font-family:var(--font-mono); }
.wordmark { display:inline-block; line-height:1; color:#fff; }
.wordmark .name { font-weight:800; font-size:15px; letter-spacing:.34em;
                  text-indent:.34em; display:block; }
.wordmark .rule { display:block; height:3px; background:currentColor; margin-top:3px; }

.briefinglink { color:rgba(255,255,255,.75); margin-right:var(--sp-4); }
