html,body{color:#fff;background:#000;height:100%;margin:0;font-family:system-ui,sans-serif;overflow:hidden}[hidden]{display:none!important}canvas#cameraFeed{position:fixed;inset:0}video#cameraVideo,canvas#cameraImage{object-fit:cover;width:100%;height:100%;position:fixed;inset:0}canvas#cameraFeed{width:100%;height:100%}.hotspots{z-index:5;pointer-events:none;position:fixed;inset:0}.hotspot{--progress:0;will-change:transform;position:absolute;top:0;left:0}.hotspot .dot{background:conic-gradient(#f2c230 calc(var(--progress) * 360deg), #ffffff80 0);border-radius:50%;width:28px;height:28px;position:absolute;top:-14px;left:-14px;box-shadow:0 0 6px #0009}.hotspot .dot:after{content:"";background:radial-gradient(circle,#f2c230 0 5px,#14202bbf 6px);border-radius:50%;position:absolute;inset:4px}.hotspot:not(.active) .dot{animation:1.6s ease-in-out infinite hotspot-pulse}@keyframes hotspot-pulse{50%{transform:scale(1.25)}}.hotspot .line{transform-origin:0;background:#f2c230;width:80px;height:2px;position:absolute;top:0;left:10px;transform:rotate(-40deg);box-shadow:0 0 3px #000000b3}.hotspot .tag{pointer-events:auto;gap:6px;display:flex;position:absolute;top:-51px;left:71px;transform:translateY(-50%)}.hotspot .label,.hotspot .close{color:#fff;font:inherit;white-space:nowrap;background:#14202bd9;border:2px solid #f2c230;border-radius:6px;padding:6px 12px;font-size:16px;font-weight:600}.hotspot .close{min-width:40px;font-size:20px;line-height:1}.hotspot:not(.active) .close,.hotspot:not(.focus) .line,.hotspot:not(.focus) .tag{display:none}.hotspot.left .line{left:-10px;transform:rotate(-140deg)}.hotspot.left .tag{left:auto;right:71px}.hotspot.active .label{color:#14202b;background:#f2c230}.aim-reticle{border:2px solid #fffc;border-radius:50%;width:24px;height:24px;margin:-12px 0 0 -12px;position:absolute;top:50%;left:50%;box-shadow:0 0 3px #0009}.notice{top:calc(max(16px, env(safe-area-inset-top)) + 64px);background:#2e7d32e6}.part-bar{left:max(12px, env(safe-area-inset-left));right:max(12px, env(safe-area-inset-right));bottom:max(12px, env(safe-area-inset-bottom));z-index:15;pointer-events:none;flex-wrap:wrap;justify-content:center;gap:12px;display:flex;position:fixed}.part-bar>*{pointer-events:auto}.toggle-group{background:#14202bcc;border-radius:14px;gap:6px;padding:6px;display:flex}.toggle-group:not(.view){scrollbar-width:none;max-width:100%;overflow-x:auto}.toggle-group button{white-space:nowrap;color:#fff;background:0 0;border:2px solid #f2c230;border-radius:10px;flex:none;min-height:48px;padding:0 16px;font-size:16px;font-weight:600}.toggle-group button[aria-pressed=true],.toggle-group button[aria-checked=true]{color:#14202b;background:#f2c230}.toggle-group.view button{border-color:#5a6773}.toggle-group.view button[aria-checked=true]{border-color:#f2c230}.info-panel:not([hidden])~.part-bar{right:calc(var(--info-panel-width) + 12px)}@media (height<=500px){.part-bar{bottom:max(6px, env(safe-area-inset-bottom));gap:8px}.toggle-group{gap:4px;padding:4px}.toggle-group button{min-height:40px;padding:0 10px;font-size:14px}}:root{--info-panel-width:min(280px, 32vw)}.info-panel{z-index:25;width:var(--info-panel-width);padding:max(20px, env(safe-area-inset-top)) max(20px, env(safe-area-inset-right)) 20px 20px;box-sizing:border-box;touch-action:pan-y;background:#14202bf0;line-height:1.45;animation:.2s ease-out slide-in;position:fixed;top:0;bottom:0;right:0;overflow-y:auto}@keyframes slide-in{0%{transform:translate(100%)}}.info-panel h2{color:#f2c230;margin:0 40px 4px 0}.info-panel .subtitle{opacity:.8;margin:0 0 16px}.info-panel dl{grid-template-columns:auto 1fr;gap:6px 16px;margin:0 0 16px;display:grid}.info-panel dt{opacity:.7}.info-panel dd{margin:0;font-weight:600}@media (height<=500px){.info-panel{padding:max(14px, env(safe-area-inset-top)) max(14px, env(safe-area-inset-right)) 14px 14px;font-size:14px}.info-panel h2{font-size:20px}.info-panel dl{gap:4px 10px}}.info-panel .close{top:max(12px, env(safe-area-inset-top));right:max(12px, env(safe-area-inset-right));color:#fff;background:#ffffff1f;border:0;border-radius:22px;width:44px;height:44px;font-size:28px;line-height:1;position:absolute}.orientation-hint{z-index:40;text-align:center;background:#14202b;flex-direction:column;justify-content:center;align-items:center;gap:24px;font-size:24px;display:flex;position:fixed;inset:0}.orientation-hint .small{opacity:.8;max-width:24em;margin:-12px 0 0;font-size:16px}.orientation-hint button{color:#fff;background:0 0;border:2px solid #5a6773;border-radius:10px;padding:12px 20px;font-size:16px}.restart{top:calc(max(16px, env(safe-area-inset-top)) + 150px);z-index:20;color:#14202b;background:#f2c230;border:0;border-radius:12px;padding:14px 24px;font-size:18px;font-weight:600;position:fixed;left:50%;transform:translate(-50%)}.top-left{top:max(8px, env(safe-area-inset-top));left:max(8px, env(safe-area-inset-left));z-index:20;align-items:center;gap:8px;display:flex;position:fixed}.debug{white-space:pre;pointer-events:none;background:#14202bcc;border-radius:8px;padding:6px 10px;font:12px/1.4 ui-monospace,monospace}.exit{color:#fff;background:#14202bd9;border:0;border-radius:10px;min-height:44px;padding:0 16px;font-size:16px;font-weight:600}.start{z-index:10;padding:24px max(24px, env(safe-area-inset-right)) 24px max(24px, env(safe-area-inset-left));text-align:center;background:#14202b;flex-direction:column;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.start .mode-choice{gap:8px;display:flex}.start .mode-choice button{color:#fff;background:0 0;border:2px solid #f2c230;min-width:110px;margin-top:0;padding:12px 20px;font-size:18px}.start .mode-choice button[aria-checked=true]{color:#14202b;background:#f2c230}.start .browser-info{opacity:.6;margin:12px 0 0;font-size:13px}.start h1{color:#f2c230;margin:0 0 12px}.start p{max-width:32em;line-height:1.5}.start button{color:#14202b;background:#f2c230;border:0;border-radius:12px;min-width:240px;margin-top:16px;padding:18px 28px;font-size:20px;font-weight:600}.start button:disabled{opacity:.5}.license{bottom:max(12px, env(safe-area-inset-bottom));opacity:.7;font-size:12px;position:absolute}.license a{color:inherit}.hint,.error{top:max(16px, env(safe-area-inset-top));z-index:20;text-align:center;pointer-events:none;background:#14202bd9;border-radius:12px;max-width:calc(100% - 280px);padding:12px 20px;font-size:18px;position:fixed;left:50%;transform:translate(-50%)}.error{pointer-events:auto;background:#b3261e}.record video#preview{object-fit:cover;width:100%;height:100%;position:fixed;inset:0}.record input{border:0;border-radius:8px;min-width:240px;margin-top:8px;padding:12px;font-size:18px}.stop{bottom:max(24px, env(safe-area-inset-bottom));z-index:20;color:#fff;background:#b3261e;border:0;border-radius:12px;padding:18px 28px;font-size:20px;font-weight:600;position:fixed;left:50%;transform:translate(-50%)}@media (width<=600px){.hint,.error{top:calc(max(8px, env(safe-area-inset-top)) + 56px);max-width:calc(100% - 32px)}.debug{top:auto;bottom:120px}}body.webxr{background:0 0}html:has(body.webxr){background:0 0}body.webxr #cameraFeed{opacity:0}