/* Motion Studio visual tokens. Fonts are self-hosted; see fonts/*-OFL.txt. */
@media (pointer:coarse) {
  html[data-fixed-mobile-scale], html[data-fixed-mobile-scale] body { touch-action:pan-x pan-y; }
}
@font-face {
  font-family: 'Manrope'; font-style: normal; font-weight: 200 800;
  font-display: swap; src: url('fonts/manrope-variable.woff2') format('woff2');
}
@font-face {
  font-family: 'Inter'; font-style: normal; font-weight: 100 900;
  font-display: swap; src: url('fonts/inter-variable.woff2') format('woff2');
}
:root {
  color-scheme: light;
  --accent-text: #4543b8;
  --surface-raised: #f1f2f6;
  --strong-surface: #20243a;
  --danger-button: #b64050;
  --danger-button-hover: #963340;
  --accent: #5856d6;
  --accent-dark: #4543b8;
  --accent-soft: #eeedfc;
  --accent-border: #d9d7f5;
  --accent-surface: #f5f4fe;
  --ink: #20243a;
  --muted: #626b7e;
  --surface: #ffffff;
  --background: #f5f6fa;
  --line: #e1e5ee;
  --border: var(--line);
  --success: #167a60;
  --success-soft: #e8f6ef;
  --danger: #b64050;
  --danger-dark: #963340;
  --danger-soft: #fff0f2;
  --danger-border: #f0c7cd;
  --warning: #946000;
  --warning-soft: #fff4e5;
  --font-ui: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-heading: 'Manrope', 'Inter', 'Segoe UI', sans-serif;
}
body { color: var(--ink); background: var(--background); font-family: var(--font-ui); }
a { color: var(--accent-text); }
h1,h2,h3 { font-family: var(--font-heading); }
button,input,select,textarea { font-family: inherit; }
input[type=checkbox],input[type=radio] { accent-color: var(--accent); }
.motion-wordmark { display: inline-block; color: var(--ink); font-family: var(--font-heading); font-size: 24px; line-height: 1.2; font-weight: 800; letter-spacing: -.04em; white-space: nowrap; }
.account-summary strong,.account-metrics strong,.partner-wallet>strong,.partner-stats strong { font-family: var(--font-heading); font-variant-numeric: tabular-nums; }

/* Dark artwork has its own transparent source; keep the light backing only in light mode. */
.brand-logo { display:inline-flex; flex-shrink:0; padding:4px; border-radius:10px; background:var(--brand-logo-background,#fff); line-height:0; vertical-align:middle; }
.brand-logo img,.connect-brand .brand-logo img { display:block; width:144px; height:auto; aspect-ratio:144 / 71; max-width:none; }
.sidebar .connect-brand { justify-content:center; }
.sidebar .connect-brand .brand-logo img { width:144px; }
.mobile-header .connect-brand .brand-logo img { width:96px; }
.mobile-header .brand-logo { padding:2px; }
@media(max-width:640px) {
 .brand-logo img,.connect-brand .brand-logo img,.mobile-header .connect-brand .brand-logo img { width:96px; }
}

:root[data-theme="dark"] {
  --brand-logo-background:transparent;
  color-scheme: dark;
  --accent-text: #b6b4ff;
  --accent-soft: #2b2949;
  --accent-border: #514d7e;
  --accent-surface: #242239;
  --ink: #f2f3fa;
  --muted: #abb4c7;
  --surface: #1c2032;
  --surface-raised: #262c40;
  --background: #141724;
  --line: #41495f;
  --success: #79dbb5;
  --success-soft: #173a30;
  --danger: #ffacb8;
  --danger-dark: #ffc4cc;
  --danger-soft: #412530;
  --danger-border: #784454;
  --warning: #f3cb7b;
  --warning-soft: #3b3020;
  --shadow: 0 8px 24px rgba(0,0,0,.28);
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme]) {
  --brand-logo-background:transparent;
  color-scheme: dark;
  --accent-text: #b6b4ff;
  --accent-soft: #2b2949;
  --accent-border: #514d7e;
  --accent-surface: #242239;
  --ink: #f2f3fa;
  --muted: #abb4c7;
  --surface: #1c2032;
  --surface-raised: #262c40;
  --background: #141724;
  --line: #41495f;
  --success: #79dbb5;
  --success-soft: #173a30;
  --danger: #ffacb8;
  --danger-dark: #ffc4cc;
  --danger-soft: #412530;
  --danger-border: #784454;
  --warning: #f3cb7b;
  --warning-soft: #3b3020;
  --shadow: 0 8px 24px rgba(0,0,0,.28);
  }
}

/* Shared controls also used by the standalone catalog. */
.theme-switch { display:inline-flex; align-items:center; justify-content:center; gap:7px; flex-shrink:0; min-height:40px; padding:8px 11px; border:1px solid var(--line); border-radius:10px; background:var(--surface); color:var(--ink); font:600 12px var(--font-ui); cursor:pointer; }
.theme-switch svg { fill:none; stroke:currentColor; stroke-width:1.8; flex-shrink:0; }
.theme-switch svg[hidden] { display:none; }
.theme-switch:hover { background:var(--surface-raised); border-color:var(--accent-text); }
.theme-switch:focus-visible { outline:2px solid var(--accent-text); outline-offset:3px; }
.desktop-theme-toolbar { display:flex; justify-content:flex-end; margin-bottom:14px; }
.creator-header-actions { display:flex; align-items:center; gap:10px; }
@media(max-width:960px) { .desktop-theme-toolbar { display:none; } }
@media(max-width:520px) { .theme-switch { width:40px; padding:8px; } .theme-switch [data-theme-label] { display:none; } .creator-header-actions { gap:6px; } }

dialog { color:var(--ink); background:var(--surface); }
input::placeholder,textarea::placeholder { color:var(--muted); opacity:1; }