/* Shared semantic colours for the admin workspace. First visits stay light. */
html[data-admin-theme="dark"] {
  --admin-surface: #111b29; --admin-text: #e6edf7; --admin-muted: #a8b7cc;
  --admin-icon: #93acce; --admin-border: #314259; --admin-subtle: #172537;
  --admin-hover: #20324a; --admin-selected: #213b5d; --admin-accent: #99beff;
  --admin-success: #89dfab; --admin-success-bg: #183d2e;
  --admin-warning: #f4c28e; --admin-warning-bg: #3d3020; --admin-warning-border: #816c42;
  --admin-danger: #ffaaa4; --admin-danger-bg: #442a31;
  --admin-scrim: #020812a6; --admin-shadow: #0008;
  color: var(--admin-text); background: var(--admin-surface); color-scheme: dark;
}
.admin-theme-toggle, #app .admin-theme-toggle {
  display: inline-flex; align-items: center; justify-content: center; gap: 7px;
  padding: 8px 10px; min-height: 38px; min-width: 38px; flex-shrink: 0;
  border: 1px solid var(--admin-border, #dfe5ed); border-radius: 6px;
  color: var(--admin-muted, #53637a); background: var(--admin-surface, #fff);
  font: inherit; font-size: 11px; cursor: pointer;
}
.admin-theme-toggle svg { width: 18px; height: 18px; }
.admin-theme-toggle .theme-sun { display: none; }
[data-admin-theme="dark"] .admin-theme-toggle .theme-moon { display: none; }
[data-admin-theme="dark"] .admin-theme-toggle .theme-sun { display: inline; }
#admin-login-theme-toggle { position: absolute; top: 24px; left: 24px; width: auto; margin: 0; }
html[data-admin-theme="dark"] .admin-workspace :is(.primary,.admin-login-submit),
html[data-admin-theme="dark"] #app :is(.primary,.admin-login-submit) { background: #285dde; color: #fff; border-color: #285dde; }
html[data-admin-theme="dark"] .admin-workspace :is(.quiet,.icon,.section-link) { color: var(--admin-muted); background: var(--admin-subtle); border-color: var(--admin-border); }
html[data-admin-theme="dark"] .admin-workspace :is(.admin-login-side,#login-form,.customer-toolbar,.instance,.empty,.release-card,.release-dropdown,.ticket-stats,.governance-card,.account-card,.users-table-wrap,.privacy-access,.storage-quota-card,.node-bootstrap-card) { background: var(--admin-surface); color: var(--admin-text); border-color: var(--admin-border); }
html[data-admin-theme="dark"] .admin-workspace :is(.panel,.panel-head,.release-list,.service-card,.events,.event,.event-row,.configuration-grid,.users-table,.resource-preview span,.hostname span,.instance-links,.pricing-card) { background-color: var(--admin-surface); color: var(--admin-text); border-color: var(--admin-border); }
html[data-admin-theme="dark"] .admin-workspace :is(label,legend,dialog,td,th,h1,h2,h3,h4,.detail-facts strong,.resource-preview strong,.internal-backup-status strong) { color: var(--admin-text); }
html[data-admin-theme="dark"] .admin-workspace :is(p,small,.muted,.hint,.panel-hint,.privacy-meta,.tk-ticket-facts,.internal-backup-status,.internal-backup-note,.admin-back-home,.admin-login-copyright) { color: var(--admin-muted); }
html[data-admin-theme="dark"] .admin-workspace :is(table,thead,tbody,tr,td,th,fieldset,hr,details,summary) { border-color: var(--admin-border); }
html[data-admin-theme="dark"] .admin-workspace :is(thead,th) { background: var(--admin-subtle); }
html[data-admin-theme="dark"] .admin-workspace :is(input,select,textarea) { color: var(--admin-text); background: var(--admin-surface); border-color: var(--admin-border); color-scheme: dark; }
html[data-admin-theme="dark"] .admin-workspace input::placeholder,
html[data-admin-theme="dark"] .admin-workspace textarea::placeholder { color: #93a3ba; opacity: 1; }
html[data-admin-theme="dark"] .admin-workspace a { color: var(--admin-accent); }
html[data-admin-theme="dark"] .admin-workspace .cloud-brand img { background: #dbe7f8; border-radius: 5px; padding: 2px; }
html[data-admin-theme="dark"] .admin-workspace :is(.badge,.ticket-status,.backup-badge,.privacy-state,.status) { color: var(--admin-muted); background: var(--admin-subtle); }
html[data-admin-theme="dark"] .admin-workspace :is(.is-success,.is-compliant,.ticket-status.resolved,.ticket-status[data-status="resolved"],.privacy-state[data-state="implemented"]) { color: var(--admin-success); background: var(--admin-success-bg); }
html[data-admin-theme="dark"] .admin-workspace :is(output,.error,.privacy-error,.tk-error) { color: var(--admin-danger); }
html[data-admin-theme="dark"] .admin-workspace .chart-grid { stroke: var(--admin-border); }
html[data-admin-theme="dark"] .admin-workspace :is(.vm-metric-card,.vm-power-state,.admin-login-assurance,.login-capabilities>span) { background: var(--admin-subtle); color: var(--admin-muted); border-color: var(--admin-border); }
html[data-admin-theme="dark"] .admin-workspace .tk-internal-hint { color: var(--admin-warning); background: var(--admin-warning-bg); }
@media(max-width:1100px) { #app .admin-theme-toggle span { display: none; } }
@media(max-width:760px) { #app .admin-theme-toggle { display: inline-flex; } }
/* Keep the added theme control reachable alongside long mobile breadcrumbs. */
@media(max-width:760px) {
  #app .admin-breadcrumb { flex: 1; overflow: hidden; }
  #app .admin-breadcrumb strong { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
  #app .admin-breadcrumb .admin-menu, #app .header-actions { flex-shrink: 0; }
  #app .header-actions { gap: 6px; }
}
/* Legacy modules still declare literal colours. Keep their roles consistent in both themes. */
html[data-admin-theme="light"] {
  --admin-surface: #fff; --admin-text: #29374b; --admin-muted: #53637a;
  --admin-subtle: #f7f9fc; --admin-selected: #edf3ff; --admin-accent: #285dde;
  --admin-warning: #79531d; --admin-warning-bg: #fff7e8;
  --admin-danger: #a4322d; --admin-danger-bg: #ffebe8;
  --admin-success: #286142; --admin-success-bg: #edf7f0;
  color-scheme: light; background: #fff;
}
html[data-admin-theme] body.admin-workspace #app .admin-content :is(h1,h2,h3,h4,strong,dt,dd),
html[data-admin-theme] .admin-workspace dialog :is(h2,h3,strong) { color: var(--admin-text); }
html[data-admin-theme] body.admin-workspace #app .admin-content :is(p,small,time,label,.chart-scale,.chart-times,.chart-legend,.admin-footer,.ticket-row-main>span,.ticket-owner,.ticket-sort-field,.vm-network-values,.vm-network-scale,.vm-network-times,.vm-network-note,.gauge>span,.install-progress-head>span,.release-version),
html[data-admin-theme] .admin-workspace dialog :is(p,small,label,.hostname>span,.create-resource-grid label>span),
html[data-admin-theme] #app :is(.admin-breadcrumb>span,.admin-breadcrumb>i,#live-updated,#count,#monitor-checked,.detail-head>div>small,.detail-tabs button,.detail-sidebar-nav button,.customer-product-nav button,.security-controls i,.integration-state,.users-role-grid article>span) { color: var(--admin-muted); }
html[data-admin-theme] #app .vm-power-hint { color: var(--admin-muted) !important; }
html[data-admin-theme] #app .privacy-panel output { color: var(--admin-muted) !important; }
html[data-admin-theme] #app :is(#monitoring-live-state,#release-count,.status,.internal-backup-state,.tk-status,.admin-role-badge,.admin-user-state,.release-default,.release-module-summary>span,.security-controls i) { background: var(--admin-subtle); color: var(--admin-muted); border-color: var(--admin-border); }
html[data-admin-theme] body.admin-workspace #app .admin-content :is(.ticket-sla.is-late,.status.failed,.status.delete_failed) { color: var(--admin-danger); }
html[data-admin-theme] body.admin-workspace #app .admin-content :is(.tk-internal-hint,.tk-note-label,.tk-note>small) { color: var(--admin-warning); background-color: var(--admin-warning-bg); }
html[data-admin-theme] body.admin-workspace #app .admin-content :is(.desk-ticket-management summary>span,#ticket-list-context) { color: var(--admin-muted); }
html[data-admin-theme] .admin-workspace .create-resource-grid strong { color: var(--admin-text); background: var(--admin-selected); }
html[data-admin-theme] .admin-workspace :is(.admin-login-story .cloud-brand small,.admin-eyebrow,.admin-back-home,.admin-login-assurance,.admin-login-copyright,#login-form>p,#login-form>small,#login-form>label) { color: var(--admin-muted); }
html[data-admin-theme] .admin-workspace #login-form h2 { color: var(--admin-text); }
html[data-admin-theme] .admin-workspace .admin-theme-toggle span { color: inherit; }
html[data-admin-theme="dark"] body.admin-workspace #app .admin-content :is(.instance,.customer-select-card,.customer-toolbar label,.vm-network-chart,.monitor-row>article,.release-modules,.audit-toolbar,.ticket-toolbar,.desk-ticket-management,.users-role-grid article,.users-intro,.privacy-document-card,.privacy-automation) { background: var(--admin-surface); color: var(--admin-text); border-color: var(--admin-border); }
html[data-admin-theme="dark"] #app :is(.customer-card-icon,.customer-card-facts>span,.customer-card-actions button,.server-symbol,.monitor-symbol,.integration-icon,.install-progress-track,.governance-policy>article>span,.vm-power-buttons button,.vm-power-heading button,.admin-user-avatar,.users-role-description) { background: var(--admin-subtle); color: var(--admin-accent); border-color: var(--admin-border); }
html[data-admin-theme="dark"] body.admin-workspace #app .admin-content :is(.detail-facts strong,.vm-power-heading strong,.vm-network-values strong,.ticket-row-main strong,.detail-welcome h2,.gauge span) { color: var(--admin-text); }
html[data-admin-theme="dark"] #app :is(#ticket-inbox-button,#ticket-new-alert-title,.customer-product-nav button.is-active) { background: var(--admin-selected); color: var(--admin-accent); border-color: var(--admin-border); }
html[data-admin-theme="dark"] #app :is(#detail-status,.status[data-status],.privacy-check>span,.tk-status,.release-default,.release-module-summary>span) { background: var(--admin-subtle); color: var(--admin-muted); }
html[data-admin-theme="dark"] #app .privacy-check[data-state="implemented"]>span,
html[data-admin-theme="dark"] #app .privacy-check[data-state="verified"]>span { background: var(--admin-success-bg); color: var(--admin-success); }
html[data-admin-theme="dark"] #app .privacy-check[data-state="action"]>span { background: var(--admin-warning-bg); color: var(--admin-warning); }
html[data-admin-theme="dark"] body.admin-workspace #app .admin-content :is(.status.failed,.status.delete_failed,.internal-backup-state) { background: var(--admin-danger-bg); color: var(--admin-danger); }
html[data-admin-theme="dark"] .admin-workspace :is(.create-resource-grid>label,.fixed-ip>div) { background: var(--admin-subtle); border-color: var(--admin-border); }
html[data-admin-theme="dark"] .admin-workspace #login { background: var(--admin-surface); }
html[data-admin-theme="dark"] .admin-workspace #login-form :is(input,#password) { background: var(--admin-surface); color: var(--admin-text); border-color: var(--admin-border); }
html[data-admin-theme="dark"] .admin-workspace :is(input,select,textarea) { color-scheme: dark !important; }
html[data-admin-theme="dark"] #app .vm-network-grid { stroke: var(--admin-border); }
html[data-admin-theme] #app :is(.install-progress span,.customer-sidebar nav button,.vm-network-heading span,.node-bootstrap-card span,.admin-user-main>span,.release-dropdown>summary,.release-modules legend) { color: var(--admin-muted); }
html[data-admin-theme] #app #detail-status { color: var(--admin-muted); background: var(--admin-subtle); }
html[data-admin-theme="dark"] #app :is(.section-toolbar label,.customer-products .instance,.customer-card-meta>span,.instance button,.service-monitoring article,.governance-policy article>span,.release-modules input:checked+span) { background: var(--admin-subtle); border-color: var(--admin-border); color: var(--admin-text); }
html[data-admin-theme="dark"] #app .customer-sidebar nav button.is-active { color: var(--admin-accent); }
html[data-admin-theme="dark"] #app .usage-gauge span { color: var(--admin-text); }
/* The legacy alert button deliberately uses !important for its badge skin. */
html[data-admin-theme="dark"] #app #ticket-inbox-button { background: var(--admin-selected) !important; color: var(--admin-accent) !important; border-color: var(--admin-border) !important; }
html[data-admin-theme] .admin-workspace #admin-login-theme-toggle { color: var(--admin-muted); background: var(--admin-surface); }
html[data-admin-theme] body.admin-workspace #app .profile article>span { color: var(--admin-muted); }
html[data-admin-theme="dark"] #app .customer-products .customer-select-card { background: var(--admin-surface) !important; }
html[data-admin-theme="dark"] #app .customer-products .customer-select-card:hover { background: var(--admin-hover) !important; }
html[data-admin-theme="dark"] #app .audit-toolbar label { background: var(--admin-surface); border-color: var(--admin-border); }
html[data-admin-theme] .admin-workspace .admin-login-side { flex-direction: column; gap: 16px; }
html[data-admin-theme] #app :is(.status[data-state="ready"],#detail-status.is-online,.tk-resolved) { background: var(--admin-success-bg); color: var(--admin-success); }
html[data-admin-theme] #app :is(.status[data-state="failed"],.status[data-state="delete_failed"],#detail-status.is-error) { background: var(--admin-danger-bg); color: var(--admin-danger); }
html[data-admin-theme] #app :is(.status[data-state="draft"],.status[data-state="installing"],.tk-waiting) { background: var(--admin-warning-bg); color: var(--admin-warning); }
html[data-admin-theme="dark"] body.admin-workspace #app .admin-content .instance .error { color: var(--admin-danger) !important; }
html[data-admin-theme="dark"] .admin-workspace dialog .users-role-description { background: var(--admin-subtle); color: var(--admin-muted); }
html[data-admin-theme] .admin-workspace #user-password-hint { color: var(--admin-muted); }
html[data-admin-theme="dark"] #app .tk-shortcuts button { background: var(--admin-subtle); color: var(--admin-accent); border-color: var(--admin-border); }
html[data-admin-theme="light"] .admin-workspace input::placeholder,
html[data-admin-theme="light"] .admin-workspace textarea::placeholder { color: #5f6e82; opacity: 1; }
/* AI feedback: pair legacy card/status backgrounds with their semantic text colours. */
html[data-admin-theme] #app #overview-feedback .feedback-flow>article { background: var(--admin-subtle); color: var(--admin-text); border-color: var(--admin-border, #dfe5ed); }
html[data-admin-theme] #app #overview-feedback .feedback-flow>article.is-ready { background: var(--admin-selected); }
html[data-admin-theme] #app #overview-feedback .feedback-flow>article>span { background: var(--admin-surface); color: var(--admin-muted); }
html[data-admin-theme] #app #overview-feedback .feedback-flow>article.is-ready>span { background: var(--admin-selected); color: var(--admin-accent); }
html[data-admin-theme] #app #overview-feedback .feedback-flow>i { background: var(--admin-border, #dfe5ed); }
html[data-admin-theme] #app #overview-feedback .feedback-flow strong { color: var(--admin-text); }
html[data-admin-theme] #app #overview-feedback :is(.feedback-flow small,.feedback-issue>div>span,.dashboard-empty>span,#feedback-updated) { color: var(--admin-muted); }
html[data-admin-theme] #app #overview-feedback .feedback-notice { background: var(--admin-warning-bg); color: var(--admin-warning); border-color: var(--admin-warning-border, #d9be91); }
html[data-admin-theme] #app #overview-feedback .feedback-notice.is-success { background: var(--admin-success-bg); color: var(--admin-success); border-color: var(--admin-success); }
html[data-admin-theme] #app #overview-feedback .feedback-notice.is-error { background: var(--admin-danger-bg); color: var(--admin-danger); border-color: var(--admin-danger); }
html[data-admin-theme] #app #overview-feedback .feedback-notice :is(strong,span,a) { color: inherit; }
html[data-admin-theme] #app #overview-feedback .feedback-notice a { text-decoration: underline; text-underline-offset: 3px; }
html[data-admin-theme] #app #overview-feedback .feedback-issue { border-color: var(--admin-border, #dfe5ed); }
html[data-admin-theme] #app #overview-feedback .feedback-issue-state { background: var(--admin-subtle); color: var(--admin-muted); }
html[data-admin-theme] #app #overview-feedback .feedback-issue-state.is-analyzing { background: var(--admin-selected); color: var(--admin-accent); }
html[data-admin-theme] #app #overview-feedback .feedback-issue-state.is-needs_review { background: var(--admin-warning-bg); color: var(--admin-warning); }
html[data-admin-theme] #app #overview-feedback :is(.feedback-issue-state.is-patch_ready,.feedback-issue-state.is-closed) { background: var(--admin-success-bg); color: var(--admin-success); }
html[data-admin-theme] #app #overview-feedback .feedback-issue-actions :is(a,button) { background: var(--admin-selected); color: var(--admin-accent); border-color: var(--admin-border, #dfe5ed); }

/* Accounts: legacy service-ui surfaces must use the same palette as their text.
   Scope both roots explicitly: service-* is also used by unrelated support UI. */
html[data-admin-theme] body.admin-workspace :is(#overview-accounts,#assign-product-dialog) {
  --accounts-line: var(--admin-border, #dfe5ed);
  --accounts-control-line: #8491a3;
  --accounts-hover: var(--admin-hover, #eef2f7);
  --accounts-action: #285dde;
  color: var(--admin-text);
}
html[data-admin-theme="dark"] body.admin-workspace :is(#overview-accounts,#assign-product-dialog) { --accounts-control-line: #687d96; }
html[data-admin-theme] body.admin-workspace #app #overview-accounts :is(.service-panel,.service-list-item,.service-product,.service-empty) {
  background: var(--admin-surface); color: var(--admin-text); border-color: var(--accounts-line);
}
html[data-admin-theme] body.admin-workspace #app #overview-accounts :is(.service-panel-heading,.service-account-meta,.service-section-title) { color: var(--admin-muted); border-color: var(--accounts-line); }
html[data-admin-theme] body.admin-workspace #app #overview-accounts :is(.service-banner,.service-roadmap) { background: var(--admin-subtle); color: var(--admin-text); border-color: var(--accounts-line); }
html[data-admin-theme] body.admin-workspace #app #overview-accounts :is(.service-banner-symbol,.service-avatar,.service-pill) { background: var(--admin-selected); color: var(--admin-accent); border-color: var(--accounts-line); }
html[data-admin-theme] body.admin-workspace #app #overview-accounts .service-pill.is-muted { background: var(--admin-subtle); color: var(--admin-muted); }
html[data-admin-theme] body.admin-workspace #app #overview-accounts :is(h2,h3,strong) { color: var(--admin-text); }
html[data-admin-theme] body.admin-workspace #app #overview-accounts :is(p,small,label,.service-account-meta,.service-section-title>span) { color: var(--admin-muted); }
html[data-admin-theme] body.admin-workspace #app #overview-accounts :is(.service-product-kind,.service-list-item svg) { color: var(--admin-accent); }
html[data-admin-theme] body.admin-workspace #app #overview-accounts .service-list-item:hover { background: var(--accounts-hover); }
html[data-admin-theme] body.admin-workspace #app #overview-accounts .service-list-item.is-selected { background: var(--admin-selected); box-shadow: inset 3px 0 var(--admin-accent); }
html[data-admin-theme] body.admin-workspace #assign-product-dialog { background: var(--admin-surface); color: var(--admin-text); border-color: var(--accounts-line); }
html[data-admin-theme] body.admin-workspace #assign-product-dialog::backdrop { background: var(--admin-scrim, #0d193db3); }
html[data-admin-theme] body.admin-workspace #assign-product-dialog .service-panel-heading { border-color: var(--accounts-line); }
html[data-admin-theme] body.admin-workspace #assign-product-dialog :is(h2,strong) { color: var(--admin-text); }
html[data-admin-theme] body.admin-workspace #assign-product-dialog :is(p,small,label) { color: var(--admin-muted); }
html[data-admin-theme] body.admin-workspace #app #overview-accounts :is(input,select,textarea),
html[data-admin-theme] body.admin-workspace #assign-product-dialog :is(input,select,textarea) { background: var(--admin-surface); color: var(--admin-text); border-color: var(--accounts-control-line); }
html[data-admin-theme] body.admin-workspace :is(#overview-accounts,#assign-product-dialog) input::placeholder { color: var(--admin-muted); opacity: 1; }
html[data-admin-theme] body.admin-workspace :is(#overview-accounts,#assign-product-dialog) .quiet { background: var(--admin-subtle); color: var(--admin-text); border-color: var(--accounts-control-line); }
html[data-admin-theme] body.admin-workspace :is(#overview-accounts,#assign-product-dialog) .quiet:hover { background: var(--accounts-hover); }
html[data-admin-theme] body.admin-workspace :is(#overview-accounts,#assign-product-dialog) .primary { background: var(--accounts-action); color: #fff; border-color: var(--accounts-action); }
html[data-admin-theme] body.admin-workspace :is(#overview-accounts,#assign-product-dialog) .primary:hover { background: #204fbd; border-color: #204fbd; }
html[data-admin-theme] body.admin-workspace :is(#overview-accounts,#assign-product-dialog) :is(.service-error,output) { color: var(--admin-danger); }
html[data-admin-theme] body.admin-workspace :is(#overview-accounts,#assign-product-dialog) :is(button,input,select):focus-visible { outline: 3px solid var(--admin-accent); outline-offset: 3px; }

/* Complete admin surface audit: legacy detail panels and native dialogs.
   Keep semantic state colours and real charts; never invert images or VM screens. */
html[data-admin-theme="light"] { --admin-border: #dfe5ed; --admin-hover: #eef2f7; }
html[data-admin-theme="dark"] body.admin-workspace #app :is(.configuration-grid>article,.restart-grid>article,.security-card,.customer-release-form,.detail-facts>article,.detail-metrics>article,.node-card,.quota-panel,.quota-explanation,.release-list>article) {
  background: var(--admin-surface); color: var(--admin-text); border-color: var(--admin-border);
}
html[data-admin-theme="dark"] body.admin-workspace #app :is(.configuration-grid output,.fixed-resource,.restart-icon,.detail-live-mark,.quota-metrics>div,.price-notice,.release-module-summary,.release-modules label>span,.template-card-status,.metric,.uptime,.customer-toolbar-title,.customer-toolbar-facts) {
  background: var(--admin-subtle); color: var(--admin-text); border-color: var(--admin-border);
}
html[data-admin-theme] body.admin-workspace #app .customer-sidebar nav button:hover { background: var(--admin-hover); color: var(--admin-text); }
html[data-admin-theme] body.admin-workspace #app .customer-sidebar nav button.is-active { background: var(--admin-selected); color: var(--admin-accent); }
html[data-admin-theme] body.admin-workspace #app :is(.configuration-grid output,.price-mode,.price-input>span,#price-message,.quota-metrics dt) { color: var(--admin-muted); }
html[data-admin-theme] body.admin-workspace #app :is(.restart-now,.control-state.is-pending) { color: var(--admin-warning); background: var(--admin-warning-bg); border-color: var(--admin-warning); }
html[data-admin-theme="dark"] body.admin-workspace #app .security-danger { background: var(--admin-danger-bg); border-color: var(--admin-danger); }
html[data-admin-theme] body.admin-workspace :is(.danger,.sidebar-delete) { color: var(--admin-danger); background: var(--admin-danger-bg); border-color: var(--admin-danger); }
html[data-admin-theme] body.admin-workspace :is(.danger,.sidebar-delete):hover { color: var(--admin-danger); background: var(--admin-danger-bg); box-shadow: inset 0 0 0 1px var(--admin-danger); }
html[data-admin-theme] body.admin-workspace .credential-value button { color: var(--admin-accent); background: var(--admin-selected); border-color: var(--admin-border); }
html[data-admin-theme] body.admin-workspace :is(#credentials-status,#price-message) { color: var(--admin-muted); }
html[data-admin-theme="dark"] body.admin-workspace #app .usage-gauge::before { background: var(--admin-surface); }
html[data-admin-theme="dark"] body.admin-workspace #app .usage-gauge { background: conic-gradient(var(--admin-accent) var(--value),var(--admin-border) 0); }
html[data-admin-theme="dark"] body.admin-workspace #app :is(.usage-meter,.meter),
html[data-admin-theme="dark"] body.admin-workspace #app .usage-meter::-webkit-progress-bar { background: var(--admin-subtle); border-color: var(--admin-border); }
html[data-admin-theme="dark"] body.admin-workspace #app .vm-ring-track { stroke: var(--admin-border); }
html[data-admin-theme] body.admin-workspace #app :is(.vm-metric-ring>strong,.vm-network-empty) { color: var(--admin-text); }
html[data-admin-theme="dark"] body.admin-workspace #app .release-dropdown>summary strong { background: var(--admin-selected); color: var(--admin-accent); }
html[data-admin-theme="dark"] body.admin-workspace #app .release-modules input:checked+span { background: var(--admin-selected); color: var(--admin-accent); border-color: var(--admin-accent); }
html[data-admin-theme] body.admin-workspace #app .internal-backup-status[data-state=healthy] .internal-backup-state { background: var(--admin-success-bg); color: var(--admin-success); }
html[data-admin-theme] body.admin-workspace #app .internal-backup-status:is([data-state=failed],[data-state=overdue]) .internal-backup-state { background: var(--admin-danger-bg); color: var(--admin-danger); }
/* Explicitly theme hover/error/empty surfaces that only appear after interaction. */
html[data-admin-theme="dark"] body.admin-workspace #app :is(.dashboard-list>button,.attention-item,.privacy-document-card,.back-button):hover { background: var(--admin-hover); color: var(--admin-text); }
html[data-admin-theme="dark"] body.admin-workspace #app :is(.ticket-description,.ticket-facts>span,.ticket-timeline article>span,.event-list article>span,.privacy-automation) { background: var(--admin-subtle); color: var(--admin-muted); border-color: var(--admin-border); }
html[data-admin-theme] body.admin-workspace dialog { background: var(--admin-surface); color: var(--admin-text); border-color: var(--admin-border); }
html[data-admin-theme] body.admin-workspace dialog :is(pre,code,output) { color: var(--admin-text); }
html[data-admin-theme] body.admin-workspace dialog :is(output[role=alert],.error) { color: var(--admin-danger); }
html[data-admin-theme] body.admin-workspace #privacy-document-dialog button { background: var(--admin-subtle); color: var(--admin-text); border-color: var(--admin-border); }
html[data-admin-theme] body.admin-workspace .sc-power-dialog button[value=confirm] { background: #285dde; color: #fff; border-color: #285dde; }
html[data-admin-theme] body.admin-workspace #app :is(.price-table thead th,.range-scale>span) { color: var(--admin-muted); }
html[data-admin-theme] body.admin-workspace :is(#delete-dialog,#credentials-dialog) :is(p,.label-note) { color: var(--admin-muted); }
/* The VM screen stays dark in both themes; its surrounding controls follow the UI. */
html[data-admin-theme] body.admin-workspace #app .vm-console-shell { border-color: var(--admin-border); }
html[data-admin-theme] body.admin-workspace #app .vm-console-shell>header { background: var(--admin-surface); color: var(--admin-text); border-color: var(--admin-border); }
html[data-admin-theme] body.admin-workspace #app .admin-content .vm-console-placeholder strong { color: #e4ecfa; }
html[data-admin-theme] body.admin-workspace #app .admin-content .vm-console-placeholder p { color: #a9b9d0; }
html[data-admin-theme] body.admin-workspace #app .admin-content .vm-console-shell>footer label { color: #e4ecfa; }
html[data-admin-theme="dark"] body.admin-workspace #app #vm-console-state { color: var(--admin-muted); }

/* Legacy span colours must not override the semantic navigation colour. */
html[data-admin-theme] body.admin-workspace #app :is(.admin-primary-link,.admin-profile-link,.admin-area-search) > span { color: inherit; }