/* =============================================================================
   PATCHWORK DEAD × TapNow LP — creator（制作者プロフィール）
   join の直後・フッタの直前。落ち着いた単一カードで、サイトの暗いアンバー面と
   トークンに合わせる（新しい色は導入しない）。
   ========================================================================== */
.creator-card {
  display: flex; align-items: flex-start; gap: var(--s-6);
  background: var(--surface); border-radius: var(--r-lg);
  padding: var(--s-6) var(--s-7);
  box-shadow: var(--e-1);
}
@media (max-width: 640px) {
  .creator-card { flex-direction: column; align-items: center; text-align: center; padding: var(--s-5); gap: var(--s-4); }
}

.creator-avatar {
  flex: none; width: 128px; height: 128px; border-radius: 50%;
  background: var(--surface-raised);
  /* アイコン自体は透過の丸切り抜き（白地＋黒猫）。暗いカードに直置きすると
     境界が沈むので、薄い縁取りで丸の形をはっきりさせる。
     v14: img 要素は display:block と object-fit:cover を明示しないと、
     インライン要素としてのベースライン余白でリングの下だけ隙間ができたり、
     正方形以外の実サイズで歪んだりする。幅と高さを完全に一致させ、
     img 自体をリングの内側いっぱいに敷き詰めることで、縁取りの太さが
     全周そろう。 */
  display: block; object-fit: cover;
  border: 1px solid var(--hairline);
  box-shadow: var(--e-1);
}
@media (max-width: 640px) { .creator-avatar { width: 108px; height: 108px; } }

.creator-body { display: grid; gap: var(--s-2); min-width: 0; }

.creator-name { font-size: 1.35rem; font-weight: 900; color: var(--ink); }
.creator-name-en {
  margin-left: var(--s-2); font-family: var(--font-la); font-style: italic;
  font-size: .8125rem; font-weight: 400; color: var(--ink-muted); letter-spacing: .02em;
}
.creator-handle { font-size: var(--t-caption); color: var(--accent); letter-spacing: .02em; }

.creator-bio {
  margin-top: var(--s-2); color: var(--ink-muted); max-width: 42em;
  line-height: 1.85;
}

.creator-links { display: flex; flex-wrap: wrap; gap: var(--s-3); margin-top: var(--s-4); }
@media (max-width: 640px) { .creator-links { justify-content: center; } }