/* ============ Wave 4 — creators detail pages (unified) ============ */


:root{color-scheme:dark}
body{background:var(--pv-noir,#0a0a0b);color:var(--pv-ivory,#f4efe6);
  font-family:var(--pv-sans,Inter,-apple-system,'Segoe UI',sans-serif);
  margin:0;line-height:1.6;-webkit-font-smoothing:antialiased}
.serif{font-family:var(--pv-serif,'Playfair Display',Georgia,serif)}
.wrap{max-width:var(--pv-content-max,1280px);margin:0 auto;padding:0 20px 96px}
@media(max-width:1023px){.wrap{padding:0 16px 72px}}
a{color:inherit}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible,[role="button"]:focus-visible,video:focus-visible,audio:focus-visible{outline:var(--pv-focus-outline,2px solid #ec4634);outline-offset:2px}
/* header */
.page-head{padding:56px 0 8px;max-width:900px}
h1.page-title{font-family:var(--pv-serif,'Playfair Display',Georgia,serif);
  font-size:var(--pv-display,clamp(52px,9.5vw,148px));line-height:.95;letter-spacing:-.02em;
  margin:0 0 18px;font-weight:800}
.lede{font-size:var(--pv-lede,clamp(18px,2vw,22px));color:var(--pv-ivory-dim,rgba(244,239,230,.62));
  max-width:62ch;margin:0 0 10px}
.stamp{font-size:13px;color:var(--pv-ivory-faint,rgba(244,239,230,.38))}
/* breadcrumb */
.crumb{padding:20px 0 0;font-size:13px;color:var(--pv-ivory-dim,rgba(244,239,230,.62))}
.crumb a{color:inherit;text-decoration:none}.crumb a:hover{color:var(--pv-ivory,#f4efe6)}
.crumb .sep{margin:0 8px;color:var(--pv-ivory-faint,rgba(244,239,230,.38))}
/* hero (detail) */

/* sections */
section.block{margin-top:52px}
.block h2{font-family:var(--pv-serif,'Playfair Display',Georgia,serif);font-size:clamp(26px,3vw,36px);margin:0 0 6px;font-weight:700}
.block .lede{font-size:15px;margin-bottom:20px}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:18px}
@media(max-width:640px){.grid{grid-template-columns:1fr 1fr;gap:12px}}
.card{background:var(--pv-noir-2,#111113);border:1px solid var(--pv-rule,rgba(244,239,230,.14));
  border-radius:var(--pv-r-card,16px);overflow:hidden;text-decoration:none;color:var(--pv-ivory,#f4efe6);
  display:block;transition:transform var(--pv-t-fast,.18s) var(--pv-ease,cubic-bezier(.22,.8,.28,1)),
  border-color var(--pv-t-fast,.18s)}
.card:hover{transform:translateY(-3px);border-color:rgba(236,70,52,.5)}
.card img{width:100%;aspect-ratio:16/9;object-fit:cover;display:block;background:#161619}
.card .body{padding:16px 18px}
.card .k{font-size:11px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--pv-red,#ec4634);margin-bottom:6px}
.card h3{font-size:16px;margin:0 0 6px;line-height:1.3}
.card p{font-size:13px;color:var(--pv-ivory-dim,rgba(244,239,230,.62));line-height:1.5;margin:0}
/* bio */
.bio{max-width:72ch;font-size:17px;line-height:1.7;color:var(--pv-ivory,#f4efe6)}
/* platforms table */
.plat{border:1px solid var(--pv-rule,rgba(244,239,230,.14));border-radius:var(--pv-r-card,16px);
  overflow:hidden;background:var(--pv-noir-2,#111113)}
.plat-row{display:grid;grid-template-columns:1fr auto;gap:8px 16px;padding:16px 20px;border-top:1px solid var(--pv-rule,rgba(244,239,230,.14))}
.plat-row:first-child{border-top:0}
.plat-row .pn{font-weight:700}
.plat-row .ph{color:var(--pv-ivory-dim,rgba(244,239,230,.62));font-size:14px}
.plat-row .pc{font-size:22px;font-weight:800;color:#fff}
.plat-row .ps{font-size:12px;color:var(--pv-ivory-faint,rgba(244,239,230,.38));grid-column:1/-1}
/* follow buttons */
.social{display:flex;gap:12px;flex-wrap:wrap}
.soc{display:inline-flex;align-items:center;min-height:var(--pv-target-min,44px);
  background:var(--pv-noir-2,#111113);border:1px solid var(--pv-rule,rgba(244,239,230,.14));
  border-radius:12px;padding:10px 20px;color:#fff;text-decoration:none;font-size:14px;font-weight:700}
.soc:hover{border-color:var(--pv-red,#ec4634)}
.soc span{color:var(--pv-ivory-dim,rgba(244,239,230,.62));font-weight:400;margin-left:8px;font-size:13px}
/* related */
.rel{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:14px}
.rel a{display:flex;align-items:center;gap:12px;padding:12px 16px 12px 12px;border:1px solid var(--pv-rule,rgba(244,239,230,.14));
  border-radius:14px;text-decoration:none;background:var(--pv-noir-2,#111113);min-height:72px}
.rel a:hover{border-color:rgba(236,70,52,.5)}
.rel img{width:52px;height:52px;border-radius:50%;object-fit:cover;flex:none;background:#1a1a1d}
.rel .rn{font-weight:700;font-size:15px;line-height:1.25}
.rel .rc{font-size:12px;color:var(--pv-ivory-dim,rgba(244,239,230,.62))}
.rel .rk{margin-left:auto;font-size:12px;color:var(--pv-ivory-faint,rgba(244,239,230,.38));font-weight:700}
.tilesq{width:52px;height:52px;border-radius:50%;flex:none;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg,#26262b,#141416);border:1px solid var(--pv-rule,rgba(244,239,230,.14));
  font-weight:800;font-size:18px;color:var(--pv-ivory-dim,rgba(244,239,230,.62))}
/* remind */
.remind{margin-top:8px;border:1px solid rgba(236,70,52,.4);border-radius:var(--pv-r-card,16px);
  background:linear-gradient(180deg,rgba(236,70,52,.08),rgba(236,70,52,.02));padding:24px}
.remind button{background:var(--pv-red,#ec4634);color:var(--pv-on-red,#0a0a0b);border:0;border-radius:10px;
  font-weight:800;font-size:15px;padding:14px 28px;min-height:var(--pv-target-min,44px);cursor:pointer;
  letter-spacing:.04em;box-shadow:var(--pv-shadow-btn,0 10px 34px rgba(236,70,52,.35))}
.remind button:hover{background:var(--pv-red-ember,#ff6a52)}
.remind .note{margin:14px 0 0;font-size:14px;color:var(--pv-ivory-dim,rgba(244,239,230,.62));max-width:60ch}
/* footer */
footer.site{border-top:1px solid var(--pv-rule,rgba(244,239,230,.14));background:var(--pv-noir-2,#111113);margin-top:80px}
.foot-in{max-width:var(--pv-content-max,1280px);margin:0 auto;padding:48px 20px 32px;display:grid;
  grid-template-columns:1.4fr 1fr 1fr;gap:32px}
@media(max-width:768px){.foot-in{grid-template-columns:1fr}}
.foot-brand .wm{font-weight:800;font-size:22px;color:#fff;text-decoration:none}
.foot-brand .wm em{color:var(--pv-red,#ec4634);font-style:normal}
.foot-brand p{color:var(--pv-ivory-dim,rgba(244,239,230,.62));font-size:14px;max-width:34ch}
.foot-col h4{font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--pv-ivory-faint,rgba(244,239,230,.38));margin:0 0 14px}
.foot-col ul{list-style:none;margin:0;padding:0;display:grid;gap:4px}
.foot-col a{color:var(--pv-ivory-dim,rgba(244,239,230,.62));text-decoration:none;font-size:14px;
  display:inline-flex;align-items:center;min-height:44px}
.foot-col a:hover{color:var(--pv-ivory,#f4efe6);text-decoration:underline;text-decoration-color:var(--pv-red,#ec4634)}
.foot-legal{max-width:var(--pv-content-max,1280px);margin:0 auto;padding:0 20px 28px;font-size:13px;
  color:var(--pv-ivory-faint,rgba(244,239,230,.38))}
.foot-legal a{color:inherit}
/* live badge */
.live-badge{display:inline-flex;align-items:center;gap:8px;background:var(--pv-red,#ec4634);
  color:var(--pv-on-red,#0a0a0b);font-weight:800;font-size:12px;letter-spacing:.14em;
  padding:7px 14px;border-radius:10px;text-transform:uppercase}
.live-badge .dot{width:8px;height:8px;border-radius:50%;background:var(--pv-on-red,#0a0a0b)}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}
}

.livecard{border:1px solid rgba(236,70,52,.45);border-radius:var(--pv-r-card,16px);
  background:linear-gradient(180deg,rgba(236,70,52,.10),rgba(236,70,52,.02));
  padding:28px;max-width:720px}
.livecard h3{font-family:var(--pv-serif,'Playfair Display',Georgia,serif);font-size:clamp(24px,3vw,34px);margin:14px 0 6px}
.lv-meta{font-size:16px;color:var(--pv-ivory,#f4efe6);margin:0 0 4px}
.lv-src{font-size:12px;color:var(--pv-ivory-faint,rgba(244,239,230,.38));margin:0 0 18px}
.watch{display:inline-flex;align-items:center;min-height:var(--pv-target-min,44px);background:var(--pv-red,#ec4634);
  color:var(--pv-on-red,#0a0a0b);font-weight:800;text-decoration:none;padding:12px 26px;border-radius:10px}
.watch:hover{background:var(--pv-red-ember,#ff6a52)}
.watch span{margin-left:8px}
.ccats{display:flex;gap:10px;flex-wrap:wrap}
.cc{font-size:12px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--pv-red,#ec4634)}
@media(max-width:420px){
  .livecard{padding:22px 20px}
  .block h2{font-size:26px}
}

/* ---- variant pages: sample live-badge treatment ---- */
.live-badge.sample{background:transparent;color:var(--pv-red-ember,#ff6a52);border:1.5px dashed rgba(236,70,52,.6)}
.live-badge.sample .dot{background:var(--pv-red-ember,#ff6a52)}

/* ============ LIGHT THEME (prefers-color-scheme) — color-only overrides ============ */
@media (prefers-color-scheme: light) {
  a:hover { color: #b02a1a; }
  .pv-btn:hover { background: #ec4634; }
  .pv-btn--ghost {
    border-color: rgba(30,26,20,.35);
  }
  .pv-btn--ghost:hover { background: rgba(30,26,20,.05); }
  /* social button sits on a token card that flips white */
  .soc { color: #1e1a14; }
  /* avatar tile gradient */
  .tilesq { background: linear-gradient(135deg, #ffffff, #f0ece1); }
  /* red hover fills stay Signal Red */
  .remind button:hover { background: #ec4634; }
  .watch:hover { background: #ec4634; }
  /* sample live-badge: red as TEXT, not a fill */
  .live-badge.sample { color: #b02a1a; }
  .live-badge.sample .dot { background: #b02a1a; }
  /* NOTE: cards, platforms, rows, footer, lede, bio resolve via --pv-* tokens. */
}