:root{color:#e8eef5;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;background:#0c141e;font-family:system-ui,-apple-system,sans-serif;font-size:16px}*{box-sizing:border-box}body{margin:0}main{max-width:960px;padding:24px max(20px,env(safe-area-inset-right)) max(28px,env(safe-area-inset-bottom)) max(20px,env(safe-area-inset-left));margin:auto}header{margin-bottom:20px}h1{margin:8px 0;font-size:1.9rem;line-height:1.1}p{color:#bccbd9;line-height:1.6}.eyebrow{letter-spacing:.14em;color:#83c9ff;font-size:.75rem;font-weight:700}.simulated{color:#302107;background:#f8c85e;border-radius:8px;margin:14px 0;padding:12px;font-weight:800}.viewer{aspect-ratio:2;background:#152332;border-radius:12px;min-height:200px;position:relative;overflow:hidden}.viewer video,.viewer canvas{object-fit:contain;touch-action:none;width:100%;height:100%}.viewer video.texture{opacity:.01;width:1px;height:1px;position:absolute}.viewer canvas[hidden]{display:none}.badge{color:#fac977;background:#101a28e8;border-radius:20px;padding:7px 11px;font-size:.8rem;position:absolute;top:12px;left:12px}.badge.live{color:#93e7b0}.row{flex-wrap:wrap;align-items:center;gap:12px;margin:14px 0;display:flex}button,select,input{font:inherit}button,select{color:#f2f6fb;background:#1e3041;border:1px solid #415367;border-radius:8px;min-height:48px;padding:10px 16px;font-weight:600}button{cursor:pointer}button:hover:enabled{background:#2b4560}button:focus-visible,select:focus-visible{outline-offset:3px;outline:3px solid #a6d9ff}button:disabled{opacity:.45;cursor:not-allowed}input:not([type=checkbox]){color:#fff;background:#152332;border:1px solid #415367;border-radius:6px;width:100%;min-height:48px;margin:10px 0;padding:10px;display:block}input[type=checkbox]{vertical-align:middle;width:20px;height:20px;margin-right:8px}label{font-size:.9rem;display:block}select{max-width:100%;margin-top:6px;display:block}.status{border-top:1px solid #293b4e;grid-template-columns:repeat(4,1fr);gap:16px;padding:22px 0;display:grid}.status small{color:#a6b5c4;margin-bottom:6px;display:block}.status strong{text-transform:capitalize}.record{grid-template-columns:1fr 1fr;gap:12px;display:grid}.record button{min-height:64px;font-size:1.1rem}.record .start{color:#fff;background:#bc3d48;border-color:#ee6b74}.hint,footer{color:#96aabd;font-size:.85rem}details{border-top:1px solid #293b4e;padding-top:18px}summary{cursor:pointer;min-height:48px}footer{margin-top:28px}pre{background:#152332;padding:14px;font-size:.8rem;overflow:auto}a{color:#9ed8ff;overflow-wrap:anywhere}@media (max-width:540px){main{padding-top:20px}.status{grid-template-columns:1fr 1fr}.record{grid-template-columns:1fr}h1{font-size:1.6rem}.row button{flex:1}.viewer{min-height:180px}}html,body,#root{width:100%;height:100%;min-height:0}html,body{overflow:hidden}#root{overscroll-behavior-y:contain;height:100dvh;overflow:auto}.viewer.perspective{aspect-ratio:16/9;min-height:0}.viewer canvas{cursor:grab;-webkit-user-select:none;user-select:none;display:block}.viewer canvas:active{cursor:grabbing}.viewer canvas:focus-visible{outline-offset:-3px;outline:3px solid #a6d9ff}.badge{pointer-events:none}.view-error{text-align:center;background:#152332;padding:12px;position:absolute;inset:35% 20px auto}.controller{padding-top:16px}.controller-header{margin-bottom:14px}.controller-header h1{margin:4px 0;font-size:1.35rem;line-height:1.2}.controller-header p{margin:0;font-size:.85rem}.record-panel{margin:12px 0 16px}.record-state{color:#bccbd9;justify-content:space-between;align-items:center;gap:12px;margin-bottom:8px;font-size:.9rem;display:flex}.record-state strong{text-transform:capitalize;color:#f2f6fb}.record-state>span:last-child{font-variant-numeric:tabular-nums}.controller .record{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.controller .record button{min-height:52px;padding:10px 8px;font-size:1rem}.feedback{margin:8px 0 0;font-size:.85rem}.view-controls{gap:8px;margin:16px 0;display:grid}.direction-controls{grid-template-columns:repeat(5,minmax(0,1fr));gap:6px;display:grid}.direction-controls button{padding:10px 4px;font-size:.85rem}.view-tools{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px;display:flex}.zoom-controls{grid-template-columns:repeat(2,minmax(0,1fr));gap:0;display:grid}.zoom-controls button{white-space:nowrap;border-radius:0;padding:10px 12px;font-size:.85rem}.zoom-controls button:first-child{border-radius:8px 0 0 8px}.zoom-controls button:last-child{border-left:0;border-radius:0 8px 8px 0}.calibrate{color:#9ed8ff;background:0 0;border-color:#0000;margin-left:auto;padding:10px 4px;font-size:.8rem;font-weight:500}.preview-controls{flex-wrap:wrap;gap:8px;margin:16px 0;display:flex}.preview-controls button{font-size:.85rem;font-weight:500}.quality-controls{border:0;border-top:1px solid #293b4e;min-width:0;margin:20px 0 0;padding:12px 0 0}.quality-controls legend{color:#bccbd9;padding:0 8px 0 0;font-size:.9rem}.quality-options{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;display:grid}.quality-options button{text-align:left;padding:10px 12px}.quality-options small{color:#bccbd9;margin-top:4px;font-size:.75rem;font-weight:400;display:block}.quality-options button[aria-pressed=true]{background:#1c3e57;border-color:#83c9ff;box-shadow:inset 0 0 0 1px #83c9ff}.quality-options button[aria-pressed=true] span:before{content:"✓ "}.quality-controls .hint{margin:8px 0 16px}@media (max-width:360px){.controller .record button{font-size:.85rem}.direction-controls button{font-size:.75rem}.zoom-controls button{padding-inline:10px}.quality-options button{padding:10px 8px}}.club .viewer video.texture{opacity:1;z-index:0;pointer-events:none;width:100%;height:100%;inset:0}.club .viewer canvas{z-index:1;background:#152332;position:relative}.club .viewer .badge,.club .viewer .view-error{z-index:2}.viewer-shell{background:#0c141e}:is(.viewer-shell:fullscreen,.viewer-shell.expanded){width:100%;height:100%;padding:12px max(12px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left));background:#0c141e;overflow:auto}.viewer-shell.expanded{z-index:1000;height:100dvh;position:fixed;inset:0}:is(.viewer-shell:fullscreen .viewer,.viewer-shell.expanded .viewer){max-height:62dvh;margin:auto}.viewer.flat-fallback{aspect-ratio:2}.club .viewer video.fallback-video{object-fit:contain;width:100%;height:100%;display:block;position:relative}.club .viewer canvas[hidden]{display:none}.fallback-label{z-index:2;background:#101a28dd;margin:0;padding:6px 10px;font-size:.75rem;position:absolute;bottom:0;left:0;right:0}@media (orientation:landscape) and (max-height:600px){:is(.viewer-shell:fullscreen .viewer,.viewer-shell.expanded .viewer){max-height:60dvh}.viewer-shell .view-controls,.viewer-shell .preview-controls{margin:8px 0}}.compact-view-controls{margin:10px 0 12px;display:block}.gesture-guide{color:#b5c7d7;align-items:center;gap:10px;min-width:0;margin:0 0 6px;display:flex}.gesture-graphic{color:#99c6e5;flex:0 0 52px;width:52px;height:52px}.gesture-arrows{opacity:.65}.gesture-accent{stroke:#f5c77a;stroke-width:3px}.gesture-guide p{margin:0;font-size:.8rem;line-height:1.45}.gesture-guide strong{color:#e0ebf5;font-size:.85rem;font-weight:550}.gesture-guide p>span{color:#93a9bd;font-size:.76rem;display:block}.touch-guide{display:none}.view-toolbar{flex-wrap:wrap;align-items:center;gap:4px;display:flex}.controller .quiet-button{box-shadow:none;color:#b9ccde;background:0 0;border-color:#0000;min-height:48px;padding:8px 10px;font-size:.82rem;font-weight:500}.controller .quiet-button:hover:enabled{color:#fff;background:#1a2b3c}.controller .quiet-button:disabled{opacity:.4}.forward-button{white-space:nowrap}.forward-button span{margin-right:3px}.compact-zoom{border:1px solid #293d50;border-radius:9px;gap:0;display:flex}.controller .compact-zoom button{border:0;border-radius:8px;min-width:48px;padding:4px 10px;font-size:1.2rem;line-height:1}.primary-view-actions{flex-wrap:wrap;align-items:center;gap:4px;margin-left:auto;display:flex}.primary-view-actions .play-button{min-height:48px;padding:8px 12px;font-size:.85rem}.more-view-controls{border:0;margin:0;padding:0}.more-view-controls summary{color:#93a9bd;border-radius:8px;width:-moz-fit-content;width:fit-content;min-height:48px;padding:14px 10px;font-size:.78rem;list-style-position:inside;display:list-item}.more-view-controls summary:focus-visible{outline-offset:2px;outline:3px solid #a6d9ff}.more-controls-body{border-top:1px solid #26394c;padding:8px 0 4px}.more-view-controls .direction-controls{flex-wrap:wrap;gap:4px;display:flex}.more-view-controls .direction-controls button{flex:1;min-width:64px}.more-view-controls .calibrate{margin:0;font-size:.78rem}.more-view-controls .hint{margin:0 10px 6px;font-size:.75rem}.secondary-view-actions{flex-wrap:wrap;gap:4px;display:flex}.recovery-action{margin:0 0 8px}.controller .record-panel{border-top:1px solid #293b4e;margin:12px 0;padding-top:12px}.controller .record button{background:0 0;border-color:#3d5265;min-height:48px;padding:8px 12px;font-size:.88rem}.controller .record .start{color:#ffabb0;background:#321e2a;border-color:#80424e}.controller .record-state,.controller .feedback{font-size:.8rem}.controller .quality-controls{margin-top:12px;padding-top:8px}.controller .quality-options{flex-wrap:wrap;gap:6px;display:flex}.controller .quality-options button{background:0 0;min-height:48px;padding:8px 12px;font-size:.82rem}.controller .quality-options button[aria-pressed=true]{box-shadow:none;background:#1b3549}.controller>p[role=status]{margin:8px 0 12px;font-size:.82rem;line-height:1.5}:is(.viewer-shell:fullscreen,.viewer-shell.expanded){padding-top:max(12px,env(safe-area-inset-top))}@media (any-pointer:coarse){.touch-guide{display:initial}.mouse-guide{display:none}.gesture-guide strong.touch-guide{display:block}}@media (max-width:540px){.controller{padding-top:max(16px,env(safe-area-inset-top));padding-inline:max(12px,env(safe-area-inset-left)) max(12px,env(safe-area-inset-right))}.controller-header{margin-bottom:12px}.gesture-guide{gap:6px}.gesture-graphic{flex-basis:44px;width:44px;height:44px}.gesture-guide strong{font-size:.8rem}.gesture-guide p>span{font-size:.72rem}.view-toolbar{gap:2px}.controller .quiet-button{padding-inline:8px}.controller .compact-zoom button{min-width:48px}.controller .record{gap:6px}.controller .record button{font-size:.82rem}}
