:root {
  color-scheme: dark;
  --mola-bg: #111314;
  --mola-bg-deep: #090b0c;
  --mola-surface: #191c1f;
  --mola-surface-raised: #25292d;
  --mola-surface-soft: #30353a;
  --mola-surface-1: var(--mola-surface);
  --mola-surface-2: var(--mola-surface-raised);
  --mola-surface-3: var(--mola-surface-soft);
  --mola-text: #ffffff;
  --mola-text-muted: #a8adb4;
  --mola-text-quiet: #747a81;
  --mola-cyan: #18d1f4;
  --mola-cyan-strong: #00bddd;
  --mola-cyan-soft: rgba(24, 209, 244, 0.16);
  --mola-orange: #f59a16;
  --mola-orange-soft: rgba(245, 154, 22, 0.16);
  --mola-success: #49bf67;
  --mola-danger: #ff6a55;
  --mola-brand-gradient: linear-gradient(108deg, #f3a36e 0%, #efc1c7 48%, #6edcf6 100%);
  --mola-action-fill: var(--mola-cyan);
  --mola-action-text: #071215;
  --mola-action-hover: #42dcf7;
  --mola-action-pressed: #05b5d4;
  --mola-action-shadow: 0 12px 34px rgba(24, 209, 244, 0.2);
  --mola-border: rgba(255, 255, 255, 0.11);
  --mola-border-strong: rgba(255, 255, 255, 0.22);
  --mola-focus: #8beaff;
  --mola-radius-media: 16px;
  --mola-radius-card: 22px;
  --mola-radius-pill: 999px;
  --mola-ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --mola-duration-fast: 160ms;
  --mola-duration-normal: 280ms;
  --mola-font: Inter, "SF Pro Display", "SF Pro Text", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
.mola-brand-mark {
  display: inline-block;
  flex: 0 0 auto;
  width: 1em;
  height: 1em;
  background: url("assets/brand/mola-mark-light.svg") center / contain no-repeat;
}

.mola-brand-gradient-text {
  color: var(--mola-text);
}

@supports ((-webkit-background-clip: text) or (background-clip: text)) {
  .mola-brand-gradient-text {
    background: var(--mola-brand-gradient);
    background-clip: text;
    -webkit-background-clip: text;
    color: transparent;
    -webkit-text-fill-color: transparent;
  }
}
