/* UpMLM brand palette, taken from the logo: magenta, sky blue, sunny yellow. Overrides the Organic tokens. */
html:root {
  --color-bg: #f7f9fc;
  --color-surface: #ecf1f7;
  --color-text: #141a2b;
  --color-accent: #d915c4;
  --color-accent-2: #00a8f0;
  --color-accent-3: #ffaa18;
  --color-divider: color-mix(in srgb, #141a2b 14%, transparent);

  --color-neutral-100: #ffffff;
  --color-neutral-200: #eef2f7;
  --color-neutral-300: #dce3ec;
  --color-neutral-400: #bac4d2;
  --color-neutral-500: #95a1b2;
  --color-neutral-600: #717e91;
  --color-neutral-700: #535f72;
  --color-neutral-800: #3a4456;
  --color-neutral-900: #232b3b;

  --color-accent-100: #fff0fb;
  --color-accent-200: #ffddf6;
  --color-accent-300: #fcb8ec;
  --color-accent-400: #f47adf;
  --color-accent-500: #e232cf;
  --color-accent-600: #bf14ae;
  --color-accent-700: #96108a;
  --color-accent-800: #6c0c63;
  --color-accent-900: #450a40;

  --color-accent-2-100: #eaf7ff;
  --color-accent-2-200: #d2eefe;
  --color-accent-2-300: #a6ddfb;
  --color-accent-2-400: #5ec3f5;
  --color-accent-2-500: #10a6ec;
  --color-accent-2-600: #0087c7;
  --color-accent-2-700: #00699c;
  --color-accent-2-800: #004b71;
  --color-accent-2-900: #003049;

  --color-accent-3-100: #fff6e0;
  --color-accent-3-200: #ffebc0;
  --color-accent-3-300: #ffd688;
  --color-accent-3-400: #ffbf45;
  --color-accent-3-500: #ffaa18;
  --color-accent-3-600: #d98a00;
  --color-accent-3-700: #a86a00;
  --color-accent-3-800: #774b00;
  --color-accent-3-900: #4a2f00;

  --shadow-sm: 0 1px 2px color-mix(in srgb, #1b2540 12%, transparent);
  --shadow-md: 0 3px 10px color-mix(in srgb, #1b2540 14%, transparent);
  --shadow-lg: 0 14px 36px color-mix(in srgb, #1b2540 16%, transparent);
}

.btn,.seg-opt,.tag{white-space:nowrap}
.btn{flex:none}
.grecaptcha-badge{visibility:hidden}

/* Translated copy has long words the English design never had (Datenschutzerklärung, nätverksmarknadsföring…):
   hyphenate headings and quotes in the page language, and break any word that still can't fit as a last resort. */
body { overflow-wrap: break-word; }
h1, h2, h3, blockquote { -webkit-hyphens: auto; hyphens: auto; }
/* A translated button label can be wider than a phone screen: let it wrap there instead of running off the page. */
.btn { max-width: 100%; }
@media (max-width: 600px) { .btn { white-space: normal; text-align: center; } }

/* CJK: Korean keeps words whole on line breaks; Japanese headings break between phrases. */
:lang(ko) { word-break: keep-all; }
:lang(ja) h1, :lang(ja) h2, :lang(ja) h3 { word-break: auto-phrase; }
/* Never fake bold on single-weight heading faces (Jua, Caprasimo): a real bold system font is used instead when needed. */
h1, h2, h3 { font-synthesis-weight: none; }