:root{--banner-height: 56px;--row-gap: 14px;--container-pad: 16px;--cell-height: min( calc( ( 100vh - var(--banner-height) - var(--container-pad) * 2 - var(--row-gap) - 30px ) / 2 ), calc((100vw - 40px - var(--row-gap) - 30px) * 9 / 32) )}*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}html,body{width:100%;height:100%;overflow:hidden;font-family:system-ui,-apple-system,sans-serif;background:#1a1a1c;color:#fff}.hidden{display:none!important}.invisible{visibility:hidden!important;width:0!important;height:0!important;opacity:0!important;margin-bottom:-12px}.banner{position:sticky;top:0;z-index:100;height:var(--banner-height);display:flex;align-items:end;gap:12px;padding:16px;background:#141416;border-bottom:1px solid #2a2a2e;justify-content:space-between}.banner__logo{height:28px;width:auto;object-fit:contain}.banner__content{display:flex;align-items:center;gap:12px}.banner__title{font-size:1rem;font-weight:400;white-space:nowrap;color:#6a6a6a}.container{height:calc(100vh - var(--banner-height));padding:var(--container-pad) 20px;box-sizing:border-box;display:flex;flex-direction:column;gap:16px;align-items:center;overflow:scroll}.camera-source-container{display:flex;flex-direction:column;gap:10px;align-items:center;max-width:360px}.camera-source-container video{width:100%;height:100%;object-fit:contain}.camera-source__controls{width:100%}.camera-source__controls select{width:100%;-moz-appearance:none;appearance:none;-webkit-appearance:none;background-color:#1a1a1a;color:#fff;font-family:inherit;font-size:.875rem;padding:8px 32px 8px 12px;border:1px solid #333;border-radius:6px;cursor:pointer;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' fill='none'%3E%3Cpath d='M1 1.5l5 5 5-5' stroke='%23999' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center;transition:border-color .2s}.camera-source__controls select:hover{border-color:#555}.camera-source__controls select:focus{outline:none;border-color:#888}.video-row{display:grid;grid-template-columns:repeat(2,auto);gap:var(--row-gap)}.video-cell{display:flex;flex-direction:column;height:var(--cell-height);aspect-ratio:16 / 9;box-sizing:border-box}.video-cell__name{font-size:.8rem;letter-spacing:.02em;padding:7px 10px;color:#888;width:100%;box-sizing:border-box}.video-cell video{width:100%;flex:1 1 0;min-height:0;object-fit:var(--video-fit, contain);border:1px solid #2a2a2e;background-color:#000}.video-cell canvas{aspect-ratio:16 / 9;width:100%!important}.player-wrapper{position:relative;width:100%;flex:1 1 0;min-height:0;overflow:hidden}#player-container{width:100%;height:100%;background:#000;border:1px solid #2a2a2e;overflow:hidden;position:relative}.player-mute-btn{position:absolute;bottom:10px;right:10px;z-index:10;display:flex;align-items:center;justify-content:center;width:36px;height:36px;padding:0;background:#0000008c;border:1px solid rgba(255,255,255,.18);border-radius:50%;color:#fff;cursor:pointer;transition:background .15s ease,opacity .15s ease;opacity:.7}.player-mute-btn:hover{background:#000c;opacity:1}.player-mute-btn .mute-icon--off,.player-mute-btn.is-muted .mute-icon--on{display:none}.player-mute-btn.is-muted .mute-icon--off{display:block}.banner__actions{display:flex;align-items:center;gap:8px}.settings-btn{background:transparent;border:1px solid #333;border-radius:6px;color:#777;cursor:pointer;padding:5px 7px;display:flex;align-items:center;justify-content:center;line-height:0;transition:border-color .15s,color .15s}.settings-btn:hover{border-color:#555;color:#ccc}.settings-modal{position:fixed;top:0;right:0;bottom:0;left:0;z-index:500;display:flex;align-items:center;justify-content:center;padding:20px}.settings-backdrop{position:absolute;top:0;right:0;bottom:0;left:0;background:#000000a6;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}.settings-dialog{position:relative;background:#1b1e23;border:1px solid #2e3035;border-radius:12px;width:480px;max-width:100%;max-height:calc(100vh - 40px);overflow-y:auto;padding:24px;display:flex;flex-direction:column;gap:20px;scrollbar-width:thin;scrollbar-color:#2e3035 transparent}.settings-section{display:flex;flex-direction:column;gap:12px}.settings-section__title{font-size:.625rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:#444;padding-bottom:8px;border-bottom:1px solid #252830;margin:0}.settings-field{display:flex;flex-direction:column;gap:5px}.settings-field--narrow{max-width:140px}.settings-field label{font-size:.625rem;font-weight:600;letter-spacing:.09em;text-transform:uppercase;color:#666;line-height:1}.settings-field__optional{text-transform:none;letter-spacing:0;font-weight:400;color:#444}.settings-field__hint{font-size:.6875rem;color:#424650;line-height:1.3}.settings-field input,.settings-field select,.settings-field textarea{background:#13151a;border:1px solid #2a2d34;border-radius:6px;color:#c8cdd6;font-family:SF Mono,Fira Code,Consolas,monospace;font-size:.8125rem;padding:7px 10px;width:100%;box-sizing:border-box;transition:border-color .15s}.settings-field input:focus,.settings-field select:focus,.settings-field textarea:focus{outline:none;border-color:#2e5bbf}.settings-field input::placeholder,.settings-field textarea::placeholder{color:#363a44}.settings-field select{-moz-appearance:none;appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' fill='none'%3E%3Cpath d='M1 1.5l5 5 5-5' stroke='%23555' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center;cursor:pointer}.settings-field textarea{resize:vertical;font-size:.75rem;line-height:1.5}.settings-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}.settings-checkbox{display:flex;align-items:center;gap:8px;padding:2px 0}.settings-checkbox input[type=checkbox]{width:15px;height:15px;accent-color:#4f96c0;cursor:pointer;flex-shrink:0}.settings-checkbox label{font-size:.8125rem;color:#888;cursor:pointer;-webkit-user-select:none;user-select:none}.settings-actions{display:flex;justify-content:flex-end;gap:8px;padding-top:4px}.settings-actions__cancel{background:transparent;border:1px solid #2e3035;border-radius:6px;color:#777;cursor:pointer;font-size:.875rem;font-family:inherit;padding:8px 18px;transition:border-color .15s,color .15s}.settings-actions__cancel:hover{border-color:#555;color:#bbb}.settings-actions__apply{background-color:#4f96c0;border:none;border-radius:6px;color:#fff;cursor:pointer;font-size:.875rem;font-family:inherit;font-weight:500;padding:8px 18px;transition:background .15s}.settings-actions__apply:hover{background:#1e40af}