/*
 * ANJOLA design tokens for the motion components —
 * Copied from apps/web/src/design/identity/primitives.css (lines 4-25) and semantic.css (lines 8-56, 63-100), names unchanged,
 * and scoped to `.am-root` so several components (and a host page) can coexist. Theme: data-theme="light" | "dark" on .am-root.
 * Fonts: the app's native stack (SF on Apple devices); Inter Variable (OFL) is bundled for hosts that want identical rendering.
 */
@font-face { font-family: "Inter Variable"; font-style: normal; font-display: swap; font-weight: 100 900;
  src: url("vendor/inter-latin-wght-normal.woff2") format("woff2-variations"); }

.am-root {
  --anjola-brand-porcelain: #F5EFE8; --anjola-brand-champagne: #EFDDBE; --anjola-brand-blush-veil: #E8CFCC; --anjola-brand-oyster: #E9DDD2;
  --anjola-brand-mineral-ink: #393937; --anjola-brand-logo-native-ink: #494949;
  --anjola-palette-light-top: #FFFDF9; --anjola-palette-light-bottom: #F3E9E2; --anjola-palette-light-secondary: #65605F; --anjola-palette-light-surface: #FFFCF8;
  --anjola-palette-light-stroke: #FFFFFF; --anjola-palette-light-control: #FAF4EF; --anjola-palette-light-reflection: #FFE8CD;
  --anjola-palette-dark-canvas: #2A252A; --anjola-palette-dark-top: #282329; --anjola-palette-dark-bottom: #302830; --anjola-palette-dark-secondary: #D1C7C5;
  --anjola-palette-dark-surface: #302B30; --anjola-palette-dark-stroke: #9C878B; --anjola-palette-dark-control: #443B42; --anjola-palette-dark-reflection: #F4D6AE;

  --anjola-ui-text-muted: var(--anjola-ui-text-secondary); --anjola-ui-text-disabled: var(--anjola-ui-text-secondary);
  --anjola-ui-surface-secondary: var(--anjola-ui-canvas); --anjola-ui-surface-elevated: var(--anjola-ui-surface);
  --anjola-ui-surface-glass: color-mix(in srgb, var(--anjola-ui-surface) var(--anjola-ui-surface-opacity), transparent);
  --anjola-ui-control-glass: color-mix(in srgb, var(--anjola-ui-control) var(--anjola-ui-control-opacity), transparent);
  --anjola-ui-control-hover: color-mix(in srgb, var(--anjola-ui-control), var(--anjola-ui-text-primary) 8%);
  --anjola-ui-control-pressed: color-mix(in srgb, var(--anjola-ui-control), var(--anjola-ui-text-primary) 14%);
  --anjola-ui-control-active: var(--anjola-brand-champagne); --anjola-ui-control-active-text: var(--anjola-brand-mineral-ink);
  --anjola-ui-control-disabled: var(--anjola-ui-control); --anjola-ui-disabled-opacity: .5;
  --anjola-ui-border: var(--anjola-ui-text-secondary);
  --anjola-ui-border-subtle: color-mix(in srgb, var(--anjola-ui-surface-stroke) var(--anjola-ui-surface-stroke-opacity), transparent);
  --anjola-ui-border-strong: var(--anjola-ui-text-primary);
  --anjola-ui-divider: color-mix(in srgb, var(--anjola-ui-text-secondary) 23%, transparent);
  --anjola-ui-action-primary: var(--anjola-ui-control-active); --anjola-ui-action-primary-text: var(--anjola-ui-control-active-text);
  --anjola-ui-action-secondary: var(--anjola-ui-control); --anjola-ui-action-secondary-text: var(--anjola-ui-text-primary);
  --anjola-ui-selected: var(--anjola-ui-control-active); --anjola-ui-selected-text: var(--anjola-ui-control-active-text);
  --anjola-ui-focus-ring: var(--anjola-ui-text-primary); --anjola-ui-focus-width: 2px; --anjola-ui-focus-offset: 2px;
  --anjola-ui-hairline-width: 1px; --anjola-ui-radius-round: 50%; --anjola-ui-control-target-min: 44px;
  --anjola-ui-warning: var(--anjola-brand-mineral-ink); --anjola-ui-warning-surface: var(--anjola-brand-champagne);
  --anjola-ui-overlay-menu: var(--anjola-ui-surface-elevated); --anjola-ui-overlay-dialog: var(--anjola-ui-surface-elevated);
  --anjola-ui-shadow-surface: 0 10px 30px color-mix(in srgb, var(--anjola-ui-depth-ink) 6%, transparent);
  --anjola-ui-shadow-elevated: 0 14px 38px color-mix(in srgb, var(--anjola-ui-depth-ink) 18%, transparent);
  --anjola-ui-font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Inter Variable", Inter, "Segoe UI", sans-serif;
  --anjola-ui-font-weight-body: 400; --anjola-ui-font-weight-heading: 600; --anjola-ui-font-weight-emphasis: 700;
}
.am-root, .am-root[data-theme="light"] {
  --anjola-ui-canvas: var(--anjola-brand-porcelain); --anjola-ui-canvas-top: var(--anjola-palette-light-top); --anjola-ui-canvas-bottom: var(--anjola-palette-light-bottom);
  --anjola-ui-text-primary: var(--anjola-brand-mineral-ink); --anjola-ui-text-secondary: var(--anjola-palette-light-secondary); --anjola-ui-text-inverse: var(--anjola-brand-porcelain);
  --anjola-ui-surface: var(--anjola-palette-light-surface); --anjola-ui-surface-opacity: 57%;
  --anjola-ui-surface-stroke: var(--anjola-palette-light-stroke); --anjola-ui-surface-stroke-opacity: 48%;
  --anjola-ui-control: var(--anjola-palette-light-control); --anjola-ui-control-opacity: 54%;
  --anjola-ui-overlay-scrim: color-mix(in srgb, var(--anjola-brand-mineral-ink) 40%, transparent);
  --anjola-ui-depth-ink: var(--anjola-brand-mineral-ink); --anjola-ui-agent-base-reflection: var(--anjola-palette-light-reflection);
}
.am-root[data-theme="dark"] {
  --anjola-ui-canvas: var(--anjola-palette-dark-canvas); --anjola-ui-canvas-top: var(--anjola-palette-dark-top); --anjola-ui-canvas-bottom: var(--anjola-palette-dark-bottom);
  --anjola-ui-text-primary: var(--anjola-brand-porcelain); --anjola-ui-text-secondary: var(--anjola-palette-dark-secondary); --anjola-ui-text-inverse: var(--anjola-brand-mineral-ink);
  --anjola-ui-surface: var(--anjola-palette-dark-surface); --anjola-ui-surface-opacity: 78%;
  --anjola-ui-surface-stroke: var(--anjola-palette-dark-stroke); --anjola-ui-surface-stroke-opacity: 23%;
  --anjola-ui-control: var(--anjola-palette-dark-control); --anjola-ui-control-opacity: 56%;
  --anjola-ui-overlay-scrim: color-mix(in srgb, var(--anjola-palette-dark-canvas) 64%, transparent);
  --anjola-ui-depth-ink: var(--anjola-palette-dark-canvas); --anjola-ui-agent-base-reflection: var(--anjola-palette-dark-reflection);
}

/* host element for every component: transparent, isolated, theme-scoped */
.am-root { position: relative; display: block; margin: 0; padding: 0; background: transparent; color: var(--anjola-ui-text-primary);
  font-family: var(--am-font, var(--anjola-ui-font-family)); overflow: hidden; contain: layout paint; }
.am-root[data-theme="light"] { color-scheme: light; } .am-root[data-theme="dark"] { color-scheme: dark; }
.am-root *, .am-root *::before, .am-root *::after { box-sizing: border-box; }
/* the app's own form-control reset (not part of the harvested CSS): without it, iOS paints buttons and form text in
   system blue and draws native control bezels. Colour and appearance only; the harvested rules keep their sizes. */
.am-root button, .am-root input, .am-root select, .am-root textarea { color: inherit; }
.am-root button { -webkit-appearance: none; appearance: none; -webkit-tap-highlight-color: transparent; }
.am-root input[type="checkbox"] { accent-color: var(--anjola-ui-text-primary); }
.am-stage { position: absolute; left: 0; top: 0; transform-origin: 0 0; }
.am-dot { position: absolute; z-index: 20; left: 0; top: 0; width: 34px; height: 34px; margin: -17px 0 0 -17px; border-radius: 50%; pointer-events: none; opacity: 0;
  background: color-mix(in srgb, var(--anjola-ui-text-primary) 16%, transparent);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--anjola-ui-text-primary) 26%, transparent), 0 2px 10px color-mix(in srgb, var(--anjola-ui-depth-ink) 14%, transparent); }
.am-root[data-pointer="off"] .am-dot { display: none; }
[data-am-hidden] { display: none !important; }