:root{--bg: #0a0f1a;--bg-card: #111827;--bg-elevated: #1a2332;--border: #1e293b;--text: #f1f5f9;--text-muted: #94a3b8;--primary: #38bdf8;--primary-dim: #0ea5e9;--success: #22c55e;--warning: #eab308;--error: #ef4444;--radius: 12px;--shadow: 0 4px 24px rgba(0, 0, 0, .4)}*{box-sizing:border-box;margin:0;padding:0}html{height:100%;overflow:hidden}body{font-family:Inter,system-ui,sans-serif;background:var(--bg);color:var(--text);height:100%;overflow:hidden;line-height:1.4}.app{height:100vh;height:100dvh;display:flex;flex-direction:column;overflow:hidden}.header{flex-shrink:0;display:flex;align-items:center;justify-content:space-between;padding:.4rem .75rem;border-bottom:1px solid var(--border);background:var(--bg-card);min-height:44px}.header-brand{display:flex;align-items:center;gap:.5rem}.logo{font-size:1.35rem}.header-brand h1{font-size:.95rem;font-weight:700}.header-status{display:flex;align-items:center;gap:.4rem;padding:.3rem .65rem;background:var(--bg-elevated);border-radius:999px;font-size:.72rem}.status-dot{width:8px;height:8px;border-radius:50%;background:var(--text-muted)}.status-dot.status-loading{background:var(--warning);animation:pulse 1s infinite}.status-dot.status-ready{background:var(--primary)}.status-dot.status-active{background:var(--success);animation:pulse 1s infinite}.status-dot.status-warning{background:var(--warning)}.status-dot.status-error{background:var(--error)}@keyframes pulse{0%,to{opacity:1}50%{opacity:.4}}.main{flex:1;min-height:0;display:grid;grid-template-columns:220px 1fr;overflow:hidden}.sidebar{border-right:1px solid var(--border);padding:.4rem;display:flex;flex-direction:column;gap:.4rem;overflow-y:auto;overflow-x:hidden;min-height:0;scrollbar-width:thin;scrollbar-color:var(--border) transparent}.sidebar::-webkit-scrollbar{width:4px}.sidebar::-webkit-scrollbar-track{background:transparent}.sidebar::-webkit-scrollbar-thumb{background:var(--border);border-radius:4px}.content{display:grid;grid-template-columns:1fr 280px;min-height:0;overflow:hidden;padding:.4rem;gap:.4rem}.content-primary,.content-side{display:flex;flex-direction:column;min-height:0;gap:.35rem;overflow:hidden}.toolbar{flex-shrink:0}.media-stage{flex:1;min-height:0;position:relative;display:flex}.media-stage .video-container,.media-stage .preview-only-container{flex:1;min-height:0}.preview-only-container{display:flex;min-height:0}.landscape-hide{display:none}@media(orientation:portrait),(max-width:900px){body{overflow:auto}.app{height:auto;min-height:100vh;overflow:visible}.main,.content{grid-template-columns:1fr;overflow:visible}.landscape-hide{display:block}.sidebar{max-height:none}}.panel{background:var(--bg-card);border:1px solid var(--border);border-radius:8px;padding:.5rem}.panel h2,.panel h3{font-size:.65rem;text-transform:uppercase;letter-spacing:.05em;color:var(--text-muted);margin-bottom:.4rem}.exercise-list{display:grid;grid-template-columns:1fr 1fr;gap:.3rem;max-height:155px;overflow-y:auto;overflow-x:hidden;scrollbar-width:none;-ms-overflow-style:none}.exercise-list::-webkit-scrollbar{display:none;width:0;height:0}.exercise-item{display:flex;align-items:center;gap:.35rem;padding:.35rem .4rem;background:var(--bg-elevated);border:1px solid transparent;border-radius:6px;cursor:pointer;text-align:left;color:var(--text);transition:all .15s}.exercise-icon{font-size:1rem;flex-shrink:0}.exercise-item strong{display:block;font-size:.68rem;line-height:1.2}.exercise-item small{display:none}.category-tabs{display:flex;gap:.5rem}.exercise-item:hover{border-color:var(--border)}.exercise-item.active{border-color:var(--primary);background:#38bdf814}.category-tab{flex:1;padding:.35rem .25rem;font-weight:600;font-size:.72rem}.hand-label{display:block;font-size:.8rem;color:var(--text-muted);margin-bottom:.5rem}.hand-tabs{display:flex;gap:.5rem;margin-bottom:.5rem}.hand-tab{flex:1}.hand-hint{font-size:.75rem;color:var(--text-muted);line-height:1.4}#padel-settings{border-color:#22c55e59}.source-tabs{display:flex;gap:.5rem;margin-bottom:.75rem}.tab{flex:1;padding:.3rem .25rem;background:var(--bg-elevated);border:1px solid var(--border);border-radius:6px;color:var(--text-muted);cursor:pointer;font-size:.68rem;transition:all .15s}.btn{display:inline-flex;align-items:center;justify-content:center;gap:.35rem;padding:.4rem .5rem;border:none;border-radius:6px;font-size:.72rem;font-weight:500;cursor:pointer;transition:all .15s;width:100%}.btn-sm{width:auto;flex-shrink:0;padding:.3rem .55rem;font-size:.68rem}.btn-ghost{background:transparent;color:var(--text-muted);margin-top:.25rem;padding:.25rem}.control-row{display:flex;gap:.35rem;margin-top:.4rem}.workout-presets{display:flex;gap:.25rem;margin-bottom:.4rem}.preset-btn{flex:1;padding:.25rem;font-size:.68rem}.target-reps-row{margin-bottom:.4rem;font-size:.72rem}.target-reps-controls input{width:40px;padding:.2rem;font-size:.85rem}.btn-icon{width:26px;height:26px;font-size:.95rem}.hand-hint{display:none}.btn-primary{background:var(--primary);color:#0a0f1a}.btn-primary:hover{background:var(--primary-dim)}.btn-secondary{background:var(--bg-elevated);color:var(--text);border:1px solid var(--border)}.btn-secondary:hover{border-color:var(--primary)}.btn-danger{background:var(--error);color:#fff}.btn-workout{margin-bottom:.25rem}.video-container,.preview-canvas-wrap{position:relative;background:#000;border-radius:8px;overflow:hidden;width:100%;height:100%;box-shadow:var(--shadow)}.placeholder-icon{font-size:2rem}.video-placeholder p{font-size:.75rem}.phase-badge{top:.5rem;right:.5rem;padding:.25rem .55rem;font-size:.68rem}.guided-legend{top:.5rem;left:.5rem;padding:.25rem .55rem;font-size:.65rem}.results-grid{display:flex;flex-direction:column;gap:.35rem;flex:1;min-height:0;overflow:hidden}.score-card{flex-shrink:0;background:var(--bg-card);border:1px solid var(--border);border-radius:8px;padding:.5rem;display:flex;flex-direction:row;align-items:center;gap:.5rem}.score-ring{width:72px;height:72px;flex-shrink:0}#score-number{font-size:1.35rem}.grade-label{font-size:.85rem}.grade-desc{font-size:.65rem}.metrics-card,.feedback-card,.history-card{flex:1;min-height:0;display:flex;flex-direction:column;overflow:hidden}.metrics-grid{grid-template-columns:repeat(2,1fr);gap:.35rem;overflow-y:auto}.metric-item{padding:.35rem}.metric-label{font-size:.58rem}.metric-value{font-size:.95rem}.feedback-list{flex:1;min-height:0;max-height:none;overflow-y:auto;gap:.3rem}.feedback-item{padding:.35rem .45rem;font-size:.68rem}.history-card{flex:0 0 56px}.history-bars{height:40px;padding-top:.25rem}.rep-counter{bottom:.5rem;left:.5rem;right:.5rem;padding:.45rem .6rem}.rep-value{font-size:1.75rem}.rep-target{font-size:.95rem}.rep-meta{font-size:.65rem}.rep-flash{font-size:1.25rem;padding:.6rem 1.2rem}.workout-complete{font-size:.75rem;padding:.35rem .75rem}.view-mode-tabs{display:flex;gap:.3rem;margin-bottom:0}.view-tab{flex:1;padding:.35rem .25rem;font-weight:600;font-size:.68rem}.preview-controls{flex-shrink:0;display:flex;flex-direction:row;align-items:center;gap:.35rem;padding:.35rem .5rem!important}.preview-controls .preview-speed-row{display:flex;gap:.25rem;margin:0;flex-wrap:nowrap}.preview-scrub{flex:1;min-width:60px;margin:0}.speed-btn{padding:.2rem .45rem;font-size:.65rem}.preview-info{flex-shrink:0;padding:.4rem!important}.preview-info h3{font-size:.8rem;margin-bottom:.2rem}.preview-info p{font-size:.68rem;line-height:1.3}.preview-phase-badge{font-size:.65rem;padding:.2rem .5rem;margin-bottom:.35rem}.tab.active{background:#38bdf81f;border-color:var(--primary);color:var(--primary)}#video{width:100%;height:100%;object-fit:contain;display:block;transform:scaleX(-1)}#overlay{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;pointer-events:none;transform:scaleX(-1)}.video-placeholder{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;background:var(--bg-elevated);color:var(--text-muted);gap:.5rem}.score-ring{position:relative}.score-ring svg{transform:rotate(-90deg);width:100%;height:100%}.ring-bg{fill:none;stroke:var(--bg-elevated);stroke-width:8}.ring-fill{fill:none;stroke:var(--primary);stroke-width:8;stroke-linecap:round;stroke-dasharray:327;stroke-dashoffset:327;transition:stroke-dashoffset .3s,stroke .3s}.score-value{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center}.score-label{font-size:.6rem;color:var(--text-muted);text-transform:uppercase}.grade-info{text-align:left;min-width:0}.phase-badge{position:absolute;background:#000000b3;border:1px solid var(--primary);border-radius:999px;color:var(--primary);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.phase-badge.phase-waiting{border-color:var(--warning);color:var(--warning)}.guided-legend{position:absolute;background:#000000bf;border:1px solid rgba(34,197,94,.5);border-radius:999px;color:#e2e8f0;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:4}.rep-counter{position:absolute;background:#000000d1;border:1px solid rgba(56,189,248,.5);border-radius:8px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.rep-flash{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);background:#22c55eeb;color:#0a0f1a;font-weight:800;border-radius:999px;animation:flashPop .7s ease forwards;pointer-events:none;z-index:10}.workout-complete{position:absolute;top:.5rem;left:50%;transform:translate(-50%);background:#22c55ee6;color:#0a0f1a;font-weight:700;border-radius:999px;z-index:5}.metric-item{background:var(--bg-elevated);border-radius:6px}.feedback-good{background:#22c55e1a;border-left:3px solid var(--success)}.feedback-warning{background:#eab3081a;border-left:3px solid var(--warning)}.feedback-error{background:#ef44441a;border-left:3px solid var(--error)}.feedback-icon{font-weight:700;flex-shrink:0}.feedback-item{display:flex;align-items:flex-start;gap:.35rem;border-radius:6px}.feedback-list{display:flex;flex-direction:column}.history-bars{display:flex;align-items:flex-end;gap:2px}.history-bar{flex:1;min-width:3px;border-radius:2px 2px 0 0;opacity:.85;transition:height .2s}.empty-state{color:var(--text-muted);font-size:.68rem;font-style:italic}.hidden{display:none!important}.file-label{display:block;cursor:pointer}.control-row .btn{flex:1}.workout-panel{border-color:#38bdf859}.source-tabs{margin-bottom:.4rem}.target-reps-row{display:flex;align-items:center;justify-content:space-between}.target-reps-controls{display:flex;align-items:center;gap:.25rem}.btn-workout{background:linear-gradient(135deg,#0ea5e9,#22c55e);color:#0a0f1a;font-weight:600}#preview-canvas{width:100%;height:100%;display:block}@keyframes repPulse{0%{transform:scale(1);border-color:#38bdf880}50%{transform:scale(1.02);border-color:var(--success)}to{transform:scale(1);border-color:#38bdf880}}.rep-counter.rep-pulse{animation:repPulse .4s ease}@keyframes flashPop{0%{opacity:0;transform:translate(-50%,-50%) scale(.5)}30%{opacity:1;transform:translate(-50%,-50%) scale(1.1)}to{opacity:0;transform:translate(-50%,-60%) scale(1)}}.speed-btn.active{background:#22c55e26;border-color:#22c55e;color:#22c55e}.preset-btn{background:var(--bg-elevated);border:1px solid var(--border);border-radius:6px;color:var(--text-muted);cursor:pointer}.preset-btn:hover:not(:disabled){border-color:var(--primary);color:var(--primary)}.btn-icon:hover{border-color:var(--primary);color:var(--primary)}.btn-workout:hover{filter:brightness(1.08)}.rep-counter-inner{display:flex;align-items:baseline;gap:.25rem;margin-bottom:.25rem}.rep-label{font-size:.6rem;letter-spacing:.06em;color:var(--text-muted);margin-right:auto}.rep-progress{height:4px;background:var(--bg-elevated);border-radius:999px;overflow:hidden;margin-bottom:.25rem}.rep-progress-fill{height:100%;width:0%;background:linear-gradient(90deg,var(--primary),var(--success));border-radius:999px;transition:width .3s ease}.rep-meta{display:flex;justify-content:space-between}.metric-value{font-weight:600;color:var(--primary)}.metric-label{display:block;color:var(--text-muted);text-transform:uppercase;letter-spacing:.03em}.metrics-grid{display:grid}.preview-info{border-color:#22c55e59}.speed-btn{background:var(--bg-elevated);border:1px solid var(--border);border-radius:6px;color:var(--text-muted);cursor:pointer;font-weight:600}.speed-btn:hover{border-color:#22c55e}.placeholder-icon{opacity:.5}#score-number{font-weight:700;line-height:1}.grade-label{display:block;font-weight:600}.grade-desc{color:var(--text-muted)}.field-label{display:block;font-size:.62rem;color:var(--text-muted);margin-bottom:.2rem;margin-top:.35rem}.custom-input,.custom-textarea{width:100%;background:var(--bg-elevated);border:1px solid var(--border);border-radius:6px;color:var(--text);font-family:inherit;font-size:.72rem;padding:.35rem .45rem;resize:vertical}.custom-input:focus,.custom-textarea:focus{outline:none;border-color:var(--primary)}.custom-actions{display:flex;flex-direction:column;gap:.3rem;margin-top:.45rem}.btn-record{background:#dc2626;border:none;color:#fff}.btn-record:hover{background:#b91c1c}.record-status{font-size:.68rem;color:var(--text-muted);margin:.35rem 0 .15rem}.record-status.recording{color:#f87171;font-weight:600;animation:record-pulse 1s ease-in-out infinite}.record-frame-count{font-size:.62rem;font-family:ui-monospace,monospace;color:var(--text-muted);margin-bottom:.25rem}.record-hint{font-size:.6rem;color:var(--text-muted);line-height:1.35;margin-top:.4rem}.custom-empty{grid-column:1 / -1;text-align:center;padding:.5rem;font-size:.65rem}.record-indicator{position:absolute;top:12px;left:12px;background:#dc2626eb;color:#fff;font-size:.72rem;font-weight:700;letter-spacing:.05em;padding:.25rem .55rem;border-radius:6px;z-index:12;animation:record-pulse 1s ease-in-out infinite}@keyframes record-pulse{0%,to{opacity:1}50%{opacity:.55}}