/* Television layout: one design unit is 1px at 1920 × 1080, 2px at 4K. */
@media (min-width:1101px) {
  body[data-design="d"] {
    --tv-u:min(.052083333vw,.092592593vh);
    --board-top:calc(340 * var(--tv-u));
    --board-bottom:calc(108 * var(--tv-u));
    --panel-padding:calc(24 * var(--tv-u));
  }
  body[data-design="d"] .stage { height:100vh; height:100dvh; min-height:0; }
  body[data-design="d"] .backdrop:before { inset:calc(18 * var(--tv-u)); border-radius:calc(27 * var(--tv-u)); }
  body[data-design="d"] .brandbar { top:calc(16 * var(--tv-u)); height:calc(128 * var(--tv-u)); }
  body[data-design="d"] .company-logo { width:calc(460 * var(--tv-u)); max-width:none; }
  body[data-design="d"] .fullscreen { width:calc(76 * var(--tv-u)); height:calc(76 * var(--tv-u)); border-width:calc(2 * var(--tv-u)); border-radius:calc(20 * var(--tv-u)); box-shadow:calc(4 * var(--tv-u)) calc(4 * var(--tv-u)) 0 #426f5b; }
  body[data-design="d"] .fullscreen svg { width:calc(34 * var(--tv-u)); height:calc(34 * var(--tv-u)); }
  body[data-design="d"] .ensemble { top:calc(125 * var(--tv-u)); height:calc(190 * var(--tv-u)); left:11%; right:11%; }
  body[data-design="d"] .character { height:calc(190 * var(--tv-u)); max-width:calc(260 * var(--tv-u)); }
  body[data-design="d"] .character:before { border-width:calc(2 * var(--tv-u)); border-radius:calc(52 * var(--tv-u)) calc(52 * var(--tv-u)) calc(18 * var(--tv-u)) calc(18 * var(--tv-u)); }
  body[data-design="d"] .character-jester { transform:translateY(calc(-6 * var(--tv-u))); }
  body[data-design="d"] .shape-3 { left:7%; right:7%; top:calc(315 * var(--tv-u)); height:calc(9 * var(--tv-u)); border-width:calc(2 * var(--tv-u)); }
  body[data-design="d"] .title { border-width:calc(3 * var(--tv-u)); border-radius:calc(24 * var(--tv-u)); box-shadow:calc(7 * var(--tv-u)) calc(7 * var(--tv-u)) 0 #4e826b; }
  body[data-design="d"] .title:before { inset:calc(9 * var(--tv-u)); border-radius:calc(14 * var(--tv-u)); }
  body[data-design="d"] h1 { font-size:calc(78 * var(--tv-u)); text-shadow:calc(3 * var(--tv-u)) calc(3 * var(--tv-u)) 0 #fdf5d9; }
  body[data-design="d"] .board-shell { border-width:calc(3 * var(--tv-u)); border-radius:calc(25 * var(--tv-u)); box-shadow:calc(8 * var(--tv-u)) calc(8 * var(--tv-u)) 0 #4e826b; }
  body[data-design="d"] .board-shell:before { inset:calc(9 * var(--tv-u)); border-radius:calc(14 * var(--tv-u)); }

  body[data-design="d"] .rank-card {
    display:grid;
    grid-template-columns:minmax(0,42fr) minmax(0,58fr);
    grid-template-rows:auto auto auto;
    grid-template-areas:"avatar rank" "avatar name" "avatar amount";
    align-content:center; align-items:center; justify-items:center;
    gap:calc(24 * var(--tv-u)) calc(52 * var(--tv-u));
    padding:calc(24 * var(--tv-u)) calc(32 * var(--tv-u));
    text-align:center;
  }
  body[data-design="d"] .avatar-wrap { grid-area:avatar; justify-self:center; width:min(100%,calc(480 * var(--tv-u))); height:auto; aspect-ratio:1; padding:calc(14 * var(--tv-u)); border-width:calc(3 * var(--tv-u)); border-radius:calc(58 * var(--tv-u)); box-shadow:calc(10 * var(--tv-u)) calc(10 * var(--tv-u)) 0 #beacd0; }
  body[data-design="d"] .avatar-img { border-radius:calc(42 * var(--tv-u)); }
  body[data-design="d"] .rank-num { grid-area:rank; align-self:end; font-size:calc(100 * var(--tv-u)); line-height:1; }
  body[data-design="d"] .member-name { grid-area:name; width:100%; max-width:100%; font-size:calc(96 * var(--tv-u)); line-height:1.16; letter-spacing:.02em; }
  body[data-design="d"] .member-amount { grid-area:amount; align-self:start; max-width:100%; font-size:calc(150 * var(--tv-u)); line-height:1.08; }
  body[data-design="d"] .member-amount small { margin-right:calc(7 * var(--tv-u)); }

  body[data-design="d"] .viewport.board-mode { gap:calc(3 * var(--tv-u)); }
  body[data-design="d"] .board-row { grid-template-columns:calc(47 * var(--tv-u)) calc(52 * var(--tv-u)) minmax(0,1fr) auto; gap:calc(20 * var(--tv-u)); min-height:calc(55 * var(--tv-u)); max-height:calc(76 * var(--tv-u)); padding:0 calc(16 * var(--tv-u)); border-radius:calc(9 * var(--tv-u)); }
  body[data-design="d"] .br-rank { font-size:calc(25 * var(--tv-u)); }
  body[data-design="d"] .br-avatar { width:calc(52 * var(--tv-u)); height:calc(52 * var(--tv-u)); border-radius:calc(13 * var(--tv-u)); }
  body[data-design="d"] .br-name { font-size:calc(27 * var(--tv-u)); }
  body[data-design="d"] .br-amount { font-size:calc(31 * var(--tv-u)); }
  body[data-design="d"] .br-amount small { margin-right:calc(5 * var(--tv-u)); }
  body[data-design="d"] .controls { bottom:calc(28 * var(--tv-u)); gap:calc(16 * var(--tv-u)); }
  body[data-design="d"] .control,body[data-design="d"] .page-button { height:calc(60 * var(--tv-u)); border-width:calc(2 * var(--tv-u)); border-radius:calc(13 * var(--tv-u)); box-shadow:calc(4 * var(--tv-u)) calc(4 * var(--tv-u)) 0 #4e826b; }
  body[data-design="d"] .control { min-width:calc(180 * var(--tv-u)); padding:0 calc(20 * var(--tv-u)); gap:calc(10 * var(--tv-u)); font-size:calc(18 * var(--tv-u)); }
  body[data-design="d"] .page-button { width:calc(60 * var(--tv-u)); }
  body[data-design="d"] .pager { gap:calc(7 * var(--tv-u)); }
  body[data-design="d"] .controls svg { width:calc(23 * var(--tv-u)); height:calc(23 * var(--tv-u)); }
  body[data-design="d"] .control.is-on { box-shadow:calc(4 * var(--tv-u)) calc(4 * var(--tv-u)) 0 #4e3d66; }
}
