/* CompactCSS source: /apps/rebbe/styles/core.css */
/* B"H
 * Boruch Hashem
 * Blessed is He
 * The Awtsmoos renews the archive before any layer can claim height or any color can claim light; Awtsmoos.com gathers the Rebbe app's finite tokens and runtime garments into one discoverable root of order and delight.
 */

/* CompactCSS source: /apps/rebbe/styles/rebbe-premium.css */
/* B"H
 * Boruch Hashem
 * Blessed is He
 * The Awtsmoos renews ancient archive and future glass in one indivisible light; Awtsmoos.com lets Rebbe media remain elegant, thumb-ready, layered by named law, and calm enough that the teaching—not the chrome—holds the center.
 */

/* CompactCSS source: /apps/rebbe/styles/rebbe-premium-surfaces.css */
/* B"H
 * Boruch Hashem
 * Blessed is He
 * The Awtsmoos gives each Rebbe surface a finite garment while remaining beyond every panel and player; Awtsmoos.com lets titles, cards, studio entry, modal bounds, and form fields share one calm premium vocabulary without crowding the foundation.
 */
.column h2,
.modal h2,
.pl-card-title {
	color: var(--rebbe-gold);
	letter-spacing: .04em;
}

:where(.track, .year-item, .folder-item, .result-card, .pl-card, .pl-item) {
	border: 1px solid rgba(255, 255, 255, .07);
	border-radius: 16px;
	background: rgba(255, 255, 255, .035);
	transition: transform .16s ease, border-color .16s ease, background .16s ease;
}

#player-bar {
	margin: 10px max(10px, env(safe-area-inset-right)) max(10px, env(safe-area-inset-bottom)) max(10px, env(safe-area-inset-left));
	border-radius: 24px;
}

#studio-fab {
	border-radius: 999px;
	background: linear-gradient(135deg, var(--rebbe-gold), var(--rebbe-cyan));
	color: #020304;
	font-weight: 900;
}

.modal {
	max-width: min(1080px, calc(100vw - 24px));
}

:where(input, select, textarea) {
	border: 1px solid var(--rebbe-border);
	border-radius: 14px;
	background: rgba(0, 0, 0, .35);
	color: var(--rebbe-text);
}



:root {
	--rebbe-bg: #030507;
	--rebbe-panel: rgba(7, 12, 18, .78);
	--rebbe-panel-strong: rgba(7, 12, 18, .94);
	--rebbe-border: rgba(242, 197, 93, .28);
	--rebbe-gold: #f2c55d;
	--rebbe-gold-soft: rgba(242, 197, 93, .14);
	--rebbe-cyan: #38f8ff;
	--rebbe-cyan-soft: rgba(56, 248, 255, .14);
	--rebbe-text: #f7f2df;
	--rebbe-muted: #a9b2b8;
	--rebbe-danger: #ff4f7a;
	--rebbe-radius: 18px;
	--rebbe-touch: 46px;
	--rebbe-shadow: 0 22px 80px rgba(0, 0, 0, .5), 0 0 42px rgba(56, 248, 255, .08);
	--font-primary: Inter, "Segoe UI", system-ui, sans-serif;
	--font-tech: Inter, "Segoe UI", system-ui, sans-serif;
}

body {
	background:
		radial-gradient(circle at top left, rgba(242, 197, 93, .16), transparent 34vw),
		radial-gradient(circle at 78% 16%, rgba(56, 248, 255, .13), transparent 32vw),
		linear-gradient(145deg, #020304, #081018 48%, #010203);
	color: var(--rebbe-text);
}

:where(button, .btn-tool, .track, .year-item, .folder-item, .pl-card, .pl-item, .bulk-pill) {
	min-height: var(--rebbe-touch);
}

:where(button, .btn-tool, .bulk-pill) {
	border: 1px solid var(--rebbe-border);
	border-radius: 999px;
	background: linear-gradient(135deg, rgba(242, 197, 93, .16), rgba(56, 248, 255, .08));
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08);
	color: var(--rebbe-text);
	transition: transform .16s ease, border-color .16s ease, background .16s ease, box-shadow .16s ease, opacity .16s ease;
}

:where(button, .btn-tool, .bulk-pill):focus-visible {
	outline: 2px solid var(--rebbe-cyan);
	outline-offset: 3px;
	border-color: var(--rebbe-cyan);
	box-shadow: 0 0 0 3px rgba(56, 248, 255, .16), 0 0 28px rgba(56, 248, 255, .14);
}

:where(button, .btn-tool, .bulk-pill):active {
	transform: translateY(1px) scale(.97);
}

:where(button, .btn-tool, .bulk-pill):disabled {
	cursor: not-allowed;
	opacity: .48;
	filter: saturate(.55);
}

.topbar,
#player-bar,
.column,
.modal,
.glass,
#ctx-menu {
	border: 1px solid var(--rebbe-border);
	background: var(--rebbe-panel);
	box-shadow: var(--rebbe-shadow);
	backdrop-filter: blur(18px) saturate(150%);
}

.topbar {
	z-index: var(--rebbe-layer-sticky);
	padding-inline: max(14px, env(safe-area-inset-left));
	border-radius: 0 0 var(--rebbe-radius) var(--rebbe-radius);
}

#app-shell {
	gap: 14px;
	padding: 14px;
}

.column,
.modal {
	border-radius: var(--rebbe-radius);
}

.column {
	overflow: hidden;
}



/* CompactCSS source: /apps/rebbe/styles/rebbe-premium-responsive.css */
/* B"H
 * Boruch Hashem
 * Blessed is He
 * The Awtsmoos transcends viewport and pointer while Awtsmoos.com lets the Rebbe archive respond gracefully to mouse, thumb, safe area, motion preference, and high-contrast need without one layer covering another.
 */
@media (hover: hover) and (pointer: fine) {
	:where(button, .btn-tool, .bulk-pill):hover {
		border-color: var(--rebbe-cyan);
		background: linear-gradient(135deg, rgba(242, 197, 93, .22), rgba(56, 248, 255, .14));
		box-shadow: 0 0 0 3px rgba(56, 248, 255, .1), 0 0 28px rgba(56, 248, 255, .14);
		transform: translateY(-1px);
	}

	:where(.track, .year-item, .folder-item, .result-card, .pl-card, .pl-item):hover {
		border-color: rgba(56, 248, 255, .5);
		background: linear-gradient(135deg, rgba(56, 248, 255, .12), rgba(242, 197, 93, .08));
		transform: translateY(-1px);
	}
}

@media (min-width: 900px) {
	#app-shell {
		grid-template-columns: minmax(220px, .7fr) minmax(280px, .9fr) minmax(420px, 1.4fr);
	}
}

@media (max-width: 760px) {
	.topbar {
		position: sticky;
		top: 0;
		z-index: var(--rebbe-layer-sticky);
	}

	#app-shell {
		display: flex;
		overflow-x: auto;
		padding-bottom: var(--rebbe-player-mobile-clearance);
		scroll-snap-type: x mandatory;
	}

	.column {
		flex: 0 0 calc(100vw - 28px);
		scroll-snap-align: center;
	}

	#player-bar {
		position: fixed;
		left: 0;
		right: 0;
		bottom: max(0px, env(safe-area-inset-bottom));
		z-index: var(--rebbe-layer-player);
	}

	.tools {
		overflow-x: auto;
		padding-bottom: 4px;
	}

	.pl-grid {
		grid-template-columns: 1fr;
	}
}

@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		scroll-behavior: auto !important;
		animation-duration: .01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: .01ms !important;
	}
}

@media (prefers-contrast: more) {
	:root {
		--rebbe-border: rgba(242, 197, 93, .8);
		--rebbe-panel: #050505;
	}
}



/* CompactCSS source: /apps/rebbe/styles/runtime-ui.css */
/* B"H
 * Boruch Hashem
 * Blessed is He
 * The Awtsmoos is one before download, playlist, search, tracks, bookshelf, modal, and studio can divide; Awtsmoos.com imports each late-born interface as a small static garment so no runtime style string can hide from review.
 */

/* CompactCSS source: /apps/rebbe/styles/runtime/modal-controls.css */
/* B"H
 * Boruch Hashem
 * Blessed is He
 * The Awtsmoos surrounds every modal boundary while Awtsmoos.com keeps close, context, and destructive actions large, visible, keyboard-ready, and safely inside the viewport.
 */
.modal-close,
.ctx-item {
	min-inline-size: 44px;
	min-block-size: 44px;
	border: 1px solid rgba(56, 248, 255, .34);
	border-radius: 12px;
	background: rgba(0, 8, 12, .72);
	color: var(--rebbe-text);
	font: inherit;
	font-weight: 800;
	cursor: pointer;
	transition: transform .15s ease, border-color .15s ease, background .15s ease, box-shadow .15s ease;
}

.modal-close {
	display: grid;
	place-items: center;
}

.ctx-item {
	inline-size: 100%;
	padding: 10px 14px;
	text-align: start;
}

.ctx-menu-heading {
	padding: 8px 12px;
	color: var(--rebbe-gold);
	font-size: .7rem;
	font-weight: 900;
	letter-spacing: .12em;
	text-transform: uppercase;
	overflow-wrap: anywhere;
}

#ctx-menu {
	position: fixed;
	z-index: var(--rebbe-layer-popover);
	inline-size: min(260px, calc(100vw - 20px));
	max-block-size: min(70dvh, 420px);
	overflow: auto;
	padding: 8px;
	border-radius: 16px;
}

.modal-close:focus-visible,
.ctx-item:focus-visible {
	outline: 2px solid var(--rebbe-cyan);
	outline-offset: 3px;
}

.modal-close:active,
.ctx-item:active {
	transform: scale(.96);
}

.modal-close:disabled,
.ctx-item:disabled {
	cursor: not-allowed;
	opacity: .48;
}

@media (hover: hover) and (pointer: fine) {
	.modal-close:hover,
	.ctx-item:hover {
		border-color: var(--rebbe-cyan);
		background: rgba(56, 248, 255, .13);
		box-shadow: 0 8px 24px rgba(56, 248, 255, .08);
		transform: translateY(-1px);
	}
}

@media (prefers-reduced-motion: reduce) {
	.modal-close,
	.ctx-item {
		transition-duration: .01ms;
	}
}



/* CompactCSS source: /apps/rebbe/styles/runtime/search-shell.css */
/* B"H
 * Boruch Hashem
 * Blessed is He
 * The Awtsmoos is beyond date and keyword while Awtsmoos.com lets powerful archive search begin as one bounded chamber: simple at first glance, advanced only where requested.
 */
.search-modal {
	inline-size: min(1080px, calc(100vw - 24px));
	max-block-size: min(92dvh, calc(100dvh - 20px));
	overflow-y: auto;
	overscroll-behavior: contain;
	scrollbar-gutter: stable;
	padding: clamp(14px, 2vw, 22px);
}

.search-modal > h2 {
	margin: 0 0 12px;
	color: var(--rebbe-gold);
	font-size: clamp(1.3rem, 4vw, 2.2rem);
}

.keyword-row {
	display: grid;
	gap: 7px;
	min-inline-size: 0;
}

.keyword-row > span {
	color: var(--rebbe-muted);
	font-size: .72rem;
	font-weight: 800;
	letter-spacing: .08em;
	text-transform: uppercase;
}

.search-stack {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 12px;
	margin-block: 14px;
}

.zman-filter {
	display: grid;
	gap: 10px;
	min-inline-size: 0;
	padding: 14px;
	border: 1px solid rgba(56, 248, 255, .16);
	border-radius: 16px;
	background: rgba(255, 255, 255, .025);
}

.zman-filter-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
}

.zman-range {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 8px;
}

.suggest-row,
.search-actions,
.history-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.suggest-row {
	margin-top: 9px;
}

.sticky-actions {
	position: sticky;
	top: 0;
	z-index: var(--rebbe-layer-sticky);
	margin: 12px 0;
	padding: 9px;
	border: 1px solid rgba(242, 197, 93, .22);
	border-radius: 16px;
	background: rgba(3, 8, 11, .94);
	backdrop-filter: blur(14px);
}

.lower-actions {
	margin-top: 14px;
}

@media (max-width: 720px) {
	.search-stack,
	.zman-range {
		grid-template-columns: 1fr;
	}
}



/* CompactCSS source: /apps/rebbe/styles/runtime/search-history.css */
/* B"H
 * Boruch Hashem
 * Blessed is He
 * The Awtsmoos renews memory without becoming bound by memory; Awtsmoos.com lets recent searches remain retractable, legible, and secondary to the present act of discovery.
 */
.history-box {
	margin-top: 14px;
	padding: 12px;
	border: 1px solid rgba(242, 197, 93, .2);
	border-radius: 16px;
	background: rgba(242, 197, 93, .035);
}

.history-box summary {
	min-block-size: 44px;
	cursor: pointer;
	font-weight: 800;
}

.history-list {
	display: grid;
	gap: 8px;
	margin-top: 10px;
}

.history-row {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	gap: 8px;
	align-items: center;
}

.history-label {
	min-inline-size: 0;
	text-align: start;
	overflow-wrap: anywhere;
}

.search-help,
.history-empty {
	color: var(--rebbe-muted);
	font-size: .78rem;
	line-height: 1.5;
}

@media (max-width: 520px) {
	.history-row {
		grid-template-columns: 1fr;
	}
}



/* CompactCSS source: /apps/rebbe/styles/runtime/search-controls.css */
/* B"H
 * Boruch Hashem
 * Blessed is He
 * The Awtsmoos renews every search choice before field and button can feel ordinary; Awtsmoos.com gives keyword, date mode, chip, history, and scan actions one deliberate futuristic form.
 */
.search-modal .cyber-input,
.search-modal select {
	box-sizing: border-box;
	inline-size: 100%;
	min-inline-size: 0;
	min-block-size: 44px;
	padding: 10px 12px;
	border: 1px solid rgba(56, 248, 255, .24);
	border-radius: 12px;
	outline: 0;
	background: linear-gradient(180deg, rgba(0, 8, 12, .86), rgba(8, 22, 25, .68));
	color: var(--rebbe-text);
	font: inherit;
	transition: border-color .15s ease, background .15s ease, box-shadow .15s ease, opacity .15s ease;
}

.search-modal .cyber-input::placeholder {
	color: color-mix(in srgb, var(--rebbe-muted) 70%, transparent);
}

.term-chip,
.history-small,
.history-label,
.history-run,
.search-modal .modal-btn,
.result-action {
	min-block-size: 44px;
	padding: 9px 13px;
	border: 1px solid rgba(56, 248, 255, .3);
	border-radius: 999px;
	background: linear-gradient(135deg, rgba(56, 248, 255, .08), rgba(242, 197, 93, .07));
	color: var(--rebbe-text);
	font: inherit;
	font-weight: 800;
	cursor: pointer;
	transition: transform .15s ease, border-color .15s ease, background .15s ease, box-shadow .15s ease, opacity .15s ease;
}

.term-chip {
	font-size: .75rem;
}

.primary-scan,
.zip-selected,
.result-action.zip {
	border-color: rgba(242, 197, 93, .58);
	box-shadow: 0 0 18px rgba(242, 197, 93, .08);
}

.history-small.danger {
	border-color: rgba(255, 79, 122, .5);
	color: #ffdce5;
}



/* CompactCSS source: /apps/rebbe/styles/runtime/search-control-interaction.css */
/* B"H
 * Boruch Hashem
 * Blessed is He
 * The Awtsmoos renews focus, hover, press, and restraint before each gesture arrives; Awtsmoos.com lets search controls answer mouse, thumb, keyboard, disabled state, and reduced motion with one coherent response.
 */
.search-modal :where(input, select, button):focus-visible,
.result-action:focus-visible {
	outline: 2px solid var(--rebbe-cyan);
	outline-offset: 3px;
}

.search-modal :where(button, input, select):disabled,
.result-action:disabled {
	cursor: not-allowed;
	opacity: .46;
	filter: saturate(.55);
}

.search-modal :where(button):active,
.result-action:active {
	transform: scale(.97);
}

@media (hover: hover) and (pointer: fine) {
	.search-modal .cyber-input:hover,
	.search-modal select:hover {
		border-color: rgba(56, 248, 255, .46);
		background: rgba(8, 28, 32, .72);
	}

	.term-chip:hover,
	.history-small:hover,
	.history-label:hover,
	.history-run:hover,
	.search-modal .modal-btn:hover,
	.result-action:hover {
		border-color: var(--rebbe-cyan);
		background: rgba(56, 248, 255, .13);
		box-shadow: 0 8px 24px rgba(56, 248, 255, .08);
		transform: translateY(-1px);
	}
}

@media (max-width: 520px) {
	.search-actions > *,
	.history-actions > * {
		flex: 1 1 100%;
	}
}

@media (prefers-reduced-motion: reduce) {
	.search-modal :where(input, select, button),
	.result-action {
		transition-duration: .01ms;
	}
}



/* CompactCSS source: /apps/rebbe/styles/runtime/search-results.css */
/* B"H
 * Boruch Hashem
 * Blessed is He
 * The Awtsmoos gathers count and archive flow without making the chamber chaotic; Awtsmoos.com gives every result river a bounded shell whose summary remains visible without becoming another overlay.
 */
.date-search-results {
	position: relative;
	min-inline-size: 0;
	margin-top: 16px;
	border: 1px solid rgba(56, 248, 255, .22);
	border-radius: 20px;
	background: rgba(0, 7, 10, .7);
	overflow: clip;
}

.search-results-toolbar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	min-block-size: 56px;
	padding: 10px 12px;
	border-bottom: 1px solid rgba(56, 248, 255, .16);
	background: rgba(0, 9, 12, .9);
}

.search-results-toolbar > div {
	display: grid;
	gap: 2px;
}

.search-results-kicker,
.summary-eyebrow {
	color: var(--rebbe-gold);
	font-size: .68rem;
	font-weight: 900;
	letter-spacing: .12em;
	text-transform: uppercase;
}

.search-results-content {
	min-inline-size: 0;
	padding: 12px;
}

.search-summary {
	position: sticky;
	top: 0;
	z-index: var(--rebbe-layer-sticky);
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	flex-wrap: wrap;
	margin-bottom: 12px;
	padding: 12px;
	border: 1px solid rgba(242, 197, 93, .3);
	border-radius: 15px;
	background: rgba(3, 10, 12, .95);
	backdrop-filter: blur(12px);
}

.search-summary-line {
	font-size: .88rem;
}

.search-summary-line strong,
.selected-count {
	color: #fff;
}

.bulk-selection-actions,
.event-action-grid,
.track-row-actions {
	display: flex;
	align-items: center;
	gap: 7px;
	flex-wrap: wrap;
}

.search-empty {
	padding: 28px 16px;
	color: var(--rebbe-muted);
	text-align: center;
}

.search-empty.small {
	padding: 14px;
}



/* CompactCSS source: /apps/rebbe/styles/runtime/search-event-cards.css */
/* B"H
 * Boruch Hashem
 * Blessed is He
 * The Awtsmoos gives each archive event a finite luminous vessel while remaining beyond title and date; Awtsmoos.com keeps event actions visible and track detail retractable so information grows only when invited.
 */
.premium-event-card {
	display: grid;
	gap: 10px;
	min-inline-size: 0;
	margin: 12px 0;
	padding: 14px;
	border: 1px solid rgba(56, 248, 255, .18);
	border-radius: 18px;
	background: linear-gradient(135deg, rgba(56, 248, 255, .07), rgba(242, 197, 93, .025), rgba(0, 0, 0, .76));
	box-shadow: 0 14px 38px rgba(0, 0, 0, .24);
}

.result-head {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 14px;
	min-inline-size: 0;
}

.result-copy {
	min-inline-size: 0;
}

.result-date {
	color: var(--rebbe-gold);
	font-size: .75rem;
	letter-spacing: .08em;
}

.result-title {
	margin-top: 3px;
	color: #fff;
	font-size: clamp(1rem, 3vw, 1.55rem);
	font-weight: 900;
	overflow-wrap: anywhere;
}

.event-files {
	display: grid;
	gap: 9px;
	padding-top: 10px;
	border-top: 1px solid rgba(56, 248, 255, .14);
}

.track-selection-toolbar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
}

.event-select-label {
	display: flex;
	align-items: center;
	gap: 8px;
	min-block-size: 44px;
	color: #dff;
}

@media (max-width: 760px) {
	.result-head,
	.search-summary,
	.track-selection-toolbar {
		display: grid;
		grid-template-columns: 1fr;
	}

	.bulk-selection-actions,
	.event-action-grid,
	.track-row-actions {
		display: grid;
		grid-template-columns: 1fr 1fr;
	}
}

@media (max-width: 430px) {
	.bulk-selection-actions,
	.event-action-grid,
	.track-row-actions {
		grid-template-columns: 1fr;
	}
}



/* CompactCSS source: /apps/rebbe/styles/runtime/search-tracks.css */
/* B"H
 * Boruch Hashem
 * Blessed is He
 * The Awtsmoos gives each track one finite place without narrowing its title into silence; Awtsmoos.com lets selection, playback, and advanced actions reflow cleanly from wide archive chamber to narrow phone.
 */
.premium-track-row {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr) auto;
	align-items: center;
	gap: 10px;
	min-inline-size: 0;
	margin: 7px 0;
	padding: 10px;
	border: 1px solid rgba(56, 248, 255, .12);
	border-radius: 14px;
	background: rgba(255, 255, 255, .024);
}

.premium-track-row.selected {
	border-color: rgba(242, 197, 93, .78);
	background: rgba(242, 197, 93, .1);
	box-shadow: inset 4px 0 0 var(--rebbe-gold);
}

.track-play-title {
	min-inline-size: 0;
	min-block-size: 44px;
	padding: 8px 4px;
	overflow: hidden;
	border: 0;
	background: transparent;
	color: #fff;
	font: inherit;
	font-weight: 900;
	text-align: start;
	text-overflow: ellipsis;
	white-space: nowrap;
	cursor: pointer;
}

.track-check-shell {
	position: relative;
	display: grid;
	place-items: center;
	inline-size: 44px;
	block-size: 44px;
	cursor: pointer;
}

.track-check-shell input,
.event-select-label input {
	inline-size: 22px;
	block-size: 22px;
	margin: 0;
	accent-color: var(--rebbe-gold);
	cursor: pointer;
}

.track-check-shell input:focus-visible,
.event-select-label input:focus-visible,
.track-play-title:focus-visible {
	outline: 2px solid var(--rebbe-cyan);
	outline-offset: 3px;
}

@media (max-width: 760px) {
	.result-head,
	.search-summary,
	.track-selection-toolbar {
		display: grid;
		grid-template-columns: 1fr;
	}

	.bulk-selection-actions,
	.event-action-grid,
	.track-row-actions {
		display: grid;
		grid-template-columns: 1fr 1fr;
	}

	.premium-track-row {
		grid-template-columns: 44px minmax(0, 1fr);
	}

	.track-row-actions {
		grid-column: 1 / -1;
	}
}

@media (max-width: 430px) {
	.bulk-selection-actions,
	.event-action-grid,
	.track-row-actions {
		grid-template-columns: 1fr;
	}
}



/* CompactCSS source: /apps/rebbe/styles/runtime/search-fullscreen.css */
/* B"H
 * Boruch Hashem
 * Blessed is He
 * The Awtsmoos contains ordinary and fullscreen revelation in one vessel; Awtsmoos.com enlarges the existing results shell with safe-area bounds and internal scrolling instead of spawning a second competing fixed universe.
 */
.date-search-results.is-results-fullscreen {
	position: fixed;
	inset:
		max(8px, env(safe-area-inset-top))
		max(8px, env(safe-area-inset-right))
		max(8px, env(safe-area-inset-bottom))
		max(8px, env(safe-area-inset-left));
	z-index: var(--rebbe-layer-fullscreen);
	display: grid;
	grid-template-rows: auto minmax(0, 1fr);
	max-block-size: none;
	margin: 0;
	overflow: hidden;
	border-color: rgba(56, 248, 255, .62);
	background: rgba(1, 5, 8, .985);
	box-shadow: 0 30px 120px rgba(0, 0, 0, .88), 0 0 70px rgba(56, 248, 255, .12);
}

.date-search-results.is-results-fullscreen .search-results-toolbar {
	position: sticky;
	top: 0;
	z-index: 2;
	background: rgba(1, 8, 12, .98);
}

.date-search-results.is-results-fullscreen .search-results-content {
	overflow-y: auto;
	overscroll-behavior: contain;
	scrollbar-gutter: stable;
	padding-bottom: max(14px, env(safe-area-inset-bottom));
}

.search-results-exit {
	min-inline-size: 44px;
	min-block-size: 44px;
}

@media (max-width: 520px) {
	.search-results-toolbar {
		align-items: stretch;
	}

	.search-results-exit {
		inline-size: 100%;
	}
}



/* CompactCSS source: /apps/rebbe/styles/runtime/track-browser-shell.css */
/* B"H
 * Boruch Hashem
 * Blessed is He
 * The Awtsmoos gives event and track a finite spatial order while remaining beyond all rows; Awtsmoos.com keeps the live browser toolbar, titles, and command decks bounded so no long teaching can widen the viewport.
 */
#list-tracks {
	min-inline-size: 0;
	max-inline-size: 100%;
}

#list-tracks .premium-event-toolbar {
	display: grid;
	grid-template-columns: minmax(210px, 1fr) auto;
	align-items: center;
	gap: 18px;
	min-inline-size: 0;
	margin-bottom: 14px;
	padding: 18px;
	border: 1px solid rgba(0, 243, 255, .42);
	border-radius: 24px;
	background:
		radial-gradient(circle at top left, rgba(0, 243, 255, .20), transparent 46%),
		linear-gradient(135deg, rgba(0, 0, 0, .80), rgba(255, 204, 0, .06));
	box-shadow: 0 16px 45px rgba(0, 0, 0, .32);
}

#list-tracks .event-toolbar-copy {
	min-inline-size: 0;
}

#list-tracks .toolbar-kicker {
	display: block;
	color: var(--c-yellow);
	font-size: 10px;
	letter-spacing: 3px;
	text-transform: uppercase;
}

#list-tracks .premium-event-toolbar strong {
	display: block;
	color: #fff;
	font-size: clamp(19px, 2.5vw, 26px);
	line-height: 1.08;
	overflow-wrap: anywhere;
}

#list-tracks .toolbar-sub {
	margin-top: 7px;
	color: #9cc;
}

#list-tracks .command-deck {
	display: flex;
	justify-content: flex-end;
	gap: 9px;
	flex-wrap: wrap;
	min-inline-size: 0;
}

#list-tracks .premium-track-item {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr) auto !important;
	align-items: center;
	gap: 10px;
	min-inline-size: 0;
	margin: 9px 0;
	padding: 12px !important;
	border: 1px solid rgba(0, 243, 255, .16);
	border-radius: 16px;
	background: linear-gradient(90deg, rgba(255, 255, 255, .03), rgba(0, 243, 255, .018));
}

@media (max-width: 1100px) {
	#list-tracks .premium-event-toolbar {
		grid-template-columns: 1fr;
	}

	#list-tracks .event-toolbar-actions {
		display: grid;
		grid-template-columns: repeat(3, minmax(0, 1fr));
		justify-content: stretch;
	}
}



/* CompactCSS source: /apps/rebbe/styles/runtime/track-browser-controls.css */
/* B"H
 * Boruch Hashem
 * Blessed is He
 * The Awtsmoos gives command, duration, selection, and title distinct finite garments; Awtsmoos.com makes each one readable and thumb-sized without surrendering the compact rhythm of an archive browser.
 */
#list-tracks .track-picker {
	display: grid;
	place-items: center;
	inline-size: 44px;
	block-size: 44px;
	cursor: pointer;
}

#list-tracks .track-picker input {
	inline-size: 22px;
	block-size: 22px;
	margin: 0;
	accent-color: var(--c-yellow);
	cursor: pointer;
}

#list-tracks .track-main-button {
	display: flex;
	align-items: center;
	gap: 10px;
	min-inline-size: 0;
	min-block-size: 44px;
	padding: 6px 4px;
	border: 0;
	background: transparent;
	color: #fff;
	font: inherit;
	text-align: left;
	cursor: pointer;
}

#list-tracks .track-number {
	color: var(--c-yellow);
	font-weight: 900;
}

#list-tracks .t-name {
	min-inline-size: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

#list-tracks .t-dur {
	align-self: center;
	min-inline-size: 52px;
	color: #dff;
	opacity: .86;
	text-align: center;
}

#list-tracks .cached-dot {
	color: var(--c-cyan);
	font-weight: 900;
	text-shadow: 0 0 10px var(--c-cyan);
}

#list-tracks .command-btn {
	display: inline-grid !important;
	grid-template-columns: auto minmax(0, 1fr);
	align-items: center;
	justify-content: center;
	gap: 8px;
	min-inline-size: 98px;
	min-block-size: 44px;
	padding: 10px 14px !important;
	border-radius: 999px !important;
	box-shadow: inset 0 0 14px rgba(0, 243, 255, .06);
	line-height: 1 !important;
	text-align: center;
	white-space: nowrap;
}

#list-tracks .cmd-icon {
	color: var(--c-yellow);
	font-size: 16px;
}

#list-tracks .cmd-label {
	overflow: hidden;
	font-size: 12px;
	letter-spacing: .9px;
	text-overflow: ellipsis;
}

#list-tracks .cmd-primary {
	border-color: rgba(0, 243, 255, .78) !important;
	color: #eaffff !important;
}

#list-tracks .cmd-accent {
	border-color: rgba(255, 204, 0, .72) !important;
	color: var(--c-yellow) !important;
}

#list-tracks .cmd-cache {
	border-color: rgba(0, 243, 255, .55) !important;
	background: linear-gradient(90deg, rgba(0, 243, 255, .10), rgba(255, 204, 0, .06)) !important;
}



/* CompactCSS source: /apps/rebbe/styles/runtime/track-browser-interaction.css */
/* B"H
 * Boruch Hashem
 * Blessed is He
 * The Awtsmoos renews hover, focus, press, saved state, and mobile reflow before each gesture appears; Awtsmoos.com lets the track browser answer every relevant interaction without hidden or endless motion.
 */
#list-tracks :where(.track-main-button, .command-btn, .track-picker input):focus-visible {
	outline: 2px solid var(--rebbe-cyan);
	outline-offset: 3px;
}

#list-tracks .track-main-button:active,
#list-tracks .command-btn:active {
	transform: scale(.97);
}

#list-tracks .command-btn:disabled {
	cursor: not-allowed;
	opacity: .45;
	transform: none;
}

#list-tracks .command-btn.saved {
	box-shadow: 0 0 16px rgba(0, 243, 255, .24);
}

@media (hover: hover) and (pointer: fine) {
	#list-tracks .track-main-button:hover {
		color: var(--rebbe-cyan);
	}

	#list-tracks .command-btn:hover:not(:disabled) {
		border-color: var(--rebbe-cyan) !important;
		box-shadow: 0 8px 24px rgba(0, 243, 255, .08);
		transform: translateY(-1px);
	}
}

@media (max-width: 720px) {
	#list-tracks .premium-track-item {
		grid-template-columns: 44px minmax(0, 1fr) !important;
	}

	#list-tracks .row-command-deck {
		grid-column: 1 / -1;
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		justify-content: stretch;
	}

	#list-tracks .event-toolbar-actions {
		grid-template-columns: 1fr 1fr;
	}

	#list-tracks .command-btn {
		inline-size: 100%;
		min-inline-size: 0;
	}

	#list-tracks .t-dur {
		grid-column: 1 / -1;
		inline-size: 100%;
		text-align: left;
	}
}

@media (max-width: 430px) {
	#list-tracks .row-command-deck,
	#list-tracks .event-toolbar-actions {
		grid-template-columns: 1fr;
	}
}

@media (prefers-reduced-motion: reduce) {
	#list-tracks .track-main-button,
	#list-tracks .command-btn {
		transition-duration: .01ms !important;
	}
}



/* CompactCSS source: /apps/rebbe/styles/runtime/bookshelf-shell.css */
/* B"H
 * Boruch Hashem
 * Blessed is He
 * The Awtsmoos gathers remembered teachings without allowing the shelf to widen beyond its vessel; Awtsmoos.com gives sections, rails, and emptiness one responsive geometry from desktop archive to narrow phone.
 */
#bookshelf-list {
	display: grid;
	gap: 22px;
	min-inline-size: 0;
	max-inline-size: 100%;
}

#bookshelf-list .book-shelf-section {
	display: grid;
	gap: 12px;
	min-inline-size: 0;
}

#bookshelf-list .book-section-title {
	margin: 0;
	padding-block-end: 8px;
	border-bottom: 1px solid rgba(56, 248, 255, .22);
	color: var(--rebbe-cyan);
	font-size: .82rem;
	letter-spacing: .16em;
	text-transform: uppercase;
}

#bookshelf-list .book-rail {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(16rem, 100%), 1fr));
	gap: 14px;
	min-inline-size: 0;
	max-inline-size: 100%;
}

#bookshelf-list .bookshelf-empty {
	display: grid;
	place-items: center;
	gap: 8px;
	min-block-size: 220px;
	padding: clamp(22px, 6vw, 44px);
	border: 1px dashed rgba(56, 248, 255, .3);
	border-radius: 22px;
	background: radial-gradient(circle at top, rgba(56, 248, 255, .08), transparent 55%);
	color: var(--rebbe-muted);
	text-align: center;
}

#bookshelf-list .bookshelf-empty-kicker {
	color: var(--rebbe-gold);
	font-size: .68rem;
	font-weight: 900;
	letter-spacing: .16em;
	text-transform: uppercase;
}

#bookshelf-list .bookshelf-empty strong {
	color: var(--rebbe-text);
	font-size: clamp(1.1rem, 4vw, 1.6rem);
}

#bookshelf-list .bookshelf-empty p {
	max-inline-size: 34rem;
	margin: 0;
	line-height: 1.5;
}



/* CompactCSS source: /apps/rebbe/styles/runtime/bookshelf-cards.css */
/* B"H
 * Boruch Hashem
 * Blessed is He
 * The Awtsmoos gives folder and track distinct finite garments while remaining beyond both; Awtsmoos.com keeps spine, year, title, metadata, and actions readable without letting any saved path escape the card.
 */
#bookshelf-list .book-card {
	display: grid;
	grid-template-columns: 54px minmax(0, 1fr);
	min-inline-size: 0;
	min-block-size: 184px;
	overflow: hidden;
	border: 1px solid rgba(56, 248, 255, .22);
	border-radius: 18px;
	background: linear-gradient(135deg, rgba(56, 248, 255, .11), rgba(0, 0, 0, .72));
	box-shadow: 0 14px 38px rgba(0, 0, 0, .26), inset 0 1px 0 rgba(255, 255, 255, .04);
	transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease, background .16s ease;
}

#bookshelf-list .book-folder {
	border-color: rgba(242, 197, 93, .28);
	background: linear-gradient(135deg, rgba(242, 197, 93, .12), rgba(0, 0, 0, .74));
}

#bookshelf-list .book-spine {
	display: grid;
	place-items: center;
	border-inline-end: 1px solid rgba(56, 248, 255, .18);
	background: linear-gradient(180deg, rgba(0, 8, 12, .94), rgba(0, 0, 0, .72));
	font-size: 1.45rem;
}

#bookshelf-list .book-folder .book-spine {
	border-inline-end-color: rgba(242, 197, 93, .2);
}

#bookshelf-list .book-body {
	display: flex;
	flex-direction: column;
	gap: 8px;
	min-inline-size: 0;
	padding: 14px;
}

#bookshelf-list .book-year {
	color: var(--rebbe-gold);
	font-size: .72rem;
	font-weight: 900;
	letter-spacing: .08em;
}

#bookshelf-list .book-title {
	min-inline-size: 0;
	color: #fff;
	font-size: 1rem;
	line-height: 1.3;
	overflow-wrap: anywhere;
}

#bookshelf-list .book-meta {
	min-inline-size: 0;
	color: var(--rebbe-muted);
	font-size: .76rem;
	line-height: 1.45;
	overflow-wrap: anywhere;
}

#bookshelf-list .book-actions {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 8px;
	margin-block-start: auto;
	min-inline-size: 0;
}

@media (max-width: 360px) {
	#bookshelf-list .book-card {
		grid-template-columns: 46px minmax(0, 1fr);
	}
}



/* CompactCSS source: /apps/rebbe/styles/runtime/bookshelf-interaction.css */
/* B"H
 * Boruch Hashem
 * Blessed is He
 * The Awtsmoos renews every opening and removal before a finger can press; Awtsmoos.com lets Bookshelf actions answer hover, active, keyboard focus, disabled truth, narrow phones, and reduced motion without noisy animation.
 */
#bookshelf-list .book-action {
	min-inline-size: 0;
	min-block-size: 44px;
	padding: 9px 12px;
	border: 1px solid rgba(56, 248, 255, .36);
	border-radius: 999px;
	background: rgba(56, 248, 255, .07);
	color: var(--rebbe-text);
	font: inherit;
	font-size: .72rem;
	font-weight: 900;
	letter-spacing: .06em;
	text-transform: uppercase;
	cursor: pointer;
	transition: transform .15s ease, border-color .15s ease, background .15s ease, box-shadow .15s ease, opacity .15s ease;
}

#bookshelf-list .book-remove {
	border-color: rgba(255, 79, 122, .42);
	background: rgba(255, 79, 122, .07);
	color: #ffdce5;
}

#bookshelf-list .book-action:focus-visible {
	outline: 2px solid var(--rebbe-cyan);
	outline-offset: 3px;
}

#bookshelf-list .book-action:active {
	transform: scale(.96);
}

#bookshelf-list .book-action:disabled {
	cursor: not-allowed;
	opacity: .46;
	transform: none;
}

@media (hover: hover) and (pointer: fine) {
	#bookshelf-list .book-card:hover {
		border-color: rgba(56, 248, 255, .5);
		box-shadow: 0 18px 48px rgba(0, 0, 0, .32), 0 0 26px rgba(56, 248, 255, .07);
		transform: translateY(-2px);
	}

	#bookshelf-list .book-folder:hover {
		border-color: rgba(242, 197, 93, .52);
	}

	#bookshelf-list .book-action:hover {
		border-color: var(--rebbe-cyan);
		background: rgba(56, 248, 255, .14);
		box-shadow: 0 8px 22px rgba(56, 248, 255, .08);
		transform: translateY(-1px);
	}

	#bookshelf-list .book-remove:hover {
		border-color: var(--rebbe-danger);
		background: rgba(255, 79, 122, .15);
	}
}

@media (max-width: 380px) {
	#bookshelf-list .book-actions {
		grid-template-columns: 1fr;
	}
}

@media (prefers-reduced-motion: reduce) {
	#bookshelf-list .book-card,
	#bookshelf-list .book-action {
		transition-duration: .01ms;
	}
}



/* CompactCSS source: /apps/rebbe/styles/runtime/download-tasks.css */
/* B"H
 * Boruch Hashem
 * Blessed is He
 * The Awtsmoos renews every export before one file can become heavy; Awtsmoos.com lets parallel download tasks float above the player without covering it, with every close action large enough for a human thumb.
 */
#download-task-stack {
	position: fixed;
	right: 16px;
	bottom: calc(18px + env(safe-area-inset-bottom));
	z-index: var(--rebbe-layer-floating);
	display: grid;
	gap: 12px;
	width: min(430px, calc(100vw - 28px));
	max-block-size: calc(100dvh - 32px);
	overflow-y: auto;
	padding: 2px;
	pointer-events: none;
	scrollbar-gutter: stable;
}

body.has-playlist-selection #download-task-stack {
	bottom: calc(var(--rebbe-selection-clearance) + 18px + env(safe-area-inset-bottom));
}

.download-task-card {
	position: relative;
	min-inline-size: 0;
	padding: 16px;
	border: 1px solid rgba(0, 243, 255, .46);
	border-radius: 18px;
	background: linear-gradient(145deg, rgba(0, 12, 16, .98), rgba(6, 4, 10, .98));
	box-shadow: 0 18px 55px rgba(0, 0, 0, .65), 0 0 35px rgba(0, 243, 255, .14);
	color: #eaffff;
	font-family: var(--font-primary);
	pointer-events: auto;
}

.download-task-close {
	position: absolute;
	top: 8px;
	right: 8px;
	display: grid;
	place-items: center;
	inline-size: 44px;
	block-size: 44px;
	padding: 0;
	border: 1px solid rgba(255, 79, 122, .58);
	border-radius: 50%;
	background: rgba(255, 79, 122, .12);
	color: #fff;
	font-size: 20px;
	cursor: pointer;
	transition: transform .15s ease, border-color .15s ease, background .15s ease, box-shadow .15s ease;
}

.download-task-kicker {
	padding-inline-end: 46px;
	color: var(--c-yellow);
	font-size: 10px;
	letter-spacing: 2.5px;
	text-transform: uppercase;
}

.download-task-card h3 {
	margin: 5px 46px 8px 0;
	color: #fff;
	font-size: 15px;
	overflow-wrap: anywhere;
}

.download-task-status {
	color: var(--c-cyan);
	font-weight: 900;
}

.download-task-name {
	min-height: 18px;
	margin: 6px 0 9px;
	color: #a9c9c9;
	font-size: 12px;
	overflow-wrap: anywhere;
}

.download-task-track {
	height: 10px;
	overflow: hidden;
	border: 1px solid rgba(0, 243, 255, .38);
	border-radius: 999px;
	background: #020707;
}

.download-task-fill {
	height: 100%;
	width: 0;
	background: linear-gradient(90deg, var(--c-cyan), var(--c-yellow));
	transition: width .18s ease;
}

.download-task-percent {
	margin-top: 4px;
	color: #fff;
	font-weight: 900;
	text-align: right;
}

.download-task-log {
	max-height: 92px;
	overflow: auto;
	color: #9fb;
	font-size: 11px;
	line-height: 1.45;
}

.download-task-card.is-done {
	border-color: rgba(255, 204, 0, .74);
}

.download-task-card.is-failed {
	border-color: rgba(255, 79, 122, .85);
}



/* CompactCSS source: /apps/rebbe/styles/runtime/download-task-interaction.css */
/* B"H
 * Boruch Hashem
 * Blessed is He
 * The Awtsmoos renews focus and press before any dismiss gesture can harden; Awtsmoos.com lets each export card answer hover, keyboard, touch, and reduced motion with one precise response.
 */
.download-task-close:focus-visible {
	outline: 2px solid var(--rebbe-cyan);
	outline-offset: 3px;
}

.download-task-close:active {
	transform: scale(.94);
}

@media (hover: hover) and (pointer: fine) {
	.download-task-close:hover {
		border-color: var(--rebbe-danger);
		background: rgba(255, 79, 122, .24);
		box-shadow: 0 0 20px rgba(255, 79, 122, .16);
		transform: translateY(-1px);
	}
}

@media (max-width: 720px) {
	#download-task-stack {
		left: 10px;
		right: 10px;
		bottom: calc(var(--rebbe-player-mobile-clearance) + var(--rebbe-floating-gap) + env(safe-area-inset-bottom));
		width: auto;
		max-block-size: calc(100dvh - var(--rebbe-player-mobile-clearance) - 28px - env(safe-area-inset-bottom));
	}

	body.has-playlist-selection #download-task-stack {
		bottom: calc(var(--rebbe-player-mobile-clearance) + var(--rebbe-selection-clearance) + var(--rebbe-floating-gap) + env(safe-area-inset-bottom));
		max-block-size: calc(100dvh - var(--rebbe-player-mobile-clearance) - var(--rebbe-selection-clearance) - 28px - env(safe-area-inset-bottom));
	}
}

@media (prefers-reduced-motion: reduce) {
	.download-task-close,
	.download-task-fill {
		transition-duration: .01ms;
	}
}



/* CompactCSS source: /apps/rebbe/styles/runtime/playlists-shell.css */
/* B"H
 * Boruch Hashem
 * Blessed is He
 * The Awtsmoos is beyond playlist, cover, and modal; Awtsmoos.com gives each ordered river of Torah audio a bounded glass chamber that breathes on desktop and folds cleanly on phones.
 */
.sr-only {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
}

body .playlist-modal {
	width: min(1120px, 96vw) !important;
	max-height: min(92dvh, calc(100dvh - 20px));
	overflow: hidden;
	border: 1px solid rgba(0, 243, 255, .72) !important;
	border-radius: 24px;
	background: linear-gradient(135deg, rgba(2, 10, 18, .98), rgba(0, 0, 0, .99)) !important;
	box-shadow: 0 32px 96px rgba(0, 0, 0, .8), 0 0 80px rgba(0, 243, 255, .16) !important;
}

body .playlist-modal.compact {
	width: min(720px, 94vw) !important;
}

.playlist-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	background: linear-gradient(90deg, rgba(0, 243, 255, .95), rgba(255, 204, 0, .88)) !important;
	color: #020608 !important;
	letter-spacing: 3px;
}

.playlist-body {
	max-height: calc(92dvh - 70px);
	overflow: auto;
	padding: 22px !important;
	color: #eaffff !important;
	overscroll-behavior: contain;
}

.playlist-hero,
.playlist-detail-hero {
	display: flex;
	align-items: center;
	gap: 18px;
	margin-bottom: 18px;
	padding: 22px;
	border: 1px solid rgba(0, 243, 255, .25);
	border-radius: 22px;
	background: radial-gradient(circle at top left, rgba(0, 243, 255, .18), transparent 42%), rgba(255, 255, 255, .035);
}

.playlist-hero {
	justify-content: space-between;
}

.playlist-detail-hero {
	align-items: stretch;
}

.playlist-mosaic,
.playlist-art-mosaic,
.playlist-orb {
	display: grid;
	place-items: center;
	border: 1px solid var(--c-cyan);
	background: #001114;
	box-shadow: inset 0 0 24px rgba(0, 243, 255, .18);
	color: var(--c-yellow);
}

.playlist-mosaic {
	width: 92px;
	height: 92px;
	border-radius: 28px;
	font-size: 42px;
}

.playlist-art-mosaic {
	grid-template-columns: 1fr 1fr;
	width: 150px;
	min-height: 150px;
	border-radius: 28px;
	font-size: 38px;
}

.playlist-orb {
	flex: 0 0 auto;
	width: 60px;
	height: 60px;
	border-radius: 20px;
	font-size: 22px;
}

.playlist-kicker {
	color: var(--c-yellow);
	font-size: 11px;
	letter-spacing: 3px;
	text-transform: uppercase;
}

.playlist-hero h2 {
	margin: 5px 0 0;
	color: #fff;
	font-size: clamp(26px, 4vw, 48px);
}



/* CompactCSS source: /apps/rebbe/styles/runtime/playlists-cards.css */
/* B"H
 * Boruch Hashem
 * Blessed is He
 * The Awtsmoos lets each playlist card be one finite constellation without becoming a layout prison; Awtsmoos.com keeps artwork, text, and actions bounded so long titles and narrow phones remain luminous instead of overflowing.
 */
.playlist-card {
	display: flex;
	gap: 16px;
	margin: 14px 0;
	padding: 18px;
	border: 1px solid rgba(0, 243, 255, .25);
	border-radius: 20px;
	background: linear-gradient(120deg, rgba(0, 243, 255, .12), rgba(255, 0, 85, .07), rgba(0, 0, 0, .72));
	box-shadow: 0 14px 40px rgba(0, 0, 0, .35);
	transition: transform .2s ease, border-color .2s ease, background .2s ease;
}

.playlist-card-main {
	min-width: 0;
	flex: 1;
}

.playlist-card h3 {
	margin: 0;
	overflow: hidden;
	color: #fff;
	font-size: 22px;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.playlist-card p {
	margin: 6px 0 12px;
	color: #9cc;
	font-size: 12px;
}



/* CompactCSS source: /apps/rebbe/styles/runtime/playlists-controls.css */
/* B"H
 * Boruch Hashem
 * Blessed is He
 * The Awtsmoos renews every playlist action before a button can become ordinary; Awtsmoos.com lets adding, moving, saving, and deleting remain thumb-sized, keyboard-visible, and gracefully bounded.
 */
.playlist-actions,
.playlist-detail-actions {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(118px, 1fr));
	gap: 9px;
}

.mini-btn {
	min-height: 44px;
	padding: 10px 14px;
	border: 1px solid rgba(0, 243, 255, .45);
	border-radius: 999px;
	background: rgba(0, 0, 0, .55);
	color: #dfffff;
	font: inherit;
	font-weight: 900;
	letter-spacing: 1px;
	text-align: center;
	cursor: pointer;
	transition: transform .15s ease, border-color .15s ease, background .15s ease, box-shadow .15s ease;
}

.mini-btn.primary {
	border-color: rgba(255, 204, 0, .8);
	box-shadow: 0 0 18px rgba(255, 204, 0, .14);
}

.mini-btn.icon {
	min-width: 44px;
	padding-inline: 10px;
}

.mini-btn.danger {
	border-color: var(--c-magenta);
	background: rgba(255, 0, 85, .14);
	color: #fff;
}

.mini-btn:focus-visible {
	outline: 2px solid var(--rebbe-cyan);
	outline-offset: 3px;
}

.mini-btn:active {
	transform: scale(.97);
}

.mini-btn:disabled {
	cursor: not-allowed;
	opacity: .48;
}

.playlist-empty {
	padding: 46px;
	border: 1px dashed rgba(0, 243, 255, .28);
	border-radius: 18px;
	color: #8aa;
	letter-spacing: 3px;
	text-align: center;
}

.playlist-empty.small {
	padding: 22px;
}



/* CompactCSS source: /apps/rebbe/styles/runtime/playlists-fields.css */
/* B"H
 * Boruch Hashem
 * Blessed is He
 * The Awtsmoos gives title, description, and picker intent one ordered vessel; Awtsmoos.com lets playlist editing remain explicit, labeled, keyboard-visible, and narrow enough for every phone without surrendering advanced power.
 */
.playlist-create-row {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	gap: 12px;
	margin-bottom: 18px;
}

.playlist-picker-card {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	width: 100%;
	min-height: 48px;
	margin: 10px 0;
	padding: 14px 16px;
	border: 1px solid rgba(0, 243, 255, .24);
	border-radius: 16px;
	background: rgba(0, 243, 255, .07);
	color: #fff;
	cursor: pointer;
	transition: transform .15s ease, border-color .15s ease, background .15s ease;
}

.playlist-picker-card:focus-visible,
.playlist-edit-grid input:focus-visible {
	outline: 2px solid var(--rebbe-cyan);
	outline-offset: 3px;
}

.playlist-picker-card:active {
	transform: scale(.97);
}

.playlist-edit-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	flex: 1;
	gap: 10px;
	min-width: min(640px, 100%);
}

.playlist-edit-grid label {
	display: grid;
	gap: 6px;
	color: #9ff;
	font-size: 11px;
	letter-spacing: 2px;
	text-transform: uppercase;
}

.playlist-edit-grid .btn-action {
	grid-column: 1 / -1;
}

.playlist-track-list {
	display: grid;
	gap: 8px;
	margin-top: 14px;
}



/* CompactCSS source: /apps/rebbe/styles/runtime/playlists-tracks.css */
/* B"H
 * Boruch Hashem
 * Blessed is He
 * The Awtsmoos orders every track without confining its title; Awtsmoos.com lets sequence, play, move, and delete actions form a responsive row that can become a clean phone stack without overflow.
 */
.playlist-track-row {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr) repeat(4, auto);
	align-items: center;
	gap: 10px;
	padding: 12px;
	border: 1px solid rgba(0, 243, 255, .12);
	border-radius: 16px;
	background: rgba(255, 255, 255, .025);
}

.playlist-index {
	color: var(--c-yellow);
	font-weight: 900;
}

.playlist-track-title {
	min-width: 0;
	overflow: hidden;
	color: #fff;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.playlist-pending,
.playlist-detail-stats {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	margin: 10px 0 14px;
	color: var(--c-yellow);
}

@media (hover: hover) and (pointer: fine) {
	.playlist-card:hover {
		border-color: rgba(0, 243, 255, .8);
		transform: translateY(-2px);
	}

	.mini-btn:hover,
	.playlist-picker-card:hover {
		border-color: rgba(56, 248, 255, .72);
		background: rgba(0, 243, 255, .14);
		box-shadow: 0 8px 24px rgba(0, 243, 255, .08);
		transform: translateY(-1px);
	}

	.mini-btn.danger:hover {
		border-color: var(--rebbe-danger);
		background: rgba(255, 79, 122, .24);
	}
}

@media (max-width: 820px) {
	.playlist-hero,
	.playlist-card,
	.playlist-detail-hero {
		display: grid;
	}

	.playlist-art-mosaic {
		width: 100%;
		min-height: 120px;
	}

	.playlist-actions,
	.playlist-detail-actions,
	.playlist-edit-grid,
	.playlist-create-row,
	.playlist-track-row {
		grid-template-columns: 1fr 1fr;
		min-width: 0;
	}

	.playlist-track-title,
	.playlist-index {
		grid-column: 1 / -1;
		white-space: normal;
	}
}

@media (max-width: 520px) {
	.playlist-actions,
	.playlist-detail-actions,
	.playlist-edit-grid,
	.playlist-create-row,
	.playlist-track-row {
		grid-template-columns: 1fr;
	}

	.playlist-body {
		padding: 14px !important;
	}

	.playlist-hero,
	.playlist-detail-hero,
	.playlist-card {
		padding: 14px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.playlist-card,
	.mini-btn,
	.playlist-picker-card {
		transition-duration: .01ms;
	}
}



/* CompactCSS source: /apps/rebbe/styles/runtime/playlists-selection.css */
/* B"H
 * Boruch Hashem
 * Blessed is He
 * The Awtsmoos gathers scattered selection into one crown without covering the song below; Awtsmoos.com gives the playlist selection bar a named layer and a measured clearance above the mobile player.
 */
#playlist-selection-bar {
	position: fixed;
	left: 50%;
	bottom: calc(16px + env(safe-area-inset-bottom));
	z-index: var(--rebbe-layer-popover);
	max-width: calc(100vw - 24px);
	transform: translateX(-50%);
}

#playlist-selection-bar:empty,
#playlist-selection-bar.hidden {
	display: none;
}

.playlist-selection-inner {
	display: flex;
	align-items: center;
	gap: 12px;
	min-width: 0;
	padding: 10px 12px;
	border: 1px solid var(--c-cyan);
	border-radius: 999px;
	background: rgba(0, 10, 12, .96);
	box-shadow: 0 16px 42px rgba(0, 0, 0, .48), 0 0 24px rgba(0, 243, 255, .12);
	color: #fff;
	backdrop-filter: blur(16px);
}

.playlist-selection-inner span {
	min-width: 0;
	overflow-wrap: anywhere;
}

.playlist-selection-inner button {
	min-width: 44px;
	min-height: 44px;
	padding: 8px 12px;
	border: 1px solid rgba(255, 204, 0, .7);
	border-radius: 999px;
	background: #050908;
	color: #fff;
	font: inherit;
	font-weight: 900;
	cursor: pointer;
	transition: transform .15s ease, border-color .15s ease, background .15s ease;
}

.playlist-selection-inner button:focus-visible {
	outline: 2px solid var(--rebbe-cyan);
	outline-offset: 3px;
}

.playlist-selection-inner button:active {
	transform: scale(.96);
}

@media (hover: hover) and (pointer: fine) {
	.playlist-selection-inner button:hover {
		border-color: var(--rebbe-cyan);
		background: rgba(0, 243, 255, .12);
		transform: translateY(-1px);
	}
}

@media (max-width: 820px) {
	#playlist-selection-bar {
		left: 10px;
		right: 10px;
		bottom: calc(var(--rebbe-player-mobile-clearance) + var(--rebbe-floating-gap) + env(safe-area-inset-bottom));
		max-width: none;
		transform: none;
	}

	.playlist-selection-inner {
		display: grid;
		grid-template-columns: 1fr 1fr;
		border-radius: 20px;
	}

	.playlist-selection-inner span,
	.playlist-selection-inner b {
		grid-column: 1 / -1;
	}
}

@media (prefers-reduced-motion: reduce) {
	.playlist-selection-inner button {
		transition-duration: .01ms;
	}
}



/* CompactCSS source: /apps/rebbe/styles/runtime/studio-polish.css */
/* B"H
 * Boruch Hashem
 * Blessed is He
 * The Awtsmoos gives the studio many instruments but one orderly light; Awtsmoos.com keeps its toolbar, preview, and properties chamber legible without hiding complexity behind a pile of conflicting runtime declarations.
 */
.studio-toolbar {
	align-items: center !important;
	gap: 10px !important;
	padding: 10px !important;
	border-bottom: 1px solid rgba(0, 243, 255, .22) !important;
	background: linear-gradient(90deg, rgba(0, 243, 255, .08), rgba(255, 204, 0, .06), rgba(0, 0, 0, .8)) !important;
}

.studio-toolbar .modal-btn,
.studio-toolbar label.modal-btn {
	min-height: 44px !important;
	padding: 0 14px !important;
	border-radius: 999px !important;
	line-height: 1 !important;
}

.studio-preview-wrapper {
	overflow: hidden !important;
	border: 1px solid rgba(0, 243, 255, .35) !important;
	border-radius: 18px !important;
	box-shadow: inset 0 0 45px rgba(0, 243, 255, .08), 0 16px 50px rgba(0, 0, 0, .45) !important;
}

.studio-props {
	border-right: 1px solid rgba(0, 243, 255, .18) !important;
	background: linear-gradient(180deg, rgba(0, 243, 255, .05), rgba(0, 0, 0, .78)) !important;
}





:root {
	--c-black: #000000;
	--c-cyan: #00f3ff;
	--c-magenta: #ff0055;
	--c-lime: #00ff66;
	--c-yellow: #ffcc00;
	--c-white: #e0e0e0;
	--font-primary: "Courier New", monospace;
	--font-tech: "Segoe UI", sans-serif;
	--rebbe-layer-content: 10;
	--rebbe-layer-sticky: 40;
	--rebbe-layer-player: 70;
	--rebbe-layer-terminal: 90;
	--rebbe-layer-popover: 120;
	--rebbe-layer-modal: 200;
	--rebbe-layer-floating: 240;
	--rebbe-layer-fullscreen: 260;
	--rebbe-player-mobile-clearance: 132px;
	--rebbe-selection-clearance: 92px;
	--rebbe-floating-gap: 14px;
}

* {
	box-sizing: border-box;
	-webkit-tap-highlight-color: transparent;
}

body {
	display: flex;
	flex-direction: column;
	height: 100dvh;
	margin: 0;
	overflow: hidden;
	background: var(--c-black);
	color: var(--c-white);
	font-family: var(--font-primary);
}

.hidden {
	display: none !important;
}

::-webkit-scrollbar {
	width: 4px;
	height: 4px;
}

::-webkit-scrollbar-track {
	background: #000;
}

::-webkit-scrollbar-thumb {
	background: #333;
}

::-webkit-scrollbar-thumb:hover {
	background: var(--c-cyan);
}

#app-root {
	position: relative;
	z-index: var(--rebbe-layer-content);
	display: flex;
	flex-direction: column;
	height: 100%;
	min-inline-size: 0;
}

.glitch {
	position: relative;
	color: var(--c-cyan);
}

.btn-tool {
	cursor: pointer;
}

:where(input, select, textarea):focus-visible {
	outline: 2px solid var(--c-cyan);
	outline-offset: 2px;
}

#terminal-wrap {
	z-index: var(--rebbe-layer-terminal);
	display: flex;
	flex: 0 0 auto;
	flex-direction: column;
	height: 150px;
	padding: 10px;
	border-top: 2px solid var(--c-lime);
	background: rgba(0, 0, 0, .9);
}

#terminal {
	display: flex;
	flex: 1;
	flex-direction: column;
	gap: 2px;
	overflow-y: auto;
	color: var(--c-lime);
	font-size: 12px;
}
