/* Viewport workspace; scoped so the preserved straight-line lab is unchanged. */
.compact-lab{font-size:13px}.compact-lab header{height:46px;padding:0 18px;align-items:center}.compact-lab header b{letter-spacing:.06em}.compact-lab main{max-width:none;padding:10px 14px}.compact-lab .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.compact-lab .layout{grid-template-columns:minmax(0,1fr) 290px;gap:12px;height:calc(100dvh - 78px);min-height:520px}.compact-lab .stage,.compact-lab aside{border-radius:12px;padding:12px;min-width:0;min-height:0;height:100%;overflow:auto;overscroll-behavior:contain}.compact-lab .stage{display:flex;flex-direction:column}.compact-lab .stage>.head{flex:0 0 auto;gap:10px}.compact-lab h2{font-size:16px;margin:0 0 8px}.compact-lab .stage>.head h2{margin:0}.compact-lab #phase{text-align:right;font-size:11px}.compact-lab .view-controls{margin:8px 0;gap:14px;flex-shrink:0}.compact-lab .view-controls label{font-size:11px}.compact-lab #table{display:block;width:100%;height:0;min-height:260px;flex:1 1 0;aspect-ratio:auto;border-radius:8px}.compact-lab button,.compact-lab select{font-size:12px;min-height:34px;padding:7px 10px}.compact-lab .transport{margin:8px 0 0;gap:6px;flex-shrink:0}.compact-lab .transport select{margin-left:auto}.compact-lab #timeline{height:16px;min-height:16px;margin:6px 0;flex-shrink:0}.compact-lab #motionSummary{margin:0;padding:6px 8px;font-size:11px;line-height:1.35;flex-shrink:0}.compact-lab .stage>.stats{padding:7px 0;gap:6px;flex-shrink:0}.compact-lab .stats small{font-size:9px}.compact-lab .stats strong{margin:2px 0 0;font-size:13px}.compact-lab .live-travel{padding:4px 0;font-size:11px;gap:12px;flex-shrink:0}.compact-lab .learning-details{margin:5px 0 0;flex-shrink:0}.compact-lab .learning-details[open]{max-height:210px;overflow:auto;padding-top:5px}.compact-lab .learning-details .coach{margin-top:10px}.compact-lab .caption,.compact-lab .playback-note,.compact-lab .control-help{font-size:11px;line-height:1.5}.compact-lab aside{scrollbar-width:thin;scrollbar-color:#52646a #192326}.compact-lab aside label{margin-top:9px;font-size:12px;line-height:1.3}.compact-lab aside label input[type=checkbox]{vertical-align:middle;margin-right:6px}.compact-lab aside input[type=range]{display:block;height:16px;margin:5px 0}.compact-lab aside .presets{gap:5px}.compact-lab aside .presets button{padding:7px;min-height:32px}.compact-lab .tipface{width:76px;height:76px;margin:6px auto}.compact-lab .tipface span{width:9px;height:9px}.compact-lab .tipface i{font-size:12px;top:calc(50% - 9px);left:calc(50% - 4px)}.compact-lab #contactRisk{font-size:10px;line-height:1.35;margin:3px 0 8px}.compact-lab .stroke-presets{margin-top:5px;gap:5px}.compact-lab .stroke-presets button{min-height:40px;padding:5px;font-size:11px}.compact-lab .stroke-presets button small{font-size:9px;margin-top:1px}.compact-lab #strokeLabel{font-size:10px;margin:3px 0}.compact-lab #stopNote:empty{display:none}.compact-lab #setupSummary{padding:6px;font-size:10px;line-height:1.45;margin:7px 0}.compact-lab #bankDemo{margin-top:8px;min-height:32px}.compact-lab aside details{margin-top:9px}.compact-lab .result{margin-top:10px;padding-top:8px}.compact-lab .result h3{font-size:16px;margin:4px 0}.compact-lab .result p{font-size:10px;line-height:1.4;margin:4px 0}.compact-lab output{font-size:11px}.compact-lab aside details label{min-height:30px}.compact-lab .reference-details{margin-top:12px;padding:10px 12px;border:1px solid #34464a;border-radius:10px}.compact-lab .predictions{margin-top:12px}.compact-lab footer{padding:12px 18px;font-size:10px}.compact-lab.embedded main{padding:8px}.compact-lab.embedded .layout{height:min(800px,calc(100dvh - 65px))}
@media(min-width:1600px){.compact-lab .layout{grid-template-columns:minmax(0,1fr) 320px}}
@media(max-width:850px){.compact-lab .layout{grid-template-columns:minmax(0,1fr) 250px;gap:8px}.compact-lab main{padding:8px}.compact-lab .stage,.compact-lab aside{padding:9px}.compact-lab aside{grid-row:auto}.compact-lab aside output{font-size:10px}.compact-lab #table{min-height:220px}}
@media(max-width:640px){.compact-lab header{height:40px;padding:0 10px;font-size:11px}.compact-lab header small{font-size:9px}.compact-lab main{padding:7px}.compact-lab .layout{height:auto;min-height:0;display:flex;flex-direction:column;gap:10px}.compact-lab .stage{height:calc(100dvh - 58px);min-height:450px;order:0;overflow:auto}.compact-lab aside{height:auto;max-height:none;order:1;display:grid;grid-template-columns:1fr 1fr;column-gap:14px;align-items:start}.compact-lab aside>*{grid-column:1/-1}.compact-lab .tipface{width:90px;height:90px}.compact-lab aside input[type=range]{height:24px}.compact-lab button,.compact-lab select{min-height:40px}.compact-lab #table{min-height:210px}.compact-lab .stage>.stats{padding:5px 0}.compact-lab .stage .transport{position:static}.compact-lab .transport select{max-width:105px;font-size:11px}.compact-lab .live-travel{font-size:10px;gap:7px}.compact-lab .learning-details[open]{max-height:160px}.compact-lab.embedded .layout{height:auto}.compact-lab .reference-details{margin-top:10px}.compact-lab .prediction-grid{grid-template-columns:1fr 1fr;gap:12px}}
@media(max-height:650px) and (min-width:641px){.compact-lab .layout{height:calc(100dvh - 70px);min-height:450px}.compact-lab #table{min-height:210px}.compact-lab .live-travel{display:none}}

@media(max-width:640px){.compact-lab .stage{height:auto;min-height:0}.compact-lab #table{flex:none;height:calc((100vw - 64px)*.5745 + 114px);min-height:220px}.compact-lab .live-travel{display:flex}}

.compact-lab .legacy-setup{display:none}.compact-lab .placement-actions{display:flex;gap:5px;margin-top:7px}.compact-lab .placement-actions button{flex:1;padding:6px;font-size:11px}.compact-lab #placementStatus{font-size:10px;line-height:1.4;margin:6px 0}.compact-lab .position-controls label{margin-top:6px}.compact-lab #applyPositions{margin-top:8px}#table:focus-visible{outline:2px solid #a3ddea;outline-offset:3px}

.compact-lab .equipment-summary{flex-shrink:0;font-size:10px;color:#9ed3df;line-height:1.4;margin:5px 0 0}.compact-lab #restoreEquipment{font-size:11px;margin:4px 0}.compact-lab #equipmentState{color:#e4c383;line-height:1.5}

/* Unified teaching workspace: one table, shared placement and shot modes. */
.compact-lab .modebar{flex-shrink:0;gap:5px;margin:9px 0 0;flex-wrap:wrap}.compact-lab .modebar button{flex:1;min-width:70px;padding:7px 9px;font-size:11px}.compact-lab .guide-state{flex-shrink:0;margin:6px 0 0;padding:7px 9px;border:1px solid #385964;background:#18313a;color:#afe3eb;border-radius:7px;font-size:11px;line-height:1.4}.compact-lab .guide-state.unmatched{border-color:#936744;color:#efc39b;background:#392c23}.compact-lab .view-controls{flex-wrap:wrap;gap:5px 14px}.compact-lab aside .tipface{width:154px;height:154px;margin:8px auto;background:radial-gradient(circle at 32% 25%,white 0%,#f0f5f4 55%,#bdcdd0 100%)}.compact-lab aside .tipface span{width:13px;height:13px;background:#4cdaeb;border:2px solid #145264;z-index:4}.compact-lab .tipface .ball-dot{position:absolute;width:8px;height:8px;background:#bf4339;border-radius:50%;pointer-events:none}.compact-lab .tipface .d1{left:28%;top:13%}.compact-lab .tipface .d2{left:77%;top:34%}.compact-lab .tipface .d3{left:13%;top:65%}.compact-lab .tipface .d4{left:63%;top:82%}.compact-lab .tip-mode{font-size:10px;letter-spacing:.05em;color:#90d4df;margin:7px 0}.compact-lab .large-tip-read{font-size:15px;font-weight:700;text-align:center;color:#abe8ef;margin:4px 0}.compact-lab .shape-tools p{font-size:11px;line-height:1.5}.compact-lab .shape-tools button{margin-top:8px;width:100%}.compact-lab #shapeStatus{color:#b8e5d8}.compact-lab #shapeReadout{color:#d8c796}.compact-lab button:disabled{opacity:.45;cursor:default}.compact-lab .contact-help{font-size:10px;margin:0 0 5px}.compact-lab .layout{grid-template-columns:minmax(0,1fr) 310px}
@media(min-width:1600px){.compact-lab .layout{grid-template-columns:minmax(0,1fr) 340px}}
@media(max-width:850px) and (min-width:641px){.compact-lab .layout{grid-template-columns:minmax(0,1fr) 265px}.compact-lab .modebar button{min-width:65px}}
@media(max-width:640px){.compact-lab .modebar button{min-width:85px}.compact-lab .guide-state{font-size:10px}.compact-lab .view-controls{gap:4px 10px}.compact-lab .view-controls label{font-size:10px}.compact-lab aside .tipface{width:164px;height:164px}.compact-lab #table{height:calc((100vw - 64px)*.5745 + 114px)}}

/* Give the playing surface priority; the cue side inset is opt-in. */
.compact-lab .stage>.stats{padding:2px 0;border-bottom:none;gap:12px;display:flex;align-items:center;justify-content:space-between}.compact-lab .stage>.stats>div{display:flex;gap:8px;align-items:center}.compact-lab .stage>.stats strong{margin:0;font-size:11px}.compact-lab .stage>.stats small{font-size:9px}.compact-lab .live-travel{padding:2px 0;font-size:10px}.compact-lab .modebar{margin-top:6px}.compact-lab .guide-state{padding:5px 8px}.compact-lab .view-controls{margin:5px 0}.compact-lab .transport{margin-top:5px}
@media(max-width:640px){.compact-lab #table{height:calc((100vw - 64px)*.5745 + 24px);min-height:210px}.compact-lab:has(#sideView:checked) #table{height:calc((100vw - 64px)*.5745 + 114px)}}

/* Table-first fit: use available pixels for the playing surface and visible rails. */
.compact-lab header{height:34px;padding:0 10px}.compact-lab main{padding:4px}.compact-lab .layout{height:calc(100dvh - 44px);min-height:420px;grid-template-columns:minmax(0,1fr) 280px;gap:6px}.compact-lab .stage{padding:4px;border-radius:8px}.compact-lab aside{padding:10px;border-radius:8px}.compact-lab .stage>.head{padding:1px 4px}.compact-lab .stage>.head h2{font-size:13px}.compact-lab .stage>.head h2 small{font-size:10px;margin-left:8px;font-weight:400}.compact-lab .view-controls{margin:3px 4px;gap:3px 10px}.compact-lab #table{border-radius:5px;min-height:240px}.compact-lab .transport{margin:4px 2px 0}.compact-lab .transport button,.compact-lab .transport select{min-height:30px;padding:4px 8px;font-size:11px}.compact-lab #timeline{margin:3px 0;height:13px;min-height:13px}.compact-lab #motionSummary{padding:3px 6px;font-size:10px}.compact-lab .stage>.stats,.compact-lab .live-travel{font-size:9px;padding:1px 4px}.compact-lab .learning-details{margin:3px 4px 0;font-size:10px}.compact-lab aside .modebar{display:grid;grid-template-columns:1fr 1fr;margin:0 0 6px;gap:4px}.compact-lab aside .modebar button{min-width:0;min-height:29px;padding:5px}.compact-lab aside .modebar button:last-child{grid-column:1/-1}.compact-lab aside .guide-state{font-size:10px;margin:5px 0;padding:5px}.compact-lab aside .equipment-summary{margin:4px 0 8px;font-size:9px}.compact-lab aside h2{margin:6px 0}.compact-lab aside .contact-help{display:none}
@media(min-width:1600px){.compact-lab .layout{grid-template-columns:minmax(0,1fr) 300px}}
@media(max-width:1000px) and (min-width:641px){.compact-lab .layout{grid-template-columns:minmax(0,1fr) 250px}.compact-lab aside{padding:8px}}
@media(max-width:640px){.compact-lab header{height:32px}.compact-lab .layout{height:auto;min-height:0;display:flex}.compact-lab .stage{height:auto;padding:4px;min-height:0}.compact-lab aside{height:auto;padding:10px}.compact-lab #table{height:calc((100vw - 20px)*.5434 + 12px);min-height:0}.compact-lab:has(#sideView:checked) #table{height:calc((100vw - 20px)*.5434 + 114px)}.compact-lab .view-controls label{font-size:9px}.compact-lab aside .modebar{display:flex;flex-wrap:wrap}.compact-lab aside .modebar button{flex:1 0 28%}.compact-lab .transport button,.compact-lab .transport select{min-height:36px}.compact-lab aside .contact-help{display:block}}

.compact-lab .ball-inventory{margin:0 0 9px;padding:7px;border:1px solid #38545e;border-radius:8px}.compact-lab .ball-inventory summary{color:#cae9ee;font-size:12px;font-weight:650}.compact-lab .ball-inventory p{font-size:10px;line-height:1.4;margin:6px 0}.compact-lab .ball-picker{display:grid;grid-template-columns:repeat(5,1fr);gap:5px;margin:8px 0}.compact-lab .ball-picker button{border-radius:50%;width:32px;height:32px;min-height:32px;padding:0;justify-self:center;border:2px solid #5e727a;background:var(--ball-color);color:white;text-shadow:0 1px 2px #000;font-weight:750;opacity:.4}.compact-lab .ball-picker button.stripe{background:linear-gradient(#fff 22%,var(--ball-color) 22% 78%,#fff 78%)}.compact-lab .ball-picker button.on-table{opacity:1;border-color:#8fe6f0;box-shadow:0 0 0 1px #8fe6f0}.compact-lab .inventory-actions{display:flex;gap:4px}.compact-lab .inventory-actions button{flex:1;padding:5px;font-size:10px}.compact-lab .ball-inventory select{width:100%;margin-top:4px}.compact-lab .pocket-tray{font-size:10px;color:#e9cc83;margin:3px 4px;flex-shrink:0}.compact-lab .stage>.head h2{font-size:12px}.compact-lab .transport{gap:4px}.compact-lab .transport button{padding:4px 7px}

/* Rear contact is radial: combined English shares one contact limit. */
.compact-lab .tipface .contact-band{left:25%;right:auto;top:25%;width:50%;height:50%;border:1px dashed #517b85;border-radius:50%;background:#6abaca18;pointer-events:none}
.compact-lab .english-actions{display:flex;gap:5px;margin:5px 0}.compact-lab .english-actions button{flex:1;font-size:10px;padding:6px}.compact-lab .english-legend{text-align:center;font-size:10px;color:#aacbd3;margin:3px 0}.compact-lab .rail-readout{font-size:10px;color:#a9dee8;line-height:1.4;margin:3px 4px;flex-shrink:0}.compact-lab .large-tip-read{font-size:12px}

.compact-lab .geometry-status{font-size:10px;line-height:1.4;color:#efd29a;padding:5px 7px;background:#362e23;border:1px solid #69573a;border-radius:5px;margin:6px 0}.compact-lab .rail-readout{font-size:10px;max-width:100%;line-height:1.4}

.model-switch{border:1px solid #4b747d;background:#12282e;border-radius:12px;padding:10px 12px;margin-bottom:10px}.model-switch label{margin:0;display:flex;align-items:center;justify-content:space-between;gap:10px}.model-switch select{padding:8px;max-width:170px}.model-switch p{font-size:11px;line-height:1.45;color:#9fb8bd;margin:7px 0 0}.model-switch #modelStatus{color:#9ee5f1;font-weight:750;letter-spacing:.06em}.model-switch #modelStatus.ideal{color:#f3ce81}.collision-readings{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin-top:10px}.collision-readings span{background:#111c1f;border:1px solid #33494e;border-radius:8px;padding:8px;min-width:0}.collision-readings small{display:block;font-size:8px;line-height:1.2}.collision-readings strong{display:block;margin-top:5px;color:#a3ddea;font-size:12px;font-variant-numeric:tabular-nums}@media(max-width:600px){.collision-readings{grid-template-columns:1fr}.model-switch select{max-width:160px}}

/* Let vertical touch gestures scroll even when they start on a slider. */
.compact-lab aside{touch-action:pan-y;overflow-anchor:none;-webkit-overflow-scrolling:touch}
.compact-lab aside input[type=range]{touch-action:pan-y}
.compact-lab aside .tipface{touch-action:none}
@media(max-width:640px){.compact-lab aside{overflow:visible;overscroll-behavior:auto}}

/* On touch devices use the browser's main page scroller, avoiding nested
   momentum scrolling in the controls panel. Keep the table viewport-sized. */
@media (hover:none) and (pointer:coarse){
 .compact-lab .layout,.compact-lab.embedded .layout{height:auto;min-height:0;align-items:start}
 .compact-lab .stage{height:calc(100dvh - 78px);min-height:450px}
 .compact-lab aside{height:auto;max-height:none;overflow:visible;overscroll-behavior:auto;touch-action:auto}
 .compact-lab aside input[type=range]{touch-action:pan-y}
 .compact-lab aside .tipface{touch-action:none}
}

/* v0.8.1: mobile-only presentation patch. Physics and desktop rules unchanged. */
@media(max-width:640px){
 .compact-lab .stage{height:auto !important;min-height:0 !important;overflow:visible;}
 .compact-lab #table{flex:0 0 auto;min-height:0;height:auto;aspect-ratio:1.55;max-height:none;touch-action:none}
 .compact-lab .layout{height:auto;min-height:0}
 .compact-lab .transport{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}
 .compact-lab .transport button,.compact-lab .transport select{width:100%;min-width:0;margin:0;padding:8px 3px;font-size:12px;min-height:43px}
 .compact-lab .transport select{max-width:none;grid-column:span 1}
 .compact-lab .stage>.head{align-items:flex-start;flex-wrap:wrap}
 .compact-lab .view-controls{flex-wrap:wrap;column-gap:12px;row-gap:9px}
 .compact-lab .view-controls label{display:inline-flex;align-items:center;gap:3px;min-height:26px}
 .compact-lab .learning-details{margin-bottom:4px}
 .compact-lab aside{display:block;overflow:visible;touch-action:auto}
 .compact-lab aside>*{max-width:100%}
 .compact-lab aside input[type=range]{min-height:30px;touch-action:auto}
}
@media(max-width:640px) and (hover:none) and (pointer:coarse){
 .compact-lab .stage{height:auto !important;min-height:0 !important}
}

/* v0.8.2 table profile control */
.table-selector{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin:6px 4px;padding:6px 8px;border:1px solid #38545e;border-radius:7px;background:#172a30;font-size:11px}
.table-selector select{padding:5px;min-height:30px}.table-selector small{color:#afcbd1}
@media(max-width:640px){.table-selector{gap:5px}.table-selector small{flex-basis:100%}.compact-lab #table{aspect-ratio:1.62}}