/* STAR design tokens. The only file in the app that may hold literal colours or
   font stacks; page stylesheets use the semantic tokens below. Rules and page
   references: docs/star-hosted/design-system.md. */
:root{
/* Varsity Spirit brand palette and type (style guide p15, p16). */
--vs-columbia-blue:#5ea5da;
--vs-medium-blue:#326db2;
--vs-reflex-blue:#25347b;
--vs-true-black:#000000;
--vs-white:#ffffff;
--vs-font-sans:"Futura PT",Arial,Helvetica,sans-serif;
--vs-font-serif:"PT Serif",Arial,serif;

/* UI extensions not in the guide; listed for brand-owner approval (p30). */
--ui-columbia-tint-1:#f6fafd;
--ui-columbia-tint-2:#eaf3fb;
--ui-columbia-tint-3:#8dc0e5;
--ui-gray-100:#dfe6ed;
--ui-gray-300:#808f9f;
--ui-gray-500:#5a6b7d;
--ui-gray-700:#44505c;
--ui-gray-900:#303539;
--ui-gray-on-dark:#c8d2dc;
--ui-success:#136c42;
--ui-success-surface:#e2f4eb;
--ui-warning:#7b430c;
--ui-warning-surface:#fff4e5;
--ui-warning-border:#ecdab9;
--ui-danger:#b33432;
--ui-danger-surface:#fff0ee;
--ui-shadow:#00000022;
--ui-font-mono:ui-monospace,monospace;

/* Semantic tokens: use these in page stylesheets. */
--font-body:var(--vs-font-sans);
--font-legal:var(--vs-font-serif);
--font-code:var(--ui-font-mono);
--color-page:var(--ui-columbia-tint-1);
--color-surface:var(--vs-white);
--color-surface-subtle:var(--ui-columbia-tint-2);
--color-text:var(--vs-true-black);
--color-text-secondary:var(--ui-gray-700);
--color-text-muted:var(--ui-gray-500);
--color-text-on-dark:var(--vs-white);
--color-text-muted-on-dark:var(--ui-gray-on-dark);
--color-text-on-action:var(--vs-white);
--color-text-brand:var(--vs-reflex-blue);
--color-border:var(--ui-gray-100);
--color-border-strong:var(--ui-gray-300);
--color-chrome:var(--vs-true-black);
--color-chrome-control:var(--ui-gray-900);
--color-accent:var(--vs-columbia-blue);
--color-accent-hover:var(--ui-columbia-tint-3);
--color-action:var(--vs-medium-blue);
--color-action-hover:var(--vs-reflex-blue);
--color-link:var(--vs-medium-blue);
--color-focus:var(--vs-medium-blue);
--color-category:var(--vs-columbia-blue);
--color-category-media:var(--vs-reflex-blue);
--color-category-promo:var(--vs-medium-blue);
--color-category-sponsor:var(--vs-true-black);
--color-success:var(--ui-success);
--color-success-surface:var(--ui-success-surface);
--color-warning:var(--ui-warning);
--color-warning-surface:var(--ui-warning-surface);
--color-warning-border:var(--ui-warning-border);
--color-danger:var(--ui-danger);
--color-danger-surface:var(--ui-danger-surface);
--color-shadow:var(--ui-shadow);
}
