:root {
  --violet: #6d28d9;
  --violet-soft: #f3e8ff;
  --ink: #18141f;
  --mute: #6b625c;
  --sand: #f6f4f1;
  --stamp: #e11d48;
}
html, body {
  font-family: "Plus Jakarta Sans", ui-sans-serif, system-ui, sans-serif;
  background: var(--sand);
  color: var(--ink);
}
.wrap { max-width: 760px; margin-left: auto; margin-right: auto; }
.btn-primary {
  background: var(--ink);
  color: #fff;
  font-weight: 700;
  border-radius: 999px;
  border: 0;
}
.btn-primary:hover { background: #2a2433; }
.btn-accent {
  background: var(--violet);
  color: #fff;
  font-weight: 700;
  border-radius: 999px;
  border: 0;
}
.btn-accent:hover { filter: brightness(1.05); }
.range-btn {
  border: 0;
  background: transparent;
  color: var(--mute);
  border-radius: 999px;
  padding: .25rem .75rem;
  font-size: .875rem;
}
.range-btn.is-on {
  background: var(--ink);
  color: #fff;
}
.rank-badge {
  width: 2rem;
  height: 2rem;
  border-radius: 999px;
  background: #fff;
  border: 1px solid rgba(0,0,0,.08);
  display: grid;
  place-items: center;
  font-size: .7rem;
  font-weight: 700;
  color: #8a7f78;
  flex-shrink: 0;
}
.card-row {
  background: #fff;
  border: 1px solid rgba(0,0,0,.06);
  border-radius: 1.25rem;
}
.card-row.is-top {
  background: var(--violet-soft);
  border-color: #ddd6fe;
}
.card-row.is-muted {
  background: #121017;
  border-color: #121017;
  color: #f6efe9;
}
.card-row.is-muted .rank-badge {
  background: #2a2420;
  border-color: #3a322c;
  color: #c9b8ad;
}
.stamp {
  display: inline-block;
  font-weight: 800;
  letter-spacing: .16em;
  font-size: .72rem;
  color: var(--stamp);
  border: 2px solid var(--stamp);
  padding: .12rem .5rem;
  transform: rotate(-8deg);
  line-height: 1;
}
.ghost-name { filter: blur(7px); user-select: none; opacity: .4; }
.price { color: var(--violet); font-weight: 800; letter-spacing: -.02em; }
.activity-chip { background: #fff; border: 1px solid rgba(0,0,0,.08); }
.tab-on { background: var(--violet); color: #fff; }
.tab-off { background: #fff; color: #6b625c; border: 1px solid rgba(0,0,0,.08); }
.modal-bg { background: rgba(20,16,14,.45); }
.suggest-item:hover, .suggest-item.is-on { background: var(--violet-soft); }
code { font-size: .85em; background: #efeae4; padding: .1rem .35rem; border-radius: .35rem; }
