.motion-layout{display:grid;grid-template-columns:280px minmax(0,1fr);height:calc(100dvh - var(--state-header-height));min-height:420px}.motion-controls{overflow-y:auto;padding:12px 10px;background:#f5f8f4;border-right:1px solid var(--line)}.motion-workspace{display:flex;flex-direction:column;min-width:0;min-height:0;padding:8px;gap:7px}.motion-stage{position:relative;flex:1;min-height:240px;overflow:hidden;background:#f5f7f2;border:1px solid var(--line);border-radius:12px;isolation:isolate}#motion-viewport{position:absolute;inset:0}#motion-viewport canvas{display:block;width:100%;height:100%;touch-action:none}.motion-page .view-toolbar{z-index:6}.motion-page .scene-controls{--scene-bottom:52px}.motion-controls .tool-field{grid-template-columns:minmax(0,1fr) 138px}.motion-controls .model-number span{white-space:nowrap;flex-shrink:0}.motion-stops{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-top:16px}.motion-stops button{font-size:12px;min-height:36px}.motion-playback:not(.phase-panel){display:grid;grid-template-columns:auto auto minmax(40px,1fr) 40px;align-items:center;gap:10px;padding:7px;background:#f8fbf6;border:1px solid var(--line);border-radius:9px;font-size:12px}.motion-playback>button{min-width:64px;min-height:38px}.motion-playback output{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}.motion-playback .pedal-controls button{min-width:44px;min-height:30px;padding:4px 7px;font-size:11px}.motion-metrics{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:6px}.motion-metrics>div{padding:9px 12px;border:1px solid var(--line);background:#f7faf5;border-radius:9px}.motion-metrics span{display:block;color:#778b7b;font-size:11px;margin-bottom:5px}.motion-metrics strong{font-size:15px;font-weight:600}.motion-watermark{position:absolute;right:14px;bottom:10px;color:#52766066;letter-spacing:2px;font-size:12px;font-weight:700;pointer-events:none}.motion-waterline{position:absolute;right:12px;bottom:30px;pointer-events:none;font-size:11px;color:#5c8290}.motion-page #motion-toast{position:absolute;bottom:36px;left:50%;transform:translateX(-50%);padding:9px 13px;background:#eff7edee;border:1px solid #c7d9c9;border-radius:8px;font-size:12px;max-width:85%;z-index:9}.motion-page #motion-exit{position:fixed;right:16px;top:18px;z-index:50}.motion-clean .state-header,.motion-clean .motion-controls,.motion-clean .view-toolbar,.motion-clean .scene-controls,.motion-clean .motion-playback,.motion-clean .motion-metrics{display:none}.motion-clean .motion-layout{height:100dvh;display:block}.motion-clean .motion-workspace{height:100%;padding:0}.motion-clean .motion-stage{border:0;border-radius:0}
@media(max-width:650px), (max-width:1100px) and (max-height:600px){.motion-layout{display:flex;flex-direction:column;height:auto;min-height:0}.motion-workspace{order:-1;padding:5px max(3px,env(safe-area-inset-right)) 5px max(3px,env(safe-area-inset-left));gap:5px}.motion-stage{flex:none;height:clamp(380px,110vw,550px);min-height:0}.motion-controls{border:0;padding:8px max(7px,env(safe-area-inset-right)) max(8px,env(safe-area-inset-bottom)) max(7px,env(safe-area-inset-left))}.motion-page .scene-controls{--scene-bottom:8px}.motion-playback{gap:7px;font-size:12px}.motion-metrics>div{padding:8px}.motion-metrics strong{font-size:13px}.motion-controls .control-card{margin-bottom:4px}.motion-clean .motion-stage{height:100%}.motion-page .model-field{grid-template-columns:minmax(0,1fr) 108px}}

#motion-video{width:100%;margin-top:9px}#motion-record-result{margin-top:12px}#motion-record-result p{font-size:12px;color:#526e5d}#motion-record-preview{display:block;width:100%;max-height:300px;background:#e8efea;border-radius:8px}.motion-download{display:block;margin-top:8px;padding:9px;border:1px solid var(--line);border-radius:7px;text-align:center;font-size:13px;color:#345e45;text-decoration:none}.motion-capture-canvas{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:#edf4ee;z-index:7;pointer-events:none}#motion-record-status{position:absolute;bottom:18px;left:50%;transform:translateX(-50%);z-index:12;display:flex;align-items:center;gap:9px;background:#f5faf2f5;padding:8px 10px;border:1px solid var(--line);border-radius:9px;max-width:calc(100% - 16px);font-size:12px;white-space:nowrap}#motion-record-status[hidden]{display:none}#motion-record-label{min-width:0;white-space:normal;line-height:1.4}#motion-record-progress{width:70px;flex-shrink:0}#motion-record-cancel{flex-shrink:0;min-height:36px;font-size:12px}@media(max-width:400px){#motion-record-progress{width:40px}#motion-record-status{gap:6px}}

/* Compact, aligned technique controls and six model readouts. */
.motion-metric-heading{font-size:11px;color:#617766;line-height:1.2;padding:0 2px}.motion-metrics{grid-template-columns:repeat(3,minmax(0,1fr));gap:5px}.motion-metrics>div{min-width:0;padding:6px 9px}.motion-metrics span{margin-bottom:3px}.motion-metrics strong{font-size:13px;display:block;line-height:1.3;overflow-wrap:anywhere;font-variant-numeric:tabular-nums}.motion-controls .slider-row{margin:10px 0;grid-template-columns:minmax(0,1fr) 48px}.motion-controls .slider-row input{grid-column:1/-1}.motion-controls .slider-row output{font-size:12px;text-align:right;font-variant-numeric:tabular-nums}.motion-controls .tool-field{grid-template-columns:minmax(0,1fr) 144px;gap:8px}.motion-controls .tool-field label{font-size:12px}.motion-controls .tool-field select{font-size:12px;min-width:0;width:100%}.motion-controls .model-number input{min-width:0}.motion-controls .model-number span{font-size:10px}.motion-clean .motion-metric-heading{display:none}.motion-assembling .motion-watermark{color:#527660aa}
@media(max-width:650px), (max-width:1100px) and (max-height:600px){.motion-metrics strong{font-size:12px}.motion-metrics span{font-size:10px}.motion-metrics>div{padding:6px}.motion-controls .tool-field{grid-template-columns:minmax(0,1fr) 154px}.motion-controls .slider-row input{min-height:24px}.motion-metric-heading{font-size:10px}}
.motion-part-panel{position:absolute;z-index:8;right:10px;top:64px;width:min(268px,calc(100% - 24px));max-height:calc(100% - 104px);overflow:auto;padding:12px;background:#f8fcf6f5;border:1px solid #c7d8c9;border-radius:10px;box-shadow:0 6px 22px #2e47331a;font-size:12px;line-height:1.6}.motion-part-panel[hidden]{display:none}.motion-part-panel header{display:flex;gap:8px;align-items:flex-start}.motion-part-panel h2{font-size:15px;margin:0;flex:1}.motion-part-panel h3{font-size:12px;margin:12px 0 4px;color:#42664c}.motion-part-panel p{margin:5px 0}.motion-part-panel #motion-part-kind{color:#6f8372;font-size:11px}#motion-part-close{padding:0;width:32px;min-height:32px;flex-shrink:0;font-size:20px}#motion-related{display:flex;flex-wrap:wrap;gap:5px}#motion-related button{font-size:11px;min-height:34px;padding:5px 8px;text-align:left}.motion-part-panel .control-help{font-size:11px}.motion-clean .motion-part-panel{display:none}[data-motion-panel="anatomy"]>label{display:block;font-size:12px;margin:10px 0 5px}[data-motion-panel="anatomy"]>select,[data-motion-panel="anatomy"]>input{width:100%;min-width:0;min-height:38px}.motion-anatomy-hint{font-size:12px;line-height:1.7;color:#647969}
@media(max-width:650px), (max-width:1100px) and (max-height:600px){.motion-part-panel{top:auto;bottom:10px;right:8px;width:calc(100% - 16px);max-height:44%;padding:9px 11px;box-sizing:border-box}.motion-part-panel h2{font-size:14px}#motion-related button{min-height:38px;font-size:12px}}
/* Keep the selected limb visible on phones: details sit below playback. */
@media(max-width:650px), (max-width:1100px) and (max-height:600px){.motion-workspace>.motion-part-panel{position:relative;top:auto;right:auto;bottom:auto;width:100%;max-height:260px;flex-shrink:0;margin:0;box-shadow:none}}

@media(min-width:651px) and (max-width:1100px) and (max-height:600px){.motion-stage{height:clamp(300px,calc(100dvh - var(--state-header-height) - 60px),480px)}.motion-clean .motion-stage{height:100%}}

/* Scenario calculations use the motion cadence, independently of slow playback. */
.motion-estimate-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr)) auto;gap:4px 10px;align-items:center;padding:8px 11px;border:1px solid #c5dccc;border-radius:10px;background:#eff7f0;flex-shrink:0}.motion-estimate-summary>div{min-width:0}.motion-estimate-summary>div>span{display:block;color:#617867;font-size:10px;line-height:1.35}.motion-estimate-summary strong{display:block;margin-top:2px;font-size:15px;font-weight:650;line-height:1.3;font-variant-numeric:tabular-nums;color:#294f37;white-space:nowrap}.motion-estimate-summary .estimate-open{min-height:34px;padding:5px 9px;font-size:11px;white-space:nowrap}.estimate-summary-status{grid-column:1/-1;color:#6b7d6f;font-size:10px;line-height:1.35}.motion-clean .motion-estimate-summary{display:none}.motion-estimate-panel{font-size:12px;line-height:1.55}.estimate-source-status{margin:1px 0 13px;padding:6px 8px;color:#42674c;background:#edf5ed;border-radius:6px;font-size:11px}.estimate-source-status.example{color:#75602f;background:#f8f3e8}.estimate-note,.estimate-limit,.estimate-storage{font-size:11px;line-height:1.7;color:#617566;margin:9px 0}.estimate-limit{color:#536a5a}.estimate-storage{color:#7c8b7f;font-size:10px}.motion-controls .estimate-field{grid-template-columns:minmax(0,1fr) 100px;gap:7px;margin:11px 0}.motion-controls .estimate-select{grid-template-columns:1fr;gap:5px}.estimate-field[hidden],.estimate-pool-fields[hidden]{display:none}.estimate-field label{line-height:1.45}.estimate-field input[aria-invalid="true"]{border-color:#ad6253;background:#fff8f5}.estimate-cadence{display:flex;gap:6px 8px;flex-wrap:wrap;align-items:center;border-top:1px solid #e0e9df;padding-top:11px;margin-top:10px}.estimate-cadence>span{flex:1;min-width:80px;color:#5b7463;font-size:11px}.estimate-cadence strong{font-size:12px;font-variant-numeric:tabular-nums}.estimate-cadence button{font-size:10px;min-height:30px;padding:4px 7px}.estimate-basis{font-size:12px;font-weight:600;color:#41674b;margin:9px 0}.estimate-pool-fields{padding:1px 8px 6px;background:#f4f8f3;border:1px solid #e0e9df;border-radius:7px;margin-top:7px}.estimate-error{color:#9c4b39;font-size:11px;line-height:1.6;margin:8px 0}.estimate-table{width:100%;border-collapse:collapse;table-layout:fixed;margin:13px 0 10px;font-size:11px;font-variant-numeric:tabular-nums}.estimate-table caption{text-align:left;font-weight:600;color:#41664b;margin-bottom:7px}.estimate-table th,.estimate-table td{text-align:right;padding:8px 4px;vertical-align:middle;border-bottom:1px solid #e1e9df;overflow-wrap:anywhere}.estimate-table th:first-child{width:29%;text-align:left}.estimate-table thead th{font-size:10px;line-height:1.4;font-weight:500;color:#6b7c6d;background:#f2f7ef}.estimate-table tbody th{font-weight:500}.estimate-table td:nth-child(2){white-space:nowrap;font-weight:650;color:#2f583e}.estimate-table small{display:block;font-weight:400;color:#748777;font-size:9px;line-height:1.5;margin-top:2px}.estimate-table tr.estimate-race{background:#f2f8ef}.estimate-table tr[data-custom="true"]>th{color:#1e6f49}.estimate-method{border-top:1px solid #e0e9df;margin-top:13px;padding-top:10px}.estimate-method>summary{cursor:pointer;color:#4c7057;font-size:11px;min-height:28px}
@media(max-width:650px), (max-width:1100px) and (max-height:600px){.motion-estimate-summary{gap:3px 6px;padding:7px 8px}.motion-estimate-summary strong{font-size:13px}.motion-estimate-summary .estimate-open{padding:4px 7px;min-height:36px;font-size:10px}.motion-estimate-summary>div>span,.estimate-summary-status{font-size:9px}.motion-controls .estimate-field{grid-template-columns:minmax(0,1fr) 130px}.motion-controls .estimate-select{grid-template-columns:1fr}.estimate-table{font-size:12px}.estimate-table thead th,.estimate-table small{font-size:10px}.estimate-note,.estimate-limit{font-size:12px}.estimate-cadence>span{font-size:12px}}
