*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#080808;color:#fff;font:14px system-ui}#stage{position:fixed;inset:0}#camera,#overlay{position:absolute;width:100%;height:100%;object-fit:cover}#message{position:absolute;inset:45% 1rem auto;text-align:center;text-shadow:0 1px 4px #000}#gear{position:fixed;right:1rem;top:1rem;font-size:22px;background:#171717dd;color:#fff;border:1px solid #777;border-radius:50%;width:44px;height:44px}#settings{position:fixed;right:1rem;top:4.5rem;width:min(340px,calc(100% - 2rem));max-height:calc(100% - 8rem);overflow:auto;--tp-blade-value-width:150px}@media (pointer:coarse){#settings{--tp-container-unit-size:32px;--tp-base-font-family:system-ui,sans-serif}}label{display:block;margin:0 0 .8rem}input[type=range],select{width:100%}.tip{display:none;color:#ccc;font-size:12px;margin-top:2px}:focus+.tip,label:focus-within>.tip,#gear:focus .tip,#reset:focus .tip{display:block}footer{position:fixed;bottom:.4rem;left:.6rem;font-size:11px;text-shadow:0 1px 3px #000}a{color:inherit}.ui-hidden #gear,.ui-hidden #settings{display:none}#stage.pip{inset:auto 1rem 2.5rem auto;box-shadow:0 2px 18px #000;aspect-ratio:16/9}.pip #camera,.pip #overlay{object-fit:cover}#diag{position:fixed;left:.6rem;bottom:1.6rem;margin:0;font:11px ui-monospace,monospace;color:#cfe;text-shadow:0 1px 3px #000;pointer-events:none}.ui-hidden #diag{display:none}
#gear[aria-expanded=true] .tip{display:none}
#frame{position:absolute;pointer-events:none}