/* Shared appearance control. Theme sheets style UI chrome, never media pixels. */
html[data-ui-theme] { background: #0b0b0d; }
html[data-ui-theme="light"] { background: #faf9f7; color-scheme: light; }
html[data-ui-theme="dark"] { color-scheme: dark; }
html[data-ui-theme].ui-theme-changing body :is(.app-shell,.topbar,.landing-nav,.site-nav,.app-header,
  .editor-workspace,.panel-header,.resource-panel,.sidebar,.timeline-panel,.workspace-card,.auth-card,
  .edit-form,.menu-dropdown,dialog,.site-button,.button,.ui-theme-toggle,.quiet-button,.icon-button,
  .landing-button,.landing-language-toggle,.app-language-toggle,input,textarea,select) {
  transition:none !important;
}
html body .ui-theme-toggle {
  display: inline-flex !important; align-items: center; justify-content: center; gap: 7px;
  flex: 0 0 auto; min-height: 34px; padding: 7px 11px; margin: 0;
  border: 1px solid #38383d !important; border-radius: 999px !important;
  background: #1b1b1e !important; color: #ededf0 !important; box-shadow: none !important;
  font: 500 11px/1.2 -apple-system, BlinkMacSystemFont, "PingFang SC", sans-serif;
  white-space: nowrap; cursor: pointer; transition: background .18s, border-color .18s;
}
html body .ui-theme-toggle :is(svg, span) { color: inherit !important; }
html body .ui-theme-toggle svg { display:block; width:16px; height:16px; fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; }
html body .ui-theme-toggle:hover { background: #2a2a30 !important; border-color:#666 !important; }
html body .ui-theme-toggle:focus-visible { outline:2px solid #ac9de0 !important; outline-offset:3px; }
html[data-ui-theme="light"] body .ui-theme-toggle { background:#fff !important; border-color:#dddbe2 !important; color:#37323f !important; }
html[data-ui-theme="light"] body .ui-theme-toggle:hover { background:#f1ecfb !important; border-color:#b7a5d6 !important; }
html[data-ui-theme="light"] :is(.brand-wordmark, .brand-wordmark > span, .site-brand, .site-brand > span) { color:#29262f !important; }
html[data-ui-theme="light"] body :is(.brand-symbol, .site-brand img) { filter:brightness(.25); }
html[data-ui-theme="light"] ::selection { background:#ddd0f5; color:#241b35; }
@media(max-width:1100px) {
  html body .topbar .ui-theme-label, html body.product-app .ui-theme-label { display:none; }
  html body :is(.topbar,.app-header) .ui-theme-toggle { width:34px; padding:7px; }
}
@media(max-width:760px) {
  html body .ui-theme-toggle .ui-theme-label { display:none; }
  html body .ui-theme-toggle { width:34px; height:34px; padding:7px; }
  html body .site-nav-actions { gap:8px; }
}
/* Mobile editor header uses display:contents for actions. Give the new control
   an explicit place instead of creating an accidental third grid row. */
@media(max-width:700px) {
  html body:not(.is-entry):not(.is-landing) .topbar .ui-theme-toggle {
    position:absolute; top:44px; right:12px; width:30px; height:30px; min-height:30px; padding:6px;
  }
  html body:not(.is-entry):not(.is-landing) .topbar .project-save-status { margin-right:40px; max-width:100px; }
  html body:not(.is-entry):not(.is-landing) .topbar .project-title { max-width:calc(100vw - 165px); }
}
@media(prefers-reduced-motion:reduce) { html body .ui-theme-toggle { transition:none; } }