/* Forma UI Foundation v1 — canonical design tokens.
 * Artist Profile remains the visual reference; this file does not alter its geometry. */
:root{
  /* Brand + semantic colour */
  --forma-accent:#1E7B8D;
  --forma-accent-hover:#155E6C;
  --forma-accent-text:#FFFFFF;
  --forma-accent-soft:color-mix(in srgb,var(--forma-accent) 14%,transparent);
  --forma-page:#0B0B0B;
  --forma-panel:#141414;
  --forma-panel-2:#191919;
  --forma-field:#0D0D0D;
  --forma-text:#FFFFFF;
  --forma-text-2:#B3B3B3;
  --forma-muted:#7A7A7A;
  --forma-border:#2F2F2F;
  /* Compatibility aliases: all surfaces resolve back to canonical Design Tokens. */
  --forma-surface:var(--forma-panel);
  --forma-surface-soft:var(--forma-panel-2);

  /* Canonical form/field colour contract.
   * Components consume these semantic tokens instead of hard-coded theme colours.
   * Dark is the current production baseline; a future light theme only needs to
   * override this contract (or its upstream surface/text tokens) globally. */
  --forma-field-bg:var(--forma-field);
  --forma-field-text:var(--forma-text);
  --forma-field-text-secondary:var(--forma-text-2);
  --forma-field-placeholder:var(--forma-muted);
  --forma-field-border:var(--forma-border);
  --forma-field-focus:var(--forma-accent);

  --forma-text-muted:var(--forma-muted);
  --forma-text-secondary:var(--forma-text-2);
  --forma-shadow-sm:var(--forma-shadow-soft);
  --forma-danger:#C85B5B;
  --forma-success:#4F9C74;
  --forma-warning:#B98A4B;

  /* Type scale — derived from the tuned Artist Profile hierarchy. */
  --forma-font:inherit;
  --forma-font-xs:10px;
  --forma-font-sm:11px;
  --forma-font-md:12px;
  --forma-font-body:15px;
  --forma-font-lead:16px;
  --forma-font-section:25px;

  /* Semantic type roles. Page title is locked to the tuned Artist Profile name. */
  --forma-page-title-size:29px;
  --forma-page-title-line:1.25;
  --forma-page-title-weight:900;
  --forma-page-title-tracking:-.03em;
  /* Archive/listing hierarchy is intentionally quieter than a detail-page title. */
  --forma-archive-title-size:25px;
  --forma-archive-title-line:1.35;
  --forma-archive-title-weight:800;
  --forma-archive-description-size:12px;
  --forma-archive-description-line:1.85;
  --forma-archive-head-gap:22px;
  --forma-archive-grid-gap:16px;
  --forma-archive-toolbar-gap:8px;
  /* Card typography has shared density roles rather than entity-specific sizes. */
  --forma-card-title-compact-size:11px;
  --forma-card-title-size:13px;
  --forma-card-title-featured-size:15px;
  --forma-card-title-line:1.55;
  --forma-card-title-weight:800;
  --forma-card-copy-size:11px;
  --forma-card-copy-line:1.8;
  --forma-meta-size:10px;
  --forma-meta-line:1.7;
  --forma-card-gap:10px;
  --forma-card-padding-compact:9px;
  --forma-card-padding:14px;
  --forma-card-media-bg:var(--forma-panel-2);
  --forma-font-page:var(--forma-page-title-size);
  --forma-line-compact:1.35;
  --forma-line-body:1.9;
  --forma-line-reading:2.1;
  --forma-weight-medium:500;
  --forma-weight-semibold:600;
  --forma-weight-bold:700;
  --forma-weight-heavy:800;

  /* Spacing scale. */
  --forma-space-1:4px;
  --forma-space-2:6px;
  --forma-space-3:8px;
  --forma-space-4:10px;
  --forma-space-5:12px;
  --forma-space-6:14px;
  --forma-space-7:16px;
  --forma-space-8:18px;
  --forma-space-9:20px;
  --forma-space-10:24px;
  --forma-space-11:28px;
  --forma-space-12:32px;
  --forma-space-13:36px;
  --forma-space-14:42px;
  --forma-space-15:48px;
  --forma-space-section:48px;

  /* Shape + elevation. Corners stay restrained to match Forma's editorial UI. */
  --forma-radius-xs:4px;
  --forma-radius-sm:6px;
  --forma-radius-md:9px;
  --forma-radius-lg:14px;
  --forma-radius-pill:999px;
  --forma-shadow:0 12px 30px rgba(0,0,0,.22);
  --forma-shadow-soft:0 8px 22px rgba(0,0,0,.14);

  /* Layout + controls. */
  /* One canonical width contract for primary public pages and directories. */
  --forma-public-page-width:1180px;
  --forma-public-page-gutter:16px;
  /* Legacy/general aliases remain mapped to the same authority during migration. */
  --forma-container:var(--forma-public-page-width);
  --forma-container-reading:780px;
  --forma-page-gutter:var(--forma-public-page-gutter);
  --forma-control-height:42px;
  --forma-control-height-compact:34px;
  /* Minimum height for primary touch controls on narrow/mobile surfaces. */
  --forma-control-height-touch:44px;
  --forma-focus-ring:0 0 0 3px color-mix(in srgb,var(--forma-accent) 26%,transparent);
  --forma-transition-fast:160ms ease;
  --forma-transition:220ms ease;
}

/* Canonical responsive contract: mobile <=639px, tablet 640–899px, desktop >=900px.
 * Feature-specific exceptions are migrated page-by-page and must not redefine the foundation. */
@media(max-width:899px){:root{--forma-public-page-gutter:14px;--forma-space-section:42px;--forma-page-title-size:24px;--forma-archive-title-size:22px}}
@media(max-width:639px){:root{--forma-public-page-gutter:10px;--forma-space-section:36px;--forma-font-section:22px;--forma-page-title-size:18px;--forma-page-title-line:1.35;--forma-archive-title-size:18px;--forma-archive-head-gap:18px;--forma-archive-grid-gap:12px}}
