/* GENERATED by pnpm ui:static from packages/ui/src/tokens.css. Never edit: change the source and regenerate. */
/* Orbit non-colour tokens. Colour lives in color.css (generated).
 *
 * Golden metrics (decision F5, accepted 2026-09-15): spacing is Fibonacci on a
 * 4 px base, durations grow by φ, type steps by √φ, cards are 1 : φ. One
 * material (decision F2, accepted 2026-09-15): every element shares one spring.
 * Density and theme are orthogonal axes on <html>: data-theme="light|dark"
 * and data-density="compact|default|comfortable". See docs/design/ui/motion.md.
 */
:root {
  --cb-phi: 1.618;

  /* Type (decision B4, revised 2026-09-15). Manrope carries the UI
   * (continuity with the landing and the mockup, Cyrillic, tabular figures);
   * IBM Plex Sans sets headings; Lora italic is the editorial voice for one
   * sentence at a time; JetBrains Mono holds ids, digests and code. */
  --cb-font-ui:
    "Manrope", "Golos Text", "Inter", system-ui, -apple-system, "Segoe UI",
    sans-serif;
  --cb-font-display: "IBM Plex Sans", "Manrope", system-ui, sans-serif;
  --cb-font-editorial: "Lora", Georgia, serif;
  --cb-font-mono:
    "JetBrains Mono", "IBM Plex Mono", ui-monospace, "SF Mono", Menlo, monospace;

  /* √φ scale from 12 px: 12 · 15.3 · 19.4 · 24.7 · 31.4 · 40 · 50.9 · 64.7.
   * The two text steps are fixed (QUALITY-PROGRAMME F-1, F-2, accepted
   * 2026-10-21): 12 px is the floor on every width, and body is one size.
   * From `text-lg` up the step is fluid between 360 px and 1440 px; the
   * desktop value is the exact step. */
  --cb-text-xs: 0.75rem;
  --cb-text-md: 0.954rem;
  --cb-text-lg: clamp(1.06rem, 1rem + 0.35vw, 1.214rem);
  --cb-title-sm: clamp(1.25rem, 1.15rem + 0.6vw, 1.544rem);
  --cb-title-md: clamp(1.5rem, 1.3rem + 1vw, 1.964rem);
  --cb-title-lg: clamp(1.8rem, 1.5rem + 1.6vw, 2.5rem);
  --cb-display: clamp(2.25rem, 1.8rem + 2.4vw, 3.18rem);
  --cb-hero: clamp(2.8rem, 2.1rem + 3.4vw, 4.045rem);

  --cb-leading-tight: 1;
  --cb-leading-dense: 1.272; /* √φ: instrument text */
  --cb-leading-prose: 1.618; /* φ: reading text */
  --cb-measure: 65ch;
  --cb-tracking-caps: 0.08em;
  --cb-tracking-display: -0.015em;

  --cb-weight-regular: 400;
  --cb-weight-medium: 500;
  --cb-weight-semibold: 600;
  --cb-weight-bold: 700;

  /* Wordmark (decision I1, accepted 2026-09-15): Manrope 700, "buddha" gold. */
  --cb-wordmark-font: var(--cb-font-ui);
  --cb-wordmark-weight: 700;
  --cb-wordmark-tracking: -0.025em;

  /* Space: Fibonacci × 4 px. Each gap is the sum of the two before it. */
  --cb-space-1: 4px;
  --cb-space-2: 8px;
  --cb-space-3: 12px;
  --cb-space-5: 20px;
  --cb-space-8: 32px;
  --cb-space-13: 52px;
  --cb-space-21: 84px;
  --cb-space-34: 136px;

  /* The workspace chrome (workspace-layout.md): a rail wide enough for its
   * longest word under a glyph, on the space ladder (84 = space-21). The
   * header is `--cb-space-13`; the export's measured header, phone gap, phone
   * action, font, button inset and radius retired onto the ladder
   * (QUALITY-PROGRAMME F-3, accepted 2026-10-21). */
  --cb-workspace-rail: 84px;
  /* Geometry measured from the owner-selected Graph workspace export. */
  --cb-workspace-phone-action-glyph: 19px;
  --cb-workspace-search: 420px;
  /* v78 gateV / gfBtn: queue row, progress track and filter geometry. */
  --cb-queue-gap: 14px;
  --cb-queue-project-gap: 7px;
  --cb-queue-inset-block: 13px;
  --cb-queue-inset-inline: 16px;
  --cb-queue-filter-inset: 13px;
  --cb-queue-meta-font: 11.5px;
  --cb-queue-status-width: 78px;
  --cb-turn-width: 30px;
  --cb-turn-height: 12px;
  /* v78 intake.card / qStyle / opts / dots, PORTING-BRIEF §10.11. */
  --cb-intake-width: 460px;
  --cb-intake-radius: 18px;
  --cb-intake-close-radius: 9px;
  --cb-intake-title: 15px;
  --cb-intake-question: 19px;
  --cb-intake-option-radius: 11px;
  --cb-intake-pip-active: 18px;
  --cb-intake-motion: 200ms;
  --cb-intake-action-height: 38px;
  --cb-intake-gloss: 12.5px;
  --cb-intake-stat: 11px;
  --cb-intake-leading: 1.25;
  --cb-intake-gloss-leading: 1.45;
  --cb-intake-micro: 10px;
  /* v78 Records table: heading, body, row and pill measurements. */
  --cb-record-heading: 31px;
  --cb-record-heading-leading: 1.15;
  --cb-record-header-height: 44px;
  --cb-record-status-font: 12px;
  --cb-branch-chip-height: 28px;
  --cb-branch-count-font: 11px;
  --cb-branch-rail-inset: 16px;
  --cb-branch-heading-leading: 1.2;
  --cb-workspace-search-leading: 42px;
  --cb-workspace-search-trailing: 76px;
  --cb-workspace-search-phone-height: 34px;
  --cb-workspace-search-phone-leading: 34px;
  --cb-view-control-inset: 15px;
  --cb-graph-axis-width: 116px;
  --cb-graph-axis-phone: 124px;
  --cb-graph-axis-grip: 26px;
  --cb-graph-map-width: 128px;
  --cb-graph-map-height: 116px;
  --cb-graph-node-size: 56px;
  --cb-graph-highlight-halo: 3px;
  --cb-graph-pill-height: 40px;
  --cb-graph-pill-width: 340px;
  --cb-graph-axis-tube: 6px;
  --cb-graph-axis-inset: 13px;
  --cb-graph-axis-label-gutter: 25px;
  --cb-graph-axis-font: 10px;
  --cb-graph-axis-leading: 14px;
  --cb-graph-axis-bead: 7px;
  --cb-graph-axis-bead-active: 11px;
  --cb-graph-axis-tick: 9px;
  --cb-graph-axis-pulse-glow: 20px;
  --cb-graph-axis-pulse-rest: 9px;
  --cb-motion-axis-pulse: 900ms;
  --cb-motion-axis-event: 140ms;
  /* How long one glide of the present may last (PORTING-BRIEF §7.11). Each
     one-second clock tick starts a linear glide towards where the present
     will be this much later, anchored to the tick's own moment
     (useGlide.ts), so the present is where the clock says at every frame.
     φ seconds, longer than the tick: a tick that lands late (timer and
     frame jitter) still finds it moving, and it never stalls (§13.5). */
  --cb-motion-clock: 1618ms;
  --cb-motion-radial: 160ms;
  --cb-graph-inspector-width: 344px;
  --cb-graph-inspector-height: 624px;
  --cb-graph-inspector-radius: 14px;
  /* v78 inspector: heading, facts, tabs, relation rows and actions (§10.8). */
  --cb-inspector-inset: 14px;
  --cb-inspector-control-gap: 10px;
  --cb-inspector-title: 17px;
  --cb-inspector-branch-glyph: 15px;
  --cb-inspector-title-leading: 1.25;
  --cb-inspector-tab-gap: 18px;
  --cb-inspector-tab-height: 34px;
  --cb-inspector-count-size: 22px;
  --cb-inspector-action-height: 38px;
  --cb-inspector-relation-height: 36px;
  --cb-inspector-fact-width: 78px;
  --cb-inspector-detail-width: 84px;
  --cb-graph-detail-inset: 14px;
  --cb-graph-detail-gap: 6px;
  --cb-graph-detail-leading: 1.4;
  --cb-graph-label-leading: 1.3;
  --cb-graph-gloss-leading: 1.5;
  --cb-graph-status-inset: 2px;
  --cb-graph-status-gap: 5px;
  --cb-record-check-size: 16px;
  --cb-record-check-row: 26px;
  /* v78 card.seqRow / sel.seqRow, track and knob measurements. */
  --cb-record-answer-font: 11.5px;
  --cb-record-answer-leading: 1.45;
  --cb-record-log-time-font: 9.5px;
  --cb-record-log-dot: 6px;
  --cb-record-log-dot-offset: 5px;
  --cb-record-log-leading: 1.4;
  --cb-record-switch-width: 28px;
  --cb-record-switch-height: 16px;
  --cb-record-switch-inset: 3px;
  --cb-record-switch-padding: 7px;
  --cb-record-switch-gap: 9px;
  --cb-record-switch-font: 11px;
  --cb-radial-swatch: 26px;
  --cb-radial-label: 13px;
  --cb-radial-label-gap: 9px;
  --cb-radial-label-width: 96px;
  --cb-radial-center-gap: 10px;
  --cb-radial-hint-inset: 18px;
  --cb-radial-title: 14.5px;
  --cb-radial-center-width: 148px;
  --cb-radial-tile-title-offset: 40px;
  --cb-radial-title-leading: 1.22;
  /* v78 zoomBar, pjBarBtn and pjNew; independent of density and camera zoom. */
  --cb-canvas-controls-height: 40px;
  --cb-canvas-controls-phone-height: 36px;
  --cb-canvas-controls-inset: 6px;
  --cb-canvas-controls-bottom: 16px;
  --cb-canvas-button: 32px;
  --cb-canvas-control-glyph: 18px;
  --cb-canvas-zoom-width: 54px;
  --cb-canvas-zoom-font: 13px;
  --cb-graph-zoom-width: 76px;
  --cb-graph-zoom-font: 12.5px;
  --cb-graph-live-glyph: 17px;
  --cb-canvas-hint-gap: 7px;
  --cb-canvas-hint-padding-top: 9px;
  --cb-canvas-hint-padding-bottom: 11px;
  --cb-canvas-hint-track: 132px;
  --cb-workspace-button: 40px;
  --cb-canvas-controls-shadow: 0 4px 12px -4px
    color-mix(in srgb, var(--cb-canvas-shadow) 70%, transparent);
  --cb-workspace-action-shadow: 0 8px 24px -10px
    color-mix(in srgb, var(--cb-canvas-shadow) 90%, transparent);
  --cb-card-radius: 16px;
  --cb-card-title: 16px;
  --cb-card-hero-title: 21px;
  --cb-card-poster-title: 18px;
  --cb-card-text: 10.5px;
  --cb-card-caption: 9.5px;
  --cb-card-gap: 5px;
  /* v78 pjCards / R(v): each metric is rounded after multiplying by zoom. */
  --cb-card-scale: 1;
  --cb-card-badge-inset: 9px;
  --cb-card-mark: 24px;
  --cb-card-glyph: 13px;
  --cb-card-footer-gap: 7px;
  --cb-card-tab-gap: 3px;
  --cb-card-tab-inset: 2px;
  --cb-card-note: 10px;
  --cb-card-value: 11px;
  --cb-card-gloss: 11.5px;
  --cb-card-grid: 22px;
  --cb-card-bar: 3px;
  --cb-card-leading: 1.14;
  --cb-card-gloss-leading: 1.4;
  --cb-card-tracking: -0.01em;
  --cb-card-hover-lift: -3px;
  --cb-card-motion: 200ms;
  --cb-card-rename-height: 28px;
  --cb-card-rename-radius: 7px;
  --cb-cover-drift: 19000ms;
  --cb-cover-drift-secondary: 26000ms;
  --cb-cover-orbit-period: 34000ms;
  --cb-cover-sheen-period: 1050ms;

  /* Radius: the same sequence. Nested elements take parent radius minus inset. */
  --cb-radius-1: 4px;
  --cb-radius-2: 8px;
  --cb-radius-3: 12px;
  --cb-radius-5: 20px;
  --cb-radius-pill: 999px;
  --cb-radius-round: 50%;

  /* Elevation. Light: shadow in navy ink. Dark: the generated shadow ink is
   * black and the surface itself steps lighter (see color.css and base.css). */
  --cb-card-shadow: 0 8px 22px -14px oklch(var(--cb-shadow-ink) / 0.8);
  --cb-card-hover-shadow:
    0 18px 44px -16px color-mix(in srgb, var(--card-ink) 35%, transparent),
    0 10px 30px -12px oklch(var(--cb-shadow-ink) / 0.9);
  --cb-shadow-1: 0 1px 2px oklch(var(--cb-shadow-ink) / 0.06);
  --cb-shadow-2:
    0 4px 12px -4px oklch(var(--cb-shadow-ink) / 0.14),
    0 1px 2px oklch(var(--cb-shadow-ink) / 0.08);
  --cb-shadow-3: 0 16px 40px -12px oklch(var(--cb-shadow-ink) / 0.24);

  /* Density axis. Targets are 44 px by default for every age and every hand. */
  --cb-row-height: 44px;
  --cb-control-height: 44px;
  --cb-target-min: 44px;

  /* Borders and focus. */
  --cb-border-width: 1px;
  --cb-focus-width: 2px;
  --cb-focus-offset: 2px;

  /* One material. Stiffness, damping ratio and mass of the shared spring;
   * JS integrators read these, CSS uses the derived durations below. */
  --cb-spring-k: 420;
  --cb-spring-zeta: 0.92;
  --cb-spring-mass: 1;

  /* Durations grow by φ: 120 · 194 · 314 · 508 · 822 ms. Breath 6180 ms. */
  --cb-motion-1: 120ms;
  --cb-motion-2: 194ms;
  --cb-motion-3: 314ms;
  --cb-motion-5: 508ms;
  --cb-motion-8: 822ms;
  --cb-motion-breath: 6180ms;
  /* Periodic signals and the accepted slow sky; not interaction transitions. */
  --cb-motion-loop: 1618ms;
  --cb-motion-sky-1: 50s;
  --cb-motion-sky-2: 81s;
  --cb-motion-sky-3: 131s;
  --cb-ease-standard: cubic-bezier(0.2, 0, 0, 1);
  --cb-ease-enter: cubic-bezier(0, 0, 0.2, 1);
  --cb-ease-exit: cubic-bezier(0.4, 0, 1, 1);

  /* Fields and energy. */
  /* Magnetism (revised 2026-09-15, owner: too strong): measured from the
   * control's edge, 64 px reach, 3 px of lean at most. */
  --cb-magnet-radius: 64px;
  --cb-magnet-pull: 3px;
  --cb-glow-period: 30min;
  --cb-breath-amplitude: 0.018;

  /* Glass: allowed in two places only, the top bar and the World HUD. */
  --cb-glass-bg: color-mix(in oklch, var(--cb-surface-1) 72%, transparent);
  --cb-glass-blur: 12px;

  /* The glowing edge, demoted to hero surfaces; three brand stops. */
  --cb-edge-1: var(--cb-accent-fill);
  --cb-edge-2: var(--cb-secondary-fill);
  --cb-edge-3: var(--cb-info-solid);
  --cb-edge-width: 1.5px;
  --cb-edge-rest: 0.35;
  --cb-edge-active: 0.9;
  --cb-edge-bloom: 24px;

  /* Imagery in dark mode is dimmed; light mode leaves it alone. */
  --cb-image-dim: none;

  /* Layers. */
  --cb-z-sticky: 10;
  --cb-z-popover: 20;
  --cb-z-dialog: 30;
  --cb-z-toast: 40;

  /* Layout. Rail : content = 1 : φ² ; content : inspector = φ : 1.
   * The content's two widths are on the space ladder and φ apart: a wide page
   * (a dashboard, a list) stops at 1508 = 377 × 4; a page that is read (a
   * settings page, a form) at 932 = 233 × 4 = 1508 / φ. Both stand at the
   * rail's edge, never centred: the eye starts where the rail ends. The
   * gutter is a rung, not a token of its own: `--cb-space-8` (32) on a desk,
   * `--cb-space-5` (20) on a phone, under 672 px (QUALITY-PROGRAMME F-5,
   * accepted 2026-10-21). */
  --cb-rail-width: 232px;
  --cb-rail-collapsed: 52px;
  --cb-content-max: 1508px;
  --cb-content-narrow: 932px;
}

[data-density="compact"] {
  --cb-row-height: 32px;
  --cb-control-height: 36px;
}

[data-density="comfortable"] {
  --cb-row-height: 52px;
  --cb-control-height: 52px;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --cb-image-dim: brightness(0.88) saturate(0.92);
  }
}

[data-theme="dark"] {
  --cb-image-dim: brightness(0.88) saturate(0.92);
}

/* Calm: reduced motion, or the person's own Quiet mode. Everything instant. */
@media (prefers-reduced-motion: reduce) {
  :root {
    --cb-motion-1: 0ms;
    --cb-motion-2: 0ms;
    --cb-motion-3: 0ms;
    --cb-motion-5: 0ms;
    --cb-motion-8: 0ms;
    --cb-magnet-pull: 0px;
    --cb-breath-amplitude: 0;
  }
}

[data-calm="true"] {
  --cb-motion-1: 0ms;
  --cb-motion-2: 0ms;
  --cb-motion-3: 0ms;
  --cb-motion-5: 0ms;
  --cb-motion-8: 0ms;
  --cb-magnet-pull: 0px;
  --cb-breath-amplitude: 0;
}

@media (pointer: coarse) {
  :root {
    --cb-magnet-pull: 0px;
  }
}

@supports not (backdrop-filter: blur(1px)) {
  :root {
    --cb-glass-bg: var(--cb-surface-1);
  }
}

@media (prefers-reduced-transparency: reduce) {
  :root {
    --cb-glass-bg: var(--cb-surface-1);
  }
}

/* Exact geometry and timing of the owner-supplied glowing-edge reference.
 * Kept separate from Orbit's general spacing/type ladder. */
:root {
  --cb-glow-pad: 40px;
  --cb-glow-reference-radius: 1.768em;
  --cb-glow-reference-size: 600px;
  --cb-glow-enter: 250ms;
  --cb-glow-exit: 750ms;
  --cb-glow-intro: 4500ms;
  --cb-glow-intro-delay: 500ms;
  --cb-glow-demo-space: 24px;
  --cb-glow-demo-gutter: 16px;
  --cb-glow-demo-title: 20px;
  --cb-glow-demo-body: 16px;
  --cb-glow-demo-lead: 18px;
}