:root{color-scheme:dark;--red:#d71920;--nav:#061c2b;--bg:#01070b;--panel:#09243a;--line:#315677;--blue:#126bd1;--green:#159447;--amber:#c48600}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;background:var(--bg);font-family:Arial,Helvetica,sans-serif;color:#fff}
body{display:flex;flex-direction:column;overflow:auto}.toolbar{min-height:100px;padding:12px 16px;display:flex;align-items:center;gap:10px;background:var(--nav);z-index:5;flex-wrap:wrap}.logo{width:42px;height:64px;object-fit:contain}
select,input,button,textarea{border-radius:7px;font-size:16px}select,input{min-height:42px;background:#fff;color:#111;border:1px solid #bbb;padding:0 12px}select{min-width:190px}.custom-wrap{display:flex}.custom-wrap input{min-width:220px}.hidden{display:none!important}
button{min-height:42px;border:0;color:#fff;background:var(--red);padding:0 15px;font-weight:700;cursor:pointer}button:active{transform:translateY(1px)}#mute-button,#fullscreen-button{width:44px;padding:0;font-size:20px}
.player-shell{position:relative;flex:1 1 auto;min-height:360px;background:#000;display:flex;align-items:center;justify-content:center}.player-shell video{width:100%;height:100%;object-fit:contain;background:#000}.placeholder{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;background:#01070b;padding:20px}.placeholder img{width:150px;max-width:32vw}.placeholder p{font-size:18px;margin-top:24px}.live-badge{position:absolute;top:18px;right:18px;background:var(--red);padding:8px 12px;border-radius:5px;font-weight:800}
.diagnostic{position:absolute;left:50%;bottom:22px;transform:translateX(-50%);width:min(850px,82vw);max-height:120px;overflow:auto;margin:0;padding:10px;background:rgba(7,38,61,.92);color:#9ad7ff;border-radius:7px;font-size:12px;white-space:pre-wrap}

/* V9 - Medidor del audio recibido en el Player normal.
   Se excluye expresamente del modo ?embed=1 utilizado por vMix. */
.audio-meter-panel{flex:0 0 auto;background:linear-gradient(180deg,#071a28,#04111b);padding:12px 16px 14px;border-top:1px solid #183e5d;border-bottom:1px solid #183e5d;box-shadow:inset 0 1px 0 rgba(255,255,255,.03)}
.audio-meter-head,.audio-meter-foot{display:flex;align-items:center;justify-content:space-between;gap:12px}.audio-meter-head{margin-bottom:8px}.audio-meter-title{font-size:13px;font-weight:900;letter-spacing:.09em;color:#dcecf8}.audio-meter-db{min-width:72px;text-align:right;font:700 14px Consolas,"Courier New",monospace;color:#9ad7ff}
.audio-meter-track{position:relative;height:30px;border-radius:8px;background:#02080d;border:1px solid #29465d;overflow:hidden;box-shadow:inset 0 2px 8px rgba(0,0,0,.85)}.audio-meter-fill{position:absolute;left:0;top:0;bottom:0;width:0%;transition:width 70ms linear;background:linear-gradient(90deg,#0bbb57 0%,#49d450 58%,#f3c623 78%,#ff8a18 90%,#e92929 100%);box-shadow:0 0 14px rgba(29,219,92,.28)}.audio-meter-track::after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(90deg,transparent 0,transparent calc(10% - 2px),rgba(0,0,0,.72) calc(10% - 2px),rgba(0,0,0,.72) 10%);pointer-events:none}
.audio-meter-markers{position:absolute;inset:0 8px;display:flex;align-items:center;justify-content:space-between;z-index:2;pointer-events:none}.audio-meter-markers span{font:700 10px Arial,Helvetica,sans-serif;color:rgba(255,255,255,.72);text-shadow:0 1px 2px #000}.audio-meter-foot{margin-top:7px;font-size:11px}.audio-meter-status{color:#a7bdd0}.audio-meter-legend{color:#607e96;letter-spacing:.06em}.audio-meter-legend b{color:#55d777}

/* V8 - Panel adicional de salidas. No altera los controles ni el receptor WebRTC. */
.output-panel{flex:0 0 auto;background:var(--nav);padding:12px 16px 16px;display:grid;gap:10px;border-top:1px solid #183e5d}.output-box{background:#0a2236;border:1px solid var(--line);border-radius:9px;padding:10px}.vmix-box{border-color:var(--green)}.embed-box{border-color:var(--amber)}.output-title{font-size:16px;font-weight:800;margin-bottom:4px}.output-help{font-size:13px;color:#c4d6e5;margin-bottom:8px}.copy-row{display:flex;gap:8px;align-items:stretch}.copy-row input,.copy-row textarea{flex:1;width:100%;background:#102a43;color:#fff;border:1px solid #315677;padding:9px 11px;font-family:Consolas,"Courier New",monospace;font-size:13px}.copy-row input{min-height:40px}.copy-row textarea{height:78px;resize:vertical}.copy-button{flex:0 0 auto;background:var(--blue);white-space:nowrap}.vmix-box .copy-button{background:var(--green)}.embed-box .copy-button{background:var(--amber)}

body.embed{overflow:hidden}body.embed .toolbar,body.embed .diagnostic,body.embed .audio-meter-panel,body.embed .output-panel{display:none}body.embed .player-shell{height:100vh;min-height:100vh;flex:1 1 100vh}.player-shell:fullscreen{width:100vw;height:100vh}
@media(max-width:650px){.toolbar{min-height:auto;padding:8px}.logo{width:34px;height:48px}select,.custom-wrap,input,#receive-button{width:100%}.custom-wrap{width:100%}.custom-wrap input{min-width:0}.player-shell{min-height:calc(100vh - 210px)}.diagnostic{width:92vw}.placeholder img{width:110px}.audio-meter-panel{padding:10px 8px}.audio-meter-title{font-size:11px}.audio-meter-foot{align-items:flex-start;flex-direction:column;gap:3px}.output-panel{padding:8px}.copy-row{flex-direction:column}.copy-button{width:100%}.copy-row textarea{height:105px}}