/* /social/youtube2 (2026-11-07): only the blocks the homepage CSS (home-v1 + home-v2) does not have. Loaded after home-v2.css. */

/* channel initials avatars (no channel art is used) */
.yt2-av{display:inline-grid;place-items:center;flex:none;border-radius:50%;color:#fff;font:700 10px/1 Geist,system-ui;letter-spacing:.02em;background:hsl(var(--h) 45% 38%)}
.yt2-av.sm{width:22px;height:22px;font-size:9px;margin-right:6px}
.yt2-av.lg{width:56px;height:56px;font-size:18px;box-shadow:0 0 0 3px var(--line)}
.ph2-hstrip-row a{display:inline-flex;align-items:center}

/* strip: channel name with its subscriber count underneath */
.pv.ph .ph2-strip.yt2-strip .ph-nr-b .yt2-nm{display:flex;flex-direction:column;align-items:flex-start;min-width:0;line-height:1.15;text-align:left}
.pv.ph .ph2-strip.yt2-strip .ph-nr-b .yt2-nm small{display:block;font-size:12px;font-weight:500;color:var(--mute);margin-top:3px;letter-spacing:0}
.pv.ph .ph2-strip.yt2-strip .ph-nr-b .yt2-av{display:inline-grid;place-items:center;padding:0;line-height:1;text-align:center;width:34px;height:34px;font-size:12px;font-weight:700;color:#fff;letter-spacing:.02em}
@media (max-width:900px){.pv.ph .ph2-strip.yt2-strip .ph-nr-b .yt2-av{width:26px;height:26px;font-size:10px}}

/* channel card: activity numbers */
.yt2-cst{list-style:none;margin:4px 0 14px;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.yt2-cst li{display:flex;flex-direction:column;gap:2px;padding:12px 14px;border:1px solid var(--line);border-radius:12px;background:var(--bg)}
.yt2-cst b{font-size:20px;font-weight:800;letter-spacing:-.02em;color:var(--ink)}
.yt2-cst span{font-size:12.5px;color:var(--mute)}

/* locked business contact row (never a real address) */
.yt2-lock{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:12px;border:1px dashed var(--line);background:var(--bg)}
.yt2-lock iconify-icon{font-size:18px;color:var(--mute);flex:none}
.yt2-lock span{display:flex;flex-direction:column;min-width:0;flex:1}
.yt2-lock b{font-size:14px;color:var(--ink)}
.yt2-lock small{font-size:12px;color:var(--mute)}
.yt2-lock em{font-style:normal;font-family:'Geist Mono',monospace;font-size:12.5px;color:var(--faint);filter:blur(.6px);white-space:nowrap}
.yt2-ch .ph2-pr-more a{color:inherit;text-decoration:underline;text-underline-offset:2px}


/* coverage card: one bar per subscriber range, then channel names with subscribers */
.yt2-cov-bands{list-style:none;margin:16px 0 4px;padding:0;display:flex;flex-direction:column;gap:7px}
.yt2-cov-bands li{display:grid;grid-template-columns:96px 1fr auto;align-items:center;gap:10px;font-size:12.5px;color:#cbd5e1}
.yt2-cov-bands i{display:block;height:7px;border-radius:99px;background:rgba(255,255,255,.08);overflow:hidden}
.yt2-cov-bands s{display:block;height:100%;border-radius:99px;background:rgba(255,255,255,.62);transition:width .6s cubic-bezier(.2,.8,.2,1)}
.yt2-cov-bands b{font-weight:700;color:#f1f5f9;min-width:48px;text-align:right}
.ph2-cov-outs .yt2-subs{margin-left:auto;flex:none;font-size:11.5px;color:#94a3b8;white-space:nowrap}

/* channel avatars (local copies): round like YouTube, no padding */
img.yt2-av{object-fit:cover;padding:0;background:var(--card)}
.ph2-fav.yt2-round{border-radius:50%!important}
img.ph2-fav.yt2-round{padding:0!important;object-fit:cover}
.pv.ph .ph2-strip.yt2-strip .ph-nr-b img.yt2-av{display:block;border-radius:50%}

/* ---- 2026-11-07 round 2 (Ryan): YouTube icons above the fold, subtle YouTube color, green only on revenue CTAs ---- */
.yt2-ic{color:#ff0033;vertical-align:-2px;font-size:1.15em}
.pv.ph.ph-yt2 .pv-eyebrow{color:var(--mute)}
.pv.ph.ph-yt2 .ph-offer-l .pv-eyebrow{color:#94a3b8}
.pv.ph.ph-yt2 .ph2-out-num b{background:none;-webkit-background-clip:border-box;background-clip:border-box;color:var(--ink)}
.pv.ph.ph-yt2 .ph2-press-stats iconify-icon{color:var(--mute)}
.pv.ph.ph-yt2 .ph2-press-stats li:first-child iconify-icon{color:#ff0033}
/* hero pill + bullets */
.pv.ph.ph-home.ph-yt2 .ph-hero .pv-pill.yt2-pill{background:rgba(255,255,255,.07);color:#e2e8f0;box-shadow:inset 0 0 0 1px rgba(255,255,255,.14)}
.pv-pill.yt2-pill iconify-icon{color:#ff0033;font-size:17px}
.pv.ph.ph-yt2 .yt2-micro li::before{content:none}
.pv.ph.ph-yt2 .yt2-micro li{display:inline-flex;align-items:center;gap:6px}
.pv.ph.ph-yt2 .yt2-micro iconify-icon{font-size:14px;color:#94a3b8}
.pv.ph.ph-yt2 .yt2-micro iconify-icon.yt{color:#ff0033;font-size:15px}

/* audience size tiles: real dashboard screenshot on top, then the count; neutral colors */
.yt2-band-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;margin-top:34px}
.yt2-band{display:flex;flex-direction:column;overflow:hidden;border:1px solid var(--line);border-radius:18px;background:var(--card);color:var(--ink);text-decoration:none;
  box-shadow:0 1px 2px rgba(15,23,42,.04);transition:transform .18s,box-shadow .18s,border-color .18s}
.yt2-band:hover{transform:translateY(-3px);border-color:rgba(15,23,42,.18);box-shadow:0 18px 40px -18px rgba(15,23,42,.35)}
.dark .yt2-band:hover{border-color:rgba(255,255,255,.22)}
.yt2-band-shot{display:block;height:150px;background-image:var(--l);background-size:235%;background-position:64% 44%;background-repeat:no-repeat;border-bottom:1px solid var(--line);position:relative}
.dark .yt2-band-shot{background-image:var(--d)}
.yt2-band-shot::after{content:"";position:absolute;inset:auto 0 0 0;height:40px;background:linear-gradient(transparent,var(--card))}
.yt2-band-b{display:flex;flex-direction:column;gap:3px;padding:16px 18px 18px}
.yt2-band-tag{display:inline-flex;align-items:center;gap:8px;font-size:12.5px;font-weight:600;color:var(--mute);margin-bottom:6px}
.yt2-bars{display:inline-flex;align-items:flex-end;gap:2px;height:14px}
.yt2-bars i{display:block;width:4px;border-radius:2px;background:var(--line)}
.yt2-bars i:nth-child(1){height:5px}.yt2-bars i:nth-child(2){height:8px}.yt2-bars i:nth-child(3){height:11px}.yt2-bars i:nth-child(4){height:14px}
.yt2-bars[data-n="1"] i:nth-child(-n+1),.yt2-bars[data-n="2"] i:nth-child(-n+2),.yt2-bars[data-n="3"] i:nth-child(-n+3),.yt2-bars[data-n="4"] i{background:#ff0033}
.pv.ph.ph-yt2 .yt2-band b{font-size:30px;font-weight:800;letter-spacing:-.03em;line-height:1.1;color:var(--ink)}
.yt2-band-sub{font-size:13px;color:var(--mute)}
.yt2-band-fit{font-size:14px;color:var(--ink);margin-top:8px;opacity:.85}
.yt2-band em{display:inline-flex;align-items:center;gap:6px;font-style:normal;font-size:13.5px;font-weight:600;color:var(--ink);margin-top:12px}
.yt2-band:hover em iconify-icon{transform:translateX(3px)}
.yt2-band em iconify-icon{transition:transform .18s}
@media (max-width:1000px){.yt2-band-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:520px){.yt2-band-grid{grid-template-columns:1fr}.yt2-band-shot{height:130px}}

/* ---- round 4 (2026-11-08, Ryan): strip back to 2 rows of 5 (a little bigger) ---- */
.pv.ph .ph2-strip.yt2-strip .ph2-set{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:16px 18px;justify-items:start}
.pv.ph .ph2-strip.yt2-strip .ph-nr-b{font-size:18px;gap:12px}
.pv.ph .ph2-strip.yt2-strip .ph-nr-b .yt2-av{width:40px;height:40px;font-size:13px}
@media (max-width:1100px){.pv.ph .ph2-strip.yt2-strip .ph2-set{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:900px){.pv.ph .ph2-strip.yt2-strip .ph2-set{grid-template-columns:repeat(2,minmax(0,1fr))}
  .pv.ph .ph2-strip.yt2-strip .ph-nr-b .yt2-av{width:28px;height:28px;font-size:10px}.pv.ph .ph2-strip.yt2-strip .ph-nr-b{font-size:15px}}
/* ---- round 5 (2026-11-08): channels section sits right under the promise card (no dark band to straddle any more) ---- */
.pv.ph.ph-yt2 .ph2-promise{margin-bottom:0}
.pv.ph.ph-yt2 .ph2-promise + .yt2-ch{padding-top:72px}
@media (max-width:640px){.pv.ph.ph-yt2 .ph2-promise + .yt2-ch{padding-top:48px}}
/* ---- round 6 (2026-11-08, Ryan): phone channel marquee = two rows, opposite directions, much slower (was one row, 60s for 50 channels) ---- */
.ph2-hstrip-row.yt2-hrow{animation-duration:130s;padding:0 8px 0 0}   /* right padding = the 8px gap, so -50% lands exactly on the copy: no jump */
.ph2-hstrip-row.yt2-hrow.rev{animation-direction:reverse}
.ph2-hstrip-wrap + .ph2-hstrip-wrap{margin-top:8px}
/* round 7 (2026-11-08): channel faces + YouTube badge on audience tiles, avatars in the AI panel, YouTube mark in the tour bar */
.yt2-faces{position:absolute;left:12px;bottom:10px;z-index:1;display:inline-flex;align-items:center;padding:3px 4px 3px 3px;border-radius:999px;background:var(--card);border:1px solid var(--line);box-shadow:0 6px 16px -8px rgba(15,23,42,.35)}
.yt2-faces img{width:26px;height:26px;border-radius:50%;object-fit:cover;border:2px solid var(--card);background:var(--card);margin-left:-8px}
.yt2-faces img:first-child{margin-left:0}
.yt2-faces i{display:grid;place-items:center;width:26px;height:26px;margin-left:-6px;border-radius:50%;background:var(--card);color:#ff0033;font-size:16px;font-style:normal}
.yt2-band:nth-child(even) .yt2-faces{left:auto;right:12px}
.ph2-aip-rows img.av.yt2-aiav{display:block;border-radius:50%;object-fit:cover;background:#1e293b}
.ph2-aip-h small{display:inline-flex;align-items:center;gap:5px}
.pv.ph.ph-yt2 .ph2-aip-h small{color:#cbd5e1}  /* round 9: brighter label on the navy panel (home-v2 .pv.ph rule was #64748b) */