/**
 * Generated from Steam — DESIGN.md
 * https://www.webdesignhot.com/design.md/
 */
:root {
  /* role tokens (resolved) */
  --bg: #1b2838;
  --surface: #16202d;
  --surface-alt: #16202d;
  --text: #c7d5e0;
  --text-dim: #c7d5e0;
  --text-faint: #67707b;
  --brand: #66c0f4;
  --on-brand: #ffffff;
  --border: #000000;
  --border-strong: #66c0f4;
  --success: #5c7e10;
  --warning: #dba520;
  --danger: #a34c25;

  /* full color palette */
  --color-bg: #1b2838;
  --color-bg-deep: #171a21;
  --color-bg-darkest: #0e141b;
  --color-surface: #16202d;
  --color-surface-soft: #2a3f5a;
  --color-surface-strong: #3d4450;
  --color-surface-elevated: #1b3346;
  --color-surface-store-band: #0f1c25;
  --color-surface-community: #101822;
  --color-surface-input: #316282;
  --color-text: #c7d5e0;
  --color-text-strong: #ffffff;
  --color-text-soft: #8f98a0;
  --color-text-faint: #67707b;
  --color-text-link: #66c0f4;
  --color-text-disabled: #56707f;
  --color-brand: #66c0f4;
  --color-brand-hover: #9bd2f8;
  --color-brand-active: #1a9fff;
  --color-brand-deep: #417a9b;
  --color-on-brand: #ffffff;
  --color-cta-install: #5c7e10;
  --color-cta-install-hover: #739c1a;
  --color-cta-install-bright: #a4d007;
  --color-cta-buy: #5c7e10;
  --color-cta-buy-hover: #739c1a;
  --color-cta-add-cart: #588a1b;
  --color-link-default: #66c0f4;
  --color-link-visited: #66c0f4;
  --color-link-hover: #ffffff;
  --color-border: #000000;
  --color-border-soft: #3d4450;
  --color-border-strong: #66c0f4;
  --color-scrim: rgba(0,0,0,0.85);
  --color-shadow-card: rgba(0,0,0,0.5);
  --color-shadow-elev: rgba(0,0,0,0.7);
  --color-free-to-play: #5c7e10;
  --color-early-access: #dba520;
  --color-vr-supported: #1a9fff;
  --color-controller: #5491cf;
  --color-achievement: #ffd900;
  --color-review-positive: #66c0f4;
  --color-review-overwhelming: #1a9fff;
  --color-review-mixed: #a3a375;
  --color-review-negative: #a34c25;
  --color-discount-bg: #4c6b22;
  --color-discount-text: #beee11;
  --color-price-original: #56707f;
  --color-price-final: #beee11;
  --color-price-default: #acdbf5;
  --color-badge-trading: #dba520;
  --color-workshop-orange: #dba520;
  --color-success: #5c7e10;
  --color-warning: #dba520;
  --color-danger: #a34c25;
  --color-info: #66c0f4;

  /* type */
  --display-size: 32px;
  --h1-size: 40px;
  --h2-size: 32px;
  --body-size: 14px;
  --label-size: 11px;
  --body-line-height: 1.5;
  --display-tracking: 0;

  /* shape */
  --radius-button: 3px;
  --radius-card: 4px;
  --radius-pill: 9999px;

  /* spacing */
  --space-xs: 2px;
  --space-sm: 4px;
  --space-md: 12px;
  --space-lg: 24px;
  --space-xl: 40px;

  /* fonts */
  --font-display: 'Motiva Sans', ui-sans-serif, system-ui, sans-serif;
  --font-body:    'Motiva Sans', ui-sans-serif, system-ui, sans-serif;
  --font-mono:    'Lucida Console', ui-monospace, monospace;
}