/* Neutral colors follow the selected palette; state and chart colors retain
   their meaning. The default palette uses each declaration's original fallback. */
html[data-theme="cloud"] {
  color-scheme: dark;
  --cmstv-bg: #111319;
  --cmstv-surface: rgba(34,39,52,.62);
  --cmstv-input: rgba(9,11,15,.6);
  --cmstv-inset: rgba(6,8,11,.48);
  --cmstv-soft: rgba(255,255,255,.075);
  --cmstv-hover: rgba(119,168,255,.13);
  --cmstv-border: rgba(255,255,255,.105);
  --cmstv-border-hover: rgba(119,168,255,.5);
  --cmstv-text: #f4f5f7;
  --cmstv-secondary: #b6bbc5;
  --cmstv-muted: #a3a9b5;
  --cmstv-faint: #969daa;
  accent-color: #77a8ff;
  background: var(--cmstv-bg);
  color: var(--cmstv-text);
}
html[data-theme="cloud"] body {
  background: radial-gradient(ellipse at 82% 3%,rgba(97,126,190,.12),transparent 35%),
              linear-gradient(145deg,#111319,#171920 55%,#101116);
  background-attachment: fixed;
}
html[data-theme="cloud"] .shell > .side {
  background: rgba(17,19,24,.84);
  backdrop-filter: blur(30px) saturate(155%);
  -webkit-backdrop-filter: blur(30px) saturate(155%);
}
html[data-theme="cloud"] .top {
  background: rgba(18,20,26,.62);
  backdrop-filter: blur(22px);
  -webkit-backdrop-filter: blur(22px);
}
html[data-theme="cloud"] :is(.card,.summary-card,.overview-card,.overview-tile,.connection-tile,.audience-card,.login) {
  box-shadow: 0 12px 34px rgba(0,0,0,.17),inset 0 1px rgba(255,255,255,.025);
}
html[data-theme="cloud"] :is(.preview-dialog,.update-dialog,.import-dialog,.modal) {
  --cmstv-surface: #222734;
  background: var(--cmstv-surface);
}
html[data-theme="cloud"] :is(button.primary,.button.primary,.save-button,.overview-primary) {
  background: linear-gradient(180deg,#7ba8f7,#557fd0);
  border-color: rgba(255,255,255,.12);
}
html[data-theme="cloud"] .nav.active {
  box-shadow: inset 0 0 0 1px rgba(119,168,255,.13);
  color: #f5f8ff;
}
html[data-theme="cloud"] .nav.active .icon { color: #92b8ff; }
html[data-theme="cloud"] :is(input,select,textarea):focus-visible {
  outline: 2px solid rgba(117,170,255,.75);
  outline-offset: 1px;
  box-shadow: 0 0 0 3px rgba(117,170,255,.12);
}
html[data-theme="cloud"] :is(input:not([type="checkbox"]):not([type="radio"]),select,textarea) {
  background: var(--cmstv-input);
  border-color: var(--cmstv-border);
  color: var(--cmstv-text);
}
html[data-theme="cloud"] option { background: #171920; color: var(--cmstv-text); }
#theme-toggle {
  border: 0;
  background: transparent;
  padding: 6px;
  color: inherit;
  flex: none;
  justify-content: center;
}
#theme-toggle:focus-visible { outline: 2px solid #77a8ff; outline-offset: 2px; }
#theme-toggle[aria-pressed="true"] { color: #92b8ff; }
@media(max-width:1024px) {
  html[data-theme="cloud"] .shell > .side { background: rgba(17,19,24,.96); }
}