/* Cosmik · HPLX 0.1.0 — PROPOSED. Generated by scripts/generate-tokens.mjs from tokens/hplx/family.json over tokens/cosmik/source.json. Load after cosmik.css. */
[data-family="hplx"] {
  --c-primitive-hplx-ink: #0E0F11;
  --c-primitive-hplx-panel: #131518;
  --c-primitive-hplx-raised: #1E2226;
  --c-primitive-hplx-bone: #ECE7DD;
  --c-primitive-hplx-ash: #A7A196;
  --c-primitive-hplx-rule: #2E3339;
  --c-primitive-hplx-edge: #7E786E;
  --c-primitive-hplx-amber: #E0A53A;
  --c-primitive-hplx-amber-hover: #EBB75C;
  --c-primitive-hplx-amber-active: #C98F2A;
  --c-primitive-hplx-tar: #1A1408;
  --c-primitive-hplx-vellum: #F3EFE6;
  --c-primitive-hplx-parchment: #E7E0D2;
  --c-primitive-hplx-soot: #1A1714;
  --c-primitive-hplx-umber: #5C554B;
  --c-primitive-hplx-rule-light: #D6CFC1;
  --c-primitive-hplx-edge-light: #7A7266;
  --c-primitive-hplx-amber-deep: #875709;
  --c-primitive-hplx-amber-deep-hover: #734A07;
  --c-primitive-hplx-amber-deep-active: #5F3D06;
  --c-primitive-shadow-dark: #00000099;
  --c-primitive-shadow-light: #00000029;
  --c-primitive-red-50: #FAEDEB;
  --c-primitive-red-200: #F2B8B5;
  --c-primitive-red-400: #D0605A;
  --c-primitive-red-600: #B3362F;
  --c-primitive-red-800: #8A1F1A;
  --c-primitive-red-950: #2B1615;
  --c-primitive-amber-50: #FAF1DE;
  --c-primitive-amber-200: #EDCB8C;
  --c-primitive-amber-400: #B08A3E;
  --c-primitive-amber-600: #94690F;
  --c-primitive-amber-800: #6A4A05;
  --c-primitive-amber-950: #2A2112;
  --c-primitive-green-50: #E9F3EB;
  --c-primitive-green-200: #A9D3B1;
  --c-primitive-green-400: #4F9A63;
  --c-primitive-green-600: #2F7D46;
  --c-primitive-green-800: #1D5530;
  --c-primitive-green-950: #13241A;
  --c-primitive-blue-50: #EAF0F8;
  --c-primitive-blue-200: #B5C7E6;
  --c-primitive-blue-400: #6688C0;
  --c-primitive-blue-600: #3B66AB;
  --c-primitive-blue-800: #1F3F73;
  --c-primitive-blue-950: #151D2B;
  --c-type-display-font-family: "Spectral";
  --c-type-display-font-weight: 600;
  --c-type-display-font-size: 3rem;
  --c-type-display-line-height: 1.1;
  --c-type-display-letter-spacing: 0;
  --c-type-display-small-font-family: "Spectral";
  --c-type-display-small-font-weight: 600;
  --c-type-display-small-font-size: 2.125rem;
  --c-type-display-small-line-height: 1.15;
  --c-type-display-small-letter-spacing: 0;
  --c-type-section-font-family: "Spectral";
  --c-type-section-font-weight: 600;
  --c-type-section-font-size: 1.875rem;
  --c-type-section-line-height: 1.2;
  --c-type-section-letter-spacing: 0;
  --c-type-card-font-family: "Spectral";
  --c-type-card-font-weight: 600;
  --c-type-card-font-size: 1.375rem;
  --c-type-card-line-height: 1.3;
  --c-type-card-letter-spacing: 0;
}

[data-family="hplx"], [data-family="hplx"][data-theme="dark"], [data-family="hplx"] [data-theme="dark"] {
  color-scheme: dark;
  --c-bg: var(--c-primitive-hplx-ink);
  --c-surface: var(--c-primitive-hplx-panel);
  --c-raised: var(--c-primitive-hplx-raised);
  --c-text: var(--c-primitive-hplx-bone);
  --c-muted: var(--c-primitive-hplx-ash);
  --c-border: var(--c-primitive-hplx-edge);
  --c-divider: var(--c-primitive-hplx-rule);
  --c-focus: var(--c-primitive-hplx-amber);
  --c-link: var(--c-primitive-hplx-bone);
  --c-link-hover: var(--c-primitive-hplx-amber-hover);
  --c-link-active: var(--c-primitive-hplx-bone);
  --c-on-selected: var(--c-primitive-hplx-ink);
  --c-selected: var(--c-primitive-hplx-bone);
  --c-action-primary: var(--c-primitive-hplx-amber);
  --c-action-primary-hover: var(--c-primitive-hplx-amber-hover);
  --c-action-primary-active: var(--c-primitive-hplx-amber-active);
  --c-action-primary-fg: var(--c-primitive-hplx-tar);
  --c-action-secondary: var(--c-primitive-hplx-panel);
  --c-action-secondary-hover: var(--c-primitive-hplx-raised);
  --c-action-secondary-active: var(--c-primitive-hplx-ink);
  --c-action-secondary-fg: var(--c-primitive-hplx-bone);
  --c-input-bg: var(--c-primitive-hplx-ink);
  --c-input-fg: var(--c-primitive-hplx-bone);
  --c-input-placeholder: var(--c-primitive-hplx-ash);
  --c-disabled-bg: var(--c-primitive-hplx-raised);
  --c-disabled-fg: var(--c-primitive-hplx-ash);
  --c-disabled-border: var(--c-primitive-hplx-edge);
  --c-status-fg: var(--c-primitive-hplx-bone);
  --c-status-bg: var(--c-primitive-hplx-raised);
  --c-status-border: var(--c-primitive-hplx-edge);
  --c-divider-strong: var(--c-primitive-graphite);
  --c-ornament: var(--c-primitive-ornament-dark);
  --c-ornament-faint: var(--c-primitive-ornament-dark-faint);
  --c-ornament-text: var(--c-primitive-graphite);
  --c-media-placeholder: var(--c-primitive-media-dark);
  --c-scrim: var(--c-primitive-scrim-dark);
  --c-accent: var(--c-primitive-hplx-amber);
  --c-shadow: var(--c-primitive-shadow-dark);
  --c-status-error-fg: var(--c-primitive-red-200);
  --c-status-error-bg: var(--c-primitive-red-950);
  --c-status-error-border: var(--c-primitive-red-400);
  --c-status-warning-fg: var(--c-primitive-amber-200);
  --c-status-warning-bg: var(--c-primitive-amber-950);
  --c-status-warning-border: var(--c-primitive-amber-400);
  --c-status-success-fg: var(--c-primitive-green-200);
  --c-status-success-bg: var(--c-primitive-green-950);
  --c-status-success-border: var(--c-primitive-green-400);
  --c-status-info-fg: var(--c-primitive-blue-200);
  --c-status-info-bg: var(--c-primitive-blue-950);
  --c-status-info-border: var(--c-primitive-blue-400);
  --c-elevation-1-surface: var(--c-primitive-hplx-raised);
  --c-elevation-1-shadow: 0px 1px 2px 0px var(--c-primitive-shadow-dark);
  --c-elevation-2-surface: var(--c-primitive-hplx-raised);
  --c-elevation-2-shadow: 0px 4px 12px 0px var(--c-primitive-shadow-dark);
  --c-elevation-3-surface: var(--c-primitive-hplx-raised);
  --c-elevation-3-shadow: 0px 12px 32px 0px var(--c-primitive-shadow-dark);
}

[data-family="hplx"][data-theme="light"], [data-family="hplx"] [data-theme="light"], [data-theme="light"] [data-family="hplx"] {
  color-scheme: light;
  --c-bg: var(--c-primitive-hplx-vellum);
  --c-surface: var(--c-primitive-white);
  --c-raised: var(--c-primitive-hplx-parchment);
  --c-text: var(--c-primitive-hplx-soot);
  --c-muted: var(--c-primitive-hplx-umber);
  --c-border: var(--c-primitive-hplx-edge-light);
  --c-divider: var(--c-primitive-hplx-rule-light);
  --c-focus: var(--c-primitive-hplx-amber-deep);
  --c-link: var(--c-primitive-hplx-soot);
  --c-link-hover: var(--c-primitive-hplx-amber-deep);
  --c-link-active: var(--c-primitive-hplx-soot);
  --c-on-selected: var(--c-primitive-hplx-vellum);
  --c-selected: var(--c-primitive-hplx-soot);
  --c-action-primary: var(--c-primitive-hplx-amber-deep);
  --c-action-primary-hover: var(--c-primitive-hplx-amber-deep-hover);
  --c-action-primary-active: var(--c-primitive-hplx-amber-deep-active);
  --c-action-primary-fg: var(--c-primitive-white);
  --c-action-secondary: var(--c-primitive-white);
  --c-action-secondary-hover: var(--c-primitive-hplx-parchment);
  --c-action-secondary-active: var(--c-primitive-hplx-vellum);
  --c-action-secondary-fg: var(--c-primitive-hplx-soot);
  --c-input-bg: var(--c-primitive-white);
  --c-input-fg: var(--c-primitive-hplx-soot);
  --c-input-placeholder: var(--c-primitive-hplx-umber);
  --c-disabled-bg: var(--c-primitive-hplx-parchment);
  --c-disabled-fg: var(--c-primitive-hplx-umber);
  --c-disabled-border: var(--c-primitive-hplx-edge-light);
  --c-status-fg: var(--c-primitive-hplx-soot);
  --c-status-bg: var(--c-primitive-hplx-parchment);
  --c-status-border: var(--c-primitive-hplx-edge-light);
  --c-divider-strong: var(--c-primitive-rule-light);
  --c-ornament: var(--c-primitive-light-soft);
  --c-ornament-faint: var(--c-primitive-paper-shade);
  --c-ornament-text: var(--c-primitive-rule-light);
  --c-media-placeholder: var(--c-primitive-light-soft);
  --c-scrim: var(--c-primitive-scrim-light);
  --c-accent: var(--c-primitive-hplx-amber-deep);
  --c-shadow: var(--c-primitive-shadow-light);
  --c-status-error-fg: var(--c-primitive-red-800);
  --c-status-error-bg: var(--c-primitive-red-50);
  --c-status-error-border: var(--c-primitive-red-600);
  --c-status-warning-fg: var(--c-primitive-amber-800);
  --c-status-warning-bg: var(--c-primitive-amber-50);
  --c-status-warning-border: var(--c-primitive-amber-600);
  --c-status-success-fg: var(--c-primitive-green-800);
  --c-status-success-bg: var(--c-primitive-green-50);
  --c-status-success-border: var(--c-primitive-green-600);
  --c-status-info-fg: var(--c-primitive-blue-800);
  --c-status-info-bg: var(--c-primitive-blue-50);
  --c-status-info-border: var(--c-primitive-blue-600);
  --c-elevation-1-surface: var(--c-primitive-hplx-parchment);
  --c-elevation-1-shadow: 0px 1px 2px 0px var(--c-primitive-shadow-light);
  --c-elevation-2-surface: var(--c-primitive-hplx-parchment);
  --c-elevation-2-shadow: 0px 4px 12px 0px var(--c-primitive-shadow-light);
  --c-elevation-3-surface: var(--c-primitive-hplx-parchment);
  --c-elevation-3-shadow: 0px 12px 32px 0px var(--c-primitive-shadow-light);
}

/* Website application: selected for this private site on 7 October 2026.
 * The source kit retains its proposal status; no public brand approval is implied.
 * Its exact generated token block is preserved above.
 */
@font-face {
  font-family: 'Spectral';
  src: url('../../fonts/Spectral-SemiBold.woff2') format('woff2');
  font-style: normal;
  font-weight: 600;
  font-display: swap;
}
[data-family="hplx"] .family-heading h1,
[data-family="hplx"] .eyebrow,
[data-family="hplx"] .family-nav a,
[data-family="hplx"] summary .arrow {
  color: var(--c-accent);
}
[data-family="hplx"] .family-nav {
  border-top-color: var(--c-accent);
}
[data-family="hplx"] .family-nav a:hover {
  color: var(--c-link-hover);
}
