/* Short authoring aliases. Every one DERIVES from tokens/manifest.css — none
   introduces a value. Use these when hand-writing a Populus surface; use the
   canonical --color-<group>-* / --font-family-* / --font-size-* names when the
   work has to line up with repo code.

   Layout maxima are the only net-new values here. They are measured from the
   shipped surfaces (app content 1140px at 26px gutters; marketing 1240px at
   40px), not from the manifest, which does not specify page width. */
:root {
  /* neutral ramp */
  --canvas: var(--color-neutral-canvas);
  --topbar: var(--color-neutral-topbar);
  --panel: var(--color-neutral-panel);
  --surface: var(--color-neutral-surface);
  --white: var(--color-neutral-white);
  --track: var(--color-neutral-track);

  /* ink ramp */
  --ink: var(--color-text-ink);
  --ink-secondary: var(--color-text-ink-secondary);
  --ink-muted: var(--color-text-ink-muted);
  --ink-faint: var(--color-text-ink-faint);

  /* magenta-tinted hairline. Derives from --color-border-emerald in
     tokens/workshop.css, which tokens.ts documents as the "magenta-tinted
     border" — the manifest layer has no magenta border token beyond the
     0.14 divider, so this is the one legitimate source. */
  --border-magenta: var(--color-border-emerald);

  /* magenta family */
  --magenta: var(--color-brand-magenta);
  --magenta-action: var(--color-brand-magenta-action);
  --magenta-action-hover: var(--color-brand-magenta-action-hover);
  --magenta-tint: var(--color-brand-tint);
  --magenta-tint-2: var(--color-brand-tint-2);

  /* status */
  --healthy: var(--color-status-healthy);
  --healthy-soft: rgba(31, 122, 77, 0.12);
  --attention-fill: var(--color-status-attention-fill);
  --attention-text: var(--color-status-attention-text);
  --attention-dot: var(--color-status-attention-dot);
  --destructive: var(--color-status-destructive);
  --destructive-text: #b32a22; /* darker text step, per §2.4's "derive if body-size red is needed" */
  --destructive-soft: rgba(224, 57, 47, 0.12);

  /* semantic surfaces */
  --bg-canvas: var(--canvas);
  --bg-topbar: var(--topbar);
  --surface-panel: var(--panel);
  --surface-card: var(--surface);
  --surface-tile: var(--white);
  --surface-sunken: var(--track);
  --surface-selected: var(--magenta-tint);
  --surface-selected-cream: var(--magenta-tint-2);

  /* semantic text */
  --text-display: var(--ink);
  --text-body: var(--ink-secondary);
  --text-label: var(--ink-muted);
  --text-faint: var(--ink-faint);
  --text-accent: var(--magenta-action);
  --text-on-accent: var(--white);
  --text-link: var(--magenta-action);

  /* action */
  --action-primary: var(--magenta-action);
  --action-primary-hover: var(--magenta-action-hover);
  --accent-display: var(--magenta);
  --focus-ring: var(--magenta-action);

  /* type */
  --font-display: var(--font-family-display);
  --font-body: var(--font-family-body);
  /* The mono stack for NEW work: self-hosted Geist Mono per §3, with self-hosted
     JetBrains Mono beneath it for the glyphs the 500/600/700 subset lacks. */
  --font-mono-v2: 'Geist Mono', 'JetBrains Mono', ui-monospace, monospace;

  --weight-display: 800;
  --weight-display-soft: 700;
  --weight-body: 400;
  --weight-body-medium: 500;
  --weight-body-semibold: 600;
  --weight-body-bold: 700;
  --weight-mono: 500;
  --weight-mono-bold: 700;

  --leading-display: 1.0;
  --leading-title: 1.25;
  --leading-body: 1.5;
  --leading-relaxed: 1.55;

  --tracking-display: -0.032em;
  --tracking-title: -0.02em;
  --tracking-tight: -0.01em;
  --tracking-mono: 0.12em;

  /* motion aliases */
  --ease-populus: var(--motion-easing); /* @kind other */
  --t-instant: var(--motion-instant); /* @kind other */
  --t-fast: var(--motion-fast); /* @kind other */
  --t-base: var(--motion-base); /* @kind other */
  --t-slow: var(--motion-slow); /* @kind other */
  --t-max: var(--motion-max); /* @kind other */
  --stagger: var(--motion-sibling-stagger); /* @kind other */

  /* shadow alias */
  --shadow-interactive: var(--shadow-interactive-rest);

  /* layout — measured from the shipped surfaces, not the manifest */
  --page-max: 1140px;
  --page-max-wide: 1240px;
  --page-gutter: 26px;
  --page-gutter-wide: 40px;
}

/* §6 named keyframes. ppulse = live dot; dropIn = 450ms entrance;
   flipRight = 450ms at perspective 1400px. */
@keyframes ppulse { 0%, 100% { opacity: 1 } 50% { opacity: .4 } }
@keyframes dropIn { from { opacity: 0; transform: translateY(8px) } to { opacity: 1; transform: none } }
@keyframes flipRight { from { opacity: 0; transform: perspective(1400px) rotateY(-12deg) } to { opacity: 1; transform: perspective(1400px) rotateY(0) } }
@keyframes pp-spin { to { transform: rotate(360deg) } }

/* Under prefers-reduced-motion, transitions are instant and nonessential
   animation is removed (§6). */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
    scroll-behavior: auto !important;
  }
}