/* 30PICK'EM — Brand Extensions v1 (0.9.44)
   Card-tier identity: 30PICK’EM+ (31–39) + Super Card (40–50), plus commissioner-controlled Steel City Sports house promos.
   Loaded after premium-system-v1.css. No GOTW selectors are changed here. */

:root{
  --scs-gold:var(--ps-gold,#e9c264);
  --scs-gold-2:var(--ps-gold-2,#ffe29a);
  --scs-cyan:var(--ps-cyan,#4cc3ff);
  --scs-text:var(--ps-text,#f4f8fc);
  --scs-muted:var(--ps-muted,#93a4b8);
  --scs-line:var(--ps-line,rgba(148,178,214,.19));
  --scs-hair:var(--ps-hair,rgba(148,178,214,.12));
}

/* ======================================================================
   Steel City Sports house promo
   Informational only while Saturday Ops / Early Line are in testing.
   ====================================================================== */
.scPromo{
  position:relative;
  display:flex;
  flex-direction:column;
  gap:10px;
  min-width:0;
  padding:12px 13px 13px;
  border:1px solid var(--scs-line);
  border-radius:14px;
  overflow:hidden;
  background:
    radial-gradient(80% 120% at 100% 0%,rgba(76,195,255,.08),transparent 62%),
    linear-gradient(180deg,rgba(13,24,40,.96),rgba(7,14,25,.98));
  box-shadow:0 10px 26px rgba(0,0,0,.24),inset 0 1px 0 rgba(255,255,255,.035);
  color:var(--scs-text);
}
.scPromo:before{
  content:"";
  position:absolute;
  left:0;top:0;bottom:0;
  width:2px;
  background:linear-gradient(180deg,var(--scs-cyan),rgba(76,195,255,.08));
  opacity:.8;
}
.scPromo--early-line:before{
  background:linear-gradient(180deg,var(--scs-gold),rgba(233,194,100,.08));
}
.scPromoTop{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  min-width:0;
  font-family:'Oswald','Barlow Condensed',sans-serif;
  font-size:10.5px;
  font-weight:600;
  line-height:1;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--scs-muted);
}
.scPromoTop>span{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.scPromoTop em{
  flex:0 0 auto;
  padding:3px 7px;
  border:1px solid var(--scs-gold-line,rgba(233,194,100,.42));
  border-radius:999px;
  background:rgba(233,194,100,.07);
  color:var(--scs-gold-2);
  font-style:normal;
  font-size:9.5px;
  letter-spacing:.11em;
}
.scPromoMain{
  display:flex;
  align-items:center;
  gap:11px;
  min-width:0;
}
.scPromoMark{
  flex:0 0 42px;
  width:42px;
  height:42px;
  display:grid;
  place-items:center;
  border:1px solid rgba(76,195,255,.34);
  border-radius:11px;
  background:
    radial-gradient(circle at 35% 25%,rgba(76,195,255,.20),transparent 58%),
    rgba(6,15,28,.9);
  color:#bfe7ff;
  font-family:'Oswald','Barlow Condensed',sans-serif;
  font-size:17px;
  font-weight:700;
  letter-spacing:.04em;
}
.scPromo--early-line .scPromoMark{
  border-color:rgba(233,194,100,.38);
  background:
    radial-gradient(circle at 35% 25%,rgba(233,194,100,.18),transparent 58%),
    rgba(18,14,7,.88);
  color:var(--scs-gold-2);
}
.scPromoMain>div{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:3px;
}
.scPromoMain b{
  font-family:'Oswald','Barlow Condensed',sans-serif;
  font-size:17px;
  font-weight:700;
  line-height:1;
  letter-spacing:.045em;
  color:var(--scs-text);
}
.scPromoMain small{
  max-width:540px;
  font-size:11.5px;
  font-weight:600;
  line-height:1.35;
  color:var(--scs-muted);
}

/* v0.9.49 polish — art-present promos: the approved creative is the whole
   surface. Natural ratio (~3:1), never cropped, no repeated name/tagline;
   the disclosure appears exactly once as a slim footer strip. */
.scPromo.hasArt{
  gap:0;
  padding:0;
  border-color:rgba(148,178,214,.16);
  border-radius:14px;
  background:#06101c;
  box-shadow:0 8px 22px rgba(0,0,0,.26),inset 0 1px 0 rgba(255,255,255,.04);
}
.scPromo.hasArt:before{z-index:2}
.scPromoMedia{
  position:relative;
  margin:0;
  overflow:hidden;
  background:#081321;
  line-height:0;
}
.scPromoMedia img{
  display:block;
  width:100%;
  height:auto;
  max-width:none;
  object-fit:contain;
}
/* The Saturday Ops source carries a 5px white letterbox top and bottom
   (480x160). A 480:148 cover box trims those rows plus one more each side so
   resampling cannot bleed the white back in — no horizontal
   crop, so the creative and its CTA stay whole. Display-only; art unchanged. */
.scPromo--saturday-ops .scPromoMedia img{aspect-ratio:480/148;object-fit:cover}
.scPromoFoot{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  min-width:0;
  padding:6px 11px 6px 12px;
  border-top:1px solid var(--scs-hair);
  background:linear-gradient(180deg,rgba(9,19,33,.98),rgba(5,12,22,.99));
  font-family:'Oswald','Barlow Condensed',sans-serif;
  font-size:9px;
  font-weight:600;
  line-height:1;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:rgba(147,164,184,.82);
}
.scPromoFoot>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.scPromoFoot em{
  flex:0 0 auto;
  font-style:normal;
  letter-spacing:.14em;
  color:rgba(255,226,154,.78);
}
.scPromoFoot em:before{
  content:"";
  display:inline-block;
  width:5px;height:5px;
  margin:0 6px 1px 0;
  border-radius:50%;
  background:var(--scs-gold);
  box-shadow:0 0 6px rgba(233,194,100,.55);
  vertical-align:middle;
}
#home .hv3>.scPromo{margin:0}
#hub .scPromo{margin-top:12px}
#picks .pv3PromoSlot{margin:8px 0 2px}
#picks .pv3PromoSlot .scPromo{margin:0}
#modalSheet .scPromoSettings .stv1CardHead{align-items:center}
#modalSheet .scPromoSettingsIco{
  font-family:'Oswald','Barlow Condensed',sans-serif;
  font-size:12px;
  font-weight:700;
  letter-spacing:.06em;
  color:var(--scs-gold-2);
}

/* ======================================================================
   Super Card — special-week identity, not a separate theme.
   ====================================================================== */
html.super-card-active #weekPill.superCardWeekPill{
  min-width:86px!important;
  border-color:rgba(233,194,100,.66)!important;
  background:
    radial-gradient(100% 120% at 50% 0%,rgba(233,194,100,.16),transparent 60%),
    linear-gradient(180deg,rgba(42,31,8,.96),rgba(12,15,22,.98))!important;
  box-shadow:0 0 0 1px rgba(233,194,100,.12) inset,0 10px 24px rgba(0,0,0,.25)!important;
}
#weekPill.superCardWeekPill .weekLabel{color:var(--scs-gold-2)!important}
#weekPill.superCardWeekPill .weekNum{
  display:block;
  color:#fff!important;
  font-size:21px!important;
  line-height:1!important;
}
#weekPill.superCardWeekPill small{
  display:block;
  margin-top:2px;
  font-family:'Oswald','Barlow Condensed',sans-serif;
  color:var(--scs-gold-2);
  font-size:8.5px;
  font-weight:600;
  letter-spacing:.11em;
  line-height:1;
  text-transform:uppercase;
}

/* Picks week rail */
#picks .pv3Chrome.is-super .pv3Week{
  position:relative;
  overflow:hidden;
  border-color:rgba(233,194,100,.66)!important;
  background:
    linear-gradient(145deg,rgba(255,226,154,.035) 0 1px,transparent 1px 12px),
    radial-gradient(90% 120% at 20% 0%,rgba(233,194,100,.17),transparent 62%),
    radial-gradient(65% 90% at 100% 10%,rgba(76,195,255,.09),transparent 70%),
    linear-gradient(180deg,rgba(25,28,36,.99),rgba(7,14,24,.99))!important;
  box-shadow:0 12px 28px rgba(0,0,0,.32),inset 0 1px 0 rgba(255,235,180,.10)!important;
}
#picks .pv3Chrome.is-super .pv3Week:before{
  content:"";
  position:absolute;
  left:10px;
  right:10px;
  top:0;
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(76,195,255,.72),rgba(255,226,154,.95),rgba(76,195,255,.60),transparent);
}
#picks .pv3Chrome.is-super .pv3WeekLabel{
  color:var(--scs-gold-2)!important;
  letter-spacing:.055em;
}
#picks .pv3Chrome.is-super .pv3WeekCount{color:#fff!important}
#picks .pv3Chrome.is-super .pv3Progress{
  background:rgba(233,194,100,.12)!important;
}
#picks .pv3Chrome.is-super .pv3Progress>i{
  background:linear-gradient(90deg,#c99a32 0%,#ffe29a 48%,#68c9ff 100%)!important;
  box-shadow:none!important;
}

/* ======================================================================
   Super Card integration system — v2 approved asset family (Oct 2 2026).
   The artwork never carries a pick count; counts live in functional UI.
   Only rendered when isSuperCard() is true (40–50 picks). 30PICK’EM+ never
   uses any of it.

   Four transparent-backed lockups, one per surface shape (.scArt):
   01 .scArt--hero      primary hero         Hub; reveal teaser (Hub)
   02 .scArt--banner    horizontal banner    Picks, builder, preflight, publish, reveal strip
   03 .scArt--emblem    compact emblem       Home CTA badge
   04 .scArt--complete  complete vertical    Card Complete
   + .scCampaign        teaser band          early (no mark) / reveal
   The art is never framed, rounded or clipped, and never re-wrapped in
   HTML copy it already carries (PRESENTS, tagline).
   ====================================================================== */
:root{
  --sc-gold:#f1c865;
  --sc-gold-hi:#ffd46e;
  --sc-cyan:#61d5ff;
  --sc-ink:#eef3f8;
  --sc-rule:linear-gradient(90deg,transparent,rgba(76,195,255,.75) 22%,rgba(255,226,154,.95) 50%,rgba(76,195,255,.65) 78%,transparent);
  --sc-art-shadow:drop-shadow(0 8px 14px rgba(0,0,0,.5));
  --sc-chamfer:12px;
}

/* 30 Hub — weekly feature card shell for Super Card weeks. The 01 hero
   sits on its top edge (see the v2 block at the end of this file). */
#hub .hubWeekFeature.is-super{
  position:relative;
  isolation:isolate;
  overflow:visible!important;
  margin-top:30px;
  border-color:rgba(233,194,100,.50)!important;
  background:
    radial-gradient(85% 60% at 0 30%,rgba(233,194,100,.10),transparent 62%),
    radial-gradient(75% 60% at 100% 40%,rgba(76,195,255,.08),transparent 66%),
    linear-gradient(180deg,#07101d 0%,#080f19 100%)!important;
  box-shadow:
    0 18px 42px rgba(0,0,0,.38),
    0 0 0 1px rgba(233,194,100,.08) inset,
    inset 0 1px 0 rgba(255,238,190,.10)!important;
}
#hub .hubWeekFeature.is-super>.hubWeekGlow{display:none}
#hub .hubWeekFeature.is-super .hubWeekStatus{
  border-color:rgba(233,194,100,.34)!important;
  background:rgba(233,194,100,.06)!important;
}
#hub .hubSuperEyebrow{color:var(--scs-gold-2)!important}
#hub .hubSuperTitle{color:#eef3f8!important}

/* Commissioner builder / preflight / publish — one compact strip, no frame.
   The tools stay tools; the strip only confirms the event identity. */
#modalSheet .scBuilderFormat.is-super{border-color:rgba(233,194,100,.42)!important}
#modalSheet .scSizeHint{
  margin-top:8px;
  font-size:11.5px;
  font-weight:600;
  line-height:1.35;
  color:var(--scs-muted);
}
#modalSheet .scSizeHint b{
  font-family:'Oswald','Barlow Condensed',sans-serif;
  font-weight:700;
  letter-spacing:.1em;
}
#modalSheet .scSizeHint-super b{color:var(--scs-gold-2)}
#modalSheet .scSizeHint-std b{color:#cfd8e2}
#modalSheet .scSizeHint-bad{color:#ffb86b}

/* Standings: one quiet Super Card tag in the selected week's subtitle. */
#standings .sv3SuperTag{
  display:inline-block;
  padding:1px 6px;
  border:1px solid rgba(233,194,100,.38);
  border-radius:5px;
  background:rgba(233,194,100,.07);
  color:var(--scs-gold-2);
  font-family:'Oswald','Barlow Condensed',sans-serif;
  font-size:.86em;
  font-weight:600;
  letter-spacing:.08em;
  line-height:1.35;
  text-transform:uppercase;
  vertical-align:1px;
}

/* Completion moment — calm, premium success state (no poster). */
.cardCompleteMoment.superCardComplete{position:relative;isolation:isolate;padding-top:4px}
.superCardComplete .scCompleteGlow{
  position:absolute;
  left:50%;top:-8px;
  width:min(340px,100%);
  height:170px;
  transform:translateX(-50%);
  z-index:-1;
  pointer-events:none;
  background:
    radial-gradient(42% 50% at 38% 45%,rgba(255,200,80,.20),transparent 72%),
    radial-gradient(42% 50% at 64% 58%,rgba(64,176,255,.20),transparent 72%);
}
.superCardComplete .scCompleteGlow i{
  position:absolute;
  width:6px;height:6px;
  transform:rotate(45deg);
  border-radius:1px;
  background:#ffd46e;
  box-shadow:0 0 8px rgba(255,212,110,.7);
  opacity:.85;
  animation:scSpark 2.6s ease-in-out 1 both;
}
.superCardComplete .scCompleteGlow i:nth-child(1){left:12%;top:30%}
.superCardComplete .scCompleteGlow i:nth-child(2){left:22%;top:72%;width:4px;height:4px;background:#5fcaff;box-shadow:0 0 8px rgba(95,202,255,.7);animation-delay:.15s}
.superCardComplete .scCompleteGlow i:nth-child(3){left:84%;top:26%;width:5px;height:5px;animation-delay:.3s}
.superCardComplete .scCompleteGlow i:nth-child(4){left:90%;top:64%;width:4px;height:4px;background:#5fcaff;box-shadow:0 0 8px rgba(95,202,255,.7);animation-delay:.45s}
.superCardComplete .scCompleteGlow i:nth-child(5){left:6%;top:52%;width:3px;height:3px;animation-delay:.6s}
.superCardComplete .scCompleteGlow i:nth-child(6){left:95%;top:44%;width:3px;height:3px;background:#5fcaff;animation-delay:.75s}
@keyframes scSpark{0%{opacity:0;transform:translateY(6px) rotate(45deg) scale(.6)}40%{opacity:.95}100%{opacity:.8;transform:translateY(0) rotate(45deg) scale(1)}}
.cardCompleteMoment.superCardComplete .scCompleteKicker{color:var(--scs-gold-2)!important;letter-spacing:.16em}
.cardCompleteMoment.superCardComplete .cardCompleteStats{
  border-color:rgba(233,194,100,.30)!important;
  background:linear-gradient(90deg,rgba(233,194,100,.05),rgba(76,195,255,.05))!important;
}
.cardCompleteMoment.superCardComplete .cardCompleteStats b{color:#fff}

/* Preserve motion preferences. */
@media (prefers-reduced-motion:reduce){
  .scPromo{scroll-behavior:auto}
  .superCardComplete .scCompleteGlow i{animation:none}
}

@media (max-width:390px){
  .scPromo{padding:11px 11px 12px}
  .scPromoMark{flex-basis:38px;width:38px;height:38px;font-size:15px}
  .scPromoMain b{font-size:16px}
  .scPromoMain small{font-size:11px}
  .scPromoTop{font-size:10px}
}

/* Builder card-size control: keep the number readable (the shared stv1Pair
   flex row otherwise squeezes the input to a sliver on phones). */
#modalSheet .scBuilderFormat .stv1Row{align-items:center}
#modalSheet .scBuilderFormat .stv1Pair{flex:0 0 auto;flex-direction:row;align-items:center}
#modalSheet .scBuilderFormat .stv1Pair input{
  flex:0 0 72px;
  width:72px!important;
  min-width:72px;
  padding:0 6px!important;
  text-align:center;
  font-size:17px;
  font-weight:700;
}


/* ======================================================================
   30PICK’EM+ — expanded-card tier (31–39 picks).
   Deliberately restrained. It should feel like the main brand with a small
   upgrade, not a mini Super Card.
   ====================================================================== */
html.plus-card-active #weekPill.plusCardWeekPill{
  min-width:86px!important;
  border-color:rgba(76,195,255,.54)!important;
  background:
    radial-gradient(110% 110% at 50% 0%,rgba(76,195,255,.10),transparent 64%),
    linear-gradient(180deg,rgba(9,28,48,.97),rgba(7,13,23,.99))!important;
  box-shadow:0 0 0 1px rgba(76,195,255,.08) inset,0 9px 22px rgba(0,0,0,.22)!important;
}
#weekPill.plusCardWeekPill .weekLabel{color:#b8dff2!important}
#weekPill.plusCardWeekPill .weekNum{display:block;color:#fff!important}
#weekPill.plusCardWeekPill small{
  display:block;margin-top:2px;color:#6fd8ff;
  font-family:'Oswald','Barlow Condensed',sans-serif;
  font-size:8px;font-weight:700;letter-spacing:.08em;line-height:1;text-transform:uppercase;
}
#picks .pv3Chrome.is-plus .pv3Week{
  border-color:rgba(76,195,255,.40)!important;
  background:linear-gradient(180deg,rgba(8,35,60,.94),rgba(4,16,29,.98))!important;
  box-shadow:inset 0 1px 0 rgba(116,220,255,.08)!important;
}
#picks .pv3Chrome.is-plus .pv3WeekLabel{color:#80ddff!important}
#picks .pv3Chrome.is-plus .pv3Progress>i{
  background:linear-gradient(90deg,#58d4ff,#9de9ff 72%,#e7f8ff)!important;
  box-shadow:0 0 9px rgba(76,195,255,.28);
}
#modalSheet .scSizeHint-plus b{color:#79dcff}
#modalSheet .scBuilderFormat.is-plus,
#modalSheet .plusBuilder .stv1Card{
  border-color:rgba(76,195,255,.24)!important;
}
#modalSheet .plusPublishCount{
  margin:10px 0 14px;padding:10px 12px;border:1px solid rgba(76,195,255,.26);
  border-radius:12px;background:rgba(76,195,255,.055);color:#acdff3;
  font:700 11px/1.35 Inter,system-ui,sans-serif;text-align:center;
}


/* ======================================================================
   5 — Super Card teaser campaign band (preview-only until scheduling is
   approved). A broadcast interruption, not a card: chamfered band (the
   key-art shield geometry), one top rule, no border box, no radius.
   Stages:
     ?sc_teaser=early   -> mystery, no Super Card mark
     ?sc_teaser=reveal  -> mark breaks out above the band + tagline
   ====================================================================== */
.scCampaign{
  position:relative;
  isolation:isolate;
  margin:14px 0;
  padding:17px 18px 16px;
}
.scCampaign:before{
  /* the band itself */
  content:"";
  position:absolute;
  z-index:-2;
  inset:0;
  clip-path:polygon(0 var(--sc-chamfer),var(--sc-chamfer) 0,100% 0,100% calc(100% - var(--sc-chamfer)),calc(100% - var(--sc-chamfer)) 100%,0 100%);
  background:
    repeating-linear-gradient(165deg,transparent 0 21px,rgba(109,213,255,.018) 21px 22px,transparent 22px 42px),
    radial-gradient(80% 120% at 0 0,rgba(54,164,230,.13),transparent 62%),
    radial-gradient(80% 120% at 100% 100%,rgba(235,190,81,.11),transparent 64%),
    linear-gradient(155deg,rgba(6,24,43,.98),rgba(3,11,21,.99));
  pointer-events:none;
}
.scCampaign:after{
  /* single broadcast rule along the top edge, starting after the chamfer */
  content:"";
  position:absolute;
  z-index:-1;
  top:0;left:var(--sc-chamfer);right:0;
  height:1px;
  background:linear-gradient(90deg,rgba(255,226,154,.85),rgba(76,195,255,.55) 60%,transparent);
  pointer-events:none;
}
.scCampaignScratch{
  position:absolute;z-index:-1;inset:0;overflow:hidden;pointer-events:none;
  clip-path:polygon(0 var(--sc-chamfer),var(--sc-chamfer) 0,100% 0,100% calc(100% - var(--sc-chamfer)),calc(100% - var(--sc-chamfer)) 100%,0 100%);
}
.scCampaignScratch i{
  position:absolute;
  display:block;
  height:3px;
  border-radius:99px;
  transform:rotate(-8deg);
  background:linear-gradient(90deg,transparent,rgba(92,210,255,.76),rgba(255,208,87,.88),transparent);
  filter:blur(.15px);
  opacity:.34;
}
.scCampaignScratch i:nth-child(1){width:44%;right:-4%;top:16%}
.scCampaignScratch i:nth-child(2){width:30%;left:-5%;bottom:22%;transform:rotate(7deg);opacity:.24}
.scCampaignScratch i:nth-child(3){width:18%;right:18%;bottom:10%;height:2px;transform:rotate(-14deg);opacity:.20}
.scCampaignKicker{
  color:var(--sc-gold);
  font:700 10px/1.1 'Oswald','Barlow Condensed',sans-serif;
  letter-spacing:.20em;
  text-transform:uppercase;
}
.scCampaignTitle{
  max-width:460px;
  margin-top:8px;
  color:#f7fbff;
  font:800 30px/.98 'Oswald','Barlow Condensed',sans-serif;
  letter-spacing:-.015em;
  text-transform:uppercase;
}
.scCampaignCopy{margin-top:8px;color:#a9bacb;font:600 12px/1.4 Inter,system-ui,sans-serif}
.scCampaignWhen{
  display:inline-flex;
  margin-top:12px;
  padding:6px 9px;
  border-left:2px solid var(--sc-gold);
  background:rgba(239,201,101,.07);
  color:#f2d789;
  font:700 9px/1 'Oswald','Barlow Condensed',sans-serif;
  letter-spacing:.16em;
}
.scCampaign--early .scCampaignTitle{
  position:relative;
  display:inline-block;
  transform:rotate(-.5deg);
}
.scCampaign--early .scCampaignTitle:after{
  content:"";
  position:absolute;
  left:1%;right:4%;bottom:-6px;height:3px;
  transform:rotate(-1deg);
  border-radius:80% 30% 70% 40%;
  background:linear-gradient(90deg,rgba(92,210,255,.2),rgba(92,210,255,.8),rgba(239,201,101,.65),transparent);
}

/* Reveal: the mark leads and breaks out above the band's top edge. */
.scCampaign--reveal{
  display:flex;
  flex-direction:column;
  align-items:center;
  margin-top:52px;
  padding-top:0;
  text-align:center;
}
.scCampaign--reveal:before{
  background:
    radial-gradient(60% 70% at 50% 0,rgba(56,168,255,.16),transparent 70%),
    linear-gradient(180deg,rgba(4,14,27,.55),rgba(3,10,19,.96)),
    url("assets/super-card/super-card-backdrop-960.webp") center 20%/cover no-repeat,
    #061426;
}
.scCampaign--reveal .scCampaignKicker{color:#e8d3a0}
.scCampaign--reveal .scCampaignCopy{margin-top:8px;color:#b8c5d1}

/* Compact placement (Picks board). */
.scCampaign.is-compact{margin:8px 0 11px;padding:12px 14px}
.scCampaign.is-compact .scCampaignTitle{font-size:23px}
.scCampaign.is-compact .scCampaignCopy{font-size:11px;margin-top:6px}
.scCampaign.is-compact .scCampaignWhen{margin-top:8px}
#hub .scCampaign{margin:0 0 14px}
#hub .scCampaign--reveal{margin-top:46px}
@media(max-width:390px){
  .scCampaign{padding:15px 15px 14px}
  .scCampaignTitle{font-size:27px}
  .scCampaign--reveal{padding-top:0}
}
@media(prefers-reduced-motion:reduce){
  .scCampaign--early .scCampaignTitle{transform:none}
}

/* ======================================================================
   v0.9.49.3-rc4 — Super Card v2 asset system (approved packet, Oct 2 2026)
   One approved lockup per surface shape; presentation only. No tier, pick,
   scoring, missed-pick or tiebreaker behavior changes.
   ====================================================================== */
.scArt{position:relative;display:block;line-height:0}
.scArtImg{display:block;line-height:0}
.scArt img{
  display:block;
  width:100%;
  height:auto;
  margin:0 auto;
  filter:drop-shadow(0 6px 12px rgba(0,0,0,.42));
  -webkit-user-drag:none;
  user-select:none;
}
.scArtCaption{
  margin-top:4px;
  color:var(--sc-gold-hi);
  font:600 11.5px/1.3 'Oswald','Barlow Condensed',sans-serif;
  letter-spacing:.06em;
  text-align:center;
}
/* 02 banner: one unified lockup, light pooled behind it (no box). */
.scArt--banner{width:min(100%,520px);margin:0 auto}
.scArt--banner>.scArtImg{position:relative;isolation:isolate}
.scArt--banner>.scArtImg:before{
  content:"";
  position:absolute;
  z-index:-1;
  inset:8% 4%;
  background:
    radial-gradient(40% 70% at 38% 50%,rgba(255,196,64,.12),transparent 72%),
    radial-gradient(34% 70% at 76% 50%,rgba(56,168,255,.14),transparent 72%);
  filter:blur(6px);
  pointer-events:none;
}
/* 01 hero: allowed to breathe, never wider than its host panel. */
.scArt--hero{width:min(100%,320px);margin:0 auto}
@media(min-width:700px){.scArt--hero{width:min(100%,420px)}}

/* HOME — 03 emblem is the CTA's event badge in the icon slot: bright, full
   opacity, lifted a little over the gold border; the copy keeps full width. */
#home .hv3Cta.is-super{overflow:visible}
#home .hv3Cta.is-super .scEmblem--cta{
  flex:0 0 auto;
  width:63px;
  margin:-12px -2px -8px 0;
  transform:rotate(-4deg);
  pointer-events:none;
}
#home .hv3Cta.is-super .scEmblem--cta img{filter:drop-shadow(0 4px 9px rgba(0,0,0,.55))}
@media(max-width:374px){
  #home .hv3Cta.is-super .scEmblem--cta{width:56px;margin:-10px -2px -8px 0}
}

/* PICKS — 02 banner under the sticky rail, one lockup, edge to edge. */
#picks .pv3SuperBanner{position:relative;z-index:0;margin:6px 0 2px;padding:0 2px}
#picks .pv3SuperBanner .scArt--banner{width:min(92%,424px)}

/* HUB — 01 hero sits on the feature card's top edge: a measured break-out
   (about a fifth of the art), scaled to the card, not bigger than it. */
#hub .hubWeekFeature.is-super>.scArt--hero{
  width:min(68%,222px);
  margin:-42px auto 4px;
}
@media(min-width:700px){#hub .hubWeekFeature.is-super>.scArt--hero{width:min(60%,323px);margin-top:-52px}}

/* COMMISSIONER — compact operational strip; tools stay tools. */
#modalSheet .scBuilderBanner{margin:0 0 12px}
#modalSheet .scBuilderFormat .scBuilderBanner{margin:2px 0 8px}
#modalSheet .scBuilderBanner .scArt--banner{width:min(88%,316px)}

/* CARD COMPLETE — 04 complete vertical leads; approved copy stays as text
   underneath with the count as the strongest element. */
html body #modalSheet .cc3.superCardComplete{padding-top:10px!important}
html body #modalSheet .cc3.superCardComplete .cc3Brand--super{gap:3px!important}
html body #modalSheet .cc3.superCardComplete .scArt--complete{
  position:relative;
  z-index:1;
  width:min(158px,41vw);
  margin:-4px auto 4px;
}
html body #modalSheet .cc3.superCardComplete .scCompleteGlow{top:-10px!important;height:220px!important;opacity:.6!important}
html body #modalSheet .cc3.superCardComplete .scCompleteKicker{font-size:14px!important;letter-spacing:.19em!important;line-height:1.05!important}
/* The 04 art already shows the tagline; keep the text for screen readers only. */
html body #modalSheet .cc3.superCardComplete .cc3SuperTag{
  position:absolute!important;
  width:1px!important;height:1px!important;
  margin:-1px!important;padding:0!important;
  overflow:hidden!important;
  clip:rect(0 0 0 0)!important;clip-path:inset(50%)!important;
  white-space:nowrap!important;border:0!important;
}
html body #modalSheet .cc3.superCardComplete .cc3Result{margin-top:8px!important}
html body #modalSheet .cc3.superCardComplete .cc3Result b{font-size:70px!important}
html body #modalSheet .cc3.superCardComplete .cc3Result b small{font-size:30px!important;color:#879bb1!important}
html body #modalSheet .cc3.superCardComplete .cc3Result>span{margin-top:6px!important}
html body #modalSheet .cc3.superCardComplete .cc3Title{margin:6px auto 12px!important}
html body #modalSheet .cc3.superCardComplete .cc3Meta>div{padding:10px 3px!important}
html body #modalSheet .cc3.superCardComplete .cc3Saved{margin-top:10px!important}
html body #modalSheet .cc3.superCardComplete .cc3Actions{margin-top:12px!important}
@media(max-width:374px){
  html body #modalSheet .cc3.superCardComplete .scArt--complete{width:min(142px,39vw)}
  html body #modalSheet .cc3.superCardComplete .cc3Result b{font-size:62px!important}
  html body #modalSheet .cc3.superCardComplete .cc3Result b small{font-size:27px!important}
}

/* REVEAL TEASER — the lockup leads and breaks out above the band's top
   edge: 02 banner on Home / Picks, 01 hero on the Hub. The art carries the
   tagline, so the band adds only the kicker and one line of copy. */
.scCampaign--reveal{margin-top:34px}
.scCampaign--reveal .scCampaignMark{order:-1;width:100%;margin:-28px 0 6px}
#hub .scCampaign--reveal{margin-top:50px}
#hub .scCampaign--reveal .scCampaignMark{margin-top:-44px}
#hub .scCampaign--reveal .scArt--hero{width:min(62%,222px)}
.scCampaign.is-compact.scCampaign--reveal{margin-top:26px;padding:0 12px 11px}
.scCampaign.is-compact.scCampaign--reveal .scCampaignMark{margin:-22px 0 4px}

/* ======================================================================
   v0.9.49.3-rc6 — Super Card campaign control + Hub hierarchy
   ====================================================================== */
/* HUB (active Super Card weeks only) — the promise headline steps down
   ~17% and gets more air below SUPER CARD • WEEK N, so the hierarchy reads
   hero art → week context → Hub promise → functional content. Standard 30
   and 30PICK’EM+ (no .is-super) are untouched. */
html body #app #hub .hubWeekFeature.is-super .hubWeekTitle.hubWeekPromise{
  margin-top:18px!important;
  gap:3px!important;
  font-size:clamp(22px,6.15vw,25px)!important;
}

/* LEAGUE SETTINGS — Super Card Campaign: compact three-state segmented control. */
#modalSheet .scCampaignSettings .stv1CardHead{align-items:center}
#modalSheet .scCampaignSettingsCopy{
  margin:2px 0 10px;
  color:var(--scs-muted,#9fb0c2);
  font-size:12.5px;
  font-weight:600;
  line-height:1.4;
}
#modalSheet .scCampaignSeg{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:4px;
  padding:4px;
  margin-bottom:10px;
  border:1px solid rgba(190,215,240,.16);
  border-radius:12px;
  background:rgba(4,12,24,.6);
}
#modalSheet .scCampaignSegBtn{
  min-height:38px;
  border:0;
  border-radius:9px;
  background:transparent;
  color:#b9c7d6;
  font:700 12.5px/1 'Oswald','Barlow Condensed',sans-serif;
  letter-spacing:.16em;
  cursor:pointer;
}
#modalSheet .scCampaignSegBtn:focus-visible{outline:2px solid var(--sc-cyan);outline-offset:1px}
#modalSheet .scCampaignSegBtn.is-on{
  background:linear-gradient(180deg,#f3cf72,#d6a542);
  color:#1a1205;
  box-shadow:0 2px 10px rgba(233,194,100,.28),inset 0 1px 0 rgba(255,244,210,.6);
}
#modalSheet .scCampaignSegBtn.is-on[data-stage="off"]{
  background:rgba(190,215,240,.16);
  color:#eef3f8;
  box-shadow:inset 0 0 0 1px rgba(190,215,240,.28);
}
#modalSheet .scCampaignSegBtn:disabled{opacity:.55;cursor:progress}