:root{font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display",Arial,sans-serif;color:#eef4ff;background:#07101d}*{box-sizing:border-box}body{margin:0;background:radial-gradient(circle at top,#172b43,#07101d 38%);min-height:100vh}main{max-width:780px;margin:auto;padding:calc(env(safe-area-inset-top) + 18px) 14px calc(env(safe-area-inset-bottom) + 30px)}header{display:flex;align-items:center;justify-content:space-between;margin:6px 4px 18px}small{letter-spacing:.18em;color:#7ed6a5;font-weight:700}h1{margin:3px 0;font-size:30px}h2{margin:0 0 13px;font-size:18px}#status{background:#173328;color:#91edb5;padding:8px 12px;border-radius:99px;font-size:13px}.card{background:rgba(17,30,48,.88);border:1px solid #29405c;border-radius:20px;padding:16px;margin:12px 0;box-shadow:0 14px 45px #0005}.grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}label{font-size:12px;color:#aebed2}input,select{width:100%;margin-top:6px;background:#0a1728;color:white;border:1px solid #314a67;border-radius:12px;padding:12px;font-size:16px}.stage{position:relative;aspect-ratio:3/4;background:#02060b;border-radius:15px;overflow:hidden}video{width:100%;height:100%;object-fit:cover}.stage canvas,.guide{position:absolute;inset:0;width:100%;height:100%}.guide{display:grid;place-items:center;pointer-events:none}.guide i{position:absolute;width:42%;height:72%;border:2px dashed #ffffff70;border-radius:45%}.guide b{align-self:end;margin-bottom:18px;background:#0009;padding:7px 10px;border-radius:9px;font-size:12px}.actions{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:12px}button,.button{appearance:none;border:1px solid #36506d;background:#13243a;color:white;border-radius:13px;padding:13px;text-align:center;font-size:14px;font-weight:650}.primary{background:#1c8d57;border-color:#31b471}.actions .button{grid-column:span 2}.hint{color:#9cafc5;font-size:12px;line-height:1.45}.scrub{display:grid;grid-template-columns:auto 1fr auto;gap:8px;align-items:center}.metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:15px 0}.metrics div{background:#0b192a;border-radius:12px;padding:12px;text-align:center}.metrics strong,.metrics span{display:block}.metrics span{font-size:11px;color:#91a4ba;margin-top:4px}pre{white-space:pre-wrap;color:#a8d9bd;font-size:11px;max-height:250px;overflow:auto}footer{text-align:center;color:#687d95;font-size:11px;margin-top:18px}@media(min-width:650px){.stage{aspect-ratio:16/10}.actions{grid-template-columns:repeat(3,1fr)}.actions .button{grid-column:auto}}
#analyze{width:100%;margin:12px 0 8px}.analysisHead{display:flex;align-items:center;justify-content:space-between}.analysisHead span{font-size:12px;color:#9cafc5}.resultGrid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}.resultGrid div{background:#0b192a;border-radius:12px;padding:13px}.resultGrid strong,.resultGrid span{display:block}.resultGrid strong{font-size:20px}.resultGrid span{font-size:11px;color:#91a4ba;margin-top:4px}.phases{display:grid;grid-template-columns:1fr 1fr;gap:8px}.phases button{display:flex;justify-content:space-between}.error{color:#ffb4b4}.card h3{font-size:14px;margin:18px 0 10px}@media(min-width:650px){.resultGrid{grid-template-columns:repeat(4,1fr)}}

#markBall{width:100%;margin-top:8px}.coach{background:#0b192a;border-radius:12px;padding:14px;line-height:1.55;font-size:13px}.ball-dot{position:absolute;width:18px;height:18px;border:3px solid #fff;border-radius:50%;transform:translate(-50%,-50%);pointer-events:none}
.videoReviewControls{display:grid;grid-template-columns:1fr 1fr auto;gap:8px;margin:8px 0 12px}.videoReviewControls select{margin:0;padding:10px;width:auto}.analysisTimeline{position:relative;padding-bottom:22px}.analysisTimeline input{margin:0}.phaseMarks{position:absolute;left:0;right:0;top:31px;height:18px}.phaseMarks button{position:absolute;transform:translateX(-50%);border:0;background:transparent;padding:0;color:#8fa6bf;font-size:9px;white-space:nowrap}.phaseMarks button::before{content:"";display:block;width:2px;height:8px;background:#62f0a4;margin:0 auto 2px}.frameControls{display:grid;grid-template-columns:1fr auto 1fr;gap:8px;align-items:center;margin:8px 0}.frameControls strong{text-align:center;font-variant-numeric:tabular-nums}.layerControls{display:flex;flex-wrap:wrap;gap:12px;margin:12px 0}.layerControls label{display:flex;gap:6px;align-items:center;background:#0b192a;padding:8px 10px;border-radius:10px}.layerControls input{width:auto;margin:0}.liveMetrics{background:#0b192a;border-radius:12px;padding:12px;font-size:12px;line-height:1.5;color:#c9d8e8}.stage.analysis-mode{box-shadow:0 0 0 2px #31b47155}.stage.analysis-mode .guide{display:none}

.newAnalysisBar{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:16px}.newAnalysisBar button{flex:1;min-width:160px}

.historyList{display:grid;gap:10px}.historyItem{background:#0b192a;border-radius:14px;padding:12px;display:grid;gap:8px}.historyMeta{display:flex;justify-content:space-between;gap:8px;align-items:flex-start}.historyMeta strong{font-size:14px}.historyMeta span{font-size:11px;color:#91a4ba}.historyActions{display:flex;gap:8px}.historyActions button{flex:1;padding:10px}.danger{border-color:#7d3941;color:#ffb4b4}.historyEmpty{text-align:center;color:#91a4ba;padding:20px 5px}#refreshHistory{padding:8px 10px}#saveAnalysis{min-width:220px}


/* V0.6 Desktop Performance Lab - additive only */
.desktopLab{display:none}.desktopTabs{display:flex;gap:8px;margin:14px 0}.desktopTabs button{flex:1}.desktopTabs button.active{background:#1c8d57;border-color:#31b471}.desktopPane{display:none}.desktopPane.active{display:block}.labToolbar{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin:12px 0}.labToolbar button{flex:1;min-width:110px}.labToolbar select{width:auto;margin:0}.impactReadout{display:flex;justify-content:space-between;align-items:center;background:#0b192a;padding:12px;border-radius:12px;margin:10px 0}.impactReadout span{color:#91a4ba}.comparePickers{display:grid;grid-template-columns:1fr 1fr auto;gap:10px;align-items:end}.comparePickers button{height:45px}.compareVideos{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:14px}.compareVideos>div{background:#02060b;border-radius:14px;overflow:hidden}.compareVideos video{aspect-ratio:16/10;object-fit:contain;background:#000}.compareInfo{padding:10px;background:#0b192a;font-size:12px;line-height:1.5}.compareMetrics{background:#0b192a;border-radius:12px;padding:14px;line-height:1.7;font-size:13px}.compareMetrics table{width:100%;border-collapse:collapse}.compareMetrics th,.compareMetrics td{padding:7px;border-bottom:1px solid #20344b;text-align:right}.compareMetrics th:first-child,.compareMetrics td:first-child{text-align:left}.curveLegend{display:flex;gap:16px;flex-wrap:wrap;color:#aebed2;font-size:12px;margin-top:8px}#curveCanvas{width:100%;height:300px;background:#081421;border-radius:14px;border:1px solid #29405c}
@media(min-width:1000px){main{max-width:1440px;padding-left:24px;padding-right:24px}.desktopLab{display:block}.camera.card{display:grid;grid-template-columns:minmax(600px,2fr) minmax(300px,1fr);gap:18px}.camera.card .stage{grid-row:1/4;aspect-ratio:16/10}.camera.card .actions{align-self:start}.camera.card .hint{align-self:start}.resultGrid{grid-template-columns:repeat(7,1fr)}#analysisPlayer{padding:20px}.historyList{grid-template-columns:repeat(3,1fr)}.profile .grid{grid-template-columns:repeat(5,1fr)}}
@media(max-width:999px){.desktopLab{display:none!important}}

/* V0.7 Session continue - additive */
.sessionActions{display:grid;grid-template-columns:2fr 1fr 1fr;gap:8px}.sessionStats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:12px 0}.sessionStats div{background:#0b192a;border-radius:12px;padding:12px;text-align:center}.sessionStats strong,.sessionStats span{display:block}.sessionStats span{font-size:11px;color:#91a4ba;margin-top:4px}.sessionMarkers{display:flex;gap:6px;flex-wrap:wrap;max-height:110px;overflow:auto}.sessionMarkers button{padding:7px 9px;font-size:11px}.sessionCard.recording{box-shadow:0 0 0 2px #ff5c5c88}.sessionCard.recording #sessionState{color:#ff9a9a}@media(max-width:650px){.sessionActions{grid-template-columns:1fr 1fr}.sessionActions #startSession{grid-column:span 2}}
