/* Bikin Motion design tokens: a night-sky violet world (space, planets, clouds) lit by flowing ribbons.
   Variable names are kept from v1 so every surface re-themes from here; see DESIGN notes in PRODUCT.md. */
@import url('https://fonts.googleapis.com/css2?family=Bricolage+Grotesque:opsz,wght@12..96,600..800&family=Figtree:wght@500;600;700;800&family=Shantell+Sans:wght@500;700&family=JetBrains+Mono:wght@500&display=swap');

:root {
  --navy: #1E1450;        /* space violet: main dark surface */
  --navy2: #2E1F78;
  --navy3: #3B2A94;
  --deep: #120B33;
  --card-dark: #1A1145;
  --ink: #1B1240;         /* text on light surfaces */
  --mata: #2A1F4A;

  --cream: #F6F3FF;       /* cloud white: light sections + text on dark */
  --paper: #FFFFFF;
  --moon: #E9E2FF;
  --moon2: #B9A6FF;
  --sun: #FFD23F;
  --coral: #FF6B5A;
  --blush: #FF7AC0;        /* ribbon pink */
  --mint: #4FE0BE;
  --green: #0E9F7E;
  --ungu: #8C6BFF;
  --unguPenuh: #6A3CF0;    /* electric violet: hero drench */

  --display: "Bricolage Grotesque", "Arial Rounded MT Bold", system-ui, sans-serif;
  --body: "Figtree", "Segoe UI", system-ui, sans-serif;
  --hand: "Shantell Sans", "Comic Sans MS", cursive;
  --mono: "JetBrains Mono", ui-monospace, monospace;

  --sh: 0 14px 34px -10px rgba(8, 3, 36, .55);
  --sh-lg: 0 24px 60px -16px rgba(8, 3, 36, .6);
  --glow: 0 0 0 1px rgba(185, 166, 255, .25), 0 12px 40px -8px rgba(106, 60, 240, .65);
  --ease-out: cubic-bezier(.22, 1, .36, 1);
  --pop: cubic-bezier(.34, 1.56, .64, 1);

  color-scheme: dark;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body { margin: 0; background: var(--navy); color: var(--cream); font-family: var(--body); line-height: 1.5; }
img { max-width: 100%; display: block; }
a { color: inherit; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; scroll-behavior: auto !important; }
}