*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:#0a0a0f;color:#e0e0e0;height:100vh;overflow:hidden}#root{height:100vh;display:flex;flex-direction:column}.axis-panel{position:absolute;bottom:16px;left:16px;background:#0a0a14e0;border:1px solid #1e1e3a;border-radius:8px;padding:10px 12px;display:flex;flex-direction:column;gap:7px;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);min-width:190px}.axis-panel-title{font-size:10px;font-weight:600;letter-spacing:1.5px;text-transform:uppercase;color:#445;margin-bottom:2px}.axis-row{display:flex;align-items:center;gap:7px}.axis-label{font-size:12px;font-weight:700;font-family:SF Mono,Fira Code,monospace;width:14px}.axis-x{color:#f44}.axis-y{color:#39f}.axis-z{color:#3f6}.axis-row select{flex:1;background:#112;border:1px solid #222244;border-radius:4px;color:#aac;font-size:12px;padding:3px 6px;cursor:pointer;outline:none}.axis-row select:focus{border-color:#5af}.sign-btn{width:26px;height:24px;border-radius:4px;border:1px solid #222244;background:#112;color:#778;font-size:14px;line-height:1;cursor:pointer;transition:all .1s}.sign-btn.inverted{background:#1a0a0a;border-color:#622;color:#f66}.sign-btn:hover{border-color:#5af;color:#5af}.reset-btn{margin-top:2px;padding:4px;border-radius:4px;border:1px solid #1e1e3a;background:transparent;color:#445;font-size:11px;cursor:pointer;transition:all .1s}.reset-btn:hover{border-color:#334;color:#778}.rec-panel{position:absolute;top:16px;right:16px;background:#0a0a14e0;border:1px solid #1e1e3a;border-radius:8px;padding:10px 12px;display:flex;flex-direction:column;gap:8px;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);min-width:160px}.rec-title{font-size:10px;font-weight:600;letter-spacing:1.5px;text-transform:uppercase;color:#445}.rec-buttons{display:flex;gap:6px}.rec-btn{flex:1;padding:5px 4px;border-radius:5px;border:1px solid #222244;background:#112;color:#aac;font-size:11px;cursor:pointer;transition:all .1s;white-space:nowrap}.rec-btn.start:not(.disabled):hover{background:#0a1a0a;border-color:#3f6;color:#3f6}.rec-btn.stop:not(.disabled):hover{background:#1a0a0a;border-color:#f64;color:#f64}.rec-btn.save:not(.disabled):hover{background:#0a0f1a;border-color:#5af;color:#5af}.rec-btn.disabled{opacity:.3;cursor:not-allowed}.rec-indicator{font-size:11px;color:#f44;animation:recpulse .8s ease-in-out infinite alternate;text-align:center}@keyframes recpulse{0%{opacity:1}to{opacity:.3}}.replay-panel{position:absolute;bottom:16px;left:50%;transform:translate(-50%);background:#0a0a14eb;border:1px solid #1e1e3a;border-radius:10px;padding:12px 16px;display:flex;flex-direction:column;gap:9px;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);min-width:340px;max-width:460px}.replay-header{display:flex;align-items:center;justify-content:space-between}.replay-title{font-size:10px;font-weight:600;letter-spacing:1.5px;text-transform:uppercase;color:#445}.replay-load-btn{padding:3px 10px;border-radius:4px;border:1px solid #222244;background:#112;color:#7af;font-size:11px;cursor:pointer;transition:all .1s}.replay-load-btn:hover{border-color:#5af;color:#5af}.replay-filename{font-size:11px;color:#556;font-family:SF Mono,Fira Code,monospace;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.replay-scrubber-row{display:flex;align-items:center;gap:8px}.replay-time{font-size:11px;color:#556;font-family:SF Mono,Fira Code,monospace;white-space:nowrap;min-width:52px}.replay-time:last-child{text-align:right}.replay-scrubber{flex:1;-webkit-appearance:none;-moz-appearance:none;appearance:none;height:4px;border-radius:2px;background:#1e1e3a;outline:none;cursor:pointer}.replay-scrubber::-webkit-slider-thumb{-webkit-appearance:none;width:12px;height:12px;border-radius:50%;background:#5af;cursor:pointer;transition:transform .1s}.replay-scrubber::-webkit-slider-thumb:hover{transform:scale(1.3)}.replay-scrubber:disabled{opacity:.3;cursor:not-allowed}.replay-controls{display:flex;align-items:center;gap:10px}.replay-playpause{width:34px;height:34px;border-radius:50%;border:1px solid #335;background:#113;color:#5af;font-size:13px;cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:all .1s}.replay-playpause:hover:not(:disabled){background:#1a1a44;border-color:#5af}.replay-playpause:disabled{opacity:.3;cursor:not-allowed}.replay-speeds{display:flex;gap:4px}.speed-btn{padding:4px 7px;border-radius:4px;border:1px solid #1e1e3a;background:#0e0e1a;color:#445;font-size:11px;cursor:pointer;transition:all .1s}.speed-btn:hover{border-color:#334;color:#778}.speed-btn.active{background:#113;border-color:#5af;color:#5af}.replay-hint{font-size:11px;color:#334;text-align:center;font-style:italic}.phone-connect{display:flex;align-items:center;gap:10px;position:relative}.phone-btn{padding:6px 16px;border-radius:6px;border:1px solid #335;background:#112;color:#aac;font-size:13px;cursor:pointer;transition:all .15s;white-space:nowrap}.phone-btn:hover{background:#1a1a33;border-color:#5af;color:#5af}.phone-btn.active{background:#0a1a10;border-color:#3f6;color:#3f6}.phone-panel{position:absolute;top:100%;right:0;margin-top:8px;background:#0e0e1a;border:1px solid #1e1e3a;border-radius:10px;width:280px;z-index:100;box-shadow:0 12px 40px #0009}.phone-panel-header{display:flex;justify-content:space-between;align-items:center;padding:12px 14px;border-bottom:1px solid #1a1a2e;font-size:13px;font-weight:600;color:#8af}.phone-panel-close{background:none;border:none;color:#556;font-size:14px;cursor:pointer;padding:2px 6px}.phone-panel-close:hover{color:#aac}.phone-panel-body{padding:14px;display:flex;flex-direction:column;align-items:center;gap:10px}.phone-step{font-size:12px;color:#667;align-self:flex-start}.phone-qr{border-radius:8px;margin:4px 0}.phone-url{font-size:10px;color:#5af;background:#112;border:1px solid #222233;border-radius:4px;padding:4px 8px;word-break:break-all;text-align:center;width:100%;font-family:SF Mono,Fira Code,monospace}.phone-go-btn{width:100%;padding:10px;border-radius:8px;border:1px solid #5af;background:#113;color:#5af;font-size:14px;font-weight:600;cursor:pointer;transition:all .15s;margin-top:4px}.phone-go-btn:hover{background:#1a1a44}.phone-status-badge{font-size:11px;color:#fa3;animation:pulse 1.2s ease-in-out infinite alternate}.phone-status-badge.has-phone{color:#3f6;animation:none}.mobile-warning-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:9999;background:#000000bf;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;padding:24px}.mobile-warning-modal{background:#0e0e1a;border:1px solid #1e1e3a;border-radius:16px;padding:36px 32px 28px;max-width:360px;width:100%;text-align:center;box-shadow:0 0 60px #55aaff14}.mobile-warning-icon{font-size:40px;margin-bottom:16px}.mobile-warning-title{font-size:20px;font-weight:700;color:#cde;letter-spacing:.5px;margin-bottom:12px}.mobile-warning-body{font-size:14px;color:#778;line-height:1.6;margin-bottom:24px}.mobile-warning-btn{padding:10px 32px;border-radius:8px;border:1px solid #5af;background:transparent;color:#5af;font-size:15px;font-weight:600;cursor:pointer;transition:background .15s,color .15s}.mobile-warning-btn:hover{background:#5af;color:#0a0a0f}.app{display:flex;flex-direction:column;height:100vh;background:#0a0a0f}.header{display:flex;align-items:center;justify-content:space-between;padding:0 20px;height:52px;background:#0e0e1a;border-bottom:1px solid #1e1e3a;flex-shrink:0}.header-left{display:flex;align-items:baseline;gap:10px}.logo{font-size:18px;font-weight:700;letter-spacing:3px;color:#5af}.subtitle{font-size:12px;color:#556;letter-spacing:1px}.model-loader{display:flex;align-items:center;gap:6px}.model-btn{padding:5px 12px;border-radius:6px;border:1px solid #1e1e3a;background:#0e0e1a;color:#7af;font-size:12px;cursor:pointer;transition:all .15s;white-space:nowrap}.model-btn:hover{border-color:#5af;color:#5af}.model-name{font-size:11px;color:#556;font-family:SF Mono,Fira Code,monospace;max-width:140px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mode-toggle{display:flex;background:#080810;border:1px solid #1e1e3a;border-radius:6px;padding:2px;gap:2px}.mode-btn{padding:4px 14px;border-radius:4px;border:none;background:transparent;color:#445;font-size:12px;cursor:pointer;transition:all .15s;white-space:nowrap}.mode-btn:hover{color:#778}.mode-btn.active{background:#113;color:#5af}.header-right{display:flex;align-items:center;gap:12px}.trigger-badge{font-size:11px;font-weight:700;color:#f44;letter-spacing:1px;animation:pulse .6s ease-in-out infinite alternate}@keyframes pulse{0%{opacity:1}to{opacity:.4}}.error-badge{font-size:11px;color:#f66;background:#2a0a0a;border:1px solid #622;border-radius:4px;padding:2px 8px;max-width:260px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.status-dot{width:8px;height:8px;border-radius:50%}.status-dot.connected{background:#3f6;box-shadow:0 0 6px #3f6}.status-dot.disconnected{background:#444}.status-label{font-size:12px;color:#778}.reset-btn{padding:6px 14px;border-radius:6px;border:1px solid #442200;background:#1a0e00;color:#c84;font-size:13px;cursor:pointer;transition:all .15s}.reset-btn:hover{background:#2a1500;border-color:#c84;color:#fb6}.connect-btn{padding:6px 16px;border-radius:6px;border:1px solid #335;background:#112;color:#aac;font-size:13px;cursor:pointer;transition:all .15s}.connect-btn:hover{background:#1a1a33;border-color:#5af;color:#5af}.connect-btn.active{background:#0a1a10;border-color:#3f6;color:#3f6}.main{display:flex;flex:1;overflow:hidden}.scene-area{flex:1;position:relative}.demo-badge{position:absolute;bottom:16px;left:50%;transform:translate(-50%);font-size:11px;color:#556;background:#0a0a14cc;border:1px solid #222233;border-radius:20px;padding:4px 14px;pointer-events:none;letter-spacing:.5px}.sidebar{width:240px;flex-shrink:0;display:flex;flex-direction:column;gap:1px;background:#0e0e1a;border-left:1px solid #1e1e3a;overflow-y:auto}.data-card{padding:14px 16px;border-bottom:1px solid #1a1a2e}.data-card h3{font-size:10px;font-weight:600;letter-spacing:1.5px;text-transform:uppercase;color:#445;margin-bottom:10px}.data-table{width:100%;border-collapse:collapse;font-size:13px;font-family:SF Mono,Fira Code,monospace}.data-table td{padding:3px 4px}.data-table td:first-child{color:#556;width:48px}.data-table td:last-child{color:#cde;text-align:right}.data-table tr:hover td{background:#112}.no-data{font-size:12px;color:#334;font-style:italic}.protocol-info{display:flex;flex-direction:column;gap:5px;font-size:11px;color:#556}.protocol-info code{background:#112;border:1px solid #222233;border-radius:4px;padding:3px 8px;font-family:SF Mono,Fira Code,monospace;color:#7af;font-size:11px}.protocol-note{color:#334;font-size:10px}.log-card{flex:1}.log{font-family:SF Mono,Fira Code,monospace;font-size:10px;color:#446;max-height:260px;overflow-y:auto;display:flex;flex-direction:column;gap:2px}.log-line{padding:1px 2px;border-radius:2px;word-break:break-all}.log-line.log-csv{color:#557}.log-line.log-csv:first-child{color:#7bf}.log-line.log-raw{color:#c84;font-style:italic}.log-trigger{color:#f66!important}.log::-webkit-scrollbar{width:4px}.log::-webkit-scrollbar-track{background:transparent}.log::-webkit-scrollbar-thumb{background:#224;border-radius:2px}.zero-btn{padding:6px 14px;border-radius:6px;border:1px solid #2a4a2a;background:#0a1a0a;color:#4c4;font-size:13px;cursor:pointer;transition:all .15s}.zero-btn:hover{background:#121;border-color:#4c4;color:#6f6}.mount-panel{position:absolute;bottom:16px;right:16px;background:#0a0a14e0;border:1px solid #1e1e3a;border-radius:8px;padding:10px 12px;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);display:flex;flex-direction:column;gap:6px;align-items:center}.mount-title{font-size:10px;font-weight:600;letter-spacing:1.5px;text-transform:uppercase;color:#445;align-self:flex-start}.mount-grid{display:grid;grid-template-columns:repeat(3,30px);gap:3px}.mount-dir-btn{width:30px;height:30px;border-radius:5px;border:1px solid #222244;background:#112;color:#778;font-size:15px;line-height:1;cursor:pointer;transition:all .1s;display:flex;align-items:center;justify-content:center}.mount-dir-btn:hover{border-color:#5af;color:#5af;background:#0d0d22}.mount-dir-btn:active{background:#113}.mount-reset{color:#445;font-size:13px}.mount-reset:hover{border-color:#f66;color:#f66}.mount-yaw{display:flex;align-items:center;gap:6px;width:100%;justify-content:center}.mount-yaw-label{font-size:10px;color:#334;letter-spacing:1px;text-transform:uppercase}