/* The watch view: one machine, one lead, one clock. Details stay opt-in. */
.live-arena .live-stage { max-width: 1240px; margin: auto; padding: 0 32px 32px; min-height: calc(100svh - 116px); }
.live-arena .stage-rule { display: none; }
.live-arena .hero-copy { padding: 24px 0 22px; text-align: left; }
.live-arena .hero-copy p { font-size: 10px; letter-spacing: .06em; }
.live-arena .hero-copy h1 { font-size: clamp(32px, 4.4vw, 58px); line-height: .98; letter-spacing: -.055em; }
.live-arena .hero-line { justify-content: flex-start; font-size: 15px; margin-top: 12px; gap: 6px 16px; flex-wrap: wrap; color: var(--muted); }
.live-arena .hero-line strong { color: var(--ink); font-weight: 600; }
.arena-layout { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(340px, 1fr); border: 1px solid var(--ink); }
.arena-machine { display: flex; flex-direction: column; min-width: 0; justify-content: center; }
.live-arena .button-zone { flex: 1; width: 100%; min-height: 310px; grid-template-rows: auto; overflow: hidden; }
.live-arena .button-machine { width: 100%; max-width: 540px; }
.live-arena .button-zone::after { display: none; }
.live-arena .machine-label { display: none; }
.live-arena .press-effects { inset: 0; }
.live-arena .live-receipt { width: 100%; margin: 0; min-height: 98px; padding: 18px; border: 0; grid-template-columns: 38px minmax(0, 1fr) auto; gap: 12px; }
.live-arena .receipt-counter { display: none; }
.live-arena .receipt-mark, .live-arena .receipt-mark img { width: 36px; height: 36px; }
.live-arena .receipt-copy strong { font-size: 20px; line-height: 1.15; white-space: normal; overflow-wrap: anywhere; }
.live-arena .receipt-copy strong span { font-weight: 500; }
.live-arena .receipt-copy > span { font-size: 8px; line-height: 1.5; }
.live-arena .receipt-copy small { font-size: 8px; }
.live-arena .live-receipt > a { display: flex; min-height: 44px; padding: 0 0 0 12px; font-size: 9px; }
.live-arena .button-round { width: 100%; margin: 0; border: 0; border-left: 1px solid var(--ink); display: block; min-height: 0; overflow: visible; }
.live-arena .round-heading { grid-template-columns: 1fr auto; padding: 18px 24px; border: 0; border-bottom: 1px solid var(--rule); gap: 12px; align-items: center; }
.live-arena .round-heading > span { font-size: 9px; }
.live-arena .round-heading > strong { font-size: 18px; letter-spacing: -.06em; }
.crown-holder { padding: 24px 24px 22px; background: var(--buy); border-bottom: 1px solid var(--ink); }
.crown-holder > span { display: block; font-size: 9px; font-weight: 700; }
.crown-holder > strong { display: block; margin: 10px 0 12px; font: 900 clamp(28px, 3.3vw, 46px)/.96 "Hanken Grotesk", Arial, sans-serif; letter-spacing: -.05em; overflow-wrap: anywhere; }
.crown-holder > small { display: block; font: 14px/1.4 "Hanken Grotesk", Arial, sans-serif; text-transform: none; overflow-wrap: anywhere; }
.button-round[data-state="syncing"] .crown-holder, .button-round[data-state="delayed"] .crown-holder { background: #eef0e8; }
.live-arena .round-board { display: block; padding: 20px 24px 16px; }
.live-arena .round-legend { justify-content: space-between; font-size: 9px; color: var(--muted); margin-bottom: 9px; }
.live-arena .round-track { height: auto; display: block; border: 0; background: transparent; overflow: visible; }
.score-row { display: grid; grid-template-columns: 18px 28px minmax(0, 1fr) auto; align-items: center; gap: 10px; padding: 11px 0; min-height: 50px; border-bottom: 1px solid var(--rule); font-size: 11px; }
.score-row img { border: 1px solid var(--rule); border-radius: 50%; object-fit: cover; }
.score-row b { overflow-wrap: anywhere; }
.score-row strong { font-size: 18px; font-variant-numeric: tabular-nums; }
.score-rank { color: var(--muted); font-size: 9px; }
.is-leading .score-rank { color: #506700; }
.live-arena .round-empty-label { min-height: 120px; display: flex; align-items: center; font: 14px/1.5 "Hanken Grotesk", Arial, sans-serif; text-transform: none; margin: 0; }
.round-more summary { min-height: 44px; display: flex; align-items: center; justify-content: space-between; cursor: pointer; font-size: 10px; text-transform: none; list-style: none; }
.round-more summary::after { content: "+"; font-size: 18px; }
.round-more[open] summary::after { content: "−"; }
.round-more summary::-webkit-details-marker, .live-details summary::-webkit-details-marker { display: none; }
.live-arena .round-freshness { margin-top: 8px; display: block; white-space: normal; font-size: 9px; line-height: 1.5; text-transform: none; }
.round-result { padding: 17px 24px 19px; background: #eeeee8; border-top: 1px solid var(--rule); }
.round-result > span { display: block; color: var(--muted); font-size: 9px; }
.round-result strong { display: block; margin: 7px 0 6px; font: 800 20px/1.1 "Hanken Grotesk", Arial, sans-serif; letter-spacing: -.02em; overflow-wrap: anywhere; }
.round-result small { display: block; font-size: 9px; line-height: 1.5; color: var(--muted); text-transform: none; }
.is-result-new { animation: result-arrival 1600ms ease-out; }
@keyframes result-arrival { 0%, 25% { background: var(--buy); } 100% { background: #eeeee8; } }
.live-details { margin-top: 24px; border-top: 1px solid var(--rule); border-bottom: 1px solid var(--rule); }
.live-details > summary { display: flex; justify-content: space-between; align-items: center; min-height: 58px; cursor: pointer; list-style: none; font: 10px "Spline Sans Mono", monospace; }
.live-details > summary span:last-child { font-size: 22px; }
.live-details[open] > summary span:last-child { transform: rotate(45deg); }
.live-arena .metrics { width: 100%; margin: 0; grid-template-columns: repeat(5, minmax(0, 1fr)); border-top: 1px solid var(--rule); }
.live-arena .metrics > div { min-width: 0; }
.live-arena .metrics .stage-register { position: static; width: auto; height: auto; display: block; }
.live-arena .metrics .stage-register strong { margin: 6px 0; font-size: 26px; line-height: 1; }
.live-arena .recent-events { width: 100%; margin: 20px 0; }
.arena-method { max-width: 790px; font-size: 13px; line-height: 1.6; color: var(--muted); margin: 24px 0; }
.arena-method a { text-decoration: underline; white-space: nowrap; }
.live-arena .sound-control { min-height: 44px; width: auto; padding: 0 12px; }
.live-arena .sound-label { display: inline; }
.live-arena .sound-control::after, .live-arena .sound-bars { display: none; }
.live-arena .sound-control > i { animation: none; }
.live-arena .volume-control { display: none; }
.live-arena[data-sound="on"] .volume-control { display: flex; }
.live-arena .volume-control input { height: 44px; }
.live-arena .topbar .bb-nav-menu--compact > summary { min-height: 44px; }
.live-arena .topbar .bb-nav-menu--compact .bb-nav-panel { width: min(420px, calc(100vw - 64px)); max-height: calc(100svh - 130px); overflow-y: auto; }
.live-arena .footer-rail { min-height: 52px; font-size: 9px; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.live-arena :focus-visible { outline: 3px solid #5972ff; outline-offset: 4px; }
.live-arena [hidden] { display: none !important; }
.live-arena.overlay-mode .arena-layout { display: block; border: 0; }
.live-arena.overlay-mode .live-details { display: none; }
.live-arena.overlay-mode .button-zone { min-height: 0; }

@media (max-width: 1000px) {
  .live-arena .topbar { grid-template-columns: 1fr auto; padding: 8px 20px; row-gap: 6px; }
  .live-arena .topbar-center { display: flex; grid-column: 1 / -1; grid-row: 2; min-height: 28px; font-size: 9px; }
  .arena-layout { grid-template-columns: minmax(0, 1fr) minmax(320px, .9fr); }
  .live-arena .live-stage { padding: 0 20px 24px; }
  .live-arena .live-receipt { padding: 14px; gap: 8px; }
  .live-arena .receipt-copy strong { font-size: 16px; }
  .live-arena .utilities { gap: 12px; }
  .live-arena .signal-controls { border: 0; padding: 0; }
}
@media (max-width: 700px) {
  .live-arena .live-stage { padding: 0 14px 20px; }
  .live-arena .topbar { padding: 6px 14px; }
  .live-arena .hero-copy { padding: 25px 0 20px; }
  .live-arena .hero-copy h1 { font-size: clamp(29px, 6.7vw, 43px); letter-spacing: -.055em; }
  .live-arena .hero-line { display: block; margin-top: 10px; font-size: 13px; line-height: 1.5; }
  .live-arena .hero-line span, .live-arena .hero-line strong { display: block; }
  .arena-layout { display: block; }
  .live-arena .button-zone { min-height: 0; height: auto; }
  .live-arena .button-machine { width: min(100%, 440px); }
  .live-arena .button-round { border-left: 0; }
  .live-arena .round-heading { padding: 16px 18px; }
  .crown-holder { padding: 20px 18px; }
  .crown-holder > strong { font-size: 40px; }
  .live-arena .round-board { padding: 17px 18px 14px; }
  .round-result { padding: 17px 18px; }
  .live-arena .live-receipt { grid-template-columns: 28px minmax(0, 1fr) auto; min-height: 94px; }
  .live-arena .receipt-mark, .live-arena .receipt-mark img { width: 28px; height: 28px; }
  .live-arena .live-receipt > a { font-size: 8px; padding-left: 8px; }
  .live-arena .receipt-copy strong { font-size: 17px; }
  .live-arena .receipt-copy strong span { display: block; font-size: 13px; }
  .live-arena .sound-control { min-width: 92px; gap: 5px; font-size: 9px; }
  .live-arena[data-sound="on"] .volume-control { display: none; }
  .live-arena .metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .live-arena .metrics > div { border: 0; border-bottom: 1px solid var(--rule); }
  .live-arena .metrics > div:nth-child(even) { border-left: 1px solid var(--rule); }
  .live-arena .metrics > div:last-child { grid-column: 1 / -1; }
  .live-arena .footer-rail > span:nth-child(2) { display: block; }
  .live-arena .footer-rail > a { display: none; }
}