/* The gate's screens and the comments frame in bodyboard.net's clothes
   (docs/THEMES.md, The member gate, tier two; The comments): both link
   this sheet after the platform's. Space Grotesk for the words, Space
   Mono for labels, the cream ground in light and the night ground in
   dark, the card as vintage print, and the logo yellow on the one
   button that matters. */
@import url("https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600;700&family=Space+Mono:wght@400;700&display=swap");

html {
  --gate-ground: light-dark(#f3f3ec, #0a0a0b);
  --gate-card: light-dark(#ffffff, #14151a);
  --gate-line: light-dark(#14151a, #2c2e36);
}

.pixel-gate-card {
  border: 2px solid var(--gate-line);
  box-shadow: light-dark(4px 4px 0 0 #14151a, none);
}
.pixel-gate-embedded .pixel-gate-card { box-shadow: none; }

.pixel-gate-title,
.pixel-comments-title {
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 1.1;
}

.pixel-gate-label,
.pixel-gate-section-title,
.pixel-gate-badge,
.pixel-comment-time,
.pixel-comments-sort {
  font-family: "Space Mono", ui-monospace, monospace;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.pixel-gate-input {
  border-width: 2px;
}

.pixel-gate-button {
  font-family: "Space Mono", ui-monospace, monospace;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  font-size: 0.8rem;
  background: #ffff3c;
  color: #0a0a0b;
  border: 2px solid #0a0a0b;
}
.pixel-gate-button:hover { background: #14151a; color: #ffff3c; }
.pixel-gate-button-quiet {
  font-family: "Space Mono", ui-monospace, monospace;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  font-size: 0.75rem;
}

.pixel-comments-head {
  padding-top: 0.75rem;
  border-top: 2px solid CanvasText;
}
.pixel-comments-title { font-size: 1.6rem; }
.pixel-comment-author { font-weight: 700; }
.pixel-comment-time,
.pixel-comment-score { font-variant-numeric: tabular-nums; }
.pixel-comment-body { font-size: 1.02rem; line-height: 1.6; }