:root{
  color-scheme: light;
  --apple-bg: #f5f5f7;
  --apple-bg-gradient:
    radial-gradient(circle at 20% 15%, rgba(255,255,255,1), transparent 24rem),
    radial-gradient(circle at 82% 12%, rgba(0,113,227,.04), transparent 20rem),
    linear-gradient(180deg, rgba(255,255,255,.94), rgba(245,245,247,1));
  --apple-panel: rgba(255,255,255,.14);
  --apple-panel-strong: rgba(255,255,255,.22);
  --apple-line: rgba(255,255,255,.12);
  --apple-line-strong: rgba(255,255,255,.18);
  --apple-text: #1d1d1f;
  --apple-muted: #6e6e73;
  --apple-accent: #0071e3;
  --apple-accent-soft: rgba(0,113,227,.12);
  --apple-success: #34c759;
  --apple-danger: #ff3b30;
  --apple-control-bg: rgba(255,255,255,.06);
  --apple-control-bg-hover: rgba(255,255,255,.10);
  --apple-control-text: #1d1d1f;
  --apple-shadow: 0 12px 30px rgba(0,0,0,.04), 0 1px 0 rgba(255,255,255,.9) inset;
  --apple-radius-xl: 30px;
  --apple-radius-lg: 24px;
  --apple-radius-md: 18px;
  --apple-radius-sm: 13px;
  --apple-font: -apple-system, BlinkMacSystemFont, "SF Pro Text", "SF Pro Display", "Helvetica Neue", "Segoe UI", system-ui, sans-serif;
}

html[data-theme="dark"],
html[data-theme="night"],
html[data-theme="graphite"]{
  color-scheme: dark;
  --apple-bg: #050816;
  --apple-bg-gradient:
    radial-gradient(circle at 18% 16%, rgba(68,232,255,.10), transparent 22rem),
    radial-gradient(circle at 82% 10%, rgba(90,140,255,.14), transparent 18rem),
    linear-gradient(180deg,#070b12 0%,#04070c 48%,#020409 100%);
  --apple-panel: rgba(255,255,255,.05);
  --apple-panel-strong: rgba(255,255,255,.08);
  --apple-line: rgba(255,255,255,.10);
  --apple-line-strong: rgba(255,255,255,.16);
  --apple-text: #f4fbff;
  --apple-muted: #8fb4c8;
  --apple-accent: rgba(255,255,255,.82);
  --apple-accent-soft: rgba(255,255,255,.08);
  --apple-success: #4dff9a;
  --apple-danger: #ff6b88;
  --apple-control-bg: rgba(255,255,255,.05);
  --apple-control-bg-hover: rgba(255,255,255,.08);
  --apple-control-text: #f4fbff;
  --apple-shadow: 0 24px 72px rgba(0,0,0,.42), inset 0 1px 0 rgba(255,255,255,.06);
}

html[data-theme="tokyo"]{
  --apple-bg: #060b18;
  --apple-bg-gradient:
    radial-gradient(circle at 20% 18%, rgba(255,79,216,.14), transparent 22rem),
    radial-gradient(circle at 82% 10%, rgba(68,232,255,.12), transparent 18rem),
    radial-gradient(circle at 50% 105%, rgba(57,241,181,.08), transparent 20rem),
    linear-gradient(180deg,#060b18 0%,#050816 55%,#02040a 100%);
  --apple-panel: rgba(255,255,255,.05);
  --apple-panel-strong: rgba(255,255,255,.08);
  --apple-line: rgba(255,255,255,.10);
  --apple-line-strong: rgba(255,255,255,.16);
  --apple-accent: rgba(255,255,255,.82);
  --apple-accent-soft: rgba(255,255,255,.08);
  --apple-control-bg: rgba(255,255,255,.05);
  --apple-control-bg-hover: rgba(255,255,255,.08);
  --apple-control-text: #f4fbff;
}

html[data-theme="midnight"]{
  color-scheme: dark;
  --apple-bg: #040611;
  --apple-bg-gradient:
    radial-gradient(circle at 16% 14%, rgba(126,155,255,.13), transparent 18rem),
    radial-gradient(circle at 84% 12%, rgba(68,232,255,.10), transparent 18rem),
    linear-gradient(180deg,#050816 0%,#040611 52%,#020308 100%);
  --apple-panel: rgba(255,255,255,.05);
  --apple-panel-strong: rgba(255,255,255,.08);
  --apple-line: rgba(255,255,255,.10);
  --apple-line-strong: rgba(255,255,255,.16);
  --apple-text: #f4fbff;
  --apple-muted: #86a8be;
  --apple-accent: rgba(255,255,255,.82);
  --apple-accent-soft: rgba(255,255,255,.08);
  --apple-success: #56f0b2;
  --apple-danger: #ff6a8f;
  --apple-control-bg: rgba(255,255,255,.05);
  --apple-control-bg-hover: rgba(255,255,255,.08);
  --apple-control-text: #f4fbff;
}

html[data-theme="sunset"]{
  color-scheme: dark;
  --apple-bg: #16060f;
  --apple-bg-gradient:
    radial-gradient(circle at 18% 18%, rgba(255,106,143,.16), transparent 18rem),
    radial-gradient(circle at 80% 12%, rgba(255,184,77,.14), transparent 18rem),
    radial-gradient(circle at 50% 104%, rgba(255,79,216,.08), transparent 18rem),
    linear-gradient(180deg,#1a0710 0%,#0f0712 54%,#050408 100%);
  --apple-panel: rgba(255,255,255,.05);
  --apple-panel-strong: rgba(255,255,255,.08);
  --apple-line: rgba(255,255,255,.10);
  --apple-line-strong: rgba(255,255,255,.16);
  --apple-text: #fff4f7;
  --apple-muted: #d1a9b7;
  --apple-accent: rgba(255,255,255,.82);
  --apple-accent-soft: rgba(255,255,255,.08);
  --apple-success: #ffb84d;
  --apple-danger: #ffd36e;
  --apple-control-bg: rgba(255,255,255,.08);
  --apple-control-bg-hover: rgba(255,255,255,.12);
  --apple-control-text: #2a2210;
}

html[data-theme="forest"]{
  color-scheme: dark;
  --apple-bg: #04110b;
  --apple-bg-gradient:
    radial-gradient(circle at 20% 18%, rgba(77,255,154,.14), transparent 20rem),
    radial-gradient(circle at 80% 12%, rgba(68,232,255,.10), transparent 18rem),
    linear-gradient(180deg,#071510 0%,#03100a 56%,#020605 100%);
  --apple-panel: rgba(255,255,255,.05);
  --apple-panel-strong: rgba(255,255,255,.08);
  --apple-line: rgba(255,255,255,.10);
  --apple-line-strong: rgba(255,255,255,.16);
  --apple-text: #eefef5;
  --apple-muted: #8fb8a0;
  --apple-accent: rgba(255,255,255,.82);
  --apple-accent-soft: rgba(255,255,255,.08);
  --apple-success: rgba(255,255,255,.82);
  --apple-danger: #ff6a8f;
  --apple-control-bg: rgba(255,255,255,.05);
  --apple-control-bg-hover: rgba(255,255,255,.08);
  --apple-control-text: #eefef5;
}

html[data-theme="plum"]{
  color-scheme: dark;
  --apple-bg: #100716;
  --apple-bg-gradient:
    radial-gradient(circle at 20% 18%, rgba(160,52,125,.16), transparent 20rem),
    radial-gradient(circle at 80% 10%, rgba(126,155,255,.14), transparent 18rem),
    linear-gradient(180deg,#120816 0%,#090611 56%,#030308 100%);
  --apple-panel: rgba(255,255,255,.08);
  --apple-panel-strong: rgba(255,255,255,.12);
  --apple-line: rgba(255,255,255,.10);
  --apple-line-strong: rgba(255,255,255,.16);
  --apple-text: #fbf4ff;
  --apple-muted: #c7b0d4;
  --apple-accent: rgba(255,255,255,.82);
  --apple-accent-soft: rgba(255,255,255,.08);
  --apple-success: rgba(255,255,255,.82);
  --apple-danger: #ff6a8f;
  --apple-control-bg: rgba(255,255,255,.08);
  --apple-control-bg-hover: rgba(255,255,255,.14);
  --apple-control-text: #fbf4ff;
}

html[data-theme="solar"]{
  color-scheme: light;
  --apple-bg: #f7f0df;
  --apple-bg-gradient:
    radial-gradient(circle at 18% 16%, rgba(245,164,0,.10), transparent 20rem),
    radial-gradient(circle at 82% 12%, rgba(255,255,255,.76), transparent 18rem),
    linear-gradient(180deg,#fff8ea 0%,#f7f0df 54%,#ede1c7 100%);
  --apple-panel: rgba(255,255,255,.10);
  --apple-panel-strong: rgba(255,255,255,.16);
  --apple-line: rgba(255,255,255,.16);
  --apple-line-strong: rgba(255,255,255,.24);
  --apple-text: #2a2210;
  --apple-muted: #6f6240;
  --apple-accent: rgba(255,255,255,.82);
  --apple-accent-soft: rgba(255,255,255,.08);
  --apple-success: rgba(255,255,255,.82);
  --apple-danger: #c6442d;
  --apple-control-bg: rgba(255,255,255,.05);
  --apple-control-bg-hover: rgba(255,255,255,.08);
  --apple-control-text: #2a2210;
}

html[data-theme="system"]{
  color-scheme: light dark;
}

html, body{
  background: var(--apple-bg) !important;
  color: var(--apple-text);
  font-family: var(--apple-font) !important;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

body{
  background:
    var(--apple-bg-gradient),
    var(--apple-bg) !important;
  padding: env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);
}

body::before,
.grid,
.gridlines,
.scan-open-overlay,
.topbar::before,
.portal::before,
.portal::after{
  display:none !important;
}

a, button, input, textarea, select{
  font-family: inherit !important;
}

.panel,
.card,
.article,
.toolbar,
.topbar,
.dock-panel,
.portal,
.desktop,
.dropbox-shell,
.dropbox-sidebar,
.dropbox-sidepanel,
.library-wrap,
.queue-panel,
.modal,
.suggestion,
.issue,
.stat,
.preview-card,
.song,
.file-row,
.doc-card,
.note-item,
.outline-item{
  background: var(--apple-panel) !important;
  backdrop-filter: blur(24px) saturate(1.16);
  -webkit-backdrop-filter: blur(24px) saturate(1.16);
  border: 1px solid var(--apple-line) !important;
  border-radius: var(--apple-radius-xl) !important;
  box-shadow: var(--apple-shadow) !important;
}

.desktop,
.portal,
.panel,
.card,
.article,
.toolbar,
.topbar,
.dock-panel,
.library-wrap,
.queue-panel,
.modal,
.sidebar,
.sidebar-card{
  background: var(--apple-panel-strong) !important;
}

.hero,
.main,
.main-stack,
.view,
.column,
.layout{
  gap: 16px !important;
}

.panel-head,
.card-head,
.topbar,
.toolbar,
.library-head,
.queue-head,
.modal-header{
  background: rgba(255,255,255,.08) !important;
  border-color: var(--apple-line) !important;
}

.hero,
.desktop,
.portal,
.main,
.main-stack,
.toolbar,
.topbar,
.dock-panel,
.library-wrap,
.queue-panel,
.sidebar,
.panel,
.card,
.article,
.modal{
  border-radius: 28px !important;
}

.btn,
.pill,
.chip,
.mode-btn,
.nav-btn,
.swatch,
.badge{
  border-radius: 999px !important;
  border: 1px solid var(--apple-line) !important;
  background: var(--apple-control-bg) !important;
  color: var(--apple-control-text) !important;
  box-shadow: none !important;
}

.btn,
.pill,
.chip,
.mode-btn,
.nav-btn,
.swatch{
  transition: transform .16s ease, background-color .16s ease, border-color .16s ease, box-shadow .16s ease, opacity .16s ease;
}

.btn,
.pill,
.chip,
.mode-btn,
.nav-btn{
  min-height: 44px !important;
  padding-left: 14px !important;
  padding-right: 14px !important;
}

.btn:hover,
.pill:hover,
.chip:hover,
.mode-btn:hover,
.nav-btn:hover{
  transform: translateY(-1px);
  border-color: var(--apple-line-strong) !important;
  background: var(--apple-control-bg-hover) !important;
}

.btn.primary,
.pill.primary,
.mode-btn.active,
.nav-btn.active,
.swatch.active{
  background: rgba(255,255,255,.16) !important;
  color: var(--apple-text) !important;
  border-color: rgba(255,255,255,.18) !important;
}

html[data-theme="solar"] .btn.primary,
html[data-theme="solar"] .pill.primary,
html[data-theme="solar"] .mode-btn.active,
html[data-theme="solar"] .nav-btn.active,
html[data-theme="solar"] .swatch.active{
  color: var(--apple-text) !important;
}

.btn.danger{
  color: var(--apple-text) !important;
  background: rgba(255,255,255,.10) !important;
  border-color: rgba(255,255,255,.14) !important;
}

.input,
.textarea,
.select,
input,
textarea,
select{
  background: var(--apple-control-bg) !important;
  color: var(--apple-text) !important;
  border: 1px solid var(--apple-line-strong) !important;
  border-radius: var(--apple-radius-md) !important;
  box-shadow: none !important;
}

.input:focus,
.textarea:focus,
.select:focus,
input:focus,
textarea:focus,
select:focus{
  border-color: rgba(0,113,227,.34) !important;
  box-shadow: 0 0 0 3px rgba(0,113,227,.09) !important;
}

html[data-theme="tokyo"] .panel,
html[data-theme="tokyo"] .card,
html[data-theme="tokyo"] .toolbar,
html[data-theme="tokyo"] .topbar,
html[data-theme="tokyo"] .desktop,
html[data-theme="tokyo"] .portal{
  box-shadow: 0 20px 52px rgba(0,0,0,.42), 0 0 0 1px rgba(255,79,216,.08) !important;
}

html[data-theme="forest"] .panel,
html[data-theme="forest"] .card,
html[data-theme="forest"] .toolbar,
html[data-theme="forest"] .topbar,
html[data-theme="forest"] .desktop,
html[data-theme="forest"] .portal{
  box-shadow: 0 20px 52px rgba(0,0,0,.42), 0 0 0 1px rgba(77,255,154,.08) !important;
}

html[data-theme="sunset"] .panel,
html[data-theme="sunset"] .card,
html[data-theme="sunset"] .toolbar,
html[data-theme="sunset"] .topbar,
html[data-theme="sunset"] .desktop,
html[data-theme="sunset"] .portal{
  box-shadow: 0 20px 52px rgba(0,0,0,.24), 0 0 0 1px rgba(255,124,158,.12) !important;
}

.muted,
.file-name span,
.file-meta,
.sub,
.lede,
.preview-text,
.issue small,
.stat span,
.empty,
.dropbox-empty,
.credit-tag{
  color: var(--apple-muted) !important;
}

h1, h2, h3, h4, .title, .headline, .panel-head h2, .card-head h2, .gate-top h2, .dock-head h2{
  font-family: var(--apple-font) !important;
  letter-spacing: -.02em !important;
  font-weight: 600 !important;
}

.headline{
  line-height: .92 !important;
  font-weight: 700 !important;
}

.orb,
.brand-mark,
.badge::before{
  box-shadow: none !important;
}

.orb,
.brand-mark{
  background: linear-gradient(135deg, #ffffff, #e5e5ea) !important;
  border: 1px solid rgba(60,60,67,.12);
  position: relative;
}

.orb::after,
.brand-mark::after{
  content:"";
  position:absolute;
  inset:22%;
  border-radius:50%;
  background: radial-gradient(circle at 35% 30%, rgba(255,255,255,.96), rgba(255,255,255,.6) 42%, rgba(0,0,0,.02) 100%);
  box-shadow: inset 0 1px 2px rgba(255,255,255,.7);
}

.eyebrow,
.badge{
  background: var(--apple-control-bg) !important;
  color: var(--apple-muted) !important;
  border-color: rgba(60,60,67,.08) !important;
  letter-spacing: .08em !important;
}

/* Tablet-first page tuning for the main surfaces */
body :is(.topbar, .toolbar, .panel, .card, .article, .dock-panel, .sidebar, .sidebar-card, .library-wrap, .queue-panel, .modal, .hero-grid, .main, .main-stack, .view){
  border-radius: 24px !important;
}

body :is(.btn, .pill, .chip, .mode-btn, .nav-btn, .input, .textarea, .select, input, textarea, select){
  border-radius: 16px !important;
}

body :is(.title, .headline, .panel-head h2, .card-head h2, .gate-top h2, .dock-head h2){
  font-weight: 600 !important;
  letter-spacing: -.02em !important;
}

body, .portal, .desktop, .panel, .card, .article, .toolbar, .topbar, .dock-panel, .library-wrap, .queue-panel, .modal{
  border-radius: 24px !important;
}

body{
  padding: env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);
}

html[data-theme="dark"] body,
html[data-theme="night"] body,
html[data-theme="graphite"] body,
html[data-theme="tokyo"] body,
html[data-theme="midnight"] body,
html[data-theme="forest"] body,
html[data-theme="plum"] body{
  color: var(--apple-text) !important;
}

html[data-theme="light"] body,
html[data-theme="solar"] body{
  color: var(--apple-text) !important;
}

button, .btn, .pill, .chip, .mode-btn, .nav-btn{
  min-height: 44px;
}

html[data-theme="dark"] :is(.topbar, .toolbar, .panel, .card, .article, .dock-panel, .sidebar, .sidebar-card, .library-wrap, .queue-panel, .modal, .portal, .desktop),
html[data-theme="night"] :is(.topbar, .toolbar, .panel, .card, .article, .dock-panel, .sidebar, .sidebar-card, .library-wrap, .queue-panel, .modal, .portal, .desktop),
html[data-theme="graphite"] :is(.topbar, .toolbar, .panel, .card, .article, .dock-panel, .sidebar, .sidebar-card, .library-wrap, .queue-panel, .modal, .portal, .desktop),
html[data-theme="tokyo"] :is(.topbar, .toolbar, .panel, .card, .article, .dock-panel, .sidebar, .sidebar-card, .library-wrap, .queue-panel, .modal, .portal, .desktop),
html[data-theme="midnight"] :is(.topbar, .toolbar, .panel, .card, .article, .dock-panel, .sidebar, .sidebar-card, .library-wrap, .queue-panel, .modal, .portal, .desktop),
html[data-theme="forest"] :is(.topbar, .toolbar, .panel, .card, .article, .dock-panel, .sidebar, .sidebar-card, .library-wrap, .queue-panel, .modal, .portal, .desktop),
html[data-theme="plum"] :is(.topbar, .toolbar, .panel, .card, .article, .dock-panel, .sidebar, .sidebar-card, .library-wrap, .queue-panel, .modal, .portal, .desktop),
html[data-theme="sunset"] :is(.topbar, .toolbar, .panel, .card, .article, .dock-panel, .sidebar, .sidebar-card, .library-wrap, .queue-panel, .modal, .portal, .desktop){
  color: var(--apple-text) !important;
}

html[data-theme="dark"] :is(.sub, .lede, .muted, .small, .credit-tag, .file-meta, .issue small, .stat span, .empty, .dropbox-empty),
html[data-theme="night"] :is(.sub, .lede, .muted, .small, .credit-tag, .file-meta, .issue small, .stat span, .empty, .dropbox-empty),
html[data-theme="graphite"] :is(.sub, .lede, .muted, .small, .credit-tag, .file-meta, .issue small, .stat span, .empty, .dropbox-empty),
html[data-theme="tokyo"] :is(.sub, .lede, .muted, .small, .credit-tag, .file-meta, .issue small, .stat span, .empty, .dropbox-empty),
html[data-theme="midnight"] :is(.sub, .lede, .muted, .small, .credit-tag, .file-meta, .issue small, .stat span, .empty, .dropbox-empty),
html[data-theme="forest"] :is(.sub, .lede, .muted, .small, .credit-tag, .file-meta, .issue small, .stat span, .empty, .dropbox-empty),
html[data-theme="plum"] :is(.sub, .lede, .muted, .small, .credit-tag, .file-meta, .issue small, .stat span, .empty, .dropbox-empty),
html[data-theme="sunset"] :is(.sub, .lede, .muted, .small, .credit-tag, .file-meta, .issue small, .stat span, .empty, .dropbox-empty){
  color: var(--apple-muted) !important;
}

html[data-theme="light"] :is(.topbar, .toolbar, .panel, .card, .article, .dock-panel, .sidebar, .sidebar-card, .library-wrap, .queue-panel, .modal, .portal, .desktop, .btn, .pill, .chip, .mode-btn, .nav-btn, .input, .textarea, .select, input, textarea, select),
html[data-theme="solar"] :is(.topbar, .toolbar, .panel, .card, .article, .dock-panel, .sidebar, .sidebar-card, .library-wrap, .queue-panel, .modal, .portal, .desktop, .btn, .pill, .chip, .mode-btn, .nav-btn, .input, .textarea, .select, input, textarea, select){
  box-shadow: 0 14px 34px rgba(0,0,0,.08) !important;
}

html[data-theme="light"] :is(.hero, .card, .panel, .topbar, .toolbar, .desktop, .portal, .dock-panel, .library-wrap, .queue-panel, .modal, .sidebar, .sidebar-card),
html[data-theme="solar"] :is(.hero, .card, .panel, .topbar, .toolbar, .desktop, .portal, .dock-panel, .library-wrap, .queue-panel, .modal, .sidebar, .sidebar-card){
  background: var(--apple-panel-strong) !important;
  color: var(--apple-text) !important;
}

html[data-theme="dark"] :is(.hero, .card, .panel, .topbar, .toolbar, .desktop, .portal, .dock-panel, .library-wrap, .queue-panel, .modal, .sidebar, .sidebar-card),
html[data-theme="night"] :is(.hero, .card, .panel, .topbar, .toolbar, .desktop, .portal, .dock-panel, .library-wrap, .queue-panel, .modal, .sidebar, .sidebar-card),
html[data-theme="graphite"] :is(.hero, .card, .panel, .topbar, .toolbar, .desktop, .portal, .dock-panel, .library-wrap, .queue-panel, .modal, .sidebar, .sidebar-card),
html[data-theme="tokyo"] :is(.hero, .card, .panel, .topbar, .toolbar, .desktop, .portal, .dock-panel, .library-wrap, .queue-panel, .modal, .sidebar, .sidebar-card),
html[data-theme="midnight"] :is(.hero, .card, .panel, .topbar, .toolbar, .desktop, .portal, .dock-panel, .library-wrap, .queue-panel, .modal, .sidebar, .sidebar-card),
html[data-theme="forest"] :is(.hero, .card, .panel, .topbar, .toolbar, .desktop, .portal, .dock-panel, .library-wrap, .queue-panel, .modal, .sidebar, .sidebar-card),
html[data-theme="plum"] :is(.hero, .card, .panel, .topbar, .toolbar, .desktop, .portal, .dock-panel, .library-wrap, .queue-panel, .modal, .sidebar, .sidebar-card),
html[data-theme="sunset"] :is(.hero, .card, .panel, .topbar, .toolbar, .desktop, .portal, .dock-panel, .library-wrap, .queue-panel, .modal, .sidebar, .sidebar-card){
  background: var(--apple-panel) !important;
  color: var(--apple-text) !important;
}

html[data-theme="light"] :is(h1,h2,h3,h4,h5,h6,.title,.headline,.card-head strong,.panel-head strong,.label,.brand h1,.brand p,.sub,.lede,.note,.meta,.hint,.credit-tag,.file-meta,.muted),
html[data-theme="solar"] :is(h1,h2,h3,h4,h5,h6,.title,.headline,.card-head strong,.panel-head strong,.label,.brand h1,.brand p,.sub,.lede,.note,.meta,.hint,.credit-tag,.file-meta,.muted){
  color: var(--apple-text) !important;
}

html[data-theme="dark"] :is(h1,h2,h3,h4,h5,h6,.title,.headline,.card-head strong,.panel-head strong,.label,.brand h1,.brand p,.sub,.lede,.note,.meta,.hint,.credit-tag,.file-meta,.muted),
html[data-theme="night"] :is(h1,h2,h3,h4,h5,h6,.title,.headline,.card-head strong,.panel-head strong,.label,.brand h1,.brand p,.sub,.lede,.note,.meta,.hint,.credit-tag,.file-meta,.muted),
html[data-theme="graphite"] :is(h1,h2,h3,h4,h5,h6,.title,.headline,.card-head strong,.panel-head strong,.label,.brand h1,.brand p,.sub,.lede,.note,.meta,.hint,.credit-tag,.file-meta,.muted),
html[data-theme="tokyo"] :is(h1,h2,h3,h4,h5,h6,.title,.headline,.card-head strong,.panel-head strong,.label,.brand h1,.brand p,.sub,.lede,.note,.meta,.hint,.credit-tag,.file-meta,.muted),
html[data-theme="midnight"] :is(h1,h2,h3,h4,h5,h6,.title,.headline,.card-head strong,.panel-head strong,.label,.brand h1,.brand p,.sub,.lede,.note,.meta,.hint,.credit-tag,.file-meta,.muted),
html[data-theme="forest"] :is(h1,h2,h3,h4,h5,h6,.title,.headline,.card-head strong,.panel-head strong,.label,.brand h1,.brand p,.sub,.lede,.note,.meta,.hint,.credit-tag,.file-meta,.muted),
html[data-theme="plum"] :is(h1,h2,h3,h4,h5,h6,.title,.headline,.card-head strong,.panel-head strong,.label,.brand h1,.brand p,.sub,.lede,.note,.meta,.hint,.credit-tag,.file-meta,.muted),
html[data-theme="sunset"] :is(h1,h2,h3,h4,h5,h6,.title,.headline,.card-head strong,.panel-head strong,.label,.brand h1,.brand p,.sub,.lede,.note,.meta,.hint,.credit-tag,.file-meta,.muted){
  color: var(--apple-text) !important;
}

.footer{
  color: var(--apple-muted) !important;
}

@media (max-width: 900px){
  .panel,
  .card,
  .toolbar,
  .topbar,
  .dock-panel{
    border-radius: 22px !important;
  }
}

:root{
  --celoverse-wallpaper: none;
  --celoverse-wallpaper-zoom: 0.92;
  --celoverse-glass-bg: rgba(255,255,255,.42);
  --celoverse-glass-strong: rgba(255,255,255,.56);
  --celoverse-glass-line: rgba(60,60,67,.10);
}

html, body{
  min-height:100%;
  background:transparent !important;
}

body{
  position:relative;
  isolation:isolate;
  overflow-x:hidden;
  background-image: var(--celoverse-wallpaper) !important;
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  background-attachment: fixed !important;
}

body::before,
body::after{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
}

body::before{
  z-index:-2;
  background-image:
    linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.10));
  background-size:cover;
  background-position:center center;
  background-repeat:no-repeat;
  background-attachment:fixed;
  filter:saturate(1.06) contrast(1.02);
  transform:scale(var(--celoverse-wallpaper-zoom));
}

body::after{
  z-index:-1;
  background:
    radial-gradient(circle at 12% 8%, rgba(255,255,255,.08), transparent 18rem),
    radial-gradient(circle at 84% 12%, rgba(255,255,255,.04), transparent 16rem),
    linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,.08));
}

body, body *{
  text-shadow:none;
}

body :is(.portal, .desktop, .panel, .card, .article, .toolbar, .topbar, .dock-panel, .library-wrap, .queue-panel, .modal, .sidebar, .sidebar-card, .browser-toolbar, .browser-window, .menu-group, .gate-card, .doc-card, .song, .file-row, .note-item, .outline-item, .preview-card, .issue, .stat, .hero-grid, .main, .main-stack, .view, .wallpaper-shell, .wallpaper-card){
  background:rgba(255,255,255,.07) !important;
  border-color:var(--celoverse-glass-line) !important;
  backdrop-filter:blur(24px) saturate(1.16);
  -webkit-backdrop-filter:blur(24px) saturate(1.16);
  box-shadow:0 18px 54px rgba(0,0,0,.14) !important;
}

body :is(.portal, .desktop, .panel, .card, .article, .toolbar, .topbar, .dock-panel, .library-wrap, .queue-panel, .modal, .sidebar, .sidebar-card){
  background:rgba(255,255,255,.08) !important;
}

body :is(.btn, .pill, .chip, .mode-btn, .nav-btn, .input, .textarea, .select, input, textarea, select, button){
  background:rgba(255,255,255,.05) !important;
  border-color:var(--celoverse-glass-line) !important;
  color:inherit !important;
}

body :is(.btn.primary, .pill.primary, .mode-btn.active, .nav-btn.active, .control.primary-action, .cta, .search-mode.active){
  background:rgba(255,255,255,.05) !important;
  color:inherit !important;
  border-color:var(--celoverse-glass-line) !important;
}

body :is(.hero, .gate, .gate-card, .panel-inner, .content, .topbar, .toolbar, .browser-toolbar, .wallpaper-shell){
  color:inherit !important;
}

body :is(.sub, .lede, .muted, .small, .credit-tag, .file-meta, .issue small, .stat span, .empty, .dropbox-empty, .hint, .meta, .sub, .status){
  color:inherit !important;
  opacity:.74;
}

body :is(.theme-swatch){
  display:none !important;
}
