/* Drumix rehearsal room v1.
   This layer only rearranges the existing MusicXML, PBBacking and shared drum-kit UI. */

body.pb-practice {
	--pb-room-bg: #f4f3f1;
	--pb-room-card: #ffffff;
	--pb-room-card-soft: #f8f7f5;
	--pb-room-text: #1d1d1f;
	--pb-room-muted: #6e6e73;
	--pb-room-border: #deddd9;
	--pb-room-accent: #ff5a14;
	--pb-room-accent-soft: #fff0e8;
	--pb-room-blue: #0a84ff;
	--pb-room-shadow: 0 12px 32px rgba(31, 27, 24, .08);
	padding-bottom: 0 !important;
	background: var(--pb-room-bg);
}

body.pb-practice:not(.pb-skin-light),
body.pb-practice.pb-student-dark {
	--pb-room-bg: #111214;
	--pb-room-card: #1c1d20;
	--pb-room-card-soft: #242529;
	--pb-room-text: #f5f5f7;
	--pb-room-muted: #a1a1a6;
	--pb-room-border: #3a3b40;
	--pb-room-accent-soft: #3b241b;
	--pb-room-shadow: 0 14px 36px rgba(0, 0, 0, .28);
}

body.pb-practice #pbPractice {
	overflow-x: hidden;
	overflow-y: auto;
	background:
		radial-gradient(circle at 72% -10%, rgba(255, 90, 20, .09), transparent 34%),
		var(--pb-room-bg);
	color: var(--pb-room-text);
	scroll-padding-top: 18px;
}

body.pb-practice #pbPractice .pbPracTopbar {
	display: none !important;
}

body.pb-practice #pbPractice .pbPracBody {
	display: block !important;
	width: min(1180px, calc(100% - 40px)) !important;
	max-width: 1180px !important;
	min-height: 100%;
	margin: 0 auto !important;
	padding: 18px 0 42px !important;
	box-sizing: border-box;
}

body.pb-practice #pbPractice .pbPracHero {
	position: relative;
	display: grid;
	grid-template-columns: auto minmax(0, 1fr) auto;
	align-items: center;
	gap: 14px;
	min-height: 54px;
	margin: 0 0 14px;
}

body.pb-practice #pbPractice .pbPracBack {
	position: static !important;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 108px;
	min-height: 44px;
	margin: 0;
	padding: 0 15px;
	border: 1px solid var(--pb-room-border);
	border-radius: 14px;
	background: var(--pb-room-card);
	color: var(--pb-room-text);
	box-shadow: 0 4px 14px rgba(20, 20, 20, .04);
	font: 750 14px/1 -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

body.pb-practice #pbPractice .pbPracBack:hover {
	border-color: color-mix(in srgb, var(--pb-room-accent) 55%, var(--pb-room-border));
	background: var(--pb-room-accent-soft);
}

body.pb-practice #pbPractice .pbPracChev {
	margin-right: 5px;
	font-size: 22px;
}

body.pb-practice #pbPractice .pbPracTitle {
	min-width: 0;
	text-align: left;
}

body.pb-practice #pbPractice .pbPracTitleMain {
	color: var(--pb-room-text);
	font: 850 clamp(22px, 2.2vw, 30px)/1.05 -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	letter-spacing: -.035em;
}

body.pb-practice #pbPractice .pbPracTitleMeta {
	margin-top: 6px;
	overflow: hidden;
	color: var(--pb-room-muted);
	font: 600 13px/1.25 -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	text-overflow: ellipsis;
	white-space: nowrap;
}

body.pb-practice .pbRoomSession {
	display: flex;
	align-items: center;
	gap: 8px;
	min-height: 44px;
	padding: 4px 5px 4px 13px;
	border: 1px solid var(--pb-room-border);
	border-radius: 14px;
	background: var(--pb-room-card);
	color: var(--pb-room-muted);
	font: 700 12px/1 -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

body.pb-practice .pbRoomSession[hidden] {
	display: none !important;
}

body.pb-practice .pbRoomSession button {
	min-height: 36px;
	padding: 0 12px;
	border: 0;
	border-radius: 10px;
	background: var(--pb-room-card-soft);
	color: var(--pb-room-text);
	font: 750 12px/1 -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

body.pb-practice .pbRoomLearning {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 14px;
	margin: 0 0 8px;
	padding: 9px 12px;
	border: 1px solid var(--pb-room-border);
	border-radius: 14px;
	background: var(--pb-room-card);
}

body.pb-practice .pbRoomLearningPart {
	min-width: 0;
	margin: 0;
	overflow: hidden;
	color: var(--pb-room-text);
	font: 850 14px/1.15 -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	letter-spacing: -.01em;
	text-overflow: ellipsis;
	white-space: nowrap;
}

body.pb-practice .pbRoomLearningPart[hidden] {
	display: none !important;
}

body.pb-practice .pbRoomLearning[hidden] {
	display: none !important;
}

body.pb-practice .pbRoomLearning ol {
	display: flex;
	align-items: center;
	gap: 5px;
	margin: 0;
	padding: 0;
	list-style: none;
}

body.pb-practice .pbRoomLearning li {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	padding: 0;
	border-radius: 999px;
	color: var(--pb-room-muted);
	font: 750 12px/1 -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	white-space: nowrap;
}

body.pb-practice .pbRoomLearning li > button {
	display: inline-flex;
	min-height: 32px;
	align-items: center;
	padding: 0 8px;
	border: 0;
	border-radius: 999px;
	background: transparent;
	color: inherit;
	font: inherit;
	cursor: pointer;
}

body.pb-practice .pbRoomLearning li > button:hover:not(:disabled) {
	background: color-mix(in srgb, var(--pb-room-accent-soft) 68%, transparent);
	color: var(--pb-room-accent);
}

body.pb-practice .pbRoomLearning li > button:focus-visible {
	outline: 2px solid var(--pb-room-accent);
	outline-offset: 2px;
}

body.pb-practice .pbRoomLearning li + li::before {
	margin-right: 2px;
	color: color-mix(in srgb, var(--pb-room-muted) 58%, transparent);
	content: "→";
}

body.pb-practice .pbRoomLearning li > span {
	display: none;
}

body.pb-practice .pbRoomLearning li.pb-room-learning-active {
	background: transparent;
	color: var(--pb-room-accent);
	font-weight: 850;
}

body.pb-practice .pbRoomLearning li.pb-room-learning-active > button {
	background: var(--pb-room-accent-soft);
}

body.pb-practice .pbRoomLearning li.pb-room-learning-unavailable {
	opacity: .46;
}

body.pb-practice .pbRoomLearning li.pb-room-learning-unavailable > button {
	cursor: default;
}

body.pb-practice .pbRoomLearning p {
	margin: 0;
	color: var(--pb-room-text);
	font: 650 12px/1.3 -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	text-align: right;
}

body.pb-practice .pbRoomSteps {
	display: grid;
	grid-template-columns: repeat(2, auto);
	justify-content: start;
	gap: 6px;
	margin: 0 0 8px;
}

body.pb-practice .pbRoomSteps > button {
	position: relative;
	display: grid;
	grid-template-columns: auto auto;
	grid-template-rows: auto;
	column-gap: 7px;
	align-items: center;
	min-height: 38px;
	padding: 0 12px;
	overflow: hidden;
	border: 1px solid var(--pb-room-border);
	border-radius: 999px;
	background: var(--pb-room-card);
	color: var(--pb-room-text);
	text-align: left;
	transition: border-color .16s ease, background .16s ease, transform .16s ease;
}

body.pb-practice .pbRoomSteps > button:hover {
	border-color: color-mix(in srgb, var(--pb-room-accent) 45%, var(--pb-room-border));
	transform: translateY(-1px);
}

body.pb-practice .pbRoomSteps > button > span {
	grid-row: auto;
	display: inline-flex;
	width: 22px;
	height: 22px;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	background: var(--pb-room-card-soft);
	color: var(--pb-room-muted);
	font: 850 11px/1 -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

body.pb-practice .pbRoomSteps b {
	align-self: center;
	font: 800 13px/1.15 -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

body.pb-practice .pbRoomSteps small {
	display: none;
}

body.pb-practice .pbRoomSteps > button.pb-room-step-active {
	border-color: var(--pb-room-accent);
	background: var(--pb-room-accent-soft);
	box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--pb-room-accent) 22%, transparent);
}

body.pb-practice .pbRoomSteps > button.pb-room-step-active > span {
	background: var(--pb-room-accent);
	color: #fff;
}

body.pb-practice #pbPractice .pbPracCard.pbPracNotesCard {
	position: relative;
	display: block !important;
	width: 100% !important;
	margin: 0 !important;
	padding: 0 !important;
	overflow: hidden;
	border: 1px solid var(--pb-room-border) !important;
	border-radius: 20px !important;
	background: var(--pb-room-card) !important;
	box-shadow: var(--pb-room-shadow);
}

body.pb-practice #pbPractice .pbPracCardHd {
	display: flex !important;
	min-height: 58px;
	align-items: center;
	padding: 11px 17px !important;
	border: 0 !important;
	border-bottom: 1px solid var(--pb-room-border) !important;
	background: var(--pb-room-card) !important;
	color: var(--pb-room-text);
}

body.pb-practice #pbPractice .pbPracCardHd span {
	display: flex;
	flex-direction: column;
	gap: 4px;
}

body.pb-practice #pbPractice .pbPracCardHd b {
	font: 800 16px/1.1 -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

body.pb-practice #pbPractice .pbPracCardHd small {
	color: var(--pb-room-muted);
	font: 550 12px/1.25 -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

body.pb-practice #pbPractice .pbPracFrameWrap {
	min-height: 214px;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	background: #fff;
}

body.pb-practice #pbPractice .pbPracFrame {
	display: block;
	width: 100% !important;
	height: var(--pb-practice-frame-height, 260px) !important;
	min-height: 214px;
	border: 0 !important;
	background: #fff;
}

body.pb-practice .pbRoomPlayer {
	display: grid;
	grid-template-columns: minmax(190px, 220px) minmax(120px, .45fr) minmax(220px, 1.25fr) minmax(150px, .58fr) auto;
	align-items: center;
	gap: 12px;
	min-height: 82px;
	padding: 12px 14px;
	border-top: 1px solid var(--pb-room-border);
	background: var(--pb-room-card-soft);
	box-sizing: border-box;
}

body.pb-practice .pbRoomPlayer .pbPracMinusPlay {
	position: static !important;
	display: inline-flex !important;
	grid-column: 1 !important;
	grid-row: 1 !important;
	width: 100% !important;
	height: 56px !important;
	min-width: 190px;
	align-items: center;
	justify-content: center;
	margin: 0 !important;
	gap: 10px;
	padding: 0 20px !important;
	border: 0 !important;
	border-radius: 14px !important;
	background: var(--pb-room-accent) !important;
	color: #fff !important;
	box-shadow: 0 7px 18px rgba(255, 90, 20, .24);
	font: 850 16px/1 -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

/* The older mobile song shell hides its duplicate practice Play control.
   Inside the unified room this is the primary action and must stay visible. */
body.pb-practice.pb-song-mode.pb-skin-light:not(.pb-admin) #pbPractice .pbRoomPlayer .pbPracMinusPlay {
	display: inline-flex !important;
}

body.pb-practice .pbRoomPlayer .pbRoomPlayIcon {
	display: inline-flex;
	width: 20px;
	justify-content: center;
	font-size: 19px;
}

body.pb-practice .pbRoomPlayer .pbRoomPlayLabel {
	white-space: nowrap;
}

body.pb-practice .pbRoomPlayer .pbPracMinusPlay:disabled {
	opacity: .45;
	box-shadow: none;
}

body.pb-practice .pbRoomPlayer .pbPracMinusMeta {
	display: block !important;
	grid-column: 2 !important;
	grid-row: 1 !important;
	min-width: 0;
}

body.pb-practice .pbRoomPlayer .pbPracMinusName {
	overflow: hidden;
	color: var(--pb-room-text) !important;
	font: 800 14px/1.15 -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	text-overflow: ellipsis;
	white-space: nowrap;
}

body.pb-practice .pbRoomPlayer .pbPracMinusSub {
	margin-top: 4px;
	overflow: hidden;
	color: var(--pb-room-muted) !important;
	font: 550 11px/1.2 -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	text-overflow: ellipsis;
	white-space: nowrap;
}

body.pb-practice .pbRoomPlayer .pbPracTimeline {
	display: block !important;
	grid-column: 3 !important;
	grid-row: 1 !important;
	min-width: 0;
	padding: 0 !important;
	border: 0 !important;
	background: transparent !important;
}

body.pb-practice .pbRoomPlayer .pbPracTimelineCopy {
	display: none !important;
}

body.pb-practice .pbRoomPlayer .pbPracSeekWrap {
	display: grid !important;
	grid-template-columns: auto minmax(80px, 1fr) auto;
	align-items: center;
	gap: 8px;
	width: 100% !important;
}

body.pb-practice .pbRoomPlayer .pbPracSeekWrap > .pbPracTime:first-child {
	display: none !important;
}

body.pb-practice .pbRoomPlayer .pbPracTime {
	color: var(--pb-room-muted) !important;
	font: 700 11px/1 -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
	font-variant-numeric: tabular-nums;
}

body.pb-practice .pbRoomPlayer .pbPracWaveSeek {
	height: 38px !important;
	min-width: 0;
}

body.pb-practice .pbRoomPlayer .pbPracMinusSpeed {
	position: static !important;
	display: grid !important;
	grid-column: 4 !important;
	grid-row: 1 !important;
	grid-template-columns: auto auto;
	grid-template-rows: auto auto;
	align-items: center;
	gap: 3px 8px;
	min-width: 0;
	min-height: 0 !important;
	height: auto !important;
	margin: 0 !important;
	padding: 0 !important;
}

body.pb-practice .pbRoomPlayer .pbPracControlName {
	color: var(--pb-room-muted) !important;
	font: 700 11px/1 -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
}

body.pb-practice .pbRoomPlayer #pbPracMinusSpeedLbl {
	justify-self: end;
	color: var(--pb-room-text);
	font: 800 12px/1 -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

body.pb-practice .pbRoomPlayer #pbPracMinusSpeed {
	grid-column: 1 / -1;
	width: 100% !important;
	min-height: 28px;
	margin: 0 !important;
	accent-color: var(--pb-room-accent);
}

body.pb-practice .pbRoomPlayerControls {
	display: flex;
	grid-column: 5 !important;
	grid-row: 1 !important;
	align-items: center;
	justify-content: flex-end;
	gap: 7px;
}

body.pb-practice .pbRoomPlayerControls button {
	min-height: 44px;
	padding: 0 11px;
	border: 1px solid var(--pb-room-border);
	border-radius: 12px;
	background: var(--pb-room-card);
	color: var(--pb-room-text);
	font: 750 12px/1 -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	white-space: nowrap;
}

body.pb-practice .pbRoomPlayerControls .pbRoomLoop {
	border-color: color-mix(in srgb, var(--pb-room-accent) 40%, var(--pb-room-border));
	background: var(--pb-room-accent-soft);
	color: var(--pb-room-accent);
}

body.pb-practice .pbRoomPlayerControls .pbRoomNextStep {
	border-color: transparent;
	background: transparent;
	color: var(--pb-room-muted);
	font-weight: 700;
}

body.pb-practice .pbRoomPlayerControls .pbRoomNextStep:hover,
body.pb-practice.pb-room-cycle-complete .pbRoomPlayerControls .pbRoomNextStep {
	border-color: var(--pb-room-border);
	background: var(--pb-room-card);
	color: var(--pb-room-text);
}

body.pb-practice .pb-room-loop-pulse {
	animation: pbRoomLoopPulse .32s ease;
}

@keyframes pbRoomLoopPulse {
	50% { transform: rotate(-8deg) scale(1.06); }
}

body.pb-practice .pbRoomLower {
	display: grid;
	grid-template-columns: minmax(0, .9fr) minmax(430px, 1.1fr);
	align-items: stretch;
	gap: 14px;
	margin-top: 14px;
}

body.pb-practice #pbPracMinus {
	position: static !important;
	inset: auto !important;
	display: grid !important;
	grid-template-columns: 1fr !important;
	grid-template-rows: auto auto auto auto !important;
	gap: 12px !important;
	width: auto !important;
	height: auto !important;
	min-height: 100% !important;
	margin: 0 !important;
	padding: 16px !important;
	overflow: visible !important;
	border: 1px solid var(--pb-room-border) !important;
	border-radius: 20px !important;
	background: var(--pb-room-card) !important;
	box-shadow: var(--pb-room-shadow) !important;
	transform: none !important;
}

body.pb-practice #pbPracMinus > * {
	grid-column: 1 !important;
	grid-row: auto !important;
	justify-self: stretch !important;
	align-self: auto !important;
	width: 100% !important;
	max-width: none !important;
	box-sizing: border-box;
}

body.pb-practice #pbPracMinus .pbPracMinusHead {
	display: block !important;
	grid-column: 1 !important;
	grid-row: auto !important;
	width: 100% !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
}

body.pb-practice #pbPracMinus .pbPracMinusHead h2 {
	margin: 0;
	color: var(--pb-room-text);
	font: 850 18px/1.15 -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

body.pb-practice #pbPracMinus .pbPracMinusHead span {
	display: block;
	margin-top: 5px;
	color: var(--pb-room-muted);
	font: 550 12px/1.35 -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

body.pb-practice #pbPracMinus > .pbPracMinusClose,
body.pb-practice #pbPracMinus > .pbPracMinusBadge,
body.pb-practice #pbPracMinus > .pbPracVizDock {
	display: none !important;
}

body.pb-practice #pbPracTrackSeg {
	display: grid !important;
	grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
	gap: 8px !important;
	width: 100% !important;
	height: auto !important;
	min-height: 96px !important;
	max-width: none !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	background: transparent !important;
}

body.pb-practice #pbPracTrackSeg .pbPracTrackBtn {
	display: flex !important;
	min-width: 0 !important;
	min-height: 96px !important;
	height: auto !important;
	padding: 11px 9px !important;
	flex-direction: column;
	align-items: flex-start !important;
	justify-content: flex-start !important;
	gap: 5px !important;
	border: 1px solid var(--pb-room-border) !important;
	border-radius: 14px !important;
	background: var(--pb-room-card-soft) !important;
	color: var(--pb-room-text) !important;
	text-align: left !important;
}

body.pb-practice #pbPracTrackSeg .pbPracTrackBtn.pbTrackOn,
body.pb-practice #pbPracTrackSeg .pbPracTrackBtn.pbSegOn {
	border-color: var(--pb-room-accent) !important;
	background: var(--pb-room-accent-soft) !important;
	box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--pb-room-accent) 25%, transparent);
}

body.pb-practice #pbPracTrackSeg .pbPracTrackBtn b {
	font: 800 13px/1.15 -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

body.pb-practice #pbPracTrackSeg .pbPracTrackBtn small {
	color: var(--pb-room-muted) !important;
	font: 550 10px/1.15 -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

body.pb-practice .pbRoomTrackStatus {
	display: block;
	margin-top: auto;
	color: #1f7a3f;
	font: 750 9px/1.2 -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

body.pb-practice .pb-room-track-unavailable .pbRoomTrackStatus {
	color: var(--pb-room-muted);
}

body.pb-practice #pbPracTrackSeg .pbPracTrackBtn:disabled {
	opacity: .58 !important;
	cursor: not-allowed;
}

body.pb-practice .pbRoomNoTracks {
	margin: 0;
	padding: 10px 12px;
	border-radius: 12px;
	background: var(--pb-room-card-soft);
	color: var(--pb-room-muted);
	font: 650 12px/1.35 -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

body.pb-practice .pbRoomNoTracks[hidden] {
	display: none !important;
}

body.pb-practice .pbRoomDetails {
	width: 100% !important;
	margin: 0;
	border-top: 1px solid var(--pb-room-border);
}

body.pb-practice .pbRoomDetails summary {
	display: flex;
	min-height: 44px;
	align-items: center;
	color: var(--pb-room-text);
	cursor: pointer;
	font: 750 12px/1 -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

body.pb-practice .pbRoomDetailsBody {
	display: grid;
	gap: 12px;
	padding: 2px 0 4px;
}

body.pb-practice .pbRoomDetailsBody > * {
	position: static !important;
	display: grid !important;
	width: 100% !important;
	margin: 0 !important;
	box-sizing: border-box;
}

body.pb-practice .pbRoomKitDock {
	position: relative;
	display: flex;
	align-self: start;
	width: 100%;
	min-width: 0;
	min-height: 0;
	overflow: hidden;
	border: 1px solid var(--pb-room-border);
	border-radius: 20px;
	background: #f2f1ef;
	box-shadow: var(--pb-room-shadow);
}

body.pb-practice .pbRoomKitDock #pbPracticeViz.pb-docked,
body.pb-practice .pbRoomKitDock #pbPracticeViz.pb-mobile-inline {
	position: relative !important;
	inset: auto !important;
	display: flex !important;
	width: 100% !important;
	height: auto !important;
	min-height: 0 !important;
	margin: 0 !important;
	border: 0 !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	transform: none !important;
}

body.pb-practice #pbPracticeViz .pbPracVizCollapse {
	display: inline-flex !important;
	flex: 0 0 158px !important;
	width: 158px !important;
	min-width: 158px;
	min-height: 40px;
	padding: 0 12px !important;
	align-items: center;
	justify-content: center;
	white-space: nowrap;
	font-size: 11px !important;
	font-weight: 750;
	line-height: 1 !important;
}

body.pb-practice .pbRoomKitDock #pbPracticeViz .pbPracVizTitle {
	flex: 0 0 48px;
	height: 48px;
	min-height: 48px;
}

body.pb-practice .pbRoomKitDock #pbPracticeViz .pbPracVizStage {
	flex: 0 0 auto !important;
	width: 100% !important;
	height: auto !important;
	min-height: 0 !important;
	aspect-ratio: 1210 / 566;
}

body.pb-practice #pbPracticeViz.pb-collapsed {
	min-height: 48px !important;
	max-height: 48px !important;
}

body.pb-practice #pbPracticeViz.pb-collapsed .pbPracVizStage,
body.pb-practice #pbPracticeViz.pb-collapsed .pbPracVizResize {
	display: none !important;
}

body.pb-practice #pbPracticeViz.pb-collapsed .pbPracVizTitle {
	min-height: 48px;
}

body.pb-practice.pb-room-step-notes #pbPracMinus {
	opacity: .82;
}

body.pb-practice.pb-room-step-recording #pbPracMinus {
	border-color: color-mix(in srgb, var(--pb-room-accent) 50%, var(--pb-room-border)) !important;
}

.pbRoomCoach {
	position: fixed;
	z-index: 2147483002;
	width: min(360px, calc(100vw - 24px));
	overflow: hidden;
	padding: 18px;
	box-sizing: border-box;
	border: 1px solid color-mix(in srgb, var(--pb-room-blue) 34%, var(--pb-room-border));
	border-radius: 19px;
	background:
		radial-gradient(circle at 8% -12%, color-mix(in srgb, var(--pb-room-accent) 18%, transparent), transparent 34%),
		radial-gradient(circle at 92% -10%, color-mix(in srgb, var(--pb-room-blue) 17%, transparent), transparent 36%),
		var(--pb-room-card);
	color: var(--pb-room-text);
	box-shadow: 0 22px 66px rgba(0, 0, 0, .28), 0 0 0 1px rgba(255, 255, 255, .05);
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.pbRoomCoach[hidden] {
	display: none !important;
}

.pbRoomCoach b {
	position: relative;
	z-index: 1;
	display: block;
	font-size: 19px;
	line-height: 1.16;
	letter-spacing: -.015em;
}

.pbRoomCoach p {
	position: relative;
	z-index: 1;
	margin: 7px 0 14px;
	color: var(--pb-room-muted);
	font-size: 13px;
	line-height: 1.45;
}

.pbRoomCoach > div {
	position: relative;
	z-index: 1;
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.pbRoomCoachKicker {
	position: relative;
	z-index: 1;
	display: flex;
	align-items: center;
	gap: 8px;
	margin-bottom: 11px;
	color: var(--pb-room-accent);
}

.pbRoomCoachKicker > span {
	display: flex;
	width: 30px;
	height: 30px;
	align-items: center;
	justify-content: center;
	border: 1px solid color-mix(in srgb, var(--pb-room-accent) 38%, var(--pb-room-border));
	border-radius: 50%;
	background: var(--pb-room-accent-soft);
}

.pbRoomCoachKicker svg {
	width: 16px;
	height: 16px;
}

.pbRoomCoachKicker small {
	font-size: 10px;
	font-weight: 850;
	letter-spacing: .105em;
	line-height: 1.2;
	text-transform: uppercase;
}

.pbRoomCoach button {
	min-height: 44px;
	padding: 0 13px;
	border: 1px solid var(--pb-room-border);
	border-radius: 11px;
	background: var(--pb-room-card-soft);
	color: var(--pb-room-text);
	font: 750 12px/1 -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.pbRoomCoach .pbRoomCoachPrimary {
	border-color: var(--pb-room-blue);
	background: var(--pb-room-blue);
	box-shadow: 0 9px 20px color-mix(in srgb, var(--pb-room-blue) 24%, transparent);
	color: #fff;
}

body.pb-practice .pb-room-coach-target {
	position: relative;
	z-index: 2147483001 !important;
	outline: 4px solid rgba(255, 90, 20, .28) !important;
	outline-offset: 3px;
}

body.pb-practice.pb-room-coach-open::after {
	position: fixed;
	z-index: 2147483000;
	inset: 0;
	content: "";
	background: rgba(15, 15, 18, .18);
	pointer-events: none;
}

@media (max-width: 1180px) {
	body.pb-practice .pbRoomPlayer {
		grid-template-columns: minmax(190px, 220px) minmax(130px, .5fr) minmax(200px, 1.15fr) minmax(150px, .6fr);
	}
	body.pb-practice .pbRoomPlayerControls {
		grid-column: 1 / -1 !important;
		grid-row: 2 !important;
		justify-content: flex-start;
	}
	body.pb-practice .pbRoomPlayerControls .pbRoomNextStep {
		margin-left: auto;
	}
}

@media (max-width: 1023px) {
	body.pb-practice #pbPractice .pbPracBody {
		width: min(100% - 24px, 834px) !important;
		padding-top: 12px !important;
	}
	body.pb-practice #pbPractice .pbPracHero {
		grid-template-columns: auto minmax(0, 1fr);
		gap: 10px;
	}
	body.pb-practice .pbRoomSession {
		grid-column: 1 / -1;
		justify-self: stretch;
		justify-content: space-between;
	}
	body.pb-practice .pbRoomLower {
		grid-template-columns: 1fr;
	}
	body.pb-practice .pbRoomKitDock {
		grid-row: 1;
	}
	body.pb-practice #pbPracMinus {
		grid-row: 2;
	}
	body.pb-practice .pbRoomKitDock #pbPracticeViz.pb-mobile-inline {
		min-height: 0 !important;
	}
	body.pb-practice .pbRoomKitDock #pbPracticeViz.pb-mobile-inline.pb-collapsed {
		min-height: 48px !important;
	}
	body.pb-practice #pbPracticeViz.pb-mobile-inline .pbPracVizTitleHint {
		font-size: 11px !important;
	}
}

@media (max-width: 720px) {
	body.pb-practice #pbPractice .pbPracBody {
		width: calc(100% - 16px) !important;
		padding: 8px 0 28px !important;
	}
	body.pb-practice.pb-room-step-notes #pbPractice .pbPracBody,
	body.pb-practice.pb-room-step-recording #pbPractice .pbPracBody {
		padding-bottom: calc(140px + env(safe-area-inset-bottom, 0px)) !important;
	}
	body.pb-practice #pbPractice .pbPracHero {
		margin-bottom: 10px;
	}
	body.pb-practice #pbPractice .pbPracBack {
		min-width: 44px;
		width: 44px;
		padding: 0;
		font-size: 0;
	}
	body.pb-practice #pbPractice .pbPracChev {
		margin: 0;
		font-size: 25px;
	}
	body.pb-practice #pbPractice .pbPracTitleMain {
		font-size: 21px;
	}
	body.pb-practice #pbPractice .pbPracTitleMeta {
		font-size: 11px;
	}
	body.pb-practice .pbRoomSteps {
		gap: 6px;
	}
	body.pb-practice .pbRoomSteps > button {
		grid-template-columns: auto auto;
		column-gap: 6px;
		min-height: 36px;
		padding: 0 10px;
		border-radius: 999px;
	}
	body.pb-practice .pbRoomSteps > button > span {
		width: 20px;
		height: 20px;
		font-size: 10px;
	}
	body.pb-practice .pbRoomSteps b {
		font-size: 13px;
	}
	body.pb-practice .pbRoomSteps small {
		display: none;
	}
	body.pb-practice .pbRoomLearning {
		display: block;
		padding: 8px 9px;
	}
	body.pb-practice .pbRoomLearning ol {
		justify-content: space-between;
		gap: 0;
	}
	body.pb-practice .pbRoomLearning li {
		gap: 3px;
		padding: 0;
		font-size: 11px;
	}
	body.pb-practice .pbRoomLearning li > button {
		min-height: 34px;
		padding: 0 4px;
	}
	body.pb-practice .pbRoomLearning li + li::before {
		margin-right: 1px;
	}
	body.pb-practice .pbRoomLearning p {
		margin-top: 6px;
		font-size: 11px;
		text-align: left;
	}
	body.pb-practice #pbPractice .pbPracCard.pbPracNotesCard,
	body.pb-practice #pbPracMinus,
	body.pb-practice .pbRoomKitDock {
		border-radius: 16px !important;
	}
	body.pb-practice #pbPractice .pbPracCardHd {
		min-height: 50px;
		padding: 9px 12px !important;
	}
	body.pb-practice #pbPractice .pbPracCardHd b {
		font-size: 14px;
	}
	body.pb-practice #pbPractice .pbPracCardHd small {
		font-size: 10px;
	}
	body.pb-practice .pbRoomPlayer {
		grid-template-columns: minmax(0, 1fr) auto;
		gap: 8px;
		padding: 10px;
	}
	body.pb-practice .pbRoomPlayer .pbPracMinusPlay {
		grid-column: 1 / -1 !important;
		width: 100% !important;
		height: 58px !important;
		min-width: 0;
	}
	body.pb-practice .pbRoomPlayer .pbPracMinusMeta {
		grid-column: 1 !important;
		grid-row: 2 !important;
	}
	body.pb-practice .pbRoomPlayer .pbPracTimeline {
		grid-column: 1 / -1 !important;
		grid-row: 3 !important;
	}
	body.pb-practice .pbRoomPlayer .pbPracMinusSpeed {
		grid-column: 1 / -1 !important;
		grid-row: 4 !important;
	}
	body.pb-practice .pbRoomPlayerControls {
		grid-column: 1 / -1 !important;
		grid-row: 5 !important;
		width: 100%;
	}
	body.pb-practice .pbRoomPlayerControls button {
		flex: 1 1 auto;
		padding: 0 8px;
	}
	body.pb-practice .pbRoomPlayerControls .pbRoomNextStep {
		flex: 0 0 100%;
		min-height: 36px;
		margin-left: 0;
	}
	body.pb-practice .pbRoomLower {
		margin-top: 10px;
		gap: 10px;
	}
	body.pb-practice .pbRoomKitDock,
	body.pb-practice .pbRoomKitDock #pbPracticeViz.pb-mobile-inline {
		min-height: 0 !important;
	}
	body.pb-practice #pbPracMinus {
		padding: 13px !important;
	}
	body.pb-practice #pbPracTrackSeg {
		grid-template-columns: 1fr !important;
	}
	body.pb-practice #pbPracTrackSeg .pbPracTrackBtn {
		display: grid !important;
		grid-template-columns: minmax(96px, auto) minmax(80px, 1fr);
		grid-template-rows: auto auto;
		min-height: 64px !important;
	}
	body.pb-practice #pbPracTrackSeg .pbRoomTrackStatus {
		grid-column: 2;
		grid-row: 1 / 3;
		align-self: center;
		justify-self: end;
		margin: 0;
		text-align: right;
	}
	body.pb-practice #pbPracticeViz.pb-mobile-inline .pbPracVizTitleHint {
		display: none !important;
	}
}

@media (max-width: 360px) {
	body.pb-practice .pbRoomSteps small {
		display: none;
	}
	body.pb-practice .pbRoomSteps > button {
		min-height: 54px;
	}
	body.pb-practice .pbRoomPlayerControls .pbRoomLoop span {
		display: none;
	}
}

@media (max-height: 430px) and (orientation: landscape) {
	body.pb-practice #pbPractice .pbPracBody {
		padding-top: 6px !important;
	}
	body.pb-practice #pbPractice .pbPracHero {
		min-height: 44px;
		margin-bottom: 7px;
	}
	body.pb-practice .pbRoomSteps {
		margin-bottom: 7px;
	}
	body.pb-practice .pbRoomSteps > button {
		min-height: 50px;
		padding-block: 6px;
	}
	body.pb-practice #pbPractice .pbPracCardHd {
		display: none !important;
	}
	body.pb-practice .pbRoomKitDock,
	body.pb-practice .pbRoomKitDock #pbPracticeViz.pb-mobile-inline {
		min-height: 0 !important;
	}
}

@media (prefers-reduced-motion: reduce) {
	body.pb-practice .pbRoomSteps > button,
	body.pb-practice .pb-room-loop-pulse,
	body.pb-practice #pbPractice .pbPracCurtainPanel,
	body.pb-practice #pbPractice .pbPracCurtainSeam {
		transition: none;
		animation: none;
	}
}

@media (max-width: 480px) {
	body.pb-practice #pbPracticeViz .pbPracVizCollapse {
		display: none !important;
	}
}

/* During a guided training session the learning sequence visually continues
   the compact trainer summary. Playback modes stay a quiet segmented control. */
body.pb-practice.pb-trainer-active .pbTrainerPanel.pbTrainerCompact {
	margin-bottom: 0;
	border-bottom-right-radius: 0;
	border-bottom-left-radius: 0;
}

body.pb-practice.pb-trainer-active .pbRoomSteps {
	box-sizing: border-box;
	gap: 4px;
	margin: 0 0 12px;
	padding: 4px;
	border: 1px solid var(--pb-room-border);
	border-radius: 14px;
	background: var(--pb-room-card);
	box-shadow: var(--pb-room-shadow);
}

body.pb-practice.pb-trainer-active .pbTrainerPanel.pbTrainerCompact + .pbRoomLearning {
	margin-bottom: 8px;
	border-top: 0;
	border-top-left-radius: 0;
	border-top-right-radius: 0;
	border-bottom-right-radius: 18px;
	border-bottom-left-radius: 18px;
}

body.pb-practice.pb-trainer-active .pbRoomSteps > button {
	display: flex;
	box-sizing: border-box;
	min-width: 0;
	min-height: 36px;
	align-items: center;
	gap: 8px;
	padding: 4px 10px;
	border: 0;
	border-radius: 10px;
	background: transparent;
	box-shadow: none;
	transform: none;
}

body.pb-practice.pb-trainer-active .pbRoomSteps > button:hover {
	border-color: transparent;
	background: var(--pb-room-card-soft);
	transform: none;
}

body.pb-practice.pb-trainer-active .pbRoomSteps > button > span {
	display: inline-flex;
	width: 24px;
	height: 24px;
	flex: 0 0 24px;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	font-size: 12px;
}

body.pb-practice.pb-trainer-active .pbRoomSteps b {
	overflow: hidden;
	font-size: 13px;
	line-height: 1;
	text-overflow: ellipsis;
	white-space: nowrap;
}

body.pb-practice.pb-trainer-active .pbRoomSteps small {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	border: 0;
	clip: rect(0 0 0 0);
	clip-path: inset(50%);
	white-space: nowrap;
}

body.pb-practice.pb-trainer-active .pbRoomSteps > button.pb-room-step-active {
	border-color: transparent;
	background: var(--pb-room-accent-soft);
	box-shadow: none;
}

@media (max-width: 720px) {
	body.pb-practice.pb-trainer-active .pbRoomSteps {
		gap: 3px;
		margin-bottom: 10px;
		padding: 3px;
		border-bottom-right-radius: 16px;
		border-bottom-left-radius: 16px;
	}

	body.pb-practice.pb-trainer-active .pbRoomSteps > button {
		min-height: 44px;
		padding-inline: 8px;
		border-radius: 11px;
	}
}

@media (max-width: 360px) {
	body.pb-practice.pb-trainer-active .pbRoomSteps > button {
		min-height: 42px;
		gap: 6px;
		padding-inline: 6px;
	}

	body.pb-practice.pb-trainer-active .pbRoomSteps b {
		font-size: 12px;
	}
}

/* Unified learning toolbar: stage, learning order and playback live in one
   compact surface. The notation sheet starts immediately below it. */
body.pb-practice .pbRoomTopPanel {
	position: relative;
	box-sizing: border-box;
	margin: 0 0 12px;
	overflow: hidden;
	border: 1px solid var(--pb-room-border);
	border-radius: 18px;
	background: var(--pb-room-card);
	box-shadow: var(--pb-room-shadow);
}

body.pb-practice .pbRoomTopPanel > .pbTrainerPanel.pbTrainerCompact {
	margin: 0;
	border: 0;
	border-radius: 0;
	background: transparent;
	box-shadow: none;
}

body.pb-practice .pbRoomTopPanel > .pbRoomSession {
	width: fit-content;
	min-height: 28px;
	margin: -5px 14px 7px auto;
	padding: 0;
	border: 0;
	background: transparent;
}

body.pb-practice .pbTrainerSummaryMeta > .pbRoomSession {
	display: inline-flex;
	flex: 0 0 auto;
	min-height: 0;
	margin: 0 0 0 auto;
	padding: 0 0 0 8px;
	border: 0;
	border-radius: 0;
	background: transparent;
	color: var(--pb-room-accent);
	font-size: 12px;
	font-weight: 900;
	font-variant-numeric: tabular-nums;
	letter-spacing: .01em;
	white-space: nowrap;
}

body.pb-practice .pbTrainerSummaryMeta > .pbRoomSession::before {
	width: auto;
	height: auto;
	margin-right: 5px;
	background: transparent;
	content: "◷";
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI Symbol", sans-serif;
	font-size: 14px;
	font-weight: 800;
	line-height: 1;
}

body.pb-practice .pbTrainerSummaryMeta > .pbRoomSession button {
	display: none;
}

body.pb-practice .pbRoomTopPanel > .pbRoomSession button {
	display: none;
}

body.pb-practice .pbRoomTopPanel > .pbRoomLearning {
	margin: 0;
	padding: 8px 14px;
	border: 0;
	border-top: 1px solid var(--pb-room-border);
	border-bottom: 1px solid var(--pb-room-border);
	border-radius: 0;
	background: var(--pb-room-card-soft);
}

body.pb-practice .pbRoomTransport {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr);
	align-items: center;
	gap: 12px;
	padding: 10px 14px;
}

body.pb-practice .pbRoomTopPanel .pbRoomSteps {
	margin: 0;
	padding: 3px;
	border: 1px solid var(--pb-room-border);
	border-radius: 13px;
	background: var(--pb-room-card-soft);
	box-shadow: none;
}

body.pb-practice .pbRoomTopPanel .pbRoomSteps > button {
	min-height: 42px;
}

body.pb-practice .pbRoomTopPanel .pbRoomPlayer {
	display: grid;
	grid-template-columns: minmax(210px, 250px) minmax(150px, 1fr) auto;
	min-height: 0;
	gap: 12px;
	padding: 0;
	border: 0;
	background: transparent;
}

body.pb-practice .pbRoomTopPanel .pbRoomPlayer .pbPracMinusPlay {
	grid-column: 1 !important;
	grid-row: 1 !important;
	min-width: 0;
	height: 54px !important;
}

body.pb-practice .pbRoomTopPanel .pbRoomPlayer .pbPracMinusSpeed {
	grid-column: 2 !important;
	grid-row: 1 !important;
}

body.pb-practice .pbRoomTopPanel .pbRoomPlayerControls {
	grid-column: 3 !important;
	grid-row: 1 !important;
}

body.pb-practice .pbRoomTopPanel .pbRoomPlayerControls .pbRoomSpeedReset {
	min-width: 76px;
	min-height: 42px;
}

body.pb-practice #pbPractice .pbPracCardHd,
body.pb-practice #pbPracMinus .pbPracMinusMeta,
body.pb-practice #pbPracMinus .pbPracTimeline {
	display: none !important;
}

body.pb-practice #pbPractice .pbPracFrameWrap {
	border-radius: inherit;
}

@media (max-width: 860px) {
	body.pb-practice .pbRoomTransport {
		grid-template-columns: 1fr;
		gap: 9px;
	}

	body.pb-practice .pbRoomTopPanel .pbRoomSteps {
		width: fit-content;
	}
}

@media (min-width: 761px) and (max-width: 1023px) {
	body.pb-practice .pbRoomTopPanel > .pbTrainerPanel.pbTrainerCompact {
		grid-template-columns: minmax(230px, 1fr) auto auto;
		grid-template-areas:
			"summary tempo actions"
			"progress progress progress";
		gap: 8px 12px;
	}
}

@media (max-width: 720px) {
	body.pb-practice .pbRoomTopPanel {
		margin-bottom: 9px;
		border-radius: 16px;
	}

	body.pb-practice .pbRoomTopPanel > .pbRoomSession {
		margin-right: 11px;
	}

	body.pb-practice .pbRoomTopPanel > .pbRoomLearning {
		align-items: flex-start;
		gap: 7px;
		padding: 8px 11px;
	}

	body.pb-practice .pbRoomTransport {
		padding: 9px 11px 11px;
	}

	body.pb-practice .pbRoomTopPanel .pbRoomSteps {
		display: grid;
		grid-template-columns: 1fr 1fr;
		width: 100%;
	}

	body.pb-practice .pbRoomTopPanel .pbRoomPlayer {
		grid-template-columns: minmax(0, 1fr) auto;
		gap: 8px;
	}

	body.pb-practice .pbRoomTopPanel .pbRoomPlayer .pbPracMinusPlay {
		grid-column: 1 / -1 !important;
		grid-row: 1 !important;
		width: 100% !important;
		height: 56px !important;
	}

	body.pb-practice .pbRoomTopPanel .pbRoomPlayer .pbPracMinusSpeed {
		grid-column: 1 !important;
		grid-row: 2 !important;
	}

	body.pb-practice .pbRoomTopPanel .pbRoomPlayerControls {
		grid-column: 2 !important;
		grid-row: 2 !important;
		width: auto;
	}
}

/* The rehearsal room has one trainer header in every guided mode. Existing
   trainer nodes and handlers stay in place for state and accessibility. */
body.pb-practice.pb-trainer-unified-header .pbRoomTopPanel {
	display: grid;
	grid-template-columns: minmax(380px, 1fr) auto;
	grid-template-areas:
		"phases status"
		"transport transport";
	align-items: stretch;
}

body.pb-practice.pb-trainer-unified-header .pbRoomTopPanel > .pbRoomLearning {
	grid-area: phases;
	display: grid;
	align-content: center;
	align-items: stretch;
	gap: 6px;
	margin: 0;
	padding: 10px 14px;
	border: 0;
	border-radius: 0;
	background: transparent;
}

body.pb-practice.pb-trainer-unified-header .pbRoomLearningPart {
	display: block;
}

body.pb-practice.pb-trainer-unified-header .pbRoomLearning ol {
	display: grid;
	grid-template-columns: repeat(var(--pb-room-phase-count, 4), minmax(72px, 1fr));
	width: 100%;
	gap: 6px;
}

body.pb-practice.pb-trainer-unified-header .pbRoomLearning li {
	position: relative;
	display: block;
	min-width: 0;
	color: var(--pb-room-muted);
	font-size: 13px;
}

body.pb-practice.pb-trainer-unified-header .pbRoomLearning li[hidden] {
	display: none !important;
}

body.pb-practice.pb-trainer-unified-header .pbRoomLearning li + li::before {
	position: absolute;
	top: 50%;
	left: -7px;
	z-index: 2;
	margin: 0;
	padding: 1px;
	background: var(--pb-room-card);
	content: "›";
	font-size: 14px;
	line-height: 1;
	transform: translate(-50%, -50%);
}

body.pb-practice.pb-trainer-unified-header .pbRoomLearning li.pb-room-learning-first::before {
	display: none;
}

body.pb-practice.pb-trainer-unified-header .pbRoomLearning li > button {
	width: 100%;
	min-height: 44px;
	justify-content: center;
	padding: 0 10px;
	border: 1px solid var(--pb-room-border);
	border-radius: 12px;
	background: var(--pb-room-card-soft);
	font-size: inherit;
}

body.pb-practice.pb-trainer-unified-header .pbRoomLearning li > button:hover:not(:disabled) {
	border-color: color-mix(in srgb, var(--pb-room-accent) 45%, var(--pb-room-border));
}

body.pb-practice.pb-trainer-unified-header .pbRoomLearning li.pb-room-learning-active > button {
	border-color: var(--pb-room-accent);
	background: var(--pb-room-accent-soft);
	box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--pb-room-accent) 18%, transparent);
}

body.pb-practice.pb-trainer-unified-header .pbRoomLearning li.pb-room-learning-unavailable {
	opacity: .55;
}

body.pb-practice.pb-trainer-unified-header .pbRoomLearning p {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	border: 0;
	clip: rect(0 0 0 0);
	clip-path: inset(50%);
	white-space: nowrap;
}

body.pb-practice.pb-trainer-unified-header .pbRoomTopPanel > .pbTrainerPanel.pbTrainerUnifiedHeader {
	grid-area: status;
	display: grid;
	grid-template-columns: minmax(150px, auto) auto minmax(165px, auto);
	grid-template-areas: "summary tempo actions";
	align-items: center;
	justify-content: end;
	gap: 10px;
	min-height: 70px;
	margin: 0;
	padding: 9px 14px;
	overflow: visible;
	border: 0;
	border-left: 1px solid var(--pb-room-border);
	border-radius: 0;
}

body.pb-practice.pb-trainer-unified-header.pb-trainer-phase-route .pbTrainerUnifiedHeader .pbTrainerSummary {
	grid-area: summary;
	display: flex;
	min-width: 0;
	align-items: center;
}

body.pb-practice.pb-trainer-unified-header.pb-trainer-phase-route .pbTrainerUnifiedHeader .pbTrainerSummaryMeta {
	display: block;
	min-width: 0;
	overflow: visible;
}

body.pb-practice.pb-trainer-unified-header.pb-trainer-phase-route .pbTrainerUnifiedHeader .pbTrainerModeTitle,
body.pb-practice.pb-trainer-unified-header.pb-trainer-phase-route .pbTrainerUnifiedHeader .pbTrainerStageNo,
body.pb-practice.pb-trainer-unified-header.pb-trainer-phase-route .pbTrainerUnifiedHeader .pbTrainerSummary h2,
body.pb-practice.pb-trainer-unified-header.pb-trainer-phase-route .pbTrainerUnifiedHeader .pbTrainerRange {
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	margin: -1px !important;
	padding: 0 !important;
	overflow: hidden !important;
	border: 0 !important;
	clip: rect(0 0 0 0) !important;
	clip-path: inset(50%) !important;
	white-space: nowrap !important;
}

body.pb-practice.pb-trainer-unified-header .pbTrainerSummaryMeta > .pbRoomSession {
	display: inline-flex;
	min-width: 0;
	min-height: 44px;
	align-items: center;
	gap: 7px;
	margin: 0;
	padding: 0;
	overflow: visible;
	color: var(--pb-room-text);
}

body.pb-practice.pb-trainer-unified-header .pbTrainerSummaryMeta > .pbRoomSession::before {
	width: auto;
	height: auto;
	margin: 0;
	background: transparent;
	color: var(--pb-room-muted);
	content: "ТАЙМЕР";
	font-size: 9px;
	font-weight: 850;
	line-height: 1;
	letter-spacing: .08em;
}

body.pb-practice.pb-trainer-unified-header #pbRoomSessionText {
	display: inline-flex;
	align-items: baseline;
	gap: 5px;
	font-variant-numeric: tabular-nums;
	white-space: nowrap;
}

body.pb-practice.pb-trainer-unified-header #pbRoomSessionElapsed {
	color: var(--pb-room-accent);
	font-size: clamp(28px, 2.25vw, 34px);
	font-weight: 950;
	line-height: 1;
	letter-spacing: -.045em;
}

body.pb-practice.pb-trainer-unified-header #pbRoomSessionTarget {
	color: var(--pb-room-muted);
	font-size: 12px;
	font-weight: 800;
	line-height: 1;
}

body.pb-practice.pb-trainer-unified-header .pbTrainerUnifiedHeader > .pbTrainerTempo {
	grid-area: tempo;
	min-width: 104px;
	min-height: 44px;
	gap: 6px;
	padding: 6px 9px;
}

body.pb-practice.pb-trainer-unified-header .pbTrainerUnifiedHeader .pbTrainerTempo > b {
	font-size: 24px;
}

body.pb-practice.pb-trainer-unified-header .pbTrainerUnifiedHeader .pbTrainerTempo > span {
	font-size: 10px;
	text-transform: uppercase;
}

body.pb-practice.pb-trainer-unified-header .pbTrainerUnifiedHeader .pbTrainerTempo small {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	clip-path: inset(50%);
	white-space: nowrap;
}

body.pb-practice.pb-trainer-unified-header .pbTrainerUnifiedHeader > .pbTrainerActions {
	grid-area: actions;
	display: flex;
	justify-content: flex-end;
	margin: 0;
}

body.pb-practice.pb-trainer-unified-header .pbTrainerUnifiedHeader .pbTrainerActions .pbTrainerNext {
	min-height: 44px;
	margin: 0;
	padding-inline: 15px;
	border-color: color-mix(in srgb, var(--pb-room-accent) 55%, var(--pb-room-border));
	background: var(--pb-room-accent-soft);
	color: var(--pb-room-text);
	font-weight: 850;
}

body.pb-practice.pb-trainer-unified-header .pbTrainerUnifiedHeader .pbTrainerActions [data-trainer-action="pause"],
body.pb-practice.pb-trainer-unified-header .pbTrainerUnifiedHeader .pbTrainerActions .pbTrainerFinish,
body.pb-practice.pb-trainer-unified-header .pbTrainerUnifiedHeader > .pbTrainerMeters,
body.pb-practice.pb-trainer-unified-header .pbTrainerMobileNext.pb-show {
	display: none !important;
}

body.pb-practice.pb-trainer-unified-header.pb-trainer-phase-route .pbTrainerUnifiedHeader .pbTrainerActions [data-trainer-action="repeat"] {
	display: none !important;
}

body.pb-practice.pb-trainer-unified-header:not(.pb-trainer-phase-route) .pbRoomTopPanel {
	grid-template-columns: minmax(0, 1fr);
	grid-template-areas:
		"status"
		"transport";
}

body.pb-practice.pb-trainer-unified-header:not(.pb-trainer-phase-route) .pbRoomTopPanel > .pbTrainerPanel.pbTrainerUnifiedHeader {
	width: 100%;
	grid-template-columns: minmax(230px, 1fr) auto minmax(250px, auto);
	justify-content: stretch;
	border-left: 0;
}

body.pb-practice.pb-trainer-unified-header .pbRoomTransport {
	grid-area: transport;
	border-top: 1px solid var(--pb-room-border);
}

@media (max-width: 1023px) {
	body.pb-practice.pb-trainer-unified-header .pbRoomTopPanel {
		grid-template-columns: 1fr;
		grid-template-areas:
			"status"
			"phases"
			"transport";
	}

	body.pb-practice.pb-trainer-unified-header .pbRoomTopPanel > .pbTrainerPanel.pbTrainerUnifiedHeader {
		grid-template-columns: minmax(150px, 1fr) auto minmax(165px, auto);
		width: 100%;
		justify-content: stretch;
		border-left: 0;
		border-bottom: 1px solid var(--pb-room-border);
	}
}

@media (max-width: 720px) {
	body.pb-practice.pb-trainer-unified-header .pbRoomTopPanel > .pbTrainerPanel.pbTrainerUnifiedHeader {
		grid-template-columns: minmax(0, 1fr) auto;
		grid-template-areas:
			"summary tempo"
			"actions actions";
		gap: 8px 10px;
		padding: 9px 10px 10px;
	}

body.pb-practice.pb-trainer-unified-header .pbTrainerUnifiedHeader > .pbTrainerActions,
	body.pb-practice.pb-trainer-unified-header .pbTrainerUnifiedHeader .pbTrainerActions .pbTrainerNext {
		width: 100%;
	}

	body.pb-practice.pb-trainer-unified-header .pbRoomTopPanel > .pbRoomLearning {
		gap: 5px;
		padding: 7px 8px;
	}

	body.pb-practice.pb-trainer-unified-header .pbRoomLearningPart {
		padding-left: 2px;
		font-size: 13px;
	}

	body.pb-practice.pb-trainer-unified-header .pbRoomLearning ol {
		grid-template-columns: repeat(4, minmax(0, 1fr));
		gap: 3px;
	}

	body.pb-practice.pb-trainer-unified-header .pbRoomLearning li {
		font-size: 11px;
	}

	body.pb-practice.pb-trainer-unified-header .pbRoomLearning li + li::before {
		display: none;
	}

	body.pb-practice.pb-trainer-unified-header .pbRoomLearning li > button {
		min-height: 44px;
		padding: 0 3px;
		border-radius: 9px;
	}

	body.pb-practice.pb-trainer-unified-header #pbRoomSessionElapsed {
		font-size: 29px;
	}

	body.pb-practice.pb-trainer-unified-header .pbTrainerSummaryMeta > .pbRoomSession::before {
		display: none;
	}
}

/* Rehearsal source switch and current-fragment hierarchy. */
body.pb-practice #pbPractice .pbPracTitle {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
}

body.pb-practice #pbPractice .pbPracTitleMain {
	max-width: 100%;
	overflow: visible !important;
	font-size: clamp(22px, 2.35vw, 32px) !important;
	line-height: 1.12 !important;
	text-overflow: clip !important;
	text-wrap: balance;
	white-space: normal !important;
}

body.pb-practice #pbPractice .pbPracTitleMeta {
	display: block !important;
	order: -1;
	margin: 0 0 5px;
	color: var(--pb-room-muted);
	font-size: 10px;
	font-weight: 850;
	letter-spacing: .115em;
	line-height: 1.1;
	text-transform: uppercase;
}

body.pb-practice.pb-song-mode.pb-skin-light:not(.pb-admin) #pbPractice .pbPracTitleMeta {
	display: block !important;
}

body.pb-practice .pbRoomTopPanel .pbRoomSteps,
body.pb-practice.pb-trainer-active .pbRoomTopPanel .pbRoomSteps {
	display: block;
	width: auto;
	margin: 0;
	padding: 0;
	border: 0;
	background: transparent;
	box-shadow: none;
}

body.pb-practice .pbRoomModeSwitch {
	position: relative;
	display: grid;
	grid-template-columns: minmax(112px, 1fr) 48px minmax(104px, 1fr);
	align-items: center;
	gap: 9px;
	min-height: 48px;
	padding: 4px 10px;
	box-sizing: border-box;
	border: 1px solid var(--pb-room-border);
	border-radius: 14px;
	background: var(--pb-room-card-soft);
	color: var(--pb-room-muted);
	cursor: pointer;
	-webkit-tap-highlight-color: transparent;
}

body.pb-practice .pbRoomModeToggle {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	border: 0;
	opacity: 0;
	clip: rect(0 0 0 0);
	clip-path: inset(50%);
}

body.pb-practice .pbRoomModeLabel {
	font: 760 12px/1.15 -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	transition: color .18s ease, opacity .18s ease;
}

body.pb-practice .pbRoomModeLabel:first-child {
	text-align: right;
}

body.pb-practice .pbRoomModeLabel:last-child {
	text-align: left;
}

body.pb-practice .pbRoomModeLabel.pb-room-step-active {
	color: var(--pb-room-text);
	font-weight: 880;
}

body.pb-practice .pbRoomModeTrack {
	position: relative;
	display: block;
	grid-column: 2;
	width: 48px;
	height: 28px;
	border-radius: 999px;
	background: color-mix(in srgb, var(--pb-room-muted) 42%, var(--pb-room-card));
	box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--pb-room-muted) 22%, transparent);
	transition: background .2s ease, box-shadow .2s ease;
}

body.pb-practice .pbRoomModeThumb {
	position: absolute;
	top: 3px;
	left: 3px;
	width: 22px;
	height: 22px;
	border-radius: 50%;
	background: #fff;
	box-shadow: 0 2px 6px rgba(0, 0, 0, .28);
	transition: transform .22s cubic-bezier(.22, .8, .3, 1);
}

body.pb-practice .pbRoomModeToggle:checked + .pbRoomModeTrack {
	background: var(--pb-room-accent);
	box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--pb-room-accent) 72%, #000);
}

body.pb-practice .pbRoomModeToggle:checked + .pbRoomModeTrack .pbRoomModeThumb {
	transform: translateX(20px);
}

body.pb-practice .pbRoomModeToggle:focus-visible + .pbRoomModeTrack {
	outline: 3px solid color-mix(in srgb, var(--pb-room-accent) 38%, transparent);
	outline-offset: 3px;
}

body.pb-practice .pbRoomModeSwitch:hover .pbRoomModeTrack {
	box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--pb-room-accent) 48%, transparent), 0 3px 10px rgba(0, 0, 0, .1);
}

body.pb-practice .pb-room-mode-no-recording .pbRoomModeLabel:last-child {
	opacity: .52;
}

body.pb-practice .pbRoomKitMode {
	position: relative;
	z-index: 3;
	flex: 0 0 auto;
	padding: 6px 10px 8px;
	border-bottom: 1px solid var(--pb-room-border);
	background: var(--pb-room-card);
}

body.pb-practice .pbRoomModeSwitchKit {
	grid-template-columns: minmax(92px, 1fr) 40px minmax(88px, 1fr);
	gap: 7px;
	min-height: 38px;
	padding: 2px 8px;
	border-radius: 11px;
}

body.pb-practice .pbRoomModeSwitchKit .pbRoomModeLabel {
	font-size: 10px;
}

body.pb-practice .pbRoomModeSwitchKit .pbRoomModeTrack {
	width: 40px;
	height: 24px;
}

body.pb-practice .pbRoomModeSwitchKit .pbRoomModeThumb {
	top: 3px;
	left: 3px;
	width: 18px;
	height: 18px;
}

body.pb-practice .pbRoomModeSwitchKit .pbRoomModeToggle:checked + .pbRoomModeTrack .pbRoomModeThumb {
	transform: translateX(16px);
}

body.pb-practice #pbPracticeViz.pb-collapsed .pbRoomKitMode {
	display: none;
}

body.pb-practice #pbPracticeViz .pbPracVizStage {
	cursor: pointer;
	touch-action: manipulation;
}

body.pb-practice .pbRoomPlayer #pbPracMinusSpeed {
	-webkit-appearance: none;
	appearance: none;
	height: 28px;
	padding: 0;
	background: transparent;
}

body.pb-practice .pbRoomPlayer #pbPracMinusSpeed::-webkit-slider-runnable-track {
	height: 6px;
	border-radius: 999px;
	background: color-mix(in srgb, var(--pb-room-muted) 28%, var(--pb-room-card));
}

body.pb-practice .pbRoomPlayer #pbPracMinusSpeed::-webkit-slider-thumb {
	-webkit-appearance: none;
	appearance: none;
	width: 22px;
	height: 22px;
	margin-top: -8px;
	border: 3px solid var(--pb-room-card);
	border-radius: 50%;
	background: var(--pb-room-accent);
	box-shadow: 0 2px 7px rgba(0, 0, 0, .26);
}

body.pb-practice .pbRoomPlayer #pbPracMinusSpeed::-moz-range-track {
	height: 6px;
	border: 0;
	border-radius: 999px;
	background: color-mix(in srgb, var(--pb-room-muted) 28%, var(--pb-room-card));
}

body.pb-practice .pbRoomPlayer #pbPracMinusSpeed::-moz-range-progress {
	height: 6px;
	border-radius: 999px;
	background: var(--pb-room-accent);
}

body.pb-practice .pbRoomPlayer #pbPracMinusSpeed::-moz-range-thumb {
	width: 16px;
	height: 16px;
	border: 3px solid var(--pb-room-card);
	border-radius: 50%;
	background: var(--pb-room-accent);
	box-shadow: 0 2px 7px rgba(0, 0, 0, .26);
}

@media (max-width: 860px) {
	body.pb-practice .pbRoomTopPanel .pbRoomSteps {
		width: 100%;
	}
}

@media (max-width: 720px) {
	body.pb-practice #pbPractice .pbPracTitleMain {
		font-size: clamp(18px, 5.4vw, 23px) !important;
	}

	body.pb-practice #pbPractice .pbPracTitleMeta {
		font-size: 9px;
	}

	body.pb-practice .pbRoomModeSwitchMain {
		grid-template-columns: minmax(92px, 1fr) 44px minmax(86px, 1fr);
		gap: 7px;
		min-height: 50px;
		padding-inline: 8px;
	}

	body.pb-practice .pbRoomModeSwitchMain .pbRoomModeLabel {
		font-size: 11px;
	}

	body.pb-practice .pbRoomModeSwitchMain .pbRoomModeTrack {
		width: 44px;
		height: 26px;
	}

	body.pb-practice .pbRoomModeSwitchMain .pbRoomModeThumb {
		width: 20px;
		height: 20px;
	}

	body.pb-practice .pbRoomModeSwitchMain .pbRoomModeToggle:checked + .pbRoomModeTrack .pbRoomModeThumb {
		transform: translateX(18px);
	}
}

@media (max-width: 1023px) {
	body.pb-practice #pbPractice .pbPracHero {
		min-height: 62px !important;
		height: auto !important;
	}
}

@media (max-width: 360px) {
	body.pb-practice .pbRoomModeSwitchMain .pbRoomModeLabel,
	body.pb-practice .pbRoomModeSwitchKit .pbRoomModeLabel {
		font-size: 9.5px;
	}

	body.pb-practice .pbRoomKitMode {
		padding-inline: 6px;
	}
}