:root{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color:#21343d;background:#f3f5f3;font-synthesis:none}*{box-sizing:border-box}body{margin:0}main{max-width:1600px;margin:auto;padding:28px 36px}header,.brand,.panel-heading,.buttons{display:flex;align-items:center}header{justify-content:space-between;border-bottom:1px solid #dce2df;padding-bottom:22px}.brand{gap:12px;font-size:14px;font-weight:750;letter-spacing:2px}.brand small{display:block;font-weight:400;letter-spacing:0;font-size:11px;color:#667c82;margin-top:4px}.logo{display:grid;place-items:center;background:#164f47;color:#d6f7ac;width:42px;height:42px;border-radius:12px;font-size:34px}.phase,.eyebrow{font:600 11px ui-monospace,monospace;letter-spacing:1.6px}.phase{border:1px solid #c5d4cc;border-radius:30px;padding:10px 14px;color:#42645a}.intro{padding:32px 0 25px}.eyebrow{color:#547b67}h1{font-size:32px;letter-spacing:-1px;margin:10px 0}h1 span{font-weight:400;font-size:17px;color:#75858b;letter-spacing:0;margin-left:20px}.intro p,.caption{font-size:13px;color:#65777e;line-height:1.7}.layout{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(340px,1fr);gap:22px;align-items:start}.panel{background:#fff;border:1px solid #dce3df;border-radius:16px;overflow:hidden}.panel-heading{justify-content:space-between;gap:12px;padding:18px 20px;border-bottom:1px solid #e9edeb;flex-wrap:wrap}h2{font-size:14px;margin:0;font-weight:650}.panel-heading>span{font-size:12px;color:#57736b}.dot{display:inline-block;width:7px;height:7px;background:#6b9083;border-radius:50%;margin-right:9px}.viewfinder{background:#101c24;aspect-ratio:16/10;position:relative;display:flex;align-items:center;justify-content:center;margin:14px;border-radius:10px;overflow:hidden}video{width:100%;height:100%;object-fit:contain}.placeholder{position:absolute;text-align:center;color:#dbe7e6;padding:25px;pointer-events:none}.placeholder>span{font-size:65px;color:#80968f}.placeholder h3{font-weight:500;font-size:18px}.placeholder p,.placeholder small{font-size:12px;color:#a2b3b9;line-height:1.7}.resolution{position:absolute;bottom:13px;left:13px;font:11px ui-monospace,monospace;background:#20333ee6;color:#cfdddc;padding:7px 10px;border-radius:5px}.controls{padding:6px 20px 15px}label{display:block;font-size:12px;font-weight:600;margin:0 0 8px}select{width:100%;padding:13px;background:#fff;border:1px solid #c8d4ce;border-radius:8px;font-size:15px;color:#21343d}.buttons{gap:10px;margin-top:14px;flex-wrap:wrap}button{font:500 13px inherit;font-family:inherit;font-size:13px;padding:11px 14px;min-height:44px;border-radius:8px;border:1px solid #ccd8d2;background:#fff;color:#28463d;cursor:pointer}button:hover{background:#eef4ee}button.primary{background:#235f50;border-color:#235f50;color:#fff}button:disabled{opacity:.45;cursor:not-allowed}button:focus-visible,select:focus-visible,summary:focus-visible,textarea:focus-visible{outline:3px solid #c39c44;outline-offset:3px}.settings{border-top:1px solid #e9edeb;padding:16px 20px}.settings h3{font-size:12px;margin:0}.settings p{font-size:12px;color:#687d78}pre{font:12px/1.7 ui-monospace,SFMono-Regular,monospace;white-space:pre-wrap;overflow-wrap:anywhere;color:#58726b}aside{display:grid;gap:18px}dl{margin:8px 20px}dl>div{display:flex;justify-content:space-between;gap:15px;padding:11px 0;border-bottom:1px solid #edf0ee;font-size:12px}dt{color:#718078}dd{margin:0;text-align:right;max-width:65%;line-height:1.5}.good{color:#237b55}.bad{color:#b43f2d}details{margin:16px 20px}summary{font-size:12px;cursor:pointer}.ua{font:11px/1.7 monospace;overflow-wrap:anywhere}.count{background:#eaf2ec;border-radius:4px;padding:3px 6px;margin-left:5px}.devices .caption,.empty{margin:14px 20px}.empty{font-size:13px;color:#718078;line-height:1.7}.device{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 20px;border-top:1px solid #e9edeb}.device strong{font-size:13px;overflow-wrap:anywhere}.device small{display:block;font:11px/1.8 monospace;color:#7b8b84;margin:7px 0}.device span{font-size:11px;color:#547968}.device button{flex-shrink:0}.notice{padding:22px;background:#e9efde;border:1px solid #dbe4ce;border-radius:14px}.notice>span{font-size:10px;letter-spacing:2px;color:#607446}.notice h3{font-size:16px;font-weight:600;margin:10px 0}.notice p{font-size:12px;line-height:1.9;margin-bottom:0;color:#52604a}.logs{margin-top:22px}.logs>pre{max-height:260px;overflow:auto;margin:0;padding:18px 20px;background:#f9fbf9}.logs>p{font-size:12px;margin:10px 20px}textarea{width:100%;height:260px;font:12px/1.5 monospace;margin-top:14px;padding:12px;border:1px solid #c8d4ce;border-radius:8px}footer{padding:24px 0;font-size:11px;color:#829086}footer span{margin-right:15px;letter-spacing:1px;font-family:monospace}.error{margin:0 20px 16px;padding:16px;background:#fff0e9;color:#993e29;border-radius:8px;font-size:13px;overflow-wrap:anywhere}@media(min-width:1600px){main{padding-top:40px}.viewfinder{aspect-ratio:16/11}}@media(max-width:850px){main{padding:18px}.layout{grid-template-columns:1fr}h1 span{display:block;margin:8px 0 0}.intro{padding:25px 0}.phase{font-size:9px}.brand{letter-spacing:1px}}@media(prefers-reduced-motion:no-preference){button{transition:background .15s}}