:root{
  --bg:#05030a;
  --surface:rgba(10,7,20,.62);
  --surface-strong:rgba(8,5,17,.86);
  --surface-soft:rgba(255,255,255,.035);
  --text:#f8f3ff;
  --muted:#9d93ad;
  --line:rgba(255,255,255,.105);
  --magenta:#ff35da;
  --violet:#9a5cff;
  --cyan:#20e7ff;
  --accent:var(--magenta);
  --glow:0 0 28px rgba(255,53,218,.24);
  --radius:18px;
  --gx:0;
  --gy:0;
  --signal-level:0;
  --signal-bass:0;
  --signal-high:0;
  --splash-halo-size:112%;
  --splash-vortex-size:62%;
  --splash-mic-width:48%;
  --splash-mic-top:68%;
  --splash-skull-size:81%;
}
*{box-sizing:border-box}
html,body{margin:0;min-width:100%;min-height:100%;background:#000;color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
body{overflow-x:hidden}
button,input,select{font:inherit}
button{color:inherit}
#app{
  min-height:100svh;
  isolation:isolate;
  position:relative;
  background:
    radial-gradient(circle at 50% 25%,rgba(128,31,155,.18),transparent 34%),
    linear-gradient(180deg,#08040e,#030205 75%);
}
#visual-stage{position:fixed;inset:0;z-index:-2;overflow:hidden;background:#000}
#visualizer-canvas{position:absolute;inset:0;width:100%;height:100%;z-index:20;pointer-events:auto;touch-action:none;user-select:none;-webkit-user-select:none}
#visualizer-name{
  position:absolute;right:18px;bottom:15px;z-index:30;font:600 9px/1 ui-monospace,Consolas,monospace;
  letter-spacing:.16em;color:rgba(255,255,255,.42);text-transform:uppercase
}
#splash-backdrop{position:absolute;inset:0;overflow:hidden;background:#000;perspective:950px;isolation:isolate}
.splash-layer{position:absolute;pointer-events:none;user-select:none;-webkit-user-drag:none}
.splash-bg{
  z-index:1;inset:-8%;width:116%;height:116%;object-fit:cover;
  filter:saturate(calc(1.02 + var(--signal-level)*.28)) contrast(1.05) brightness(calc(.46 + var(--signal-level)*.36));
  transform:translate3d(calc(var(--gx)*-4px),calc(var(--gy)*-4px),-45px) scale(1.08);
  transition:filter 120ms linear
}
.splash-scene{
  position:absolute;left:50%;top:50%;width:108vmin;height:108vmin;transform:translate(-50%,-50%);
  transform-origin:50% 50%;transform-style:preserve-3d;pointer-events:none;z-index:5
}
.splash-portal{position:absolute;inset:0;display:grid;place-items:center;pointer-events:none;transform-style:preserve-3d}
.splash-vortex-wrap{
  z-index:10;
  transform:translate3d(calc(var(--gx)*-7px),calc(var(--gy)*-7px),-70px) scale(calc(1 + var(--signal-bass)*.035))
}
.splash-halo-wrap{
  z-index:15;
  transform:translate3d(calc(var(--gx)*-7px),calc(var(--gy)*-7px),-25px) scale(calc(1 + var(--signal-bass)*.05));
  filter:brightness(calc(.52 + var(--signal-level)*1.05))
}
.splash-vortex{width:var(--splash-vortex-size);height:auto;object-fit:contain;transform-origin:50% 50%;animation:vortexSpin 7s linear infinite}
.splash-halo{width:var(--splash-halo-size);height:auto;object-fit:contain;transform-origin:50% 50%;animation:haloSpin 58s linear infinite}
.splash-skull-wrap{
  position:absolute;inset:0;z-index:30;display:grid;place-items:center;
  transform:translate3d(calc(var(--gx)*16px),calc(var(--gy)*16px),78px)
}
.splash-skull{
  width:var(--splash-skull-size);height:var(--splash-skull-size);object-fit:contain;
  filter:brightness(calc(.62 + var(--signal-level)*.48)) saturate(calc(.9 + var(--signal-level)*.4))
}
.splash-mics{
  z-index:40;width:var(--splash-mic-width);height:auto;left:50%;top:var(--splash-mic-top);
  transform:translate3d(calc(-50% + var(--gx)*22px),calc(-50% + var(--gy)*22px),108px)
}
.splash-fx{
  z-index:50;inset:-3%;width:106%;height:106%;object-fit:cover;opacity:calc(.22 + var(--signal-high)*.42);
  mix-blend-mode:screen;transform:translate3d(calc(var(--gx)*26px),calc(var(--gy)*26px),158px) scale(1.06)
}
.splash-vignette{
  position:absolute;inset:0;z-index:70;pointer-events:none;
  background:radial-gradient(ellipse at 50% 44%,transparent 0 43%,rgba(0,0,0,.12) 65%,rgba(0,0,0,.78) 100%),
             linear-gradient(to bottom,rgba(0,0,0,.26),transparent 16%,transparent 76%,rgba(0,0,0,.72))
}
@keyframes vortexSpin{from{rotate:0deg}to{rotate:360deg}}
@keyframes haloSpin{from{rotate:0deg}to{rotate:360deg}}
#topbar{
  height:82px;display:grid;grid-template-columns:auto minmax(240px,680px) auto;gap:22px;align-items:center;
  padding:14px clamp(16px,3vw,44px);position:sticky;top:0;z-index:100;
  background:linear-gradient(180deg,rgba(3,2,7,.92),rgba(3,2,7,.58),transparent);
  backdrop-filter:blur(12px)
}
.brand-button{appearance:none;border:0;background:none;text-align:left;cursor:pointer;padding:0;display:flex;flex-direction:column}
.brand-kicker{font:700 9px/1 ui-monospace,Consolas,monospace;letter-spacing:.23em;color:var(--cyan)}
.brand-name{font:800 clamp(13px,1.6vw,20px)/1.1 ui-monospace,Consolas,monospace;letter-spacing:.08em;margin-top:5px}
.search-shell{
  height:44px;border:1px solid var(--line);border-radius:999px;background:rgba(9,6,16,.65);display:flex;align-items:center;
  gap:10px;padding:0 14px;box-shadow:inset 0 0 24px rgba(255,255,255,.02)
}
.search-shell:focus-within{border-color:rgba(32,231,255,.38);box-shadow:0 0 0 3px rgba(32,231,255,.06)}
.search-shell input{width:100%;border:0;outline:0;background:none;color:var(--text)}
.search-shell input::placeholder{color:#77707e}
.search-glyph{font-size:20px;color:var(--cyan)}
.search-shell kbd{font:600 10px/1 ui-monospace,monospace;border:1px solid var(--line);border-radius:5px;padding:4px 6px;color:#8e8795}
.top-actions{display:flex;gap:8px;justify-content:flex-end}
.ghost-button{
  border:1px solid var(--line);border-radius:999px;background:rgba(6,4,12,.72);padding:10px 14px;
  font:700 9px/1 ui-monospace,Consolas,monospace;letter-spacing:.12em;cursor:pointer
}
.ghost-button:hover{border-color:rgba(255,53,218,.4);box-shadow:var(--glow)}
#workspace{
  display:grid;grid-template-columns:minmax(280px,400px) minmax(0,1fr);gap:clamp(18px,3vw,44px);
  padding:18px clamp(16px,3vw,44px) 130px;max-width:1500px;margin:0 auto
}
.glass-panel{
  border:1px solid var(--line);background:var(--surface);backdrop-filter:blur(22px) saturate(1.15);
  box-shadow:inset 0 1px rgba(255,255,255,.035),0 30px 80px rgba(0,0,0,.22);border-radius:var(--radius)
}
#library-panel{min-height:590px;padding:22px}
.panel-heading{display:flex;justify-content:space-between;align-items:flex-end;border-bottom:1px solid var(--line);padding-bottom:16px}
.eyebrow{font:700 9px/1 ui-monospace,Consolas,monospace;letter-spacing:.18em;color:var(--cyan);text-transform:uppercase}
h1{margin:7px 0 0;font-size:26px;letter-spacing:-.03em}
.count-chip{border:1px solid var(--line);border-radius:999px;padding:6px 9px;font:600 10px/1 ui-monospace,monospace;color:var(--muted)}
.search-status{font-size:12px;color:var(--muted);padding:15px 3px 10px}
.track-list{display:flex;flex-direction:column;gap:6px}
.track-row{
  width:100%;border:1px solid transparent;border-radius:12px;background:transparent;color:var(--text);display:grid;
  grid-template-columns:36px minmax(0,1fr) auto;gap:10px;align-items:center;text-align:left;padding:9px;cursor:pointer
}
.track-row:hover{background:var(--surface-soft);border-color:var(--line)}
.track-row.active{background:rgba(255,53,218,.07);border-color:rgba(255,53,218,.24)}
.track-index{font:600 10px/1 ui-monospace,monospace;color:#716879}
.track-copy{min-width:0}
.track-copy strong,.track-copy span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.track-copy strong{font-size:13px}
.track-copy span{font-size:11px;color:var(--muted);margin-top:3px}
.track-kind{font:600 9px/1 ui-monospace,monospace;color:#726b79}
#now-panel{min-height:590px;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:24px;position:relative}
#art-frame{
  width:min(54vh,440px,72vw);aspect-ratio:1;border-radius:24px;overflow:hidden;position:relative;
  box-shadow:0 42px 110px rgba(0,0,0,.5),0 0 70px rgba(255,53,218,.08);border:1px solid rgba(255,255,255,.1)
}
#album-art{width:100%;height:100%;object-fit:cover}
.art-placeholder{
  position:absolute;inset:0;display:grid;place-items:center;background:
  radial-gradient(circle at center,rgba(255,53,218,.17),transparent 28%),
  radial-gradient(circle at 70% 20%,rgba(32,231,255,.08),transparent 26%),#08050c
}
.art-orbit{position:absolute;width:62%;aspect-ratio:1;border:1px solid rgba(255,255,255,.12);border-radius:50%;box-shadow:0 0 35px rgba(255,53,218,.18)}
.art-orbit:after{content:"";position:absolute;inset:14%;border:1px dashed rgba(32,231,255,.18);border-radius:50%;animation:haloSpin 18s linear infinite}
.art-mark{font:200 96px/1 Georgia,serif;color:rgba(255,255,255,.82);text-shadow:0 0 35px rgba(255,53,218,.5)}
.art-copy{position:absolute;bottom:24px;font:700 9px/1 ui-monospace,monospace;letter-spacing:.24em;color:rgba(255,255,255,.4)}
#now-copy{text-align:center;margin-top:24px}
#now-title{font-size:clamp(23px,3vw,38px);font-weight:780;letter-spacing:-.035em;margin-top:7px}
#now-artist{color:var(--muted);font-size:13px;margin-top:6px}
.transport-main{display:flex;gap:13px;align-items:center;margin-top:20px}
.icon-button,.mini-button{
  border:0;background:transparent;color:#b9b0c2;cursor:pointer;width:35px;height:35px;border-radius:50%
}
.icon-button:hover,.mini-button:hover{background:rgba(255,255,255,.07);color:#fff}
.icon-button.large{font-size:15px}
.play-button,.mini-play{
  border:1px solid rgba(255,255,255,.24);background:linear-gradient(145deg,rgba(255,255,255,.16),rgba(255,255,255,.055));
  width:58px;height:58px;border-radius:50%;cursor:pointer;box-shadow:0 0 36px rgba(255,53,218,.14)
}
.play-button:hover,.mini-play:hover{border-color:rgba(255,53,218,.6);box-shadow:0 0 42px rgba(255,53,218,.28)}
.progress-row{width:min(610px,90%);display:grid;grid-template-columns:42px minmax(0,1fr) 42px;align-items:center;gap:10px;margin-top:17px;color:var(--muted);font:600 9px/1 ui-monospace,monospace}
input[type="range"]{accent-color:var(--accent)}
.secondary-controls{
  width:min(900px,96%);margin-top:22px;padding:12px;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px
}
.secondary-controls label{display:flex;flex-direction:column;gap:6px;min-width:0}
.secondary-controls label>span{font:700 8px/1 ui-monospace,monospace;letter-spacing:.13em;color:#817888}
.secondary-controls select{
  min-width:0;width:100%;border:1px solid var(--line);border-radius:9px;background:#0b0710;color:#dcd4e2;padding:8px 7px;
  font:600 9px/1 ui-monospace,monospace
}
.volume-control input{width:100%}
#mini-player{
  position:fixed;z-index:150;left:50%;bottom:max(18px,env(safe-area-inset-bottom));transform:translateX(-50%);
  width:min(780px,calc(100vw - 28px));height:68px;padding:9px;display:grid;grid-template-columns:48px minmax(0,1fr) 38px 48px 38px minmax(80px,180px) 38px 38px;
  gap:6px;align-items:center
}
.mini-art{width:48px;height:48px;border-radius:10px;display:grid;place-items:center;background:radial-gradient(circle,#3c133b,#09060e);border:1px solid var(--line)}
.mini-copy{display:flex;flex-direction:column;min-width:0}
.mini-copy strong,.mini-copy span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mini-copy strong{font-size:12px}
.mini-copy span{font-size:10px;color:var(--muted);margin-top:4px}
.mini-play{width:42px;height:42px}
.mini-progress{height:3px;border-radius:999px;background:rgba(255,255,255,.11);overflow:hidden}
#mini-progress-fill{height:100%;width:0;background:linear-gradient(90deg,var(--magenta),var(--cyan))}
#collapsed-player{
  position:fixed;z-index:160;right:18px;bottom:max(18px,env(safe-area-inset-bottom));height:44px;border:1px solid var(--line);border-radius:999px;
  padding:0 14px;background:rgba(7,4,12,.84);backdrop-filter:blur(16px);color:#fff;display:none;align-items:center;gap:8px;cursor:pointer
}
.pulse-dot{width:7px;height:7px;border-radius:50%;background:var(--magenta);box-shadow:0 0 14px var(--magenta)}
.collapsed-label{font:700 9px/1 ui-monospace,monospace;letter-spacing:.13em}
#presentation-overlay{display:none}
#toast{
  position:fixed;z-index:300;left:50%;bottom:100px;transform:translate(-50%,15px);opacity:0;pointer-events:none;
  border:1px solid var(--line);border-radius:999px;padding:9px 14px;background:rgba(4,3,8,.88);font:600 10px/1 ui-monospace,monospace;
  transition:.2s ease
}
#toast.show{opacity:1;transform:translate(-50%,0)}
/* Artwork mode */
#app[data-mode="artwork"] #library-panel,
#app[data-mode="artwork"] .secondary-controls{display:none}
#app[data-mode="artwork"] #workspace{grid-template-columns:1fr}
#app[data-mode="artwork"] #now-panel{min-height:calc(100svh - 90px)}
/* Visualizer mode */
#app[data-mode="visualizer"] #workspace,
#app[data-mode="visualizer"] #topbar{opacity:0;pointer-events:none}
#app[data-mode="visualizer"] #mini-player{opacity:.9}
#app[data-mode="visualizer"] #visual-stage{z-index:0}
#app[data-mode="visualizer"]{background:#000}
#app[data-mode="visualizer"] #visualizer-name{opacity:.55}
/* Presentation */
#app[data-mode="presentation"] #topbar,
#app[data-mode="presentation"] #workspace,
#app[data-mode="presentation"] #mini-player,
#app[data-mode="presentation"] #collapsed-player,
#app[data-mode="presentation"] #visualizer-name{display:none}
#app[data-mode="presentation"] #visual-stage{z-index:0}
#app[data-mode="presentation"] #presentation-overlay{display:block;position:fixed;inset:0;z-index:210;pointer-events:none}
.presentation-track{position:absolute;left:clamp(18px,3vw,48px);bottom:clamp(18px,4vh,52px);text-shadow:0 2px 14px #000}
#presentation-title{font-size:clamp(18px,2.2vw,34px);font-weight:760}
#presentation-artist{margin-top:5px;font:700 9px/1 ui-monospace,monospace;letter-spacing:.17em;color:rgba(255,255,255,.58)}
#presentation-exit{
  position:absolute;right:18px;top:18px;pointer-events:auto;opacity:0;border:1px solid var(--line);border-radius:999px;background:rgba(0,0,0,.55);
  color:#fff;padding:9px 12px;font:600 9px/1 ui-monospace,monospace;transition:.2s
}
#presentation-overlay:hover #presentation-exit{opacity:1}
/* Mini */
#app[data-mode="mini"] #topbar,
#app[data-mode="mini"] #workspace{display:none}
#app[data-mode="mini"]{min-height:100svh;background:transparent}
#app[data-mode="mini"] #visual-stage{z-index:0}
#app[data-mode="mini"] #mini-player{display:grid}
/* Collapsed */
#app[data-mode="collapsed"] #topbar,
#app[data-mode="collapsed"] #workspace,
#app[data-mode="collapsed"] #mini-player{display:none}
#app[data-mode="collapsed"] #visual-stage{z-index:0}
#app[data-mode="collapsed"] #collapsed-player{display:flex}
body[data-theme="void"]{
  --surface:rgba(0,0,0,.65);--magenta:#fff;--cyan:#bcbcbc;--accent:#fff;--violet:#888;--glow:0 0 28px rgba(255,255,255,.1)
}
@media (max-width:980px){
  #topbar{grid-template-columns:auto 1fr;gap:12px}
  .top-actions{grid-column:1/-1;justify-content:flex-start;display:none}
  #workspace{grid-template-columns:1fr;padding-bottom:115px}
  #library-panel{min-height:auto;max-height:300px;overflow:auto}
  #now-panel{min-height:auto}
  .secondary-controls{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width:620px){
  #topbar{height:auto;padding:12px 14px;grid-template-columns:1fr}
  .brand-button{display:none}
  .search-shell{height:42px}
  #workspace{padding:8px 10px 108px}
  #library-panel{padding:14px}
  #now-panel{padding:14px 4px}
  #art-frame{width:min(76vw,360px)}
  .secondary-controls{grid-template-columns:repeat(2,minmax(0,1fr));width:96%}
  #mini-player{grid-template-columns:42px minmax(0,1fr) 34px 42px 34px 34px;height:62px}
  .mini-art{width:42px;height:42px}
  .mini-progress,#mini-collapse{display:none}
  .splash-scene{width:118vmin;height:118vmin}
}
@media (orientation:portrait){
  .splash-scene{width:126vmin;height:126vmin}
}
@media (prefers-reduced-motion:reduce){
  .splash-vortex,.splash-halo,.art-orbit:after{animation:none!important}
}

/* === PIXELBURGH SIGNAL PLAYER PHASE 1 : CATALOG === */
.catalog-tabs{display:grid;grid-template-columns:repeat(4,1fr);gap:5px;margin-top:14px;padding-bottom:12px;border-bottom:1px solid var(--line)}
.catalog-tabs button,.playlist-toolbar button{border:1px solid var(--line);background:rgba(255,255,255,.025);color:#948a9d;border-radius:8px;padding:8px 7px;font:700 8px/1 ui-monospace,Consolas,monospace;letter-spacing:.08em;cursor:pointer}
.catalog-tabs button:hover,.playlist-toolbar button:hover{color:#fff;border-color:rgba(32,231,255,.28)}.catalog-tabs button.active{color:var(--cyan);background:rgba(32,231,255,.055);border-color:rgba(32,231,255,.24)}
.catalog-tools{padding:10px 0 0}.catalog-tools label{display:flex;align-items:center;justify-content:space-between;gap:10px}.catalog-tools label>span{font:700 8px/1 ui-monospace,monospace;letter-spacing:.13em;color:#817888}.catalog-tools select{border:1px solid var(--line);border-radius:8px;background:#0b0710;color:#dcd4e2;padding:7px 8px;font:600 8px/1 ui-monospace,monospace}
.playlist-toolbar{display:none;grid-template-columns:auto auto auto auto 1fr;gap:5px;align-items:center;padding:10px 0 0}body[data-catalog-view="playlists"] .playlist-toolbar{display:grid}#selected-playlist-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:right;font:600 8px/1 ui-monospace,monospace;color:#857b8c}#catalog-content{min-height:240px}
.track-row-wrap{display:grid;grid-template-columns:minmax(0,1fr) 30px;gap:4px;align-items:center}.track-row{grid-template-columns:26px 34px minmax(0,1fr) auto}.track-thumb{width:32px;height:32px;border-radius:7px;overflow:hidden;display:grid;place-items:center;background:radial-gradient(circle,#3a1237,#08050c);border:1px solid rgba(255,255,255,.07);font:600 14px Georgia,serif}.track-thumb img{width:100%;height:100%;object-fit:cover}.row-action{width:28px;height:28px;border-radius:50%;border:1px solid transparent;background:transparent;color:#796f81;cursor:pointer}.row-action:hover{color:var(--cyan);border-color:rgba(32,231,255,.2);background:rgba(32,231,255,.04)}
.catalog-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;padding-top:4px}.catalog-card{min-width:0;border:1px solid var(--line);border-radius:12px;background:rgba(255,255,255,.022);padding:8px;color:#fff;text-align:left;cursor:pointer}.catalog-card:hover{border-color:rgba(255,53,218,.27);background:rgba(255,53,218,.035)}.catalog-art{width:100%;aspect-ratio:1;border-radius:8px;overflow:hidden;display:grid;place-items:center;background:radial-gradient(circle,#35122f,#07050a);font:400 34px Georgia,serif}.catalog-art img{width:100%;height:100%;object-fit:cover}.catalog-card strong,.catalog-card>span{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.catalog-card strong{font-size:11px;margin-top:7px}.catalog-card>span{font-size:9px;color:var(--muted);margin-top:3px}
.playlist-grid{display:flex;flex-direction:column;gap:5px}.playlist-card{border:1px solid var(--line);border-radius:10px;background:rgba(255,255,255,.02);color:#fff;padding:9px;display:grid;grid-template-columns:30px 1fr;gap:8px;text-align:left;cursor:pointer}.playlist-card.selected{border-color:rgba(255,53,218,.32);background:rgba(255,53,218,.05)}.playlist-icon{width:30px;height:30px;border-radius:8px;display:grid;place-items:center;background:rgba(255,255,255,.035);color:var(--magenta)}.playlist-card strong,.playlist-card small{display:block}.playlist-card strong{font-size:11px}.playlist-card small{margin-top:3px;color:var(--muted);font-size:9px}.playlist-detail-title{padding:14px 3px 8px;font:700 8px/1 ui-monospace,monospace;letter-spacing:.12em;color:var(--cyan);border-bottom:1px solid var(--line);margin-bottom:5px}.mini-art.has-art{background-size:cover;background-position:center}.mini-art.has-art span{display:none}
@media(max-width:620px){.catalog-tabs{grid-template-columns:repeat(2,1fr)}.catalog-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.playlist-toolbar{grid-template-columns:1fr 1fr}#selected-playlist-label{grid-column:1/-1;text-align:left}}


/* =========================================================
   PIXELBURGH // PLAYER SURFACE VISIBILITY
   One playback engine, one visible control surface
   ========================================================= */

/* Full player already has complete transport controls. */
#app[data-mode="full"] #mini-player {
    display: none !important;
}

/* Artwork mode already has complete transport controls. */
#app[data-mode="artwork"] #mini-player {
    display: none !important;
}

/* Visualizer mode may use the compact player overlay. */
#app[data-mode="visualizer"] #mini-player {
    display: grid !important;
}

/* Presentation stays completely clean. */
#app[data-mode="presentation"] #mini-player,
#app[data-mode="presentation"] #collapsed-player {
    display: none !important;
}

/* Explicit Mini mode shows only the mini player. */
#app[data-mode="mini"] #mini-player {
    display: grid !important;
}

/* Collapsed mode uses only the Signal button. */
#app[data-mode="collapsed"] #mini-player {
    display: none !important;
}

/* =========================================================
   PIXELBURGH // VISUAL LAB V3 // REGISTRY FOUNDATION
   ========================================================= */

#visual-lab{
  position:fixed;
  top:96px;
  right:18px;
  z-index:9999;
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  gap:8px;
  font-family:ui-monospace,SFMono-Regular,Consolas,monospace;
}

#visual-lab button,#visual-lab select,#visual-lab input{font:inherit}

#visual-lab-toggle{
  appearance:none;
  border:1px solid rgba(255,255,255,.16);
  border-radius:999px;
  padding:10px 14px;
  background:linear-gradient(135deg,rgba(20,8,30,.94),rgba(5,3,10,.92));
  color:rgba(255,255,255,.84);
  box-shadow:0 12px 40px rgba(0,0,0,.42),0 0 24px rgba(224,34,255,.10);
  backdrop-filter:blur(16px);
  font-weight:700;
  font-size:9px;
  line-height:1;
  letter-spacing:.14em;
  cursor:pointer;
}

#visual-lab-toggle[aria-expanded="true"]{
  border-color:rgba(229,46,255,.5);
  color:#fff;
  box-shadow:0 12px 40px rgba(0,0,0,.45),0 0 30px rgba(229,46,255,.22);
}

#visual-lab-panel{
  width:430px;
  max-height:calc(100vh - 145px);
  overflow-y:auto;
  padding:15px;
  border:1px solid rgba(255,255,255,.11);
  border-radius:15px;
  background:linear-gradient(145deg,rgba(13,8,21,.97),rgba(5,3,9,.96));
  backdrop-filter:blur(24px);
  box-shadow:0 25px 80px rgba(0,0,0,.58),0 0 38px rgba(180,35,255,.08);
}

#visual-lab-panel[hidden],.vl-tab-panel[hidden],#vl-neon-settings[hidden],#vl-module-placeholder[hidden]{display:none!important}

.vl-head,.vl-section-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
}

.vl-head{
  padding-bottom:13px;
  border-bottom:1px solid rgba(255,255,255,.08);
}

.vl-head small,.vl-head strong,.vl-head em{display:block}
.vl-head small{margin-bottom:5px;color:rgba(219,59,255,.72);font-size:8px;letter-spacing:.18em}
.vl-head strong{color:rgba(255,255,255,.94);font-size:14px;letter-spacing:.09em}
.vl-head em{margin-top:5px;color:rgba(32,231,255,.46);font-size:8px;font-style:normal;letter-spacing:.09em;text-transform:uppercase}

#vl-close,#vl-reset-all,.vl-actions button,.vl-wide-button{
  border:1px solid rgba(255,255,255,.11);
  border-radius:8px;
  background:rgba(255,255,255,.025);
  color:rgba(255,255,255,.62);
  font-weight:700;
  font-size:8px;
  line-height:1;
  letter-spacing:.08em;
  cursor:pointer;
}

#vl-close,#vl-reset-all{padding:8px 10px}

.vl-tabs{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:6px;
  margin:13px 0 16px;
}

.vl-tabs button{
  border:1px solid rgba(255,255,255,.07);
  border-radius:8px;
  padding:9px 5px;
  background:rgba(255,255,255,.02);
  color:rgba(255,255,255,.42);
  font-weight:700;
  font-size:8px;
  letter-spacing:.06em;
  cursor:pointer;
}

.vl-tabs button.active{
  color:#fff;
  border-color:rgba(219,55,255,.42);
  background:rgba(219,55,255,.07);
  box-shadow:inset 0 0 18px rgba(219,55,255,.04);
}

.vl-section-head{margin-bottom:10px}
.vl-section-head span{display:block;color:rgba(62,221,255,.78);font-size:8px;font-weight:700;letter-spacing:.16em}
.vl-section-head small{display:block;margin-top:5px;color:rgba(255,255,255,.27);font-size:7px;letter-spacing:.08em}

.vl-layer-list,.vl-module-list{display:grid;gap:6px}

.vl-layer-row{
  display:grid;
  grid-template-columns:1fr auto;
  gap:7px;
  padding:5px;
  border:1px solid rgba(255,255,255,.06);
  border-radius:9px;
  background:rgba(255,255,255,.018);
}

.vl-layer-row.active{border-color:rgba(219,55,255,.38);background:rgba(219,55,255,.055)}
.vl-layer-row>button{border:0;background:transparent;color:rgba(255,255,255,.58);text-align:left;padding:7px 8px;font-weight:700;font-size:8px;letter-spacing:.07em;cursor:pointer}
.vl-layer-row.active>button{color:#fff}
.vl-eye,.vl-switch{display:flex;align-items:center;gap:5px;padding:0 6px;color:rgba(255,255,255,.45);font-size:8px;font-weight:700}
.vl-eye input,.vl-switch input,.vl-module-flags input{accent-color:#db37ff}

.vl-editor{
  margin-top:15px;
  padding-top:14px;
  border-top:1px solid rgba(255,255,255,.08);
}

.vl-selected-line{display:flex;justify-content:space-between;align-items:center;margin-bottom:11px}
.vl-selected-line span{color:rgba(255,255,255,.34);font-size:8px;letter-spacing:.12em}
.vl-selected-line strong{color:rgba(219,55,255,.82);font-size:9px;letter-spacing:.10em}

.vl-control{
  display:grid;
  grid-template-columns:96px 1fr 58px;
  gap:9px;
  align-items:center;
  margin:12px 0;
}

.vl-control span{color:rgba(255,255,255,.46);font-size:8px;font-weight:700;letter-spacing:.06em}
.vl-control input[type="range"]{width:100%;accent-color:#db37ff;cursor:pointer}
.vl-control output{text-align:right;color:rgba(255,255,255,.86);font-size:8px;font-weight:700}

.vl-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:14px}
.vl-actions button,.vl-wide-button{padding:9px}

.vl-module-card{
  border:1px solid rgba(255,255,255,.06);
  border-radius:10px;
  padding:7px;
  background:rgba(255,255,255,.018);
  transition:border-color .15s ease,background .15s ease,opacity .15s ease;
}

.vl-module-card.active{border-color:rgba(40,224,255,.3);background:rgba(40,224,255,.035)}
.vl-module-card.is-off{opacity:.48}
.vl-module-card.is-locked{opacity:.34}

.vl-module-main{display:grid;grid-template-columns:1fr auto;gap:8px;align-items:center}
.vl-module-name{border:0;background:transparent;text-align:left;padding:5px 6px;color:rgba(255,255,255,.77);cursor:pointer}
.vl-module-name strong{display:block;font-size:9px;letter-spacing:.07em}
.vl-module-name small{display:block;margin-top:4px;color:rgba(255,255,255,.28);font-size:7px;letter-spacing:.05em}

.vl-module-flags{
  display:flex;
  flex-wrap:wrap;
  gap:7px 11px;
  align-items:center;
  padding:6px;
  border-top:1px solid rgba(255,255,255,.045);
  margin-top:5px;
  color:rgba(255,255,255,.34);
  font-size:7px;
  font-weight:700;
  letter-spacing:.04em;
}

.vl-module-flags label{display:flex;align-items:center;gap:4px;cursor:pointer}
.vl-module-flags>span{margin-left:auto;color:rgba(219,55,255,.55)}

.vl-module-meta{
  display:flex;
  flex-wrap:wrap;
  gap:5px;
  margin-bottom:10px;
}

.vl-module-meta span{
  border:1px solid rgba(255,255,255,.07);
  border-radius:999px;
  padding:5px 7px;
  color:rgba(255,255,255,.43);
  font-size:7px;
  font-weight:700;
  letter-spacing:.05em;
}

.vl-module-meta p{
  flex-basis:100%;
  margin:5px 0 0;
  color:rgba(255,255,255,.48);
  font-size:8px;
  line-height:1.55;
}

.vl-module-placeholder,.vl-orchestration-note{
  border:1px dashed rgba(255,255,255,.08);
  border-radius:9px;
  padding:11px;
  color:rgba(255,255,255,.32);
  background:rgba(255,255,255,.012);
  font-size:8px;
  line-height:1.55;
  letter-spacing:.04em;
}

.vl-orchestration-note{margin-top:14px}
.vl-orchestration-note strong{display:block;margin-bottom:5px;color:rgba(62,221,255,.68);font-size:8px}
.vl-wide-button{width:100%;margin-top:12px}
.vl-wide-button:disabled{opacity:.3;cursor:not-allowed}

.vl-select-control{
  display:grid;
  grid-template-columns:100px 1fr;
  gap:10px;
  align-items:center;
  margin:10px 0;
}

.vl-select-control>span{color:rgba(255,255,255,.45);font-size:8px;font-weight:700;letter-spacing:.06em}
.vl-select-control select{
  width:100%;
  border:1px solid rgba(255,255,255,.09);
  border-radius:8px;
  padding:8px 9px;
  background:rgba(0,0,0,.35);
  color:rgba(255,255,255,.76);
  font-size:8px;
}

.vl-foot{
  margin-top:15px;
  padding-top:11px;
  border-top:1px solid rgba(255,255,255,.07);
  color:rgba(255,255,255,.27);
  font-size:8px;
  letter-spacing:.07em;
  line-height:1.5;
}

@media(max-width:700px){
  #visual-lab{top:82px;right:10px}
  #visual-lab-panel{width:min(430px,calc(100vw - 20px));max-height:calc(100vh - 125px)}
  .vl-control{grid-template-columns:82px 1fr 50px}
  .vl-tabs button{font-size:7px;letter-spacing:.03em}
}

/* =========================================================
   PIXELBURGH // RESPONSIVE VISUAL CONTEXT + INTERACTION BUS
   ========================================================= */
#app[data-mode="visualizer"] #visualizer-canvas,
#app[data-mode="presentation"] #visualizer-canvas,
#app[data-mode="mini"] #visualizer-canvas,
#app[data-mode="collapsed"] #visualizer-canvas{cursor:crosshair}

.vl-runtime-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:7px;
  margin:12px 0;
}
.vl-runtime-grid>div{
  display:grid;
  grid-template-columns:82px 1fr;
  gap:10px;
  align-items:center;
  padding:8px 9px;
  border:1px solid rgba(255,255,255,.065);
  border-radius:8px;
  background:rgba(255,255,255,.018);
}
.vl-runtime-grid span{
  color:rgba(255,255,255,.34);
  font:700 8px/1 ui-monospace,Consolas,monospace;
  letter-spacing:.08em;
}
.vl-runtime-grid strong{
  color:rgba(32,231,255,.68);
  font:700 8px/1.35 ui-monospace,Consolas,monospace;
  letter-spacing:.05em;
  text-align:right;
}

/* =========================================================
   PIXELBURGH // FRAMEWORK P3 // SMART RANDOM ORCHESTRATOR
   ========================================================= */
#vl-smart-random-controls{display:grid;gap:8px;margin-top:8px}
#vl-smart-random-controls[hidden]{display:none!important}
.vl-seed-box{
  display:grid;
  grid-template-columns:92px 1fr;
  gap:9px;
  align-items:center;
  padding:9px;
  border:1px solid rgba(255,255,255,.065);
  border-radius:8px;
  background:rgba(255,255,255,.018)
}
.vl-seed-box>span{
  color:rgba(255,255,255,.45);
  font:700 8px/1 ui-monospace,Consolas,monospace;
  letter-spacing:.06em
}
.vl-seed-box code{
  overflow:hidden;
  color:rgba(219,55,255,.82);
  font:700 8px/1.35 ui-monospace,Consolas,monospace;
  text-align:right;
  text-overflow:ellipsis;
  white-space:nowrap
}
.vl-orchestrator-actions{grid-template-columns:repeat(3,1fr)}
.vl-orchestrator-actions button{min-height:34px}
@media(max-width:700px){.vl-orchestrator-actions{grid-template-columns:1fr}}

/* =========================================================
   PiXELBURGH // SiGNAL RECEiVER
   PATCH I // PRESENTATION + CONSUMER LAYER
   ========================================================= */

#presentation-art-layer{
  display:none;
  position:absolute;
  inset:0;
  z-index:10;
  overflow:hidden;
  pointer-events:none;
  background:#000;
}

#presentation-art-backdrop{
  position:absolute;
  inset:-8%;
  width:116%;
  height:116%;
  object-fit:cover;
  opacity:.34;
  filter:blur(30px) saturate(1.35) brightness(.62);
  transform:scale(1.05);
}

.presentation-art-focus{
  position:absolute;
  inset:0;
  display:grid;
  place-items:center;
  padding:clamp(18px,5vmin,74px);
  background:radial-gradient(circle at 50% 48%,rgba(255,255,255,.03),transparent 58%);
}

#presentation-art-image{
  position:relative;
  z-index:2;
  display:block;
  width:auto;
  height:auto;
  max-width:min(78%,78vh);
  max-height:78%;
  aspect-ratio:1;
  object-fit:contain;
  border-radius:clamp(8px,1.2vw,18px);
  box-shadow:0 24px 80px rgba(0,0,0,.55),0 0 55px rgba(155,70,255,.10);
}

#presentation-art-image[hidden],#presentation-art-backdrop[hidden]{display:none}

#presentation-art-placeholder{
  position:relative;
  z-index:2;
  width:min(48vmin,420px);
  aspect-ratio:1;
  border:1px solid rgba(255,255,255,.08);
  border-radius:18px;
  display:grid;
  place-items:center;
  align-content:center;
  gap:12px;
  background:radial-gradient(circle,rgba(154,92,255,.16),rgba(5,3,10,.92) 70%);
  color:rgba(255,255,255,.44);
  font:700 9px/1 ui-monospace,Consolas,monospace;
  letter-spacing:.18em;
}

#presentation-art-placeholder[hidden]{display:none}
.presentation-art-mark{font:400 clamp(48px,10vmin,120px)/1 Georgia,serif;color:rgba(255,255,255,.72);letter-spacing:0}

#app[data-mode="presentation"]{
  min-height:100svh;
  background:#000;
  overflow:hidden;
}

#app[data-mode="presentation"] #visual-stage,
#app[data-mode="presentation"] #presentation-overlay{
  position:fixed;
  inset:auto;
  left:50%;
  top:50%;
  width:var(--presentation-frame-width,100vw);
  height:var(--presentation-frame-height,100vh);
  transform:translate(-50%,-50%);
  overflow:hidden;
}

#app[data-mode="presentation"] #visual-stage{
  z-index:0;
  background:#000;
}

#app[data-mode="presentation"] #presentation-overlay{
  display:block;
  z-index:210;
  pointer-events:none;
}

#app[data-mode="presentation"] #visualizer-canvas{
  transition:opacity .28s ease;
}

#app[data-mode="presentation"][data-presentation-layout="visualizer"] #presentation-art-layer{display:none}
#app[data-mode="presentation"][data-presentation-layout="visualizer"] #visualizer-canvas{opacity:1}

#app[data-mode="presentation"][data-presentation-layout="art-visual"] #presentation-art-layer{display:block}
#app[data-mode="presentation"][data-presentation-layout="art-visual"] #visualizer-canvas{opacity:.76}
#app[data-mode="presentation"][data-presentation-layout="art-visual"] #presentation-art-backdrop{opacity:.30}
#app[data-mode="presentation"][data-presentation-layout="art-visual"] #presentation-art-image{max-width:min(62%,70vh);max-height:70%;opacity:.92}

#app[data-mode="presentation"][data-presentation-layout="artwork"] #presentation-art-layer{display:block}
#app[data-mode="presentation"][data-presentation-layout="artwork"] #visualizer-canvas{opacity:.24;mix-blend-mode:screen}
#app[data-mode="presentation"][data-presentation-layout="artwork"] #presentation-art-backdrop{opacity:.58;filter:blur(34px) saturate(1.28) brightness(.58)}
#app[data-mode="presentation"][data-presentation-layout="artwork"] #presentation-art-image{max-width:min(88%,86vh);max-height:86%;opacity:1}

.presentation-track{
  position:absolute;
  z-index:4;
  left:clamp(18px,3vw,52px);
  bottom:clamp(18px,4vh,52px);
  max-width:min(72%,760px);
  text-shadow:0 3px 22px rgba(0,0,0,.96);
  transition:opacity .25s ease,transform .25s ease;
}

#presentation-album{
  margin-bottom:8px;
  font:750 clamp(7px,.58vw,10px)/1 ui-monospace,Consolas,monospace;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:rgba(255,255,255,.48);
}

#presentation-title{font-size:clamp(18px,2.2vw,36px);font-weight:760;line-height:1.04}
#presentation-artist{margin-top:7px;font:700 clamp(8px,.62vw,11px)/1 ui-monospace,Consolas,monospace;letter-spacing:.17em;color:rgba(255,255,255,.64)}

#app[data-presentation-metadata="off"] .presentation-track{opacity:0;pointer-events:none}

#app[data-presentation-meta-position="bottom-center"] .presentation-track{
  left:50%;right:auto;bottom:clamp(18px,4vh,52px);transform:translateX(-50%);text-align:center
}
#app[data-presentation-meta-position="bottom-right"] .presentation-track{
  left:auto;right:clamp(18px,3vw,52px);bottom:clamp(18px,4vh,52px);text-align:right
}
#app[data-presentation-meta-position="top-left"] .presentation-track{
  left:clamp(18px,3vw,52px);top:clamp(18px,4vh,52px);bottom:auto;text-align:left
}

#presentation-controls-toggle,
#presentation-exit{
  position:absolute;
  top:14px;
  z-index:12;
  pointer-events:auto;
  opacity:0;
  transform:translateY(-6px);
  transition:opacity .18s ease,transform .18s ease;
  border:1px solid rgba(255,255,255,.13);
  border-radius:999px;
  background:rgba(3,2,7,.72);
  color:#fff;
  backdrop-filter:blur(14px);
  padding:9px 12px;
  font:700 8px/1 ui-monospace,Consolas,monospace;
  letter-spacing:.11em;
  cursor:pointer;
}

#presentation-controls-toggle{left:14px}
#presentation-exit{right:14px}

#presentation-controls{
  position:absolute;
  z-index:11;
  right:14px;
  top:52px;
  width:min(430px,calc(100% - 28px));
  max-height:calc(100% - 72px);
  overflow:auto;
  pointer-events:none;
  opacity:0;
  transform:translateY(-8px);
  transition:opacity .18s ease,transform .18s ease;
  padding:14px;
  border-color:rgba(255,255,255,.12);
  background:rgba(5,3,10,.84);
  backdrop-filter:blur(24px);
}

#app.presentation-ui-visible #presentation-controls,
#app.presentation-ui-visible #presentation-controls-toggle,
#app.presentation-ui-visible #presentation-exit{
  opacity:1;
  transform:none;
}

#app.presentation-ui-visible #presentation-controls{pointer-events:auto}

.presentation-control-heading{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
  padding-bottom:12px;
  border-bottom:1px solid rgba(255,255,255,.08);
}
.presentation-control-heading small,.presentation-control-heading strong{display:block}
.presentation-control-heading small{font:700 7px/1 ui-monospace,Consolas,monospace;letter-spacing:.17em;color:var(--magenta)}
.presentation-control-heading strong{margin-top:5px;font:760 12px/1 ui-monospace,Consolas,monospace;letter-spacing:.10em}
#presentation-visual-name{max-width:52%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:650 8px/1 ui-monospace,Consolas,monospace;letter-spacing:.08em;color:rgba(255,255,255,.48)}

.presentation-control-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
  padding-top:12px;
}
.presentation-control-grid label,.presentation-seed-row label{min-width:0}
.presentation-control-grid label>span,.presentation-seed-row label>span{
  display:block;
  margin-bottom:6px;
  font:700 7px/1 ui-monospace,Consolas,monospace;
  letter-spacing:.12em;
  color:rgba(255,255,255,.48);
}
.presentation-control-grid select,
.presentation-seed-row input[type="text"],
.presentation-preset-row select{
  width:100%;min-width:0;border:1px solid rgba(255,255,255,.10);border-radius:8px;background:#09060e;color:#eee;padding:8px;font:650 8px/1 ui-monospace,Consolas,monospace
}
.presentation-check{display:flex!important;align-items:center;gap:8px;padding:8px;border:1px solid rgba(255,255,255,.08);border-radius:8px;background:rgba(255,255,255,.018)}
.presentation-check span{margin:0!important}
.presentation-check input{accent-color:var(--magenta)}

.presentation-seed-row{
  margin-top:10px;
  display:grid;
  grid-template-columns:1.15fr 1.5fr auto;
  gap:7px;
  align-items:center;
}
.presentation-seed-row .presentation-check{height:100%}
.presentation-seed-row input[type="text"]{height:34px;text-transform:uppercase}
.presentation-seed-row button,.presentation-preset-row button{
  height:34px;border:1px solid rgba(255,255,255,.10);border-radius:8px;background:rgba(255,255,255,.025);color:#ddd;padding:0 9px;font:700 7px/1 ui-monospace,Consolas,monospace;letter-spacing:.08em;cursor:pointer
}
.presentation-seed-row button:hover,.presentation-preset-row button:hover{border-color:rgba(32,231,255,.26);color:var(--cyan)}

.presentation-preset-row{
  margin-top:8px;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto auto auto;
  gap:6px;
}

.presentation-help{
  margin-top:10px;
  padding-top:10px;
  border-top:1px solid rgba(255,255,255,.07);
  font:650 7px/1 ui-monospace,Consolas,monospace;
  letter-spacing:.10em;
  color:rgba(255,255,255,.32);
}

@media (max-width:620px){
  #presentation-controls{left:10px;right:10px;top:48px;width:auto;max-height:calc(100% - 62px);padding:12px}
  .presentation-control-grid{grid-template-columns:1fr 1fr}
  .presentation-seed-row{grid-template-columns:1fr auto}
  .presentation-seed-row .presentation-check{grid-column:1/-1}
  .presentation-preset-row{grid-template-columns:1fr 1fr 1fr}
  .presentation-preset-row select{grid-column:1/-1}
  .presentation-track{max-width:82%}
  #app[data-mode="presentation"][data-presentation-layout="art-visual"] #presentation-art-image{max-width:82%;max-height:64%}
}


/* =========================================================
   PATCH J // CONSUMER POLISH + RESPONSIVE SCENE
   ========================================================= */

/* Desktop catalog: keep catalog controls fixed while results scroll. */
#library-panel{
  display:flex;
  flex-direction:column;
  min-height:420px;
  height:min(760px,calc(100svh - 120px));
  max-height:calc(100svh - 120px);
  overflow:hidden;
}
#catalog-content{
  flex:1 1 auto;
  min-height:0;
  overflow-y:auto;
  overflow-x:hidden;
  overscroll-behavior:contain;
  scrollbar-gutter:stable;
  scrollbar-width:thin;
  scrollbar-color:rgba(219,55,255,.42) rgba(255,255,255,.025);
  -webkit-overflow-scrolling:touch;
  padding-right:3px;
}
#catalog-content::-webkit-scrollbar{width:8px}
#catalog-content::-webkit-scrollbar-track{background:rgba(255,255,255,.018);border-radius:999px}
#catalog-content::-webkit-scrollbar-thumb{
  background:linear-gradient(180deg,rgba(219,55,255,.48),rgba(32,231,255,.28));
  border:2px solid rgba(3,2,7,.82);
  border-radius:999px;
}



#mobile-add-music{display:none}
/* Guaranteed touch-safe escape from Artwork mode on narrow screens. */
#mobile-mode-exit{
  display:none;
  position:fixed;
  z-index:10020;
  top:max(10px,env(safe-area-inset-top));
  left:max(10px,env(safe-area-inset-left));
  min-width:84px;
  min-height:42px;
  padding:0 13px;
  border:1px solid rgba(255,255,255,.16);
  border-radius:999px;
  background:rgba(5,3,10,.86);
  color:#fff;
  backdrop-filter:blur(16px);
  box-shadow:0 10px 34px rgba(0,0,0,.45),0 0 20px rgba(219,55,255,.12);
  font:700 9px/1 ui-monospace,Consolas,monospace;
  letter-spacing:.10em;
}

/* Portrait scene envelope: keep the layered Signal Core composition substantial
   instead of shrinking it to the narrow viewport's vmin. */
@media (orientation:portrait) and (max-width:760px){
  .splash-scene{
    width:min(176vw,100vh);
    height:min(176vw,100vh);
  }
}

@media (max-width:760px){
  /* Search is the only persistent top-bar element on phone layouts. */
  #topbar{
    height:auto;
    display:block;
    padding:10px 12px;
  }
  #topbar .brand-button,
  #topbar .top-actions{display:none!important}
  #topbar .search-shell{width:100%;height:42px}

  /* Promote Now Playing children into the mobile flow so the catalog can sit
     directly after transport/timebar and before advanced controls. */
  #workspace{
    display:flex;
    flex-direction:column;
    gap:12px;
    padding:8px 10px 112px;
    max-width:none;
  }
  #now-panel{display:contents}
  #art-frame{
    order:10;
    align-self:center;
    width:min(82vw,420px);
    margin-top:2px;
  }
  #now-copy{order:20;margin-top:5px}
  .transport-main{order:30;margin-top:8px;justify-content:center}
  .progress-row{order:40;width:min(620px,96%);align-self:center;margin-top:3px}
  #library-panel{
    order:50;
    width:100%;
    height:min(44svh,430px);
    min-height:250px;
    max-height:min(44svh,430px);
    padding:10px 12px 12px;
    align-self:stretch;
  }
  #mobile-add-music{
    display:block;
    align-self:flex-start;
    margin:0 0 8px;
    padding:8px 11px;
    border:1px solid rgba(32,231,255,.20);
    border-radius:999px;
    background:rgba(32,231,255,.035);
    color:var(--cyan);
    font:700 8px/1 ui-monospace,Consolas,monospace;
    letter-spacing:.10em;
  }
  #library-panel .panel-heading{display:none}
  #library-panel .catalog-tabs{margin-top:0}
  #library-panel .search-status{padding:9px 2px 7px}
  .secondary-controls{
    order:60;
    width:100%;
    margin:0;
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  #app[data-mode="artwork"] #mobile-mode-exit{display:block}
  #app[data-mode="artwork"] #workspace{display:flex}
  #app[data-mode="artwork"] #art-frame{width:min(90vw,520px)}
  #app[data-mode="artwork"] .progress-row{width:min(680px,94%)}

  .track-row{
    min-height:48px;
    padding:9px 7px;
  }
  .row-action{width:34px;height:34px}
}

@media (max-width:420px){
  .catalog-tabs{gap:4px}
  .catalog-tabs button{padding:8px 4px;font-size:7px}
  .catalog-tools label{gap:6px}
  #art-frame{width:min(86vw,360px)}
  .secondary-controls{grid-template-columns:1fr 1fr}
}

/* =========================================================
   PIXELBURGH // OPERATOR MODE FOUNDATION
   Advanced library controls remain separate from SiGNAL mode.
   ========================================================= */
#operator-mode-button.active{
  border-color:rgba(32,231,255,.48);
  color:var(--cyan);
  box-shadow:0 0 28px rgba(32,231,255,.12)
}
#operator-panel{
  position:fixed;
  z-index:9800;
  top:92px;
  right:18px;
  bottom:88px;
  width:min(430px,calc(100vw - 36px));
  overflow-y:auto;
  padding:15px;
  background:linear-gradient(150deg,rgba(9,6,17,.985),rgba(3,2,8,.975));
  border-color:rgba(32,231,255,.16);
  font-family:ui-monospace,SFMono-Regular,Consolas,monospace;
  scrollbar-width:thin;
  scrollbar-color:rgba(32,231,255,.28) transparent;
}
#operator-panel[hidden]{display:none!important}
#operator-panel::-webkit-scrollbar{width:7px}
#operator-panel::-webkit-scrollbar-thumb{background:rgba(32,231,255,.22);border-radius:99px}
#operator-panel input,#operator-panel select,#operator-panel textarea,#operator-panel button{font:inherit}
.operator-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:12px;
  padding-bottom:13px;
  border-bottom:1px solid rgba(255,255,255,.08)
}
.operator-head small,.operator-head strong,.operator-head em{display:block}
.operator-head small{color:rgba(32,231,255,.55);font-size:7px;letter-spacing:.14em}
.operator-head strong{margin-top:5px;color:#fff;font-size:16px;letter-spacing:.15em}
.operator-head em{margin-top:5px;color:rgba(255,53,218,.65);font-size:7px;font-style:normal;letter-spacing:.1em}
.operator-head button,.operator-cover-actions button,.operator-actions button{
  border:1px solid rgba(255,255,255,.11);
  border-radius:8px;
  background:rgba(255,255,255,.025);
  color:rgba(255,255,255,.68);
  padding:8px 10px;
  font-size:8px;
  font-weight:700;
  letter-spacing:.07em;
  cursor:pointer
}
.operator-head button:hover,.operator-cover-actions button:hover,.operator-actions button:hover{border-color:rgba(32,231,255,.3);color:#fff}
.operator-track-head{
  display:grid;
  gap:5px;
  padding:12px 2px;
  border-bottom:1px solid rgba(255,255,255,.06)
}
.operator-track-head span{color:rgba(255,255,255,.32);font-size:7px;letter-spacing:.13em}
.operator-track-head strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:rgba(32,231,255,.78);font-size:8px;letter-spacing:.05em}
.operator-section{
  margin-top:14px;
  padding:13px;
  border:1px solid rgba(255,255,255,.065);
  border-radius:11px;
  background:rgba(255,255,255,.015)
}
.operator-section-title{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-bottom:11px}
.operator-section-title span{color:rgba(255,53,218,.78);font-size:8px;font-weight:800;letter-spacing:.15em}
.operator-section-title small{color:rgba(255,255,255,.25);font-size:6px;letter-spacing:.08em;text-align:right}
.operator-section>label,.operator-inline label{display:grid;gap:6px;margin:10px 0}
.operator-section label>span{color:rgba(255,255,255,.43);font-size:7px;font-weight:700;letter-spacing:.08em}
.operator-section input,.operator-section select,.operator-section textarea{
  width:100%;
  min-width:0;
  border:1px solid rgba(255,255,255,.085);
  border-radius:8px;
  outline:0;
  background:rgba(0,0,0,.32);
  color:rgba(255,255,255,.86);
  padding:9px 10px;
  font-size:9px
}
.operator-section textarea{resize:vertical;line-height:1.5}
.operator-section input:focus,.operator-section select:focus,.operator-section textarea:focus{border-color:rgba(32,231,255,.34);box-shadow:0 0 0 3px rgba(32,231,255,.04)}
.operator-section input:disabled,.operator-section select:disabled,.operator-section textarea:disabled,.operator-section button:disabled{opacity:.34;cursor:not-allowed}
.operator-inline{display:grid;grid-template-columns:1fr 1fr;gap:9px}
.operator-cover-row{display:grid;grid-template-columns:112px 1fr;gap:12px;align-items:start}
.operator-cover-box{
  width:112px;
  aspect-ratio:1;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.09);
  border-radius:10px;
  background:radial-gradient(circle,rgba(255,53,218,.12),rgba(0,0,0,.4));
  display:grid;
  place-items:center
}
.operator-cover-box:has(img.empty):after{content:"NO COVER";color:rgba(255,255,255,.22);font-size:7px;letter-spacing:.1em}
#operator-cover-preview{width:100%;height:100%;object-fit:cover}
#operator-cover-preview.empty{display:none}
.operator-cover-actions{display:grid;gap:7px}
.operator-cover-actions small{color:rgba(255,255,255,.28);font-size:7px;line-height:1.45}
.operator-artist-links{display:flex;flex-wrap:wrap;gap:5px;margin:6px 0 3px}
.operator-artist-links span{display:flex;gap:5px;align-items:center;border:1px solid rgba(255,255,255,.07);border-radius:999px;padding:5px 7px;color:rgba(255,255,255,.58);font-size:7px}
.operator-artist-links b{color:rgba(32,231,255,.65);font-weight:800;text-transform:uppercase}
.operator-artist-links .operator-empty-chip{border-style:dashed;color:rgba(255,255,255,.25)}
.operator-file-facts{display:grid;gap:6px;margin-top:10px}
.operator-file-facts>div{display:grid;grid-template-columns:90px minmax(0,1fr);gap:8px;padding:6px 0;border-top:1px solid rgba(255,255,255,.04)}
.operator-file-facts span{color:rgba(255,255,255,.27);font-size:7px;letter-spacing:.06em}
.operator-file-facts strong{overflow-wrap:anywhere;color:rgba(255,255,255,.62);font-size:7px;font-weight:650;text-align:right}
.operator-empty{color:rgba(255,255,255,.25);font-size:8px}
.operator-note{margin:10px 0 0;color:rgba(255,255,255,.28);font-size:7px;line-height:1.55}
.operator-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:14px}
#operator-save{border-color:rgba(32,231,255,.24);color:rgba(32,231,255,.82);background:rgba(32,231,255,.035)}
#operator-mobile-toggle{display:none}
body[data-operator="on"] #visual-lab{right:466px}
#app[data-mode="presentation"]~#operator-panel,
#app[data-mode="presentation"] #operator-panel{display:none!important}

@media(max-width:980px){
  #operator-mobile-toggle{
    display:block;
    position:fixed;
    z-index:9700;
    left:10px;
    bottom:max(76px,calc(env(safe-area-inset-bottom) + 76px));
    border:1px solid rgba(32,231,255,.18);
    border-radius:999px;
    background:rgba(5,3,10,.88);
    color:rgba(255,255,255,.55);
    padding:9px 11px;
    font:700 7px/1 ui-monospace,Consolas,monospace;
    letter-spacing:.09em;
    backdrop-filter:blur(12px)
  }
  #operator-mobile-toggle.active{color:var(--cyan);border-color:rgba(32,231,255,.42)}
  body[data-operator="on"] #visual-lab{right:10px}
  #operator-panel{
    top:max(64px,calc(env(safe-area-inset-top) + 54px));
    right:10px;
    bottom:10px;
    width:calc(100vw - 20px)
  }
}

/* =========================================================
   PIXELBURGH // K0.1 OPERATOR RELIABILITY + ORCHESTRATION V2
   ========================================================= */
.operator-actions{grid-template-columns:repeat(3,minmax(0,1fr))}
#operator-cancel{border-color:rgba(255,255,255,.12);color:rgba(255,255,255,.7)}
.operator-dirty-state{
  margin-top:12px;padding:7px 9px;border:1px solid rgba(255,173,51,.18);border-radius:8px;
  background:rgba(255,173,51,.035);color:rgba(255,190,80,.76);font-size:7px;font-weight:800;letter-spacing:.11em;text-align:center
}
.operator-dirty-state[hidden]{display:none!important}
.operator-orchestration-custom{display:grid;gap:2px}
.operator-orchestration-custom[hidden]{display:none!important}
.operator-orchestration-custom>button{
  margin-top:7px;border:1px solid rgba(32,231,255,.16);border-radius:8px;background:rgba(32,231,255,.025);
  color:rgba(32,231,255,.72);padding:9px;font-size:7px;font-weight:800;letter-spacing:.08em;cursor:pointer
}
.operator-check{grid-template-columns:auto 1fr!important;align-items:center!important;gap:8px!important}
.operator-check input{width:auto!important;accent-color:var(--cyan)}
.operator-orchestration-summary{
  margin-top:8px;padding:8px;border:1px dashed rgba(255,255,255,.07);border-radius:8px;
  color:rgba(255,255,255,.34);font-size:7px;line-height:1.5;letter-spacing:.04em
}
.operator-cover-actions small::after{content:" // MAX DISPLAY 1600px + 360px THUMB";color:rgba(32,231,255,.35)}
.vl-control-disabled{opacity:.34;filter:saturate(.35)}
.vl-control-disabled select,.vl-control-disabled input{cursor:not-allowed!important}
#app[data-orchestration="track"] #rotation-interval{opacity:.38;cursor:not-allowed}
@media(max-width:700px){.operator-actions{grid-template-columns:1fr 1fr}.operator-actions #operator-save{grid-column:1/-1}}



/* R1 // PLAYLIST EDITOR V2 */
.playlist-toolbar button:disabled{opacity:.35;cursor:not-allowed;filter:saturate(.35)}
.playlist-editor-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:9px 0 11px;border-bottom:1px solid var(--line)}
.playlist-editor-head>div:first-child{min-width:0}.playlist-editor-head strong,.playlist-editor-head small{display:block}.playlist-editor-head strong{font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.playlist-editor-head small{margin-top:4px;color:var(--muted);font:600 8px/1.2 ui-monospace,monospace;letter-spacing:.08em}.playlist-editor-kicker{display:block;margin-bottom:5px;color:var(--cyan);font:800 8px/1 ui-monospace,monospace;letter-spacing:.15em}
.playlist-editor-actions{display:flex;gap:5px;flex-wrap:wrap;justify-content:flex-end}.playlist-editor-actions button,.playlist-add-tracks{border:1px solid var(--line);background:rgba(255,255,255,.025);color:#b8aebe;border-radius:8px;padding:8px 9px;font:700 8px/1 ui-monospace,monospace;letter-spacing:.08em;cursor:pointer}.playlist-editor-actions button:hover,.playlist-add-tracks:hover{color:#fff;border-color:rgba(32,231,255,.3)}.playlist-editor-actions .primary{color:var(--cyan);border-color:rgba(32,231,255,.3);background:rgba(32,231,255,.06)}
.playlist-editor-form{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:7px;align-items:end;padding:12px 0}.playlist-editor-form label span{display:block;margin:0 0 5px;color:#84798b;font:700 7px/1 ui-monospace,monospace;letter-spacing:.12em}.playlist-editor-form input{width:100%;min-width:0;box-sizing:border-box;border:1px solid var(--line);background:rgba(0,0,0,.22);color:#fff;border-radius:8px;padding:9px 10px;font:600 10px/1.2 ui-monospace,monospace;outline:none}.playlist-editor-form input:focus{border-color:rgba(32,231,255,.34);box-shadow:0 0 0 2px rgba(32,231,255,.04)}
.playlist-edit-track-list,.playlist-add-list{display:flex;flex-direction:column;gap:5px}.playlist-edit-row{display:grid;grid-template-columns:25px 34px minmax(0,1fr) auto;gap:7px;align-items:center;padding:6px;border:1px solid rgba(255,255,255,.055);border-radius:9px;background:rgba(255,255,255,.018)}.playlist-drag-index{color:#625a68;text-align:center;font:700 8px/1 ui-monospace,monospace}.playlist-edit-copy{min-width:0}.playlist-edit-copy strong,.playlist-edit-copy small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.playlist-edit-copy strong{font-size:10px}.playlist-edit-copy small{margin-top:3px;color:var(--muted);font-size:8px}.playlist-edit-row-actions{display:flex;gap:3px}.playlist-edit-row-actions button{width:27px;height:27px;border:1px solid transparent;background:transparent;color:#8f8495;border-radius:7px;cursor:pointer}.playlist-edit-row-actions button:hover:not(:disabled){color:var(--cyan);border-color:rgba(32,231,255,.2);background:rgba(32,231,255,.04)}.playlist-edit-row-actions button.danger:hover{color:#ff63c9;border-color:rgba(255,53,218,.24);background:rgba(255,53,218,.04)}.playlist-edit-row-actions button:disabled{opacity:.25;cursor:not-allowed}
.playlist-editor-empty,.playlist-editor-note{padding:12px 9px;color:#827787;border:1px dashed rgba(255,255,255,.08);border-radius:9px;font:600 8px/1.5 ui-monospace,monospace}.playlist-editor-note{margin:10px 0;color:#9b91a1}
.playlist-add-row{display:grid;grid-template-columns:34px minmax(0,1fr) auto;gap:8px;align-items:center;width:100%;padding:7px;border:1px solid rgba(255,255,255,.055);border-radius:9px;background:rgba(255,255,255,.018);color:#fff;text-align:left;cursor:pointer}.playlist-add-row>span:nth-child(2){min-width:0}.playlist-add-row strong,.playlist-add-row small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.playlist-add-row strong{font-size:10px}.playlist-add-row small{margin-top:3px;color:var(--muted);font-size:8px}.playlist-add-row b{color:#8e8493;font:800 8px/1 ui-monospace,monospace;letter-spacing:.08em}.playlist-add-row:hover{border-color:rgba(32,231,255,.22);background:rgba(32,231,255,.035)}.playlist-add-row.included{border-color:rgba(32,231,255,.26);background:rgba(32,231,255,.045)}.playlist-add-row.included b{color:var(--cyan)}
body[data-playlist-editing="edit"] #search-status,body[data-playlist-editing="add"] #search-status{color:var(--magenta)}
@media(max-width:620px){.playlist-toolbar{grid-template-columns:1fr 1fr}.playlist-editor-head{align-items:flex-start;flex-direction:column}.playlist-editor-actions{width:100%;justify-content:stretch}.playlist-editor-actions button{flex:1}.playlist-editor-form{grid-template-columns:1fr}.playlist-add-tracks{width:100%}.playlist-edit-row{grid-template-columns:22px 34px minmax(0,1fr);}.playlist-edit-row-actions{grid-column:2/-1;justify-content:flex-end}.playlist-edit-row-actions button{width:34px;height:30px}.playlist-add-row{padding:9px 7px}}

/* === R2 OPERATOR METADATA V2 + ORDERING === */
.operator-media-slot{display:flex;flex-direction:column;gap:8px;padding:10px;border:1px solid rgba(255,255,255,.06);border-radius:10px;background:rgba(255,255,255,.018);margin-top:8px}.operator-media-slot>div:first-child b,.operator-media-slot>div:first-child small{display:block}.operator-media-slot>div:first-child b{font:800 8px/1 ui-monospace,monospace;letter-spacing:.12em;color:#d7d0dc}.operator-media-slot>div:first-child small{margin-top:4px;color:#807587;font:600 8px/1.4 ui-monospace,monospace}.operator-media-slot--future{opacity:.72}.operator-media-slot--future>button{border:1px solid var(--line);background:rgba(255,255,255,.02);color:#756b7b;border-radius:8px;padding:8px 9px;font:700 8px/1 ui-monospace,monospace;letter-spacing:.06em}
.playlist-edit-row[draggable="true"]{transition:border-color .12s ease,background .12s ease,opacity .12s ease}.playlist-edit-row.dragging{opacity:.38;border-color:rgba(32,231,255,.35)}.playlist-edit-row[data-drop-after="false"]{box-shadow:inset 0 2px 0 rgba(32,231,255,.65)}.playlist-edit-row[data-drop-after="true"]{box-shadow:inset 0 -2px 0 rgba(32,231,255,.65)}.playlist-drag-index{cursor:grab;user-select:none}.playlist-edit-row.dragging .playlist-drag-index{cursor:grabbing}
@media(max-width:620px){.playlist-edit-row{touch-action:pan-y}.playlist-drag-index{cursor:default}.operator-media-slot{padding:9px}}

/* =========================================================
   R3 // ARTIST MANAGER
========================================================= */
.operator-artist-manager{border-color:rgba(32,231,255,.12);background:linear-gradient(180deg,rgba(32,231,255,.025),rgba(255,53,218,.015))}
.operator-artist-manager-bar{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:end}
.operator-artist-manager-bar>label{display:grid;gap:6px;margin:0}
.operator-artist-manager-bar>label>span{color:rgba(255,255,255,.43);font-size:7px;font-weight:700;letter-spacing:.08em}
.operator-artist-manager-bar button,.operator-artist-assign-actions button{
  min-height:34px;border:1px solid rgba(32,231,255,.16);border-radius:8px;background:rgba(32,231,255,.025);color:rgba(32,231,255,.78);padding:8px 10px;font:800 7px/1 ui-monospace,monospace;letter-spacing:.07em;cursor:pointer
}
.operator-artist-manager-bar button:hover,.operator-artist-assign-actions button:hover{border-color:rgba(32,231,255,.34);color:#fff}
.operator-artist-manager-editor{display:grid;gap:2px;margin-top:12px;padding-top:12px;border-top:1px solid rgba(255,255,255,.055)}
.operator-artist-manager-editor[hidden]{display:none!important}
.operator-artist-media-grid{display:grid;grid-template-columns:1fr;gap:9px;margin-top:6px}
.operator-cover-box--avatar{aspect-ratio:1/1}
.operator-cover-box--banner{aspect-ratio:16/7;height:auto;min-height:72px}
#operator-artist-avatar-preview,#operator-artist-banner-preview,#operator-channel-avatar-preview,#operator-channel-banner-preview{width:100%;height:100%;object-fit:cover;object-position:center}
#operator-artist-avatar-preview.empty,#operator-artist-banner-preview.empty,#operator-channel-avatar-preview.empty,#operator-channel-banner-preview.empty{display:none}
.operator-artist-assign-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:8px}
.operator-actions--artist{grid-template-columns:1fr 1fr}
#operator-artist-save{border-color:rgba(32,231,255,.24);color:rgba(32,231,255,.82);background:rgba(32,231,255,.035)}
#operator-artist-manager-select{min-width:0}
@media(min-width:1180px){.operator-artist-media-grid{grid-template-columns:1fr 1fr}.operator-artist-media-grid .operator-cover-row{grid-template-columns:92px 1fr}}
@media(max-width:620px){.operator-artist-manager-bar{grid-template-columns:1fr}.operator-artist-assign-actions{grid-template-columns:1fr}.operator-cover-box--banner{min-height:64px}}

/* =========================================================
   OPERATOR WORKSPACES // R4A
========================================================= */
.operator-workspace-nav{
  position:sticky;
  top:-18px;
  z-index:12;
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:6px;
  margin:0 0 8px;
  padding:9px 0 7px;
  background:linear-gradient(180deg,rgba(7,7,13,.98) 70%,rgba(7,7,13,.78),transparent);
  backdrop-filter:blur(12px);
}
.operator-workspace-nav button{
  min-width:0;
  border:1px solid rgba(255,255,255,.08);
  border-radius:8px;
  padding:9px 5px;
  background:rgba(255,255,255,.018);
  color:rgba(255,255,255,.42);
  font:800 7px/1 ui-monospace,monospace;
  letter-spacing:.09em;
  cursor:pointer;
}
.operator-workspace-nav button:hover{border-color:rgba(32,231,255,.22);color:rgba(255,255,255,.78)}
.operator-workspace-nav button.active{
  border-color:rgba(32,231,255,.34);
  background:linear-gradient(180deg,rgba(32,231,255,.08),rgba(255,53,218,.035));
  color:#e9fdff;
  box-shadow:inset 0 0 24px rgba(32,231,255,.025);
}
.operator-workspace-context{
  margin:0 0 12px;
  padding:7px 9px;
  border:1px solid rgba(255,255,255,.05);
  border-radius:7px;
  color:rgba(32,231,255,.55);
  background:rgba(255,255,255,.012);
  font:700 7px/1 ui-monospace,monospace;
  letter-spacing:.09em;
}
.operator-workspace[hidden]{display:none!important}
.operator-workspace{min-width:0}
.operator-entity-launchpad{min-height:240px}
.operator-workspace-empty{
  display:grid;
  gap:12px;
  align-content:start;
  padding:15px;
  border:1px dashed rgba(32,231,255,.15);
  border-radius:10px;
  background:linear-gradient(145deg,rgba(32,231,255,.025),rgba(255,53,218,.018));
}
.operator-workspace-empty strong{color:#eee7f1;font:850 9px/1.2 ui-monospace,monospace;letter-spacing:.12em}
.operator-workspace-empty p{margin:0;color:rgba(255,255,255,.39);font:600 8px/1.7 ui-monospace,monospace}
.operator-workspace-empty button{
  width:max-content;
  max-width:100%;
  border:1px solid rgba(32,231,255,.2);
  border-radius:8px;
  padding:9px 11px;
  background:rgba(32,231,255,.035);
  color:rgba(32,231,255,.82);
  font:800 7px/1 ui-monospace,monospace;
  letter-spacing:.08em;
  cursor:pointer;
}
.operator-workspace[data-operator-workspace="artist"] .operator-artist-manager{margin-top:0}
@media(max-width:620px){
  .operator-workspace-nav{top:-14px;grid-template-columns:repeat(2,minmax(0,1fr));}
  .operator-workspace-nav button{padding:10px 6px;font-size:8px}
}

/* =========================================================
   R4B // ALBUM / RELEASE BUILDER + ARTIST MEDIA STACK
========================================================= */
.operator-artist-media-grid{grid-template-columns:1fr!important}
@media(min-width:1180px){.operator-artist-media-grid{grid-template-columns:1fr!important}.operator-artist-media-grid .operator-cover-row{grid-template-columns:92px 1fr}}
.operator-album-manager{border-color:rgba(255,53,218,.12);background:linear-gradient(180deg,rgba(255,53,218,.022),rgba(32,231,255,.014))}
.operator-album-manager-bar{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:end}
.operator-album-manager-bar>label{display:grid;gap:6px;margin:0}.operator-album-manager-bar>label>span{color:rgba(255,255,255,.43);font-size:7px;font-weight:700;letter-spacing:.08em}
.operator-album-manager-bar button,.operator-album-track-head button,.operator-album-add-head button{min-height:34px;border:1px solid rgba(255,53,218,.17);border-radius:8px;background:rgba(255,53,218,.025);color:rgba(255,160,229,.82);padding:8px 10px;font:800 7px/1 ui-monospace,monospace;letter-spacing:.07em;cursor:pointer}
.operator-album-manager-bar button:hover,.operator-album-track-head button:hover,.operator-album-add-head button:hover{border-color:rgba(255,53,218,.36);color:#fff}
.operator-album-manager-editor{display:grid;gap:3px;margin-top:12px;padding-top:12px;border-top:1px solid rgba(255,255,255,.055)}.operator-album-manager-editor[hidden]{display:none!important}
.operator-album-media-stack{display:grid;grid-template-columns:1fr;gap:9px;margin-top:6px}.operator-cover-box--album-banner{aspect-ratio:16/7;height:auto;min-height:72px}#operator-album-cover-preview,#operator-album-banner-preview{width:100%;height:100%;object-fit:cover}#operator-album-cover-preview.empty,#operator-album-banner-preview.empty{display:none}
.operator-album-track-head{display:flex;align-items:flex-end;justify-content:space-between;gap:10px;margin-top:12px;padding:10px 0 8px;border-top:1px solid rgba(255,255,255,.055)}.operator-album-track-head b,.operator-album-track-head small{display:block}.operator-album-track-head b{font:800 8px/1 ui-monospace,monospace;letter-spacing:.1em;color:#e7e0eb}.operator-album-track-head small{margin-top:4px;color:#7f7585;font:600 8px/1.35 ui-monospace,monospace}.operator-album-track-head>div:last-child{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.operator-album-playlist-import{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(150px,.8fr) auto;gap:8px;align-items:end;margin:0 0 10px;padding:10px;border:1px solid rgba(32,231,255,.12);border-radius:10px;background:rgba(32,231,255,.018)}.operator-album-playlist-import label{margin:0}.operator-album-playlist-import button{min-height:36px;border:1px solid rgba(32,231,255,.24);border-radius:8px;background:rgba(32,231,255,.045);color:var(--cyan);padding:8px 12px;font:800 7px/1 ui-monospace,monospace;letter-spacing:.08em;cursor:pointer}.operator-album-playlist-import button:hover{border-color:rgba(32,231,255,.45);color:#fff}.operator-album-playlist-import>small{grid-column:1/-1;color:#7f8291;font:600 8px/1.4 ui-monospace,monospace}
.operator-album-track-list,.operator-album-add-list{display:flex;flex-direction:column;gap:5px}.operator-album-track-row{display:grid;grid-template-columns:28px 34px minmax(0,1fr) auto;gap:7px;align-items:center;padding:6px;border:1px solid rgba(255,255,255,.055);border-radius:9px;background:rgba(255,255,255,.018);transition:border-color .12s ease,background .12s ease,opacity .12s ease}.operator-album-track-row.dragging{opacity:.38;border-color:rgba(255,53,218,.35)}.operator-album-track-row[data-drop-after="false"]{box-shadow:inset 0 2px 0 rgba(255,53,218,.72)}.operator-album-track-row[data-drop-after="true"]{box-shadow:inset 0 -2px 0 rgba(255,53,218,.72)}.operator-album-track-index{color:#675d6c;text-align:center;font:700 8px/1 ui-monospace,monospace;cursor:grab;user-select:none}.operator-album-track-copy{min-width:0}.operator-album-track-copy strong,.operator-album-track-copy small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.operator-album-track-copy strong{font-size:10px}.operator-album-track-copy small{margin-top:3px;color:var(--muted);font-size:8px}.operator-album-track-actions{display:flex;gap:3px}.operator-album-track-actions button{width:27px;height:27px;border:1px solid transparent;background:transparent;color:#908495;border-radius:7px;cursor:pointer}.operator-album-track-actions button:hover:not(:disabled){color:var(--cyan);border-color:rgba(32,231,255,.2);background:rgba(32,231,255,.04)}.operator-album-track-actions button.danger:hover{color:#ff63c9;border-color:rgba(255,53,218,.24);background:rgba(255,53,218,.04)}.operator-album-track-actions button:disabled{opacity:.25;cursor:not-allowed}
.operator-album-empty{padding:12px 9px;color:#827787;border:1px dashed rgba(255,255,255,.08);border-radius:9px;font:600 8px/1.5 ui-monospace,monospace}.operator-album-add-panel{margin-top:8px;padding:10px;border:1px solid rgba(255,53,218,.12);border-radius:10px;background:rgba(255,53,218,.018)}.operator-album-add-head{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:8px}.operator-album-add-head strong{font:800 8px/1 ui-monospace,monospace;letter-spacing:.1em}.operator-album-add-head span{display:flex;gap:5px}.operator-album-add-row{display:grid;grid-template-columns:34px minmax(0,1fr) auto;gap:8px;align-items:center;width:100%;padding:7px;border:1px solid rgba(255,255,255,.055);border-radius:9px;background:rgba(255,255,255,.018);color:#fff;text-align:left;cursor:pointer}.operator-album-add-row:hover{border-color:rgba(255,53,218,.2);background:rgba(255,53,218,.03)}.operator-album-add-row.included{border-color:rgba(32,231,255,.24);background:rgba(32,231,255,.035)}.operator-album-add-row span:nth-child(2){min-width:0}.operator-album-add-row strong,.operator-album-add-row small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.operator-album-add-row strong{font-size:10px}.operator-album-add-row small{margin-top:3px;color:var(--muted);font-size:8px}.operator-album-add-row b{color:#8e8493;font:800 8px/1 ui-monospace,monospace}.operator-album-add-row.included b{color:var(--cyan)}
.operator-actions--album{grid-template-columns:1fr 1fr}#operator-album-save{border-color:rgba(255,53,218,.26);color:#ff9be7;background:rgba(255,53,218,.04)}
@media(max-width:620px){.operator-album-manager-bar{grid-template-columns:1fr}.operator-album-playlist-import{grid-template-columns:1fr}.operator-album-playlist-import>small{grid-column:1}.operator-album-track-head{align-items:flex-start;flex-direction:column}.operator-album-track-head>div:last-child{width:100%}.operator-album-track-head button{flex:1}.operator-album-track-row{grid-template-columns:24px 34px minmax(0,1fr)}.operator-album-track-actions{grid-column:2/-1;justify-content:flex-end}.operator-album-track-actions button{width:34px;height:30px}.operator-cover-box--album-banner{min-height:64px}}


/* R5 // Lyrics Editor */
.operator-lyrics-toolbar{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:10px}
.operator-lyrics-toolbar button{min-height:34px}
.operator-lyrics-source,.operator-lyrics-structure{padding:8px 10px;border:1px solid rgba(255,255,255,.12);background:rgba(0,0,0,.22);font-size:11px;letter-spacing:.08em;overflow-wrap:anywhere}
.operator-lyrics-source{margin-bottom:10px;color:rgba(255,255,255,.68)}
.operator-lyrics-structure{margin-top:8px;color:rgba(255,255,255,.78)}
.operator-lyrics-timing{display:flex;flex-direction:column;gap:5px;padding:8px 0;min-width:0}
.operator-lyrics-timing span{font-size:10px;letter-spacing:.12em;color:rgba(255,255,255,.5)}
.operator-lyrics-timing strong{font-size:11px;font-weight:600;color:rgba(255,255,255,.82)}
#operator-lyrics-text{min-height:260px;resize:vertical;line-height:1.55;font-family:ui-monospace,SFMono-Regular,Consolas,"Liberation Mono",monospace}
.operator-lyrics-section-tools{display:flex;align-items:center;flex-wrap:wrap;gap:6px;margin-top:9px}
.operator-lyrics-section-tools>span{font-size:10px;letter-spacing:.12em;color:rgba(255,255,255,.5);margin-right:3px}
.operator-lyrics-section-tools button{padding:6px 9px;font-size:10px}
.operator-lyrics-actions{margin-top:12px}
@media (max-width:760px){.operator-lyrics-toolbar button{flex:1 1 145px}.operator-lyrics-section-tools button{flex:1 1 74px}#operator-lyrics-text{min-height:220px}}

/* =========================================================
   AAA-UI-1 // SHELL FOUNDATION + DESIGN SYSTEM NORMALIZATION
   Persistent visual stage remains untouched beneath the UI.
   This pass intentionally moves/restyles existing surfaces only.
   ========================================================= */
:root{
  --receiver-rail-width:clamp(292px,23vw,354px);
  --receiver-shell-gap:18px;
  --receiver-shell-pad:clamp(14px,2vw,24px);
  --receiver-topbar-height:82px;
  --receiver-workspace-left:calc(var(--receiver-shell-pad) + var(--receiver-rail-width) + var(--receiver-shell-gap));
  --aaa-panel:rgba(7,5,14,.78);
  --aaa-panel-strong:rgba(7,5,14,.94);
  --aaa-panel-soft:rgba(255,255,255,.027);
  --aaa-border:rgba(255,255,255,.10);
  --aaa-border-active:rgba(32,231,255,.30);
  --aaa-control:rgba(11,8,18,.84);
  --aaa-control-hover:rgba(24,17,34,.92);
  --aaa-control-disabled:rgba(255,255,255,.018);
  --aaa-shadow:0 24px 80px rgba(0,0,0,.42);
}

/* The performance stage is the application background, not a page. */
#app{
  background:linear-gradient(180deg,rgba(2,1,5,.12),rgba(2,1,5,.28));
}
#visual-stage{z-index:-1}

/* More deliberate application chrome. */
#topbar{
  min-height:var(--receiver-topbar-height);
  padding-left:var(--receiver-shell-pad);
  padding-right:var(--receiver-shell-pad);
  background:linear-gradient(180deg,rgba(3,2,7,.94) 0%,rgba(3,2,7,.76) 68%,rgba(3,2,7,.14) 100%);
  border-bottom:1px solid rgba(255,255,255,.035);
}
.search-shell{
  background:rgba(8,6,14,.76);
  border-color:rgba(255,255,255,.12);
  box-shadow:inset 0 1px rgba(255,255,255,.025),0 12px 30px rgba(0,0,0,.14);
}
.ghost-button{
  background:rgba(10,7,17,.80);
  border-color:rgba(255,255,255,.12);
  transition:border-color .16s ease,background .16s ease,box-shadow .16s ease,color .16s ease;
}
.ghost-button:hover{background:rgba(20,13,28,.90)}

/* Desktop shell: persistent catalog/player rail + expansive stage/workspace. */
#workspace{
  width:100%;
  max-width:none;
  min-height:calc(100svh - var(--receiver-topbar-height));
  grid-template-columns:var(--receiver-rail-width) minmax(0,1fr);
  gap:var(--receiver-shell-gap);
  padding:16px var(--receiver-shell-pad) 118px;
}
#library-panel{
  position:sticky;
  top:calc(var(--receiver-topbar-height) + 12px);
  align-self:start;
  max-height:calc(100svh - var(--receiver-topbar-height) - 32px);
  min-height:0;
  overflow:auto;
  padding:18px;
  background:linear-gradient(155deg,rgba(9,7,16,.88),rgba(4,3,9,.76));
  border-color:rgba(255,255,255,.09);
  box-shadow:inset 0 1px rgba(255,255,255,.03),0 24px 65px rgba(0,0,0,.34);
}
#library-panel::-webkit-scrollbar{width:6px}
#library-panel::-webkit-scrollbar-thumb{background:rgba(32,231,255,.18);border-radius:99px}
#now-panel{
  min-width:0;
  min-height:calc(100svh - var(--receiver-topbar-height) - 34px);
  border:1px solid rgba(255,255,255,.035);
  border-radius:24px;
  background:radial-gradient(circle at 50% 48%,rgba(5,3,10,.18),rgba(3,2,7,.40) 72%);
  backdrop-filter:blur(4px);
  overflow:hidden;
}
#now-panel:before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  pointer-events:none;
  background:linear-gradient(180deg,rgba(255,255,255,.012),transparent 30%,rgba(0,0,0,.12));
}
#art-frame{width:min(49vh,430px,64vw)}
.secondary-controls{
  background:rgba(8,5,14,.67);
  border-color:rgba(255,255,255,.085);
}

/* Unified actionable control language.  Prevent browser-default white buttons. */
#operator-panel button,
#visual-lab button,
.playlist-toolbar button,
.catalog-tabs button,
.operator-workspace-empty button,
.operator-album-manager-bar button,
.operator-album-track-head button,
.operator-album-add-head button,
.operator-lyrics-toolbar button,
.operator-lyrics-section-tools button{
  appearance:none;
  -webkit-appearance:none;
  border:1px solid rgba(255,255,255,.11);
  background:var(--aaa-control);
  color:rgba(245,240,249,.72);
  box-shadow:inset 0 1px rgba(255,255,255,.025);
  transition:background .14s ease,border-color .14s ease,color .14s ease,box-shadow .14s ease,transform .08s ease;
}
#operator-panel button:hover:not(:disabled),
#visual-lab button:hover:not(:disabled),
.playlist-toolbar button:hover:not(:disabled),
.catalog-tabs button:hover:not(:disabled),
.operator-lyrics-toolbar button:hover:not(:disabled),
.operator-lyrics-section-tools button:hover:not(:disabled){
  background:var(--aaa-control-hover);
  color:#fff;
  border-color:rgba(32,231,255,.30);
  box-shadow:0 0 22px rgba(32,231,255,.055);
}
#operator-panel button:active:not(:disabled),#visual-lab button:active:not(:disabled){transform:translateY(1px)}
#operator-panel button:disabled,#visual-lab button:disabled{
  background:var(--aaa-control-disabled);
  border-color:rgba(255,255,255,.055);
  color:rgba(255,255,255,.24);
  opacity:1;
}

/* Consistent primary actions. */
#operator-save,#operator-artist-save,#operator-album-save,#operator-lyrics-save{
  border-color:rgba(32,231,255,.34)!important;
  color:#baf8ff!important;
  background:linear-gradient(180deg,rgba(32,231,255,.10),rgba(32,231,255,.035))!important;
}
#operator-cancel,#operator-artist-cancel,#operator-album-cancel,#operator-lyrics-cancel{
  border-color:rgba(255,255,255,.10)!important;
  background:rgba(255,255,255,.018)!important;
}
#operator-lyrics-generate-pi{
  border-color:rgba(154,92,255,.28)!important;
  background:linear-gradient(180deg,rgba(154,92,255,.10),rgba(255,53,218,.035))!important;
  color:#d8c5ff!important;
}

/* Full workspace Operator: leaves the Receiver rail visible on desktop. */
#operator-panel{
  top:calc(var(--receiver-topbar-height) + 12px);
  left:var(--receiver-workspace-left);
  right:var(--receiver-shell-pad);
  bottom:18px;
  width:auto;
  max-width:none;
  padding:22px clamp(18px,2vw,30px) 28px;
  border-radius:22px;
  background:linear-gradient(150deg,rgba(8,6,15,.955),rgba(4,3,9,.925));
  border-color:rgba(32,231,255,.13);
  box-shadow:0 30px 100px rgba(0,0,0,.56),inset 0 1px rgba(255,255,255,.03);
  backdrop-filter:blur(28px) saturate(1.12);
}
.operator-head{
  position:sticky;
  top:-22px;
  z-index:25;
  margin:-22px 0 10px;
  padding:20px 0 14px;
  background:linear-gradient(180deg,rgba(7,5,13,.99) 76%,rgba(7,5,13,.84),transparent);
  backdrop-filter:blur(20px);
}
.operator-head strong{font-size:18px}
.operator-workspace-nav{
  top:54px;
  grid-template-columns:repeat(4,minmax(110px,170px));
  justify-content:start;
  gap:8px;
  padding:10px 0;
}
.operator-workspace-nav button{padding:11px 14px;font-size:8px;border-radius:10px}
.operator-workspace-context{max-width:760px;margin-bottom:16px}
.operator-workspace{max-width:1180px;margin:0 auto}
.operator-workspace[data-operator-workspace="track"]{max-width:1080px}
.operator-workspace[data-operator-workspace="artist"],
.operator-workspace[data-operator-workspace="album"]{max-width:1160px}
.operator-section{
  margin-top:16px;
  padding:17px;
  border-radius:14px;
  border-color:rgba(255,255,255,.075);
  background:linear-gradient(145deg,rgba(255,255,255,.023),rgba(255,255,255,.010));
}
.operator-section-title{margin-bottom:14px}
.operator-section-title span{font-size:9px;color:rgba(255,83,220,.88)}
.operator-section-title small{font-size:7px}
.operator-section input,.operator-section select,.operator-section textarea{
  min-height:38px;
  border-radius:10px;
  border-color:rgba(255,255,255,.10);
  background:rgba(4,3,8,.72);
  color:#f2edf6;
  padding:10px 11px;
  font-size:10px;
}
.operator-section textarea{min-height:auto}
.operator-section input:focus,.operator-section select:focus,.operator-section textarea:focus{
  background:rgba(7,5,12,.90);
  border-color:rgba(32,231,255,.38);
  box-shadow:0 0 0 3px rgba(32,231,255,.055),0 0 26px rgba(32,231,255,.035);
}
.operator-inline{gap:12px}
.operator-actions{position:sticky;bottom:-28px;z-index:18;padding:12px 0 2px;background:linear-gradient(0deg,rgba(5,3,10,.99) 68%,rgba(5,3,10,.80),transparent)}
.operator-actions button{min-height:40px;border-radius:10px}

/* Lyrics gets proper visual hierarchy instead of browser-default controls. */
.operator-lyrics-toolbar{padding:10px;border:1px solid rgba(255,255,255,.06);border-radius:11px;background:rgba(0,0,0,.15)}
.operator-lyrics-toolbar button{min-height:38px;border-radius:9px;padding:9px 12px;font:800 8px/1 ui-monospace,monospace;letter-spacing:.06em}
.operator-lyrics-section-tools button{border-radius:8px;background:rgba(255,255,255,.02);color:rgba(255,255,255,.58)}
#operator-lyrics-text{
  min-height:360px;
  padding:15px;
  background:rgba(2,2,6,.76);
  border-color:rgba(255,255,255,.105);
  font-size:12px;
  line-height:1.68;
}
.operator-lyrics-source,.operator-lyrics-structure{border-radius:9px;background:rgba(0,0,0,.30);border-color:rgba(255,255,255,.075)}

/* Artist/album media stays vertical and more editorial. */
.operator-artist-media-grid,.operator-album-media-stack{gap:14px}
.operator-media-slot{padding:13px;border:1px solid rgba(255,255,255,.065);border-radius:12px;background:rgba(0,0,0,.14)}
.operator-cover-actions button{min-height:36px;border-radius:9px}

/* Visual Lab adopts the same dark control system without changing its logic. */
#visual-lab-panel{
  border-color:rgba(255,255,255,.10);
  background:linear-gradient(145deg,rgba(9,6,16,.965),rgba(4,3,9,.955));
  box-shadow:var(--aaa-shadow),0 0 40px rgba(154,92,255,.055);
}
body[data-operator="on"] #visual-lab{right:calc(var(--receiver-shell-pad) + 8px)}

/* Responsive shell collapse. */
@media(max-width:1120px){
  :root{--receiver-rail-width:300px;--receiver-shell-gap:12px;--receiver-shell-pad:12px}
  #workspace{grid-template-columns:var(--receiver-rail-width) minmax(0,1fr)}
  .secondary-controls{grid-template-columns:repeat(3,minmax(0,1fr))}
  #operator-panel{left:calc(var(--receiver-shell-pad) + var(--receiver-rail-width) + var(--receiver-shell-gap));right:12px}
}
@media(max-width:860px){
  #workspace{grid-template-columns:1fr;padding-bottom:112px}
  #library-panel{position:relative;top:auto;max-height:320px}
  #now-panel{min-height:auto}
  #operator-panel{left:10px;right:10px;top:max(68px,calc(env(safe-area-inset-top) + 58px));bottom:10px;padding:16px}
  .operator-head{top:-16px;margin:-16px 0 8px;padding:15px 0 12px}
  .operator-workspace-nav{top:48px;grid-template-columns:repeat(4,minmax(0,1fr));overflow-x:auto;justify-content:stretch}
  .operator-workspace-nav button{min-width:86px}
  .operator-actions{bottom:-16px}
}
@media(max-width:620px){
  #operator-panel{border-radius:16px}
  .operator-workspace-nav{grid-template-columns:repeat(4,90px)}
  .operator-inline{grid-template-columns:1fr}
  #operator-lyrics-text{min-height:270px;font-size:11px}
}


/* ==========================================================================\n   AAA UI 2 // PLAYER STRIP + PERSISTENT INFO LAYER\n   DISPLAY -> VISUAL LAB -> INFO -> THEME -> VOLUME\n   ========================================================================== */
.secondary-controls{
  grid-template-columns:minmax(118px,1.05fr) minmax(112px,.9fr) minmax(100px,.78fr) minmax(112px,.9fr) minmax(145px,1.2fr)!important;
  align-items:stretch;
  gap:8px;
}
.secondary-controls .visual-lab-owned-controls{display:none!important}
.secondary-workspace-button{
  appearance:none;-webkit-appearance:none;min-width:0;min-height:50px;padding:8px 10px;border-radius:11px;
  border:1px solid rgba(255,255,255,.10);background:rgba(8,5,14,.72);color:rgba(245,240,249,.74);
  display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:5px;cursor:pointer;
  transition:background .15s ease,border-color .15s ease,color .15s ease,box-shadow .15s ease,transform .08s ease;
}
.secondary-workspace-button span{font:800 8px/1 ui-monospace,monospace;letter-spacing:.13em}
.secondary-workspace-button small{font:700 6px/1 ui-monospace,monospace;letter-spacing:.10em;color:rgba(255,255,255,.30)}
.secondary-workspace-button:hover,.secondary-workspace-button[aria-expanded="true"]{background:rgba(17,11,26,.91);border-color:rgba(32,231,255,.30);color:#fff;box-shadow:0 0 24px rgba(32,231,255,.055)}
.secondary-workspace-button[aria-expanded="true"] small{color:rgba(32,231,255,.62)}
.secondary-control select{height:100%}
.secondary-control--volume{justify-content:center}
#visual-lab>#visual-lab-toggle{display:none!important}

#track-info-panel{
  position:fixed;z-index:118;top:calc(var(--receiver-topbar-height) + 12px);right:var(--receiver-shell-pad);bottom:18px;
  width:min(560px,calc(100vw - var(--receiver-workspace-left) - var(--receiver-shell-pad)));overflow:auto;padding:20px;
  border-radius:22px;background:linear-gradient(150deg,rgba(8,6,15,.96),rgba(4,3,9,.94));border:1px solid rgba(32,231,255,.14);
  box-shadow:0 30px 100px rgba(0,0,0,.58),inset 0 1px rgba(255,255,255,.03);backdrop-filter:blur(28px) saturate(1.12);
}
#track-info-panel[hidden]{display:none!important}
#track-info-panel::-webkit-scrollbar{width:6px}#track-info-panel::-webkit-scrollbar-thumb{background:rgba(32,231,255,.19);border-radius:99px}
.track-info-head{position:sticky;top:-20px;z-index:4;display:flex;justify-content:space-between;align-items:center;gap:14px;padding:18px 0 14px;margin:-20px 0 8px;background:linear-gradient(180deg,rgba(7,5,13,.99) 78%,rgba(7,5,13,.82),transparent)}
.track-info-head>div{display:flex;flex-direction:column;gap:4px}.track-info-head small,.track-info-head em{font:700 6px/1 ui-monospace,monospace;letter-spacing:.14em;color:#82798d;font-style:normal}.track-info-head strong{font:900 17px/1 ui-monospace,monospace;letter-spacing:.08em;color:#f5eff8}
#track-info-close,.track-info-actions button,.track-info-entity-link{appearance:none;border:1px solid rgba(255,255,255,.11);background:rgba(11,8,18,.84);color:rgba(245,240,249,.72);border-radius:9px;padding:10px 12px;font:800 7px/1 ui-monospace,monospace;letter-spacing:.08em;cursor:pointer}
#track-info-close:hover,.track-info-actions button:hover:not(:disabled),.track-info-entity-link:hover:not(:disabled){color:#fff;border-color:rgba(32,231,255,.31);background:rgba(24,17,34,.92)}
.track-info-hero{display:grid;grid-template-columns:116px minmax(0,1fr);gap:17px;align-items:center;padding:13px;border:1px solid rgba(255,255,255,.07);border-radius:15px;background:rgba(0,0,0,.18)}
.track-info-art{aspect-ratio:1;border-radius:12px;overflow:hidden;display:grid;place-items:center;background:radial-gradient(circle,rgba(154,92,255,.14),rgba(0,0,0,.42));border:1px solid rgba(255,255,255,.075)}.track-info-art img{width:100%;height:100%;object-fit:cover}.track-info-art div{font:900 34px/1 serif;color:rgba(255,255,255,.18)}
.track-info-title-block{min-width:0}.track-info-kicker{font:800 7px/1.2 ui-monospace,monospace;letter-spacing:.14em;color:rgba(32,231,255,.55);text-transform:uppercase}.track-info-title-block h2{margin:8px 0 8px;font:900 clamp(20px,2.2vw,31px)/1.02 ui-sans-serif,system-ui,sans-serif;letter-spacing:-.025em;color:#fff;overflow-wrap:anywhere}.track-info-entity-link{padding:0;border:0;background:none;color:#b7aabd;font-size:9px;text-align:left}
.track-info-body{display:grid;gap:13px;margin-top:14px}.track-info-body section,.track-info-technical{padding:14px;border:1px solid rgba(255,255,255,.065);border-radius:13px;background:rgba(255,255,255,.018)}.track-info-body h3{margin:0 0 11px;font:800 7px/1 ui-monospace,monospace;letter-spacing:.15em;color:rgba(255,83,220,.82)}
.track-info-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px}.track-info-field{min-width:0;padding:9px;border-radius:9px;background:rgba(0,0,0,.22);border:1px solid rgba(255,255,255,.045);display:flex;flex-direction:column;gap:5px}.track-info-field--wide{grid-column:1/-1}.track-info-field span{font:700 6px/1 ui-monospace,monospace;letter-spacing:.12em;color:#766d80}.track-info-field strong{font:700 9px/1.35 ui-monospace,monospace;color:#ded5e3;overflow-wrap:anywhere}.track-info-lyrics span{font:700 6px/1 ui-monospace,monospace;letter-spacing:.1em;color:rgba(32,231,255,.55)}.track-info-lyrics p{margin:8px 0 0;color:#b9afc0;font:500 10px/1.55 ui-sans-serif,system-ui,sans-serif}.track-info-technical summary{cursor:pointer;font:800 7px/1 ui-monospace,monospace;letter-spacing:.13em;color:#82798d}.track-info-technical[open] summary{margin-bottom:11px;color:#b8aebe}.track-info-empty{padding:24px;text-align:center;color:#786f80;font:700 8px/1.5 ui-monospace,monospace;letter-spacing:.08em}
.track-info-actions{position:sticky;bottom:-20px;display:flex;justify-content:flex-end;gap:8px;margin:15px -2px -20px;padding:14px 2px 18px;background:linear-gradient(0deg,rgba(5,3,10,.99) 75%,rgba(5,3,10,.78),transparent)}.track-info-actions button:last-child{border-color:rgba(32,231,255,.30);color:#baf8ff;background:rgba(32,231,255,.06)}.track-info-actions button:disabled{opacity:.35;cursor:default}
body[data-info="on"] #track-info-launch{border-color:rgba(32,231,255,.34);color:#fff}

/* Display values now express shell intent without changing established playback modes. */
#app[data-mode="full"]{--receiver-view-state:browse}
#app[data-mode="visualizer"],#app[data-mode="artwork"]{--receiver-view-state:performance}
#app[data-mode="presentation"]{--receiver-view-state:immersive}

@media(max-width:1120px){.secondary-controls{grid-template-columns:repeat(5,minmax(90px,1fr))!important}#track-info-panel{width:min(520px,calc(100vw - 330px))}}
@media(max-width:860px){.secondary-controls{grid-template-columns:repeat(3,minmax(0,1fr))!important}.secondary-control--volume{grid-column:2/4}#track-info-panel{left:10px;right:10px;width:auto;top:max(68px,calc(env(safe-area-inset-top) + 58px));bottom:10px;padding:16px}.track-info-head{top:-16px;margin:-16px 0 8px}.track-info-actions{bottom:-16px;margin-bottom:-16px}}
@media(max-width:560px){.secondary-controls{grid-template-columns:1fr 1fr!important}.secondary-control--volume{grid-column:1/-1}.track-info-hero{grid-template-columns:88px minmax(0,1fr)}.track-info-grid{grid-template-columns:1fr}}

/* =========================================================
   AAA-UI-3 // BROWSE WORKSPACE OVER PERSISTENT VISUAL STAGE
   ========================================================= */
#browse-panel{
  position:fixed;z-index:112;
  top:calc(var(--receiver-topbar-height) + 12px);
  left:calc(var(--receiver-shell-pad) + var(--receiver-rail-width) + var(--receiver-shell-gap));
  right:var(--receiver-shell-pad);bottom:18px;
  overflow:auto;padding:20px 22px 34px;
  border:1px solid rgba(126,231,255,.18);border-radius:22px;
  background:linear-gradient(180deg,rgba(6,4,12,.93),rgba(6,4,12,.84) 72%,rgba(6,4,12,.90));
  box-shadow:0 32px 90px rgba(0,0,0,.42),inset 0 1px rgba(255,255,255,.035);
  backdrop-filter:blur(22px) saturate(118%);
}
#browse-panel[hidden]{display:none!important}
#browse-panel::-webkit-scrollbar{width:7px}
#browse-panel::-webkit-scrollbar-thumb{background:rgba(32,231,255,.20);border-radius:99px}
.browse-head{position:sticky;top:-20px;z-index:8;display:grid;grid-template-columns:minmax(220px,1fr) auto auto;align-items:center;gap:16px;margin:-20px -2px 18px;padding:18px 2px 14px;background:linear-gradient(180deg,rgba(6,4,12,.99) 78%,rgba(6,4,12,.88),transparent)}
.browse-brand{display:flex;flex-direction:column;gap:4px;min-width:0}.browse-brand small{font:700 9px/1.2 ui-monospace,Consolas,monospace;letter-spacing:.17em;color:rgba(255,255,255,.46)}.browse-brand strong{font:800 clamp(20px,2.1vw,30px)/1.05 system-ui,sans-serif;letter-spacing:-.025em}.browse-brand em{font:700 9px/1.2 ui-monospace,Consolas,monospace;letter-spacing:.11em;color:var(--cyan);font-style:normal;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.browse-nav{display:flex;gap:7px}.browse-nav button,.browse-performance-button,.browse-entity-actions button,.browse-hero button{min-height:40px;border:1px solid rgba(126,231,255,.18);border-radius:11px;background:rgba(255,255,255,.035);color:rgba(255,255,255,.76);padding:0 15px;font:800 10px/1 ui-monospace,Consolas,monospace;letter-spacing:.08em;cursor:pointer}.browse-nav button:hover,.browse-nav button.active,.browse-performance-button:hover,.browse-entity-actions button:hover,.browse-hero button:hover{border-color:rgba(32,231,255,.52);color:#fff;background:rgba(32,231,255,.10);box-shadow:0 0 24px rgba(32,231,255,.08)}.browse-nav button.active{color:var(--cyan)}.browse-performance-button{border-color:rgba(220,70,255,.34);color:#efbaff}.browse-performance-button:hover{border-color:rgba(220,70,255,.65);background:rgba(220,70,255,.10)}
.browse-content{display:flex;flex-direction:column;gap:28px;min-height:60vh}.browse-hero{min-height:220px;display:flex;align-items:flex-end;justify-content:space-between;gap:22px;padding:28px;border:1px solid rgba(126,231,255,.14);border-radius:20px;background:radial-gradient(circle at 75% 20%,rgba(169,55,255,.13),transparent 34%),linear-gradient(135deg,rgba(32,231,255,.055),rgba(255,255,255,.018));overflow:hidden}.browse-hero small,.browse-entity-hero small,.browse-section-head small{display:block;margin-bottom:8px;font:800 9px/1 ui-monospace,Consolas,monospace;letter-spacing:.16em;color:var(--cyan)}.browse-hero h2,.browse-entity-hero h2{margin:0;font:850 clamp(30px,4vw,58px)/.98 system-ui,sans-serif;letter-spacing:-.045em;max-width:900px}.browse-hero p,.browse-entity-hero p{margin:13px 0 0;max-width:760px;color:rgba(255,255,255,.62);font-size:14px;line-height:1.55}
.browse-section{display:flex;flex-direction:column;gap:12px}.browse-section-head{display:flex;align-items:end;justify-content:space-between;gap:16px}.browse-section-head h3{margin:0;font:800 19px/1.1 system-ui,sans-serif;letter-spacing:-.02em}.browse-section-head>span{font:700 9px/1 ui-monospace,Consolas,monospace;letter-spacing:.11em;color:rgba(255,255,255,.42)}
.browse-card-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px}.browse-card{min-width:0;text-align:left;border:1px solid rgba(255,255,255,.075);border-radius:15px;padding:10px;background:rgba(255,255,255,.026);color:#fff;cursor:pointer;transition:transform .16s ease,border-color .16s ease,background .16s ease}.browse-card:hover{transform:translateY(-2px);border-color:rgba(32,231,255,.34);background:rgba(32,231,255,.05)}.browse-card-art{display:grid;place-items:center;aspect-ratio:1/1;border-radius:11px;overflow:hidden;margin-bottom:10px;background:radial-gradient(circle,rgba(32,231,255,.12),rgba(105,34,139,.14) 46%,rgba(0,0,0,.3));font:800 30px/1 ui-monospace,Consolas,monospace;color:var(--cyan)}.browse-card-art img{width:100%;height:100%;object-fit:cover}.browse-card-art--artist{border-radius:50%}.browse-card strong,.browse-card small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.browse-card strong{font-size:13px;margin-bottom:5px}.browse-card small{color:rgba(255,255,255,.47);font-size:10px}.browse-card--playlist .browse-card-art{aspect-ratio:1.25/1}
.browse-track-results{display:flex;flex-direction:column;border:1px solid rgba(255,255,255,.07);border-radius:15px;overflow:hidden;background:rgba(0,0,0,.13)}.browse-track-row{display:grid;grid-template-columns:38px 42px minmax(0,1fr) auto;align-items:center;gap:11px;min-height:61px;padding:8px 13px;border:0;border-bottom:1px solid rgba(255,255,255,.055);background:transparent;color:#fff;text-align:left;cursor:pointer}.browse-track-row:last-child{border-bottom:0}.browse-track-row:hover{background:rgba(32,231,255,.055)}.browse-track-row>span:first-child{font:700 10px/1 ui-monospace,Consolas,monospace;color:rgba(255,255,255,.36)}.browse-track-thumb{display:grid;place-items:center;width:42px;height:42px;border-radius:8px;overflow:hidden;background:rgba(255,255,255,.04);color:var(--cyan)}.browse-track-thumb img{width:100%;height:100%;object-fit:cover}.browse-track-row strong,.browse-track-row small{display:block}.browse-track-row strong{font-size:12px}.browse-track-row small{margin-top:4px;color:rgba(255,255,255,.45);font-size:9px}.browse-track-row em{font:700 8px/1 ui-monospace,Consolas,monospace;letter-spacing:.07em;color:rgba(255,255,255,.35);font-style:normal}
.browse-entity-hero{display:grid;grid-template-columns:minmax(180px,280px) minmax(0,1fr);align-items:end;gap:26px;padding:8px 4px 12px}.browse-entity-art{aspect-ratio:1/1;border-radius:18px;overflow:hidden;display:grid;place-items:center;background:radial-gradient(circle,rgba(32,231,255,.13),rgba(130,45,180,.12),rgba(0,0,0,.24));font:800 50px/1 ui-monospace,Consolas,monospace;color:var(--cyan);box-shadow:0 22px 50px rgba(0,0,0,.28)}.browse-entity-art img{width:100%;height:100%;object-fit:cover}.browse-entity-actions{display:flex;gap:9px;margin-top:18px}.browse-entity-actions button:first-child{border-color:rgba(32,231,255,.44);background:rgba(32,231,255,.10);color:var(--cyan)}
.browse-search-empty{min-height:56vh;display:grid;place-items:center;text-align:center;align-content:center;gap:8px}.browse-search-empty>span{font:300 56px/1 system-ui;color:rgba(32,231,255,.55)}.browse-search-empty h2{margin:0;font-size:30px}.browse-search-empty p{max-width:620px;margin:0;color:rgba(255,255,255,.48);line-height:1.55}.browse-empty{grid-column:1/-1;padding:22px;border:1px dashed rgba(255,255,255,.09);border-radius:13px;color:rgba(255,255,255,.43);font-size:12px}.browse-network{padding:20px;border:1px solid rgba(220,70,255,.11);border-radius:17px;background:rgba(90,24,110,.045)}.browse-network-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.browse-network-grid article{min-height:94px;padding:14px;border:1px solid rgba(255,255,255,.065);border-radius:12px;background:rgba(255,255,255,.022)}.browse-network-grid b,.browse-network-grid span{display:block}.browse-network-grid b{font:800 10px/1.2 ui-monospace,Consolas,monospace;letter-spacing:.08em;color:#e7b7ff}.browse-network-grid span{margin-top:9px;color:rgba(255,255,255,.44);font-size:10px;line-height:1.45}
body[data-browse="on"] #library-panel{opacity:.70;filter:saturate(.82)}
@media(max-width:1120px){#browse-panel{left:calc(var(--receiver-shell-pad) + var(--receiver-rail-width) + 8px)}.browse-network-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.browse-head{grid-template-columns:1fr auto}.browse-nav{order:3;grid-column:1/-1}}
@media(max-width:860px){#browse-panel{left:10px;right:10px;top:max(68px,calc(env(safe-area-inset-top) + 58px));bottom:10px;padding:16px;border-radius:16px}.browse-head{top:-16px;margin:-16px 0 12px;padding-top:15px}.browse-card-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.browse-entity-hero{grid-template-columns:120px 1fr;gap:15px}.browse-entity-hero h2{font-size:30px}.browse-hero{min-height:190px;padding:20px}.browse-hero h2{font-size:34px}.browse-track-row{grid-template-columns:28px 38px minmax(0,1fr)}.browse-track-row em{display:none}.browse-network-grid{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.browse-head{grid-template-columns:1fr auto}.browse-brand em{display:none}.browse-nav{width:100%}.browse-nav button{flex:1}.browse-performance-button{padding:0 10px}.browse-card-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.browse-entity-hero{grid-template-columns:1fr}.browse-entity-art{width:min(48vw,190px)}.browse-network-grid{grid-template-columns:1fr}.browse-hero{align-items:flex-start;flex-direction:column}.browse-track-row{padding-left:8px;padding-right:8px}}


/* =========================================================
   AAA-UI-4 // TRANSPARENT PERFORMANCE STAGE + ANALYTICS FOUNDATION
   ========================================================= */
/* The workspace itself must never frost or blur the live performance. */
#browse-panel{
  background:transparent!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
  border-color:transparent!important;
  box-shadow:none!important;
}
/* Keep content readable with discrete surfaces while the visualizer stays crisp between them. */
.browse-head{
  top:-20px;
  padding:14px 16px;
  margin:-8px -4px 18px;
  border:1px solid rgba(126,231,255,.13);
  border-radius:16px;
  background:rgba(6,4,12,.76)!important;
  box-shadow:0 16px 44px rgba(0,0,0,.24);
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
}
.browse-hero,.browse-section,.browse-network,.browse-entity-hero{position:relative}
.browse-hero,.browse-network{background-color:rgba(6,4,12,.70)}
.browse-card,.browse-track-results,.browse-network-grid article{background-color:rgba(7,5,13,.72)}
.browse-entity-hero{padding:18px;border:1px solid rgba(255,255,255,.07);border-radius:18px;background:rgba(6,4,12,.58)}
.browse-section>.browse-section-head{padding:0 3px;text-shadow:0 2px 12px rgba(0,0,0,.85)}
body[data-browse="on"] #library-panel{opacity:.82;filter:none}

/* Operator analytics is a real workspace, but server listening metrics remain intentionally blank until connected. */
.operator-workspace-nav{grid-template-columns:repeat(5,minmax(0,1fr))}
.operator-analytics{max-width:1180px;margin:0 auto}
.analytics-notice{padding:16px 18px;border:1px solid rgba(220,70,255,.18);border-radius:14px;background:linear-gradient(135deg,rgba(220,70,255,.075),rgba(32,231,255,.035));margin-bottom:16px}
.analytics-notice strong{display:block;color:#f0c3ff;font:850 10px/1.2 ui-monospace,Consolas,monospace;letter-spacing:.11em}
.analytics-notice p{margin:9px 0 0;max-width:900px;color:rgba(255,255,255,.52);font-size:11px;line-height:1.6}
.analytics-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-bottom:16px}
.analytics-grid article{min-height:112px;padding:15px;border:1px solid rgba(126,231,255,.12);border-radius:14px;background:rgba(255,255,255,.025);display:flex;flex-direction:column;justify-content:center}
.analytics-grid span,.analytics-grid small{font:750 8px/1.2 ui-monospace,Consolas,monospace;letter-spacing:.12em;color:rgba(255,255,255,.40)}
.analytics-grid strong{margin:9px 0 6px;font:850 31px/1 system-ui,sans-serif;color:var(--cyan)}
.analytics-panels{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:11px}
.analytics-panels>section{padding:16px;border:1px solid rgba(255,255,255,.07);border-radius:14px;background:rgba(7,5,13,.54)}
.analytics-panels h3{margin:0 0 12px;color:rgba(255,255,255,.76);font:850 9px/1 ui-monospace,Consolas,monospace;letter-spacing:.13em}
.analytics-metric-list{display:flex;flex-direction:column;gap:1px}
.analytics-metric-list>div{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:10px 0;border-bottom:1px solid rgba(255,255,255,.055)}
.analytics-metric-list>div:last-child{border-bottom:0}
.analytics-metric-list span{font:700 8px/1.2 ui-monospace,Consolas,monospace;letter-spacing:.08em;color:rgba(255,255,255,.40)}
.analytics-metric-list strong{color:rgba(255,255,255,.72);font:800 13px/1 system-ui,sans-serif}
@media(max-width:980px){.operator-workspace-nav{grid-template-columns:repeat(5,minmax(88px,1fr));overflow-x:auto}.analytics-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.analytics-panels{grid-template-columns:1fr}}
@media(max-width:560px){.analytics-grid{grid-template-columns:1fr 1fr}.browse-head{margin:-8px 0 14px;padding:12px}.browse-entity-hero{padding:13px}}


/* =========================================================
   AAA-UI-5 // CRISP PERFORMANCE STAGE + GLASS CATALOG + ANALYTICS LAYOUT
   ========================================================= */
/* The main player is only content laid over the persistent visualizer. */
#now-panel{
  background:transparent!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
  border-color:transparent!important;
  box-shadow:none!important;
}
#now-panel::before{
  background:transparent!important;
  opacity:0!important;
}

/* The persistent catalog/playlist rail provides the deliberate frosted surface instead. */
#library-panel.catalog-panel{
  background:linear-gradient(155deg,rgba(9,7,16,.72),rgba(4,3,9,.58))!important;
  backdrop-filter:blur(24px) saturate(1.18)!important;
  -webkit-backdrop-filter:blur(24px) saturate(1.18)!important;
  border-color:rgba(255,255,255,.10)!important;
  box-shadow:inset 0 1px rgba(255,255,255,.035),0 24px 65px rgba(0,0,0,.30)!important;
}

/* Keep all five Operator entity workspaces on one line at desktop widths. */
.operator-workspace-nav{
  display:grid!important;
  grid-template-columns:repeat(5,minmax(104px,1fr))!important;
  grid-auto-flow:column;
  width:min(100%,860px);
  max-width:860px;
  overflow:visible;
}

/* Local organization cards now include playlists as a first-class foundation count. */
.analytics-grid{
  grid-template-columns:repeat(5,minmax(0,1fr))!important;
}

@media(max-width:1100px){
  .operator-workspace-nav{width:100%;max-width:none;grid-template-columns:repeat(5,minmax(96px,1fr))!important;overflow-x:auto}
  .analytics-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}
}
@media(max-width:720px){
  .analytics-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}

/* =========================================================
   AAA-UI-6 // PUBLIC ENTITY SURFACES + CONNECTED BROWSE
   ========================================================= */
.track-info-album-link{
  appearance:none;
  border:0;
  padding:0;
  background:transparent;
  cursor:pointer;
  text-align:left;
}
.track-info-album-link:not(:disabled):hover{color:#fff;text-decoration:underline;text-decoration-color:rgba(32,231,255,.35);text-underline-offset:4px}
.track-info-album-link:disabled{cursor:default}

.browse-track-row{cursor:default}
.browse-track-copy{
  appearance:none;
  min-width:0;
  border:0;
  padding:5px 0;
  background:transparent;
  color:#fff;
  text-align:left;
  cursor:pointer;
}
.browse-track-copy:hover strong{color:var(--cyan)}
.browse-track-actions{display:flex;align-items:center;gap:6px}
.browse-track-actions button{
  appearance:none;
  min-height:30px;
  border:1px solid rgba(255,255,255,.09);
  border-radius:8px;
  padding:0 10px;
  background:rgba(7,5,13,.66);
  color:rgba(255,255,255,.62);
  font:800 7px/1 ui-monospace,Consolas,monospace;
  letter-spacing:.09em;
  cursor:pointer;
}
.browse-track-actions button:first-child{border-color:rgba(32,231,255,.23);color:#bdf8ff}
.browse-track-actions button:hover{border-color:rgba(220,70,255,.42);color:#fff;background:rgba(220,70,255,.08)}

.browse-entity-hero{overflow:hidden;isolation:isolate}
.browse-entity-hero.has-hero::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-2;
  background-image:linear-gradient(90deg,rgba(4,3,9,.92) 0%,rgba(4,3,9,.67) 42%,rgba(4,3,9,.40) 100%),var(--entity-hero);
  background-size:cover;
  background-position:center;
  opacity:.72;
}
.browse-entity-hero.has-hero::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  background:linear-gradient(180deg,transparent 55%,rgba(5,3,10,.72));
  pointer-events:none;
}
.browse-entity-art--artist{border-radius:50%}
.browse-entity-about{
  display:grid;
  grid-template-columns:minmax(0,1.5fr) minmax(220px,.8fr);
  gap:18px;
  padding:18px;
  border:1px solid rgba(255,255,255,.065);
  border-radius:16px;
  background:rgba(6,4,12,.58);
}
.browse-entity-about small{display:block;margin-bottom:8px;color:var(--cyan);font:800 8px/1 ui-monospace,Consolas,monospace;letter-spacing:.14em}
.browse-entity-about p{margin:0;color:rgba(255,255,255,.68);font-size:12px;line-height:1.7;white-space:pre-line}
.browse-entity-about em{display:block;margin-top:10px;color:rgba(255,255,255,.37);font:750 8px/1.45 ui-monospace,Consolas,monospace;letter-spacing:.07em;font-style:normal}
.browse-entity-chips{display:flex;align-content:flex-start;justify-content:flex-end;flex-wrap:wrap;gap:7px}
.browse-entity-chips span{padding:7px 9px;border:1px solid rgba(32,231,255,.12);border-radius:999px;background:rgba(32,231,255,.035);color:rgba(255,255,255,.59);font:750 7px/1 ui-monospace,Consolas,monospace;letter-spacing:.07em}

@media(max-width:860px){
  .browse-track-row{grid-template-columns:28px 38px minmax(0,1fr) auto}
  .browse-track-actions button{padding:0 8px}
  .browse-entity-about{grid-template-columns:1fr}
  .browse-entity-chips{justify-content:flex-start}
}
@media(max-width:560px){
  .browse-track-row{grid-template-columns:26px 36px minmax(0,1fr)}
  .browse-track-actions{grid-column:3;justify-content:flex-start;padding-bottom:6px}
  .browse-track-actions button{min-height:28px}
}


/* =========================================================
   AAA-UI-7 // NAVIGATION + IDLE PERFORMANCE STAGE
   ========================================================= */
.mobile-menu-toggle,.mobile-menu{display:none}
@media (max-width:760px){
  #topbar{display:grid;grid-template-columns:auto minmax(0,1fr);gap:9px;align-items:center}
  #topbar .search-shell{grid-column:2;width:100%}
  .mobile-menu-toggle{display:grid;place-items:center;width:42px;height:42px;border:1px solid rgba(32,231,255,.22);border-radius:12px;background:rgba(5,4,11,.82);color:var(--cyan);font-size:21px;cursor:pointer}
  .mobile-menu{position:absolute;top:62px;left:12px;z-index:140;display:flex;flex-direction:column;width:min(250px,calc(100vw - 24px));padding:8px;border:1px solid rgba(32,231,255,.18);border-radius:14px;background:rgba(5,4,11,.96);box-shadow:0 24px 60px rgba(0,0,0,.48)}
  .mobile-menu[hidden]{display:none}
  .mobile-menu button{min-height:42px;border:0;border-bottom:1px solid rgba(255,255,255,.06);background:transparent;color:#fff;text-align:left;padding:0 12px;font:750 9px/1 ui-monospace,Consolas,monospace;letter-spacing:.12em;cursor:pointer}
  .mobile-menu button:last-child{border-bottom:0}
  .mobile-menu button:hover,.mobile-menu button:focus-visible{background:rgba(32,231,255,.06);color:var(--cyan);outline:none}
}


/* =========================================================
   R6 // PERSISTENT SCENE + REACTIVE VISUALIZER SEPARATION
   ========================================================= */
#visual-stage{opacity:1!important;transition:none;pointer-events:none}
#scene-stage,#reactive-stage{position:absolute;inset:0}
#scene-stage{z-index:0;opacity:1;pointer-events:none}
#reactive-stage{z-index:2;opacity:0;transition:opacity .55s ease;pointer-events:none}
body[data-performance-active="on"] #reactive-stage{opacity:1}
body[data-performance-active="off"] #reactive-stage{opacity:0}
#presentation-art-layer{z-index:1}
#visualizer-canvas{position:absolute;inset:0}
#visualizer-name{z-index:3}

/* Scene remains available while there is no active playback. Reactive visual
   output fades independently and the render loop idles in app.js. */
body[data-performance-active="off"] #scene-stage,
body[data-signal-loaded="off"] #scene-stage{opacity:1}

/* ==========================================================================
   AAA SHELL CLEANUP // BROWSE / COMPACT PLAYER / PUBLIC DISPLAY NAME
   ========================================================================== */
#receiver-copyright{position:fixed;left:50%;bottom:5px;transform:translateX(-50%);z-index:1200;color:#fff;font:700 9px/1 ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:.11em;text-shadow:0 1px 4px #000,0 0 10px rgba(0,0,0,.85);pointer-events:none;white-space:nowrap;opacity:.88}

/* Browse is one workspace, not a stack of headers over the performance. */
#browse-panel{padding-top:14px!important}
#browse-panel .browse-head{display:none!important}
.browse-hero{display:none!important}
.browse-entity-summary{display:grid;grid-template-columns:72px minmax(0,1fr) auto;gap:16px;align-items:center;padding:4px 2px 16px;border-bottom:1px solid rgba(255,255,255,.08);background:transparent!important;backdrop-filter:none!important}
.browse-entity-summary-art{width:72px;aspect-ratio:1;border-radius:13px;overflow:hidden;border:1px solid rgba(255,255,255,.1);background:rgba(5,4,9,.6);display:grid;place-items:center}
.browse-entity-summary-art img{width:100%;height:100%;object-fit:cover}.browse-entity-summary small{display:block;color:var(--cyan);font:800 8px/1 ui-monospace,monospace;letter-spacing:.14em}.browse-entity-summary h2{margin:7px 0 4px;font-size:clamp(22px,3vw,42px);line-height:1.02;overflow-wrap:anywhere}.browse-entity-summary p{margin:0;color:rgba(255,255,255,.56)}

/* While browsing, the full center player gets out of the way. */
body[data-browse="on"] #now-panel{display:none!important}
body[data-browse="on"] #library-panel{padding-bottom:178px}
.browse-rail-player{position:absolute;left:14px;right:14px;bottom:14px;z-index:9;padding:10px;border:1px solid rgba(255,255,255,.11);border-radius:14px;background:rgba(8,6,12,.72);backdrop-filter:blur(14px);box-shadow:0 18px 50px rgba(0,0,0,.35)}
.browse-rail-player[hidden]{display:none!important}.browse-rail-player-main{display:grid;grid-template-columns:42px minmax(0,1fr);gap:9px;align-items:center}.browse-rail-art{width:42px;height:42px;border-radius:9px;display:grid;place-items:center;background:rgba(255,53,218,.07);border:1px solid rgba(255,255,255,.08);background-size:cover;background-position:center}.browse-rail-art.has-art>span{opacity:0}.browse-rail-copy{min-width:0}.browse-rail-copy strong,.browse-rail-copy span{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.browse-rail-copy strong{font-size:10px}.browse-rail-copy span{margin-top:3px;color:var(--muted);font-size:8px}.browse-rail-controls{display:flex;justify-content:center;gap:7px;margin:8px 0 5px}.browse-rail-controls button{width:34px;height:30px;border:1px solid rgba(255,255,255,.1);border-radius:9px;background:rgba(255,255,255,.025);color:#fff;cursor:pointer}.browse-rail-controls button:nth-child(2){border-color:rgba(255,53,218,.3);background:rgba(255,53,218,.08)}.browse-rail-progress input{width:100%;height:3px}.browse-rail-progress span{display:flex;justify-content:space-between;margin-top:4px;color:rgba(255,255,255,.45);font:700 7px/1 ui-monospace,monospace}

/* Technical metadata stays in Operator; public-facing UI favors curated names. */
#operator-display-name{border-color:rgba(32,231,255,.2)}

@media(max-width:760px){#receiver-copyright{font-size:7px;bottom:3px;letter-spacing:.07em}.browse-entity-summary{grid-template-columns:52px minmax(0,1fr);gap:10px}.browse-entity-summary-art{width:52px}.browse-entity-summary .browse-entity-actions{grid-column:1/-1}.browse-rail-player{position:sticky;left:auto;right:auto;bottom:4px;margin-top:10px}}


/* R7 // performance inactivity auto-hide */
#topbar, #workspace, #browse-panel, #track-info-panel, #mini-player, #collapsed-player, #presentation-overlay, .receiver-footer {
  transition: opacity .55s ease, transform .55s ease;
}
body[data-ui-idle="true"] #topbar,
body[data-ui-idle="true"] #workspace,
body[data-ui-idle="true"] #browse-panel,
body[data-ui-idle="true"] #track-info-panel,
body[data-ui-idle="true"] #mini-player,
body[data-ui-idle="true"] #collapsed-player,
body[data-ui-idle="true"] #presentation-overlay {
  opacity: 0 !important;
  pointer-events: none !important;
}
body[data-ui-idle="true"] .receiver-footer { opacity: .32; }
@media (prefers-reduced-motion: reduce) {
  #topbar, #workspace, #browse-panel, #track-info-panel, #mini-player, #collapsed-player, #presentation-overlay, .receiver-footer { transition-duration: .01ms !important; }
}

/* =========================================================
   PiXELBURGH // SiGNAL RECEiVER
   R7.1 // VISUAL LAB ORCHESTRATION UI POLISH
   ========================================================= */
.vl-tabs{grid-template-columns:repeat(4,minmax(0,1fr))}
.vl-section-head--hero{margin-bottom:14px;padding-bottom:12px;border-bottom:1px solid rgba(255,255,255,.065)}

.vl-settings-group{
  margin:0 0 12px;
  padding:12px;
  border:1px solid rgba(255,255,255,.075);
  border-radius:12px;
  background:linear-gradient(145deg,rgba(255,255,255,.025),rgba(255,255,255,.009));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.018);
}
.vl-settings-group--transition{border-color:rgba(219,55,255,.14);background:linear-gradient(145deg,rgba(219,55,255,.035),rgba(255,255,255,.008))}
.vl-settings-group--smart{border-color:rgba(62,221,255,.11)}
.vl-group-head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;margin-bottom:10px}
.vl-group-head strong{display:block;color:rgba(255,255,255,.88);font:700 9px/1.2 ui-monospace,Consolas,monospace;letter-spacing:.12em}
.vl-group-head small{display:block;margin-top:4px;color:rgba(255,255,255,.27);font:700 7px/1.3 ui-monospace,Consolas,monospace;letter-spacing:.075em}
.vl-status-pill{align-self:center;padding:5px 7px;border:1px solid rgba(62,221,255,.18);border-radius:999px;color:rgba(62,221,255,.68);background:rgba(62,221,255,.035);font:700 7px/1 ui-monospace,Consolas,monospace;letter-spacing:.1em}

.vl-source-card{
  display:grid;
  grid-template-columns:112px 1fr;
  gap:12px;
  align-items:center;
  margin:2px 0 12px;
  padding:10px 11px;
  border:1px solid rgba(219,55,255,.18);
  border-radius:10px;
  background:rgba(219,55,255,.035);
}
.vl-source-card>div span{display:block;color:rgba(255,255,255,.32);font:700 7px/1 ui-monospace,Consolas,monospace;letter-spacing:.11em}
.vl-source-card>div strong{display:block;margin-top:6px;color:#fff;font:800 11px/1 ui-monospace,Consolas,monospace;letter-spacing:.12em}
.vl-source-card p{margin:0;color:rgba(255,255,255,.4);font:700 7px/1.55 ui-monospace,Consolas,monospace;letter-spacing:.04em;text-align:right}

.vl-control-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.vl-control-grid .vl-select-control{display:block;margin:7px 0}
.vl-control-grid .vl-select-control>span{display:block;margin:0 0 6px}
.vl-settings-group>.vl-select-control{margin:8px 0}
.vl-context-hint{margin-top:8px;color:rgba(255,255,255,.29);font:700 7px/1.55 ui-monospace,Consolas,monospace;letter-spacing:.035em}
.vl-context-hint[hidden]{display:none!important}
.vl-smart-check{margin:0 0 8px!important;padding:9px 10px!important}

.vl-disclosure{
  margin-top:10px;
  border:1px solid rgba(255,255,255,.065);
  border-radius:10px;
  background:rgba(0,0,0,.15);
  overflow:hidden;
}
.vl-disclosure>summary{
  list-style:none;
  cursor:pointer;
  padding:10px 11px;
  color:rgba(255,255,255,.55);
  font:700 8px/1 ui-monospace,Consolas,monospace;
  letter-spacing:.09em;
  user-select:none;
}
.vl-disclosure>summary::-webkit-details-marker{display:none}
.vl-disclosure>summary::after{content:"+";float:right;color:rgba(219,55,255,.75);font-size:11px}
.vl-disclosure[open]>summary::after{content:"−"}
.vl-disclosure[open]>summary{border-bottom:1px solid rgba(255,255,255,.055);color:rgba(255,255,255,.76)}
.vl-disclosure-body{padding:9px 10px 11px}
.vl-disclosure--runtime{margin:12px 0;background:rgba(255,255,255,.008)}
.vl-disclosure--runtime .vl-runtime-grid{margin:4px 0 10px}

#vl-smart-random-controls{margin-top:0}
#vl-smart-random-inactive{padding:8px 0 2px}
.vl-settings-group .vl-seed-box{margin-top:8px}
.vl-settings-group .vl-orchestrator-actions{margin-top:8px}

@media(max-width:700px){
  .vl-tabs{grid-template-columns:repeat(2,minmax(0,1fr))}
  .vl-control-grid{grid-template-columns:1fr}
  .vl-source-card{grid-template-columns:1fr}
  .vl-source-card p{text-align:left}
}

/* =========================================================
   R8A // SCENE COMPOSER V2 FOUNDATION
   ========================================================= */
.vl-tabs{display:flex;gap:7px;overflow-x:auto;overflow-y:hidden;padding-bottom:3px;scrollbar-width:thin;scroll-snap-type:x proximity}
.vl-tabs button{flex:1 0 max-content;min-width:92px;padding:10px 12px;white-space:nowrap;scroll-snap-align:start}
.vl-tabs button[data-vl-tab="orchestration"]{min-width:132px}
.vl-scene-toolbar,.vl-scene-savebar{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin:0 0 10px}
.vl-scene-toolbar button,.vl-scene-savebar button,.vl-saved-scene-row>button:last-child{
  min-height:34px;border:1px solid rgba(255,255,255,.09);border-radius:8px;background:rgba(255,255,255,.025);color:rgba(255,255,255,.66);font:700 8px/1 ui-monospace,Consolas,monospace;letter-spacing:.08em;cursor:pointer
}
.vl-scene-toolbar button:disabled{opacity:.34;cursor:not-allowed}
.vl-scene-savebar{grid-template-columns:minmax(0,1fr) auto;margin-top:12px}
.vl-scene-savebar input{min-width:0;border:1px solid rgba(255,255,255,.09);border-radius:8px;background:rgba(0,0,0,.18);color:#fff;padding:9px 10px;font:700 8px/1 ui-monospace,Consolas,monospace;letter-spacing:.07em;outline:none}
.vl-scene-savebar input:focus{border-color:rgba(62,221,255,.35)}
.vl-scene-saved-list{display:grid;gap:6px;margin:0 0 12px}
.vl-saved-scene-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px;padding:5px;border:1px solid rgba(255,255,255,.06);border-radius:9px;background:rgba(255,255,255,.014)}
.vl-saved-scene-row>button:first-child{border:0;background:transparent;color:#fff;text-align:left;padding:6px 8px;cursor:pointer}
.vl-saved-scene-row strong,.vl-saved-scene-row small{display:block}
.vl-saved-scene-row strong{font:700 8px/1.2 ui-monospace,Consolas,monospace;letter-spacing:.08em}
.vl-saved-scene-row small{margin-top:4px;color:rgba(255,255,255,.3);font:700 7px/1.2 ui-monospace,Consolas,monospace;letter-spacing:.05em}
.vl-actions{grid-template-columns:repeat(2,minmax(0,1fr))!important}
@media(max-width:700px){
  .vl-tabs{display:flex;grid-template-columns:none}
  .vl-tabs button{flex:0 0 auto;min-width:104px;font-size:7px;letter-spacing:.035em}
  .vl-tabs button[data-vl-tab="orchestration"]{min-width:126px}
  .vl-scene-toolbar{grid-template-columns:1fr}
}


/* =========================================================
   R8B // SCENE COMPOSER V2 BEHAVIORS + VISUAL LAB WORKSPACE
   ========================================================= */
/* Tabs wrap instead of scrolling/squeezing. */
.vl-tabs{display:flex!important;flex-wrap:wrap!important;overflow:visible!important;gap:7px!important}
.vl-tabs button{flex:1 1 44%;min-width:132px;white-space:normal;line-height:1.2}
@media(min-width:560px){.vl-tabs button{flex:1 1 calc(50% - 7px)}}
@media(min-width:760px){.vl-tabs button{flex:1 1 0;min-width:118px}}

/* Visual Lab is a workspace: full player collapses into the Catalog rail. */
body[data-visual-lab="on"] #now-panel{display:none!important}
body[data-visual-lab="on"] #library-panel{min-height:calc(100vh - var(--receiver-topbar-height) - 28px)}
body[data-visual-lab="on"] #visual-lab{left:calc(var(--receiver-shell-pad) + var(--receiver-rail-width) + var(--receiver-shell-gap));right:var(--receiver-shell-pad);top:calc(var(--receiver-topbar-height) + 10px);bottom:18px;align-items:stretch}
body[data-visual-lab="on"] #visual-lab-panel{width:100%;height:100%;max-height:none;border-radius:18px}
@media(max-width:860px){body[data-visual-lab="on"] #visual-lab{left:10px;right:10px;top:max(68px,calc(env(safe-area-inset-top) + 58px));bottom:10px}}

.vl-layer-row>button span,.vl-layer-row>button small{display:block}.vl-layer-row>button small{margin-top:3px;color:rgba(255,255,255,.28);font-size:6px;letter-spacing:.08em}.vl-layer-row-actions{display:flex;align-items:center;gap:3px;flex-wrap:wrap;justify-content:flex-end}
.vl-layer-editor-toggle{width:100%;display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center;text-align:left;padding:11px 12px!important;margin-bottom:9px}.vl-layer-editor-toggle span{color:rgba(255,255,255,.38);font-size:7px;letter-spacing:.12em}.vl-layer-editor-toggle strong{color:#efb6ff;font-size:9px}.vl-layer-editor-toggle em{font-style:normal;color:var(--cyan);font-size:7px}.vl-layer-editor-toggle[aria-expanded="false"] em:after{content:" +"}.vl-layer-editor-toggle[aria-expanded="true"] em:after{content:" -"}
.vl-layer-media-row{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:8px;align-items:center;padding:10px;border:1px solid rgba(255,255,255,.07);border-radius:11px;background:rgba(0,0,0,.18);margin-bottom:10px}.vl-layer-media-row small,.vl-layer-media-row strong{display:block}.vl-layer-media-row small{font-size:6px;color:rgba(255,255,255,.3);letter-spacing:.12em}.vl-layer-media-row strong{margin-top:4px;font-size:8px;color:rgba(255,255,255,.75);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.vl-layer-media-row button{padding:8px 9px!important}
.vl-layer-section{margin:9px 0;border:1px solid rgba(255,255,255,.065);border-radius:11px;background:rgba(255,255,255,.014);overflow:hidden}.vl-layer-section>summary{cursor:pointer;padding:10px 12px;color:rgba(32,231,255,.72);font:800 8px/1 ui-monospace,monospace;letter-spacing:.12em;list-style:none}.vl-layer-section>summary::-webkit-details-marker{display:none}.vl-layer-section[open]>summary{border-bottom:1px solid rgba(255,255,255,.055)}.vl-layer-section>.vl-control,.vl-layer-section>.vl-behavior-grid{margin-left:12px;margin-right:12px}
.vl-behavior-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;padding:10px 0 13px}.vl-behavior-card{padding:10px;border:1px solid rgba(255,255,255,.065);border-radius:10px;background:rgba(0,0,0,.16)}.vl-behavior-card>label{display:flex;gap:7px;align-items:center;color:rgba(255,255,255,.66);font:800 7px/1.2 ui-monospace,monospace;letter-spacing:.07em}.vl-behavior-card input[type=checkbox]{accent-color:#db37ff}.vl-behavior-fields{display:grid;gap:8px;margin-top:10px}.vl-behavior-fields[hidden]{display:none!important}.vl-behavior-fields select{width:100%;min-height:32px}.vl-behavior-fields label{display:grid;grid-template-columns:70px 1fr;gap:8px;align-items:center;color:rgba(255,255,255,.38);font-size:6px}.vl-behavior-fields input[type=range]{width:100%;accent-color:#db37ff}.vl-behavior-card--music{border-color:rgba(219,55,255,.18);background:rgba(100,20,120,.06)}
.vl-scene-orchestration-card{padding:12px;border:1px solid rgba(32,231,255,.10);border-radius:12px;background:rgba(0,0,0,.16);margin-bottom:14px}
@media(max-width:620px){.vl-behavior-grid{grid-template-columns:1fr}.vl-layer-media-row{grid-template-columns:1fr 1fr}.vl-layer-media-row>div{grid-column:1/-1}.vl-tabs button{min-width:calc(50% - 6px)}}

/* =========================================================
   R8B FIX1 // SHELL LIFECYCLE + VISUAL LAB WORKBENCH
   ========================================================= */
/* Home/Browse, Operator and Visual Lab all use the same compact
   Catalog-rail player pattern. The normal player returns when the
   active workspace closes. */
body[data-operator="on"] #now-panel,
body[data-visual-lab="on"] #now-panel{
  display:none!important;
}
body[data-operator="on"] #library-panel,
body[data-visual-lab="on"] #library-panel{
  min-height:calc(100vh - var(--receiver-topbar-height) - 28px);
}

/* Visual Lab is intentionally a right-side workbench rather than a
   full workspace. This keeps the live visual stage visible while the
   Operator edits Scene/Visualizer settings. */
body[data-visual-lab="on"] #visual-lab{
  left:auto!important;
  right:18px!important;
  top:96px!important;
  bottom:auto!important;
  width:auto!important;
  align-items:flex-end!important;
}
body[data-visual-lab="on"] #visual-lab-panel{
  width:430px!important;
  height:auto!important;
  max-height:calc(100vh - 145px)!important;
  border-radius:15px!important;
}

/* The compact player remains anchored inside the Catalog rail for all
   editing/browsing workspaces. */
body[data-operator="on"] .browse-rail-player,
body[data-visual-lab="on"] .browse-rail-player,
body[data-browse="on"] .browse-rail-player{
  display:block;
}

@media(max-width:860px){
  body[data-visual-lab="on"] #visual-lab{
    left:10px!important;
    right:10px!important;
    top:max(68px,calc(env(safe-area-inset-top) + 58px))!important;
    bottom:10px!important;
    width:auto!important;
    align-items:stretch!important;
  }
  body[data-visual-lab="on"] #visual-lab-panel{
    width:100%!important;
    max-height:calc(100vh - 90px)!important;
  }
}


/* R9 // Shared compact Catalog player geometry.
   The scrolling Catalog always reserves the docked player's footprint so
   the final track/card can never disappear underneath it. */
body[data-browse="on"] #library-panel,
body[data-operator="on"] #library-panel,
body[data-visual-lab="on"] #library-panel{
  padding-bottom:178px!important;
  scroll-padding-bottom:178px;
}
body[data-browse="on"] #catalog-content,
body[data-operator="on"] #catalog-content,
body[data-visual-lab="on"] #catalog-content{
  position:relative;
  z-index:1;
}
body[data-browse="on"] .browse-rail-player,
body[data-operator="on"] .browse-rail-player,
body[data-visual-lab="on"] .browse-rail-player{
  z-index:20;
}


/* PI-CORE-1 // unobtrusive Receiver ↔ Pi connection status */
.pi-core-status{
  position:fixed;
  right:18px;
  bottom:24px;
  z-index:120;
  border:1px solid rgba(255,255,255,.18);
  border-radius:999px;
  padding:7px 11px;
  background:rgba(7,8,14,.72);
  color:rgba(255,255,255,.78);
  font:600 10px/1.1 ui-monospace,SFMono-Regular,Consolas,monospace;
  letter-spacing:.08em;
  cursor:pointer;
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  transition:opacity .2s ease,border-color .2s ease,color .2s ease;
}
.pi-core-status:hover{
  color:#fff;
  border-color:rgba(255,255,255,.35);
}
.pi-core-status[data-connected="true"]{
  border-color:rgba(122,255,202,.42);
  color:rgba(213,255,239,.9);
}
body[data-ui-hidden="true"] .pi-core-status{
  opacity:0;
  pointer-events:none;
}


/* RECEIVER-LIBRARY-1 // PiXELBURGH Library picker */
.pi-library-picker{
  position:fixed;
  inset:0;
  z-index:10000;
  display:grid;
  place-items:center;
  padding:28px;
  background:rgba(0,0,0,.72);
}
.pi-library-picker-card{
  width:min(980px,92vw);
  max-height:84vh;
  display:flex;
  flex-direction:column;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.18);
  border-radius:18px;
  background:rgba(10,10,18,.96);
  box-shadow:0 24px 90px rgba(0,0,0,.65);
}
.pi-library-picker-card>header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  padding:18px 20px;
  border-bottom:1px solid rgba(255,255,255,.09);
}
.pi-library-picker-card>header div{
  display:flex;
  align-items:baseline;
  gap:12px;
  min-width:0;
}
.pi-library-picker-card>header em{
  opacity:.55;
  font-size:10px;
  letter-spacing:.09em;
}
.pi-library-picker-search{
  padding:14px 18px 0;
}
.pi-library-picker-search input{
  width:100%;
  box-sizing:border-box;
  padding:11px 13px;
  border:1px solid rgba(255,255,255,.14);
  border-radius:10px;
  background:rgba(255,255,255,.05);
  color:#fff;
}
.pi-library-picker-grid{
  overflow:auto;
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(150px,1fr));
  gap:12px;
  padding:16px 18px 20px;
}
.pi-library-asset{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:7px;
  padding:8px;
  border:1px solid rgba(255,255,255,.11);
  border-radius:12px;
  background:rgba(255,255,255,.035);
  color:inherit;
  text-align:left;
  cursor:pointer;
}
.pi-library-asset:hover{
  border-color:rgba(255,255,255,.34);
  background:rgba(255,255,255,.075);
}
.pi-library-asset img{
  width:100%;
  aspect-ratio:1;
  display:block;
  object-fit:cover;
  border-radius:8px;
  background:#050508;
}
.pi-library-asset span,
.pi-library-asset small{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.pi-library-asset span{font-size:11px}
.pi-library-asset small{opacity:.45;font-size:8px}
.pi-library-empty{
  grid-column:1/-1;
  padding:50px 20px;
  text-align:center;
  opacity:.55;
}


/* RECEIVER-LYRICS-PI */
#operator-lyrics-generate-pi[disabled]{
  opacity:.58;
  cursor:wait;
}


/* METADATA + ALBUM V2 */
.operator-album-track-row[data-drop-after="false"]{
  box-shadow: inset 0 2px 0 rgba(255,255,255,.42);
}
.operator-album-track-row[data-drop-after="true"]{
  box-shadow: inset 0 -2px 0 rgba(255,255,255,.42);
}
.operator-album-track-row.dragging{
  opacity:.45;
}
#operator-hashtags,
#operator-artist-hashtags,
#operator-album-hashtags,
#operator-entity-refs,
#operator-artist-entity-refs,
#operator-album-entity-refs{
  font-family:ui-monospace,SFMono-Regular,Consolas,monospace;
}


/* =========================================================
   V3A // SHELL + PLAYBACK REPAIR
   ========================================================= */
.browse-entity-toolbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin:0 0 10px;
}
.browse-entity-toolbar button{
  min-height:34px;
  padding:0 12px;
  border:1px solid rgba(32,231,255,.18);
  border-radius:10px;
  background:rgba(5,4,11,.68);
  color:rgba(255,255,255,.78);
  font:800 8px/1 ui-monospace,Consolas,monospace;
  letter-spacing:.11em;
  cursor:pointer;
}
.browse-entity-toolbar button:hover{
  color:var(--cyan);
  border-color:rgba(32,231,255,.4);
}
.browse-entity-actions{
  flex-wrap:wrap;
}

/* Keep the mobile nav above Browse and restore its click target after every
   workspace transition. */
@media(max-width:760px){
  #topbar{
    z-index:500!important;
    pointer-events:auto!important;
  }
  #mobile-menu-toggle{
    position:relative;
    z-index:520!important;
    pointer-events:auto!important;
  }
  #mobile-menu{
    z-index:519!important;
    pointer-events:auto!important;
  }

  /* Visual Lab becomes a lower-screen workbench on phones. The upper portion
     remains the live performance stage so adjustments can be seen immediately. */
  body[data-visual-lab="on"] #library-panel{
    display:none!important;
  }
  body[data-visual-lab="on"] #visual-lab{
    left:8px!important;
    right:8px!important;
    top:auto!important;
    bottom:max(8px,env(safe-area-inset-bottom))!important;
    width:auto!important;
    height:min(58vh,560px)!important;
    align-items:stretch!important;
    z-index:430!important;
  }
  body[data-visual-lab="on"] #visual-lab-panel{
    width:100%!important;
    height:100%!important;
    max-height:none!important;
    border-radius:18px 18px 12px 12px!important;
    overflow:auto!important;
  }
  body[data-visual-lab="on"] #visual-stage{
    opacity:1!important;
  }
}

@media(max-width:560px){
  .browse-entity-toolbar{
    position:sticky;
    top:0;
    z-index:5;
    padding:6px 0;
    background:linear-gradient(180deg,rgba(5,4,11,.96),rgba(5,4,11,.72));
  }
}


/* =========================================================
   V3B // COLLECTION + ARTIST RELATIONSHIPS + MOBILE SHELL
   ========================================================= */
.player-performance-button{
  border-color:rgba(255,52,214,.28)!important;
}
.collection-action-sheet{
  /* 0.6.35.13: collection / playlist sheet must sit above the fixed mobile player.
     The player uses z-index:9999 on mobile; at 900 it could visually expose the
     + NEW PLAYLIST control while the player intercepted the tap. */
  position:fixed; inset:0; z-index:12000;
  display:grid; place-items:center;
  padding:18px;
  background:rgba(2,2,8,.68);
}
.collection-action-card{
  position:relative;
  z-index:1;
  pointer-events:auto;
  width:min(420px,100%);
  display:grid; gap:10px;
  padding:16px;
  border:1px solid rgba(32,231,255,.25);
  border-radius:16px;
  background:rgba(7,6,15,.98);
  box-shadow:0 22px 80px rgba(0,0,0,.55);
}
.collection-action-head{
  display:flex; align-items:flex-start; justify-content:space-between; gap:12px;
}
.collection-action-head div{display:grid;gap:4px}
.collection-action-head small,.collection-playlist-title{
  font:800 8px/1 ui-monospace,Consolas,monospace;
  letter-spacing:.14em;color:var(--cyan);
}
.collection-action-head strong{font-size:16px}
.collection-action-card button{
  min-height:40px;border:1px solid rgba(255,255,255,.13);border-radius:10px;
  background:rgba(255,255,255,.045);color:#fff;cursor:pointer;
}
.collection-action-head>button{min-height:30px;width:34px}
.collection-playlist-list{display:grid;gap:6px;max-height:220px;overflow:auto}
.collection-playlist-list span{padding:10px;color:rgba(255,255,255,.45);font-size:10px}
.collection-playlist-list button{text-align:left;padding:0 12px}
.collection-playlist-list button:disabled{opacity:.64;color:var(--cyan);border-color:rgba(32,231,255,.22);cursor:default}
.collection-action-card [data-collection-new-playlist],.collection-action-card [data-local-new-playlist],.collection-action-card [data-track-new-playlist]{border-style:dashed;color:rgba(255,255,255,.76)}
.collection-action-note{display:block;color:#777b8e;font:600 9px/1.45 ui-monospace,Consolas,monospace}

@media(max-width:760px){
  /* Mobile header is now a real three-zone layout instead of overlapping
     absolutely-positioned HOME and hamburger targets. */
  #topbar{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    align-items:center!important;
    min-height:52px!important;
    padding-right:8px!important;
  }
  #topbar .brand{min-width:0!important}
  #mobile-menu-toggle{
    position:relative!important;
    inset:auto!important;
    grid-column:2!important;
    grid-row:1!important;
    margin:0!important;
  }
  #topbar .top-actions{
    display:none!important;
  }

  /* Pi becomes a tiny status lamp instead of covering transport controls. */
  #pi-core-status{
    position:fixed!important;
    top:58px!important;
    right:10px!important;
    left:auto!important;
    bottom:auto!important;
    width:auto!important;
    max-width:none!important;
    min-width:48px!important;
    min-height:28px!important;
    padding:0 9px!important;
    border-radius:999px!important;
    font-size:8px!important;
    letter-spacing:.08em!important;
    z-index:420!important;
  }

  .collection-action-sheet{align-items:end;padding:8px}
  .collection-action-card{
    width:100%;
    border-radius:18px 18px 12px 12px;
    padding-bottom:max(16px,env(safe-area-inset-bottom));
  }
}


/* =========================================================
   V3C // MOBILE SHELL + HOME + PRESENTATION
   ========================================================= */
.workspace-transition-out{
  opacity:0;
  transform:translateY(6px);
  transition:opacity .14s ease, transform .14s ease;
}
.workspace-transition-in{
  animation:v3c-page-in .22s ease both;
}
@keyframes v3c-page-in{
  from{opacity:0;transform:translateY(6px)}
  to{opacity:1;transform:none}
}
.home-hero-section{margin-top:0}
.browse-card-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(150px,1fr));
  gap:12px;
}
.browse-card{
  min-width:0;
}

@media(max-width:760px){
  /* Hamburger LEFT, same row as Search */
  #topbar{
    display:grid!important;
    grid-template-columns:auto minmax(0,1fr)!important;
    grid-template-areas:"menu search"!important;
    gap:8px!important;
    align-items:center!important;
    padding:8px 10px!important;
  }
  #mobile-menu-toggle{
    grid-area:menu!important;
    position:relative!important;
    inset:auto!important;
    margin:0!important;
    align-self:center!important;
  }
  #topbar .search-shell{
    grid-area:search!important;
    width:100%!important;
    min-width:0!important;
    margin:0!important;
  }
  #mobile-menu{
    position:absolute!important;
    top:calc(100% + 6px)!important;
    left:8px!important;
    right:auto!important;
    width:min(240px,calc(100vw - 16px))!important;
    z-index:540!important;
  }
  #pi-core-status{display:none!important}

  /* reserve space so Browse/Album/Track content never terminates under player */
  body:not([data-performance="on"]) #browse-panel,
  body:not([data-performance="on"]) #operator-panel{
    padding-bottom:calc(168px + env(safe-area-inset-bottom))!important;
  }

  .browse-entity-actions{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:8px!important;
  }
  .browse-entity-actions button{
    width:100%!important;
    min-width:0!important;
  }

  .browse-card-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:9px!important;
  }

  /* Presentation editor becomes a bottom sheet with visible preview above */
  body[data-presentation="on"] #presentation-panel,
  .presentation-shell,
  .presentation-panel{
    max-width:100vw!important;
  }
  body[data-presentation="on"] .presentation-controls,
  body[data-presentation="on"] #presentation-controls{
    position:fixed!important;
    left:8px!important;
    right:8px!important;
    bottom:max(8px,env(safe-area-inset-bottom))!important;
    top:auto!important;
    max-height:48vh!important;
    overflow:auto!important;
    z-index:700!important;
    border-radius:18px 18px 12px 12px!important;
  }
}


/* =========================================================
   V3C.2 // SURGICAL POST-AUDIT REPAIR
   Full audit confirmed:
   - V3C scrolling architecture is retained.
   - Catalog height rules are retained.
   - No body/viewport locking is introduced.
   ========================================================= */

/* Full Player PERFORMANCE control: restore normal Receiver button appearance. */
.player-performance-button{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-width:0!important;
  min-height:42px!important;
  padding:0 14px!important;
  border:1px solid rgba(255,52,214,.34)!important;
  border-radius:11px!important;
  background:rgba(255,52,214,.055)!important;
  color:#f1c8ff!important;
  opacity:1!important;
  visibility:visible!important;
  cursor:pointer!important;
  box-shadow:none!important;
}
.player-performance-button:hover{
  border-color:rgba(32,231,255,.48)!important;
  background:rgba(32,231,255,.075)!important;
  color:#fff!important;
}

/* Home cards always reserve their established artwork box. */
.browse-card>.browse-card-art{
  width:100%;
  box-sizing:border-box;
}
.browse-card>.browse-card-art>span{
  display:grid;
  width:100%;
  height:100%;
  place-items:center;
}

/* Mobile Browse: use the exact global mini-player, in normal document flow.
   It scrolls with Home/Browse; it is NOT sticky/fixed and does not alter
   the Browse or Catalog viewport. */
@media(max-width:760px){
  
  
  

  /* The old Catalog-rail compact player is not duplicated on mobile Browse. */
  body[data-browse="on"] #browse-rail-player{
    display:none!important;
  }

  /* Do not reserve the old rail player's 178px footprint during mobile Browse. */
  body[data-browse="on"] #library-panel{
    padding-bottom:12px!important;
    scroll-padding-bottom:0!important;
  }
}


/* =========================================================
   V3C.3 // HOME CARDS + NATIVE MINI PLAYER + NAV ICON
   Surgical: no scroll/viewport architecture changes.
   ========================================================= */

.mobile-menu-toggle{
  overflow:hidden;
}
.mobile-menu-brand-icon{
  display:block;
  width:26px;
  height:26px;
  object-fit:contain;
  pointer-events:none;
  filter:drop-shadow(0 0 6px rgba(32,231,255,.24));
}

.browse-single-card{
  text-align:left;
}




/* =========================================================
   V3C.4 // MOBILE BROWSE PLAYER CORRECTION
   Uses Receiver's existing #browse-rail-player.
   ========================================================= */

@media(max-width:760px){
  /* Kill the failed V3C.2/V3C.3 attempt to repurpose the large global mini player. */
  body[data-browse="on"] #mini-player,
  

  /* Minimal mobile Browse player: art + title + basic transport only. */
  body[data-browse="on"] #browse-rail-player{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    align-items:center!important;
    gap:8px!important;

    position:fixed!important;
    left:8px!important;
    right:8px!important;
    bottom:max(8px,env(safe-area-inset-bottom))!important;
    z-index:650!important;

    padding:8px 9px!important;
    margin:0!important;
    min-height:62px!important;
    max-height:72px!important;

    border:1px solid rgba(255,255,255,.13)!important;
    border-radius:15px!important;
    background:rgba(7,5,13,.94)!important;
    backdrop-filter:blur(15px)!important;
    box-shadow:0 12px 34px rgba(0,0,0,.46)!important;
  }

  body[data-browse="on"] #browse-rail-player .browse-rail-player-main{
    display:grid!important;
    grid-template-columns:44px minmax(0,1fr)!important;
    gap:9px!important;
    align-items:center!important;
    min-width:0!important;
  }

  body[data-browse="on"] #browse-rail-player .browse-rail-art{
    width:44px!important;
    height:44px!important;
    border-radius:9px!important;
  }

  body[data-browse="on"] #browse-rail-player .browse-rail-copy strong{
    font-size:10px!important;
  }
  body[data-browse="on"] #browse-rail-player .browse-rail-copy span{
    font-size:8px!important;
  }

  body[data-browse="on"] #browse-rail-player .browse-rail-controls{
    display:flex!important;
    margin:0!important;
    gap:5px!important;
    align-items:center!important;
  }

  body[data-browse="on"] #browse-rail-player .browse-rail-controls button{
    width:31px!important;
    height:31px!important;
    min-width:31px!important;
    padding:0!important;
    border-radius:50%!important;
  }

  body[data-browse="on"] #browse-rail-player .browse-rail-controls button:nth-child(2){
    width:38px!important;
    height:38px!important;
    min-width:38px!important;
  }

  /* No progress/settings row in minimal Browse player. */
  body[data-browse="on"] #browse-rail-player .browse-rail-progress{
    display:none!important;
  }

  /* Browse/Home scrolls normally but its final content cannot disappear behind player. */
  body[data-browse="on"] #browse-content{
    padding-bottom:92px!important;
    scroll-padding-bottom:92px!important;
  }

  /* Undo previous mobile Browse rail suppression. */
  body[data-browse="on"] #library-panel{
    padding-bottom:12px!important;
  }
}


/* =========================================================
   V3C.5 // TRUE MOBILE BROWSE PLAYER DOCK
   The compact Browse player is moved to BODY on mobile Browse.
   ========================================================= */

@media(max-width:760px){
  body > #browse-rail-player.mobile-browse-player{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    align-items:center!important;
    gap:8px!important;

    position:fixed!important;
    left:8px!important;
    right:8px!important;
    bottom:max(8px,env(safe-area-inset-bottom))!important;
    top:auto!important;

    width:auto!important;
    height:auto!important;
    min-height:60px!important;
    max-height:68px!important;
    margin:0!important;
    padding:8px 9px!important;

    z-index:9999!important;
    pointer-events:auto!important;

    border:1px solid rgba(255,255,255,.14)!important;
    border-radius:15px!important;
    background:rgba(7,5,13,.97)!important;
    backdrop-filter:blur(16px)!important;
    box-shadow:0 14px 40px rgba(0,0,0,.62)!important;
  }

  body > #browse-rail-player.mobile-browse-player .browse-rail-player-main{
    display:grid!important;
    grid-template-columns:44px minmax(0,1fr)!important;
    gap:9px!important;
    align-items:center!important;
    min-width:0!important;
  }

  body > #browse-rail-player.mobile-browse-player .browse-rail-art{
    width:44px!important;
    height:44px!important;
    border-radius:9px!important;
  }

  body > #browse-rail-player.mobile-browse-player .browse-rail-copy{
    min-width:0!important;
  }

  body > #browse-rail-player.mobile-browse-player .browse-rail-copy strong,
  body > #browse-rail-player.mobile-browse-player .browse-rail-copy span{
    display:block!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }

  body > #browse-rail-player.mobile-browse-player .browse-rail-controls{
    display:flex!important;
    align-items:center!important;
    gap:5px!important;
    margin:0!important;
  }

  body > #browse-rail-player.mobile-browse-player .browse-rail-controls button{
    width:31px!important;
    height:31px!important;
    min-width:31px!important;
    padding:0!important;
    border-radius:50%!important;
  }

  body > #browse-rail-player.mobile-browse-player .browse-rail-controls button:nth-child(2){
    width:38px!important;
    height:38px!important;
    min-width:38px!important;
  }

  body > #browse-rail-player.mobile-browse-player .browse-rail-progress{
    display:none!important;
  }

  /* Home/Browse remains naturally scrollable; only protect final rows
     from being covered by the docked compact player. */
  body[data-browse="on"] #browse-content{
    padding-bottom:90px!important;
    scroll-padding-bottom:90px!important;
  }
}


/* =========================================================
   V3C.6 // PLAYER OWNERSHIP CLEANUP
   PLAYER/PERFORMANCE -> #mini-player
   MOBILE HOME/BROWSE -> #browse-rail-player
   ========================================================= */
@media(max-width:760px){
  body[data-browse="on"] #mini-player{
    display:none!important;
  }
}


/* =========================================================
   V3C.7 // MOBILE BROWSE LAYER OWNERSHIP
   The compact Browse player is already correct.
   This patch only prevents Catalog/Library UI from bleeding
   through the transparent Home/Browse workspace on mobile.
   ========================================================= */
@media(max-width:760px){
  body[data-browse="on"] #library-panel{
    visibility:hidden!important;
    pointer-events:none!important;
  }

  /* The compact Browse player is reparented to BODY by app.js,
     so it remains visible even while #library-panel is hidden. */
  body > #browse-rail-player.mobile-browse-player{
    visibility:visible!important;
    pointer-events:auto!important;
  }
}

/* =========================================================
   V3D1_PREBOOT_COVER
   Passive first-paint hidden-world cover.
   No Receiver state or startup ownership.
   ========================================================= */

.signal-preboot-cover{
  position:fixed;
  inset:0;
  z-index:29990;
  overflow:hidden;

  display:grid;
  place-items:center;

  background:#000;
  color:#fff;

  opacity:1;
  visibility:visible;

  isolation:isolate;
  pointer-events:auto;

  transition:
    opacity .08s ease,
    visibility .08s ease;
}

.signal-preboot-cover.signal-preboot-release{
  opacity:0;
  visibility:hidden;
  pointer-events:none;
}

.signal-preboot-grid{
  position:absolute;
  inset:-15%;

  opacity:.16;

  background-image:
    linear-gradient(
      rgba(62,226,255,.10) 1px,
      transparent 1px
    ),
    linear-gradient(
      90deg,
      rgba(255,43,220,.07) 1px,
      transparent 1px
    );

  background-size:48px 48px;

  transform:
    perspective(800px)
    rotateX(62deg)
    translateY(18%)
    scale(1.45);

  transform-origin:center bottom;

  animation:signal-preboot-grid 10s linear infinite;
}

.signal-preboot-scan{
  position:absolute;
  inset:0;

  opacity:.55;

  background:
    linear-gradient(
      180deg,
      transparent 0 47%,
      rgba(68,232,255,.08) 49%,
      rgba(255,47,220,.08) 50%,
      transparent 52%
    );

  animation:signal-preboot-scan 3.2s linear infinite;
}

.signal-preboot-center{
  position:relative;
  z-index:4;

  display:grid;
  place-items:center;

  width:min(720px,88vw);

  transform:translateY(-2vh);
}

.signal-preboot-mark{
  position:relative;

  width:min(390px,58vw);
  aspect-ratio:1;

  opacity:.16;

  filter:
    drop-shadow(0 0 20px rgba(49,229,255,.18))
    drop-shadow(0 0 30px rgba(255,39,218,.10));

  animation:signal-preboot-breathe 3.5s ease-in-out infinite;
}

.signal-preboot-mics,
.signal-preboot-skull{
  position:absolute;

  left:50%;
  top:50%;

  object-fit:contain;

  transform:translate(-50%,-50%);

  pointer-events:none;
}

.signal-preboot-mics{
  z-index:1;

  width:125%;
  height:125%;

  opacity:.75;
}

.signal-preboot-skull{
  z-index:2;

  width:86%;
  height:86%;

  opacity:.92;
}

.signal-preboot-copy{
  position:relative;
  z-index:5;

  display:grid;
  gap:8px;

  margin-top:-26px;

  text-align:center;
}

.signal-preboot-copy strong{
  font-size:clamp(22px,5vw,46px);
  font-weight:900;

  letter-spacing:.12em;

  color:rgba(255,255,255,.50);

  text-shadow:
    1px 0 rgba(255,40,220,.42),
    -1px 0 rgba(47,229,255,.42);
}

.signal-preboot-copy span{
  color:rgba(80,229,255,.38);

  font:
    800 8px/1
    ui-monospace,
    Consolas,
    monospace;

  letter-spacing:.22em;
}

.signal-preboot-status{
  position:absolute;

  left:20px;
  bottom:18px;

  display:flex;
  gap:14px;

  color:rgba(255,255,255,.22);

  font:
    700 7px/1
    ui-monospace,
    Consolas,
    monospace;

  letter-spacing:.14em;
}

.signal-preboot-status b{
  color:rgba(59,227,255,.38);
}

@keyframes signal-preboot-grid{
  to{
    background-position:
      0 96px,
      96px 0;
  }
}

@keyframes signal-preboot-scan{
  from{
    transform:translateY(-56%);
  }

  to{
    transform:translateY(56%);
  }
}

@keyframes signal-preboot-breathe{
  0%,100%{
    opacity:.12;
    transform:scale(.985);
  }

  50%{
    opacity:.20;
    transform:scale(1.015);
  }
}

@media(max-width:760px){

  .signal-preboot-mark{
    width:min(330px,72vw);
  }

  .signal-preboot-copy{
    margin-top:-18px;
  }

  .signal-preboot-status{
    left:14px;
    bottom:14px;
  }
}

/* =========================================================
   V3F_DISCOVERY_GRAPH_V1
   Relationship surfaces for premium entity-to-entity discovery.
   ========================================================= */
.browse-discovery-links{margin-top:18px}
.browse-discovery-link-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:10px}
.browse-discovery-link{min-width:0;text-align:left;padding:15px 16px;border:1px solid rgba(70,222,255,.18);border-radius:14px;background:linear-gradient(145deg,rgba(11,17,27,.88),rgba(24,10,28,.78));color:inherit;cursor:pointer;transition:transform .16s ease,border-color .16s ease,background .16s ease}
.browse-discovery-link:hover,.browse-discovery-link:focus-visible{transform:translateY(-2px);border-color:rgba(70,222,255,.5);background:linear-gradient(145deg,rgba(13,26,38,.94),rgba(38,12,42,.9));outline:none}
.browse-discovery-link small{display:block;margin-bottom:7px;color:#36dff5;font-size:9px;letter-spacing:.16em;text-transform:uppercase}
.browse-discovery-link strong{display:block;overflow:hidden;text-overflow:ellipsis;color:#fff;font-size:14px;white-space:nowrap}
.browse-discovery-link span{display:block;margin-top:10px;color:rgba(255,255,255,.48);font-size:9px;letter-spacing:.12em}
@media(max-width:760px){.browse-discovery-link-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.browse-discovery-link{padding:12px}.browse-discovery-link strong{font-size:12px}}

/* V3G // UNIFIED ENTITY SHELL + HERO VISUAL SYSTEM */
.operator-featured-editor{display:grid;gap:8px}.operator-featured-label{font:800 7px/1 Consolas,monospace;letter-spacing:.12em;color:rgba(255,255,255,.42)}
.operator-featured-add-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:7px}.operator-featured-add-row select,.operator-featured-add-row button{min-height:38px;border:1px solid rgba(255,255,255,.1);border-radius:8px;background:#0b0810;color:#fff;padding:0 10px}.operator-featured-add-row button{border-color:rgba(50,224,255,.24);background:rgba(50,224,255,.055);cursor:pointer}
.operator-featured-chips{display:flex;flex-wrap:wrap;gap:6px;min-height:28px;align-items:center}.operator-featured-chip{display:inline-flex;align-items:center;gap:8px;padding:7px 9px;border:1px solid rgba(50,224,255,.22);border-radius:999px;background:linear-gradient(135deg,rgba(50,224,255,.07),rgba(255,49,221,.055));color:#fff;cursor:pointer}.operator-featured-chip b{color:rgba(255,255,255,.55);font-size:13px}.operator-featured-empty{color:rgba(255,255,255,.28);font:750 7px/1 Consolas,monospace;letter-spacing:.1em}
.browse-entity-hero{position:relative;min-height:clamp(180px,26vw,360px);margin:4px 0 18px;overflow:hidden;border:1px solid rgba(255,255,255,.075);border-radius:20px;background:radial-gradient(circle at 18% 25%,rgba(40,226,255,.16),transparent 30%),radial-gradient(circle at 82% 38%,rgba(255,42,220,.17),transparent 34%),linear-gradient(125deg,rgba(5,8,18,.92),rgba(20,6,25,.82))}
.browse-entity-hero.has-hero{background-image:linear-gradient(180deg,rgba(3,2,8,.08),rgba(3,2,8,.15) 50%,rgba(3,2,8,.88)),var(--entity-hero);background-size:cover;background-position:center}.browse-entity-hero.is-placeholder:before{content:"";position:absolute;inset:-20%;background:repeating-radial-gradient(circle at center,rgba(50,224,255,.045) 0 1px,transparent 1px 34px);animation:v3gHeroDrift 18s linear infinite}.browse-entity-hero-signal{position:absolute;inset:0;display:flex;align-items:flex-end;justify-content:space-between;padding:18px 20px;background:linear-gradient(180deg,transparent 45%,rgba(3,2,8,.72))}.browse-entity-hero-signal span{color:rgba(73,229,255,.65);font:800 8px/1 Consolas,monospace;letter-spacing:.16em}.browse-entity-hero-signal b{font-size:36px;color:rgba(73,229,255,.42)}@keyframes v3gHeroDrift{to{transform:translate3d(4%,2%,0) rotate(3deg)}}
.browse-album-info{margin:0 0 18px;padding:18px;border:1px solid rgba(50,224,255,.14);border-radius:16px;background:linear-gradient(145deg,rgba(8,12,20,.84),rgba(19,7,22,.72));backdrop-filter:blur(12px)}.browse-album-info[hidden]{display:none!important}.browse-album-info small{color:var(--cyan);font:800 8px/1 Consolas,monospace;letter-spacing:.14em}.browse-album-info h3{margin:6px 0 14px;font-size:20px}.browse-album-info-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.browse-album-info-grid>div{padding:11px;border:1px solid rgba(255,255,255,.06);border-radius:10px;background:rgba(255,255,255,.02)}.browse-album-info-grid span,.browse-album-info-grid strong{display:block}.browse-album-info-grid span{margin-bottom:5px;color:rgba(255,255,255,.36);font:750 7px/1 Consolas,monospace;letter-spacing:.1em}.browse-album-info-grid strong{font-size:11px}
.operator-public-profile{inset:var(--receiver-topbar-height,82px) 0 0!important;z-index:90!important;background:linear-gradient(180deg,rgba(4,3,9,.38),rgba(4,3,9,.76) 34%,rgba(4,3,9,.91))!important;backdrop-filter:none!important}.operator-profile-banner{background-color:transparent!important}.operator-profile-banner:after{background:linear-gradient(180deg,rgba(5,4,8,.02) 20%,rgba(5,4,8,.82))!important}.operator-profile-identity,.operator-discovery-section{background:rgba(5,4,8,.14)}
@media(max-width:760px){.operator-featured-add-row{grid-template-columns:1fr}.browse-entity-hero{min-height:190px;border-radius:14px}.browse-album-info-grid{grid-template-columns:1fr 1fr}.operator-public-profile{inset:var(--receiver-topbar-height,74px) 0 0!important}}


/* =========================================================
   V3G.1 // ENTITY OWNERSHIP + CINEMATIC HERO NORMALIZATION
   Audited surgical polish. No player/catalog/boot changes.
   ========================================================= */
.browse-entity-hero.has-hero{
  background-image:
    linear-gradient(90deg,rgba(3,2,8,.68) 0%,rgba(3,2,8,.28) 38%,rgba(3,2,8,.12) 70%,rgba(3,2,8,.24) 100%),
    linear-gradient(180deg,rgba(3,2,8,.08) 0%,rgba(3,2,8,.10) 48%,rgba(3,2,8,.88) 100%),
    var(--entity-hero);
  background-size:cover;
  background-position:center;
}
.browse-entity-hero.has-hero .browse-entity-hero-signal{
  background:
    linear-gradient(90deg,rgba(3,2,8,.18),transparent 48%),
    linear-gradient(180deg,transparent 42%,rgba(3,2,8,.74));
}
.operator-profile-banner{
  background-size:cover;
  background-position:center;
}
.operator-profile-banner:after{
  background:
    linear-gradient(90deg,rgba(5,4,8,.26),transparent 58%),
    linear-gradient(180deg,rgba(5,4,8,.02) 16%,rgba(5,4,8,.18) 54%,rgba(5,4,8,.88) 100%)!important;
}


/* =========================================================
   V3G.2 // OPERATOR AS CANONICAL RECEIVER ENTITY
   Image C is the visual contract: same Browse shell as Album/Artist.
   ========================================================= */
.browse-operator-section{
  margin:18px 0 0;
  padding:18px 0 0;
  border-top:1px solid rgba(255,255,255,.075);
}
.browse-operator-section>header{
  display:grid;
  grid-template-columns:1fr auto;
  gap:16px;
  align-items:end;
  margin-bottom:12px;
}
.browse-operator-section>header small{
  display:block;
  margin-bottom:5px;
  color:rgba(255,49,221,.58);
  font:800 7px/1 Consolas,monospace;
  letter-spacing:.14em;
}
.browse-operator-section>header h2{
  margin:0;
  font-size:22px;
}
.browse-operator-section>header>span{
  color:rgba(255,255,255,.38);
  font-size:11px;
}
.browse-operator-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(150px,1fr));
  gap:10px;
}
.browse-operator-card{
  min-width:0;
  overflow:hidden;
  padding:0 0 12px;
  text-align:left;
  border:1px solid rgba(255,255,255,.08);
  border-radius:12px;
  background:rgba(8,6,12,.68);
  color:#fff;
  cursor:pointer;
  backdrop-filter:blur(8px);
}
.browse-operator-card>span{
  display:grid;
  place-items:center;
  aspect-ratio:1;
  overflow:hidden;
  background:linear-gradient(145deg,rgba(39,224,255,.05),rgba(255,43,220,.06)),#141018;
  font-size:34px;
}
.browse-operator-card img{
  width:100%;
  height:100%;
  object-fit:cover;
}
.browse-operator-card b,.browse-operator-card small{
  display:block;
  padding:0 10px;
}
.browse-operator-card b{
  margin-top:10px;
}
.browse-operator-card small{
  margin-top:4px;
  color:rgba(255,255,255,.40);
  font-size:8px;
}
.browse-operator-track-list{
  display:grid;
  gap:5px;
}
.browse-operator-track{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:14px;
  padding:11px 13px;
  text-align:left;
  border:1px solid rgba(255,255,255,.065);
  border-radius:9px;
  background:rgba(8,6,12,.62);
  color:#fff;
  cursor:pointer;
}
.browse-operator-track span{
  color:rgba(255,255,255,.40);
  font-size:9px;
}
.browse-operator-empty{
  color:rgba(255,255,255,.40);
  font-size:11px;
}
.browse-entity-link-button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:38px;
  padding:0 12px;
  border:1px solid rgba(55,225,255,.22);
  border-radius:9px;
  background:rgba(55,225,255,.045);
  color:#fff;
  text-decoration:none;
  font-size:9px;
}
@media(max-width:760px){
  .browse-operator-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .browse-operator-track{grid-template-columns:1fr}
}


/* =========================================================
   V3H // AAA ENTITY PRESENTATION FINALIZATION
   Complete-audit consolidated client pass.
   ========================================================= */

/* Entity destinations are the discovery surface. Catalog returns on Home/Browse. */
body[data-browse-entity="on"] #library-panel{display:none!important}
body[data-browse-entity="on"] #browse-panel{
  left:var(--receiver-shell-pad);
  right:var(--receiver-shell-pad);
  max-width:1540px;
  margin-inline:auto;
}

/* A banner has a footprint only when a real banner asset exists. */
.browse-entity-banner{
  position:relative;
  min-height:clamp(180px,24vw,350px);
  overflow:hidden;
  border:1px solid rgba(255,255,255,.075);
  border-radius:20px;
  background-image:
    linear-gradient(90deg,rgba(3,2,8,.62),rgba(3,2,8,.12) 58%,rgba(3,2,8,.22)),
    linear-gradient(180deg,rgba(3,2,8,.04),rgba(3,2,8,.10) 48%,rgba(3,2,8,.86)),
    var(--entity-hero);
  background-size:cover;
  background-position:center;
}
.browse-entity-banner .browse-entity-hero-signal{
  position:absolute;inset:0;display:flex;align-items:flex-end;justify-content:space-between;
  padding:18px 20px;background:linear-gradient(180deg,transparent 45%,rgba(3,2,8,.58))
}
.browse-entity-banner .browse-entity-hero-signal span{
  color:rgba(73,229,255,.72);font:800 8px/1 Consolas,monospace;letter-spacing:.16em
}
.browse-entity-banner .browse-entity-hero-signal b{font-size:36px;color:rgba(73,229,255,.46)}

/* Real entity artwork remains first-class. Missing square art keeps geometry via π. */
.browse-entity-summary-art img,.browse-operator-card img,.browse-card img,.browse-track-thumb img{
  width:100%;height:100%;object-fit:cover
}

/* Operator/identity discovery cards use the newly available entity-page width. */
.browse-operator-grid{grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:14px}
.browse-operator-card{border-radius:15px}
.browse-operator-card b{font-size:13px}
.browse-operator-card small{font-size:9px}

/* Shared ORiGiN surface. */
.entity-origin-panel{
  display:grid;gap:18px;padding:20px;border:1px solid rgba(50,224,255,.14);border-radius:17px;
  background:linear-gradient(145deg,rgba(8,12,20,.86),rgba(19,7,22,.74));backdrop-filter:blur(14px)
}
.entity-origin-panel[hidden]{display:none!important}
.entity-origin-panel>header{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-bottom:14px;border-bottom:1px solid rgba(255,255,255,.07)}
.entity-origin-panel>header small,.entity-origin-panel section>small{display:block;color:var(--cyan);font:800 8px/1 Consolas,monospace;letter-spacing:.14em}
.entity-origin-panel h2,.entity-origin-panel h3{margin:5px 0 0}
.entity-origin-panel>header button{min-height:34px;padding:0 11px;border:1px solid rgba(255,255,255,.10);border-radius:8px;background:rgba(255,255,255,.025);color:#fff}
.entity-origin-panel section{display:grid;gap:12px}
.entity-origin-panel .origin-late{margin-top:10px;padding-top:18px;border-top:1px solid rgba(255,255,255,.07)}
.entity-origin-panel .origin-credits{margin-top:2px;padding-top:18px;border-top:1px solid rgba(255,49,221,.13)}
.origin-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.origin-field{padding:11px;border:1px solid rgba(255,255,255,.06);border-radius:10px;background:rgba(255,255,255,.02)}
.origin-field span,.origin-field strong{display:block}
.origin-field span{margin-bottom:5px;color:rgba(255,255,255,.36);font:750 7px/1 Consolas,monospace;letter-spacing:.1em}
.origin-field strong{font-size:11px;line-height:1.45;overflow-wrap:anywhere}
.origin-links{display:flex;flex-wrap:wrap;gap:8px}
.origin-entity-link{display:inline-grid;gap:3px;text-align:left;padding:9px 11px;border:1px solid rgba(50,224,255,.18);border-radius:10px;background:rgba(50,224,255,.045);color:#fff;cursor:pointer}
.origin-entity-link b{font-size:11px}.origin-entity-link span{color:rgba(255,255,255,.42);font:700 7px/1 Consolas,monospace;letter-spacing:.08em}
.track-info-late{margin-top:8px;padding-top:18px;border-top:1px solid rgba(255,255,255,.07)}
.track-info-credits{margin-top:4px;padding-top:18px;border-top:1px solid rgba(255,49,221,.13)}

@media(max-width:860px){
  body[data-browse-entity="on"] #browse-panel{left:10px;right:10px}
  .browse-entity-banner{min-height:190px;border-radius:14px}
  .browse-operator-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .origin-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:560px){
  .origin-grid{grid-template-columns:1fr}
}


/* =========================================================
   V3H.1 // IDENTITY VISIBILITY + MEDIA + SAVE RELIABILITY
   ========================================================= */
.origin-operator-card{
  width:100%;
  display:grid;
  grid-template-columns:52px minmax(0,1fr) auto;
  align-items:center;
  gap:12px;
  padding:11px;
  text-align:left;
  border:1px solid rgba(50,224,255,.20);
  border-radius:12px;
  background:linear-gradient(135deg,rgba(50,224,255,.055),rgba(255,49,221,.045));
  color:#fff;
  cursor:pointer;
}
.origin-operator-avatar{
  width:48px;height:48px;border-radius:50%;
  display:grid;place-items:center;overflow:hidden;
  background:#15101a;font-size:20px;
}
.origin-operator-avatar img{width:100%;height:100%;object-fit:cover}
.origin-operator-card>span:nth-child(2){display:grid;gap:3px}
.origin-operator-card small{
  color:rgba(63,226,255,.58);
  font:800 7px/1 Consolas,monospace;
  letter-spacing:.1em
}
.origin-operator-card b{font-size:13px}
.origin-operator-card em{font-style:normal;color:rgba(255,255,255,.42);font-size:9px}
.origin-operator-card>strong{
  color:rgba(255,255,255,.52);
  font:800 8px/1 Consolas,monospace;
  white-space:nowrap
}
.origin-operator-card:hover{border-color:rgba(50,224,255,.48)}
@media(max-width:620px){
  .origin-operator-card{grid-template-columns:48px 1fr}
  .origin-operator-card>strong{grid-column:2}
}


/* =========================================================
   V3H.2 // SURGICAL DESKTOP SHELL + MEDIA + ACTION REPAIR
   No navigation, player engine, mobile mini-player, or data-model drift.
   ========================================================= */

/* Desktop entity pages keep the Catalog rail and its compact player.
   Mobile retains V3C.7 ownership: Catalog hidden, body-docked mini-player visible. */
@media(min-width:761px){
  body[data-browse-entity="on"] #library-panel{
    display:flex!important;
    visibility:visible!important;
    pointer-events:auto!important;
  }

  body[data-browse-entity="on"] #browse-panel{
    left:calc(var(--receiver-shell-pad) + var(--receiver-rail-width) + var(--receiver-shell-gap))!important;
    right:var(--receiver-shell-pad)!important;
    max-width:none!important;
    margin-inline:0!important;
  }

  body[data-browse-entity="on"] #browse-rail-player{
    display:block!important;
  }
}

/* On mobile, explicitly preserve the already-correct compact Browse player contract. */
@media(max-width:760px){
  body[data-browse-entity="on"] #library-panel{
    display:flex!important; /* V3C.7 visibility rule hides its content without killing the reparented player */
    visibility:hidden!important;
    pointer-events:none!important;
  }

  body[data-browse-entity="on"] #browse-panel{
    left:10px!important;
    right:10px!important;
    max-width:none!important;
    margin-inline:0!important;
  }

  body > #browse-rail-player.mobile-browse-player{
    visibility:visible!important;
    pointer-events:auto!important;
  }
}

/* Unified readable action treatment over high-energy visualizers. */
.browse-entity-actions button,
.browse-entity-link-button,
.browse-entity-toolbar button,
.entity-origin-panel > header button{
  border:1px solid rgba(73,229,255,.30)!important;
  background:linear-gradient(180deg,rgba(12,10,20,.88),rgba(7,6,13,.76))!important;
  color:rgba(255,255,255,.92)!important;
  box-shadow:inset 0 1px rgba(255,255,255,.035),0 8px 22px rgba(0,0,0,.20)!important;
  backdrop-filter:blur(10px)!important;
}

.browse-entity-actions button:hover,
.browse-entity-link-button:hover,
.browse-entity-toolbar button:hover,
.entity-origin-panel > header button:hover,
.browse-entity-actions button:focus-visible,
.browse-entity-link-button:focus-visible,
.browse-entity-toolbar button:focus-visible,
.entity-origin-panel > header button:focus-visible{
  border-color:rgba(73,229,255,.62)!important;
  background:linear-gradient(180deg,rgba(24,20,34,.94),rgba(10,8,18,.86))!important;
  color:#fff!important;
  box-shadow:0 0 24px rgba(73,229,255,.10),inset 0 1px rgba(255,255,255,.05)!important;
  outline:none!important;
}

/* Preserve priority action emphasis without making it unreadably bright. */
.browse-entity-actions button:first-child{
  border-color:rgba(73,229,255,.52)!important;
  background:linear-gradient(180deg,rgba(20,45,52,.88),rgba(8,18,24,.82))!important;
  color:#d8fbff!important;
}


/* =========================================================
   V3H.3 // OPERATOR + BANNER + AAA CARD SURGICAL REPAIR
   Scope intentionally limited.
   ========================================================= */

/* OPERATOR ONLY:
   Operator profile is its own discovery catalog, so do not show the
   global Catalog rail on desktop. Artist/Album/Track/Playlist keep it. */
@media(min-width:761px){
  body[data-browse-entity="on"][data-entity-type="operator"] #library-panel{
    display:flex!important;
    visibility:visible!important;
    pointer-events:auto!important;
  }

  body[data-browse-entity="on"][data-entity-type="operator"] #browse-panel{
    left:calc(var(--receiver-shell-pad) + var(--receiver-rail-width) + var(--receiver-shell-gap))!important;
    right:var(--receiver-shell-pad)!important;
    max-width:none!important;
    margin-inline:0!important;
  }

  body[data-browse-entity="on"][data-entity-type="operator"] #browse-rail-player{
    display:block!important;
  }
}

/* REAL BANNER ONLY.
   The renderer now provides an actual img for Blob URLs, data URLs,
   and normal URLs instead of routing them through a CSS variable. */
.browse-entity-banner{
  background:none!important;
}
.browse-entity-banner-media{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  display:block;
}
.browse-entity-banner-shade{
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(90deg,rgba(3,2,8,.60),rgba(3,2,8,.12) 58%,rgba(3,2,8,.22)),
    linear-gradient(180deg,rgba(3,2,8,.03),rgba(3,2,8,.09) 48%,rgba(3,2,8,.84));
}
.browse-entity-banner .browse-entity-hero-signal{
  z-index:2;
}

/* Operator Artists:
   Match the lighter discovery language used by Home artist cards:
   circular identity art + transparent resting surface + translucent hover. */
body[data-entity-type="operator"] .browse-operator-grid{
  grid-template-columns:repeat(auto-fill,minmax(170px,1fr));
  gap:14px;
}

body[data-entity-type="operator"] .browse-operator-card{
  border-color:transparent!important;
  background:transparent!important;
  box-shadow:none!important;
  padding:10px!important;
  transition:
    transform .16s ease,
    background .16s ease,
    border-color .16s ease,
    box-shadow .16s ease;
}

body[data-entity-type="operator"] .browse-operator-card>span{
  width:min(100%,180px);
  aspect-ratio:1;
  margin:0 auto 12px;
  border-radius:50%!important;
  background:
    radial-gradient(circle,rgba(32,231,255,.10),rgba(105,34,139,.12) 48%,rgba(0,0,0,.26));
  border:1px solid rgba(255,255,255,.055);
}

body[data-entity-type="operator"] .browse-operator-card:hover,
body[data-entity-type="operator"] .browse-operator-card:focus-visible{
  transform:translateY(-3px);
  border-color:rgba(32,231,255,.18)!important;
  background:linear-gradient(145deg,rgba(32,231,255,.065),rgba(255,49,221,.045))!important;
  box-shadow:0 12px 28px rgba(0,0,0,.20)!important;
  outline:none;
}

body[data-entity-type="operator"] .browse-operator-card:hover b,
body[data-entity-type="operator"] .browse-operator-card:focus-visible b{
  text-decoration:underline;
  text-decoration-color:rgba(73,229,255,.58);
  text-underline-offset:3px;
}

@media(max-width:760px){
  body[data-entity-type="operator"] .browse-operator-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  body[data-entity-type="operator"] .browse-operator-card>span{
    width:min(100%,150px);
  }
}



/* PHASE 5A.7A — PUBLIC RECEIVER MODE
   Same frozen Receiver shell; private authoring controls are suppressed. */
body[data-public-signal="on"]:not([data-creator-mode="on"]) #add-music,
body[data-public-signal="on"]:not([data-creator-mode="on"]) #mobile-add-music,
body[data-public-signal="on"]:not([data-creator-mode="on"]) #operator-mode-button,
body[data-public-signal="on"]:not([data-creator-mode="on"]) #operator-mobile-toggle,
body[data-public-signal="on"]:not([data-creator-mode="on"]) #operator-panel,
body[data-public-signal="on"]:not([data-creator-mode="on"]) [data-mobile-action="music"],
body[data-public-signal="on"]:not([data-creator-mode="on"]) [data-mobile-action="operator"],
body[data-public-signal="on"]:not([data-creator-mode="on"]) #track-info-open-operator,
body[data-public-signal="on"]:not([data-creator-mode="on"]) #track-info-view-lyrics {
  display: none !important;
}
body[data-public-signal="on"] .public-play-count {
  display: block;
  margin-top: .28rem;
  color: rgba(255,255,255,.48);
  font-style: normal;
  font-size: .68rem;
  letter-spacing: .04em;
}

/* Phase 5B.2 — public entity profile surfaces */
body[data-public-signal="on"] .browse-track-actions button:disabled{
  opacity:.38;
  cursor:default;
  box-shadow:none!important;
}
.browse-profile-section{margin-top:4px}

/* Phase 5B.3 — public global discovery / structured @ addressing */
.browse-address-hit{margin:0 0 18px;padding:14px;border:1px solid rgba(70,222,255,.24);border-radius:15px;background:linear-gradient(135deg,rgba(13,28,38,.84),rgba(37,12,43,.76))}
.browse-address-hit>small{display:block;margin:0 0 8px;color:#36dff5;font:800 9px/1 ui-monospace,Consolas,monospace;letter-spacing:.16em}
.browse-address-hit button{width:100%;display:flex;align-items:center;justify-content:space-between;gap:14px;padding:12px 14px;border:1px solid rgba(255,255,255,.08);border-radius:11px;background:rgba(0,0,0,.22);color:#fff;text-align:left;cursor:pointer}
.browse-address-hit button:hover,.browse-address-hit button:focus-visible{border-color:rgba(70,222,255,.48);outline:none}
.browse-address-hit strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:800 13px/1.2 ui-monospace,Consolas,monospace}
.browse-address-hit span{flex:none;color:rgba(255,255,255,.52);font-size:9px;letter-spacing:.1em}
@media(max-width:560px){.browse-address-hit button{align-items:flex-start;flex-direction:column}.browse-address-hit span{font-size:8px}}


/* =========================================================
   PHASE 5B.6 // IDENTITY TAXONOMY + NAVIGATION POLISH
   Public display taxonomy only. Canonical backend `channel`
   contract remains stable while SiGNAL is expressed as a role.
   ========================================================= */
.identity-role-badges{
  display:flex!important;
  flex-wrap:wrap;
  gap:5px;
  padding:8px 0 0;
  overflow:visible!important;
  white-space:normal!important;
}
.browse-card .identity-role-badges{padding-left:0;padding-right:0}
.browse-operator-card .identity-role-badges{padding:8px 10px 0}
.identity-role-badge{
  display:inline-flex;
  align-items:center;
  min-height:20px;
  padding:0 7px;
  border:1px solid rgba(73,229,255,.20);
  border-radius:999px;
  background:rgba(73,229,255,.045);
  color:rgba(213,249,255,.72);
  font-family:ui-monospace,Consolas,monospace!important;
  font-size:7px!important;
  font-weight:800!important;
  line-height:1!important;
  font-style:normal!important;
  text-transform:none!important;
  letter-spacing:.10em;
  white-space:nowrap;
}
.identity-role-badge:first-child{
  border-color:rgba(255,49,221,.24);
  background:rgba(255,49,221,.055);
  color:rgba(255,218,249,.80);
}

/* 5B.6.1 mobile/cache safety: role tags must never inherit oversized card typography. */
.browse-identity-card{overflow:hidden}
.browse-identity-card .identity-role-badges{
  width:100%;
  max-width:100%;
  align-items:center;
}
.identity-role-badge{
  flex:0 0 auto;
  max-width:100%;
  overflow:hidden;
  text-overflow:ellipsis;
}
@media(max-width:560px){
  .identity-role-badges{gap:4px;padding-top:7px}
  .identity-role-badge{
    min-height:18px;
    padding:0 6px;
    font-size:6.5px!important;
    letter-spacing:.09em;
  }
}

/* Slightly tighter, more legible global navigation with clear active state. */
.top-actions{gap:7px}
.top-actions .ghost-button{
  min-height:38px;
  padding:0 13px;
  border-color:rgba(255,255,255,.13);
  background:linear-gradient(180deg,rgba(13,9,21,.86),rgba(7,5,13,.78));
  letter-spacing:.10em;
  box-shadow:inset 0 1px rgba(255,255,255,.025);
}
.top-actions .ghost-button:hover,
.top-actions .ghost-button:focus-visible{
  transform:translateY(-1px);
  border-color:rgba(73,229,255,.38);
  color:#fff;
  box-shadow:0 7px 20px rgba(0,0,0,.20),0 0 18px rgba(73,229,255,.055);
  outline:none;
}
body[data-browse="on"] #top-home-button,
body:not([data-browse="on"]) #app[data-mode="full"] #top-player-button,
#app[data-mode="visualizer"] #top-performance-button,
#app[data-mode="presentation"] #presentation-button{
  border-color:rgba(73,229,255,.48)!important;
  background:linear-gradient(180deg,rgba(18,42,48,.88),rgba(8,17,23,.82))!important;
  color:#dffcff!important;
  box-shadow:inset 0 -2px rgba(73,229,255,.26),0 0 18px rgba(73,229,255,.06)!important;
}


/* =========================================================
   PHASE 5B.7.1 // SiGNAL // CHANNEL CARD PARITY
   Channel cards use the exact Artist-card geometry. Role tags
   are a compact footer and must never create a second art bubble.
   ========================================================= */
.browse-card.browse-channel-card,
.browse-card.browse-identity-card[data-browse-channel]{
  display:block!important;
  align-self:start!important;
  height:auto!important;
  min-height:0!important;
  max-height:none!important;
}
.browse-card.browse-channel-card>.browse-card-art,
.browse-card.browse-identity-card[data-browse-channel]>.browse-card-art{
  width:100%!important;
  height:auto!important;
  min-height:0!important;
  aspect-ratio:1/1!important;
  margin:0 0 10px!important;
  padding:0!important;
  border-radius:50%!important;
}
.browse-card.browse-channel-card>.identity-role-badges,
.browse-card.browse-identity-card[data-browse-channel]>.identity-role-badges{
  display:flex!important;
  flex-flow:row wrap!important;
  align-items:center!important;
  justify-content:flex-start!important;
  width:auto!important;
  height:auto!important;
  min-height:0!important;
  max-height:none!important;
  aspect-ratio:auto!important;
  margin:8px 0 0!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:none!important;
  box-shadow:none!important;
  overflow:visible!important;
}
.browse-card.browse-channel-card>.identity-role-badges>.identity-role-badge,
.browse-card.browse-identity-card[data-browse-channel]>.identity-role-badges>.identity-role-badge{
  display:inline-flex!important;
  width:auto!important;
  height:18px!important;
  min-height:18px!important;
  max-height:18px!important;
  aspect-ratio:auto!important;
  margin:0!important;
  padding:0 7px!important;
  border-radius:999px!important;
  font-size:6.5px!important;
  line-height:1!important;
}
@media(max-width:560px){
  .browse-card.browse-channel-card,
  .browse-card.browse-identity-card[data-browse-channel]{
    padding:10px!important;
  }
}


/* =========================================================
   PHASE 5B.7.2 // OPERATOR IDENTITY CARD PARITY + PUBLIC BOOT
   Operator SiGNAL // CHANNEL cards use the same circular-art
   geometry as Artist cards. Role badges are metadata only.
   ========================================================= */
body[data-entity-type="operator"] .browse-operator-card>.browse-operator-card-art{
  display:grid!important;
  place-items:center!important;
  width:min(100%,180px)!important;
  height:auto!important;
  min-height:0!important;
  aspect-ratio:1/1!important;
  margin:0 auto 12px!important;
  padding:0!important;
  overflow:hidden!important;
  border-radius:50%!important;
  background:radial-gradient(circle,rgba(32,231,255,.10),rgba(105,34,139,.12) 48%,rgba(0,0,0,.26))!important;
  border:1px solid rgba(255,255,255,.055)!important;
}
body[data-entity-type="operator"] .browse-operator-identity-card>.identity-role-badges{
  display:flex!important;
  flex-flow:row wrap!important;
  align-items:center!important;
  justify-content:flex-start!important;
  width:auto!important;
  height:auto!important;
  min-height:0!important;
  max-height:none!important;
  aspect-ratio:auto!important;
  margin:7px 10px 0!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:none!important;
  box-shadow:none!important;
  overflow:visible!important;
}
body[data-entity-type="operator"] .browse-operator-identity-card>.identity-role-badges>.identity-role-badge{
  width:auto!important;
  height:18px!important;
  min-height:18px!important;
  max-height:18px!important;
  aspect-ratio:auto!important;
  margin:0!important;
  padding:0 7px!important;
  border-radius:999px!important;
  font-size:6.5px!important;
  line-height:1!important;
}
@media(max-width:760px){
  body[data-entity-type="operator"] .browse-operator-card>.browse-operator-card-art{
    width:min(100%,150px)!important;
  }
}

/* =========================================================
   PHASE 5B.8 // PUBLIC PROFILE VISUAL PARITY
   Translate the proven local Operator/Artist/SiGNAL profile language
   to the public read-only entity shell. Data/publication contracts,
   playback, visualizers and creator controls remain unchanged.
   ========================================================= */

/* Identity pages inherit the cinematic local profile rhythm: banner first,
   circular identity portrait overlapping the banner, then identity copy. */
body[data-public-signal="on"]:is(
  [data-entity-type="operator"],
  [data-entity-type="artist"],
  [data-entity-type="channel"]
) .browse-entity-banner{
  min-height:clamp(230px,30vw,420px);
  border-radius:20px;
}

body[data-public-signal="on"]:is(
  [data-entity-type="operator"],
  [data-entity-type="artist"],
  [data-entity-type="channel"]
) .browse-entity-summary{
  position:relative;
  z-index:3;
  grid-template-columns:clamp(104px,12vw,150px) minmax(0,1fr) auto;
  gap:18px;
  align-items:end;
  padding:10px 6px 20px;
  border-bottom:1px solid rgba(255,255,255,.075);
}

body[data-public-signal="on"]:is(
  [data-entity-type="operator"],
  [data-entity-type="artist"],
  [data-entity-type="channel"]
) .browse-entity-summary-art{
  width:clamp(104px,12vw,150px);
  border-radius:50%!important;
  border:2px solid rgba(255,255,255,.16);
  background:radial-gradient(circle,rgba(32,231,255,.12),rgba(105,34,139,.14) 52%,rgba(0,0,0,.30));
  box-shadow:0 18px 46px rgba(0,0,0,.40),0 0 0 5px rgba(5,4,9,.62);
}

body[data-public-signal="on"]:is(
  [data-entity-type="operator"],
  [data-entity-type="artist"],
  [data-entity-type="channel"]
) .browse-entity-banner + .browse-entity-summary .browse-entity-summary-art{
  margin-top:-58px;
}

body[data-public-signal="on"]:is(
  [data-entity-type="operator"],
  [data-entity-type="artist"],
  [data-entity-type="channel"]
) .browse-entity-summary small{
  color:rgba(73,229,255,.76);
  font-size:8px;
  letter-spacing:.16em;
}

body[data-public-signal="on"]:is(
  [data-entity-type="operator"],
  [data-entity-type="artist"],
  [data-entity-type="channel"]
) .browse-entity-summary h2{
  margin:8px 0 5px;
  font-size:clamp(28px,4vw,52px);
  letter-spacing:-.02em;
}

body[data-public-signal="on"]:is(
  [data-entity-type="operator"],
  [data-entity-type="artist"],
  [data-entity-type="channel"]
) .browse-entity-summary p{
  color:rgba(255,255,255,.58);
  font:750 9px/1.5 ui-monospace,Consolas,monospace;
  letter-spacing:.06em;
}

/* ABOUT / CONTEXT should read like profile copy, not an admin card. */
body[data-public-signal="on"]:is(
  [data-entity-type="operator"],
  [data-entity-type="artist"],
  [data-entity-type="channel"]
) .browse-entity-about{
  margin-top:4px;
  padding:20px 6px;
  border:0;
  border-bottom:1px solid rgba(255,255,255,.07);
  border-radius:0;
  background:transparent;
}

body[data-public-signal="on"]:is(
  [data-entity-type="operator"],
  [data-entity-type="artist"],
  [data-entity-type="channel"]
) .browse-entity-about p{
  max-width:880px;
  color:rgba(255,255,255,.72);
  font-size:13px;
  line-height:1.75;
}

/* Relationship cards explicitly separate people/identities from releases.
   Identity cards stay circular; Release/Album cards stay square. */
.browse-profile-identity-card{
  border-color:transparent!important;
  background:transparent!important;
  box-shadow:none!important;
  padding:10px!important;
}

.browse-profile-identity-card>.browse-operator-card-art{
  display:grid!important;
  place-items:center!important;
  width:min(100%,180px)!important;
  height:auto!important;
  min-height:0!important;
  aspect-ratio:1/1!important;
  margin:0 auto 12px!important;
  padding:0!important;
  overflow:hidden!important;
  border-radius:50%!important;
  border:1px solid rgba(255,255,255,.06)!important;
  background:radial-gradient(circle,rgba(32,231,255,.10),rgba(105,34,139,.12) 48%,rgba(0,0,0,.26))!important;
}

.browse-profile-release-card{
  border-color:transparent!important;
  background:transparent!important;
  box-shadow:none!important;
  padding:10px!important;
}

body[data-entity-type="operator"] .browse-operator-card.browse-profile-release-card>.browse-profile-release-art,
.browse-profile-release-card>.browse-profile-release-art{
  display:grid!important;
  place-items:center!important;
  width:100%!important;
  max-width:220px!important;
  height:auto!important;
  aspect-ratio:1/1!important;
  margin:0 auto 12px!important;
  padding:0!important;
  overflow:hidden!important;
  border-radius:14px!important;
  border:1px solid rgba(255,255,255,.07)!important;
  background:linear-gradient(145deg,rgba(39,224,255,.05),rgba(255,43,220,.06)),#141018!important;
}

.browse-profile-identity-card:hover,
.browse-profile-identity-card:focus-visible,
.browse-profile-release-card:hover,
.browse-profile-release-card:focus-visible{
  transform:translateY(-3px);
  border-color:rgba(32,231,255,.16)!important;
  background:linear-gradient(145deg,rgba(32,231,255,.055),rgba(255,49,221,.04))!important;
  box-shadow:0 12px 28px rgba(0,0,0,.18)!important;
  outline:none;
}

@media(max-width:760px){
  body[data-public-signal="on"]:is(
    [data-entity-type="operator"],
    [data-entity-type="artist"],
    [data-entity-type="channel"]
  ) .browse-entity-banner{
    min-height:210px;
  }

  body[data-public-signal="on"]:is(
    [data-entity-type="operator"],
    [data-entity-type="artist"],
    [data-entity-type="channel"]
  ) .browse-entity-summary{
    grid-template-columns:88px minmax(0,1fr);
    gap:12px;
    align-items:end;
    padding-top:8px;
  }

  body[data-public-signal="on"]:is(
    [data-entity-type="operator"],
    [data-entity-type="artist"],
    [data-entity-type="channel"]
  ) .browse-entity-summary-art{
    width:88px;
  }

  body[data-public-signal="on"]:is(
    [data-entity-type="operator"],
    [data-entity-type="artist"],
    [data-entity-type="channel"]
  ) .browse-entity-banner + .browse-entity-summary .browse-entity-summary-art{
    margin-top:-42px;
  }

  body[data-public-signal="on"]:is(
    [data-entity-type="operator"],
    [data-entity-type="artist"],
    [data-entity-type="channel"]
  ) .browse-entity-summary .browse-entity-actions{
    grid-column:1/-1;
  }

  .browse-profile-identity-card>.browse-operator-card-art{
    width:min(100%,150px)!important;
  }
}

/* =========================================================
   Phase 5B.10.1 // PERFORMANCE POLISH
   Animated public Performance affordance. CSS-only so the
   effect is cheap, and reduced-motion users get a static glow.
   ========================================================= */
@keyframes signalPerformancePulse{
  0%,100%{
    border-color:rgba(255,53,218,.42);
    box-shadow:0 0 10px rgba(255,53,218,.12),0 0 24px rgba(255,53,218,.08);
  }
  50%{
    border-color:rgba(32,231,255,.62);
    box-shadow:0 0 15px rgba(32,231,255,.20),0 0 34px rgba(255,53,218,.16);
  }
}
.player-performance-button,
.browse-performance-button,
#top-performance-button,
#mobile-menu [data-mobile-action="performance"]{
  animation:signalPerformancePulse 2.8s ease-in-out infinite;
}
body[data-performance="on"] .player-performance-button,
body[data-performance="on"] .browse-performance-button,
#app[data-mode="visualizer"] #top-performance-button{
  box-shadow:0 0 18px rgba(32,231,255,.24),0 0 42px rgba(255,53,218,.20)!important;
}
@media (prefers-reduced-motion:reduce){
  .player-performance-button,
  .browse-performance-button,
  #top-performance-button,
  #mobile-menu [data-mobile-action="performance"]{
    animation:none!important;
    box-shadow:0 0 18px rgba(255,53,218,.14)!important;
  }
}



/* PHASE 5C.1 — AUTHENTICATED CREATOR RECEIVER */
body[data-creator-mode="on"] .brand-kicker{color:#ff72e8;text-shadow:0 0 16px rgba(255,53,218,.5)}
body[data-creator-mode="on"] #operator-mode-button,
body[data-creator-mode="on"] #operator-mobile-toggle{border-color:rgba(255,53,218,.48);box-shadow:0 0 20px rgba(255,53,218,.13)}
body[data-creator-mode="on"] #operator-panel{--creator-private-accent:#ff35da}
body[data-creator-mode="on"] .public-play-count{display:none!important}

/* Phase 5C.1 // authenticated web Creator boundary */
body[data-creator-mode="on"] .signal-web-mode-switch{
  border-color:rgba(32,231,255,.42);color:#bff8ff;box-shadow:0 0 20px rgba(32,231,255,.10)
}
body[data-creator-mode="on"] .browse-entity-actions [data-entity-collection]{display:none!important}

/* Phase 5C.2 // Creator workflow completion */
@media(max-width:860px){#mobile-menu{position:fixed!important;top:max(62px,calc(env(safe-area-inset-top) + 54px))!important;left:12px!important;z-index:12050!important}#mobile-menu-toggle{position:relative;z-index:12060!important}}
.operator-channel-link-picker{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:end}.operator-channel-link-picker label{min-width:0}
.playlist-publication-actions{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:10px 0 14px}.playlist-publication-actions button{min-height:38px;border:1px solid rgba(32,231,255,.22);border-radius:10px;background:rgba(32,231,255,.055);color:#fff;padding:0 12px;font:800 9px/1 ui-monospace,Consolas,monospace;letter-spacing:.08em}.playlist-publication-actions span{color:var(--cyan);font:800 9px/1 ui-monospace,Consolas,monospace;letter-spacing:.08em}
@media(max-width:620px){.operator-channel-link-picker{grid-template-columns:1fr}.playlist-editor-form{grid-template-columns:1fr!important}}
/* =========================================================
   5C.3A // HEADER + NAVIGATION AAA
   ========================================================= */

/* Keep the navigation shell above Operator/editor workspaces without
   changing the existing outside-tap / Escape dismissal behavior. */
#topbar{
  z-index:30050!important;
  grid-template-columns:auto minmax(220px,1fr) 42px auto!important;
  align-items:center!important;
}
#topbar .brand-button{
  grid-column:1!important;
  grid-row:1!important;
}
#topbar .search-shell{
  grid-column:2!important;
  grid-row:1!important;
  min-width:0!important;
}
#topbar .signal-account-slot{
  grid-column:3!important;
  grid-row:1!important;
}
#topbar .top-actions{
  grid-column:4!important;
  grid-row:1!important;
}

.signal-account-slot{
  width:42px;
  height:42px;
  min-width:42px;
  display:flex;
  align-items:center;
  justify-content:center;
}
.signal-account-slot:empty{
  display:none;
  width:0;
  min-width:0;
}

#signal-settings-button.signal-avatar-button{
  appearance:none;
  width:42px;
  height:42px;
  min-width:42px;
  min-height:42px;
  padding:0;
  overflow:hidden;
  display:grid;
  place-items:center;
  border:1px solid rgba(255,255,255,.14);
  border-radius:999px;
  background:
    radial-gradient(circle at 34% 28%,rgba(32,231,255,.16),rgba(255,53,218,.07) 54%,rgba(4,2,10,.88));
  color:#fff;
  cursor:pointer;
  box-shadow:
    0 0 0 1px rgba(255,255,255,.025),
    0 0 22px rgba(32,231,255,.045);
}
#signal-settings-button.signal-avatar-button:hover,
#signal-settings-button.signal-avatar-button:focus-visible{
  border-color:rgba(32,231,255,.46);
  box-shadow:
    0 0 0 3px rgba(32,231,255,.065),
    0 0 24px rgba(32,231,255,.12);
  outline:none;
}
#signal-settings-button.signal-avatar-button img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
}
.signal-avatar-fallback{
  display:grid;
  place-items:center;
  width:100%;
  height:100%;
  font:700 18px/1 Georgia,serif;
  color:rgba(255,255,255,.88);
  text-shadow:0 0 14px rgba(32,231,255,.28);
}

.signal-network-link{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  text-decoration:none;
  white-space:nowrap;
}

#mobile-menu{
  z-index:30100!important;
}
#mobile-menu-toggle{
  z-index:30110!important;
}
#mobile-menu .signal-mobile-network-link,
#mobile-menu .signal-mobile-music-link{
  display:flex;
  align-items:center;
  min-height:42px;
  padding:0 12px;
  border:1px solid rgba(255,255,255,.10);
  border-radius:9px;
  background:rgba(255,255,255,.035);
  color:#fff;
  text-decoration:none;
  font:750 9px/1 ui-monospace,Consolas,monospace;
  letter-spacing:.10em;
}
#mobile-menu .signal-mobile-network-link:hover,
#mobile-menu .signal-mobile-network-link:focus-visible,
#mobile-menu .signal-mobile-music-link:hover,
#mobile-menu .signal-mobile-music-link:focus-visible{
  border-color:rgba(32,231,255,.30);
  color:var(--cyan);
  outline:none;
}

@media(max-width:760px){
  #topbar{
    grid-template-columns:42px minmax(0,1fr) auto!important;
    grid-template-areas:none!important;
    gap:8px!important;
    align-items:center!important;
  }
  #mobile-menu-toggle{
    grid-area:auto!important;
    grid-column:1!important;
    grid-row:1!important;
    width:42px!important;
    height:42px!important;
    min-width:42px!important;
    min-height:42px!important;
  }
  #topbar .search-shell{
    grid-area:auto!important;
    grid-column:2!important;
    grid-row:1!important;
    width:100%!important;
    min-width:0!important;
  }
  #topbar .signal-account-slot{
    grid-area:auto!important;
    grid-column:3!important;
    grid-row:1!important;
    display:flex!important;
  }
  #topbar .signal-account-slot:empty{
    display:none!important;
    width:0!important;
    min-width:0!important;
  }
  #topbar .brand-button,
  #topbar .top-actions{
    display:none!important;
  }
}
/* =========================================================
   5C.3C // CREATOR PUBLICATION
   ========================================================= */
.operator-publication-state{
  margin-top:10px;
  padding:9px 11px;
  border:1px solid rgba(255,255,255,.10);
  border-radius:8px;
  background:rgba(255,255,255,.025);
  color:rgba(245,240,249,.62);
  font:750 9px/1.2 ui-monospace,Consolas,monospace;
  letter-spacing:.11em;
}
.operator-publication-state[data-state="published"]{
  border-color:rgba(32,231,255,.28);
  color:#baf8ff;
}
.operator-publication-state[data-state="unpublished-changes"]{
  border-color:rgba(255,53,218,.24);
  color:#ffd0f5;
}
#operator-artist-publish,#operator-track-publish{
  border-color:rgba(32,231,255,.34)!important;
  color:#baf8ff!important;
}
#operator-artist-unpublish,#operator-track-unpublish{
  border-color:rgba(255,255,255,.12)!important;
}
/* 0.6.35.12 // personal playlist + hierarchy refinement */
.browse-inline-action{border:1px solid rgba(32,231,255,.24);background:rgba(32,231,255,.05);color:var(--cyan);border-radius:9px;padding:8px 10px;font:800 8px/1 ui-monospace,Consolas,monospace;letter-spacing:.08em;cursor:pointer}.browse-inline-action:hover{border-color:rgba(32,231,255,.42);background:rgba(32,231,255,.09);color:#fff}.browse-personal-playlists{border-color:rgba(255,53,218,.12)}body[data-public-creator="on"] .playlist-toolbar{grid-template-columns:auto auto auto auto auto 1fr}@media(max-width:620px){body[data-public-creator="on"] .playlist-toolbar{grid-template-columns:1fr 1fr}.browse-section-head .browse-inline-action{max-width:48%}}


/* 0.6.35.14 // RECEIVER COMPLETION RC */
.browse-view-art{position:absolute;right:14px;bottom:14px;z-index:4;min-height:34px;padding:0 12px;border:1px solid rgba(57,255,121,.46);border-radius:9px;background:rgba(2,8,7,.72);color:#39ff79;font:850 8px/1 ui-monospace,Consolas,monospace;letter-spacing:.12em;cursor:pointer;box-shadow:0 0 18px rgba(57,255,121,.08)}
.browse-view-art:hover,.browse-view-art:focus-visible{border-color:#39ff79;color:#fff;box-shadow:0 0 24px rgba(57,255,121,.18);outline:none}
.art-lightbox{position:fixed;inset:0;z-index:20000;display:grid;place-items:center;padding:max(18px,env(safe-area-inset-top)) max(18px,env(safe-area-inset-right)) max(18px,env(safe-area-inset-bottom)) max(18px,env(safe-area-inset-left));background:rgba(0,0,0,.94)}
.art-lightbox img{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:block;max-width:96vw;max-height:92svh;width:auto;height:auto;object-fit:contain;box-shadow:0 20px 90px #000}
.art-lightbox button{position:fixed;top:max(14px,env(safe-area-inset-top));right:max(14px,env(safe-area-inset-right));z-index:1;width:42px;height:42px;border:1px solid rgba(255,255,255,.28);border-radius:50%;background:rgba(0,0,0,.66);color:#fff;font-size:24px;cursor:pointer}
.collection-action-card [data-collection-catalog],.collection-action-card [data-album-catalog],.collection-action-card [data-collection-new-playlist],.collection-action-card [data-album-new-playlist]{border-color:rgba(57,255,121,.34);color:#39ff79}
.collection-playlist-title{color:#39ff79}
.splash-skull-wrap{transform:translate3d(calc(var(--gx)*16px),calc(var(--gy)*16px),78px);transition:transform 80ms linear}
.splash-mics{transform:translate3d(calc(-50% + var(--gx)*22px),calc(-50% + var(--gy)*22px),108px);filter:brightness(.96);transition:transform 80ms linear}
#browse-panel{scroll-padding-bottom:calc(120px + env(safe-area-inset-bottom))}
.browse-content{padding-bottom:calc(100px + env(safe-area-inset-bottom))}
@media(prefers-reduced-motion:reduce){.splash-skull-wrap,.splash-mics{transition:none!important;transform:none!important}}


/* 0.6.35.15 // FINAL VERIFICATION RC refinements */
/* Track-list playlist/library access is always available directly from Album, Catalog, Artist and Playlist track rows. */
.browse-track-actions .browse-track-collect{min-width:38px;border-color:rgba(57,255,121,.42);color:#39ff79;background:rgba(57,255,121,.055);font-weight:900;font-size:12px}
.browse-track-actions .browse-track-collect:hover,.browse-track-actions .browse-track-collect:focus-visible{border-color:#39ff79;color:#fff;background:rgba(57,255,121,.11);outline:none}
/* Public identity tiles use the circular translucent identity language; the full Operator profile layout is intentionally untouched. */
body[data-public-signal="on"] .browse-card[data-browse-artist],
body[data-public-signal="on"] .browse-card[data-browse-channel],
body[data-public-signal="on"] .browse-card[data-browse-operator]{border-color:transparent;background:transparent;padding:8px;text-align:center;box-shadow:none;overflow:visible}
body[data-public-signal="on"] .browse-card[data-browse-artist]:hover,
body[data-public-signal="on"] .browse-card[data-browse-channel]:hover,
body[data-public-signal="on"] .browse-card[data-browse-operator]:hover{background:rgba(32,231,255,.025);border-color:transparent;transform:translateY(-2px)}
body[data-public-signal="on"] .browse-card[data-browse-artist]>.browse-card-art,
body[data-public-signal="on"] .browse-card[data-browse-channel]>.browse-card-art,
body[data-public-signal="on"] .browse-card[data-browse-operator]>.browse-card-art{width:min(100%,164px);margin:0 auto 11px;border-radius:50%;border:1px solid rgba(32,231,255,.28);box-shadow:0 0 0 6px rgba(4,8,14,.42),0 0 26px rgba(32,231,255,.08);background:rgba(6,7,13,.42)}
body[data-public-signal="on"] .browse-card[data-browse-artist]>strong,
body[data-public-signal="on"] .browse-card[data-browse-channel]>strong,
body[data-public-signal="on"] .browse-card[data-browse-operator]>strong,
body[data-public-signal="on"] .browse-card[data-browse-artist]>small,
body[data-public-signal="on"] .browse-card[data-browse-channel]>small,
body[data-public-signal="on"] .browse-card[data-browse-operator]>small{text-align:center}
@media(max-width:560px){.browse-track-actions{gap:5px}.browse-track-actions .browse-track-collect{min-width:36px;padding-left:7px;padding-right:7px}}

/* 0.6.36.2 // Player/Operator responsibility split + identity cards */
.catalog-identity-grid{grid-template-columns:repeat(auto-fill,minmax(132px,1fr));gap:16px}
.catalog-identity-card{background:transparent!important;border-color:transparent!important;text-align:center;display:flex;flex-direction:column;align-items:center;padding:10px 6px}
.catalog-identity-card .catalog-art--identity{width:min(132px,34vw);aspect-ratio:1;border-radius:50%;overflow:hidden;border:1px solid rgba(43,225,255,.28);background:rgba(4,9,18,.45);box-shadow:0 0 0 6px rgba(43,225,255,.025),0 12px 30px rgba(0,0,0,.24)}
.catalog-identity-card .catalog-art--identity img{width:100%;height:100%;object-fit:cover;border-radius:inherit}
.catalog-identity-card strong{margin-top:10px;text-align:center}.catalog-identity-card>span:last-child{text-align:center}
#delete-selected-playlist{border-color:rgba(255,86,127,.22);color:rgba(255,185,205,.78)}
.operator-playlist-manager #operator-playlist-editor,.operator-channel-manager #operator-channel-editor{display:grid;gap:12px;margin-top:14px}
.operator-playlist-manager #operator-playlist-editor[hidden],.operator-channel-manager #operator-channel-editor[hidden]{display:none}
#operator-track-channels,#operator-album-channels{min-height:92px}
@media(max-width:620px){.catalog-identity-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.catalog-identity-card .catalog-art--identity{width:min(126px,36vw)}}

/* 0.6.36.4 // FINAL REPAIR RC — playlist controls are first-class Player tools. */
body[data-catalog-view="playlists"] #playlist-toolbar{display:grid!important;grid-template-columns:repeat(6,auto) minmax(0,1fr)!important;position:relative;z-index:2;margin:4px 0 10px;padding:10px;border:1px solid rgba(32,231,255,.12);border-radius:11px;background:rgba(5,4,10,.42)}
body[data-catalog-view="playlists"] #playlist-toolbar button{min-height:34px}
.operator-public-url{display:grid;gap:5px;padding:9px 10px;border:1px solid rgba(32,231,255,.12);border-radius:8px;background:rgba(32,231,255,.025)}
.operator-public-url[hidden]{display:none}.operator-public-url span{font:800 7px/1 ui-monospace,Consolas,monospace;letter-spacing:.12em;color:rgba(32,231,255,.65)}.operator-public-url code{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:rgba(255,255,255,.7);font-size:9px}
@media(max-width:620px){body[data-catalog-view="playlists"] #playlist-toolbar{grid-template-columns:repeat(2,minmax(0,1fr))!important}body[data-catalog-view="playlists"] #selected-playlist-label{grid-column:1/-1}}

/* 0.6.36.4 // FINAL REPAIR RC — mobile playlist results must remain visible below the expanded toolbar.
   The 0.6.36.3 six-action toolbar could consume the fixed Catalog panel's remaining flex height,
   leaving #catalog-content at zero height even while managedPlaylists() still reported rows.
   In mobile Playlist view only, let the Catalog participate in normal page flow so the toolbar,
   playlist cards, and selected playlist tracks all remain reachable without changing playlist data. */
@media(max-width:620px){
  body[data-catalog-view="playlists"] #library-panel{
    height:auto!important;
    max-height:none!important;
    overflow:visible!important;
  }
  body[data-catalog-view="playlists"] #catalog-content{
    flex:0 0 auto!important;
    min-height:96px!important;
    max-height:none!important;
    overflow:visible!important;
    padding-bottom:8px;
  }
  body[data-catalog-view="playlists"] #catalog-content .playlist-grid{
    display:flex!important;
    min-height:1px;
  }
}


/* 0.6.36.5 // Owner Local Library */
body[data-creator-mode="on"] .creator-library-scope{display:grid;grid-template-columns:1fr 1fr;gap:4px;margin:0 0 10px;padding:4px;border:1px solid rgba(100,160,220,.2);border-radius:14px;background:rgba(5,7,16,.82)}
body[data-creator-mode="on"] .creator-library-scope button{min-height:42px;border:0;border-radius:10px;background:transparent;color:#8f91a3;font-weight:850;letter-spacing:.03em}
body[data-creator-mode="on"] .creator-library-scope button.active{background:linear-gradient(135deg,rgba(61,69,122,.45),rgba(99,42,104,.35));color:#fff;box-shadow:inset 0 0 0 1px rgba(124,235,255,.12)}
body[data-creator-library-scope="local"] #library-panel .catalog-tabs,body[data-creator-library-scope="local"] #library-panel .catalog-tools,body[data-creator-library-scope="local"] #library-panel .playlist-toolbar{display:none!important}
.creator-local-library-list{display:grid;gap:10px;padding-top:4px}
.creator-local-card{display:flex;align-items:center;gap:12px;padding:14px;border:1px solid rgba(129,129,174,.22);border-radius:16px;background:linear-gradient(180deg,rgba(20,20,31,.96),rgba(10,11,18,.96));min-width:0}
.creator-local-copy{display:grid;gap:4px;min-width:0;flex:1}.creator-local-copy strong{font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.creator-local-copy small{color:#9698aa;font-size:11px;text-transform:uppercase;letter-spacing:.04em}.creator-local-source{color:#a4a6b3;font-size:12px;display:flex;align-items:center;gap:7px}.creator-local-source i{width:8px;height:8px;border-radius:50%;background:#6c6d75}.creator-local-source i.online{background:#43e691;box-shadow:0 0 10px rgba(67,230,145,.45)}
.creator-local-actions{display:flex;gap:8px;flex:0 0 auto}.creator-local-actions button{width:42px;height:42px;border-radius:50%;border:1px solid rgba(119,130,172,.3);background:#141622;color:#fff;font-size:18px;font-weight:900}.creator-local-actions button.catalog-toggle{color:#ff83f3;border-color:rgba(255,88,235,.35)}.creator-local-actions button.catalog-toggle.prepared{color:#43e691;border-color:rgba(67,230,145,.4);box-shadow:inset 0 0 0 1px rgba(67,230,145,.08)}.creator-local-source b{color:#43e691;font-size:9px;letter-spacing:.08em}.creator-local-actions button:disabled{opacity:.35}
.creator-local-empty{padding:28px 12px;text-align:center;color:#9698aa;border:1px dashed rgba(120,125,155,.28);border-radius:16px}.creator-local-empty small{display:block;margin-top:8px;color:#717383}
@media(max-width:700px){.creator-local-card{padding:13px 12px}.creator-local-actions{gap:6px}.creator-local-actions button{width:40px;height:40px}.creator-local-copy strong{font-size:14px}}

/* 0.6.36.8 // Owner Local Library folder + device browsing */
.creator-local-view-nav{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;margin:0 0 10px;padding:4px;border:1px solid rgba(120,128,168,.18);border-radius:13px;background:rgba(8,10,18,.7)}
.creator-local-view-nav button{min-height:36px;border:0;border-radius:9px;background:transparent;color:#85899d;font:850 8px/1 ui-monospace,Consolas,monospace;letter-spacing:.08em;cursor:pointer}.creator-local-view-nav button.active{background:rgba(32,231,255,.075);color:var(--cyan);box-shadow:inset 0 0 0 1px rgba(32,231,255,.14)}
.creator-folder-head,.creator-device-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:12px 0 8px;padding:10px 12px;border:1px solid rgba(255,255,255,.065);border-radius:11px;background:rgba(255,255,255,.02)}.creator-folder-head div,.creator-device-head div{min-width:0}.creator-folder-head small,.creator-device-head small{display:block;color:#777d90;font:800 7px/1 ui-monospace,Consolas,monospace;letter-spacing:.13em}.creator-folder-head strong,.creator-device-head strong{display:block;margin-top:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.creator-folder-head button{min-height:32px;border:1px solid rgba(32,231,255,.18);border-radius:8px;background:rgba(32,231,255,.035);color:var(--cyan);padding:0 10px;font:800 8px/1 ui-monospace,Consolas,monospace}.creator-device-head>span{color:#7f8497;font:750 8px/1 ui-monospace,Consolas,monospace}
.creator-folder-breadcrumb{display:flex;align-items:center;gap:5px;min-width:0;overflow:auto;padding:2px 2px 9px}.creator-folder-breadcrumb button{border:0;background:transparent;color:#9ba1b7;padding:2px 3px;font:750 8px/1 ui-monospace,Consolas,monospace;white-space:nowrap}.creator-folder-breadcrumb button:last-child{color:var(--cyan)}.creator-folder-breadcrumb span{color:#4f5362}
.creator-folder-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:7px;margin-bottom:10px}.creator-folder-card{display:grid;grid-template-columns:34px minmax(0,1fr) auto;align-items:center;gap:9px;width:100%;min-height:58px;padding:9px 11px;border:1px solid rgba(116,124,166,.18);border-radius:12px;background:linear-gradient(180deg,rgba(20,21,33,.92),rgba(11,12,20,.92));color:#fff;text-align:left;cursor:pointer}.creator-folder-card:hover{border-color:rgba(32,231,255,.25);background:rgba(32,231,255,.035)}.creator-folder-icon{display:grid;place-items:center;width:32px;height:32px;border-radius:8px;background:rgba(255,60,220,.07);color:#ff78ea;font-size:15px}.creator-folder-card strong,.creator-folder-card small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.creator-folder-card strong{font-size:11px}.creator-folder-card small{margin-top:4px;color:#777d8f;font-size:8px}.creator-folder-card>b{color:#666d80;font-size:16px}.creator-folder-section-label{margin:12px 2px 7px;color:#777d8e;font:800 8px/1 ui-monospace,Consolas,monospace;letter-spacing:.11em}.creator-local-library-list--nested{padding-top:0;margin-bottom:12px}
@media(max-width:700px){.creator-folder-grid{grid-template-columns:1fr}.creator-local-view-nav button{font-size:7px}.creator-folder-head strong,.creator-device-head strong{font-size:12px}}


/* =========================================================
   0.6.36.9.1 // RECEIVER UX STABILIZATION + LOCAL LIBRARY SCROLL HOTFIX
   ========================================================= */
/* Stable interaction stack: editable stage never outranks app controls. */
#vl-scene-direct-overlay{z-index:440!important}
#visual-lab{z-index:480!important}
#visual-lab-panel{position:relative;isolation:isolate}
#visual-lab-panel>.vl-head{position:sticky;top:-15px;z-index:12;margin:-15px -15px 0;padding:15px 15px 13px;background:rgba(7,5,13,.985);backdrop-filter:none}
#visual-lab-panel>.vl-tabs{position:sticky;top:48px;z-index:11;margin-left:-15px!important;margin-right:-15px!important;padding:9px 15px 10px;background:linear-gradient(180deg,rgba(7,5,13,.99),rgba(7,5,13,.94));border-bottom:1px solid rgba(255,255,255,.055)}
@media(max-width:760px){
  body[data-visual-lab="on"] #visual-lab{z-index:480!important}
  #vl-scene-direct-overlay{z-index:440!important}
  #visual-lab-panel>.vl-head{top:-15px}
  #visual-lab-panel>.vl-tabs{top:48px}
}

/* 0.6.36.9.1 // Local Library scroll stability hotfix.
   Do NOT use content-visibility on cards inside the mobile #library-panel scroll
   container. Mobile Chromium can replace intrinsic estimates with real card
   heights while scrolling, which produces upward scroll jumps / brief flashes.
   The 0.6.36.9 playlist fast path remains; cards use normal stable layout. */
.creator-local-card,.creator-folder-card{content-visibility:visible;contain:none}
.collection-new-playlist{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:7px}
.collection-new-playlist[hidden]{display:none!important}
.collection-new-playlist input{min-width:0;height:40px;border:1px solid rgba(32,231,255,.18);border-radius:10px;background:rgba(0,0,0,.28);color:#fff;padding:0 11px;font:750 9px/1 ui-monospace,Consolas,monospace;letter-spacing:.06em;outline:none}
.collection-new-playlist input:focus{border-color:rgba(32,231,255,.5);box-shadow:0 0 0 3px rgba(32,231,255,.05)}
.collection-new-playlist button{padding:0 12px;color:var(--cyan)}
@media(max-width:480px){.collection-new-playlist{grid-template-columns:1fr}.collection-new-playlist button{width:100%}}
#topbar{z-index:500!important}


/* =========================================================
   0.6.36.9.5 // PLAYER SPACE + PLAYLIST ACCORDION
   - Give the track viewport useful height on mobile.
   - Collapse nonessential display controls without hiding Performance/Info/Volume.
   - Expand playlist tracks directly beneath the tapped playlist.
   ========================================================= */
.secondary-controls{position:relative}
.secondary-controls-toggle{
  position:absolute;z-index:3;top:-11px;right:12px;width:30px;height:22px;padding:0;
  border:1px solid rgba(255,255,255,.11);border-radius:999px;background:rgba(8,5,14,.96);
  color:rgba(255,255,255,.62);font:800 11px/1 ui-monospace,Consolas,monospace;cursor:pointer;
  box-shadow:0 8px 22px rgba(0,0,0,.28);
}
.secondary-controls-toggle:hover{color:#fff;border-color:rgba(32,231,255,.28)}
.secondary-controls.is-collapsed{
  grid-template-columns:minmax(110px,.8fr) minmax(110px,.8fr) minmax(180px,1.5fr)!important;
  gap:7px;padding-top:12px;padding-bottom:12px;
}
.secondary-controls.is-collapsed .secondary-control--display,
.secondary-controls.is-collapsed #visual-lab-launch,
.secondary-controls.is-collapsed .secondary-control--theme{display:none!important}
.secondary-controls.is-collapsed .player-performance-button,
.secondary-controls.is-collapsed #track-info-launch,
.secondary-controls.is-collapsed .secondary-control--volume{min-height:42px}
.secondary-controls.is-collapsed .secondary-control--volume{grid-column:auto!important}
.secondary-controls.is-collapsed .secondary-control--volume>span{font-size:7px}

.playlist-accordion{gap:8px}
.playlist-accordion-item{display:grid;gap:0}
.playlist-card{grid-template-columns:30px minmax(0,1fr) 24px;align-items:center;width:100%}
.playlist-chevron{display:grid;place-items:center;color:rgba(255,255,255,.40);font:800 13px/1 ui-monospace,monospace}
.playlist-card.selected .playlist-chevron{color:var(--cyan)}
.playlist-inline-detail{
  margin:0 8px 3px;padding:8px 8px 10px;border:1px solid rgba(255,53,218,.16);border-top:0;
  border-radius:0 0 12px 12px;background:rgba(0,0,0,.16);
}
.playlist-inline-detail .playlist-detail-title{margin:0 0 6px;padding:6px 2px 8px}
.playlist-inline-empty{padding:18px 8px;text-align:center;color:rgba(255,255,255,.36);font:700 8px/1.4 ui-monospace,Consolas,monospace;letter-spacing:.10em}

@media(max-width:980px){
  #library-panel{max-height:none!important;overflow:visible!important}
  #catalog-content{
    min-height:300px;max-height:clamp(420px,58svh,620px);overflow-y:auto;overflow-x:hidden;
    overscroll-behavior:contain;-webkit-overflow-scrolling:touch;scrollbar-gutter:stable;
    padding-right:2px;
  }
}
@media(max-width:560px){
  .secondary-controls.is-collapsed{
    grid-template-columns:minmax(0,.85fr) minmax(0,.85fr) minmax(132px,1.35fr)!important;
    width:96%;gap:6px;padding:10px 10px 9px;
  }
  .secondary-controls.is-collapsed .player-performance-button,
  .secondary-controls.is-collapsed #track-info-launch{padding:7px 8px;font-size:10px}
  .secondary-controls.is-collapsed #track-info-launch small{display:none}
  .secondary-controls.is-collapsed .secondary-control--volume{padding-left:2px;padding-right:2px}
  #catalog-content{max-height:clamp(430px,60svh,640px)}
}


/* =========================================================
   0.6.36.9.5 // PLAYLIST DIRECT REORDER
   Explicit drag handle keeps normal row taps/playback and page scrolling intact.
   ========================================================= */
.playlist-order-note{margin:2px 0 8px;color:var(--muted);font:700 8px/1.4 ui-monospace,monospace;letter-spacing:.12em}
.playlist-order-list{display:flex;flex-direction:column;gap:5px}
.playlist-order-item{display:grid;grid-template-columns:34px minmax(0,1fr);gap:5px;align-items:stretch;position:relative;border-radius:10px}
.playlist-order-track{min-width:0}
.playlist-order-handle{min-width:34px;border:1px solid rgba(255,255,255,.06);border-radius:9px;background:rgba(255,255,255,.018);color:#766b7d;font:800 12px/1 ui-monospace,monospace;cursor:grab;touch-action:none;user-select:none;-webkit-user-select:none}
.playlist-order-handle:hover,.playlist-order-handle:focus-visible,.playlist-order-handle.active{color:var(--cyan);border-color:rgba(32,231,255,.28);background:rgba(32,231,255,.05);outline:none}
.playlist-order-handle:disabled{opacity:.3;cursor:wait}
.playlist-order-item.dragging{opacity:.55}
.playlist-order-item.drop-before::before,.playlist-order-item.drop-after::after{content:"";position:absolute;left:0;right:0;height:2px;background:var(--cyan);box-shadow:0 0 10px rgba(32,231,255,.35);z-index:2;pointer-events:none}
.playlist-order-item.drop-before::before{top:-3px}.playlist-order-item.drop-after::after{bottom:-3px}
@media(max-width:620px){.playlist-order-item{grid-template-columns:40px minmax(0,1fr)}.playlist-order-handle{min-width:40px;min-height:48px;font-size:13px}.playlist-order-note{font-size:7.5px}}

/* =========================================================
   0.6.36.9.6 // CATALOG ENTITY ACCORDIONS
   Bring Tracks / Albums / Artists to the Playlist interaction level.
   ========================================================= */
.catalog-entity-accordion{display:flex;flex-direction:column;gap:8px;padding-top:4px}
.catalog-entity-item{display:grid;gap:0;min-width:0}
.catalog-entity-card{display:grid;grid-template-columns:52px minmax(0,1fr) 28px;gap:10px;align-items:center;width:100%;min-height:68px;padding:8px 10px;border:1px solid var(--line);border-radius:12px;background:rgba(255,255,255,.022);color:#fff;text-align:left;cursor:pointer;transition:border-color .14s ease,background .14s ease}
.catalog-entity-card:hover,.catalog-entity-card:focus-visible,.catalog-entity-item.expanded>.catalog-entity-card{border-color:rgba(255,53,218,.30);background:rgba(255,53,218,.04);outline:none}
.catalog-entity-art{width:52px;height:52px;border-radius:9px;overflow:hidden;display:grid;place-items:center;background:radial-gradient(circle,#35122f,#07050a);border:1px solid rgba(255,255,255,.055);font:400 22px Georgia,serif}
.catalog-entity-art--artist{border-radius:50%}
.catalog-entity-art img{width:100%;height:100%;object-fit:cover}
.catalog-entity-copy{min-width:0}.catalog-entity-copy strong,.catalog-entity-copy small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.catalog-entity-copy strong{font-size:12px;letter-spacing:.01em}.catalog-entity-copy small{margin-top:5px;color:var(--muted);font-size:9px}
.catalog-entity-chevron{justify-self:end;color:#86798e;font:800 14px/1 ui-monospace,monospace}.catalog-entity-item.expanded .catalog-entity-chevron{color:var(--cyan)}
.catalog-entity-detail{margin:0 14px;border:1px solid rgba(255,53,218,.16);border-top:0;border-radius:0 0 12px 12px;padding:10px;background:rgba(6,4,10,.42);min-width:0}
.catalog-entity-toolbar{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 0 9px;padding:2px 1px 8px;border-bottom:1px solid rgba(255,255,255,.065)}
.catalog-entity-toolbar>div:first-child{min-width:0}.catalog-entity-toolbar small,.catalog-entity-toolbar strong{display:block}.catalog-entity-toolbar small{color:var(--cyan);font:800 8px/1.2 ui-monospace,Consolas,monospace;letter-spacing:.14em}.catalog-entity-toolbar strong{margin-top:5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font:800 9px/1.3 ui-monospace,Consolas,monospace;letter-spacing:.09em}
.catalog-entity-actions{display:flex;gap:5px;flex-wrap:wrap;justify-content:flex-end}.catalog-entity-actions button{min-height:30px;padding:0 9px;border:1px solid rgba(255,255,255,.08);border-radius:8px;background:rgba(255,255,255,.025);color:#a79cac;font:800 7.5px/1 ui-monospace,Consolas,monospace;letter-spacing:.08em;cursor:pointer}.catalog-entity-actions button:hover:not(:disabled),.catalog-entity-actions button:focus-visible{color:var(--cyan);border-color:rgba(32,231,255,.28);background:rgba(32,231,255,.05);outline:none}.catalog-entity-actions button:disabled{opacity:.3;cursor:not-allowed}
.catalog-track-toolbar{margin-top:4px}.catalog-track-toolbar+.track-list{padding-top:0}
.catalog-entity-empty{padding:18px 12px;text-align:center;color:#746a78;font:800 8px/1.5 ui-monospace,Consolas,monospace;letter-spacing:.12em;border:1px dashed rgba(255,255,255,.07);border-radius:10px}
body[data-catalog-view="albums"] .catalog-tools select option[value="track"],body[data-catalog-view="artists"] .catalog-tools select option[value="track"]{display:none}
@media(max-width:620px){
  .catalog-entity-card{grid-template-columns:46px minmax(0,1fr) 24px;min-height:62px;padding:7px 8px;gap:9px}
  .catalog-entity-art{width:46px;height:46px}
  .catalog-entity-detail{margin:0 7px;padding:9px 7px}
  .catalog-entity-toolbar{align-items:flex-start;flex-direction:column}
  .catalog-entity-actions{width:100%;display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
  .catalog-entity-actions button{min-height:34px;padding:0 6px}
  .catalog-track-toolbar .catalog-entity-actions{grid-template-columns:1fr 1fr}
  body[data-catalog-view="albums"] .track-row-wrap,body[data-catalog-view="artists"] .track-row-wrap{grid-template-columns:minmax(0,1fr) 32px}
}


/* =========================================================
   0.6.36.9.7 // CATALOG SPACE + PLAYLIST REORDER POLISH
   - Tracks / Albums / Artists get a real mobile viewport instead of the
     old fixed 44svh parent clipping their content behind Display controls.
   - Playlist reorder controls use Receiver-native styling and touch-safe
     feedback; no browser-default white buttons.
   ========================================================= */
.playlist-order-note{
  display:flex;align-items:center;gap:7px;min-height:28px;margin:2px 0 8px;padding:0 3px;
  color:rgba(32,231,255,.70);font:800 7px/1.35 ui-monospace,Consolas,monospace;
  letter-spacing:.10em;text-transform:uppercase;white-space:normal
}
.playlist-order-note::before{content:"ORDER";display:inline-grid;place-items:center;min-height:20px;padding:0 7px;border:1px solid rgba(32,231,255,.18);border-radius:999px;background:rgba(32,231,255,.035);color:rgba(32,231,255,.88);font-size:6px;letter-spacing:.12em}
.playlist-order-list{display:flex;flex-direction:column;gap:6px}
.playlist-order-item{grid-template-columns:30px minmax(0,1fr);gap:6px;align-items:center;padding:2px 0;border-radius:11px;transition:background .12s ease,opacity .12s ease}
.playlist-order-item.dragging{opacity:.72;background:rgba(32,231,255,.035)}
.playlist-order-handle{
  appearance:none!important;-webkit-appearance:none!important;box-sizing:border-box!important;
  width:30px!important;min-width:30px!important;height:44px!important;min-height:44px!important;margin:0!important;padding:0!important;
  display:grid!important;place-items:center!important;border:1px solid rgba(255,255,255,.075)!important;border-radius:9px!important;
  background:linear-gradient(180deg,rgba(24,18,31,.92),rgba(9,7,14,.94))!important;color:#71677a!important;
  box-shadow:inset 0 1px rgba(255,255,255,.025)!important;font:900 12px/1 ui-monospace,Consolas,monospace!important;
  cursor:grab!important;touch-action:none!important;user-select:none!important;-webkit-user-select:none!important
}
.playlist-order-handle span{pointer-events:none;transform:scaleX(.82);letter-spacing:-.18em}
.playlist-order-handle:hover,.playlist-order-handle:focus-visible,.playlist-order-handle.active{
  color:var(--cyan)!important;border-color:rgba(32,231,255,.34)!important;background:linear-gradient(180deg,rgba(18,42,48,.82),rgba(8,18,23,.92))!important;
  box-shadow:inset 0 0 0 1px rgba(32,231,255,.055),0 0 18px rgba(32,231,255,.06)!important;outline:none!important
}
.playlist-order-handle:disabled{opacity:.32!important;cursor:wait!important}
.playlist-order-item.drop-before::before,.playlist-order-item.drop-after::after{left:34px;right:4px;height:2px;border-radius:99px}
.playlist-order-track .track-row{min-height:48px}

@media(max-width:760px){
  /* The original mobile shell gives #library-panel a fixed 44svh height.
     That worked for the old tiny list, but clips modern Catalog views. */
  body[data-creator-library-scope="catalog"]:not([data-catalog-view="playlists"]) #library-panel{
    height:auto!important;min-height:0!important;max-height:none!important;overflow:visible!important
  }
  body[data-creator-library-scope="catalog"][data-catalog-view="tracks"] #catalog-content,
  body[data-creator-library-scope="catalog"][data-catalog-view="albums"] #catalog-content,
  body[data-creator-library-scope="catalog"][data-catalog-view="artists"] #catalog-content{
    height:clamp(470px,62svh,650px)!important;min-height:clamp(470px,62svh,650px)!important;max-height:clamp(470px,62svh,650px)!important;
    overflow-y:auto!important;overflow-x:hidden!important;overscroll-behavior:contain!important;-webkit-overflow-scrolling:touch;
    scroll-padding-top:8px;scroll-padding-bottom:12px;padding-right:2px
  }
  .playlist-inline-detail{margin-left:4px;margin-right:4px;padding:10px 7px 11px}
  .playlist-order-item{grid-template-columns:30px minmax(0,1fr);gap:5px}
  .playlist-order-handle{width:30px!important;min-width:30px!important;height:46px!important;min-height:46px!important}
  .playlist-order-note{font-size:6.5px;letter-spacing:.085em}
}

/* =========================================================
   0.6.36.9.8 // HARD CACHE-BUST + TRUE MOBILE CATALOG SPACE
   The host was serving stale path-cached app.js/styles.css while ignoring
   query-string cache tokens. This block intentionally ships in a new CSS
   filename and makes the Catalog content region visibly spacious.
   ========================================================= */
@media(max-width:760px){
  body[data-creator-library-scope="catalog"] #library-panel{
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    overflow:visible!important;
  }
  body[data-creator-library-scope="catalog"]:not([data-catalog-view="playlists"]) #catalog-content{
    box-sizing:border-box!important;
    height:clamp(520px,68svh,720px)!important;
    min-height:clamp(520px,68svh,720px)!important;
    max-height:clamp(520px,68svh,720px)!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    overscroll-behavior:contain!important;
    -webkit-overflow-scrolling:touch;
    padding-bottom:18px!important;
  }
  body[data-catalog-view="artists"] .catalog-entity-accordion,
  body[data-catalog-view="albums"] .catalog-entity-accordion{
    padding-bottom:12px;
  }
  .playlist-order-note{
    min-height:24px!important;
    margin:0 0 7px!important;
    padding:0 2px!important;
    font-size:6px!important;
    line-height:1.25!important;
  }
  .playlist-order-note::before{min-height:18px!important;padding:0 6px!important;font-size:5.5px!important}
  .playlist-order-handle{
    appearance:none!important;-webkit-appearance:none!important;
    width:30px!important;min-width:30px!important;max-width:30px!important;
    height:46px!important;min-height:46px!important;max-height:46px!important;
    padding:0!important;margin:0!important;
    border:1px solid rgba(32,231,255,.14)!important;border-radius:8px!important;
    background:rgba(7,9,15,.96)!important;color:rgba(32,231,255,.62)!important;
    box-shadow:inset 0 0 0 1px rgba(255,255,255,.018)!important;
  }
}


/* =========================================================
   0.6.36.9.9 // UI STYLE POLISH RC
   - Bring creator catalog cards closer to the homepage identity language.
   - Restore Operator action rows to normal document flow.
   - Give workspace tabs natural width so PLAYLIST / ANALYTICS fit on mobile.
   ========================================================= */
body[data-creator-library-scope="catalog"] .catalog-track-toolbar,
body[data-creator-library-scope="catalog"] .catalog-entity-toolbar{
  padding:4px 3px 10px;
  border-bottom-color:rgba(255,255,255,.055);
}
body[data-creator-library-scope="catalog"] .catalog-entity-accordion,
body[data-creator-library-scope="catalog"] .playlist-grid,
body[data-creator-library-scope="catalog"] .track-list{gap:10px}
body[data-creator-library-scope="catalog"] .catalog-entity-card{
  grid-template-columns:76px minmax(0,1fr) 28px;
  min-height:92px;
  padding:10px 12px;
  border-color:rgba(255,255,255,.035);
  background:linear-gradient(135deg,rgba(18,11,29,.16),rgba(7,5,12,.045));
  box-shadow:none;
}
body[data-creator-library-scope="catalog"] .catalog-entity-card:hover,
body[data-creator-library-scope="catalog"] .catalog-entity-card:focus-visible,
body[data-creator-library-scope="catalog"] .catalog-entity-item.expanded>.catalog-entity-card{
  border-color:rgba(32,231,255,.18);
  background:linear-gradient(135deg,rgba(18,42,48,.14),rgba(16,9,24,.08));
}
body[data-catalog-view="artists"] .catalog-entity-card{
  border-color:transparent;
  background:transparent;
  padding-left:2px;
  padding-right:6px;
}
body[data-catalog-view="artists"] .catalog-entity-card:hover,
body[data-catalog-view="artists"] .catalog-entity-card:focus-visible,
body[data-catalog-view="artists"] .catalog-entity-item.expanded>.catalog-entity-card{
  border-color:transparent;
  background:rgba(32,231,255,.028);
}
.catalog-entity-art-shell{display:grid;place-items:center}
.catalog-entity-art-shell--artist{
  width:74px;height:74px;border-radius:50%;padding:4px;
  background:radial-gradient(circle at 50% 40%,rgba(32,231,255,.14),rgba(112,36,151,.20) 58%,rgba(7,6,12,.42));
  box-shadow:0 0 0 1px rgba(32,231,255,.18),0 0 0 7px rgba(5,8,14,.30),0 0 26px rgba(32,231,255,.06);
}
.catalog-entity-art-shell--album{
  width:70px;height:70px;border-radius:15px;padding:4px;
  background:linear-gradient(145deg,rgba(20,28,45,.28),rgba(86,24,111,.18));
  box-shadow:0 0 0 1px rgba(255,255,255,.06),0 12px 28px rgba(0,0,0,.16);
}
.catalog-entity-card--artist .catalog-entity-art{width:66px;height:66px;border-radius:50%;border-color:rgba(32,231,255,.28);background:rgba(6,7,13,.44)}
.catalog-entity-card--album .catalog-entity-art{width:62px;height:62px;border-radius:12px;border-color:rgba(255,255,255,.08);background:radial-gradient(circle,rgba(32,231,255,.10),rgba(105,34,139,.14) 48%,rgba(0,0,0,.36))}
.catalog-entity-kicker{
  display:block!important;
  margin-bottom:6px;
  color:rgba(32,231,255,.76)!important;
  font:800 7px/1 ui-monospace,Consolas,monospace!important;
  letter-spacing:.16em;
  text-transform:uppercase;
}
.catalog-entity-card--artist .catalog-entity-copy strong{font-size:14px}
.catalog-entity-card--album .catalog-entity-copy strong{font-size:13px}
.catalog-entity-copy small:last-child{margin-top:4px;color:rgba(255,255,255,.48);font-size:9px}
.catalog-entity-detail{
  margin:0 10px;
  padding:11px 10px;
  border-color:rgba(32,231,255,.12);
  background:linear-gradient(180deg,rgba(8,7,13,.46),rgba(5,4,10,.28));
}
.catalog-track-toolbar{margin-top:2px}
.track-row-wrap{grid-template-columns:minmax(0,1fr) 34px;gap:6px;align-items:center}
.track-row{
  min-height:58px;
  padding:10px 11px;
  border:1px solid rgba(255,255,255,.05);
  background:linear-gradient(135deg,rgba(255,255,255,.02),rgba(255,255,255,.012));
}
.track-row:hover{background:rgba(32,231,255,.045);border-color:rgba(32,231,255,.18)}
.track-row.active{background:rgba(255,53,218,.06);border-color:rgba(255,53,218,.22)}
.track-copy strong{font-size:12px}
.track-copy span{color:rgba(255,255,255,.45);font-size:9px}
.track-kind{color:rgba(255,255,255,.40)}
.row-action{
  width:34px;height:34px;border-radius:10px;border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.022);color:#9f93a8;
}
.row-action:hover{color:var(--cyan);border-color:rgba(32,231,255,.24);background:rgba(32,231,255,.05)}
.playlist-card{
  min-height:72px;
  padding:10px 11px;
  border-color:rgba(255,255,255,.05);
  background:linear-gradient(135deg,rgba(16,11,26,.16),rgba(7,5,12,.05));
}
.playlist-card:hover,.playlist-card.selected{border-color:rgba(32,231,255,.18);background:linear-gradient(135deg,rgba(18,42,48,.12),rgba(15,8,22,.08))}
.playlist-icon{background:radial-gradient(circle,rgba(32,231,255,.10),rgba(105,34,139,.14) 48%,rgba(0,0,0,.32));border:1px solid rgba(32,231,255,.16)}
.playlist-inline-detail{
  margin:0 8px 3px;
  padding:10px 9px 11px;
  border-color:rgba(32,231,255,.10);
  background:linear-gradient(180deg,rgba(8,7,13,.46),rgba(5,4,10,.28));
}
.playlist-inline-detail .playlist-detail-title{border-bottom-color:rgba(255,255,255,.055)}
#operator-panel .operator-workspace-nav{
  display:flex!important;
  flex-wrap:wrap!important;
  grid-template-columns:none!important;
  justify-content:flex-start!important;
  gap:10px!important;
}
#operator-panel .operator-workspace-nav button{
  flex:1 1 132px!important;
  min-width:132px!important;
  max-width:none!important;
  padding:12px 16px!important;
}
#operator-panel .operator-actions{
  position:static!important;
  bottom:auto!important;
  z-index:auto!important;
  margin-top:18px!important;
  padding:0!important;
  background:transparent!important;
}
#operator-panel .operator-workspace[data-operator-workspace="track"] .operator-actions{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:10px!important;
}
#operator-panel #operator-save{grid-column:1 / -1!important}
#operator-panel #operator-track-publish,
#operator-panel #operator-track-unpublish{grid-column:auto!important}
#operator-panel .operator-workspace[data-operator-workspace="track"] .operator-section:last-of-type{margin-bottom:18px}
@media(max-width:980px){
  #operator-panel .operator-workspace-nav{overflow:visible!important}
  #operator-panel .operator-workspace-nav button{flex:1 1 calc(50% - 10px)!important;min-width:142px!important}
}
@media(max-width:620px){
  body[data-creator-library-scope="catalog"] .catalog-entity-card{grid-template-columns:68px minmax(0,1fr) 24px;min-height:84px;padding:9px 8px}
  .catalog-entity-art-shell--artist{width:66px;height:66px}
  .catalog-entity-art-shell--album{width:62px;height:62px;border-radius:13px}
  .catalog-entity-card--artist .catalog-entity-art{width:58px;height:58px}
  .catalog-entity-card--album .catalog-entity-art{width:54px;height:54px;border-radius:10px}
  .catalog-entity-detail,.playlist-inline-detail{margin-left:4px;margin-right:4px}
  #operator-panel .operator-workspace-nav button{flex:1 1 calc(50% - 8px)!important;min-width:126px!important}
  #operator-panel .operator-workspace[data-operator-workspace="track"] .operator-actions{grid-template-columns:1fr 1fr!important}
}


/* 0.6.36.9.10 // PLAYLIST +/- + ALBUM IMPORT/DELETE REPAIR */
.row-action--remove{color:#ff78c8;border-color:rgba(255,83,190,.20);background:rgba(255,53,160,.035)}
.row-action--remove:hover,.row-action--remove:focus-visible{color:#fff;border-color:rgba(255,83,190,.42);background:rgba(255,53,160,.09);outline:none}
#operator-album-delete{border-color:rgba(255,83,130,.20);color:#ff7aa9;background:rgba(255,53,110,.035)}
#operator-album-delete:hover:not(:disabled),#operator-album-delete:focus-visible{border-color:rgba(255,83,130,.42);color:#fff;background:rgba(255,53,110,.09);outline:none}
#operator-album-delete:disabled{opacity:.32;cursor:not-allowed}


/* =========================================================
   0.6.36.9.11 // PLAYER CARD STYLE + TOUCH REORDER REPAIR
   Homepage-inspired art-forward catalog tiles; robust nested-scroll drag.
   ========================================================= */
html.playlist-drag-active,html.playlist-drag-active body{overscroll-behavior:none!important}
html.playlist-drag-active{touch-action:none!important}
.playlist-order-handle{touch-action:none!important;-webkit-user-select:none!important;user-select:none!important}
.playlist-order-item.dragging{position:relative;z-index:3;transform:scale(.995);background:rgba(32,231,255,.045)!important;box-shadow:0 0 0 1px rgba(32,231,255,.12),0 12px 30px rgba(0,0,0,.18)}

body[data-creator-library-scope="catalog"][data-catalog-view="albums"] .catalog-entity-accordion,
body[data-creator-library-scope="catalog"][data-catalog-view="artists"] .catalog-entity-accordion{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px!important;
  padding-top:5px;
}
body[data-catalog-view="albums"] .catalog-entity-item,
body[data-catalog-view="artists"] .catalog-entity-item{min-width:0}
body[data-catalog-view="albums"] .catalog-entity-item.expanded,
body[data-catalog-view="artists"] .catalog-entity-item.expanded{grid-column:1/-1}

body[data-catalog-view="albums"] .catalog-entity-card,
body[data-catalog-view="artists"] .catalog-entity-card{
  display:flex!important;
  flex-direction:column;
  align-items:stretch;
  justify-content:flex-start;
  min-height:0;
  padding:8px!important;
  border:1px solid rgba(255,255,255,.035)!important;
  border-radius:17px!important;
  background:linear-gradient(180deg,rgba(8,6,13,.18),rgba(8,6,13,.06))!important;
  overflow:hidden;
  box-shadow:none!important;
}
body[data-catalog-view="albums"] .catalog-entity-card:hover,
body[data-catalog-view="albums"] .catalog-entity-card:focus-visible,
body[data-catalog-view="albums"] .catalog-entity-item.expanded>.catalog-entity-card,
body[data-catalog-view="artists"] .catalog-entity-card:hover,
body[data-catalog-view="artists"] .catalog-entity-card:focus-visible,
body[data-catalog-view="artists"] .catalog-entity-item.expanded>.catalog-entity-card{
  border-color:rgba(32,231,255,.15)!important;
  background:linear-gradient(180deg,rgba(17,29,37,.18),rgba(18,8,27,.09))!important;
}
body[data-catalog-view="albums"] .catalog-entity-art-shell,
body[data-catalog-view="artists"] .catalog-entity-art-shell{
  width:100%!important;
  height:auto!important;
  padding:0!important;
  margin:0 0 9px!important;
  background:transparent!important;
  box-shadow:none!important;
}
body[data-catalog-view="albums"] .catalog-entity-art-shell--album{border-radius:14px!important}
body[data-catalog-view="artists"] .catalog-entity-art-shell--artist{border-radius:50%!important}
body[data-catalog-view="albums"] .catalog-entity-art,
body[data-catalog-view="artists"] .catalog-entity-art{
  width:100%!important;
  height:auto!important;
  aspect-ratio:1/1;
  margin:0!important;
  border:1px solid rgba(255,255,255,.055)!important;
  background:radial-gradient(circle at 50% 42%,rgba(32,231,255,.10),rgba(95,26,125,.15) 52%,rgba(4,3,8,.34))!important;
  box-shadow:0 10px 28px rgba(0,0,0,.16);
}
body[data-catalog-view="albums"] .catalog-entity-art{border-radius:13px!important}
body[data-catalog-view="artists"] .catalog-entity-art{border-radius:50%!important;border-color:rgba(32,231,255,.20)!important}
body[data-catalog-view="albums"] .catalog-entity-copy,
body[data-catalog-view="artists"] .catalog-entity-copy{width:100%;padding:0 3px 3px;min-width:0}
body[data-catalog-view="albums"] .catalog-entity-kicker,
body[data-catalog-view="artists"] .catalog-entity-kicker{margin-bottom:5px!important;font-size:6px!important;color:rgba(32,231,255,.78)!important}
body[data-catalog-view="albums"] .catalog-entity-copy strong,
body[data-catalog-view="artists"] .catalog-entity-copy strong{font-size:12px!important;line-height:1.18;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body[data-catalog-view="albums"] .catalog-entity-copy small:last-child,
body[data-catalog-view="artists"] .catalog-entity-copy small:last-child{font-size:8px!important;color:rgba(255,255,255,.44)!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body[data-catalog-view="albums"] .catalog-entity-chevron,
body[data-catalog-view="artists"] .catalog-entity-chevron{
  position:absolute;right:13px;bottom:13px;width:23px;height:23px;display:grid;place-items:center;
  border:1px solid rgba(255,255,255,.055);border-radius:50%;background:rgba(5,4,9,.54);font-size:10px
}
body[data-catalog-view="albums"] .catalog-entity-item,
body[data-catalog-view="artists"] .catalog-entity-item{position:relative}
body[data-catalog-view="albums"] .catalog-entity-detail,
body[data-catalog-view="artists"] .catalog-entity-detail{
  grid-column:1/-1;
  margin:7px 0 2px!important;
  border:1px solid rgba(32,231,255,.10)!important;
  border-radius:14px!important;
  background:linear-gradient(180deg,rgba(7,6,12,.54),rgba(5,4,10,.30))!important;
}

/* Keep playlists art-light but visually related to the homepage cards. */
body[data-catalog-view="playlists"] .playlist-card{
  border-radius:15px!important;
  border-color:rgba(255,255,255,.04)!important;
  background:linear-gradient(135deg,rgba(12,8,20,.18),rgba(6,5,10,.055))!important;
  box-shadow:none!important;
}
body[data-catalog-view="playlists"] .playlist-card.selected{border-color:rgba(32,231,255,.16)!important;background:rgba(32,231,255,.025)!important}

@media(max-width:420px){
  body[data-creator-library-scope="catalog"][data-catalog-view="albums"] .catalog-entity-accordion,
  body[data-creator-library-scope="catalog"][data-catalog-view="artists"] .catalog-entity-accordion{gap:8px!important}
  body[data-catalog-view="albums"] .catalog-entity-card,
  body[data-catalog-view="artists"] .catalog-entity-card{padding:7px!important;border-radius:15px!important}
  body[data-catalog-view="albums"] .catalog-entity-copy strong,
  body[data-catalog-view="artists"] .catalog-entity-copy strong{font-size:11px!important}
}


/* =========================================================
   0.6.36.9.14 // NO-SIGNAL GLASS SHADE REFINE
   Base: 0.6.36.9.13 No-Signal + Boot Mic Composition Polish RC.
   Visual-only pass: give the missing-artwork tile a gentle premium glass body
   while preserving the lighter integrated look and existing boot mic polish.
   ========================================================= */

/* Missing-artwork player state: keep the open integrated composition, but
   restore just enough body so it reads as a deliberate PiXELBURGH glass tile. */
#art-frame.no-art{
  border-color:rgba(255,255,255,.075);
  background:
    linear-gradient(180deg,rgba(14,11,22,.46),rgba(7,6,12,.24)),
    radial-gradient(circle at 20% 18%,rgba(32,231,255,.08),transparent 38%),
    radial-gradient(circle at 82% 84%,rgba(255,53,218,.10),transparent 44%);
  box-shadow:
    0 24px 72px rgba(0,0,0,.22),
    0 0 46px rgba(255,53,218,.04),
    inset 0 1px 0 rgba(255,255,255,.055),
    inset 0 -18px 38px rgba(4,3,8,.18);
  backdrop-filter:blur(8px) saturate(112%);
  -webkit-backdrop-filter:blur(8px) saturate(112%);
}
#art-frame.no-art::before,
#art-frame.no-art::after{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  pointer-events:none;
}
#art-frame.no-art::before{
  background:
    linear-gradient(140deg,rgba(255,255,255,.06) 0,rgba(255,255,255,.018) 18%,transparent 34%,transparent 72%,rgba(32,231,255,.028) 100%);
  opacity:.95;
}
#art-frame.no-art::after{
  inset:1px;
  border:1px solid rgba(255,255,255,.04);
  border-radius:calc(24px - 1px);
  box-shadow:inset 0 0 0 1px rgba(32,231,255,.028);
}
#art-frame.no-art .art-placeholder{
  background:
    linear-gradient(180deg,rgba(13,10,20,.14),rgba(7,6,12,.05)),
    radial-gradient(circle at 50% 44%,rgba(255,53,218,.16) 0,rgba(111,36,139,.11) 28%,transparent 58%),
    radial-gradient(circle at 50% 50%,rgba(32,231,255,.075),transparent 68%);
}
#art-frame.no-art .art-placeholder::before{
  content:"";
  position:absolute;
  inset:10%;
  border:1px solid rgba(32,231,255,.16);
  border-radius:50%;
  box-shadow:
    0 0 0 8px rgba(7,8,14,.16),
    0 0 34px rgba(32,231,255,.05),
    inset 0 0 18px rgba(255,53,218,.04);
}
#art-frame.no-art .art-orbit{
  width:58%;
  border-color:rgba(32,231,255,.19);
  box-shadow:0 0 42px rgba(255,53,218,.11), inset 0 0 16px rgba(255,255,255,.018);
}
#art-frame.no-art .art-orbit::after{
  inset:13%;
  border-color:rgba(32,231,255,.16);
}
#art-frame.no-art .art-mark{
  font-size:clamp(74px,15vw,112px);
  color:rgba(255,255,255,.88);
  text-shadow:0 0 22px rgba(255,53,218,.34),0 0 44px rgba(32,231,255,.09);
}
#art-frame.no-art .art-copy{
  bottom:22px;
  color:rgba(255,255,255,.42);
  letter-spacing:.28em;
  text-shadow:0 0 12px rgba(0,0,0,.24);
}
@media(max-width:760px){
  #art-frame.no-art{
    width:min(76vw,340px)!important;
    border-radius:22px;
  }
  #art-frame.no-art::after{border-radius:calc(22px - 1px)}
}

/* Preserve the 0.6.36.9.13 startup / transition microphone composition polish. */
.signal-preboot-mics{
  transform:translate(calc(-50% + 10px),calc(-50% - 14px))!important;
  width:122%!important;
  height:122%!important;
  opacity:.70!important;
}
.signal-preboot-skull{z-index:2}

/* Manual Boot Director preview uses the same composition. */
.boot-director-overlay .bd-mics{
  display:block!important;
  transform:translate(10px,-14px)!important;
  width:min(690px,75vw)!important;
  opacity:.62!important;
}
.boot-director-overlay .bd-skull{z-index:2!important}

@media(max-width:760px){
  .signal-preboot-mics{
    transform:translate(calc(-50% + 8px),calc(-50% - 12px))!important;
    width:118%!important;
    height:118%!important;
  }
  .boot-director-overlay .bd-mics{
    transform:translate(8px,-12px)!important;
    width:88vw!important;
  }
}

/* =========================================================
   0.6.36.9.17 // DISCOVERY IDENTITY SHAPES + TRACK RELATIONSHIPS
   Identity objects are circular; media objects remain square.
   ========================================================= */
#browse-panel .browse-card[data-browse-artist],
#browse-panel .browse-card[data-browse-channel],
#browse-panel .browse-card[data-browse-operator]{
  border-color:transparent;
  background:transparent;
  padding:9px 7px 11px;
  text-align:center;
  box-shadow:none;
  overflow:visible;
  display:flex;
  flex-direction:column;
  align-items:center;
}
#browse-panel .browse-card[data-browse-artist]:hover,
#browse-panel .browse-card[data-browse-channel]:hover,
#browse-panel .browse-card[data-browse-operator]:hover,
#browse-panel .browse-card[data-browse-artist]:focus-visible,
#browse-panel .browse-card[data-browse-channel]:focus-visible,
#browse-panel .browse-card[data-browse-operator]:focus-visible{
  background:rgba(32,231,255,.028);
  border-color:transparent;
  transform:translateY(-2px);
  outline:none;
}
#browse-panel .browse-card[data-browse-artist]>.browse-card-art,
#browse-panel .browse-card[data-browse-channel]>.browse-card-art,
#browse-panel .browse-card[data-browse-operator]>.browse-card-art{
  width:min(100%,164px);
  aspect-ratio:1;
  margin:0 auto 12px;
  border-radius:50%;
  overflow:hidden;
  border:1px solid rgba(32,231,255,.28);
  box-shadow:0 0 0 6px rgba(4,8,14,.32),0 12px 30px rgba(0,0,0,.24),0 0 26px rgba(32,231,255,.07);
  background:radial-gradient(circle,rgba(32,231,255,.11),rgba(105,34,139,.12) 48%,rgba(0,0,0,.32));
}
#browse-panel .browse-card[data-browse-artist]>.browse-card-art img,
#browse-panel .browse-card[data-browse-channel]>.browse-card-art img,
#browse-panel .browse-card[data-browse-operator]>.browse-card-art img{
  width:100%;height:100%;object-fit:cover;border-radius:50%;
}
#browse-panel .browse-card[data-browse-artist]>strong,
#browse-panel .browse-card[data-browse-channel]>strong,
#browse-panel .browse-card[data-browse-operator]>strong,
#browse-panel .browse-card[data-browse-artist]>small,
#browse-panel .browse-card[data-browse-channel]>small,
#browse-panel .browse-card[data-browse-operator]>small{
  width:100%;text-align:center;
}
#browse-panel .browse-card[data-browse-artist]>strong,
#browse-panel .browse-card[data-browse-channel]>strong,
#browse-panel .browse-card[data-browse-operator]>strong{font-size:13px;margin-bottom:5px}

/* Media objects deliberately remain square artwork cards. */
#browse-panel .browse-card[data-browse-album]>.browse-card-art,
#browse-panel .browse-card[data-browse-track-open]>.browse-card-art{
  width:100%;aspect-ratio:1;border-radius:11px;
}

/* Relationship-rich track bylines may be longer than the old primary-artist line. */
.browse-track-copy small,.track-copy>span,.playlist-edit-copy small,.playlist-add-row small{
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}

@media(max-width:620px){
  #browse-panel .browse-card[data-browse-artist]>.browse-card-art,
  #browse-panel .browse-card[data-browse-channel]>.browse-card-art,
  #browse-panel .browse-card[data-browse-operator]>.browse-card-art{
    width:min(126px,36vw);
  }
}

/* 0.6.36.9.18 // Track Channel Inclusion Editor */
.operator-channel-inclusion-editor{display:grid;gap:8px;padding:2px 0 4px}
.operator-channel-inclusion-editor>small{color:rgba(255,255,255,.35);font:600 7px/1.45 Consolas,monospace;letter-spacing:.035em}
.operator-channel-inclusion-editor .operator-featured-chip{cursor:default}
.operator-channel-inclusion-editor .operator-featured-chip b{font-size:9px;letter-spacing:.02em;color:#fff}
.operator-channel-inclusion-editor .operator-featured-chip small{font:700 7px/1 Consolas,monospace;letter-spacing:.06em;color:rgba(50,224,255,.58)}
.operator-channel-inclusion-editor .operator-featured-chip button{display:grid;place-items:center;width:20px;height:20px;margin-left:2px;padding:0;border:0;border-radius:999px;background:rgba(255,255,255,.055);color:rgba(255,255,255,.6);font:700 14px/1 Arial,sans-serif;cursor:pointer}
.operator-channel-inclusion-editor .operator-featured-chip button:hover{background:rgba(255,49,221,.12);color:#fff}
.operator-channel-inclusion-editor .operator-empty-chip{display:inline-flex;align-items:center;min-height:28px;padding:0 9px;border:1px dashed rgba(255,255,255,.09);border-radius:999px;color:rgba(255,255,255,.28);font:750 7px/1 Consolas,monospace;letter-spacing:.1em}
@media(max-width:760px){.operator-channel-inclusion-editor .operator-featured-chip{max-width:100%}.operator-channel-inclusion-editor .operator-featured-chip b,.operator-channel-inclusion-editor .operator-featured-chip small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}}

/* =========================================================
   0.6.36.9.20 // SPLASH/TRANSITION SOLID MARK + CHANNEL IMAGE PARITY
   Scope guard: the main Receiver stage keeps skull.png + microphones.png.
   ========================================================= */
.signal-preboot-mark--solid{display:grid;place-items:center}
.signal-preboot-solid{display:block;width:min(520px,74vw);max-height:58vh;object-fit:contain;filter:drop-shadow(0 0 34px rgba(255,45,220,.18));opacity:.84}
.boot-director-overlay .bd-mark--solid{display:grid!important;place-items:center}
.boot-director-overlay .bd-solid{position:relative;display:block;width:min(590px,68vw);max-height:62vh;object-fit:contain;filter:drop-shadow(0 0 34px rgba(255,45,220,.18));opacity:.82}
#operator-channel-avatar-preview,#operator-channel-banner-preview{display:block;object-fit:cover;object-position:center}
#operator-channel-avatar-preview.empty,#operator-channel-banner-preview.empty{display:none}
@media(max-width:760px){.signal-preboot-solid{width:84vw;max-height:54vh}.boot-director-overlay .bd-solid{width:82vw;max-height:58vh}}


/* 0.6.36.9.21 // identity deletion + Boot Director solid-mark centering */
#operator-panel .operator-actions .operator-danger{border-color:rgba(255,73,145,.24);color:#ff8fbd;background:rgba(255,53,128,.035)}
#operator-panel .operator-actions .operator-danger:hover:not(:disabled){border-color:rgba(255,73,145,.48);color:#ffd0e2;background:rgba(255,53,128,.08)}
#operator-panel .operator-actions .operator-danger:disabled{opacity:.34;cursor:not-allowed}
.boot-director-overlay .bd-mark--solid{position:absolute!important;inset:0!important;display:grid!important;place-items:center!important;padding:0!important;transform:none!important}
.boot-director-overlay .bd-mark--solid .bd-solid{position:absolute!important;left:50%!important;top:50%!important;right:auto!important;bottom:auto!important;margin:0!important;transform:translate(-50%,-50%)!important;justify-self:auto!important;align-self:auto!important}


/* 0.6.36.9.22 // startup solid-mark viewport centering */
.signal-preboot-center{transform:none!important}
.signal-preboot-mark--solid{
  position:fixed!important;inset:0!important;width:100vw!important;height:100vh!important;aspect-ratio:auto!important;
  display:grid!important;place-items:center!important;margin:0!important;transform:none!important;
}
.signal-preboot-mark--solid .signal-preboot-solid{
  position:absolute!important;left:50%!important;top:51%!important;right:auto!important;bottom:auto!important;
  margin:0!important;transform:translate(-50%,-50%)!important;
}
.boot-director-overlay .bd-mark--solid .bd-solid{top:51%!important}

/* 0.6.36.9.24 — shared app-wide publication pipeline status */
.publication-progress-panel{position:fixed;right:max(14px,env(safe-area-inset-right));bottom:max(14px,env(safe-area-inset-bottom));z-index:30200;width:min(440px,calc(100vw - 28px));max-height:min(72vh,680px);overflow:auto;padding:14px;border:1px solid rgba(32,231,255,.28);border-radius:14px;background:rgba(5,4,11,.97);box-shadow:0 24px 70px rgba(0,0,0,.58);color:#fff;font-family:ui-monospace,SFMono-Regular,Consolas,monospace}.publication-progress-panel[hidden]{display:none!important}.publication-progress-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.publication-progress-title-wrap{min-width:0}.publication-progress-kicker{display:block;margin-bottom:5px;color:rgba(32,231,255,.82);font-size:9px;font-weight:900;letter-spacing:.16em}.publication-progress-title{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13px;letter-spacing:.04em}.publication-progress-close{flex:0 0 auto;width:36px;height:36px;padding:0;border:1px solid rgba(255,255,255,.18);border-radius:9px;background:rgba(255,255,255,.035);color:#fff;font:700 22px/1 sans-serif;cursor:pointer}.publication-progress-close:disabled{opacity:.34;cursor:default}.publication-progress-summary{display:flex;align-items:center;gap:9px;margin:12px 0 8px;min-width:0}.publication-progress-state{flex:0 0 auto;padding:5px 7px;border:1px solid rgba(32,231,255,.25);border-radius:7px;color:#20e7ff;font-size:9px;font-weight:900;letter-spacing:.12em}.publication-progress-state[data-state="complete"]{border-color:rgba(57,255,121,.34);color:#39ff79}.publication-progress-state[data-state="error"]{border-color:rgba(255,80,112,.48);color:#ff5070}.publication-progress-detail{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:rgba(255,255,255,.75);font-size:10px}.publication-progress-bar{height:7px;overflow:hidden;border:1px solid rgba(255,255,255,.1);border-radius:999px;background:rgba(255,255,255,.045)}.publication-progress-bar>span{display:block;height:100%;width:2%;border-radius:inherit;background:linear-gradient(90deg,#20e7ff,#8b5cff);transition:width .18s ease}.publication-progress-steps{display:grid;gap:6px;margin:12px 0 0;padding:0;list-style:none}.publication-progress-steps li{display:grid;grid-template-columns:24px minmax(0,1fr);align-items:start;gap:8px;padding:7px 8px;border:1px solid rgba(255,255,255,.07);border-radius:9px;background:rgba(255,255,255,.018);opacity:.58}.publication-progress-steps li[data-state="active"]{border-color:rgba(32,231,255,.27);background:rgba(32,231,255,.045);opacity:1}.publication-progress-steps li[data-state="done"]{opacity:.82}.publication-progress-steps li[data-state="error"]{border-color:rgba(255,80,112,.4);background:rgba(255,80,112,.045);opacity:1}.publication-step-marker{display:grid;place-items:center;width:22px;height:22px;border:1px solid rgba(255,255,255,.14);border-radius:50%;font-size:10px;font-weight:900}.publication-progress-steps li[data-state="active"] .publication-step-marker{border-color:rgba(32,231,255,.55);color:#20e7ff}.publication-progress-steps li[data-state="done"] .publication-step-marker{border-color:rgba(57,255,121,.42);color:#39ff79}.publication-progress-steps li[data-state="error"] .publication-step-marker{border-color:rgba(255,80,112,.62);color:#ff5070}.publication-step-copy{min-width:0}.publication-step-copy strong{display:block;font-size:10px;line-height:1.3;letter-spacing:.05em}.publication-step-copy small{display:block;margin-top:3px;color:rgba(255,255,255,.58);font-size:9px;line-height:1.35;overflow-wrap:anywhere}.publication-progress-error{margin-top:10px;padding:9px 10px;border:1px solid rgba(255,80,112,.38);border-radius:9px;background:rgba(255,80,112,.055);color:#ff8ba0;font-size:10px;line-height:1.45;overflow-wrap:anywhere}@media(max-width:700px){.publication-progress-panel{left:12px;right:12px;bottom:max(12px,env(safe-area-inset-bottom));width:auto;max-height:62vh}.publication-progress-title{white-space:normal}.publication-progress-detail{white-space:normal}}@media(prefers-reduced-motion:reduce){.publication-progress-bar>span{transition:none}}
.publication-progress-state[data-state="warning"]{border-color:rgba(255,196,76,.48);color:#ffc44c}.publication-progress-steps li[data-state="warning"]{border-color:rgba(255,196,76,.38);background:rgba(255,196,76,.045);opacity:1}.publication-progress-steps li[data-state="warning"] .publication-step-marker{border-color:rgba(255,196,76,.58);color:#ffc44c}


/* 0.6.36.9.28 // Creator fast-boot stage telemetry */
.signal-preboot-loader{position:fixed;left:50%;bottom:max(72px,calc(env(safe-area-inset-bottom) + 54px));z-index:8;transform:translateX(-50%);width:min(560px,calc(100vw - 36px));padding:12px 14px;border:1px solid rgba(32,231,255,.18);border-radius:12px;background:rgba(3,3,9,.68);backdrop-filter:blur(10px);box-shadow:0 14px 44px rgba(0,0,0,.28);font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}
.signal-preboot-loader[hidden]{display:none!important}.signal-preboot-loader-head{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:10px;font-weight:800;letter-spacing:.14em;color:rgba(255,255,255,.88)}.signal-preboot-loader-head b{color:var(--cyan);font-size:10px}.signal-preboot-loader-track{height:5px;margin-top:9px;border-radius:999px;overflow:hidden;background:rgba(255,255,255,.08);box-shadow:inset 0 0 0 1px rgba(255,255,255,.04)}.signal-preboot-loader-track span{display:block;width:0;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--magenta),var(--violet),var(--cyan));box-shadow:0 0 16px rgba(32,231,255,.38);transition:width .22s ease}.signal-preboot-loader-detail{margin-top:8px;min-height:1.2em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:9px;letter-spacing:.08em;color:rgba(255,255,255,.58)}
@media(max-width:760px){.signal-preboot-loader{bottom:max(64px,calc(env(safe-area-inset-bottom) + 48px));width:calc(100vw - 28px);padding:10px 12px}.signal-preboot-loader-detail{font-size:8px}}


/* 0.6.36.9.32 // PHONE THERMAL/BATTERY GOVERNOR
   Persistent decorative motion pauses unless music is actively playing, and
   pauses while catalog/operator workspaces cover the stage. */
body:not([data-signal-playing="true"]) .splash-vortex,
body:not([data-signal-playing="true"]) .splash-halo,
body:not([data-signal-playing="true"]) .art-orbit:after,
body[data-browse="on"] .splash-vortex,
body[data-browse="on"] .splash-halo,
body[data-operator="on"] .splash-vortex,
body[data-operator="on"] .splash-halo{
  animation-play-state:paused!important;
}
@media (pointer:coarse){
  .splash-vortex{animation-duration:16s}
  .splash-halo{animation-duration:96s}
}

/* 0.6.36.9.33 // AMBIENT MOTION RESTORE
   Keep the visible SiGNAL background alive at all times. The decorative portal
   uses compositor-only transforms and is paused only when the document itself
   is hidden. Expensive canvas/audio-reactive work remains governed by 9.32. */
.splash-vortex,
.splash-halo,
.art-orbit:after{
  animation-play-state:running!important;
  will-change:transform;
  backface-visibility:hidden;
  transform:translateZ(0);
}
body[data-signal-hidden="true"] .splash-vortex,
body[data-signal-hidden="true"] .splash-halo,
body[data-signal-hidden="true"] .art-orbit:after{
  animation-play-state:paused!important;
}
@media (pointer:coarse){
  .splash-vortex{animation-duration:9s}
  .splash-halo{animation-duration:68s}
}

/* 0.6.36.9.33 // TRACK TITLE RECONCILIATION */
.operator-title-reconcile-tool{margin-top:12px;padding-top:12px;border-top:1px solid rgba(255,255,255,.08)}
.operator-title-reconcile-head{display:flex;align-items:center;justify-content:space-between;gap:12px}
.operator-title-reconcile-head>div{min-width:0}.operator-title-reconcile-head b{display:block;font-size:10px;letter-spacing:.08em}.operator-title-reconcile-head small{display:block;margin-top:3px;color:rgba(255,255,255,.55);font-size:9px;line-height:1.35}
.operator-title-reconcile-summary{margin:12px 0 8px;padding:8px 9px;border:1px solid rgba(32,231,255,.18);border-radius:8px;background:rgba(32,231,255,.035);font-size:9px;letter-spacing:.06em;color:rgba(255,255,255,.72)}
.operator-title-reconcile-list{display:grid;gap:6px;max-height:360px;overflow:auto;padding-right:2px}
.operator-title-reconcile-row{display:grid;grid-template-columns:auto minmax(0,1fr);gap:9px;align-items:start;padding:9px;border:1px solid rgba(255,255,255,.08);border-radius:9px;background:rgba(255,255,255,.018);cursor:pointer}
.operator-title-reconcile-row input{margin-top:2px}.operator-title-reconcile-row span{min-width:0}.operator-title-reconcile-row strong,.operator-title-reconcile-row b,.operator-title-reconcile-row small,.operator-title-reconcile-row em{display:block;overflow-wrap:anywhere}.operator-title-reconcile-row strong{font-size:10px;color:rgba(255,255,255,.66);font-weight:650}.operator-title-reconcile-row b{margin-top:3px;font-size:11px;color:var(--cyan);font-weight:800}.operator-title-reconcile-row small{margin-top:4px;font-size:8px;color:rgba(255,255,255,.46);line-height:1.35}.operator-title-reconcile-row em{margin-top:5px;font-size:8px;font-style:normal;color:#ffc44c;letter-spacing:.05em}.operator-title-reconcile-empty{padding:12px;border:1px dashed rgba(255,255,255,.1);border-radius:9px;color:rgba(255,255,255,.55);font-size:9px;text-align:center}
@media(max-width:700px){.operator-title-reconcile-head{align-items:flex-start;flex-direction:column}.operator-title-reconcile-head button{width:100%}.operator-title-reconcile-list{max-height:300px}}


/* 0.6.36.9.34 // DEFINITIVE AMBIENT PORTAL MOTION
   9.33 only changed animation-play-state, which cannot revive the older
   prefers-reduced-motion `animation:none!important` rule. Restore the actual
   compositor animations whenever the document is visible. Screen-off/hidden
   remains the only automatic pause condition. */
.splash-vortex{
  animation-name:vortexSpin!important;
  animation-timing-function:linear!important;
  animation-iteration-count:infinite!important;
  animation-duration:9s!important;
  animation-play-state:running!important;
  will-change:transform;
  backface-visibility:hidden;
}
.splash-halo{
  animation-name:haloSpin!important;
  animation-timing-function:linear!important;
  animation-iteration-count:infinite!important;
  animation-duration:68s!important;
  animation-play-state:running!important;
  will-change:transform;
  backface-visibility:hidden;
}
.art-orbit:after{
  animation-name:haloSpin!important;
  animation-timing-function:linear!important;
  animation-iteration-count:infinite!important;
  animation-duration:24s!important;
  animation-play-state:running!important;
}
body[data-signal-hidden="true"] .splash-vortex,
body[data-signal-hidden="true"] .splash-halo,
body[data-signal-hidden="true"] .art-orbit:after{
  animation-play-state:paused!important;
}
@media (pointer:fine){
  .splash-vortex{animation-duration:7s!important}
  .splash-halo{animation-duration:58s!important}
  .art-orbit:after{animation-duration:18s!important}
}

/* 0.6.36.9.35 // ALWAYS-VISIBLE AMBIENT ROTATION — COMPATIBILITY PATH
   Use the standard transform animation property rather than the newer individual
   `rotate` property. This keeps the vortex/halo visibly moving in Android Chrome,
   costs no JS/rAF/FFT work, and pauses only while the document/screen is hidden. */
@keyframes signalAmbientVortexSpin{
  from{transform:translate3d(0,0,0) rotate(0deg)}
  to{transform:translate3d(0,0,0) rotate(360deg)}
}
@keyframes signalAmbientHaloSpin{
  from{transform:translate3d(0,0,0) rotate(0deg)}
  to{transform:translate3d(0,0,0) rotate(360deg)}
}
.splash-vortex{
  animation:signalAmbientVortexSpin 12s linear infinite!important;
  transform-origin:50% 50%!important;
  will-change:transform;
  backface-visibility:hidden;
}
.splash-halo{
  animation:signalAmbientHaloSpin 72s linear infinite!important;
  transform-origin:50% 50%!important;
  will-change:transform;
  backface-visibility:hidden;
}
.art-orbit:after{
  animation:signalAmbientHaloSpin 28s linear infinite!important;
  transform-origin:50% 50%!important;
  will-change:transform;
}
body[data-signal-hidden="true"] .splash-vortex,
body[data-signal-hidden="true"] .splash-halo,
body[data-signal-hidden="true"] .art-orbit:after{
  animation-play-state:paused!important;
}
@media(pointer:fine){
  .splash-vortex{animation-duration:9s!important}
  .splash-halo{animation-duration:64s!important}
  .art-orbit:after{animation-duration:22s!important}
}

/* 0.6.36.9.36 // CANONICAL SOURCE-BINDING REVIEW */
.operator-source-binding-tool{margin-top:14px;padding-top:14px;border-top:1px solid rgba(255,255,255,.08)}
.operator-source-binding-head{display:flex;align-items:center;justify-content:space-between;gap:12px}
.operator-source-binding-head>div{min-width:0}.operator-source-binding-head b{display:block;font-size:10px;letter-spacing:.08em}.operator-source-binding-head small{display:block;margin-top:3px;color:rgba(255,255,255,.55);font-size:9px;line-height:1.35}
.operator-source-binding-summary{margin:12px 0 8px;padding:8px 9px;border:1px solid rgba(32,231,255,.18);border-radius:8px;background:rgba(32,231,255,.035);font-size:9px;letter-spacing:.06em;color:rgba(255,255,255,.72)}
.operator-source-binding-list{display:grid;gap:7px;max-height:420px;overflow:auto;padding-right:2px}
.operator-source-binding-row{display:grid;gap:8px;padding:9px;border:1px solid rgba(255,255,255,.08);border-radius:9px;background:rgba(255,255,255,.018)}
.operator-source-binding-check{display:grid;grid-template-columns:auto minmax(0,1fr);gap:9px;align-items:start;cursor:pointer}.operator-source-binding-check input{margin-top:2px}.operator-source-binding-check strong,.operator-source-binding-check small{display:block;overflow-wrap:anywhere}.operator-source-binding-check strong{font-size:10px;color:rgba(255,255,255,.78);font-weight:750}.operator-source-binding-check small{margin-top:3px;font-size:8px;color:rgba(255,255,255,.46);line-height:1.35}
.operator-source-binding-row select{width:100%;min-height:34px;border:1px solid rgba(32,231,255,.16);border-radius:7px;background:rgba(0,0,0,.28);color:rgba(255,255,255,.78);font-size:9px;padding:6px 8px}
.operator-source-binding-row select:disabled{opacity:.55}
@media(max-width:700px){.operator-source-binding-head{align-items:flex-start;flex-direction:column}.operator-source-binding-head button{width:100%}.operator-source-binding-list{max-height:340px}}

/* 0.6.36.9.38 // VORTEX + HALO CONTINUOUS BASE SPIN REGRESSION GUARD
   The image children own the ambient rotation while Visual Lab/audio response
   continues to transform the parent wrappers. Playback, Browse and Operator
   state must never cancel the base spin. Only a hidden document pauses it. */
.splash-vortex,
body[data-signal-playing="true"] .splash-vortex,
body:not([data-signal-playing="true"]) .splash-vortex,
body[data-browse="on"] .splash-vortex,
body[data-operator="on"] .splash-vortex{
  animation:signalAmbientVortexSpin 12s linear infinite!important;
  animation-play-state:running!important;
  transform-origin:50% 50%!important;
  will-change:transform;
  backface-visibility:hidden;
}
.splash-halo,
body[data-signal-playing="true"] .splash-halo,
body:not([data-signal-playing="true"]) .splash-halo,
body[data-browse="on"] .splash-halo,
body[data-operator="on"] .splash-halo{
  animation:signalAmbientHaloSpin 72s linear infinite!important;
  animation-play-state:running!important;
  transform-origin:50% 50%!important;
  will-change:transform;
  backface-visibility:hidden;
}
body[data-signal-hidden="true"] .splash-vortex,
body[data-signal-hidden="true"] .splash-halo{
  animation-play-state:paused!important;
}
@media(pointer:fine){
  .splash-vortex{animation-duration:9s!important}
  .splash-halo{animation-duration:64s!important}
}


/* 0.6.36.9.44 // Laptop unified runtime health. Hidden in WordPress/public mode. */
.signal-runtime-status{border:1px solid rgba(94,246,255,.28);background:#0b1015;color:#9df8ff;border-radius:999px;padding:7px 10px;font:700 10px/1 system-ui,sans-serif;letter-spacing:.08em;white-space:nowrap;cursor:default}.signal-runtime-status[data-state=ready]{border-color:rgba(106,255,168,.42);color:#8fffb6}.signal-runtime-status[data-state=attention]{border-color:rgba(255,177,74,.45);color:#ffc072}@media(max-width:860px){.signal-runtime-status{display:none!important}}


/* =========================================================
   0.6.36.9.44.2 // SOURCE PROVENANCE + INLINE PERFORMANCE QOL
   ========================================================= */
/* Persistent Performance is a screen-awake control, not a CPU/GPU boost. */
.persistent-performance-toggle{
  appearance:none;position:fixed;z-index:9700;right:10px;bottom:max(76px,calc(env(safe-area-inset-bottom) + 76px));
  width:42px;height:42px;min-width:42px;min-height:42px;padding:0;
  display:grid;place-items:center;border:1px solid rgba(32,231,255,.22);border-radius:999px;
  background:radial-gradient(circle at 34% 28%,rgba(32,231,255,.10),rgba(255,53,218,.055) 56%,rgba(4,2,10,.90));
  color:rgba(255,255,255,.68);font:850 7px/1 ui-monospace,Consolas,monospace;letter-spacing:.07em;
  cursor:pointer;box-shadow:0 0 18px rgba(32,231,255,.035);
}
.persistent-performance-toggle:hover,.persistent-performance-toggle:focus-visible{
  color:#fff;border-color:rgba(32,231,255,.48);outline:none;box-shadow:0 0 0 3px rgba(32,231,255,.055),0 0 22px rgba(32,231,255,.10);
}
.persistent-performance-toggle.active,
body[data-performance-keep-awake="on"] .persistent-performance-toggle{
  color:var(--cyan);border-color:rgba(32,231,255,.58);background:rgba(32,231,255,.075);box-shadow:0 0 18px rgba(32,231,255,.16);
}

/* Entity hero art follows album-art geometry. Operator pages intentionally
   retain their existing rectangular identity banner. */
body[data-browse-entity="on"][data-entity-type="track"] .browse-entity-banner,
body[data-browse-entity="on"][data-entity-type="album"] .browse-entity-banner,
body[data-browse-entity="on"][data-entity-type="artist"] .browse-entity-banner,
body[data-browse-entity="on"][data-entity-type="channel"] .browse-entity-banner{
  width:min(100%,clamp(260px,42vw,620px));
  aspect-ratio:1/1;
  min-height:0!important;
  margin-inline:auto;
}

@media(max-width:760px){
  /* DISPLAY belongs before Tracks/queue on the mobile Player/Performance
     surface. Existing collapse behavior remains unchanged. */
  .secondary-controls{order:45!important}
  #library-panel{order:50!important}

  body[data-browse-entity="on"][data-entity-type="track"] .browse-entity-banner,
  body[data-browse-entity="on"][data-entity-type="album"] .browse-entity-banner,
  body[data-browse-entity="on"][data-entity-type="artist"] .browse-entity-banner,
  body[data-browse-entity="on"][data-entity-type="channel"] .browse-entity-banner{
    width:min(100%,520px);
  }
}
/* 0.6.36.9.45 — Performance Theme scene runtime */
#scene-stage{transition:opacity .18s ease,filter .24s ease,transform .28s ease}
#scene-stage.scene-theme-transition{opacity:.12;filter:blur(5px) brightness(1.22);transform:scale(1.012)}
#scene-stage[data-theme-transition="glitchmas"].scene-theme-transition{filter:blur(4px) brightness(1.65) saturate(1.25)}
#scene-stage[data-theme-transition="kids"].scene-theme-transition{filter:blur(7px) brightness(1.35) saturate(.9)}

[data-theme-hidden="true"]{display:none!important}

body[data-performance-theme="kids"] #splash-backdrop{
  background:linear-gradient(180deg,#9ec8ff 0%,#d5b9ef 46%,#f6cadb 100%);
}
body[data-performance-theme="kids"] .splash-bg{
  inset:-2%;width:104%;height:104%;
  object-fit:cover;object-position:center center;
  filter:saturate(calc(.92 + var(--signal-level)*.12)) contrast(.96) brightness(calc(.92 + var(--signal-level)*.10));
  transform:translate3d(calc(var(--gx)*-2px),calc(var(--gy)*-2px),-30px) scale(1.035);
}
body[data-performance-theme="kids"] .splash-vignette{
  background:
    radial-gradient(ellipse at 50% 46%,transparent 0 58%,rgba(88,76,140,.08) 78%,rgba(23,30,65,.30) 100%),
    linear-gradient(to bottom,rgba(255,255,255,.04),transparent 22%,transparent 80%,rgba(30,35,78,.18));
}
body[data-performance-theme="kids"] #visualizer-canvas{
  mix-blend-mode:screen;
  opacity:.88;
}

body[data-performance-theme="glitchmas"] .splash-halo{
  mix-blend-mode:normal;
  filter:saturate(1.08) brightness(calc(.76 + var(--signal-level)*.52));
}
body[data-performance-theme="glitchmas"] .splash-skull{
  mix-blend-mode:normal;
  filter:saturate(1.05) brightness(calc(.68 + var(--signal-level)*.42));
}
body[data-performance-theme="glitchmas"] .splash-vignette{
  background:
    radial-gradient(ellipse at 50% 44%,transparent 0 44%,rgba(0,20,8,.10) 66%,rgba(0,0,0,.78) 100%),
    linear-gradient(to bottom,rgba(35,0,0,.22),transparent 18%,transparent 76%,rgba(0,24,7,.55));
}

@media (max-aspect-ratio: 4/5){
  body[data-performance-theme="kids"] .splash-bg{
    object-fit:contain;
    inset:0;width:100%;height:100%;
    transform:translate3d(calc(var(--gx)*-2px),calc(var(--gy)*-2px),-30px) scale(1.01);
  }
}

/* 0.6.36.9.46 // Track Performance production refinement */
.operator-orchestration-custom{gap:8px}
.operator-field-hint{display:block;margin-top:5px;color:rgba(255,255,255,.42);font:600 7px/1.45 ui-monospace,Consolas,monospace;letter-spacing:.035em}
#operator-orchestration-visualizer-row[hidden]{display:none!important}
.operator-visual-editor-button{margin-top:2px!important;border-color:rgba(32,231,255,.3)!important;background:rgba(32,231,255,.06)!important;color:var(--cyan)!important}
.operator-performance-advanced{margin-top:2px;border:1px solid rgba(255,255,255,.07);border-radius:9px;background:rgba(255,255,255,.015);overflow:hidden}
.operator-performance-advanced>summary{cursor:pointer;list-style:none;padding:10px;color:rgba(255,255,255,.58);font:800 7px/1 ui-monospace,Consolas,monospace;letter-spacing:.09em}
.operator-performance-advanced>summary::-webkit-details-marker{display:none}
.operator-performance-advanced>summary::after{content:" +";color:var(--cyan)}
.operator-performance-advanced[open]>summary::after{content:" −"}
.operator-performance-advanced-grid{display:grid;gap:3px;padding:0 8px 8px}
@media(max-width:700px){.operator-orchestration-custom{gap:6px}.operator-field-hint{font-size:6.5px}.operator-performance-advanced-grid .operator-inline{grid-template-columns:1fr}}


/* 0.6.36.9.47 // Production stabilization: normalized stage + full-screen mobile Visual Editor */
:root{--pb-visual-vh:100dvh;--pb-stage-aspect:0.5625}
#visual-stage{height:var(--pb-visual-vh);min-height:var(--pb-visual-vh);max-height:var(--pb-visual-vh)}
.splash-scene{width:min(108vw,calc(var(--pb-visual-vh)*.6075));height:min(108vw,calc(var(--pb-visual-vh)*.6075))}
.vl-draft-status{padding:8px 10px;border:1px solid rgba(32,231,255,.12);border-radius:9px;background:rgba(32,231,255,.025);font:800 7px/1.3 ui-monospace,monospace;letter-spacing:.1em;color:rgba(32,231,255,.65)}
.vl-draft-status.is-dirty{border-color:rgba(255,190,72,.35);color:#ffd889;background:rgba(255,190,72,.045)}
.vl-draft-actions{display:grid;grid-template-columns:1fr 1fr 1fr;gap:7px;margin:8px 0 10px}.vl-draft-actions button{min-height:38px}
body[data-visual-editor-authorized="off"] #visual-lab-launch{display:none!important}
@media(max-width:860px){
  body[data-visual-lab="on"]{overflow:hidden!important}
  body[data-visual-lab="on"] #visual-lab{position:fixed!important;inset:0!important;top:0!important;left:0!important;right:0!important;bottom:0!important;width:100vw!important;height:var(--pb-visual-vh)!important;z-index:520!important;padding:0!important;background:#05030a!important}
  body[data-visual-lab="on"] #visual-lab-panel{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;max-height:none!important;border-radius:0!important;border:0!important;padding:0 12px calc(18px + env(safe-area-inset-bottom))!important;overflow:auto!important;background:rgba(6,4,12,.995)!important}
  body[data-visual-lab="on"] #visual-lab-panel>.vl-head{top:0!important;margin:0 -12px 6px!important;padding:max(12px,env(safe-area-inset-top)) 12px 12px!important;background:#07050d!important}
  body[data-visual-lab="on"] .vl-tabs{position:sticky!important;top:72px!important;z-index:11!important;background:#07050d!important;padding:6px 0 10px!important}
  body[data-visual-lab="on"] .vl-tabs button{min-height:44px!important;font-size:10px!important}
  body[data-visual-lab="on"] #visual-stage{opacity:.28!important;pointer-events:none!important}
  .vl-draft-actions{grid-template-columns:1fr}.vl-draft-actions button{min-height:44px}
}


/* 0.6.36.9.48 // Track-attached Visual Editor precursor to Timeline V1 */
.vl-head-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.vl-size-toggle{display:flex;gap:4px;padding:3px;border:1px solid rgba(255,255,255,.08);border-radius:9px;background:rgba(0,0,0,.24)}
.vl-size-toggle button{min-height:30px!important;padding:7px 9px!important;font-size:7px!important;border-radius:7px!important}
.vl-size-toggle button.active{border-color:rgba(32,231,255,.48)!important;color:#bff7ff!important;background:rgba(32,231,255,.09)!important}
#vl-track-scene-id{color:rgba(255,255,255,.38)!important;font-size:7px!important}
.vl-draft-actions{grid-template-columns:minmax(0,1.25fr) minmax(0,1fr)!important}
@media(max-width:860px){
 body[data-visual-lab="on"]{overflow:hidden!important}
 body[data-visual-lab="on"] #visual-stage{opacity:1!important;pointer-events:auto!important}
 body[data-visual-lab="on"] #visual-lab{position:fixed!important;left:8px!important;right:8px!important;bottom:max(8px,env(safe-area-inset-bottom))!important;top:auto!important;width:auto!important;height:auto!important;inset:auto 8px max(8px,env(safe-area-inset-bottom)) 8px!important;z-index:520!important;padding:0!important;background:transparent!important;pointer-events:none!important;align-items:stretch!important}
 body[data-visual-lab="on"] #visual-lab-panel{position:relative!important;inset:auto!important;width:100%!important;height:auto!important;max-height:52vh!important;border:1px solid rgba(255,255,255,.08)!important;border-radius:18px!important;padding:0 12px 14px!important;overflow:auto!important;background:rgba(6,4,12,.88)!important;box-shadow:0 -16px 48px rgba(0,0,0,.46)!important;pointer-events:auto!important}
 body[data-visual-editor-size="edit"] #visual-lab-panel{max-height:82vh!important;background:rgba(6,4,12,.96)!important}
 body[data-visual-lab="on"] #visual-lab-panel>.vl-head{position:sticky!important;top:0!important;margin:0 -12px 6px!important;padding:10px 12px 11px!important;background:rgba(7,5,13,.94)!important}
 body[data-visual-lab="on"] #visual-lab-panel>.vl-tabs{position:sticky!important;top:66px!important;margin-left:-12px!important;margin-right:-12px!important;padding:6px 12px 10px!important;background:rgba(7,5,13,.92)!important}
 .vl-head-actions{max-width:54%}.vl-size-toggle{width:100%;justify-content:flex-end}.vl-size-toggle button{flex:1}
 .vl-draft-actions{grid-template-columns:1fr 1fr!important}.vl-draft-actions button{min-height:44px!important}
}

/* 0.6.36.9.48.2 // one canonical custom-scene-layer geometry rule.
   Anchor + fit are applied by Visual Editor runtime; CSS no longer supplies a conflicting origin. */
.vl-custom-scene-layer{position:absolute;left:0;top:0;width:min(62vw,900px);height:auto;max-width:none;max-height:none;pointer-events:none;object-fit:contain;transform-origin:50% 50%;will-change:translate,scale,rotate,opacity}
.vl-layer-row small{white-space:nowrap}
\n\n/* =========================================================\n   0.6.36.9.48.4.5 // PUBLIC GATEWAY STATUS\n   Retains 48.4.4 background hydration while the splash reports\n   progress and explicit ready/failure states.\n   ========================================================= */\n.signal-preboot-loader{transition:border-color .18s ease,background .18s ease,box-shadow .18s ease}\n.signal-preboot-retry{display:inline-flex;align-items:center;justify-content:center;min-height:34px;margin-top:10px;padding:0 13px;border:1px solid rgba(32,231,255,.34);border-radius:999px;background:rgba(32,231,255,.055);color:#bdfaff;font:800 8px/1 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;letter-spacing:.12em;cursor:pointer}\n.signal-preboot-retry[hidden]{display:none!important}\n.signal-preboot-retry:hover,.signal-preboot-retry:focus-visible{outline:none;border-color:rgba(255,53,218,.58);color:#fff;box-shadow:0 0 0 3px rgba(255,53,218,.055),0 0 20px rgba(32,231,255,.10)}\n.signal-preboot-cover[data-gateway-state="ready"] .signal-preboot-loader{border-color:rgba(80,255,191,.28);box-shadow:0 14px 44px rgba(0,0,0,.28),0 0 24px rgba(80,255,191,.08)}\n.signal-preboot-cover[data-gateway-state="ready"] .signal-preboot-loader-head b,.signal-preboot-cover[data-gateway-state="ready"] .signal-preboot-status b{color:#78ffc2}\n.signal-preboot-cover[data-gateway-state="error"] .signal-preboot-loader{border-color:rgba(255,78,151,.44);background:rgba(20,3,14,.78);box-shadow:0 14px 44px rgba(0,0,0,.34),0 0 30px rgba(255,53,218,.10)}\n.signal-preboot-cover[data-gateway-state="error"] .signal-preboot-loader-track span{background:linear-gradient(90deg,#ff356d,#ff35da,#8e63ff)}\n.signal-preboot-cover[data-gateway-state="error"] .signal-preboot-loader-head b,.signal-preboot-cover[data-gateway-state="error"] .signal-preboot-status b{color:#ff88c8}\n.signal-preboot-cover[data-gateway-state="error"] .signal-preboot-copy span{color:rgba(255,136,200,.72)}\n@media(max-width:760px){.signal-preboot-loader-detail{white-space:normal;line-height:1.35}.signal-preboot-retry{width:100%;min-height:38px}}\n
/* =========================================================
   0.6.36.9.48.4.7 // SCENE EDITOR PRODUCTION REFINEMENT
   Layer stack, crop ergonomics and duration-based animation authoring.
   ========================================================= */
.vl-scene-toolbar{grid-template-columns:repeat(3,minmax(0,1fr))!important}
.vl-layer-name-editor{display:grid;grid-template-columns:86px minmax(0,1fr);gap:10px;align-items:center;margin:9px 0 10px;padding:9px 10px;border:1px solid rgba(255,255,255,.07);border-radius:10px;background:rgba(0,0,0,.14)}
.vl-layer-name-editor span{color:rgba(255,255,255,.38);font:800 7px/1 ui-monospace,Consolas,monospace;letter-spacing:.1em}
.vl-layer-name-editor input{min-width:0;width:100%;border:1px solid rgba(255,255,255,.10);border-radius:8px;background:rgba(0,0,0,.25);color:#fff;padding:8px 9px;font:700 9px/1 ui-monospace,Consolas,monospace;outline:none}
.vl-layer-name-editor input:focus{border-color:rgba(32,231,255,.4);box-shadow:0 0 0 2px rgba(32,231,255,.04)}
.vl-layer-row-actions .vl-layer-nudge{display:inline-flex;align-items:center;justify-content:center;width:27px;height:27px;padding:0;border:1px solid rgba(255,255,255,.08);border-radius:7px;background:rgba(255,255,255,.025);color:rgba(255,255,255,.55);font:900 11px/1 ui-monospace,Consolas,monospace;cursor:pointer}
.vl-layer-row-actions .vl-layer-nudge:hover{border-color:rgba(32,231,255,.3);color:#bff7ff}
.vl-layer-row-actions .vl-layer-nudge:disabled{opacity:.22;cursor:default}
.vl-crop-controls{grid-template-columns:1fr!important;gap:0!important;margin:5px 12px 9px!important}
.vl-crop-controls .vl-control{grid-template-columns:78px minmax(190px,1fr) 48px!important;margin:10px 0!important}
.vl-crop-controls .vl-control input[type="range"]{min-width:180px}
.vl-animation-toolbar{display:grid;grid-template-columns:minmax(0,1fr) auto auto auto;gap:7px;align-items:center;margin:10px 12px 0;padding:9px 10px;border:1px solid rgba(32,231,255,.10);border-radius:10px;background:rgba(32,231,255,.025)}
.vl-animation-toolbar strong,.vl-animation-toolbar small{display:block}.vl-animation-toolbar strong{color:rgba(255,255,255,.72);font:800 7px/1 ui-monospace,Consolas,monospace;letter-spacing:.10em}.vl-animation-toolbar small{margin-top:4px;color:rgba(32,231,255,.56);font:800 6px/1 ui-monospace,Consolas,monospace;letter-spacing:.12em}
.vl-animation-toolbar button{min-height:30px;padding:7px 9px;border:1px solid rgba(255,255,255,.08);border-radius:7px;background:rgba(255,255,255,.025);color:rgba(255,255,255,.55);font:800 7px/1 ui-monospace,Consolas,monospace;letter-spacing:.06em;cursor:pointer}
.vl-animation-toolbar button.active{border-color:rgba(219,55,255,.35);background:rgba(219,55,255,.08);color:#fff}
.vl-behavior-fields .vl-behavior-range{display:grid;grid-template-columns:76px minmax(90px,1fr) 48px;gap:7px;align-items:center}
.vl-behavior-fields .vl-behavior-range span{color:rgba(255,255,255,.38);font-size:6px}.vl-behavior-fields .vl-behavior-range output{text-align:right;color:rgba(255,255,255,.75);font:800 7px/1 ui-monospace,Consolas,monospace}
.vl-behavior-fields .vl-behavior-range input[type=range]{min-width:0;width:100%}
.vl-layer-section>.vl-animation-toolbar{margin-left:12px;margin-right:12px}
@media(max-width:620px){
  .vl-scene-toolbar{grid-template-columns:1fr!important}
  .vl-crop-controls .vl-control{grid-template-columns:72px minmax(120px,1fr) 42px!important}
  .vl-crop-controls .vl-control input[type="range"]{min-width:110px}
  .vl-animation-toolbar{grid-template-columns:1fr 1fr 1fr}.vl-animation-toolbar>div{grid-column:1/-1}
  .vl-layer-name-editor{grid-template-columns:1fr}.vl-layer-row{grid-template-columns:minmax(0,1fr)}.vl-layer-row-actions{justify-content:flex-start}
}


/* =========================================================
   0.6.36.9.48.4.8 // UNIFIED SCENE COMPOSITOR + PERFORMANCE LIBRARY
   One stacking model for creator and foundational Platform Scenes.
========================================================= */
#splash-backdrop{
  perspective:none!important;
}
.splash-scene{
  left:0!important;
  top:0!important;
  right:0!important;
  bottom:0!important;
  inset:0!important;
  margin:auto!important;
  transform:none!important;
  transform-style:flat!important;
  z-index:auto!important;
  isolation:auto!important;
}
/* Layer order is controlled exclusively by Scene State V3 z/order. Remove
   historical translateZ depth so legacy assets participate in the same flat
   compositor as generic Image objects. */
.splash-bg{
  transform:translate(calc(var(--gx)*-4px*var(--vl-parallax,1)),calc(var(--gy)*-4px*var(--vl-parallax,1))) scale(1.08)!important;
}
.splash-vortex-wrap{
  transform:translate(calc(var(--gx)*-7px*var(--vl-parallax,1)),calc(var(--gy)*-7px*var(--vl-parallax,1))) scale(calc(1 + var(--signal-bass)*.035*var(--vl-audio-response,1)))!important;
}
.splash-halo-wrap{
  transform:translate(calc(var(--gx)*-7px*var(--vl-parallax,1)),calc(var(--gy)*-7px*var(--vl-parallax,1))) scale(calc(1 + var(--signal-bass)*.05*var(--vl-audio-response,1)))!important;
}
.splash-skull-wrap{
  transform:translate(calc(var(--gx)*16px*var(--vl-parallax,1)),calc(var(--gy)*16px*var(--vl-parallax,1)))!important;
}
.splash-mics{
  transform:translate(calc(-50% + var(--gx)*22px*var(--vl-parallax,1)),calc(-50% + var(--gy)*22px*var(--vl-parallax,1)))!important;
}
.splash-fx{
  transform:translate(calc(var(--gx)*26px*var(--vl-parallax,1)),calc(var(--gy)*26px*var(--vl-parallax,1))) scale(1.06)!important;
}
.splash-vignette{z-index:10000!important}
.vl-custom-scene-layer{position:absolute!important}
.vl-layer-row{grid-template-columns:auto minmax(0,1fr) auto!important}
.vl-layer-drag{display:flex;align-items:center;justify-content:center;width:20px;color:rgba(255,255,255,.30);cursor:grab;font:900 12px/1 ui-monospace,Consolas,monospace;user-select:none}
.vl-layer-row.dragging{opacity:.45}
.vl-layer-row.drag-over{border-color:rgba(32,231,255,.65)!important;box-shadow:inset 0 0 0 1px rgba(32,231,255,.18)}
.vl-crop-controls{grid-template-columns:1fr!important}

.settings-performance-library{display:grid;gap:14px;margin:16px 0 24px}
.settings-performance-intro{margin:0!important}
.settings-performance-library-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.settings-performance-library-grid>section{min-width:0;border:1px solid rgba(255,255,255,.07);border-radius:12px;background:rgba(0,0,0,.18);padding:12px}
.settings-performance-library-grid>section>header{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px}
.settings-performance-library-grid>section>header div{display:grid;gap:4px}
.settings-performance-library-grid>section>header b{font:800 10px/1 ui-monospace,Consolas,monospace;letter-spacing:.1em}
.settings-performance-library-grid>section>header small{color:rgba(255,255,255,.35);font:700 7px/1 ui-monospace,Consolas,monospace;letter-spacing:.08em}
.settings-performance-library-grid button,.settings-visual-library-actions button{min-height:32px;padding:0 9px;border:1px solid rgba(65,226,255,.2);border-radius:7px;background:rgba(65,226,255,.04);color:#fff;font:800 7px/1 ui-monospace,Consolas,monospace;letter-spacing:.06em}
.settings-performance-library-grid button.primary{border-color:rgba(57,255,121,.42);background:rgba(57,255,121,.08)}
.settings-visual-library-list{display:grid;gap:7px}
.settings-visual-library-item{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:center;padding:10px;border:1px solid rgba(255,255,255,.06);border-radius:9px;background:rgba(255,255,255,.015)}
.settings-visual-library-item>div:first-child{min-width:0;display:grid;gap:4px}
.settings-visual-library-item b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:9px}
.settings-visual-library-item small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:rgba(255,255,255,.3);font:700 6px/1 ui-monospace,Consolas,monospace;letter-spacing:.05em}
.settings-visual-library-actions{display:flex;gap:4px;flex-wrap:wrap;justify-content:flex-end}
.settings-visual-library-empty{padding:14px;border:1px dashed rgba(255,255,255,.08);border-radius:9px;color:rgba(255,255,255,.28);font:800 7px/1 ui-monospace,Consolas,monospace;letter-spacing:.08em;text-align:center}
.settings-performance-platform-divider{display:flex;align-items:center;gap:12px;margin:28px 0 12px;color:rgba(95,214,255,.65);font:800 8px/1 ui-monospace,Consolas,monospace;letter-spacing:.12em}
.settings-performance-platform-divider:before,.settings-performance-platform-divider:after{content:"";height:1px;flex:1;background:rgba(95,214,255,.14)}
@media(max-width:760px){
  .settings-performance-library-grid{grid-template-columns:1fr}
  .settings-visual-library-item{grid-template-columns:1fr}
  .settings-visual-library-actions{justify-content:flex-start}
}