body{margin:0;font-family:sans-serif;background:#111;color:#eee;text-align:center}button{font-family:inherit;font-size:1rem;font-weight:600;padding:.6rem 1.5rem;min-width:7.5rem;border-radius:999px;border:1px solid transparent;cursor:pointer;transition:transform .15s ease,box-shadow .15s ease,filter .2s ease,border-color .2s ease;color:#fff;background:linear-gradient(135deg,#2f7d3b,#1b5e20);box-shadow:0 0 #0000}button#stopBtn{background:linear-gradient(135deg,#a42828,#720a0a)}button:enabled:hover{transform:translateY(-1px);box-shadow:0 8px 20px #00000059}button:enabled:active{transform:translateY(0);box-shadow:0 4px 12px #0006;filter:brightness(1.05)}button:focus-visible{outline:3px solid #4dabf7;outline-offset:2px}button:disabled{opacity:.45;cursor:not-allowed;box-shadow:none;transform:none}#video-wrapper{position:relative;display:inline-block}#video,#overlay{width:640px;height:480px}#video{border:2px solid #444;background:#000}#overlay{position:absolute;top:0;left:0}#logs{max-height:200px;overflow-y:auto;text-align:left;padding:0 1rem}#controls{margin:1rem 0;display:flex;flex-direction:column;gap:.75rem;align-items:center}.button-row{display:flex;gap:.75rem;flex-wrap:wrap;justify-content:center}#logs li{list-style:none;margin:.25rem 0}#statusIndicator{display:inline-flex;align-items:center;gap:.55rem;padding:.4rem .9rem;border-radius:999px;border:1px solid #2a2a2a;background:#00000059;box-shadow:inset 0 0 0 1px #ffffff0d;min-width:15rem;justify-content:center}#statusIndicator[data-state=error]{border-color:#e5534b8c;box-shadow:inset 0 0 0 1px #e5534b40}#statusIndicator[data-state=active]{border-color:#2eb385a6;box-shadow:inset 0 0 0 1px #2eb38559}#statusIndicator[data-state=ready]{border-color:#6fa4ff80;box-shadow:inset 0 0 0 1px #6fa4ff47}.status-dot{width:.65rem;height:.65rem;border-radius:50%;background:#777;box-shadow:0 0 10px #ffffff26;position:relative;transition:background-color .3s ease,transform .3s ease,box-shadow .3s ease}@keyframes pulse{0%,to{transform:scale(1);box-shadow:0 0 #ffffff14}50%{transform:scale(1.2);box-shadow:0 0 0 6px #fff0}}#statusIndicator[data-state=loading] .status-dot{background:#f0a202;animation:pulse 1.4s ease-in-out infinite}#statusIndicator[data-state=active] .status-dot{background:#2ecc71;animation:pulse 1.6s ease-in-out infinite}#statusIndicator[data-state=ready] .status-dot{background:#64b5f6}#statusIndicator[data-state=error] .status-dot{background:#ef5350;animation:none}#statusIndicator[data-state=idle] .status-dot{background:#888;animation:none}#statusText{font-size:.95rem;letter-spacing:.01em}#statusIndicator[data-state=loading] #statusText{color:#ffd59f}#statusIndicator[data-state=active] #statusText{color:#d4ffe9}#statusIndicator[data-state=ready] #statusText{color:#d6e8ff}#statusIndicator[data-state=error] #statusText{color:#ffd0d0}#statusIndicator[data-state=idle] #statusText{color:#ededed}