/* Channel chrome stays outside the arena and never appears in recordings. */
#arena-stage { position:absolute; inset:0; }
#channel-chat-toggle { display:none; }
#channel-betting,#channel-chat { display:none; }
#app.channel-mode { width:100vw; height:100dvh; --chat-width:310px; --bet-height:132px; }
.channel-mode #arena-stage { inset:0 var(--chat-width) var(--bet-height) 0; }
.channel-mode[data-aspect="portrait"] #arena-stage { right:auto; left:calc((100vw - var(--chat-width))/2); transform:translateX(-50%); width:min(calc(100vw - var(--chat-width)),calc((100dvh - var(--bet-height)) * .5625)); }
.channel-mode .ink-frame,.channel-mode .manga-burst,.channel-mode .spectator-tools { display:none; }
.channel-mode #channel-betting { display:flex; flex-direction:column; position:absolute; left:0; right:var(--chat-width); bottom:0; height:var(--bet-height); background:#151822; border-top:3px solid #07090e; padding:7px 12px; overflow:clip; }
#channel-betting button { margin:0; min-height:0; }
#channel-betting button:hover,#channel-betting button:focus-visible { transform:none; box-shadow:none; }
#channel-betting button:focus-visible { outline:2px solid #edc78a; outline-offset:-3px; }
.bet-heading { display:flex; justify-content:space-between; gap:10px; align-items:center; font:bold 11px Arial,sans-serif; color:#c8c4bf; }
#bet-countdown { color:#e0b771; }
#viewer-credits { color:#a6c6ae; white-space:nowrap; }
.credit-controls { display:flex; align-items:center; gap:8px; }
.credit-controls #credit-refill { padding:4px 7px; border:2px solid #080a10; box-shadow:2px 2px 0 #080a10; background:#354939; color:#dfebda; font:italic 900 12px Impact,'Arial Black',sans-serif; white-space:nowrap; }
.bet-controls { display:grid; grid-template-columns:minmax(0,1fr) 140px minmax(0,1fr); grid-template-rows:minmax(0,1fr); gap:12px; width:100%; max-width:850px; flex:1; min-height:0; margin:4px auto; }
.bet-pick { display:flex; align-items:center; justify-content:center; gap:10px; min-width:0; height:69px; padding:3px 10px; color:#ebe6df; background:#222635; border:2px solid #424858; box-shadow:none; font:italic 900 22px Impact,sans-serif; }
.bet-pick canvas { width:60px !important; height:60px !important; flex-shrink:0; }
.bet-controls .bet-pick { height:100%; min-height:0; overflow:hidden; }
.bet-controls .bet-pick canvas { max-height:100%; object-fit:contain; }
.bet-heading,#bet-status { flex-shrink:0; }
#bet-status { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
#chat-log,#fighter-stats-tooltip,#arena-toolbar .settings-body,#channel-menu { scrollbar-width:thin; scrollbar-color:#4b5061 transparent; }
.bet-pick[aria-pressed=true] { border-color:#d6ad6d; background:#403329; }
.bet-pick:disabled { opacity:.72; }
.bet-pick[aria-disabled=true] { opacity:.8; cursor:help; }
#fighter-stats-tooltip { position:fixed; z-index:100; width:290px; max-width:calc(100vw - 16px); max-height:50dvh; overflow:auto; padding:12px 15px; border:3px solid #080a10; box-shadow:4px 4px 0 #080a10; background:#1b1e2b; color:#e9e2d6; font:13px/1.5 Arial,sans-serif; }
#fighter-stats-tooltip[hidden] { display:none; }
#fighter-stats-tooltip section+section { border-top:1px solid #414250; margin-top:9px; padding-top:9px; }
#fighter-stats-tooltip strong { font:italic 900 22px Impact,'Arial Black',sans-serif; color:#edc58e; }
#fighter-stats-tooltip p { margin:3px 0; font-weight:bold; }
#fighter-stats-tooltip small { white-space:pre-line; color:#b4b8c7; }
.bet-share { color:#c8c4bf; font:bold 18px Arial,sans-serif; white-space:nowrap; }
.bet-share[data-share=higher] { color:#86d5a0; }
.bet-share[data-share=lower] { color:#f08b8e; }
.bet-controls .bet-pick { display:grid; grid-template-columns:auto minmax(0,1fr) auto; }
.bet-pick span { overflow-wrap:anywhere; }
.bet-stake { display:grid; grid-template-columns:minmax(0,1fr); grid-template-rows:10px minmax(20px,1fr) minmax(20px,1fr); min-height:0; gap:2px; }
.bet-stake input { min-height:0; height:100%; }
.bet-stake label { font:bold 9px Arial,sans-serif; color:#bbb8b1; }
.bet-stake input { width:100%; min-width:0; background:#0e111b; border:1px solid #555867; color:#eee; font:bold 15px Arial,sans-serif; padding:3px 8px; }
#place-bet { padding:4px; font-size:12px; border:1px solid #977644; box-shadow:none; background:#74572f; color:#fff2d7; }
#place-bet:disabled { opacity:.5; }
#bet-status { margin:4px 0; font:12px/1.4 Arial,sans-serif; color:#d4cfc6; }
#bet-status:empty { display:none; }
#channel-betting>small { font:10px Arial,sans-serif; color:#969ba9; }
.channel-mode #channel-chat { position:absolute; display:flex; flex-direction:column; gap:8px; width:var(--chat-width); right:0; top:0; bottom:0; padding:14px; background:#11141e; border-left:3px solid #080a10; z-index:42; }
#channel-chat h2 { margin:0; font:italic 900 24px Impact,sans-serif; color:#ddd5c5; text-shadow:none; }
#chat-connection { margin:0; font:11px Arial,sans-serif; color:#9faeb3; }
#channel-chat label { font:bold 9px Arial,sans-serif; color:#a4a9b7; display:block; margin-bottom:3px; }
#channel-chat form>div { display:flex; gap:5px; }
#chat-form .chat-actions { margin-top:6px; }
#chat-form .chat-actions button { flex:1; }
#channel-chat input { min-width:0; width:100%; padding:8px; border:1px solid #3b4254; color:#e5e6ed; background:#1d2230; font:13px Arial,sans-serif; }
#channel-chat button { padding:7px; font-size:11px; border:1px solid #41485a; box-shadow:none; background:#262c3a; color:#d4d9e3; }
.chat-note { font:10px/1.5 Arial,sans-serif; color:#999ead; }
#chat-log { flex:1; min-height:0; overflow:auto; list-style:none; padding:0; margin:0; overflow-wrap:anywhere; }
#chat-log li { padding:8px 0; border-bottom:1px solid #ffffff09; font:13px/1.5 Arial,sans-serif; }
#chat-log strong,#chat-log button { display:block; font:bold 10px Arial,sans-serif; color:#b5a0d9; padding:0; margin-bottom:3px; border:0; background:none; text-align:left; }
#chat-log .chat-private { color:#a8b8c8; background:#17202b; border-left:2px solid #4e637b; padding:7px; margin:5px 0; }
#chat-log .chat-private strong { color:#91a8ba; font-size:9px; }
#credit-refill:disabled { opacity:.4; }
#arena-toolbar { position:absolute; z-index:45; left:12px; bottom:max(12px,env(safe-area-inset-bottom)); display:flex; flex-wrap:nowrap; align-items:center; gap:7px; max-width:calc(100% - 24px); }
#arena-toolbar>button { width:auto; margin:0; flex:0 0 auto; }
#arena-toolbar>a,#arena-toolbar>.view-settings { flex:0 0 auto; white-space:nowrap; }
.channel-mode #arena-toolbar { bottom:calc(var(--bet-height) + 8px); max-width:calc(100% - var(--chat-width) - 24px); }
#arena-toolbar>a { color:#f0dcc0; text-decoration:none; font:italic 1000 24px Impact,'Arial Black',sans-serif; letter-spacing:-.03em; text-shadow:2px 2px #090a10,-1px -1px #090a10; margin-right:3px; }
#arena-toolbar .view-settings { position:relative; inset:auto; margin:0; max-width:none; padding:0; border:0; box-shadow:none; background:none; }
#arena-toolbar button,#arena-toolbar .view-settings>summary { display:block; white-space:nowrap; padding:8px 12px; border:3px solid #080a10; box-shadow:3px 3px 0 #080a10; background:repeating-linear-gradient(-35deg,#ffffff05 0 2px,transparent 2px 5px),#702e39; color:#eee2cd; font:italic 1000 15px/1 Impact,'Arial Black',sans-serif; letter-spacing:.025em; text-shadow:1px 2px #080a10; transform:skew(-5deg); cursor:pointer; }
#arena-toolbar #channel-sound { background-color:#343b50; }
#arena-toolbar #channel-menu-button { background-color:#7a5834; }
#arena-toolbar #record-button { background-color:#81313d; }
#record-setup { width:min(440px,calc(100vw - 28px)); text-align:left; }
#record-setup h2 { text-align:center; }
#record-setup>button { width:100%; }
#record-setup>select { width:100%; margin:8px 0 14px; }
#record-setup .record-options { font-size:13px; margin-bottom:12px; }
#record-setup .record-options label { display:block; margin-top:12px; }
#record-status:empty { display:none; }
#arena-toolbar .view-settings>summary::after { display:none; }
#arena-toolbar button:hover,#arena-toolbar summary:hover { filter:brightness(1.15); }
#arena-toolbar :focus-visible { outline:2px solid #edc78a; outline-offset:4px; }
#arena-toolbar .settings-body { position:absolute; bottom:calc(100% + 10px); left:0; width:min(330px,calc(100vw - 28px)); max-height:70dvh; overflow:auto; background:#191c28; border:3px solid #080a10; box-shadow:5px 5px 0 #080a10; }
#arena-toolbar #channel-chat-toggle { display:none; }
#channel-menu { width:100vw; height:100dvh; max-width:none; max-height:none; padding:0; border:0; background:transparent; color:inherit; overflow:auto; }
#channel-menu::backdrop { background:#050710d9; backdrop-filter:blur(5px); }
#channel-menu .panel { position:relative; top:auto; left:auto; transform:none; margin:65px auto 30px; max-height:none; }
#close-channel-menu { display:block; width:100%; margin-top:16px; padding:12px 16px; background:#292c38; color:#eee; border:3px solid #080a10; box-shadow:3px 3px 0 #080a10; font:italic 1000 18px Impact,'Arial Black',sans-serif; }
@media(max-width:900px) {
  #app.channel-mode { --chat-width:0px; --bet-height:146px; }
  .channel-mode #arena-toolbar #channel-chat-toggle { display:block; }
  .channel-mode #channel-chat { display:none; }
  .channel-mode.chat-open #channel-chat { display:flex; width:min(340px,100%); box-shadow:-15px 0 40px #0009; }
  #arena-toolbar { left:7px; gap:4px; max-width:calc(100% - 14px); }
  .channel-mode #arena-toolbar { max-width:calc(100% - 14px); }
  #arena-toolbar>a { font-size:clamp(14px,3.4vw,21px); margin-right:0; }
  #arena-toolbar button,#arena-toolbar .view-settings>summary { padding:7px 5px; font-size:clamp(9px,2.4vw,13px); border-width:2px; }
  #arena-toolbar .settings-body { position:fixed; left:8px; bottom:54px; }
  .channel-mode #arena-toolbar .settings-body { bottom:calc(var(--bet-height) + 50px); }
  #app:not(.channel-mode) .spectator-tools { bottom:58px; }
  .channel-mode #channel-betting { padding:6px 8px; }
  .bet-controls { grid-template-columns:minmax(0,1fr) 90px minmax(0,1fr); gap:6px; }
  .bet-pick { font-size:17px; gap:2px; height:80px; padding:3px; flex-direction:column; }
  .bet-pick canvas { width:45px !important; height:45px !important; }
  .bet-share { font-size:13px; }
  .bet-controls .bet-pick { column-gap:4px; grid-template-columns:auto minmax(0,1fr); }
  #bet-left-art { grid-column:2; grid-row:1; justify-self:center; }
  #bet-left-share { grid-column:1; grid-row:1 / 3; }
  #bet-left-name { grid-column:2; }
  #bet-right-art { grid-column:1; grid-row:1; justify-self:center; }
  #bet-right-share { grid-column:2; grid-row:1 / 3; }
  #bet-right-name { grid-column:1; }
  .bet-heading { flex-wrap:wrap; font-size:10px; }
  #bet-status { font-size:10px; }
}
@media(max-height:520px) and (orientation:landscape) {
  #app.channel-mode { --bet-height:112px; }
  .bet-controls { margin:3px auto; }
  .bet-pick { flex-direction:row; height:55px; }
  #channel-betting>small { display:none; }
  .bet-stake label { display:none; }
  .bet-stake { grid-template-rows:minmax(20px,1fr) minmax(20px,1fr); }
}
