@import url("fonts.e297c91a4c78.css");

/* Signal / System — canonical tokens shared by the portal, workspace and bench. */
:root {
  --gh-cobalt: #2453FF;
  --gh-ink: #151A23;
  --gh-paper: #F4F2EB;
  --gh-signal: #FF7048;
  --gh-alloy: #B9C4CE;
  --gh-background: var(--gh-paper);
  --gh-surface: #FFFFFF;
  --gh-text: var(--gh-ink);
  --gh-text-muted: #536171;
  --gh-primary: var(--gh-cobalt);
  --gh-primary-hover: #1B42D6;
  --gh-on-primary: #FFFFFF;
  --gh-accent: var(--gh-signal);
  --gh-on-accent: var(--gh-ink);
  --gh-border-subtle: var(--gh-alloy);
  --gh-border-control: #687789;
  --gh-font-display: "Barlow Condensed", "Arial Narrow", sans-serif;
  --gh-font-body: "Barlow", Arial, sans-serif;
  --gh-font-mono: "IBM Plex Mono", ui-monospace, monospace;
  --gh-radius-control: 6px;
  --gh-radius-card: 8px;
  --gh-content-max: 1200px;
  /* Andrew's compact learning workspace defaults; campaign/portal type is separate. */
  --gh-learning-body-size: .9375rem;
  --gh-learning-line-height: 1.5;
  --gh-learning-control-height: 36px;
  --gh-motion-fast: 150ms;
  --gh-motion-standard: 200ms;
  --gh-focus: var(--gh-cobalt);
}

/* Supplied SVG masters retain their own proportions and clear space. */
.gh-brand {display: inline-flex; align-items: center; min-height: 44px; flex-shrink: 0;}
.gh-logo {display: block; width: 208px; max-width: 100%; height: auto;}
.gh-logo-wordmark {width: 168px;}
.gh-label {font: 500 12px/1.4 var(--gh-font-mono); letter-spacing: .08em; text-transform: uppercase;}
.gh-button {display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 44px; padding: 10px 20px; border: 1px solid var(--gh-cobalt); border-radius: var(--gh-radius-control); background: var(--gh-primary); color: var(--gh-on-primary); font: 600 16px/1.25 var(--gh-font-body); text-decoration: none; cursor: pointer; transition: background var(--gh-motion-fast), border-color var(--gh-motion-fast);}
.gh-button:hover {background: var(--gh-primary-hover); border-color: var(--gh-primary-hover); color: var(--gh-on-primary);}
.gh-button-secondary {background: var(--gh-surface); color: var(--gh-ink); border-color: var(--gh-border-control);}
.gh-button-secondary:hover {background: var(--gh-paper); color: var(--gh-ink); border-color: var(--gh-ink);}
.gh-marker {display: inline-block; padding: 4px 8px; background: var(--gh-signal); color: var(--gh-ink); font: 500 12px/1.4 var(--gh-font-mono); letter-spacing: .04em;}
:focus-visible {outline: 3px solid var(--gh-focus); outline-offset: 3px;}
@media (max-width: 700px), (pointer: coarse) {
  :root {--gh-learning-body-size: 1rem; --gh-learning-control-height: 44px;}
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important;}
}