:root {
  --site-color-page: #FFFFFF;
  --site-color-text: #111111;
  --site-color-muted: #666666;
  --site-color-link: #0000CC;
  --site-color-link-visited: #551A8B;
  --site-color-rule: #999999;
  --site-color-box: #F2F2EC;
  --site-color-box-edge: #888888;
  --site-color-locked: #007A00;
  --site-color-relocking: #B35C00;
  --site-type-family-body: Verdana, Geneva, Tahoma, sans-serif;
  --site-type-family-title: Georgia, "Times New Roman", serif;
  --site-type-family-mono: "Courier New", Courier, monospace;
  --site-type-title: 24px;
  --site-type-heading: 16px;
  --site-type-body: 13px;
  --site-type-small: 11px;
  --site-space-xs: 4px;
  --site-space-sm: 8px;
  --site-space-md: 12px;
  --site-space-lg: 20px;
  --site-layout-max-width: 780px;
  --site-layout-receiver-height: 720px;
  --site-layout-image-max-width: 760px;
}
/* The hobbyist site. Colors, type and sizes are the site.* design tokens (prepended by build.ts). */

body {
  margin: 0;
  background: var(--site-color-page);
  color: var(--site-color-text);
  font: var(--site-type-body) / 1.5 var(--site-type-family-body);
}
.wrap {
  max-width: var(--site-layout-max-width);
  margin: 0 auto;
  padding: var(--site-space-sm) var(--site-space-md) var(--site-space-lg);
}
a { color: var(--site-color-link); }
a:visited { color: var(--site-color-link-visited); }
h1 {
  margin: var(--site-space-md) 0 0;
  font: bold var(--site-type-title) var(--site-type-family-title);
}
h1 a, h1 a:visited { color: var(--site-color-text); text-decoration: none; }
h2 {
  margin: var(--site-space-lg) 0 var(--site-space-xs);
  font: bold var(--site-type-heading) var(--site-type-family-title);
}
h3 {
  margin: var(--site-space-md) 0 var(--site-space-xs);
  font: bold var(--site-type-body) var(--site-type-family-mono);
}
hr { border: 0; border-top: 1px solid var(--site-color-rule); }
.tagline { margin: 0 0 var(--site-space-sm); color: var(--site-color-muted); font-style: italic; }
.nav { margin: var(--site-space-sm) 0; }
.meta { margin: 0 0 var(--site-space-sm); color: var(--site-color-muted); }
.note { margin: var(--site-space-xs) 0; }
.channels { line-height: 1.9; }
.credit { color: var(--site-color-muted); font-size: var(--site-type-small); }

.rx {
  margin: var(--site-space-sm) 0;
  padding: var(--site-space-xs) var(--site-space-sm);
  background: var(--site-color-box);
  border: 1px solid var(--site-color-box-edge);
  font-family: var(--site-type-family-mono);
}
.rx .locked { color: var(--site-color-locked); }
.rx .relocking { color: var(--site-color-relocking); }
.receiver {
  display: block;
  width: 100%;
  height: var(--site-layout-receiver-height);
  border: 1px solid var(--site-color-box-edge);
}

.spectrogram { max-width: 100%; border: 1px solid var(--site-color-box-edge); }

table { border-collapse: collapse; }
.airings td { padding: 1px var(--site-space-sm) 1px 0; vertical-align: top; }
.airings .t, .airings .n { font-family: var(--site-type-family-mono); white-space: nowrap; }
.airings .n { color: var(--site-color-muted); padding-left: var(--site-space-sm); }
.hashes th, .hashes td {
  padding: 2px var(--site-space-sm);
  border: 1px solid var(--site-color-box-edge);
  text-align: left;
}
.hashes .root { font-family: var(--site-type-family-mono); word-break: break-all; }