/* One timer shared by the desktop sidebar and compact mobile training bar. */
.training-overview>summary,.gesture-picker-summary{display:none}
.training-visuals{min-width:0}
.mat-demonstration{min-width:0}
.training-visuals .movement-detail p{display:block}
@media(min-width:1024px){
 header{height:82px}
 header .brand{width:192px;height:78px}
 main{max-width:1640px;padding:0 3%}
 .training-overview{margin:12px 0 8px}
 .training-overview>summary{display:list-item;cursor:pointer;font-size:12px;color:#686870;padding:8px 0;width:fit-content}
 .training-overview .intro{min-height:260px}
 .workspace{display:grid;grid-template-columns:290px minmax(0,1fr);gap:12px 20px;padding-top:0;scroll-margin-top:12px}
 .training-sidebar{grid-column:1;grid-row:1 / span 2;position:sticky;top:12px;border:1px solid #e0e0e6;border-radius:16px;background:#fff;overflow:hidden;min-width:0}
 .timer-sidebar-heading{padding:20px 20px 0}
 .timer-sidebar-heading .eyebrow{font-size:9px;color:#b30d1b}
 .timer-sidebar-heading h2{margin:5px 0 8px;font-size:22px}
 .timer-sidebar-heading p{margin:0;color:#6c6c74;font-size:13px;line-height:1.5}
 .training-sidebar .challenge-options{padding:18px 20px 0;gap:10px}
 .training-sidebar .challenge-options label{font-size:10px}
 .training-sidebar .challenge-options select{font-size:11px;padding:9px 5px}
 .training-sidebar .xp-preview{margin:14px 20px 0;padding:10px;gap:8px}
 .training-sidebar .xp-preview .xp-coin{width:30px;height:30px}
 .training-sidebar .xp-preview b{font-size:11px}
 .training-sidebar .xp-preview div>span{font-size:9px;line-height:1.5}
 .training-sidebar .timer-box{padding:18px 8px}
 .training-sidebar .timer{font-size:68px}
 .training-sidebar .personal-best{font-size:10px;line-height:1.6;padding:0 9px}
 .training-sidebar .wide{width:calc(100% - 40px);margin:0 20px 16px;min-height:50px}
 .training-sidebar .timer-help{margin:0 20px 20px;font-size:10px;line-height:1.7}
 .training-sidebar .cancel{margin:-4px auto 14px}
 .training-sidebar .save-result{margin:0 14px 16px;padding:14px}
 .training-sidebar .result-actions{flex-wrap:wrap;gap:8px}
 .training-sidebar .result-actions button{width:100%;justify-content:center}
 .library{grid-column:2;grid-row:1;position:relative;z-index:3;min-width:0}
 .gesture-picker-summary{display:flex;align-items:center;justify-content:space-between;gap:15px;border:1px solid #e0e0e6;border-radius:12px;background:#fff;padding:12px 18px;cursor:pointer;list-style:none}
 .gesture-picker-summary::-webkit-details-marker{display:none}
 .gesture-picker-summary>span:first-child{font-size:10px;color:#777780;min-width:0}
 .gesture-picker-summary strong{display:block;font-size:16px;color:#19191c;margin-top:4px;overflow-wrap:anywhere}
 .gesture-picker-action{font-size:12px;color:#be0c1b;white-space:nowrap}
 .gesture-picker-summary[aria-disabled=true]{cursor:default}
 .gesture-catalog{position:relative;margin-top:8px;padding:20px;border:1px solid #e0e0e6;border-radius:14px;background:#fff;box-shadow:0 6px 18px #19191c0a}
 .gesture-catalog .drill-list{max-height:min(42vh,360px);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);overflow-y:scroll;overflow-x:hidden;overscroll-behavior-y:contain;scrollbar-width:auto;scrollbar-gutter:stable;scrollbar-color:#b82232 #f1e9eb;gap:8px;padding:4px 10px 10px 4px}
 .gesture-catalog .drill-list::-webkit-scrollbar{width:12px}
 .gesture-catalog .drill-list::-webkit-scrollbar-track{background:#f1e9eb;border-radius:10px}
 .gesture-catalog .drill-list::-webkit-scrollbar-thumb{background:#b82232;border:3px solid #f1e9eb;border-radius:10px}
 .gesture-catalog .drill-group-heading{grid-column:1 / -1}
 .gesture-catalog .drill-card{min-width:0;max-width:none}
 .gesture-catalog .coach-tip{display:none}
 .studio{grid-column:2;grid-row:2;min-width:0}
 .studio-top{display:none}
 .studio h2{font-size:30px}
 .mode-tabs{margin:0 18px;gap:24px;padding-top:14px}
 .mode-tabs button{padding-bottom:10px;font-size:11px}
 .animation-controls{margin:12px 18px 0;gap:8px}
 .animation-controls label{font-size:10px}
 .animation-controls p{width:auto;margin:0;font-size:9px}
 .training-visuals{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:14px;margin:14px 18px 0;align-items:start}
 .training-visuals .mat-stage{margin:0;border:1px solid #c6dabb}
 .training-visuals .stage-label{padding:13px 12px 0;font-size:8px;min-height:32px;gap:8px}
 .training-visuals .stage-label span:last-child{font-size:8px;text-align:right;max-width:140px}
 .training-visuals .stage-bottom{padding:4px 12px 12px;flex-wrap:wrap}
 .training-visuals #mat{max-height:none}
 #training-contact{margin:0;padding:12px;border-radius:12px}
 #training-contact .contact-heading h3{font-size:15px;margin:3px 0 10px}
 #training-contact .contact-eyebrow{font-size:8px}
 #training-contact .contact-badge{font-size:9px;padding:5px 7px}
 #training-contact .contact-intro{display:none}
 #training-contact .contact-current{margin-top:9px;gap:6px}
 #training-contact .contact-label{font-size:12px}
 #training-contact .contact-index{font-size:10px}
 #training-contact .contact-action{font-size:11px;line-height:1.5;min-height:33px;margin:6px 0 10px}
 #training-contact .contact-controls{gap:6px;display:grid;grid-template-columns:auto auto minmax(0,1fr)}
 #training-contact .contact-controls .secondary{padding:9px 10px;font-size:10px}
 #training-contact label{font-size:9px;gap:4px}
 #training-contact select{font-size:10px;padding:8px 5px;margin:0;width:100%}
 #training-contact .contact-navigation{margin-top:10px;gap:6px}
 #training-contact .contact-navigation .secondary{padding:9px 12px}
 #training-contact .contact-legend{gap:8px;font-size:9px;margin:12px 0 0}
 #training-contact .contact-note{font-size:9px;line-height:1.5;margin:10px 0 0}
 .training-visuals .movement-detail{margin:10px 0 0}
 .movement-detail p{font-size:11px;line-height:1.6}
 #learn-panel .steps-head{margin:14px 18px}
 #learn-panel .instructions{padding:0 18px}
 #learn-panel .gesture-note{margin:14px 18px}
 #learn-panel #try-challenge{display:none}
 .running .training-sidebar .timer{font-size:68px}
}

@media(max-width:1023px){
 .training-overview{margin:12px 0}
 .training-overview>summary{display:list-item;cursor:pointer;padding:8px 0;color:#686870;font-size:12px}
 .workspace{display:flex;flex-direction:column;gap:14px;scroll-margin-top:12px}
 .library{order:0;width:100%;min-width:0}
 .gesture-picker-summary{display:flex;justify-content:space-between;align-items:center;gap:12px;list-style:none;cursor:pointer;padding:12px 14px;background:#fff;border:1px solid #e0e0e6;border-radius:12px}
 .gesture-picker-summary::-webkit-details-marker{display:none}
 .gesture-picker-summary>span:first-child{font-size:10px;color:#777780;min-width:0}
 .gesture-picker-summary strong{display:block;color:#19191c;font-size:16px;margin-top:4px;overflow-wrap:anywhere}
 .gesture-picker-action{font-size:11px;color:#be0c1b;white-space:nowrap}
 .gesture-catalog{padding:16px 12px;margin-top:8px;background:#fff;border:1px solid #e0e0e6;border-radius:14px}
 .gesture-catalog .drill-list{display:flex;flex-direction:column;max-height:45vh;overflow-y:scroll;overflow-x:hidden;scroll-snap-type:none;scrollbar-gutter:stable;scrollbar-width:auto;scrollbar-color:#b82232 #f1e9eb;gap:8px;padding:4px 8px 8px 4px}
 .gesture-catalog .drill-card{width:100%;min-width:0;max-width:none}
 .gesture-catalog .drill-group-heading{min-width:0;width:100%}
 .gesture-catalog .coach-tip{display:none}
 .gesture-catalog .catalog-tools{grid-template-columns:1fr}
 .gesture-catalog .filters{display:flex;flex-wrap:wrap;gap:6px}
 .gesture-catalog .filter{padding:10px 12px;min-height:40px}
 .training-sidebar{order:1;position:sticky;top:8px;z-index:4;max-height:calc(100dvh - 16px);overflow-y:auto;align-self:stretch;background:#fff;border:1px solid #e0e0e6;border-radius:14px;box-shadow:0 4px 14px #19191c12;padding:10px 12px;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 10px;min-width:0}
 .timer-sidebar-heading{min-width:0;align-self:center}
 .timer-sidebar-heading .eyebrow{display:none}
 .timer-sidebar-heading h2{font-size:12px;margin:0 0 3px}
 .timer-sidebar-heading p{font-size:11px;line-height:1.3;color:#6c6c74;margin:0;overflow-wrap:anywhere}
 .timer-settings{align-self:center;font-size:11px;min-width:0}
 .timer-settings>summary{cursor:pointer;color:#b30d1b;padding:8px 0;min-height:32px}
 .timer-settings[open]{grid-column:1 / -1;grid-row:2;max-height:40vh;overflow-y:auto;border-top:1px solid #e0e0e6;padding-top:5px}
 .timer-settings .challenge-options{padding:8px 0;gap:10px}
 .timer-settings .xp-preview{margin:6px 0;padding:10px}
 .timer-settings .personal-best{margin:10px 0;font-size:11px;line-height:1.5}
 .timer-settings .timer-help{margin:8px 0;font-size:11px;text-align:left}
 .training-sidebar #challenge-panel{grid-column:1 / -1;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:6px 10px;align-items:center}
 .training-sidebar .timer-box{padding:0;text-align:left;min-width:0}
 .training-sidebar .timer-box .eyebrow{font-size:8px}
 .training-sidebar .timer,.running .training-sidebar .timer{font-size:40px;line-height:1.1;white-space:nowrap}
 .training-sidebar .timer span{font-size:24px}
 .training-sidebar .wide{width:100%;margin:0;min-height:48px;padding:12px;font-size:12px}
 .training-sidebar .cancel{grid-column:1 / -1;margin:0;min-height:30px}
 .training-sidebar .save-result{grid-column:1 / -1;margin:6px 0 0;padding:12px;max-height:45vh;overflow-y:auto}
 .training-sidebar .result-actions{flex-wrap:wrap}
 .studio{order:2;min-width:0;width:100%}
 .studio-top{display:none}
 .mode-tabs{padding-top:14px}
 .training-visuals{display:flex;flex-direction:column;gap:14px;margin:14px 14px 0}
 .training-visuals .mat-stage{margin:0}
 .training-visuals .movement-detail{margin:10px 0 0}
 #training-contact{margin:0;padding:14px;border-radius:12px}
 #learn-panel #try-challenge{display:none}
}

/* Keep the same physical target from the launch tap through the stop tap. */
#timer-button{touch-action:manipulation}
#timer-button.timer-position-locked{position:fixed!important;right:auto!important;bottom:auto!important;margin:0!important;min-height:0!important;z-index:50;box-sizing:border-box;transition:background-color .2s,color .2s;touch-action:manipulation}
.timer-button-space{width:calc(100% - 40px);margin:0 20px 16px}
@media(max-width:1023px){.training-sidebar .timer-button-space{width:100%;margin:0}}
.running .training-sidebar .challenge-options{display:flex}
.training-sidebar .timer-box .eyebrow{min-height:2.8em}

/* Animated SVGs and changing cues must never become scroll anchors. */
.training-visuals{overflow-anchor:none}
.training-visuals #mat{aspect-ratio:31 / 20;height:auto;overflow:hidden}
.training-visuals .contact-scene{aspect-ratio:8 / 5;overflow:hidden}
#training-contact .contact-label{display:block;flex:1;min-width:0}
#training-contact .contact-index{flex:none;min-width:36px;text-align:right}