*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--bg: #2d1f16;--surface: #433528;--surface2: #574334;--border: #7a5f4f;--accent: #c9a77b;--accent2: #d6b992;--accent3: #a67a53;--text: #f4ede3;--muted: #beac9c;--warn: #f7c94f;--danger: #f75050;--success: #6ee7a0;--radius: 12px;--mono: "DM Mono", monospace;--serif: "Fraunces", serif;--font: var(--mono);--font-mono: var(--mono);--sans: var(--mono)}html,body{height:100%;background:var(--bg);color:var(--text);font-family:var(--mono)}button{cursor:pointer;border:none;border-radius:var(--radius);font-family:var(--mono);font-size:1rem;transition:opacity .15s,transform .1s}button:hover{opacity:.88}button:active{transform:scale(.97)}.btn-primary{background:var(--accent);color:#1a0e08;font-weight:600;padding:12px 28px}.btn-ghost{background:transparent;color:var(--muted);border:1px solid var(--border);padding:10px 20px}.btn-ghost:hover{border-color:var(--muted);color:var(--muted)}.topbar,header{display:flex;align-items:center;justify-content:space-between;padding:16px 28px;border-bottom:1px solid var(--border);background:var(--surface);flex-shrink:0;z-index:10}.logo{display:flex;align-items:center;gap:8px;font-family:var(--mono);font-weight:600;font-size:21px;letter-spacing:-.5px;color:var(--accent);text-decoration:none}.logo em,.logo span{color:var(--text);font-style:italic;font-weight:300}.status-dot,.dot{width:8px;height:8px;border-radius:50%;background:var(--muted);display:inline-block;margin-right:6px;transition:background .3s}.status-dot.live,.dot.live{background:var(--accent);box-shadow:0 0 8px var(--accent);animation:pulse 2s infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.4}}.ghost-toggle-btn{background:#c9a77b2e;border:1px solid var(--border);border-radius:999px;color:var(--text);font-family:var(--mono);font-size:14px;padding:8px 16px;cursor:pointer;transition:background .2s,transform .2s,border-color .2s}.ghost-toggle-btn:hover{background:#c9a77b47;border-color:var(--accent);transform:translateY(-1px)}.ghost-toggle-btn.active{background:#c9a77b47;border-color:var(--accent);color:var(--accent)}.back-btn{background:none;border:1px solid var(--border);border-radius:8px;padding:5px 14px;color:var(--muted);font-family:var(--mono);font-size:12px;cursor:pointer;transition:all .15s}.back-btn:hover{border-color:var(--accent);color:var(--accent)}.camera-zone{flex:1;position:relative;background:#060402;overflow:hidden}#video{width:100%;height:100%;object-fit:cover;transform:scaleX(-1);opacity:0;transition:opacity .5s}#video.visible{opacity:1}#canvas{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;transform:scaleX(-1)}#ghostCanvas{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;pointer-events:none;z-index:5}.camera-placeholder,.cam-placeholder{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;color:var(--muted);font-size:14px}.start-btn,.cam-start-btn{background:var(--accent);color:#1a0e08;border:none;border-radius:var(--radius);padding:12px 28px;font-family:var(--mono);font-size:14px;font-weight:500;cursor:pointer;transition:all .15s;margin-top:8px}.start-btn:hover,.cam-start-btn:hover{transform:scale(1.03)}.loading-spinner{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;background:#080503d9;font-size:14px;color:var(--muted);z-index:20}.spinner{width:36px;height:36px;border:2px solid var(--border);border-top-color:var(--accent);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.detection-badge,.detect-badge{background:#0d0804e0;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1px solid var(--border);border-radius:8px;padding:5px 13px;font-size:13px;color:var(--muted);display:none}.detection-badge.visible,.detect-badge.visible{display:block}.detection-badge.detected,.detect-badge.ok{border-color:var(--accent);color:var(--accent)}.detection-badge.warn,.detect-badge.warn{border-color:var(--accent3);color:var(--accent3)}.pose-match-bar{position:absolute;top:14px;left:50%;transform:translate(-50%);background:#0d0804e0;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1px solid var(--border);border-radius:10px;padding:8px 18px;font-size:13px;color:var(--muted);display:none;align-items:center;gap:10px;z-index:10;white-space:nowrap}.pose-match-bar.visible{display:flex}.pose-match-track{width:100px;height:6px;background:var(--border);border-radius:3px;overflow:hidden}.pose-match-fill{height:100%;width:0%;border-radius:3px;background:var(--accent3);transition:width .15s,background .2s}.pose-match-fill.close{background:var(--accent2)}.pose-match-fill.matched{background:var(--success)}.phase-flash{position:absolute;top:0;right:0;bottom:0;left:0;background:#c9a77b1f;opacity:0;pointer-events:none;z-index:8;transition:opacity .08s}.phase-flash.flash{opacity:1}.ghost-label{position:absolute;bottom:130px;left:50%;transform:translate(-50%);background:#0d0804cc;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border:1px solid rgba(201,167,123,.4);border-radius:8px;padding:6px 16px;font-size:14px;color:var(--accent2);z-index:10;pointer-events:none;display:none;letter-spacing:.5px}.ghost-label.visible{display:block}.parts-warning{position:absolute;bottom:20px;left:50%;transform:translate(-50%) translateY(6px);width:calc(100% - 48px);max-width:1800px;background:#c9a77b59;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1px solid rgba(201,167,123,.75);border-radius:12px;padding:16px 30px;font-size:28px;font-weight:700;color:var(--surface);pointer-events:none;opacity:0;transition:opacity .18s,transform .18s;white-space:normal;z-index:11;text-align:center;line-height:1.2}.parts-warning.show{opacity:1;transform:translate(-50%) translateY(0)}.step-prompt{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);background:#0d0804e6;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:2px solid var(--accent2);border-radius:16px;padding:12px 30px;font-family:var(--serif);font-size:22px;font-weight:600;color:var(--accent2);pointer-events:none;opacity:0;transition:opacity .25s,border-color .25s,color .25s;white-space:nowrap;z-index:6}.step-prompt.show{opacity:1}.step-prompt.good{border-color:var(--success);color:var(--success)}.hold-ring-container{position:absolute;bottom:16px;left:50%;transform:translate(-50%);display:none;z-index:10;width:120px;height:120px}.hold-ring-container.visible{display:block}.hold-ring-svg{width:100%;height:100%;transform:rotate(-90deg);filter:drop-shadow(0 0 12px rgba(94,245,160,.4))}.hold-ring-text,.hold-txt{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;font-size:18px;font-weight:600;color:var(--accent);font-family:var(--mono)}.stats-panel{width:230px;min-width:230px;background:var(--surface);border-left:1px solid var(--border);display:flex;flex-direction:column;padding:14px;gap:12px;overflow-y:auto}.stat-card{background:var(--surface2);border:1px solid var(--border);border-radius:var(--radius);padding:13px;display:flex;flex-direction:column;gap:4px}.stat-label,.stat-lbl{font-size:10px;text-transform:uppercase;letter-spacing:1.3px;color:var(--muted)}.stat-value,.stat-val{font-size:38px;font-family:var(--serif);font-weight:600;color:var(--accent);line-height:1}.stat-sub{font-size:11px;color:var(--muted)}.stat-value.pop,.stat-val.pop{animation:popAnim .3s ease-out}@keyframes popAnim{0%{transform:scale(1.4)}to{transform:scale(1)}}.progress-bar,.prog-bar{height:4px;background:var(--border);border-radius:2px;overflow:hidden;margin-top:6px}.prog-fill{height:100%;background:var(--accent);border-radius:2px;width:0%;transition:width .3s}.rom-card{background:var(--surface2);border:1px solid var(--border);border-radius:var(--radius);padding:13px;display:flex;flex-direction:column;gap:10px}.rom-bar-track,.rom-track{background:var(--border);border-radius:13px;position:relative;overflow:visible;flex-shrink:0}.rom-bar-fill,.rom-fill{position:absolute;bottom:0;left:0;right:0;background:var(--accent3);border-radius:13px;height:0%;transition:height .1s,background .2s}.rom-bar-fill.partial,.rom-fill.mid{background:var(--accent2)}.rom-bar-fill.deep,.rom-fill.deep{background:var(--accent)}.rom-target-line,.rom-target{position:absolute;left:-6px;right:-6px;height:2px;background:#c9a77b8c;pointer-events:none}.rom-target-label,.rom-target-lbl{position:absolute;left:32px;font-size:11px;color:#c9a77b99;transform:translateY(50%);white-space:nowrap}.rom-labels{display:flex;flex-direction:column;justify-content:space-between;font-size:11px;color:var(--muted);flex:1}.rom-pct{font-size:20px;font-family:var(--serif);font-weight:600;color:var(--accent);line-height:1}.rom-pct-label,.rom-pct-lbl{font-size:11px;color:var(--muted)}.angle-row{display:flex;justify-content:space-between;font-size:12px;color:var(--muted);padding:4px 0;border-bottom:1px solid var(--border)}.angle-row:last-child{border-bottom:none}.angle-val,.av{color:var(--text);font-weight:500}.angle-val.active,.av.on{color:var(--accent)}.angle-val.missing{color:var(--accent3)}.log-entries,.log-scroll{display:flex;flex-direction:column;gap:3px;max-height:90px;overflow-y:auto}.log-entry,.log-row{font-size:12px;color:var(--muted);padding:3px 0;border-bottom:1px solid var(--border);display:flex;justify-content:space-between}.log-entry .log-time,.log-t{color:var(--accent)}.reset-btn,.rst-btn{background:transparent;border:1px solid var(--border);border-radius:8px;padding:10px;color:var(--muted);font-family:var(--mono);font-size:13px;cursor:pointer;transition:all .15s;width:100%}.reset-btn:hover,.rst-btn:hover{border-color:var(--accent3);color:var(--accent3)}.sidebar{width:250px;min-width:250px;background:var(--surface);border-right:1px solid var(--border);display:flex;flex-direction:column;padding:16px 12px;gap:8px;overflow-y:auto}.sidebar-label{font-size:11px;text-transform:uppercase;letter-spacing:1.6px;color:var(--muted);padding:0 4px;margin-bottom:4px}.exercise-btn{background:transparent;border:1px solid var(--border);border-radius:12px;padding:12px 14px;color:var(--text);font-family:var(--mono);font-size:14px;text-align:left;cursor:pointer;transition:all .15s;display:flex;flex-direction:column;gap:4px}.exercise-btn:hover{background:var(--surface2);border-color:var(--muted)}.exercise-btn.active{border-color:var(--accent);background:#c9a77b1f}.exercise-btn .name{font-weight:600;font-size:15px}.exercise-btn .meta{font-size:12px;color:var(--muted)}.exercise-btn .tag{display:inline-block;font-size:10px;padding:2px 6px;border-radius:5px;margin-top:4px;background:var(--border);color:var(--muted)}.exercise-btn.active .tag{background:#c9a77b38;color:var(--accent)}.screen{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;transition:opacity .35s,transform .35s;opacity:0;pointer-events:none;transform:translateY(12px)}.screen.active{opacity:1;pointer-events:all;transform:translateY(0)}.frame-check{position:absolute;top:0;right:0;bottom:0;left:0;background:#080503b8;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;z-index:8;transition:opacity .4s}.frame-check.hidden{opacity:0;pointer-events:none}.frame-check-box{background:#0d0804eb;border:1px solid var(--border);border-radius:16px;padding:28px 36px;display:flex;flex-direction:column;align-items:center;gap:14px;max-width:340px}.frame-check-title{font-family:var(--serif);font-size:18px;font-weight:600;text-align:center}.frame-joints{display:flex;flex-direction:column;gap:7px;width:100%}.joint-row{display:flex;align-items:center;justify-content:space-between;font-size:12px;color:var(--muted)}.joint-row .jstatus{width:16px;height:16px;border-radius:50%;border:1.5px solid var(--border);display:flex;align-items:center;justify-content:center;font-size:9px;transition:all .3s}.joint-row .jstatus.ok{background:var(--accent);border-color:var(--accent);color:#1a0e08}.joint-row .jstatus.warn{background:var(--accent2);border-color:var(--accent2);color:#1a0e08}.frame-progress{width:100%;height:4px;background:var(--border);border-radius:2px;overflow:hidden}.frame-prog-fill{height:100%;background:var(--accent);border-radius:2px;width:0%;transition:width .3s}.frame-sub{font-size:11px;color:var(--muted);text-align:center}