@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=DM+Sans:ital,opsz,wght@0,9..40,300;0,9..40,400;0,9..40,500;0,9..40,600;0,9..40,700&family=DM+Mono:wght@400;500&family=Poppins:wght@400;500;600&display=swap');

:root {
  --font1: 'Inter', sans-serif;
  --font2: 'DM Sans', sans-serif;
  --font3: 'Poppins', sans-serif;
  --font4: 'Roboto', Arial, sans-serif;
  --font5: 'Nunito Sans', sans-serif;
  --font-mono: 'DM Mono', monospace;

  --bg: #080a0f;
  --surface: #0d1018;
  --card: #111420;
  --border: rgba(255,255,255,0.07);
  --border-hi: rgba(79,111,255,0.28);

  --blue: #4f6fff;
  --blue-soft: rgba(79,111,255,0.12);
  --blue-glow: rgba(79,111,255,0.25);
  --green: #1fd68c;
  --green-soft: rgba(31,214,140,0.11);
  --cyan: #38bdf8;
  --amber: #fbbf24;
  --violet: #a78bfa;

  --t1: #eef0f8;
  --t2: #8b96b8;
  --t3: #5a6480;

  --r-sm: 10px;
  --r-md: 14px;
  --r-lg: 20px;
  --r-xl: 26px;

  --white: #fff;
  --bg-overlay: rgba(8,10,15,.42);
  --nav-surface: rgba(8,10,15,.8);
  --bg-grid-line: rgba(255,255,255,0.028);
  --bg-mesh-blue: rgba(79,111,255,0.16);
  --bg-mesh-green: rgba(31,214,140,0.12);
  --bg-mesh-blue-soft: rgba(79,111,255,0.08);
  --surface-softest: rgba(255,255,255,.018);
  --surface-softer: rgba(255,255,255,.02);
  --surface-soft: rgba(255,255,255,.025);
  --surface-soft-strong: rgba(255,255,255,.03);
  --surface-soft-stronger: rgba(255,255,255,.04);
  --surface-soft-hover: rgba(255,255,255,.05);
  --surface-soft-track: rgba(255,255,255,.06);
  --surface-soft-dot: rgba(255,255,255,.18);
  --surface-soft-dot-hover: rgba(255,255,255,.4);
  --outline-surface: rgba(255,255,255,.04);
  --outline-border-hover: rgba(255,255,255,.18);
  --outline-border-soft: rgba(255,255,255,.14);

  --blue-border-soft: rgba(79,111,255,.22);
  --blue-border-medium: rgba(79,111,255,.25);
  --blue-border-strong: rgba(79,111,255,.3);
  --blue-border-stronger: rgba(79,111,255,.4);
  --blue-border-strongest: rgba(79,111,255,.5);
  --blue-link-underline: rgba(79,111,255,.35);
  --blue-surface-soft: rgba(79,111,255,.05);
  --blue-surface-mid: rgba(79,111,255,.1);
  --blue-ring: rgba(79,111,255,.1);

  --green-surface-soft: rgba(31,214,140,.04);
  --green-surface-mid: rgba(31,214,140,.08);
  --green-border-soft: rgba(31,214,140,.22);
  --green-border-mid: rgba(31,214,140,.25);

  --error: #f87171;
  --error-soft: rgba(248,113,113,.1);
  --error-border: rgba(248,113,113,.22);
  --error-border-strong: rgba(248,113,113,.6);
  --error-text-soft: #fca5a5;
  --warning: #fcd34d;
  --warning-soft: rgba(251,191,36,.1);
  --warning-border-soft: rgba(251,191,36,.2);
  --warning-strong: #f59e0b;
  --warning-text-soft: #fcd34d;
  --success-text: #6fffd4;
  --info-text: #a5b8ff;
  --cyan-text: #7dd3fc;
  --cyan-text-soft: #93d4f5;
  --violet-text: #c4b5fd;
  --violet-surface-soft: rgba(167,139,250,.1);
  --violet-border-soft: rgba(167,139,250,.22);
  --cyan-surface-soft: rgba(56,189,248,.1);
  --cyan-border-soft: rgba(56,189,248,.2);
  --red-text-soft: #f9a8a8;
  --code-text: #d9e3ff;

  --brand-grad-start: #9db4ff;
  --brand-grad-end: #5fffc2;
  --text-grad-start: #8aa4ff;
  --text-grad-end: #5fffc2;
  --btn-cta-green: #2bc994;

  --google-yellow: #FFC107;
  --google-red: #FF3D00;
  --google-green: #4CAF50;
  --google-blue: #1976D2;

  --channel-whatsapp: #25d366;
  --channel-gmail: #ea4335;
  --channel-telegram: #26a5e4;
  --channel-instagram: #e1306c;
  --channel-messenger: #0866ff;
  --channel-sms: #a78bfa;

  --mac-red: #ff5f57;
  --mac-yellow: #febc2e;
  --mac-green: #28c840;
  --blue-light: #6f9fff;

  --spinner-ring: rgba(255,255,255,.3);
  --readonly-text: rgba(238,240,248,.86);
  --strength-weak: #ef4444;
  --strength-fair: #f59e0b;
  --strength-good: #3b82f6;
  --strength-strong: #10b981;
  --card-shadow: rgba(0,0,0,.4);
  --card-overlay-blue: rgba(79,111,255,.07);
  --btn-cta-shadow-strong: rgba(79,111,255,.35);
  --shadow-dark-sm: rgba(0,0,0,.28);
  --shadow-dark-md: rgba(0,0,0,.3);
  --shadow-dark-lg: rgba(0,0,0,.32);
  --shadow-dark-xl: rgba(0,0,0,.45);
  --shadow-dark-2xl: rgba(0,0,0,.5);
  --shadow-blue-soft: rgba(79,111,255,.14);
  --shadow-blue-mid: rgba(79,111,255,.2);
  --shadow-blue-strong: rgba(79,111,255,.32);
  --shadow-blue-cta: rgba(79,111,255,.35);
  --panel-overlay-blue: rgba(79,111,255,.06);
  --panel-overlay-blue-strong: rgba(79,111,255,.13);
  --panel-overlay-green: rgba(31,214,140,.04);
  --panel-overlay-green-strong: rgba(31,214,140,.10);
  --brand-mark-bg: linear-gradient(135deg, var(--blue-soft), var(--green-soft));
  --brand-mark-border: var(--border);
  --brand-mark-shadow: 0 10px 30px rgba(0,0,0,.16);
  --bot-bubble-text: #c0cfff;
  --draft-bubble-text: #9fffd8;
  --select-option-bg: #111420;
}

html {
  font-family: var(--font1);
  color-scheme: dark;
}

html[data-theme='dark'] {
  color-scheme: dark;
}

html[data-theme='light'] {
  color-scheme: light;
  --bg: #f5f7fb;
  --surface: #ffffff;
  --card: #ffffff;
  --border: rgba(15,23,42,.10);
  --border-hi: rgba(79,111,255,.22);

  --t1: #0f172a;
  --t2: #475569;
  --t3: #64748b;

  --bg-overlay: rgba(245,247,251,.72);
  --nav-surface: rgba(255,255,255,.82);
  --bg-grid-line: rgba(148,163,184,.18);
  --bg-mesh-blue: rgba(79,111,255,.18);
  --bg-mesh-green: rgba(31,214,140,.14);
  --bg-mesh-blue-soft: rgba(79,111,255,.12);

  --surface-softest: rgba(15,23,42,.02);
  --surface-softer: rgba(15,23,42,.028);
  --surface-soft: rgba(15,23,42,.04);
  --surface-soft-strong: rgba(15,23,42,.055);
  --surface-soft-stronger: rgba(15,23,42,.07);
  --surface-soft-hover: rgba(15,23,42,.085);
  --surface-soft-track: rgba(15,23,42,.10);
  --surface-soft-dot: rgba(15,23,42,.20);
  --surface-soft-dot-hover: rgba(15,23,42,.42);
  --outline-surface: rgba(15,23,42,.035);
  --outline-border-hover: rgba(15,23,42,.16);
  --outline-border-soft: rgba(15,23,42,.11);

  --blue-border-soft: rgba(79,111,255,.18);
  --blue-border-medium: rgba(79,111,255,.24);
  --blue-border-strong: rgba(79,111,255,.30);
  --blue-border-stronger: rgba(79,111,255,.38);
  --blue-border-strongest: rgba(79,111,255,.48);
  --blue-link-underline: rgba(79,111,255,.26);
  --blue-surface-soft: rgba(79,111,255,.08);
  --blue-surface-mid: rgba(79,111,255,.12);
  --blue-ring: rgba(79,111,255,.16);

  --green-surface-soft: rgba(31,214,140,.08);
  --green-surface-mid: rgba(31,214,140,.12);
  --green-border-soft: rgba(31,214,140,.18);
  --green-border-mid: rgba(31,214,140,.24);

  --error-soft: rgba(248,113,113,.12);
  --error-border: rgba(248,113,113,.24);
  --error-border-strong: rgba(248,113,113,.45);
  --warning-soft: rgba(251,191,36,.14);
  --warning-border-soft: rgba(251,191,36,.24);
  --success-text: #0f9f73;
  --info-text: #4568f2;
  --cyan-text: #0284c7;
  --cyan-text-soft: #0ea5e9;
  --violet-text: #7c3aed;
  --violet-surface-soft: rgba(167,139,250,.14);
  --violet-border-soft: rgba(167,139,250,.20);
  --cyan-surface-soft: rgba(56,189,248,.12);
  --cyan-border-soft: rgba(56,189,248,.20);
  --red-text-soft: #dc2626;
  --code-text: #1e293b;
  --brand-grad-start: #3454d1;
  --brand-grad-end: #0f9f73;
  --text-grad-start: #3658dd;
  --text-grad-end: #129f77;

  --spinner-ring: rgba(15,23,42,.2);
  --readonly-text: rgba(15,23,42,.70);
  --card-shadow: rgba(15,23,42,.08);
  --card-overlay-blue: rgba(79,111,255,.05);
  --btn-cta-shadow-strong: rgba(79,111,255,.20);
  --shadow-dark-sm: rgba(15,23,42,.08);
  --shadow-dark-md: rgba(15,23,42,.10);
  --shadow-dark-lg: rgba(15,23,42,.12);
  --shadow-dark-xl: rgba(15,23,42,.16);
  --shadow-dark-2xl: rgba(15,23,42,.20);
  --shadow-blue-soft: rgba(79,111,255,.10);
  --shadow-blue-mid: rgba(79,111,255,.14);
  --shadow-blue-strong: rgba(79,111,255,.18);
  --shadow-blue-cta: rgba(79,111,255,.22);
  --panel-overlay-blue: rgba(79,111,255,.05);
  --panel-overlay-blue-strong: rgba(79,111,255,.08);
  --panel-overlay-green: rgba(31,214,140,.05);
  --panel-overlay-green-strong: rgba(31,214,140,.08);
  --brand-mark-bg: linear-gradient(135deg, rgba(79,111,255,.16), rgba(31,214,140,.14));
  --brand-mark-border: rgba(79,111,255,.18);
  --brand-mark-shadow: 0 12px 28px rgba(79,111,255,.10);
  --bot-bubble-text: #3b4fcc;
  --draft-bubble-text: #0f9f73;
  --select-option-bg: #ffffff;
}

body,
button,
input,
select,
textarea,
optgroup,
option {
  font-family: inherit;
}

.theme-ready [data-theme-logo],
.theme-ready .legal-logo {
  display: block;
}

[hidden] {
  display: none !important;
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.theme-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0;
  width: 44px;
  min-height: 44px;
  padding: 0;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--surface-soft-strong);
  color: var(--t1);
  box-shadow: 0 10px 28px var(--shadow-dark-sm);
  cursor: pointer;
  transition: background .2s ease, border-color .2s ease, transform .2s ease, box-shadow .2s ease;
}

.theme-toggle:hover {
  background: var(--surface-soft-hover);
  border-color: var(--outline-border-hover);
  transform: translateY(-1px);
}

.theme-toggle:focus-visible {
  outline: 0;
  box-shadow: 0 0 0 4px var(--blue-ring);
}

.theme-toggle__icon {
  width: 18px;
  height: 18px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.theme-toggle__icon svg {
  width: 18px;
  height: 18px;
  stroke: currentColor;
}

.theme-toggle--nav {
  flex-shrink: 0;
}

@media (max-width: 900px) {
  .theme-toggle--nav {
    width: 42px;
    min-height: 42px;
  }
}