:root{font-family:system-ui,-apple-system,sans-serif;color:#e8edea;background:#111714;color-scheme:dark}*{box-sizing:border-box}body{margin:0}main{max-width:960px;margin:auto;padding:32px 24px}header{display:flex;justify-content:space-between;gap:16px;font-size:12px;letter-spacing:.06em}a{color:#b4cbbd}h1{font-size:clamp(28px,5vw,46px);font-weight:500;letter-spacing:-.04em;margin:38px 0 14px}p{color:#aebcb4;line-height:1.7;font-size:14px}strong{font-weight:500;color:#e6c88b}#stage{position:relative;width:100%;height:clamp(300px,60vh,620px);margin-top:24px;background:#1d2822;border:1px solid #37483c;border-radius:16px;overflow:hidden}video,canvas{position:absolute;inset:0;width:100%;height:100%}video{object-fit:cover;transform:scaleX(-1)}canvas{pointer-events:none}#placeholder{position:absolute;inset:0;display:grid;place-items:center;color:#88978d}.controls{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:20px 0}button{border:1px solid #6d9279;border-radius:30px;padding:12px 22px;background:#bfddc9;color:#142a1b;font:inherit;cursor:pointer}button#stop{background:transparent;color:#c0d0c6}button:disabled{opacity:.4;cursor:default}output{color:#b3c8bc;font-size:13px}.diagnostics{display:flex;justify-content:space-between;font-size:13px;gap:16px}#error{color:#ffb6a9;min-height:24px}footer{border-top:1px solid #304236;margin-top:28px;padding-top:12px}
:root #placeholder[hidden]{display:none}