/* The website's shared type, color, control and layout vocabulary. */
@font-face { font-family: Geist; src: url('assets/Geist-Regular.woff2') format('woff2'); font-style: normal; font-weight: 400; font-display: swap; }
@font-face { font-family: Geist; src: url('assets/Geist-Medium.woff2') format('woff2'); font-style: normal; font-weight: 500; font-display: swap; }
:root {
  color-scheme: dark;
  /* Shared warm silver for website UI and app-icon light strokes, sRGB. */
  --site-paper: #dcdad5;
  --site-paper-rgb: 220, 218, 213;
  --site-paper-hover: #ebe9e4;
  --site-muted: #aaa8a3;
  --site-ink: #181815;
  --site-line: #383833;
  --site-accent: #d16f57;
  --site-control: #292925;
  --site-control-hover: #33332e;
  --site-surface: #242420;
  --site-radius-control: 12px;
  --site-target: 44px;
  --site-compact-height: 36px;
  --site-compact-radius: 9px;
  --site-focus-width: 2px;
  --site-focus-offset: 3px;
  --site-space-1: 4px;
  --site-space-2: 8px;
  --site-space-3: 12px;
  --site-space-4: 16px;
  --site-space-5: 24px;
  --site-space-6: 32px;
  --paper: var(--site-paper);
  --muted: var(--site-muted);
  --ink: var(--site-ink);
  --line: var(--site-line);
  --accent: var(--site-accent);
  --site-frame-max: 1280px;
  --site-gutter: clamp(24px, 6.25vw, 80px);
  --site-grid-gap: 24px;
}
.site-container {
  width: 100%;
  max-width: var(--site-frame-max);
  margin-inline: auto;
  padding-inline: var(--site-gutter);
}
.site-grid {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: var(--site-grid-gap);
  align-items: start;
}
.site-masthead {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--site-grid-gap);
  min-height: var(--site-target);
  padding-block: 24px;
}
.site-masthead .wordmark {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-height: var(--site-target);
  font-size: 24px;
  font-weight: 500;
  line-height: 1.2;
  letter-spacing: -.075em;
  text-decoration: none;
}
.site-masthead .wordmark img {
  display: block;
  flex: none;
  width: 32px;
  height: 32px;
  border-radius: 8px;
}
.site-masthead .home-link {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: var(--site-space-3);
  min-height: var(--site-target);
  min-width: var(--site-target);
  font-size: 13px;
  line-height: 1.5;
  text-decoration: none;
}

.site-masthead .home-link .direction-arrow { width: 16px; height: 16px; }
.site-footer { padding-bottom: 20px; }
.site-footer-inner { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 8px 20px; padding-top: 12px; border-top: 1px solid var(--site-line); }
.site-footer a { display: inline-flex; align-items: center; gap: 12px; min-height: var(--site-target); min-width: var(--site-target); color: var(--site-muted); font-size: 13px; line-height: 1.5; text-decoration: none; }
.site-footer a:hover, .site-footer a[aria-current=page] { color: var(--site-paper); }
.site-footer a:focus-visible { outline: var(--site-focus-width) solid var(--site-paper); outline-offset: var(--site-focus-offset); }
.legal-links { display: flex; align-items: center; gap: 20px; }
.direction-arrow {
  display: inline-block;
  flex: none;
  width: 18px;
  height: 18px;
  vertical-align: middle;
  background: currentColor;
  -webkit-mask: url('assets/arrow-up-right.svg') center / contain no-repeat;
  mask: url('assets/arrow-up-right.svg') center / contain no-repeat;
}
.direction-arrow--right { transform: rotate(45deg); }
.direction-arrow--left { transform: rotate(225deg); }
/* A shared affordance for every enabled action, including custom controls. */
:where(a[href], button, select, summary, [role=button], [role=slider],
       [role=option], input[type=range], input[type=checkbox], input[type=radio],
       input[type=button], input[type=submit], input[type=reset]):not(:disabled):not([aria-disabled=true]) { cursor: pointer; }
:where(label):has(input:is([type=range], [type=checkbox], [type=radio]):not(:disabled)) { cursor: pointer; }
:where(button, select, input, [role=button], [role=slider], [role=option]):is(:disabled, [aria-disabled=true]) { cursor: default; }
@media (max-width: 780px) {
  .site-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

/* Compact secondary actions share one shape; touch surfaces keep 44px targets. */
.site-button--secondary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: var(--site-compact-height);
  min-width: var(--site-target);
  padding: 0 var(--site-space-3);
  border: 1px solid var(--site-line);
  border-radius: var(--site-compact-radius);
  background: var(--site-control);
  color: var(--site-paper);
  font-size: 12px;
  line-height: 1.5;
  white-space: nowrap;
  text-decoration: none;
}
.site-button--secondary:hover { color: var(--site-paper); background: var(--site-control-hover); }
.site-button--secondary:focus-visible { outline: var(--site-focus-width) solid var(--site-paper); outline-offset: var(--site-focus-offset); }
@media (max-width: 780px), (any-pointer: coarse) {
  :root { --site-compact-height: var(--site-target); }
}
