/* The read-only "table screen" (public/js/views/display.js): a big-format
   layout for a laptop or TV across the room, not a phone in a hand. It
   reuses the felt/card/avatar primitives from the ordinary table view, just
   inside its own wider shell - the header/footer chrome built for a phone's
   header chips and thumb-reach footer buttons has nothing to do here. */

body.displaymode header,body.displaymode footer{display:none}
body.displaymode main{max-width:1400px;padding:1.4rem 2rem 2rem}
body.displaymode{font-size:18px}

.dhead{display:flex;align-items:baseline;justify-content:space-between;
  margin-bottom:1rem;flex-wrap:wrap;gap:.5rem}
.dtitle{font-size:1.6rem;font-weight:800}
.dcode{font-size:2.2rem;font-weight:850;letter-spacing:.12em;color:var(--gold);
  font-variant-numeric:tabular-nums}

.dfelt{padding:1.4rem 1.6rem}
.dseats{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));
  gap:1rem;margin-bottom:.8rem}
.dseat{text-align:center;padding:.7rem .5rem;border-radius:var(--r);
  background:rgba(0,0,0,.18);transition:opacity .25s,transform .3s var(--ease)}
.dseat.out{opacity:.55}
.dseat.up{background:rgba(242,195,91,.14);box-shadow:inset 0 0 0 1px rgba(242,195,91,.4)}
.dtop{display:flex;flex-direction:column;align-items:center;gap:.3rem}
.dseat .av{width:52px;height:52px;font-size:1.1rem}
.dnm{font-weight:700;font-size:1rem}
.dpts{font-size:1.5rem;font-weight:850;font-variant-numeric:tabular-nums}
.dhand{display:flex;flex-wrap:wrap;gap:3px;justify-content:center;margin-top:.4rem;min-height:32px}

.dticker{list-style:none;margin:1rem 0 0;padding:.8rem 1rem;border-radius:var(--r2);
  background:rgba(0,0,0,.22);max-height:9rem;overflow:hidden;
  display:flex;flex-direction:column-reverse;gap:.3rem;font-size:.92rem;color:var(--dim)}
.dticker .dchat b{color:var(--gold)}

.dgone{padding:3rem 1rem;text-align:center;font-size:1.3rem;color:var(--dim)}

@media (max-width:820px){
  .dcode{font-size:1.6rem}
  .dtitle{font-size:1.25rem}
}