body.home-page.drumix-home-v2 {
	--home-orange:#ff6200;
	--home-orange-hover:#ff751f;
	--home-bg:#f6f7f8;
	--home-surface:#ffffff;
	--home-soft:#eef0f2;
	--home-line:rgba(20,22,25,.13);
	--home-ink:#131518;
	--home-muted:#6b717b;
	--home-shadow:0 20px 48px rgba(28,31,35,.12);
	min-width:320px;
	min-height:100vh;
	margin:0;
	overflow-x:hidden;
	background:var(--home-bg);
	color:var(--home-ink);
	font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",system-ui,sans-serif;
	-webkit-font-smoothing:antialiased;
}

.home-discover{margin:34px 0 10px;padding:clamp(24px,4vw,42px);border:1px solid var(--home-line);border-radius:24px;background:var(--home-card)}
.home-discover h2{margin:8px 0 10px;font-size:clamp(26px,4vw,40px);line-height:1.08;letter-spacing:-.03em}
.home-discover>p:not(.home-eyebrow){margin:0;color:var(--home-sub);font-size:16px}
.home-discover-links{display:flex;flex-wrap:wrap;gap:9px;margin-top:22px}
.home-discover-links a{min-height:44px;display:inline-flex;align-items:center;padding:10px 14px;border-radius:11px;background:var(--home-soft);color:var(--home-ink);font-weight:700;text-decoration:none}

html.pb-public-dark body.home-page.drumix-home-v2 {
	--home-bg:#080a0c;
	--home-surface:#111418;
	--home-soft:#181b1f;
	--home-line:rgba(255,255,255,.13);
	--home-ink:#f7f7f8;
	--home-muted:#a7abb3;
	--home-shadow:0 22px 56px rgba(0,0,0,.42);
}

body.home-page.drumix-home-v2 *,
body.home-page.drumix-home-v2 *::before,
body.home-page.drumix-home-v2 *::after {
	box-sizing:border-box;
}

body.home-page.drumix-home-v2 a {
	color:inherit;
	text-decoration:none;
}

body.home-page.drumix-home-v2 button {
	font:inherit;
}

.home-noscript {
	position:relative;
	z-index:2000;
	padding:10px 18px;
	border-bottom:1px solid var(--home-line);
	background:#fff1e8;
	color:#342118;
	text-align:center;
	font-size:14px;
}

.home-noscript a {
	font-weight:800;
	text-decoration:underline;
}

.home-top {
	position:sticky;
	z-index:1000;
	top:0;
	height:78px;
	border-bottom:1px solid var(--home-line);
	background:color-mix(in srgb,var(--home-bg) 94%,transparent);
	-webkit-backdrop-filter:blur(18px);
	backdrop-filter:blur(18px);
}

.home-top-in {
	width:min(1480px,calc(100% - 56px));
	height:100%;
	margin:0 auto;
	display:grid;
	grid-template-columns:260px minmax(430px,1fr) auto;
	align-items:center;
	gap:22px;
}

.home-logo {
	width:205px;
	height:54px;
	display:flex;
	align-items:center;
	overflow:hidden;
}

.home-logo img {
	display:block;
	width:100%;
	height:auto;
	object-fit:contain;
}

.home-logo-light {
	display:block!important;
}

.home-logo-dark {
	display:none!important;
}

html.pb-public-dark .home-logo-light {
	display:none!important;
}

html.pb-public-dark .home-logo-dark {
	display:block!important;
}

.home-links {
	min-width:0;
	display:flex;
	align-items:center;
	justify-content:center;
	gap:clamp(24px,3.2vw,56px);
}

.home-links a {
	min-height:44px;
	display:inline-flex;
	align-items:center;
	color:var(--home-ink);
	font-size:16px;
	font-weight:720;
	white-space:nowrap;
	transition:color .18s ease;
}

.home-links a:hover {
	color:var(--home-orange);
}

.home-actions {
	display:flex;
	align-items:center;
	justify-content:flex-end;
	gap:10px;
}

.home-search,
.home-login,
.home-register {
	min-height:44px;
	display:inline-flex;
	align-items:center;
	justify-content:center;
	border-radius:11px;
	font-size:15px;
	font-weight:760;
	white-space:nowrap;
}

.home-search {
	order:1;
	gap:7px;
	padding:0 8px;
}

.home-search svg {
	width:18px;
	height:18px;
}

.home-login {
	order:3;
	min-width:90px;
	padding:0 20px;
	border:1px solid var(--home-line);
	background:color-mix(in srgb,var(--home-surface) 54%,transparent);
}

.home-register {
	order:4;
	min-width:205px;
	padding:0 23px;
	border:1px solid var(--home-orange);
	background:var(--home-orange);
	color:#fff!important;
	box-shadow:0 12px 26px rgba(255,98,0,.16);
}

.home-register[hidden],
.home-mobile-panel [hidden] {
	display:none!important;
}

.home-login:hover {
	background:var(--home-soft);
}

.home-register:hover {
	border-color:var(--home-orange-hover);
	background:var(--home-orange-hover);
}

.home-actions .pbPublicThemeToggle {
	position:relative!important;
	order:2;
	width:68px!important;
	min-width:68px!important;
	height:44px!important;
	min-height:44px!important;
	margin:0!important;
	padding:0!important;
	overflow:hidden;
	border:1px solid var(--home-line)!important;
	border-radius:22px!important;
	background:color-mix(in srgb,var(--home-surface) 72%,transparent)!important;
	color:var(--home-ink)!important;
	box-shadow:none!important;
	cursor:pointer;
}

.home-actions .pbPublicThemeToggle .pbPublicThemeText,
.home-actions .pbPublicThemeToggle .pbPublicThemeIcon {
	position:absolute;
	top:50%;
	transform:translateY(-50%);
}

.home-actions .pbPublicThemeToggle .pbPublicThemeText {
	left:10px;
	width:18px;
	overflow:hidden;
	font-size:0;
}

.home-actions .pbPublicThemeToggle .pbPublicThemeIcon {
	left:10px;
	width:18px;
	height:18px;
}

.home-actions .pbPublicThemeToggle::before {
	content:"";
	position:absolute;
	z-index:2;
	top:6px;
	left:35px;
	width:30px;
	height:30px;
	border-radius:50%;
	background:var(--home-ink);
	transition:transform .18s ease;
}

.home-actions .pbPublicThemeToggle::after {
	content:"";
	position:absolute;
	z-index:3;
	top:13px;
	right:10px;
	width:12px;
	height:12px;
	border-radius:50%;
	box-shadow:-4px 0 0 var(--home-bg);
}

html.pb-public-dark .home-actions .pbPublicThemeToggle::before {
	transform:translateX(-29px);
}

html.pb-public-dark .home-actions .pbPublicThemeToggle::after {
	box-shadow:-4px 0 0 var(--home-bg);
}

.home-menu-toggle {
	display:none;
}

.home-mobile-panel[hidden] {
	display:none!important;
}

.home-mobile-panel {
	position:absolute;
	top:70px;
	left:14px;
	right:14px;
	z-index:1010;
	padding:8px;
	border:1px solid var(--home-line);
	border-radius:18px;
	background:var(--home-surface);
	box-shadow:var(--home-shadow);
}

.home-mobile-panel > a,
.home-mobile-account a {
	min-height:48px;
	padding:0 14px;
	display:flex;
	align-items:center;
	border-radius:12px;
	font-size:15px;
	font-weight:720;
}

.home-mobile-panel > a:hover,
.home-mobile-account a:hover {
	background:var(--home-soft);
}

.home-mobile-account {
	margin-top:6px;
	padding-top:6px;
	display:grid;
	grid-template-columns:1fr 1fr;
	gap:7px;
	border-top:1px solid var(--home-line);
}

.home-mobile-account a {
	justify-content:center;
	border:1px solid var(--home-line);
}

.home-mobile-account .home-mobile-register {
	border-color:var(--home-orange);
	background:var(--home-orange);
	color:#fff;
}

.home-shell {
	width:min(1480px,calc(100% - 56px));
	margin:0 auto;
}

.home-hero {
	min-height:540px;
	display:grid;
	grid-template-columns:minmax(0,48%) minmax(0,52%);
	grid-template-areas:"copy media";
	align-items:stretch;
}

.home-hero-copy {
	grid-area:copy;
	min-width:0;
	padding:38px 36px 36px 8px;
	display:flex;
	flex-direction:column;
	justify-content:center;
}

.home-eyebrow {
	margin:0 0 20px;
	display:flex;
	align-items:center;
	gap:10px;
	color:var(--home-muted);
	font-size:13px;
	font-weight:820;
	letter-spacing:.055em;
	line-height:1.35;
	text-transform:uppercase;
}

.home-eyebrow-icon {
	flex:0 0 24px;
	width:24px;
	height:24px;
	display:grid;
	place-items:center;
	border-radius:7px;
	background:rgba(255,98,0,.1);
	color:var(--home-orange);
}

.home-eyebrow-icon svg {
	width:14px;
	height:14px;
}

.home-hero h1 {
	max-width:690px;
	margin:0;
	color:var(--home-ink);
	font-size:clamp(48px,4.25vw,66px);
	font-weight:850;
	letter-spacing:-.052em;
	line-height:.99;
	text-wrap:balance;
}

.home-hero-lead {
	max-width:630px;
	margin:23px 0 0;
	color:var(--home-muted);
	font-size:20px;
	line-height:1.48;
}

.home-hero-actions {
	max-width:690px;
	margin-top:29px;
	display:grid;
	grid-template-columns:minmax(0,1.14fr) minmax(0,1fr);
	gap:15px;
}

.home-button {
	min-width:0;
	min-height:56px;
	padding:0 28px;
	display:flex;
	align-items:center;
	justify-content:center;
	gap:16px;
	border:1px solid var(--home-line);
	border-radius:13px;
	font-size:16px;
	font-weight:820;
	line-height:1.15;
	text-align:left;
	transition:transform .18s ease,background .18s ease,border-color .18s ease;
}

.home-button:hover {
	transform:translateY(-1px);
}

.home-button.primary {
	justify-content:space-between;
	border-color:var(--home-orange);
	background:var(--home-orange);
	color:#fff;
	box-shadow:0 18px 34px rgba(255,98,0,.17);
}

.home-button.primary:hover {
	border-color:var(--home-orange-hover);
	background:var(--home-orange-hover);
}

.home-button.primary svg {
	flex:0 0 22px;
	transform:rotate(180deg);
}

.home-button.secondary {
	background:color-mix(in srgb,var(--home-surface) 58%,transparent);
	color:var(--home-ink);
}

.home-button.secondary:hover {
	background:var(--home-soft);
}

.home-free-note {
	margin-top:24px;
	display:flex;
	align-items:center;
	gap:13px;
}

.home-free-icon {
	flex:0 0 40px;
	width:40px;
	height:40px;
	display:grid;
	place-items:center;
	border:1px solid color-mix(in srgb,var(--home-orange) 68%,var(--home-line));
	border-radius:11px;
	background:rgba(255,98,0,.07);
	font-size:20px;
}

.home-free-note p,
.home-free-note strong,
.home-free-note small {
	display:block;
}

.home-free-note p {
	min-width:0;
	margin:0;
}

.home-free-note strong {
	color:var(--home-ink);
	font-size:15px;
	line-height:1.2;
}

.home-free-note small {
	margin-top:3px;
	color:var(--home-muted);
	font-size:12px;
	line-height:1.35;
}

.home-hero-media {
	position:relative;
	grid-area:media;
	min-width:0;
	height:478px;
	margin:30px 0 32px;
	overflow:hidden;
	border:1px solid var(--home-line);
	border-radius:28px;
	background:#0a0c0e;
	box-shadow:0 18px 46px rgba(15,18,22,.12);
}

.home-hero-photo {
	position:absolute;
	inset:0;
	display:block;
	width:100%;
	height:100%;
	object-fit:cover;
	object-position:58% 48%;
}

.home-hero-media::before {
	content:"";
	position:absolute;
	z-index:1;
	inset:0;
	background:
		linear-gradient(90deg,rgba(8,10,12,.3) 0%,transparent 37%),
		linear-gradient(180deg,transparent 58%,rgba(8,10,12,.88) 100%);
	pointer-events:none;
}

html:not(.pb-public-dark) .home-hero-media::after {
	content:"";
	position:absolute;
	z-index:2;
	inset:0;
	background:
		linear-gradient(90deg,rgba(246,247,248,.82) 0%,transparent 31%),
		linear-gradient(180deg,transparent 62%,rgba(246,247,248,.96) 100%);
	pointer-events:none;
}

html.pb-public-dark .home-hero-media {
	border-color:transparent;
	border-radius:0;
	background:var(--home-bg);
	box-shadow:none;
	-webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 18%,#000 100%);
	mask-image:linear-gradient(90deg,transparent 0%,#000 18%,#000 100%);
}

.home-rehearsal-screen {
	position:absolute;
	z-index:3;
	right:-1.5%;
	bottom:17px;
	width:52%;
	margin:0;
	overflow:hidden;
	border:1px solid rgba(255,255,255,.17);
	border-radius:18px;
	background:#080b0f;
	box-shadow:0 22px 48px rgba(0,0,0,.48);
	transform:perspective(900px) rotateY(-2deg);
	transform-origin:right center;
}

.home-rehearsal-screen img {
	display:block;
	width:100%;
	height:auto;
	aspect-ratio:16/9;
	object-fit:cover;
}

.home-popular {
	padding:27px 8px 24px;
	border-top:1px solid var(--home-line);
}

.home-popular-head {
	margin-bottom:18px;
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:18px;
}

.home-popular h2 {
	margin:0;
	color:var(--home-ink);
	font-size:30px;
	font-weight:840;
	letter-spacing:-.035em;
	line-height:1.1;
}

.home-popular-all {
	min-height:44px;
	display:inline-flex;
	align-items:center;
	gap:5px;
	color:var(--home-muted);
	font-size:14px;
	font-weight:720;
	white-space:nowrap;
}

.home-popular-all:hover {
	color:var(--home-orange);
}

.home-popular-status {
	min-height:230px;
	margin:0;
	display:grid;
	place-items:center;
	color:var(--home-muted);
	text-align:center;
}

.home-popular-status[hidden] {
	display:none!important;
}

.home-preview-status {
	position:absolute!important;
	width:1px!important;
	height:1px!important;
	padding:0!important;
	margin:-1px!important;
	overflow:hidden!important;
	clip:rect(0,0,0,0)!important;
	white-space:nowrap!important;
	border:0!important;
}

.home-song-list {
	min-width:0;
	display:block;
}

.home-catalog-columns,
.home-song {
	min-width:0;
	display:grid;
	grid-template-columns:minmax(360px,2.15fr) minmax(180px,1fr) 160px 64px;
	align-items:center;
	column-gap:20px;
}

.home-catalog-columns {
	min-height:48px;
	padding:0 12px;
	border-top:1px solid var(--home-line);
	border-bottom:1px solid var(--home-line);
	color:var(--home-muted);
	font-size:13px;
}

.home-catalog-columns span:last-child {
	text-align:center;
}

.home-song {
	position:relative;
	min-height:102px;
	padding:11px 12px;
	border-bottom:1px solid var(--home-line);
	transition:background-color .16s ease;
}

.home-song:hover {
	background:color-mix(in srgb,var(--home-soft) 70%,transparent);
}

.home-song.is-drumix-gift {
	background:linear-gradient(90deg,color-mix(in srgb,var(--drumix-color-success-soft) 72%,transparent),transparent 72%);
	box-shadow:inset 3px 0 var(--drumix-color-success);
}

.home-song.is-drumix-gift:hover {
	background:linear-gradient(90deg,color-mix(in srgb,var(--drumix-color-success-soft) 94%,transparent),color-mix(in srgb,var(--home-soft) 45%,transparent));
}

html.pb-public-dark .home-song.is-drumix-gift {
	background:linear-gradient(90deg,rgba(48,209,88,.09),transparent 72%);
	box-shadow:inset 3px 0 #30d158;
}

html.pb-public-dark .home-song.is-drumix-gift:hover {
	background:linear-gradient(90deg,rgba(48,209,88,.14),color-mix(in srgb,var(--home-soft) 34%,transparent));
}

.home-song-primary {
	min-width:0;
	display:grid;
	grid-template-columns:76px minmax(0,1fr);
	align-items:center;
	gap:16px;
}

.home-song-info {
	min-width:0;
}

.home-song-cover-wrap {
	position:relative;
	width:76px;
	height:76px;
	overflow:hidden;
	border:1px solid var(--home-line);
	border-radius:11px;
	background:linear-gradient(145deg,#2f3948,#12161d);
}

.home-song-cover-wrap.tone-1 {
	background:linear-gradient(145deg,#3f302e,#151211);
}

.home-song-cover-wrap.tone-2 {
	background:linear-gradient(145deg,#243b37,#101917);
}

.home-song-cover-wrap.tone-3 {
	background:linear-gradient(145deg,#382e47,#15111c);
}

.home-song-cover-wrap.tone-4 {
	background:linear-gradient(145deg,#41351d,#18140b);
}

.home-song-cover {
	position:absolute;
	inset:0;
	display:block;
}

.home-song-cover img {
	display:block;
	width:100%;
	height:100%;
	object-fit:cover;
	transition:transform .22s ease;
}

.home-song:hover .home-song-cover img {
	transform:scale(1.035);
}

.home-song-cover-fallback {
	position:absolute;
	inset:0;
	display:grid;
	place-items:center;
	color:#fff;
	font-size:28px;
	font-weight:850;
}

.home-song-cover-fallback[hidden] {
	display:none!important;
}

.home-song-play {
	position:absolute;
	z-index:4;
	right:5px;
	bottom:5px;
	width:34px;
	height:34px;
	display:grid;
	place-items:center;
	border:1px solid rgba(255,255,255,.65);
	border-radius:50%;
	background:rgba(9,12,16,.84);
	color:#fff!important;
	font:inherit;
	cursor:pointer;
	appearance:none;
	-webkit-appearance:none;
	-webkit-backdrop-filter:blur(8px);
	backdrop-filter:blur(8px);
}

.home-song-play:hover,
.home-song-play.is-playing {
	background:var(--home-orange);
}

.home-song-play.is-loading svg {
	animation:home-preview-pulse .8s ease-in-out infinite alternate;
}

.home-song-play.is-error {
	background:#8f2d25;
}

.home-song-play svg {
	width:17px;
	height:17px;
	margin-left:1px;
}

.home-song-play.is-playing svg {
	margin-left:0;
}

@keyframes home-preview-pulse {
	to { opacity:.35; transform:scale(.8); }
}

.home-song-copy {
	min-width:0;
	display:block;
}

.home-song-copy strong {
	display:block;
	overflow:hidden;
	color:var(--home-ink);
	text-overflow:ellipsis;
	white-space:nowrap;
	font-size:18px;
	font-weight:800;
	line-height:1.25;
}

.home-song-gift {
	max-width:100%;
	min-height:24px;
	margin-top:7px;
	padding:4px 7px;
	display:inline-flex;
	align-items:center;
	flex-wrap:wrap;
	gap:5px;
	border:1px solid color-mix(in srgb,var(--drumix-color-success) 35%,var(--home-line));
	border-radius:8px;
	background:color-mix(in srgb,var(--drumix-color-success-soft) 88%,var(--home-surface));
	color:var(--drumix-color-success);
	font-size:11px;
	font-weight:780;
	line-height:1.15;
}

.home-song-gift-mark {
	font-size:12px;
	line-height:1;
}

.home-song-gift strong {
	display:inline-flex;
	align-items:center;
	min-height:17px;
	padding-left:5px;
	border-left:1px solid color-mix(in srgb,var(--drumix-color-success) 32%,transparent);
	color:inherit;
	font-size:9px;
	font-weight:860;
	letter-spacing:.035em;
	line-height:1;
	text-transform:uppercase;
}

html.pb-public-dark .home-song-gift {
	border-color:rgba(48,209,88,.3);
	background:rgba(48,209,88,.12);
	color:#75e59b;
}

html.pb-public-dark .home-song-gift strong {
	border-left-color:rgba(117,229,155,.3);
}

.home-song-artist {
	min-width:0;
	overflow:hidden;
	color:var(--home-ink);
	text-overflow:ellipsis;
	white-space:nowrap;
	font-size:16px;
	line-height:1.35;
}

.home-song-difficulty {
	display:flex;
	align-items:center;
	gap:6px;
}

.home-song-difficulty.is-empty {
	color:var(--home-muted);
	font-size:14px;
}

.home-song-difficulty i {
	width:9px;
	height:9px;
	border-radius:50%;
	background:color-mix(in srgb,var(--home-muted) 28%,transparent);
}

.home-song-difficulty i.is-filled {
	background:var(--home-orange);
}

.home-song-mobile-meta {
	display:none;
}

.home-song-favorite {
	width:48px;
	height:48px;
	display:grid;
	place-items:center;
	justify-self:center;
	border:0;
	border-radius:50%;
	background:var(--home-surface);
	color:var(--home-muted);
	box-shadow:0 8px 22px rgba(18,22,28,.09);
	cursor:pointer;
	appearance:none;
	-webkit-appearance:none;
	transition:color .16s ease,background-color .16s ease,transform .16s ease;
}

html.pb-public-dark .home-song-favorite {
	background:color-mix(in srgb,var(--home-surface) 88%,#fff 4%);
	box-shadow:0 8px 24px rgba(0,0,0,.24);
}

.home-song-favorite:hover {
	color:var(--home-orange);
	transform:translateY(-1px);
}

.home-song-favorite.is-active {
	color:var(--home-orange);
}

.home-song-favorite.is-active svg {
	fill:currentColor;
}

.home-song-favorite:disabled {
	opacity:.55;
	cursor:wait;
	transform:none;
}

.home-song-favorite svg {
	width:24px;
	height:24px;
}

.home-catalog {
	scroll-margin-top:96px;
	padding-top:34px;
	padding-bottom:44px;
}

.home-catalog .home-popular-head {
	align-items:flex-end;
	margin-bottom:24px;
}

.home-catalog-search {
	width:min(760px,100%);
	margin:0 0 24px!important;
}

.home-catalog-search .cat-search-label {
	font-size:13px!important;
}

.home-catalog-search input[type="search"] {
	-webkit-appearance:none;
	appearance:none;
}

.home-catalog-search input[type="search"]::-webkit-search-cancel-button,
.home-catalog-search input[type="search"]::-webkit-search-decoration {
	display:none;
	-webkit-appearance:none;
	appearance:none;
}

.home-catalog-lead {
	max-width:720px;
	margin:10px 0 0;
	color:var(--home-muted);
	font-size:15px;
	line-height:1.5;
}

.home-menu-toggle:focus-visible,
.home-logo:focus-visible,
.home-links a:focus-visible,
.home-search:focus-visible,
.home-login:focus-visible,
.home-register:focus-visible,
.home-mobile-panel a:focus-visible,
.home-actions .pbPublicThemeToggle:focus-visible,
.home-button:focus-visible,
.home-popular-all:focus-visible,
.home-catalog-search .cat-search-clear:focus-visible,
.home-song-cover:focus-visible,
.home-song-play:focus-visible,
.home-song-copy:focus-visible,
.home-song-favorite:focus-visible {
	outline:3px solid var(--drumix-color-focus)!important;
	outline-offset:3px!important;
}

@media (max-width:1320px) {
	.home-top-in,
	.home-shell {
		width:calc(100% - 40px);
	}

	.home-top-in {
		grid-template-columns:205px minmax(390px,1fr) auto;
		gap:14px;
	}

	.home-logo {
		width:178px;
	}

	.home-links {
		gap:22px;
	}

	.home-links a {
		font-size:15px;
	}

	.home-search span {
		display:none;
	}

	.home-search {
		width:44px;
		padding:0;
	}

	.home-login {
		min-width:80px;
		padding:0 15px;
	}

	.home-register {
		min-width:178px;
		padding:0 18px;
	}

	.home-hero-copy {
		padding-right:28px;
	}

	.home-hero h1 {
		font-size:clamp(46px,4.5vw,59px);
	}

	.home-hero-lead {
		font-size:18px;
	}

	.home-button {
		padding-left:21px;
		padding-right:21px;
	}

}

@media (max-width:1120px) {
	.home-top-in {
		grid-template-columns:170px minmax(350px,1fr) auto;
	}

	.home-logo {
		width:158px;
	}

	.home-links {
		gap:14px;
	}

	.home-links a {
		font-size:14px;
	}

	.home-register {
		min-width:158px;
		font-size:13px;
	}

	.home-hero {
		min-height:510px;
	}

	.home-hero-media {
		height:452px;
	}

	.home-hero h1 {
		font-size:48px;
	}

	.home-hero-lead {
		font-size:17px;
	}

	.home-hero-actions {
		grid-template-columns:1.08fr .92fr;
	}

	.home-button {
		padding-left:16px;
		padding-right:16px;
		font-size:14px;
	}

	.home-free-note {
		margin-top:20px;
	}
}

@media (max-width:1023px) {
	.home-top {
		height:62px;
	}

	.home-top-in {
		width:calc(100% - 28px);
		grid-template-columns:44px minmax(0,1fr) 68px;
		gap:10px;
	}

	.home-menu-toggle {
		width:44px;
		height:44px;
		padding:10px;
		display:flex;
		flex-direction:column;
		align-items:center;
		justify-content:center;
		gap:5px;
		border:1px solid var(--home-line);
		border-radius:12px;
		background:color-mix(in srgb,var(--home-surface) 58%,transparent);
		color:var(--home-ink);
		cursor:pointer;
	}

	.home-menu-toggle span {
		width:19px;
		height:2px;
		border-radius:2px;
		background:currentColor;
		transition:transform .18s ease,opacity .18s ease;
	}

	.home-menu-toggle[aria-expanded="true"] span:nth-child(1) {
		transform:translateY(7px) rotate(45deg);
	}

	.home-menu-toggle[aria-expanded="true"] span:nth-child(2) {
		opacity:0;
	}

	.home-menu-toggle[aria-expanded="true"] span:nth-child(3) {
		transform:translateY(-7px) rotate(-45deg);
	}

	.home-logo {
		justify-self:center;
		width:132px;
		height:44px;
	}

	.home-links,
	.home-actions > a {
		display:none;
	}

	.home-actions {
		width:68px;
	}

	.home-actions .pbPublicThemeToggle {
		width:64px!important;
		min-width:64px!important;
		height:42px!important;
	}

	.home-actions .pbPublicThemeToggle::before {
		left:32px;
		width:28px;
		height:28px;
		top:6px;
	}

	html.pb-public-dark .home-actions .pbPublicThemeToggle::before {
		transform:translateX(-27px);
	}

	.home-actions .pbPublicThemeToggle::after {
		top:12px;
		right:9px;
	}

	.home-mobile-panel {
		top:69px;
	}

	.home-shell {
		width:100%;
	}

	.home-hero {
		min-height:0;
		grid-template-columns:1fr;
		grid-template-areas:"media" "copy";
	}

	.home-hero-media {
		height:clamp(250px,58vw,430px);
		margin:0 14px;
		border-radius:0 0 22px 22px;
	}

	html.pb-public-dark .home-hero-media {
		border-radius:0 0 22px 22px;
		-webkit-mask-image:none;
		mask-image:none;
	}

	.home-hero-copy {
		padding:22px 18px 24px;
	}

	.home-eyebrow {
		margin-bottom:13px;
		font-size:12px;
	}

	.home-hero h1 {
		max-width:690px;
		font-size:clamp(40px,7.2vw,58px);
	}

	.home-hero-lead {
		max-width:680px;
		margin-top:17px;
		font-size:17px;
	}

	.home-hero-actions {
		max-width:680px;
		margin-top:20px;
	}

	.home-free-note {
		margin-top:18px;
	}

	.home-rehearsal-screen {
		width:48%;
	}

	.home-popular {
		padding:20px 18px 28px;
	}

	.home-catalog {
		scroll-margin-top:78px;
	}

	.home-catalog-columns,
	.home-song {
		grid-template-columns:minmax(300px,1.7fr) minmax(140px,1fr) 130px 56px;
		column-gap:12px;
	}
}

@media (max-width:600px) {
	.home-hero-media {
		height:232px;
	}

	.home-hero-photo {
		object-position:56% 44%;
	}

	.home-rehearsal-screen {
		right:-8%;
		bottom:12px;
		width:56%;
		border-radius:10px;
	}

	.home-hero-copy {
		padding:9px 18px 20px;
	}

	.home-eyebrow {
		margin-bottom:10px;
		gap:9px;
		font-size:10px;
		letter-spacing:.045em;
	}

	.home-eyebrow-icon {
		flex-basis:22px;
		width:22px;
		height:22px;
	}

	.home-hero h1 {
		font-size:clamp(34px,9.3vw,38px);
		letter-spacing:-.052em;
		line-height:.98;
	}

	.home-hero-lead {
		margin-top:14px;
		font-size:15.5px;
		line-height:1.42;
	}

	.home-hero-actions {
		margin-top:16px;
		display:block;
	}

	.home-button {
		width:100%;
		min-height:48px;
		padding:0 20px;
		font-size:14px;
	}

	.home-button.secondary {
		margin-top:10px;
		display:flex;
	}

	.home-free-note {
		margin-top:14px;
		gap:10px;
	}

	.home-free-icon {
		flex-basis:36px;
		width:36px;
		height:36px;
		border-radius:10px;
		font-size:18px;
	}

	.home-free-note strong {
		font-size:14px;
	}

	.home-free-note small {
		font-size:11px;
	}

	.home-popular {
		padding:18px 14px 26px;
	}

	.home-catalog {
		padding-top:24px;
		padding-bottom:34px;
	}

	.home-catalog .home-popular-head {
		align-items:flex-start;
		margin-bottom:18px;
		flex-direction:column;
		gap:9px;
	}

	.home-catalog-search {
		margin-bottom:18px!important;
	}

	.home-catalog-lead {
		margin-top:8px;
		font-size:13px;
		line-height:1.45;
	}

	.home-popular-head {
		margin-bottom:13px;
	}

	.home-popular h2 {
		font-size:24px;
	}

	.home-popular-all {
		min-height:44px;
		font-size:12px;
	}

	.home-popular-status {
		min-height:190px;
	}

	.home-catalog-columns {
		display:none;
	}

	.home-song-list {
		border-top:1px solid var(--home-line);
	}

	.home-song {
		min-height:86px;
		padding:10px 0;
		grid-template-columns:minmax(0,1fr) 50px;
		column-gap:8px;
	}

	.home-song-primary {
		grid-template-columns:64px minmax(0,1fr);
		gap:12px;
	}

	.home-song-cover-wrap {
		width:64px;
		height:64px;
		border-radius:9px;
	}

	.home-song-play {
		right:4px;
		bottom:4px;
		width:32px;
		height:32px;
	}

	.home-song-play svg {
		width:16px;
		height:16px;
	}

	.home-song-copy strong {
		font-size:15px;
	}

	.home-song-gift {
		min-height:22px;
		margin-top:5px;
		padding:3px 6px;
		gap:4px;
		font-size:10px;
	}

	.home-song-gift-mark {
		font-size:11px;
	}

	.home-song-gift strong {
		min-height:15px;
		padding-left:4px;
		font-size:8px;
	}

	.home-song-artist,
	.home-song > .home-song-difficulty {
		display:none;
	}

	.home-song-mobile-meta {
		min-width:0;
		margin-top:5px;
		display:block;
	}

	.home-song-mobile-author {
		display:block;
		overflow:hidden;
		color:var(--home-muted);
		text-overflow:ellipsis;
		white-space:nowrap;
		font-size:12px;
		line-height:1.25;
	}

	.home-song-mobile-difficulty {
		margin-top:6px;
	}

	.home-song-mobile-difficulty.is-empty {
		font-size:11px;
	}

	.home-song-difficulty i {
		width:7px;
		height:7px;
	}

	.home-song-favorite {
		width:44px;
		height:44px;
	}

	.home-song-favorite svg {
		width:22px;
		height:22px;
	}
}

@media (max-width:360px) {
	.home-top-in {
		width:calc(100% - 20px);
		grid-template-columns:44px minmax(0,1fr) 62px;
		gap:6px;
	}

	.home-logo {
		width:116px;
	}

	.home-actions,
	.home-actions .pbPublicThemeToggle {
		width:60px!important;
		min-width:60px!important;
	}

	.home-hero-media {
		margin-left:10px;
		margin-right:10px;
	}

	.home-hero-copy {
		padding-left:14px;
		padding-right:14px;
	}

	.home-hero h1 {
		font-size:36px;
	}
}

@media (prefers-reduced-motion:reduce) {
	.home-menu-toggle span,
	.home-links a,
	.home-register,
	.home-button,
	.home-song-cover img,
	.home-song-favorite,
	.home-actions .pbPublicThemeToggle::before {
		transition:none!important;
	}

	.home-button:hover {
		transform:none;
	}

	.home-song-play.is-loading svg {
		animation:none!important;
	}
}