/* Compartir pantalla */
#scrchip { position:absolute; left:50%; top:8px; transform:translateX(-50%); z-index:9; display:flex; align-items:center; gap:10px; background:#d6232d; color:#fff; border-radius:999px; padding:7px 8px 7px 14px; font:700 13px system-ui; box-shadow:0 8px 24px rgba(0,0,0,.45); }
#scrchip .rd { width:10px; height:10px; border-radius:50%; background:#fff; animation:scrpulse 1s infinite alternate; } #scrchip #scrcount { font-weight:500; opacity:.9; }
#scrchip button { background:#fff; color:#d6232d; border:0; border-radius:999px; padding:5px 14px; font:800 12px system-ui; cursor:pointer; }
@keyframes scrpulse { to { opacity:.25; } }
#scrwin { position:absolute; right:14px; top:72px; width:min(46%, 640px); min-width:280px; z-index:5; display:none; flex-direction:column; background:#0d0f1c; border:1px solid #454c78; border-radius:14px; overflow:hidden; box-shadow:0 12px 34px rgba(0,0,0,.5); }
body.decorating #scrwin { right:auto; left:14px; }
#scrwin .sh { display:flex; align-items:center; gap:8px; padding:6px 10px; background:#1b1e34; color:#e9ebfa; font:700 12px system-ui; } #scrwin .st { flex:1; min-width:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
#scrwin .sb { display:flex; gap:4px; } #scrwin .sb button { background:rgba(255,255,255,.1); color:#fff; border:0; border-radius:8px; min-width:28px; height:26px; font:700 12px system-ui; cursor:pointer; padding:0 8px; } #scrwin .sb button.adm { background:#d6232d; }
#scrwin .sv { position:relative; background:#000; aspect-ratio:16/9; max-height:calc(100vh - 150px); } #scrwin video { width:100%; height:100%; object-fit:contain; background:#000; display:block; image-rendering:auto; filter:none; }
#scrwin.big { left:2% !important; right:2% !important; top:2% !important; width:auto !important; max-width:none; z-index:9; } #scrwin.big .sv { aspect-ratio:auto; height:calc(96vh - 44px); max-height:none; }
#scrbig { position:absolute; z-index:5; display:none; background:rgba(26,22,48,.92); color:#fff; border:1px solid #7c5cff; border-radius:999px; padding:5px 12px; font:700 12px system-ui; cursor:pointer; }
#scrwin .sw { position:absolute; inset:0; display:flex; align-items:center; justify-content:center; color:#b9b0ff; font:600 13px system-ui; pointer-events:none; } #scrwin.live .sw { display:none; }
#scrwin.min .sv { display:none; }
#scrproj { position:absolute; left:0; top:0; width:10px; height:10px; display:none; background:#000; object-fit:contain; pointer-events:none; z-index:1; }
#scrwarn { position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); z-index:10; width:min(380px, 88%); background:#fff; color:#2b2742; border-radius:20px; padding:18px 20px; box-shadow:0 20px 60px rgba(0,0,0,.5); font:14px/1.4 system-ui; }
#scrwarn h4 { margin:0 0 8px; font:800 16px system-ui; display:flex; gap:8px; align-items:center; } #scrwarn p { margin:6px 0; }
#scrwarn div { display:flex; gap:8px; justify-content:flex-end; margin-top:14px; } #scrwarn button { background:var(--accent, #7c5cff); color:#fff; border:0; border-radius:10px; padding:9px 14px; font:700 13px system-ui; cursor:pointer; } #scrwarn button.ghost { background:transparent; color:#2b2742; border:1px solid #cfc8ef; }

#scrbtn.idle { opacity:.55; } #scrbtn.idle:hover { opacity:.85; }   /* visible pero atenuado cuando aún no hay con quién compartir */
#scrwin .sh { cursor:move; user-select:none; touch-action:none; } #scrwin .rz { position:absolute; right:0; bottom:0; width:18px; height:18px; cursor:nwse-resize; touch-action:none; background:linear-gradient(135deg, transparent 55%, rgba(255,255,255,.55) 55% 62%, transparent 62% 72%, rgba(255,255,255,.55) 72% 79%, transparent 79%); z-index:2; } #scrwin.min .rz, #scrwin.big .rz { display:none; }
#scrwin.big .sh { cursor:default; }