/* East Texas Chess Staunton artwork v1. No controls or application state are changed. */
.chess-mark,
svg.fa-chess,
.profile-piece,
.contact-ledger__piece,
.chess-loader__board > span,
svg.icon:has(> path[d="M7 20h10M8 16h8M9 12h6M10 8h4"]) {
  background-color: currentColor;
  -webkit-mask: url("knight-symbol.svg") center / contain no-repeat;
  mask: url("knight-symbol.svg") center / contain no-repeat;
  mask-mode: alpha;
}
.chess-mark {
  display: inline-block;
  inline-size: 2rem !important;
  block-size: 3.35rem;
  flex: 0 0 2rem !important;
  vertical-align: middle;
}
.chess-mark--compact {
  inline-size: 1.35rem !important;
  block-size: 2.25rem;
  flex-basis: 1.35rem !important;
}
.chess-mark > svg,
svg.fa-chess > *,
.profile-piece > *,
.contact-ledger__piece > *,
.chess-loader__board > span > *,
svg.icon:has(> path[d="M7 20h10M8 16h8M9 12h6M10 8h4"]) > * {
  visibility: hidden;
}
svg.icon:has(> path[d="M7 20h10M8 16h8M9 12h6M10 8h4"]) {
  -webkit-mask-image: url("knight-icon.svg");
  mask-image: url("knight-icon.svg");
}
svg.fa-chess { inline-size: 1.1em; block-size: 1.85em; vertical-align: middle; }
.profile-piece { font-size: 0 !important; inline-size: 3rem; block-size: 5rem; border: 0; border-radius: 0; }
.contact-ledger__piece {
  border: 0;
  border-radius: 0;
  font-size: 0 !important;
  -webkit-mask-image: url("pawn-symbol.svg");
  mask-image: url("pawn-symbol.svg");
  inline-size: 1.5rem;
  block-size: 2.5rem;
}
.chess-loader__board { background: var(--paper); border: 1px solid var(--rule); }
.chess-loader__board::before, .chess-loader__board::after { opacity: .12; }
.chess-loader__board > span {
  font-size: 0;
  display: block;
  inline-size: 1.5rem;
  block-size: 2.5rem;
  color: var(--ink);
}
.line-art-board,
.public-piece-lineup__art {
  background-color: currentColor;
  -webkit-mask: url("lineup.svg") center / contain no-repeat;
  mask: url("lineup.svg") center / contain no-repeat;
  mask-mode: alpha;
  color: var(--ink, #f7f7f3);
  animation: none;
  pointer-events: none;
}
.line-art-board > * { visibility: hidden; }
.entry-hero {
  grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr);
  gap: 1.5rem 3rem;
  min-block-size: auto;
  align-items: center;
  padding: clamp(1.25rem, 4vw, 3rem);
}
.entry-hero .entry-brand {
  position: static;
  grid-column: 1 / -1;
  margin-block-end: .5rem;
}
.entry-hero .entry-hero__copy { grid-column: 1; max-inline-size: 100%; }
.entry-hero .line-art-board {
  display: block;
  position: static;
  grid-column: 2;
  grid-row: 2;
  inline-size: 100%;
  block-size: auto;
  aspect-ratio: 600 / 144;
  opacity: .9;
  align-self: start;
  margin-block-start: 1.5rem;
}
.hero-panel {
  grid-template-columns: minmax(0, 1fr) minmax(15rem, .8fr);
  gap: 2rem;
  min-block-size: auto;
  align-items: center;
}
.hero-panel .hero-panel__copy { max-inline-size: 100%; }
.hero-panel .line-art-board {
  position: static;
  inline-size: 100%;
  block-size: auto;
  aspect-ratio: 600 / 144;
  opacity: .85;
}
.club-leader-login .entry-story .line-art-board {
  display: block !important;
  position: static;
  inline-size: 100%;
  block-size: auto;
  aspect-ratio: 600 / 144;
  margin-block: 1.75rem 0;
  opacity: .9;
}
.public-piece-lineup {
  margin: 0;
  padding: 2.5rem 1rem .5rem;
  color: #f7f7f3;
  background: #101010;
}
.public-piece-lineup__art {
  inline-size: min(100%, 40rem);
  aspect-ratio: 600 / 144;
  margin-inline: auto;
  color: inherit;
}

.public-piece-lineup__link {
  display: table;
  margin: 1rem auto 0;
  color: #cfcfc8;
  font: .8rem/1.6 Questrial, system-ui, sans-serif;
  text-underline-offset: .2em;
}
@media (max-width: 900px) {
  .entry-hero, .hero-panel { grid-template-columns: minmax(0, 1fr); }
  .entry-hero .entry-brand { grid-column: 1; margin-block-end: 0; }
  .entry-hero .line-art-board {
    grid-column: 1;
    grid-row: 2;
    inline-size: min(100%, 32rem);
    margin-block: 0 .25rem;
  }
  .entry-hero .entry-hero__copy { grid-column: 1; grid-row: 3; }
  .hero-panel .line-art-board { inline-size: min(100%, 34rem); }
}
@media (max-width: 600px) {
  .entry-hero { gap: 1.25rem; }
  .entry-hero .entry-brand { gap: .75rem; font-size: .75rem; }
  .entry-hero .line-art-board { margin-block: 0; }
  .club-leader-login .entry-story .line-art-board { margin-block: 1rem 0; }
  .public-piece-lineup { padding-block-start: 1.5rem; }
}
@media (forced-colors: active) {
  .chess-mark, .profile-piece, .contact-ledger__piece,
  .chess-loader__board > span, svg.fa-chess, .line-art-board, .public-piece-lineup__art {
    forced-color-adjust: none;
    color: CanvasText;
    background-color: CanvasText;
  }
  .public-piece-lineup { background: Canvas; }
}