/* Real rooms: viewport-based layout, with iOS safe areas and Android WebView support. */
.call-video-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:10px 0}
.call-video-grid:empty{display:none}.call-video-grid figure{margin:0;min-width:0;overflow:hidden;border:1px solid #34465f;border-radius:10px;background:#080d15}
.call-video-grid video{width:100%;aspect-ratio:4/3;object-fit:cover;display:block}.call-video-grid figure[data-peer=self] video{transform:scaleX(-1)}
.call-video-grid figcaption{font-size:12px;padding:5px 7px;color:#e4efff;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}
#watch-party-room [hidden],.voice-room-app [hidden]{display:none!important}
body.blockst-room-active{--room-gap:8px;--room-font:13px;--room-touch:36px;font-family:system-ui,-apple-system,'Segoe UI',sans-serif!important}
body.blockst-room-active[data-room-density=comfortable]{--room-gap:12px;--room-font:15px;--room-touch:44px}
body.blockst-room-active main.blockst-main,body.blockst-room-active main{min-height:0!important}
body.blockst-room-active #watch-party-room{width:100%;max-width:none;margin:0;transform:none;overflow:visible}
#watch-party-room .party-room-layout{display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:var(--room-gap,8px)!important;min-width:0}
#watch-party-room .party-room-layout>*{min-width:0;box-sizing:border-box;grid-column:auto;grid-row:auto}
#watch-party-room .party-room-chat{display:flex;flex-direction:column;min-height:250px;margin:0}
#watch-party-room .party-chat-log{flex:1;min-height:80px;max-height:40dvh;overflow:auto;overscroll-behavior:contain}
#watch-party-room .party-room-chat form{display:flex;flex-direction:row;gap:6px}
#watch-party-room .party-room-chat form input{width:0;min-width:0;flex:1}
#watch-party-room .party-side{display:flex!important;flex-direction:column;gap:var(--room-gap,8px)}
#watch-party-room .party-side-card{min-width:0;padding:10px;border-radius:14px;background:#101a29;color:#e3edf8}
#watch-party-room .party-side-title h3,#watch-party-room .party-room-chat h3{font-size:15px;margin:0 0 6px}
#watch-party-room .party-voice p,#watch-party-room .party-voice .party-side-title span{color:#a9bbd0}
#watch-party-room .party-player-controls{display:flex!important;flex-wrap:wrap;overflow:visible!important;gap:5px}
#watch-party-room .party-player-controls>*{grid-column:auto!important;grid-row:auto!important}
#watch-party-room .party-player-controls [data-party-volume]{width:55px}
#watch-party-room .blockst155-watch-title{margin:8px 0}
#watch-party-room .blockst155-watch-title h3{font-size:18px}
#watch-party-room .blockst155-watch-title p{font-size:12px}
#watch-party-room .party-voice-actions{display:grid!important;grid-template-columns:1fr 1fr!important;gap:6px;margin:8px 0}
#watch-party-room .party-voice-actions button{min-width:0;min-height:var(--room-touch,36px);padding:7px 4px;font-size:12px;white-space:normal;overflow-wrap:anywhere}
#watch-party-room .party-voice-actions [data-voice-join]{grid-column:1/-1}
#watch-party-room .party-side button,#watch-party-room .party-room-chat button{touch-action:manipulation}
#watch-party-room .party-voice p{font-size:12px;line-height:1.4}
#watch-party-room .party-ptt-pad{min-height:44px;padding:8px;margin:6px 0}
.room-view-tools{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin:4px 0 8px;font-size:12px}
.room-view-tools .room-type-label{font-weight:750;color:#68ebc2;margin-right:auto}
.room-view-tools button,.room-view-tools select{min-height:34px;width:auto;padding:5px 9px;font-size:12px!important;border-radius:9px}
.room-view-tools label{display:flex;align-items:center;gap:5px}
.room-phone-tabs{display:flex;gap:6px;margin:0;grid-column:1/-1}
.room-phone-tabs button{flex:1;min-height:42px;border:1px solid #33465f;background:#152135;color:#c7d4e6;border-radius:10px}
.room-phone-tabs button[aria-selected=true]{background:#174339;border-color:#39d7ad;color:#a2ffe0}
#watch-party-room .player-extra{position:relative;display:inline-block;margin-left:auto}
#watch-party-room .player-extra summary{list-style:none;cursor:pointer;padding:7px 10px;min-height:32px;border:1px solid #37516b;border-radius:8px;font-size:14px}
#watch-party-room .player-extra summary::-webkit-details-marker{display:none}
#watch-party-room .player-extra>div{position:absolute;right:0;bottom:calc(100% + 6px);z-index:25;display:grid;grid-template-columns:1fr 1fr;gap:7px;min-width:205px;padding:10px;border:1px solid #44617d;border-radius:12px;background:#101b2b;box-shadow:0 8px 30px #0008}
#watch-party-room .player-extra:not([open])>div{display:none}
#watch-party-room .player-extra select,#watch-party-room .player-extra button{width:100%;max-width:none;grid-row:auto!important}
#watch-party-room[data-mode=chat] .party-voice{display:none!important}
#watch-party-room[data-mode=chat] .room-phone-tabs{display:none}
.call-empty{padding:14px 9px;color:#a9bbd0;background:#0a1421;border:1px dashed #344a65;border-radius:10px;font-size:12px;line-height:1.45}
.voice-room-app[data-mode=video] .voice-room-head{min-height:0!important;padding:14px!important;align-items:center!important}
.voice-room-app[data-mode=video] .voice-toolbar{display:flex!important;flex-wrap:wrap!important;gap:8px;order:2}
.voice-room-app[data-mode=video] .voice-toolbar button{min-height:40px;flex:1 1 130px}
.voice-room-app[data-mode=video] .call-video-grid{order:1;grid-template-columns:repeat(2,minmax(0,1fr))}
.voice-room-app[data-mode=video] .voice-members{order:3}
@media(max-width:699px) and (orientation:portrait){
 #watch-party-room .party-side{display:none!important}
 #watch-party-room[data-phone-panel=call] .party-side{display:flex!important}
 #watch-party-room[data-phone-panel=call] .party-room-chat{display:none}
 #watch-party-room[data-mode=chat] .party-room-chat{display:flex!important}
 #watch-party-room .party-video-frame{border-radius:12px}
 #watch-party-room .party-room-chat,#watch-party-room .party-side{min-height:240px}
}
@media(min-width:700px) and (orientation:portrait){
 #watch-party-room .party-room-layout{grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important}
 #watch-party-room .party-stage{grid-column:1/-1}
 #watch-party-room .room-phone-tabs{display:none}
 #watch-party-room .party-room-chat{min-height:340px}
}
@media(orientation:landscape) and (min-width:560px){
 body.blockst-room-active{padding-bottom:calc(45px + env(safe-area-inset-bottom,0px))!important}
 body.blockst-room-active .blockst-page-head{display:none!important}
 body.blockst-room-active main.blockst-main,body.blockst-room-active main{padding:4px max(8px,env(safe-area-inset-right,0px)) 0 max(8px,env(safe-area-inset-left,0px))!important;margin:0 auto!important;max-width:none!important;width:100%!important;box-sizing:border-box}
 body.blockst-room-active .blockst-topbar{height:calc(42px + env(safe-area-inset-top,0px))!important;min-height:calc(42px + env(safe-area-inset-top,0px))!important;padding-top:env(safe-area-inset-top,0px)!important;padding-bottom:0!important}
 body.blockst-room-active .blockst-topbar .blockst-logo{width:28px!important;height:28px!important}
 body.blockst-room-active .blockst-topbar .blockst-brand small{display:none}
 body.blockst-room-active .blockst-bottom-nav{position:fixed!important;top:auto!important;left:50%!important;transform:translateX(-50%)!important;margin:0!important;width:calc(100% - 18px)!important;height:40px!important;min-height:40px!important;padding:3px!important;bottom:env(safe-area-inset-bottom,0px)!important;border-radius:12px!important;gap:3px!important;max-width:650px!important}
 body.blockst-room-active .blockst-bottom-nav>a{display:flex!important;flex-direction:row!important;align-items:center;justify-content:center;gap:5px;padding:4px 6px!important;min-height:0!important;font-size:11px!important;border-radius:9px!important}
 body.blockst-room-active .blockst-bottom-icon{width:17px!important;height:17px!important;margin:0!important}
 body.blockst-room-active .blockst-bottom-icon svg{width:17px!important;height:17px!important}
 #watch-party-room .blockst155-room-tools{margin:0 0 3px!important;align-items:center}
 #watch-party-room .blockst155-room-tools>a{padding:2px 0;font-size:12px}
 #watch-party-room .blockst155-room-tools summary{padding:4px 9px}
 #watch-party-room .party-room-header{padding:4px 8px;margin:0 0 4px;border-radius:10px;align-items:center}
 #watch-party-room .party-room-header h2,#watch-party-room .party-room-header p,#watch-party-room .party-room-header .party-kicker{display:none}
 #watch-party-room .room-view-tools{margin:0 0 5px;flex-wrap:nowrap}
 #watch-party-room .room-view-tools button,#watch-party-room .room-view-tools select{min-height:28px!important;padding:3px 7px;font-size:11px!important}
 #watch-party-room .party-room-layout{grid-template-columns:minmax(0,3.2fr) minmax(138px,1fr) minmax(150px,1fr)!important;align-items:stretch;gap:6px!important}
 #watch-party-room[data-mode=chat] .party-room-layout{grid-template-columns:minmax(0,3.6fr) minmax(170px,1fr)!important}
 #watch-party-room[data-mode=chat] .party-side{display:none!important}
 #watch-party-room .room-phone-tabs{display:none}
 #watch-party-room .party-stage{display:flex;flex-direction:column;height:var(--room-panel-height,65dvh);min-height:155px;padding:0!important;overflow:visible!important}
 #watch-party-room .party-video-frame{flex:1;min-height:80px;aspect-ratio:auto;border-radius:12px!important}
 #watch-party-room .party-video-frame video{height:100%;object-fit:contain}
 #watch-party-room .blockst155-watch-title{margin:3px 0!important}
 #watch-party-room .blockst155-watch-title h3{font-size:12px!important;line-height:16px;margin:0;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}
 #watch-party-room .blockst155-watch-title p,#watch-party-room .party-player-note{display:none}
 #watch-party-room .party-player-controls{display:flex!important;flex-wrap:wrap!important;gap:3px!important;padding:4px!important;margin-top:4px!important;border-radius:10px!important}
 #watch-party-room .party-player-controls>button,#watch-party-room .party-player-controls>select{min-height:28px!important;min-width:30px!important;width:auto!important;padding:3px 5px!important;font-size:11px!important;grid-row:auto!important}
 #watch-party-room .party-player-controls [data-party-progress]{order:0;flex:1;min-width:65px!important;width:auto!important;flex-basis:auto!important;margin:0;min-height:24px!important}
 #watch-party-room .player-extra summary{min-height:28px;padding:3px 7px;box-sizing:border-box}
 #watch-party-room .party-player-controls [data-party-volume]{width:45px!important;min-width:0!important}
 #watch-party-room .party-player-controls [data-party-volume]{min-height:24px!important}
 #watch-party-room .party-player-controls [data-party-time]{font-size:10px;line-height:14px;padding:0!important;margin:0!important;white-space:nowrap}
 #watch-party-room .party-room-chat,#watch-party-room .party-side{height:var(--room-panel-height,65dvh);min-height:155px;max-height:none;overflow:auto;overscroll-behavior:contain;font-size:var(--room-font)}
 #watch-party-room .party-room-chat{padding:8px!important;border-radius:12px}
 #watch-party-room .party-room-chat h3,#watch-party-room .party-side-title h3{font-size:12px}
 #watch-party-room .party-chat-log{height:auto;max-height:none;min-height:40px;padding:4px;margin:4px 0}
 #watch-party-room .party-chat-message{font-size:12px;padding:5px}
 #watch-party-room .party-room-chat form input{min-height:32px;padding:5px;font-size:12px!important}
 #watch-party-room .party-room-chat form button{padding:4px 7px;min-height:32px;font-size:11px}
 #watch-party-room .party-side-card{padding:7px!important;border-radius:12px}
 #watch-party-room .party-voice-actions button{font-size:10px;min-height:30px;padding:4px 2px}
 #watch-party-room .party-voice p{font-size:10px;margin:5px 0}
 #watch-party-room .call-video-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:4px;margin:6px 0}
 #watch-party-room .call-video-grid figcaption{font-size:10px;padding:3px}
 #watch-party-room .call-empty{padding:7px;font-size:11px}
 body.blockst-room-focus #watch-party-room .party-room-layout{grid-template-columns:minmax(0,1fr)!important}
 body.blockst-room-focus #watch-party-room .party-room-chat,body.blockst-room-focus #watch-party-room .party-side{display:none!important}
}
@media(orientation:landscape) and (min-width:1000px) and (min-height:600px){
 #watch-party-room .party-room-layout{grid-template-columns:minmax(0,3.3fr) minmax(200px,1fr) minmax(215px,1fr)!important;gap:10px!important}
 #watch-party-room .party-side-card,#watch-party-room .party-room-chat{padding:12px!important}
 #watch-party-room .party-side-title h3,#watch-party-room .party-room-chat h3{font-size:15px}
 #watch-party-room .party-voice-actions button{font-size:12px;min-height:40px;padding:7px}
 #watch-party-room .party-player-controls>button{min-height:36px!important;font-size:13px!important}
 #watch-party-room .party-chat-message{font-size:14px;padding:8px}
}

/* Focus mode also works in portrait and takes precedence over tablet sizing. */
body.blockst-room-focus #watch-party-room .party-room-layout{grid-template-columns:minmax(0,1fr)!important}
body.blockst-room-focus #watch-party-room .party-room-chat,body.blockst-room-focus #watch-party-room .party-side,body.blockst-room-focus #watch-party-room .room-phone-tabs{display:none!important}
