#live-player-panel[hidden],#live-chat-view[hidden]{display:none!important}
#live-player-panel{height:min(850px,85dvh);min-height:0;border:2px solid #8b5cf6;border-radius:25px;overflow:hidden;background:#140b2c;display:flex;flex-direction:column;box-shadow:0 12px 35px #0005;color:white}
#live-play-now,#live-viewing-area .watch-call-studio-button{color:#fff;background:linear-gradient(180deg,#a77af0 0%,#7945cc 48%,#6330b3 100%);border:1px solid #d2b4ff;border-radius:10px;padding:7px 15px;font-weight:800;letter-spacing:.02em;box-shadow:inset 0 1px 0 #ffffff65,0 4px 0 #3b176e,0 6px 12px #28104445;text-shadow:0 1px 1px #30105c80;transition:transform .16s ease,box-shadow .16s ease,filter .16s ease;margin-bottom:4px}
#live-play-now:hover,#live-viewing-area .watch-call-studio-button:hover{color:#fff;filter:brightness(1.1);transform:translateY(-2px);box-shadow:inset 0 1px 0 #ffffff65,0 6px 0 #3b176e,0 8px 15px #28104455}
#live-play-now:active,#live-viewing-area .watch-call-studio-button:active{transform:translateY(3px);box-shadow:inset 0 1px 0 #ffffff45,0 1px 0 #3b176e}
#live-play-now:focus-visible,#live-viewing-area .watch-call-studio-button:focus-visible{outline:3px solid #d9c5ff;outline-offset:4px}
@media(prefers-reduced-motion:reduce){#live-play-now,#live-viewing-area .watch-call-studio-button{transition:none}}
/* Preserve each stream control's original palette; add depth and motion only. */
#live-viewing-area .watch-call-studio-button{--button-face:#dc3545;--button-hover:#bb2d3b;--button-edge:#942330;background:var(--button-face);border:0;border-radius:999px;padding:.72rem 1rem;letter-spacing:normal;text-shadow:none;box-shadow:inset 0 1px 0 #ffffff55,0 4px 0 var(--button-edge),0 7px 14px #0003}
#live-viewing-area .watch-card-checker-button{--button-face:#6d28d9;--button-hover:#5b21b6;--button-edge:#411781}
#live-viewing-area .watch-call-studio-button:hover{background:var(--button-hover);filter:none;box-shadow:inset 0 1px 0 #ffffff55,0 6px 0 var(--button-edge),0 9px 16px #0003}
#live-viewing-area .watch-call-studio-button:active{box-shadow:inset 0 1px 0 #ffffff35,0 1px 0 var(--button-edge)}
.live-player-toolbar{display:flex;align-items:center;gap:4px;padding:8px;background:#271148;flex:none}
#live-player-panel.has-game-controls .live-player-toolbar{display:none}
.live-player-toolbar button{border:1px solid #b7a2d955;border-radius:8px;color:#fff;background:#ffffff12;font:600 12px system-ui;padding:9px 7px;cursor:pointer;white-space:nowrap}
.live-player-toolbar button:hover{background:#ffffff25}
.live-player-toolbar #live-player-drag{margin-right:auto;touch-action:none;cursor:grab}
#live-player-detach{color:#ffe35e}
#live-game-frame{display:block;flex:1;width:100%;min-height:0;border:0;background:#140b2c}
#live-player-notice{margin:0;padding:8px 12px;font:13px system-ui;background:#4b286b}
#live-player-panel:not(.is-floating){border:0;border-radius:0;box-shadow:none}
#live-player-panel:not(.is-floating) .live-player-toolbar{background:#1a1a1a;border-bottom:1px solid #ffffff12}
#live-player-panel:not(.is-floating) .live-player-toolbar button{border-radius:5px}
#live-player-panel.is-floating{position:fixed;z-index:1080;width:min(332px,calc(100vw - 16px));height:min(780px,75dvh);min-height:0;left:16px;top:12px}
#live-player-panel.is-floating{border:2px solid #64738b;border-radius:27px;background:#071126}
#live-player-panel.is-floating .live-player-toolbar{position:absolute;z-index:3;top:7px;left:11px;right:11px;padding:0;background:transparent}
#live-player-panel.is-floating .live-player-toolbar{display:none}
#live-player-panel.is-floating .live-player-toolbar button{background:#071126a6;backdrop-filter:blur(8px);border-color:#ffffff35;padding:6px 9px}
#live-player-panel.is-floating #live-game-frame{height:100%;flex:1;border-radius:25px;background:transparent}
#live-player-panel.is-floating #live-player-notice{position:absolute;z-index:4;top:40px;left:10px;right:10px;border-radius:8px}
#live-player-panel.is-dragging iframe{pointer-events:none}
#live-viewing-area:fullscreen,#live-viewing-area.is-expanded{background:#05020b;width:100%;height:100dvh;overflow:hidden}
#live-viewing-area.is-expanded{position:fixed;inset:0;z-index:1070}
#live-viewing-area:fullscreen .live-stream-page,#live-viewing-area.is-expanded .live-stream-page{padding:0!important;margin:0!important;max-width:none;height:100%}
#live-viewing-area:fullscreen .live-watch-row,#live-viewing-area.is-expanded .live-watch-row{height:100%;margin:0}
#live-viewing-area:fullscreen .live-watch-row>.col-xl-9,#live-viewing-area.is-expanded .live-watch-row>.col-xl-9{width:100%;height:100%}
#live-viewing-area:fullscreen .watch-stage,#live-viewing-area.is-expanded .watch-stage{height:100%;padding:0}
#live-viewing-area:fullscreen .watch-player-wrap,#live-viewing-area.is-expanded .watch-player-wrap{height:100%;min-height:0}
#live-viewing-area:fullscreen #stream-player-frame-shell,#live-viewing-area.is-expanded #stream-player-frame-shell{height:100%;padding:0;border-radius:0}
#live-viewing-area:fullscreen .watch-meta-bar,#live-viewing-area.is-expanded .watch-meta-bar,#live-viewing-area:fullscreen #live-chat-view,#live-viewing-area.is-expanded #live-chat-view{display:none!important}
#live-viewing-area:fullscreen #live-side-column,#live-viewing-area.is-expanded #live-side-column{width:0;padding:0}
#live-viewing-area:fullscreen .watch-meta-bar,#live-viewing-area.is-expanded .watch-meta-bar{display:flex!important;position:fixed;right:16px;bottom:16px;z-index:1081;background:transparent;padding:0;min-height:0}
#live-viewing-area:fullscreen .watch-meta-bar>:not(#live-player-fullscreen),#live-viewing-area.is-expanded .watch-meta-bar>:not(#live-player-fullscreen){display:none!important}
@media(max-width:600px){#live-player-panel{height:85dvh}.live-player-toolbar button{padding:9px 6px}}
#live-viewing-area:fullscreen #live-player-panel:not(.is-floating),#live-viewing-area.is-expanded #live-player-panel:not(.is-floating){display:none!important}
@media(max-width:768px){
  #live-play-now,#live-player-panel{display:none!important}
  #live-viewing-area:not(:fullscreen):not(.is-expanded) #live-chat-view{display:block!important}
  #live-viewing-area .watch-meta-bar{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px 6px;align-items:center;padding:12px 10px}
  #live-viewing-area .watch-meta-main{grid-column:1/-1}
  #live-viewing-area .watch-call-studio{display:contents}
  #live-viewing-area .watch-call-studio-note{display:none}
  #live-viewing-area .watch-call-studio-button{width:100%;min-width:0;padding:9px 4px;font-size:clamp(10px,3vw,12px);letter-spacing:0;white-space:nowrap}
  #live-viewing-area:not(:fullscreen):not(.is-expanded){padding-top:env(safe-area-inset-top,0px)}
  #live-viewing-area:not(:fullscreen):not(.is-expanded) .watch-player-wrap{min-height:0;overflow:visible}
  #live-viewing-area:not(:fullscreen):not(.is-expanded) .watch-player-frame{aspect-ratio:16/9;height:auto;margin:0;padding:0}
  #live-viewing-area:not(:fullscreen):not(.is-expanded) .watch-player-frame::before{display:none}
  #live-viewing-area:not(:fullscreen):not(.is-expanded) .watch-player-frame iframe{position:absolute;inset:0;width:100%;height:100%;margin:0;transform:none}
}
/* The offline countdown is content, not a 16:9 video. Let it size itself on phones. */
@media(max-width:768px){
  #live-viewing-area:not(:fullscreen):not(.is-expanded) .stream-offline-overlay:not(.d-none){position:relative;inset:auto;padding:22px 12px}
  #live-viewing-area:not(:fullscreen):not(.is-expanded) .watch-player-wrap:has(>.stream-offline-overlay:not(.d-none)) .watch-player-frame{position:absolute;inset:0;height:100%;aspect-ratio:auto}
  #live-viewing-area .stream-offline-content{width:100%;max-width:440px}
  #live-viewing-area .stream-offline-badge{padding:6px 12px;font-size:11px}
  #live-viewing-area .stream-offline-title{font-size:clamp(30px,9vw,40px);margin:16px 0 8px;line-height:1}
  #live-viewing-area .stream-offline-subtitle{font-size:14px}
  #live-viewing-area .stream-offline-countdown{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;margin:16px 0 12px}
  #live-viewing-area .stream-offline-countdown-box{min-width:0;padding:10px 4px;border-radius:12px}
  #live-viewing-area .stream-offline-countdown-value{font-size:24px}
  #live-viewing-area .stream-offline-countdown-label{font-size:10px;letter-spacing:.04em}
  #live-viewing-area .stream-offline-prize-pill{padding:10px 16px;margin-bottom:14px}
  #live-viewing-area .stream-offline-prize-pill strong{font-size:24px}
  #live-viewing-area .stream-offline-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  #live-viewing-area .stream-offline-action{min-width:0;width:100%;padding:12px 5px;font-size:14px;border-radius:12px}
}
