/*
 * mind.css — the few Spades figures used by the "For your mind" pages.
 * Geometry only; every colour comes from the --gc-* theme variables. Shared
 * byte-for-byte with mind/spades.cutthroat/mind.css.
 */

.sp-op {
  font-weight: 800;
  font-size: clamp(17px, 5vw, 22px);
  line-height: 1;
  color: color-mix(in srgb, var(--gc-text) 55%, transparent);
}

/* One chip per deal, racing to the match target. */
.sp-serial {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 8px;
}
.sp-dealchip {
  padding: 7px 13px;
  border-radius: 10px;
  font-weight: 800;
  font-size: clamp(13px, 4vw, 16px);
  color: var(--gc-text);
  background: var(--gc-glass);
  border: 1px solid var(--gc-border);
}
.sp-dealchip.gold { background: var(--gc-warning); color: var(--gc-bg); border-color: transparent; }

/* Cutthroat: the four-bid incentive table — one column per seat. */
.sp-cols {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: center;
  gap: clamp(8px, 3vw, 18px);
  width: 100%;
}
.sp-col {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  padding: 10px 8px;
  border-radius: var(--gc-radius-sm);
  background: var(--gc-glass);
  border: 1px solid var(--gc-border);
}
.sp-chip {
  min-width: clamp(38px, 11vw, 48px);
  height: clamp(38px, 11vw, 48px);
  padding: 0 10px;
  border-radius: 999px;
  display: inline-grid;
  place-items: center;
  font-weight: 800;
  font-size: clamp(15px, 4.4vw, 19px);
  line-height: 1;
  color: var(--gc-text);
  background: var(--gc-glass);
  border: 1px solid var(--gc-border);
}
.sp-chip.nil { background: var(--gc-error); color: #fff; border-color: transparent; }

/* What each seat still wants from the remaining tricks. */
.sp-need {
  min-width: 34px;
  padding: 4px 9px;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 800;
  text-align: center;
  color: var(--gc-bg);
  background: var(--gc-accent);
}
.sp-need.done    { background: var(--gc-success); }
.sp-need.bagging { background: var(--gc-warning); }