:root{color-scheme:dark;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;background:#102016;color:#f8f4e7;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}html,body,#app{height:100%}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100dvh;overflow:hidden;background:linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px) 0 0 / 72px 72px,linear-gradient(#15291c,#0d1a13 58%,#202017)}button,input{font:inherit}button{min-height:44px;border:1px solid rgba(255,255,255,.18);border-radius:8px;color:#f8f4e7;background:#213327;cursor:pointer;font-weight:800;letter-spacing:0;touch-action:manipulation}button:disabled{opacity:.45;cursor:not-allowed}button:not(:disabled):active{transform:translateY(1px)}.shell{width:min(1180px,100%);height:100dvh;min-height:0;margin:0 auto;padding:max(8px,env(safe-area-inset-top)) 12px max(8px,env(safe-area-inset-bottom));display:grid;grid-template-columns:minmax(280px,408px) minmax(360px,1fr);grid-template-areas:"top top" "score field" "controls field" "bench field";grid-template-rows:auto auto auto minmax(0,1fr);gap:10px}.shell>*{min-width:0}.topbar{grid-area:top;display:flex;align-items:end;justify-content:space-between;gap:16px}.kicker{margin:0 0 2px;color:#f8d348;font-size:.78rem;font-weight:900;text-transform:uppercase}h1{margin:0;font-size:clamp(2rem,6vh,4rem);line-height:.86;letter-spacing:0}.status-pill,.inning-light{display:inline-flex;align-items:center;gap:8px;min-height:30px;padding:5px 10px;border-radius:999px;background:#00000059;color:#dfe9dc;border:1px solid rgba(255,255,255,.13);font-size:.86rem;font-weight:800}.scoreboard{grid-area:score;position:relative;padding:10px;border-radius:8px;background:linear-gradient(180deg,#ffffff14,#0000001f),#151916;border:2px solid #f8f4e7;box-shadow:0 12px 34px #00000047}.scoreboard:before{content:"";position:absolute;top:7px;right:7px;bottom:7px;left:7px;border:1px solid rgba(248,244,231,.2);pointer-events:none}.light-dot{width:12px;height:12px;border-radius:50%;background:#ff4c3f;box-shadow:0 0 18px #ff4c3fcc}.scoreboard.ready-state .light-dot{background:#2ee66b;box-shadow:0 0 18px #2ee66bcc}.count-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:9px}.count-panel{min-width:0;padding:8px;border-radius:8px;color:#10150f;display:grid;place-items:center;border:2px solid rgba(0,0,0,.32)}.count-panel.balls{background:#f8d348}.count-panel.strikes{background:#62d4ff}.count-label{font-size:.76rem;font-weight:950;text-transform:uppercase}.count-panel strong{font-family:Arial Black,Impact,sans-serif;font-size:clamp(3.25rem,12vh,6.2rem);line-height:.9;letter-spacing:0}.callout{min-height:58px;margin-top:9px;padding:8px;display:grid;place-items:center;text-align:center;border-radius:8px;background:#f8f4e7;color:#102016;font-size:clamp(1.2rem,4.2vh,1.85rem);font-weight:950}.setup-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin:8px 0 0;padding:0;list-style:none}.setup-steps li{min-width:0;min-height:34px;display:flex;align-items:center;gap:6px;padding:5px 7px;border-radius:8px;border:1px solid rgba(248,244,231,.14);background:#ffffff12;color:#cdd8cb;font-size:.76rem;font-weight:850;line-height:1.05}.setup-steps b{flex:0 0 21px;height:21px;display:grid;place-items:center;border-radius:50%;background:#f8f4e724;color:#f8f4e7;font-size:.78rem}.setup-steps span{min-width:0;overflow-wrap:anywhere}.setup-steps li.active{border-color:#f8d348;background:#f8d34829;color:#f8f4e7}.setup-steps li.active b{background:#f8d348;color:#102016}.setup-steps li.done{border-color:#2ee66b73;background:#2ee66b1f;color:#f8f4e7}.setup-steps li.done b{background:#2ee66b;color:#102016}.tally,.stat-strip{display:flex;flex-wrap:wrap;gap:9px;margin-top:8px}.tally span,.stat-strip span{flex:1 1 118px;min-height:32px;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:6px 9px;border-radius:8px;background:#ffffff14;font-weight:800}.field-panel{grid-area:field;min-height:0;height:100%}.video-wrap{position:relative;width:100%;height:100%;min-height:0;overflow:hidden;border-radius:8px;background:linear-gradient(90deg,rgba(255,255,255,.09) 1px,transparent 1px) 0 0 / 34px 34px,linear-gradient(180deg,#263b2c,#695438);border:2px solid rgba(248,244,231,.86);box-shadow:0 12px 34px #00000052}.video-wrap:after{content:"";position:absolute;left:50%;bottom:2.5%;width:min(25%,170px);aspect-ratio:1 / 1;background:#f8f4e729;border:4px solid rgba(248,244,231,.9);clip-path:polygon(0 0,100% 0,100% 50%,50% 100%,0 50%);filter:drop-shadow(0 0 14px rgba(248,244,231,.35));transform:translate(-50%);pointer-events:none}.video-wrap.sampling{outline:4px solid #f8d348}.video-wrap.calibrating{outline:4px solid #62d4ff}.camera-guide{position:absolute;z-index:5;top:0;right:0;bottom:0;left:0;display:grid;place-content:center;justify-items:center;gap:8px;padding:24px;text-align:center;pointer-events:none;background:#08140d3d;color:#fff;text-shadow:0 2px 8px rgba(0,0,0,.8)}.camera-guide.hidden{display:none}.camera-guide strong{display:grid;place-items:center;min-width:104px;min-height:104px;padding:12px;border:5px solid currentColor;border-radius:999px;background:#102016b8;font-family:Arial Black,Impact,sans-serif;font-size:clamp(3rem,12vh,6rem);line-height:1}.camera-guide span{max-width:520px;padding:8px 14px;border-radius:8px;background:#102016db;font-size:clamp(1rem,3vh,1.4rem);font-weight:900}.camera-guide.sampling strong{color:#f8d348;width:clamp(130px,24vw,220px);height:clamp(130px,24vw,220px);padding:0;border-width:7px;background:#10201614;box-shadow:0 0 0 999px #08140d1f}.camera-guide.captured strong,.camera-guide.go strong{color:#2ee66b}.camera-guide.countdown strong{color:#f8d348}.camera-guide.calibration{place-content:start center;padding-top:16px;background:#08140d14}.camera-guide.calibration strong{min-width:74px;min-height:74px;border-width:4px;color:#62d4ff;font-size:clamp(1.6rem,6vh,2.6rem)}.camera-guide.calibration span{max-width:min(620px,calc(100% - 16px))}.stat-strip strong.calibrated{color:#62d4ff}.ball-swatch{display:none;width:15px;height:15px;margin:0 5px;border:2px solid #f8f4e7;border-radius:999px;vertical-align:-2px;box-shadow:0 0 0 1px #102016cc}.ball-swatch.visible{display:inline-block}video,#overlay,.field-fallback{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%}video{object-fit:fill}#overlay{touch-action:none}.field-fallback{display:grid;place-items:center;align-content:center;gap:8px;padding:24px;text-align:center;background:linear-gradient(90deg,rgba(255,255,255,.06) 1px,transparent 1px) 0 0 / 26px 26px,#102016d9}.field-fallback strong{font-size:clamp(1.7rem,5vw,3.4rem)}.field-fallback span{max-width:min(420px,calc(100% - 20px));color:#dfe9dc;font-weight:700;overflow-wrap:anywhere}.setup-card{width:min(390px,calc(100% - 20px));display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;margin-top:4px;padding:10px;border-radius:8px;background:#0000006b;border:1px solid rgba(248,244,231,.18);text-align:left}.setup-card b{grid-column:1 / -1;color:#f8d348;font-size:.78rem;text-transform:uppercase}.setup-card span{position:relative;max-width:none;padding-left:14px;color:#f8f4e7;font-size:.82rem;line-height:1.18}.setup-card span:before{content:"";position:absolute;left:0;top:.42em;width:6px;height:6px;border-radius:50%;background:#2ee66b}.field-fallback.hidden,.hidden-canvas{display:none}.controls{grid-area:controls;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}#calibrateCamera{grid-column:1 / -1;background:#62d4ff21;border-color:#62d4ffb3}.camera-choice{grid-column:1 / -1;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.controls .primary{background:#c93232}.controls .ready{background:#14783e}.bench{grid-area:bench;display:grid;gap:9px;padding:10px;border-radius:8px;background:#00000042;border:1px solid rgba(255,255,255,.13)}.control-group{display:grid;gap:6px}.group-label,.range-row span,.toggle-row span{font-size:.82rem;font-weight:900;text-transform:uppercase;color:#f8d348}.segmented{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:5px}.segmented button{min-width:0;padding-inline:6px;font-size:.86rem}.bench button,.controls button,.camera-choice button{min-height:40px}.camera-choice button{min-height:34px;background:#ffffff14;color:#dfe9dc;font-size:.84rem}.camera-choice button.active{background:#f8d348;border-color:#f8d348;color:#102016}.range-row,.toggle-row{display:flex;align-items:center;justify-content:space-between;gap:12px}.range-row input{width:min(240px,58%);accent-color:#f8d348}.toggle-row input{width:22px;height:22px;accent-color:#2ee66b}.diagnostic-tools{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}.controls .diagnostic-tools{grid-column:1 / -1;padding:7px;border:1px solid rgba(248,211,72,.42);border-radius:8px;background:#f8d34812}.diagnostic-tools button.recording{border-color:#ff6b4a;background:#a72727}#autoUploadButton{grid-column:1 / -1;min-height:34px;background:#62d4ff1a}.diagnostic-tools span{grid-column:1 / -1;min-height:20px;color:#dfe9dc;font-size:.78rem;line-height:1.25}@media (max-width: 820px){.shell{grid-template-columns:1fr;grid-template-rows:auto auto minmax(0,1fr) auto auto;grid-template-areas:"top" "score" "field" "controls" "bench";gap:8px}.topbar{align-items:start}.video-wrap{min-height:0}}@media (max-width: 520px){.shell{padding:max(6px,env(safe-area-inset-top)) 10px max(6px,env(safe-area-inset-bottom));gap:7px}.status-pill{display:none}.kicker{font-size:.72rem}h1{font-size:2.05rem;line-height:.92}.scoreboard{padding:9px}.count-grid{gap:7px;margin-top:8px}.count-panel{padding:8px 4px}.count-label{font-size:.64rem}.count-panel strong{font-size:2.85rem}.callout{min-height:48px;font-size:1.18rem}.tally span,.stat-strip span{min-height:29px;font-size:.9rem}.controls{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}.bench{gap:7px;padding:8px}.bench button,.controls button,.camera-choice button{min-height:38px}.camera-choice button{min-height:32px}.segmented button{font-size:.8rem}.field-fallback{padding:10px;gap:6px}.field-fallback strong{font-size:1.4rem}.field-fallback span{font-size:.82rem}.setup-card{display:none}}