#dualRoleOverlay .dual-role-shell { width:min(900px,94vw); max-height:94vh; overflow:auto; box-sizing:border-box; padding:42px 40px; gap:18px; }
#dualRoleOverlay .dual-role-title { font-size:clamp(28px,3vw,40px); letter-spacing:5px; }
#dualRoleOverlay .dual-role-subtitle { font-size:16px; text-align:center; line-height:1.6; }
#dualRoleOverlay .dual-role-actions { grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
#dualRoleOverlay .dual-role-btn { height:auto; min-height:148px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:9px; padding:18px 10px; font-size:23px; border-radius:8px; }
#dualRoleOverlay .dual-role-btn small { font-size:14px; font-weight:400; opacity:.8; text-shadow:none; }
.display-icon { display:flex; width:76px; height:40px; border:2px solid #d6bb7e; padding:4px; gap:4px; border-radius:4px; box-sizing:border-box; }
.display-icon i { display:block; flex:1; background:#c7ac72; border-radius:1px; }
.display-icon.left i:last-child,.display-icon.right i:first-child { background:#c7ac7224; }
.display-pairing { width:100%; color:#ebd8b1; border-top:1px solid #c7ac7240; padding-top:16px; font-size:15px; }
.display-pairing summary { cursor:pointer; padding:4px 0; }
.display-pairing p { line-height:1.65; margin:8px 0; color:#caba9c; }
.display-room-row { display:flex; gap:8px; flex-wrap:wrap; align-items:center; margin:12px 0; }
.display-room-row input { min-width:180px; flex:1; color:#f7e3bd; font:20px ui-monospace,monospace; letter-spacing:2px; background:#121e1c; border:1px solid #a98b55; border-radius:6px; padding:10px; }
.display-room-row button, .display-split-bar button { background:#304e48; color:#f7e3bd; border:1px solid #ab925e; border-radius:5px; padding:10px 14px; cursor:pointer; }
#displayConnectionStatus { color:#ddca9d; min-height:22px; font-size:14px; text-align:center; }
#displayModeClose { justify-self:end; color:#e7cf9c; border:0; background:none; cursor:pointer; font-size:14px; }
#displayModeClose[hidden] { display:none; }
.display-split-bar { height:40px; display:flex; justify-content:space-between; align-items:center; box-sizing:border-box; padding:4px 12px; color:#ebd8b1; background:#243b36; font-size:14px; }
.display-split-bar button { padding:5px 12px; }
.display-split-stage { height:calc(100vh - 40px); display:flex; }
.display-split-stage iframe { display:block; width:50%; height:100%; border:0; box-sizing:border-box; }
.display-split-stage iframe:first-child { border-right:1px solid #7e6947; }
@media(max-width:640px),(max-height:650px) {
 #dualRoleOverlay .dual-role-shell { padding:22px 26px; gap:10px; }
 #dualRoleOverlay .dual-role-btn { min-height:110px; font-size:19px; padding:12px 6px; }
 #dualRoleOverlay .dual-role-title { font-size:26px; }
 .display-icon { width:64px; height:32px; }
}

#displayQuickBtn { position:fixed; left:18px; bottom:18px; z-index:80; font-family:STKaiti,KaiTi,serif; font-size:24px; }

.embedded-display #displayModeBtn { display:none !important; }

#displayQuickBtn.hidden { display:none !important; }
