/* Shared contract for all screens: text and controls sit directly on glass.
   Keep canvases, empty indicator spans, cover art and panel materials intact. */
:root[data-theme] body :is(h1,h2,h3,h4,h5,h6,p,label,legend,small,strong,b,em,output,summary,a,button,[role="button"],[role="tab"],[role="status"],span:not(:empty),div:not(:has(*)):not(:empty),input:not([type="range"]):not([type="checkbox"]):not([type="radio"]):not([type="color"]),textarea,select),
:root[data-theme] #root :is(h1,h2,h3,h4,h5,h6,p,label,legend,small,strong,b,em,output,summary,a,button,[role="button"],[role="tab"],[role="status"],span:not(:empty),div:not(:has(*)):not(:empty),input:not([type="range"]):not([type="checkbox"]):not([type="radio"]):not([type="color"]),textarea,select),
#vault-tool-content :is(h1,h2,h3,h4,h5,h6,p,label,legend,small,strong,b,em,output,summary,a,button,[role="button"],[role="tab"],[role="status"],span:not(:empty),div:not(:has(*)):not(:empty),input:not([type="range"]):not([type="checkbox"]):not([type="radio"]):not([type="color"]),textarea,select) {
 background-color:transparent!important;
 background-image:none!important;
 box-shadow:none!important;
 -webkit-text-stroke:0!important;
 text-shadow:none!important;
}
/* Filled primary buttons previously depended on black text on bright fills. */
:root[data-theme] body :is(button,[role="button"],.ll-file),
:root[data-theme] #root :is(button,[role="button"]),
#vault-tool-content :is(button,[role="button"]) {color:var(--reading-text,var(--text,#eef4ef))!important}
:root[data-theme] body :is(button[aria-pressed="true"],button[aria-selected="true"],button[data-state="active"],.tab.active),
:root[data-theme] #root :is(button[aria-pressed="true"],button[aria-selected="true"],button[data-state="active"]),
#vault-tool-content :is(button[aria-pressed="true"],button[aria-selected="true"],button[data-state="active"]) {
 border-color:var(--acid,#39ff14)!important;
 box-shadow:inset 0 -2px var(--acid,#39ff14)!important;
}
:root[data-theme] body .ll-record[aria-pressed="true"] {border-color:#ed5570!important;box-shadow:inset 0 -2px #ed5570!important}
:root[data-theme] body .daw-step.on {border-color:var(--acid)!important;box-shadow:inset 0 -3px var(--acid)!important}
:root[data-theme] body :is(button,a,input,select,textarea):focus-visible {outline:2px solid var(--acid,#39ff14);outline-offset:3px}
/* Text-bearing blocks used by the native and React music tools. */
:root[data-theme] body :is(.now,.now-title,.now-sub,.time,.ll-state,.ll-beat,.ll-session-state,.channel-name,.channel-number,.detail-meta,.pill,.badge),
:root[data-theme] #root :is(.badge,[data-slot="badge"]),
#vault-tool-content :is(.badge,[data-slot="badge"]) {background:transparent!important;box-shadow:none!important}
:root[data-theme] body .playerbar :is(.now,.now *, .time) {color:var(--reading-text,var(--text))!important}

/* Range bodies are transparent; the thumb/track keeps its meaningful fill. */
:root[data-theme] body input[type="range"],:root[data-theme] #root input[type="range"],#vault-tool-content input[type="range"] {background:transparent!important;box-shadow:none!important}

/* Neon lettering on transparent glass in both themes. */
html:root[data-theme][data-theme][data-theme], :host([data-theme]) {
 --reading-text:#2dff3a;--reading-muted:#2dff3a;--text:#2dff3a;--muted:#2dff3a;
 --app-foreground:#2dff3a;--app-foreground-muted:#2dff3a;--app-foreground-soft:#2dff3a;
 --foreground:124 100% 59%;--card-foreground:124 100% 59%;--muted-foreground:124 100% 59%;
}
html:root[data-theme][data-theme] body,
html:root[data-theme][data-theme] body :is(h1,h2,h3,h4,h5,h6,p,span,a,button,label,legend,small,strong,b,em,output,summary,li,td,th,dt,dd,input,textarea,select,div),
#vault-tool-content#vault-tool-content :is(h1,h2,h3,h4,h5,h6,p,span,a,button,label,legend,small,strong,b,em,output,summary,li,td,th,dt,dd,input,textarea,select,div) {
 color:#2dff3a!important;
}
/* Universal light-mode text edge, also for nested labels and generated text. */
html:root[data-theme="light"][data-theme][data-theme][data-theme] :is(body,#root),
html:root[data-theme="light"][data-theme][data-theme][data-theme] :is(body,#root) *,
html:root[data-theme="light"][data-theme][data-theme][data-theme] :is(body,#root) *::before,
html:root[data-theme="light"][data-theme][data-theme][data-theme] :is(body,#root) *::after,
html:root[data-theme="light"][data-theme][data-theme][data-theme] :is(body,#root) ::placeholder,
:host([data-theme="light"]) #vault-tool-content#vault-tool-content,
:host([data-theme="light"]) #vault-tool-content#vault-tool-content *,
:host([data-theme="light"]) #vault-tool-content#vault-tool-content *::before,
:host([data-theme="light"]) #vault-tool-content#vault-tool-content *::after,
:host([data-theme="light"]) #vault-tool-content#vault-tool-content ::placeholder {
 -webkit-text-stroke:1px #050706!important;
 paint-order:stroke fill!important;
 text-shadow:none!important;
}
/* SVG chart labels use SVG stroke; shapes and waveform paths keep their styles. */
html:root[data-theme="light"][data-theme] body svg text,
html:root[data-theme="light"][data-theme] body svg tspan,
:host([data-theme="light"]) #vault-tool-content svg text,
:host([data-theme="light"]) #vault-tool-content svg tspan {
 fill:#2dff3a!important;stroke:#050706!important;stroke-width:1px!important;
 stroke-linejoin:round;paint-order:stroke fill!important;-webkit-text-stroke:0!important;
}
input::placeholder,textarea::placeholder {color:#2dff3a!important;opacity:.8}
/* Tool identities follow the original app's lettering. */
#vault-view { --tool-heading:'Titan One',sans-serif; }
html body #vault-view :is(.headline h1,.radio-main h1),html body [data-view="vault"] {font-family:'Titan One',sans-serif!important;line-height:1.25;letter-spacing:0;font-weight:400}
#radio-view { --tool-heading:'Monoton',sans-serif; }
html body #radio-view :is(.headline h1,.radio-main h1),html body [data-view="radio"] {font-family:'Monoton',sans-serif!important;line-height:1.25;letter-spacing:0;font-weight:400}
#library-view { --tool-heading:'Pacifico',sans-serif; }
html body #library-view :is(.headline h1,.radio-main h1),html body [data-view="library"] {font-family:'Pacifico',sans-serif!important;line-height:1.25;letter-spacing:0;font-weight:400}
#sets-view { --tool-heading:'Righteous',sans-serif; }
html body #sets-view :is(.headline h1,.radio-main h1),html body [data-view="sets"] {font-family:'Righteous',sans-serif!important;line-height:1.25;letter-spacing:0;font-weight:400}
#community-view { --tool-heading:'Titan One',sans-serif; }
html body #community-view :is(.headline h1,.radio-main h1),html body [data-view="community"] {font-family:'Titan One',sans-serif!important;line-height:1.25;letter-spacing:0;font-weight:400}
#contests-view { --tool-heading:'Permanent Marker',sans-serif; }
html body #contests-view :is(.headline h1,.radio-main h1),html body [data-view="contests"] {font-family:'Permanent Marker',sans-serif!important;line-height:1.25;letter-spacing:0;font-weight:400}
#studio-view { --tool-heading:'Lobster',sans-serif; }
html body #studio-view :is(.headline h1,.radio-main h1),html body [data-view="studio"] {font-family:'Lobster',sans-serif!important;line-height:1.25;letter-spacing:0;font-weight:400}
#daw-view { --tool-heading:'Bungee',sans-serif; }
html body #daw-view :is(.headline h1,.radio-main h1),html body [data-view="daw"] {font-family:'Bungee',sans-serif!important;line-height:1.25;letter-spacing:0;font-weight:400}
#sequencer-view { --tool-heading:'Bungee',sans-serif; }
html body #sequencer-view :is(.headline h1,.radio-main h1),html body [data-view="sequencer"] {font-family:'Bungee',sans-serif!important;line-height:1.25;letter-spacing:0;font-weight:400}
#looplab-view { --tool-heading:'Righteous',sans-serif; }
html body #looplab-view :is(.headline h1,.radio-main h1),html body [data-view="looplab"] {font-family:'Righteous',sans-serif!important;line-height:1.25;letter-spacing:0;font-weight:400}
#packs-view { --tool-heading:'Righteous',sans-serif; }
html body #packs-view :is(.headline h1,.radio-main h1),html body [data-view="packs"] {font-family:'Righteous',sans-serif!important;line-height:1.25;letter-spacing:0;font-weight:400}
#tools-view { --tool-heading:'Space Mono',sans-serif; }
html body #tools-view :is(.headline h1,.radio-main h1),html body [data-view="tools"] {font-family:'Space Mono',sans-serif!important;line-height:1.25;letter-spacing:0;font-weight:400}
[data-vault-tool="/vault"] { --tool-heading:'Titan One',sans-serif; }
html body a[href="/vault"],#vault-tool-content a[href="/vault"] h3 {font-family:'Titan One',sans-serif!important}
[data-vault-tool="/radio"] { --tool-heading:'Monoton',sans-serif; }
html body a[href="/radio"],#vault-tool-content a[href="/radio"] h3 {font-family:'Monoton',sans-serif!important}
[data-vault-tool="/library"] { --tool-heading:'Pacifico',sans-serif; }
html body a[href="/library"],#vault-tool-content a[href="/library"] h3 {font-family:'Pacifico',sans-serif!important}
[data-vault-tool="/sets"] { --tool-heading:'Righteous',sans-serif; }
html body a[href="/sets"],#vault-tool-content a[href="/sets"] h3 {font-family:'Righteous',sans-serif!important}
[data-vault-tool="/community-remixes"] { --tool-heading:'Titan One',sans-serif; }
html body a[href="/community-remixes"],#vault-tool-content a[href="/community-remixes"] h3 {font-family:'Titan One',sans-serif!important}
[data-vault-tool="/contests"] { --tool-heading:'Permanent Marker',sans-serif; }
html body a[href="/contests"],#vault-tool-content a[href="/contests"] h3 {font-family:'Permanent Marker',sans-serif!important}
[data-vault-tool="/remix-studio"] { --tool-heading:'Lobster',sans-serif; }
html body a[href="/remix-studio"],#vault-tool-content a[href="/remix-studio"] h3 {font-family:'Lobster',sans-serif!important}
[data-vault-tool="/daw"] { --tool-heading:'Bungee',sans-serif; }
html body a[href="/daw"],#vault-tool-content a[href="/daw"] h3 {font-family:'Bungee',sans-serif!important}
[data-vault-tool="/packs"] { --tool-heading:'Righteous',sans-serif; }
html body a[href="/packs"],#vault-tool-content a[href="/packs"] h3 {font-family:'Righteous',sans-serif!important}
[data-vault-tool="/tools"] { --tool-heading:'Space Mono',sans-serif; }
html body a[href="/tools"],#vault-tool-content a[href="/tools"] h3 {font-family:'Space Mono',sans-serif!important}
[data-vault-tool="/stem-stacks"] { --tool-heading:'Lobster',sans-serif; }
html body a[href="/stem-stacks"],#vault-tool-content a[href="/stem-stacks"] h3 {font-family:'Lobster',sans-serif!important}
[data-vault-tool="/track-rebuild"] { --tool-heading:'Lobster',sans-serif; }
html body a[href="/track-rebuild"],#vault-tool-content a[href="/track-rebuild"] h3 {font-family:'Lobster',sans-serif!important}
[data-vault-tool="/mixdown-checker"] { --tool-heading:'Pacifico',sans-serif; }
html body a[href="/mixdown-checker"],#vault-tool-content a[href="/mixdown-checker"] h3 {font-family:'Pacifico',sans-serif!important}
[data-vault-tool="/backroom"] { --tool-heading:'Permanent Marker',sans-serif; }
html body a[href="/backroom"],#vault-tool-content a[href="/backroom"] h3 {font-family:'Permanent Marker',sans-serif!important}
[data-vault-tool="/signature-flow"] { --tool-heading:'Permanent Marker',sans-serif; }
html body a[href="/signature-flow"],#vault-tool-content a[href="/signature-flow"] h3 {font-family:'Permanent Marker',sans-serif!important}
[data-vault-tool="/gallery"] { --tool-heading:'Pacifico',sans-serif; }
html body a[href="/gallery"],#vault-tool-content a[href="/gallery"] h3 {font-family:'Pacifico',sans-serif!important}
[data-vault-tool="/set-lists"] { --tool-heading:'Bungee',sans-serif; }
html body a[href="/set-lists"],#vault-tool-content a[href="/set-lists"] h3 {font-family:'Bungee',sans-serif!important}
[data-vault-tool="/track-stamp"] { --tool-heading:'Space Mono',sans-serif; }
html body a[href="/track-stamp"],#vault-tool-content a[href="/track-stamp"] h3 {font-family:'Space Mono',sans-serif!important}
[data-vault-tool="/prompt-generator"] { --tool-heading:'Space Mono',sans-serif; }
html body a[href="/prompt-generator"],#vault-tool-content a[href="/prompt-generator"] h3 {font-family:'Space Mono',sans-serif!important}
#vault-tool-content [data-vault-tool] h1 {font-family:var(--tool-heading,'Space Mono',monospace)!important;line-height:1.3;letter-spacing:0}
html body .fav,.vault-favorite {width:44px!important;height:44px!important;display:inline-flex;align-items:center;justify-content:center;border-radius:50%!important}
.tonearm-icon {display:block;width:30px;height:30px;flex-shrink:0;pointer-events:none;transform:rotate(-16deg);transform-origin:75% 22%;transition:transform .2s ease,filter .2s ease}
.fav.on .tonearm-icon,[aria-pressed="true"] .tonearm-icon {transform:rotate(0deg);filter:drop-shadow(0 0 3px #ff8500) drop-shadow(0 0 7px #ff850080)}
#detail-fav {display:inline-flex;align-items:center;gap:8px}
@media(prefers-reduced-motion:reduce){.tonearm-icon{transition:none}}
html:root[data-theme][data-theme] body .tonearm-icon,
html:root[data-theme][data-theme] body .tonearm-icon *,
#vault-tool-content .tonearm-icon,#vault-tool-content .tonearm-icon * {color:#2dff3a!important}
html:root[data-theme][data-theme] body ::placeholder,
:host([data-theme]) #vault-tool-content ::placeholder {color:#2dff3a!important;opacity:.8}

/* Saved tracks: orange tonearm in both themes, including embedded tools. */
html:root[data-theme][data-theme] body :is(.fav.on,[aria-pressed="true"]) .tonearm-icon,
html:root[data-theme][data-theme] body :is(.fav.on,[aria-pressed="true"]) .tonearm-icon *,
#vault-tool-content#vault-tool-content [aria-pressed="true"] .tonearm-icon,
#vault-tool-content#vault-tool-content [aria-pressed="true"] .tonearm-icon * {
 color:#ff8500!important;
}
html:root[data-theme][data-theme] body :is(.fav.on,.vault-favorite[aria-pressed="true"]),
#vault-tool-content#vault-tool-content .vault-favorite[aria-pressed="true"] {
 border-color:#ff8500!important;
 box-shadow:0 0 10px #ff850040!important;
}

/* Purchase dialogs share the same transparent text and glass surfaces. */
.pack-checkout-dialog :is(p,label,details,summary,h2){background:transparent!important}