/* Creator directory. Profile and checkout styling remains in creators-v1.css. */
.creator-page.is-directory { --cd-line:color-mix(in oklch,var(--text) 14%,transparent); --cd-paper:color-mix(in oklch,var(--panel) 96%,var(--gold) 4%); background:var(--ink); }
:root[data-theme="light"] body.creator-page.is-directory { background:var(--ink); }
.creator-page [hidden] { display:none!important; }
.creator-page.is-directory .shell,.creator-page.is-directory .nav-shell { width:min(1240px,calc(100% - 64px)); }
.creator-page.is-directory .creator-browser { width:min(1240px,calc(100% - 64px)); padding:0 0 42px; }
.creator-page.is-profile .cd-masthead,.creator-page.is-profile .cd-footer { display:none; }
.cd-masthead { position:relative; overflow:hidden; padding:54px 0 38px; border-bottom:1px solid var(--cd-line); isolation:isolate; }
.cd-masthead::before { content:""; position:absolute; z-index:-1; inset:0 0 0 43%; background:linear-gradient(90deg,var(--ink),transparent 75%),url('/assets/hero-bg.webp') 60% 38%/cover; opacity:.19; pointer-events:none; }
.cd-masthead-inner { display:flex; align-items:center; justify-content:space-between; gap:40px; }
.cd-masthead .eyebrow { margin:0 0 18px; font-size:.68rem; letter-spacing:.28em; }
.cd-masthead h1 { margin:0; max-width:810px; color:var(--text); font:600 clamp(2.4rem,4.8vw,4.35rem)/1.06 var(--font-display); letter-spacing:-.045em; text-wrap:balance; }
.cd-intro { margin:18px 0 0; color:var(--muted); font-size:clamp(.88rem,1.5vw,1.05rem); }
.cd-benefit { display:flex; flex:0 0 260px; gap:16px; align-items:center; padding:21px 23px; border:1px solid color-mix(in oklch,var(--gold) 62%,transparent); border-radius:5px; background:color-mix(in oklch,var(--ink) 91%,transparent); }
.cd-benefit svg { width:36px; flex:none; fill:none; stroke:var(--gold); stroke-width:1.7; stroke-linejoin:round; }
.cd-benefit>div { display:grid; gap:4px; }
.cd-benefit strong { color:var(--text); font:700 1.95rem/1.1 var(--font-display); letter-spacing:-.04em; }
.cd-benefit span { color:var(--text); font-size:.77rem; line-height:1.5; }
.cd-benefit small { margin-top:4px; font-size:.65rem; color:var(--muted); line-height:1.5; }
.cd-toolbar { display:grid; grid-template-columns:minmax(0,1fr) minmax(190px,.55fr) 156px; gap:18px; align-items:center; padding:20px 0 0; margin-bottom:28px; scroll-margin-top:85px; }
.cd-tabs { display:flex; gap:20px; align-self:stretch; border-bottom:1px solid var(--cd-line); }
.cd-tabs button { position:relative; min-height:48px; padding:10px 3px; border:0; border-bottom:2px solid transparent; margin-bottom:-1px; color:var(--muted); background:none; cursor:pointer; white-space:nowrap; font:700 .8rem/1.4 var(--font-body); }
.cd-tabs button[aria-pressed="true"] { color:var(--gold-bright); border-bottom-color:var(--gold); }
.cd-search { min-width:0; min-height:44px; display:flex; align-items:center; gap:12px; padding:0 13px; border:1px solid var(--cd-line); border-radius:4px; background:var(--cd-paper); }
.cd-search svg { width:18px; height:18px; fill:none; stroke:var(--muted); stroke-width:1.5; flex:none; }
.cd-search input { width:100%; min-width:0; min-height:44px; padding:0; border:0; outline:0; color:var(--text); background:none; font:500 .78rem var(--font-body); }
.cd-search input::placeholder { color:var(--muted); }
.cd-search:focus-within { outline:2px solid var(--gold); outline-offset:3px; }
.cd-platform select { width:100%; min-height:46px; padding:0 12px; border:1px solid var(--cd-line); border-radius:4px; color:var(--text); background:var(--cd-paper); font:600 .76rem var(--font-body); cursor:pointer; }
.cd-platform option { color:var(--text); background:var(--panel); }
.cd-section-heading { display:flex; align-items:baseline; justify-content:space-between; gap:20px; margin:0 0 15px; padding-bottom:13px; border-bottom:1px solid var(--line); }
.cd-section-heading h2,.cd-board-heading h2,.cd-new-partners h2 { margin:0; font:600 clamp(1.6rem,2.6vw,2.2rem)/1.15 var(--font-display); letter-spacing:-.045em; text-wrap:balance; }
.cd-section-heading p { margin:0; font-size:.73rem; color:var(--muted); }
.cd-status { padding:50px 20px; border:1px dashed var(--cd-line); color:var(--muted); text-align:center; font-size:.88rem; }
#creator-feedback:has(.cd-status:not([hidden])) { margin-bottom:24px; }
#creator-retry { margin-bottom:20px; }
.cd-spotlight { display:grid; grid-template-columns:minmax(0,1.56fr) minmax(0,1fr); grid-template-rows:1fr 1fr; gap:14px; margin-bottom:30px; }
.cd-leader { position:relative; min-width:0; overflow:hidden; border:1px solid var(--cd-line); border-radius:6px; background:var(--cd-paper); }
.cd-leader-cover { background:linear-gradient(125deg,#263746,#101d2c); background-size:cover; background-position:center; }
.cd-leader-rank { position:absolute; display:grid; place-items:center; align-content:center; }
.cd-rank-label { font:700 .57rem/1 var(--font-body); letter-spacing:.18em; text-transform:uppercase; }
.cd-leader-rank strong { font:500 3rem/1.1 var(--font-display); letter-spacing:-.05em; font-variant-numeric:lining-nums; }
.cd-winner { grid-row:1 / 3; display:flex; flex-direction:column; min-height:420px; color:#f6f2e8; background:#111d2a; border:1px solid #b29451; box-shadow:0 0 0 2px color-mix(in oklch,var(--gold) 16%,transparent); }
.cd-winner .cd-leader-cover { height:220px; min-height:160px; flex:1; background-size:cover; background-position:center; }
.cd-winner .cd-leader-cover::after { content:""; position:absolute; inset:0; pointer-events:none; background:linear-gradient(180deg,rgba(7,14,22,.05) 24%,rgba(7,14,22,.12) 53%,#111d2a 78%); }
.cd-winner .cd-leader-rank { top:18px; left:18px; width:82px; height:89px; gap:2px; padding:9px; color:#f0d38b; border:1px solid rgba(236,207,145,.65); border-radius:45% 45% 4px 4px; background:rgba(11,21,31,.87); }
.cd-winner .cd-leader-rank strong { font-size:3.2rem; }
.cd-leader-body { position:relative; min-width:0; }
.cd-winner .cd-leader-body { padding:0 26px 24px; display:grid; grid-template-columns:minmax(0,1fr) auto; gap:20px 18px; align-items:end; }
.cd-winner .cd-leader-identity { min-width:0; grid-row:1 / 3; }
.cd-winner .creator-avatar { position:relative; width:90px; height:90px; margin:-36px 0 14px; border:3px solid #edcf8f; box-shadow:0 0 0 5px #111d2a; }
.cd-identity { min-width:0; }
.creator-region { display:flex; flex-wrap:wrap; align-items:center; gap:6px; margin-top:8px; color:var(--text); font:600 .72rem/1.5 var(--font-body); }
.creator-region-caption { color:var(--muted); font-weight:500; }
.creator-region-caption::after { content: ":"; }
.creator-region-name { overflow-wrap:anywhere; }
.cd-winner .creator-region { color:#f6f2e8; }
.cd-winner .creator-region-caption { color:#bdc8d2; }
.creator-profile-identity .creator-region { margin-top:12px; font-size:.85rem; }
.cd-row .cd-identity { display:grid; grid-template-columns:minmax(140px,250px) minmax(0,1fr); gap:0 24px; align-items:center; }
.cd-row .cd-identity h3 { grid-column:1; }
.cd-row .cd-identity .creator-chips { grid-column:1; }
.cd-row .cd-identity .creator-region { grid-column:2; grid-row:1 / 3; margin-top:0; }
.has-discovery .cd-row .cd-identity { display:block; }
.has-discovery .cd-row .cd-identity .creator-region { margin-top:8px; }
.cd-identity h3 { display:flex; flex-wrap:wrap; align-items:center; gap:7px; margin:0 0 7px; color:var(--text); font:700 1.08rem/1.3 var(--font-display); letter-spacing:-.02em; overflow-wrap:anywhere; }
.cd-name { min-width:0; color:inherit; text-decoration:none; overflow-wrap:anywhere; }
.cd-verified { display:inline-grid; place-items:center; width:15px; height:15px; flex:none; border-radius:50%; color:#fff; background:#237453; font:800 10px/1 var(--font-body); }
.cd-winner .cd-identity h3 { color:#f6f2e8; font-size:clamp(1.25rem,2vw,1.85rem); }
.cd-winner .cd-verified { width:18px; height:18px; font-size:12px; }
.is-directory .creator-chips { gap:5px; margin:0; flex-wrap:wrap; }
.is-directory .creator-chip { display:inline-flex; align-items:center; gap:6px; padding:4px 8px; min-height:28px; border:1px solid var(--cd-line); border-radius:7px; color:var(--text); background:color-mix(in oklch,var(--panel) 84%,transparent); font-size:.66rem; line-height:1.25; text-decoration:none; }
.is-directory .creator-chip-link { cursor:pointer; transition:background-color 150ms ease,border-color 150ms ease; }
.creator-platform-icon { display:block; width:16px; height:16px; flex:none; }
.cd-winner .creator-chip { color:#dce4eb; border-color:rgba(213,223,233,.25); background:rgba(255,255,255,.03); }
.cd-supporters { display:grid; gap:2px; }
.cd-supporters strong { color:var(--text); font:600 1.8rem/1.05 var(--font-display); letter-spacing:-.04em; font-variant-numeric:tabular-nums; }
.cd-supporters>span { color:var(--muted); font-size:.62rem; line-height:1.4; }
.cd-winner .cd-supporters { text-align:right; }
.cd-winner .cd-supporters strong { color:#efcf88; font-size:clamp(2.15rem,3.8vw,3.5rem); }
.cd-winner .cd-supporters>span { color:#d9c595; font-size:.58rem; text-transform:uppercase; letter-spacing:.12em; }
.cd-gold-action,.cd-outline,.cd-text-action { display:inline-flex; justify-content:center; align-items:center; gap:16px; min-height:44px; max-width:100%; text-decoration:none; cursor:pointer; font:700 .75rem/1.35 var(--font-body); transition:background-color 150ms ease,border-color 150ms ease,transform 120ms var(--ease-out); }
.cd-gold-action { padding:10px 20px; border:1px solid #c9a760; border-radius:4px; color:#fff7e7; background:linear-gradient(110deg,#936724,#704810); box-shadow:inset 0 1px 0 rgba(255,234,183,.25); }
.cd-text-action { padding:5px 0; border:0; background:none; color:var(--gold-bright); white-space:nowrap; }
.cd-outline { padding:10px 20px; border:1px solid color-mix(in oklch,var(--gold) 58%,transparent); border-radius:4px; color:var(--text); background:transparent; }
.cd-arrow { font-size:1.1rem; font-weight:400; }
.cd-runner { padding:14px 17px 12px 76px; display:flex; flex-direction:column; justify-content:space-between; gap:9px; }
.cd-runner .cd-leader-rank { top:20px; left:14px; color:var(--gold); }
.cd-runner .cd-leader-cover { height:75px; border-radius:3px; }
.cd-runner .cd-leader-body { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:7px 12px; align-items:end; }
.cd-runner .cd-leader-identity { grid-column:1 / -1; display:flex; gap:12px; align-items:center; }
.cd-runner .creator-avatar { flex:none; width:48px; height:48px; border:2px solid color-mix(in oklch,var(--gold) 70%,transparent); }
.cd-runner .cd-identity h3 { font-size:1.1rem; margin-bottom:5px; }
.cd-runner .cd-supporters { display:flex; align-items:center; gap:8px; padding-top:3px; }
.cd-runner .cd-supporters strong { font-size:1.65rem; }
.cd-runner .cd-supporters>span { max-width:65px; font-size:.56rem; }
.cd-runner .cd-text-action { min-height:38px; font-size:.68rem; gap:10px; }
.cd-directory-body { display:grid; grid-template-columns:minmax(0,1fr); gap:28px; align-items:start; }
.cd-directory-body.has-discovery { grid-template-columns:minmax(0,1.56fr) minmax(0,1fr); }
.cd-board { min-width:0; }
.cd-board-heading { display:flex; align-items:end; justify-content:space-between; gap:12px; padding-bottom:12px; border-bottom:1px solid var(--line); }
.cd-board-heading p { margin:6px 0 0; color:var(--muted); font-size:.73rem; }
.cd-directory-body:not(.has-discovery) .cd-board-heading { justify-content:flex-end; }
.cd-directory-body:not(.has-discovery) .cd-board-heading>div { display:none; }
#creator-count { max-width:155px; color:var(--muted); font:500 .62rem/1.5 var(--font-body); text-align:right; }
.cd-rows { display:grid; margin:0; padding:0; list-style:none; }
.cd-row { display:grid; grid-template-columns:46px minmax(0,1fr) auto; align-items:center; gap:13px; min-width:0; padding:13px 3px; border-bottom:1px solid var(--cd-line); }
.cd-rows.is-ranked .cd-row { grid-template-columns:24px 44px minmax(0,1fr) 68px auto; gap:12px; }
.cd-row-rank { color:var(--gold); font:500 1.23rem var(--font-display); font-variant-numeric:tabular-nums; }
.cd-row .creator-avatar { width:44px; height:44px; flex:none; border:1px solid var(--cd-line); }
.cd-row .cd-identity h3 { font-size:.88rem; margin-bottom:5px; }
.cd-row .cd-supporters { text-align:right; }
.cd-row .cd-supporters strong { font:700 .8rem var(--font-body); letter-spacing:0; }
.cd-row .cd-supporters>span { font-size:.54rem; }
.cd-row .cd-text-action { font-size:.64rem; gap:6px; }
.cd-row .creator-chip { font-size:.61rem; padding:4px 6px; min-height:28px; }
.cd-new-partners { position:relative; min-width:0; padding:24px; border:1px solid color-mix(in oklch,var(--gold) 45%,transparent); border-top:4px solid var(--gold); border-radius:5px; background:var(--cd-paper); }
.cd-new-partners .eyebrow { font-size:.57rem; letter-spacing:.24em; margin:0 0 8px; }
.cd-new-partners h2 { font-size:1.8rem; }
.cd-new-partners>p:not(.eyebrow) { margin:8px 0 14px; color:var(--muted); font-size:.74rem; line-height:1.6; }
.cd-new-row { display:grid; grid-template-columns:48px minmax(0,1fr) auto; align-items:center; gap:12px; padding:14px 0; border-bottom:1px solid var(--cd-line); }
.cd-new-row:last-child { border:0; }
.cd-new-row .creator-avatar { width:48px; height:48px; border:1px solid var(--line); }
.cd-new-row .cd-identity h3 { font-size:.88rem; margin:6px 0; }
.cd-new-badge { display:inline-block; padding:2px 5px; border-radius:3px; color:var(--gold); background:color-mix(in oklch,var(--gold) 12%,transparent); font:700 .5rem/1.2 var(--font-body); text-transform:uppercase; letter-spacing:.04em; }
.cd-new-row .cd-text-action { font-size:.62rem; gap:7px; }
.cd-new-partners>.cd-outline { width:100%; margin-top:18px; font-size:.72rem; }
.cd-pagination { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:12px; margin-top:18px; }
.cd-pagination p { margin:0; color:var(--muted); font-size:.68rem; }
.cd-pagination .cd-outline { font-size:.7rem; }
.cd-footer { display:flex; align-items:center; justify-content:space-between; gap:24px; padding:22px 0; border-top:1px solid var(--line); }
.cd-footer>a { display:flex; gap:10px; align-items:center; font:700 1.5rem var(--font-display); color:var(--text); text-decoration:none; }
.cd-footer p { color:var(--muted); font-size:.59rem; letter-spacing:.1em; text-transform:uppercase; text-align:right; }
.is-directory :is(button,a,select):focus-visible { outline:2px solid var(--gold); outline-offset:4px; }
.cd-gold-action:active,.cd-outline:active,.cd-text-action:active { transform:scale(.98); }
@media(hover:hover) and (pointer:fine) {
  .is-directory .creator-chip-link:hover { border-color:var(--gold); background:color-mix(in oklch,var(--gold) 12%,var(--panel)); }
  .cd-winner .creator-chip-link:hover { border-color:#edcf8f; background:rgba(255,255,255,.1); }
  .cd-gold-action:hover { color:#fff; background:#8c641f; }
  .cd-outline:hover { background:color-mix(in oklch,var(--gold) 10%,transparent); }
  .cd-text-action:hover,.cd-name:hover { text-decoration:underline; text-underline-offset:4px; }
  .cd-tabs button:hover { color:var(--text); }
}
@media(max-width:1100px) {
  .cd-toolbar { grid-template-columns:1fr 240px; gap:12px; }
  .cd-tabs { grid-column:1 / -1; }
  .cd-tabs button { flex:1; }
  .cd-spotlight,.cd-directory-body.has-discovery { grid-template-columns:minmax(0,1.25fr) minmax(0,1fr); }
  .cd-winner .cd-leader-body { grid-template-columns:minmax(0,1fr) auto; padding:0 20px 20px; gap:15px; }
  .cd-winner .cd-leader-identity { grid-column:1 / -1; grid-row:auto; }
  .cd-winner .cd-supporters { text-align:left; }
  .cd-winner .cd-supporters strong { font-size:2.4rem; }
  .cd-runner { padding-left:61px; }
  .cd-runner .cd-leader-rank { left:10px; }
  .cd-runner .cd-leader-rank strong { font-size:2.4rem; }
  .cd-runner .cd-leader-body { grid-template-columns:1fr; }
  .cd-runner .cd-text-action { justify-self:start; min-height:30px; }
  .cd-rows.is-ranked .cd-row { grid-template-columns:24px 40px minmax(0,1fr) auto; }
  .cd-row .cd-supporters { display:none; }
  .cd-new-partners { padding:20px 16px; }
  .cd-new-row { grid-template-columns:40px minmax(0,1fr); }
  .cd-new-row .creator-avatar { width:40px; height:40px; }
  .cd-new-row>.cd-text-action { grid-column:2; justify-self:start; min-height:30px; }
}
@media(max-width:760px) {
  .cd-row .cd-identity { display:block; }
  .cd-row .cd-identity .creator-region { margin-top:8px; }
  .creator-page.is-directory .shell,.creator-page.is-directory .nav-shell,.creator-page.is-directory .creator-browser { width:calc(100% - 36px); }
  .cd-masthead { padding:35px 0 25px; }
  .cd-masthead-inner { flex-direction:column; align-items:start; gap:22px; }
  .cd-masthead h1 { font-size:clamp(2.25rem,7vw,3.1rem); }
  .cd-masthead .eyebrow { font-size:.57rem; letter-spacing:.17em; margin-bottom:13px; }
  .cd-benefit { flex:auto; width:100%; padding:13px 16px; gap:14px; }
  .cd-benefit>div { display:grid; grid-template-columns:auto minmax(0,1fr); column-gap:15px; align-items:center; }
  .cd-benefit strong { grid-row:1 / 3; font-size:1.5rem; }
  .cd-benefit span { font-size:.67rem; }
  .cd-benefit small { margin:0; font-size:.57rem; }
  .cd-benefit svg { width:27px; }
  .cd-toolbar { grid-template-columns:minmax(0,1fr) 132px; gap:12px; margin-bottom:25px; padding-top:10px; }
  .cd-tabs { gap:7px; }
  .cd-tabs button { font-size:.7rem; min-height:48px; }
  .cd-search { padding:0 10px; gap:8px; }
  .cd-search input,.cd-platform select { font-size:16px; }
  .cd-platform select { padding:0 8px; }
  .cd-section-heading { flex-direction:column; align-items:start; gap:7px; }
  .cd-section-heading h2 { font-size:1.7rem; }
  .cd-section-heading p { font-size:.65rem; }
  .cd-spotlight { grid-template-columns:minmax(0,1fr); grid-template-rows:auto; gap:12px; margin-bottom:22px; }
  .cd-winner { grid-row:auto; min-height:380px; }
  .cd-winner .cd-leader-cover { height:190px; }
  .cd-winner .cd-leader-body { grid-template-columns:minmax(0,1fr) auto; padding:0 20px 20px; }
  .cd-winner .creator-avatar { width:68px; height:68px; margin-top:-27px; margin-bottom:10px; }
  .cd-winner .cd-identity h3 { font-size:1.6rem; }
  .cd-winner .cd-supporters strong { font-size:2.45rem; }
  .cd-winner .cd-gold-action { padding:10px 14px; gap:10px; font-size:.72rem; }
  .cd-runner { padding:13px 15px 12px 69px; gap:10px; }
  .cd-runner .cd-leader-rank { left:15px; }
  .cd-runner .cd-leader-cover { height:70px; }
  .cd-runner .cd-leader-body { grid-template-columns:minmax(0,1fr) auto; gap:7px 10px; }
  .cd-runner .cd-text-action { min-height:44px; justify-self:end; }
  .cd-runner .cd-supporters strong { font-size:1.5rem; }
  .cd-directory-body.has-discovery { grid-template-columns:minmax(0,1fr); gap:25px; }
  .cd-new-partners { order:-1; padding:20px; }
  .cd-new-partners h2 { font-size:1.7rem; }
  .cd-new-row { grid-template-columns:42px minmax(0,1fr) auto; gap:12px; padding:10px 0; }
  .cd-new-row>.cd-text-action { grid-column:auto; min-height:44px; font-size:.63rem; }
  .cd-new-partners>.cd-outline { margin-top:12px; }
  .cd-row .cd-text-action { gap:6px; font-size:.63rem; }
  .cd-row .cd-identity h3 { font-size:.82rem; }
  .cd-rows.is-ranked .cd-row { gap:9px; grid-template-columns:23px 38px minmax(0,1fr) auto; }
  .cd-row .creator-avatar { width:38px; height:38px; }
  #creator-count { max-width:110px; font-size:.55rem; }
  .cd-footer { padding:20px 0; gap:20px; }
  .cd-footer p { max-width:170px; line-height:1.6; font-size:.51rem; }
}
@media(pointer:coarse) { .is-directory .creator-chip-link { min-height:44px; } }
@media(prefers-reduced-motion:reduce) { .cd-gold-action,.cd-outline,.cd-text-action,.is-directory .creator-chip-link { transition:none; } }
