/* All public surfaces share the same appearance vocabulary as the store app. */
:root {
  color-scheme: light;
  --ss-bg-page: #f7f5f2;
  --ss-bg-section: #fbfaf8;
  --ss-bg-panel: #ffffff;
  --ss-bg-raised: #f5f2ee;
  --ss-bg-input: #ffffff;
  --ss-text-primary: #111827;
  --ss-text-secondary: #374151;
  --ss-text-muted: #566070;
  --ss-border-subtle: rgb(24 32 44 / .16);
  --ss-border-strong: rgb(24 32 44 / .3);
  --ss-surface-rgb: 255 255 255;
  --ss-text-rgb: 17 24 39;
  --ss-link-text: #a6380a;
  --ss-focus-ring: #9a3412;
  --ss-status-info: #1e40af;
  --ss-status-purple: #6b21a8;
}
:root[data-theme="dark"] {
  color-scheme: dark;
  --ss-bg-page: #071019;
  --ss-bg-section: #09131d;
  --ss-bg-panel: #101b27;
  --ss-bg-raised: #142232;
  --ss-bg-input: #0b1621;
  --ss-text-primary: #f8fafc;
  --ss-text-secondary: #d7dee8;
  --ss-text-muted: #aab4c4;
  --ss-border-subtle: rgb(203 213 225 / .18);
  --ss-border-strong: rgb(203 213 225 / .32);
  --ss-surface-rgb: 16 27 39;
  --ss-text-rgb: 248 250 252;
  --ss-link-text: #ffb46b;
  --ss-focus-ring: #ffb46b;
  --ss-status-info: #bfdbfe;
  --ss-status-purple: #e9d5ff;
}
/* Map both developer public-site stylesheets to the store's semantic colors. */
:root[data-theme] {
  --bg: var(--ss-bg-page);
  --page: var(--ss-bg-section);
  --surface: var(--ss-bg-panel);
  --surface-2: var(--ss-bg-raised);
  --surface-3: var(--ss-bg-raised);
  --text: var(--ss-text-primary);
  --soft: var(--ss-text-secondary);
  --muted: var(--ss-text-muted);
  --line: var(--ss-border-subtle);
  --topbar-bg: var(--ss-bg-panel);
  --input-bg: var(--ss-bg-input);
  --field: var(--ss-bg-input);
  --pc-bg: var(--ss-bg-page);
  --pc-bg-2: var(--ss-bg-section);
  --pc-surface: var(--ss-bg-panel);
  --pc-surface-2: var(--ss-bg-raised);
  --pc-panel: var(--ss-bg-panel);
  --pc-panel-muted: var(--ss-bg-section);
  --pc-line: var(--ss-border-subtle);
  --pc-line-strong: var(--ss-border-strong);
  --pc-text: var(--ss-text-primary);
  --pc-text-soft: var(--ss-text-secondary);
  --pc-muted: var(--ss-text-muted);
  --pc-subtle: var(--ss-text-muted);
  --pc-gradient-cool: linear-gradient(135deg, var(--ss-bg-panel), var(--ss-bg-raised));
}
:root[data-theme="light"] { --success: #065f46; --danger: #9f1239; }
:root[data-theme="dark"] { --success: #6ee7b7; --danger: #fda4af; }
.appearance-toggle {
  align-items: center;
  justify-content: center;
  display: inline-flex;
  flex: 0 0 38px;
  width: 38px;
  height: 38px;
  border: 1px solid var(--ss-border-strong);
  border-radius: 50%;
  color: var(--ss-text-primary);
  background: var(--ss-bg-panel);
  cursor: pointer;
}
.appearance-toggle:focus-visible { outline: 2px solid var(--ss-focus-ring); outline-offset: 3px; }
html[data-theme] :is(.marketing-app, .pc-main) :is(input, textarea, select) {
  background: var(--ss-bg-input);
  color: var(--ss-text-primary);
  caret-color: currentColor;
  border-color: var(--ss-border-strong);
}
html[data-theme] :is(input, textarea)::placeholder { color: var(--ss-text-muted); opacity: 1; }
html[data-theme] :is(.button, .nav-cta, .pc-button, .pc-nav-cta) {
  background: var(--ss-bg-raised) !important;
  border: 1px solid var(--ss-border-strong);
  color: var(--ss-text-primary) !important;
}