:root {
  --femtique-black: #18171A;
  --femtique-panel: #202025;
  --femtique-panel-raised: #27272D;
  --femtique-porcelain: #F2F3ED;
  --femtique-pale-oak: #CCC0B1;
  --femtique-camel: #C5A089;
  --femtique-blue: #2A3FB8;
  --femtique-raspberry: #791642;
  --femtique-orange: #EF7248;
  --femtique-petal: #FDDFD2;
  --femtique-lime: #C9E83A;
  --femtique-line-dark: rgba(242,243,237,.12);
  --femtique-line-light: rgba(24,23,26,.14);

  --femtique-radius-sm: 4px;
  --femtique-radius: 8px;
  --femtique-radius-lg: 14px;
  --femtique-shadow-soft: 0 18px 50px rgba(0,0,0,.22);
  --femtique-shadow-lift: 0 28px 80px rgba(0,0,0,.34);
  --femtique-space-page: clamp(18px, 3vw, 34px);
  --femtique-motion-fast: 180ms;
  --femtique-motion: 280ms;
  --femtique-motion-slow: 460ms;
  --femtique-focus-ring: 0 0 0 3px rgba(239,114,72,.32);
  --femtique-card-border: 1px solid var(--femtique-line-dark);
  --femtique-button-height: 48px;
  --femtique-mobile-nav-height: 76px;

  --void: var(--femtique-black);
  --ink: var(--femtique-black);
  --espresso: var(--femtique-black);
  --cream: var(--femtique-porcelain);
  --soft: var(--femtique-pale-oak);
  --muted: var(--femtique-camel);
  --accent: var(--femtique-blue);
  --edit-gold: var(--femtique-camel);
  --mist: var(--femtique-porcelain);
}

html,
body {
  width: 100%;
  max-width: 100%;
  overflow-x: clip;
}

img,
svg,
video,
canvas,
iframe {
  max-width: 100%;
}

.femtique-no-page-overflow {
  width: 100%;
  max-width: 100%;
  overflow-x: clip;
}

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