/* Approved Connected Worlds mark; retain each workspace's existing theme. */
.cosmodeck-symbol{display:block;width:36px;height:36px;object-fit:contain;flex:none}
.desktop-bar .identity img.cosmodeck-wordmark{display:block;width:154px;height:34px;object-fit:contain}
@media(min-width:761px) and (max-width:1450px){.desktop-bar .identity img.cosmodeck-wordmark{width:128px}}
@media(max-width:760px){.desktop-bar .identity img.cosmodeck-wordmark{content:url('/static/cosmodeck-symbol.svg');width:28px;height:28px}.cosmodeck-symbol{width:30px;height:30px}}

/* Opt-in logo palette. Removing the selection restores the original desk theme. */
:root:is([data-accent=cosmodeck],[data-theme=cosmodeck]){
  color-scheme:dark;
  --cosmo-cyan:#38e7f3;--cosmo-blue:#35b8f5;--cosmo-indigo:#5867ff;--cosmo-violet:#7948ff;--cosmo-pink:#e58cfa;
  --cosmo-spectrum:linear-gradient(105deg,var(--cosmo-cyan),var(--cosmo-blue) 28%,var(--cosmo-indigo) 52%,var(--cosmo-violet) 72%,var(--cosmo-pink));
  --bg:#111111;--desktop:#111111;--scene:#141414;--surface:#1b1b1b;--panel:#1b1b1b;--panel2:#242424;
  --raised:#292929;--hover:#333333;--line:#3b3b3b;--border:#3b3b3b;
  --text:#f3f3f3;--ink:#f3f3f3;--muted:#bcbcbc;--dim:#bcbcbc;
  --accent:var(--cosmo-cyan);--studio-accent:var(--cosmo-cyan);--accent-hover:#91f4fc;
  --theme-accent:var(--cosmo-cyan);--theme-accent-muted:#9cdce1;--theme-accent-hover:#91f4fc;--theme-accent-wash:#38e7f314;--theme-accent-border:#38e7f366;--theme-accent-ink:#151515;
  --accent-ink:#151515;--accent-wash:#38e7f319;--amber:var(--cosmo-cyan);--gold:var(--cosmo-cyan);--focus:var(--cosmo-pink);
  --input:#161616;--float:#222222f5;--drawer:#1b1b1b;--tab:#222222;--placeholder:#aaaaaa;
  --grid-major:#494949;--grid-minor:#292929;
  --glass-panel:rgba(20,20,20,var(--studio-glass,.7))!important;
}
:root[data-accent=cosmodeck] :is(.window-bar,.window-content,.sidebar,.hub-sidebar,.hub-header,.library-pack-sidebar,.library-controls,.library-toolbar,.library-detail-drawer,.forge-panel,.forge-toolbar,.forge-inspector,.os-start){background-color:var(--panel)!important;border-color:var(--line)!important}
:root[data-accent=cosmodeck] :is(.card,.panel,.tile,.asset-card,.library-card,.message,.decision,.workflow-editor,.note-row,.quota-provider,.usage-strip,.history-tools,.file-preview,.pairing-box,.connection-panel){background-color:var(--surface)!important;border-color:var(--line)!important}
:root[data-accent=cosmodeck] :is(.message.user,.note-row.active,.day.selected){background-color:#292929!important}
:root[data-accent=cosmodeck] :is(.os-start-button b,.team-welcome-mark,.os-start-grid svg,.os-desktop-icons svg){color:var(--cosmo-cyan)!important}
:root:is([data-accent=cosmodeck],[data-theme=cosmodeck]) :is(input,textarea,select){background-color:var(--input)!important;border-color:var(--line);color:var(--text)}
:root:is([data-accent=cosmodeck],[data-theme=cosmodeck]) select option{background:var(--panel);color:var(--text)}
:root:is([data-accent=cosmodeck],[data-theme=cosmodeck]) :is(.primary,.cw-primary){background:linear-gradient(110deg,var(--cosmo-cyan),var(--cosmo-blue))!important;color:var(--accent-ink)!important}
:root:is([data-accent=cosmodeck],[data-theme=cosmodeck]) :is(button,a,input,textarea,select):focus-visible{outline:2px solid var(--cosmo-pink)!important;outline-offset:3px}
:root:is([data-accent=cosmodeck],[data-theme=cosmodeck]) :is(input[type=range],input[type=checkbox]){accent-color:var(--cosmo-cyan)}
:root:is([data-accent=cosmodeck],[data-theme=cosmodeck]) :is(.desktop-bar,.masthead,.top){border-bottom-color:#7948ff70}
:root[data-accent=cosmodeck] .dock button.active{background:#7948ff24;box-shadow:inset 0 -2px var(--cosmo-pink)}
:root[data-accent=cosmodeck] .settings-tabs{border-bottom:2px solid transparent;border-image:var(--cosmo-spectrum) 1}
:root[data-accent=cosmodeck] .settings-tabs a{color:var(--cosmo-cyan)}
:root[data-accent=cosmodeck] #settings-appearance .preference-row:has(select[name=accent])>span::after{content:"";display:block;width:80px;height:4px;margin-top:8px;border-radius:2px;background:var(--cosmo-spectrum)}
:root[data-accent=cosmodeck] body:is(.embedded,.embed){background:var(--bg)!important}

/* Retained standalone desks have their own accent tokens and selected-state rules.
   Pin their CosmoDeck surfaces to charcoal so the logo palette stays in controls,
   borders and status highlights rather than turning whole panels blue. */
:root[data-accent=cosmodeck] nav button[aria-current=page]{background:#242424!important;background-color:#242424!important;background-image:none!important;color:var(--cosmo-cyan)!important;border-left:2px solid var(--cosmo-cyan)}
html[data-accent="cosmodeck"] body nav button[aria-current="page"]{background-color:#242424!important;background-image:none!important;color:#38e7f3!important}
:root[data-accent=cosmodeck] .forge-shell button.active{background:#242424!important;color:var(--cosmo-cyan)!important;border-color:#38e7f366!important}
:root[data-accent=cosmodeck] .forge-shell .forge-commandbar,
:root[data-accent=cosmodeck] .forge-shell .forge-statusbar{background:#171717!important}

/* AAA review 17 Oct: inside a CosmoDeck window (theme-sync.js marks html.studio-framed) the window bar already shows the
   app's icon and name, so the repeated COSMODECK eyebrow and brand symbol above an app's title are dropped. Standalone pages keep them. */
html.studio-framed :is(.masthead .identity,.bld-identity)>.cosmodeck-symbol,
html.studio-framed :is(.masthead .identity .eyebrow,.bld-identity .bld-eyebrow,#production>header.top>div:first-child>.eyebrow){display:none}