/* =====================================================================
   30PICK'EM — Hub Player Card v5 (approved 2026-09-25)
   ---------------------------------------------------------------------
   Scope: 30 HUB > Player Card only.
   - Card rules live under #hubResumeBody .pc5 (markup rendered by
     render30HubResume() in app-core.js). Nothing here matches the shared
     .pcHeroCard/.pcStats/.pcCtaCard classes that the Home preview uses.
   - Masthead / stadium rules only apply while #hub is visible AND the
     Player Card tab is active (.hubPlayerCardActive, set by set30HubTab()).
     Home, Picks, Standings, Profile, Loader and other Hub tabs keep their
     existing masthead and background.
   Assets: assets/player-card/* are the unmodified approved originals
   (Coin Variant B master, stadium, four trophy crests) + bundled fonts.
   ===================================================================== */

@font-face{font-family:'PC5 Barlow Condensed';src:url('assets/player-card/fonts/BarlowCondensed-Bold.ttf') format('truetype');font-weight:600 900;font-style:normal;font-display:swap}
@font-face{font-family:'PC5 Inter';src:url('assets/player-card/fonts/Inter.ttf') format('truetype');font-weight:100 900;font-style:normal;font-display:swap}

:root{
  --pc5-bg:#040b1b;
  --pc5-cyan:#00d2ff;
  --pc5-cyan-lt:#5fe3ff;
  --pc5-gold:#ffd24a;
  --pc5-gold-lt:#ffe7a0;
  --pc5-text:#f8faff;
  --pc5-muted:#b9c8e0;
  --pc5-dim:#8a9ec0;
  --pc5-cond:'PC5 Barlow Condensed','Barlow Condensed','Oswald','Arial Narrow',sans-serif;
  --pc5-sans:'PC5 Inter',Inter,'Helvetica Neue',Arial,sans-serif;
  --pc5-card:linear-gradient(180deg,#0b2150 0%,#081634 60%,#050e22 100%);
  --pc5-tile:linear-gradient(180deg,#0d2a62 0%,#061433 100%);
  --pc5-tile-gold:linear-gradient(180deg,#3a2a08 0%,#1d1606 50%,#0e0b05 100%);
  --pc5-hot:radial-gradient(80% 70% at 50% 0%,rgba(0,210,255,.28),rgba(0,210,255,0) 100%);
  --pc5-hot-gold:radial-gradient(80% 70% at 50% 0%,rgba(255,210,74,.32),rgba(255,210,74,0) 100%);
  --pc5-btn:linear-gradient(180deg,#0e2352 0%,#050e24 100%);
  --pc5-btn-dark:linear-gradient(180deg,#16130a 0%,#070605 100%);
  --pc5-edge-gold:linear-gradient(90deg,#ffd24a 0%,#ffe9a3 50%,#ffb800 100%);
  --pc5-chrome:linear-gradient(180deg,#ffffff 0%,#e4eeff 55%,#b8cceb 100%);
}

/* ---------------------------------------------------------------------
   1. Screen atmosphere (Player Card tab only)
   Player Card uses the shared global masthead exactly like Home / Picks /
   Standings / Hub / Profile (82px row at <=430px, 88px at 431–700px, plus
   the safe-area inset; same stadium plate, lockup, menu, bell and divider).
   The v1–v2 Player Card-only masthead (own stadium photo on .top, larger
   coin + wordmark lockup, restyled icon buttons) is retired; the
   .pc5MastLockup markup stays hidden. The stadium photo now starts directly
   under the shared masthead, so the card keeps its stadium atmosphere
   without reading as a second, taller header.
   --------------------------------------------------------------------- */
.pc5MastLockup{display:none}

.app:has(#hub:not(.hidden).hubPlayerCardActive){
  --pc5-atmos-y:calc(var(--app-mast-h,0px) + var(--app-safe-top,0px));
  background-color:var(--pc5-bg)!important;
  background-image:
    linear-gradient(180deg,rgba(4,11,27,.55) 0%,rgba(4,11,27,0) 22vw,rgba(4,11,27,0) 50vw,var(--pc5-bg) 72vw),
    url("assets/player-card/stadium.png")!important;
  background-size:100% auto,100% auto!important;
  background-position:center var(--pc5-atmos-y),center var(--pc5-atmos-y)!important;
  background-repeat:no-repeat,no-repeat!important;
}
.app:has(#hub:not(.hidden).hubPlayerCardActive) #hub,
.app:has(#hub:not(.hidden).hubPlayerCardActive) #hub>.content{
  background:transparent!important;
}

/* Hub hero was already hidden for this tab (premium-shell-v2.css). Once the
   v5 card has rendered, its "30 HUB" kicker is the route back to the Hub
   sections, so the tab strip is hidden only in that state. Loading, error,
   demo and no-league states keep the tab strip. */
#hub.hubPlayerCardActive:has(#hubResumeBody .pc5) .hubPageTabs{display:none!important}
#hub.hubPlayerCardActive:has(#hubResumeBody .pc5) .content.hubPage{padding-left:12px!important;padding-right:12px!important}
/* Bottom clearance: .app already reserves calc(92px + safe-area) for the
   fixed nav (styles.css, <=899px), so the extra 118px from premium-v0710's
   shared "#hub>.content" rule double-counts it and leaves a large gap under
   Week Recaps. Drop only that extra padding, only on the rendered card. */
@media (max-width:899px){
  #hub.hubPlayerCardActive:has(#hubResumeBody .pc5)>.content.hubPage{padding-bottom:0!important}
}

/* ---------------------------------------------------------------------
   2. Card root
   --------------------------------------------------------------------- */
#hubResumeBody .pc5{
  --pc5-av:104px;--pc5-name:30px;--pc5-title:34px;--pc5-crest:49px;
  position:relative;padding-bottom:4px;color:var(--pc5-text);font-family:var(--pc5-sans);
  -webkit-font-smoothing:antialiased;
}
#hubResumeBody .pc5 *{box-sizing:border-box}
:where(#hubResumeBody .pc5) :where(button){font:inherit;color:inherit;margin:0;-webkit-tap-highlight-color:transparent}
#hubResumeBody .pc5 button:focus-visible{outline:2px solid var(--pc5-gold);outline-offset:2px}
#hubResumeBody .pc5 h2,#hubResumeBody .pc5 h3{margin:0;font-weight:inherit}
#hubResumeBody .pc5Sr{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
#hubResumeBody .pc5Ico{display:block;flex:0 0 auto;width:24px;height:24px}

/* ---------------------------------------------------------------------
   3. Page head: kicker / title / sub + Share
   --------------------------------------------------------------------- */
#hubResumeBody .pc5Head{
  position:relative;display:flex;align-items:center;justify-content:space-between;gap:12px;
  min-height:64px;margin:14px 0 9px;padding:0 0 0 18px;
}
#hubResumeBody .pc5Head:before{
  content:"";position:absolute;left:4px;top:0;bottom:6px;width:3px;border-radius:2px;background:var(--pc5-cyan);
  box-shadow:0 0 6px 1px rgba(0,210,255,.45);
}
#hubResumeBody .pc5HeadText{min-width:0}
/* Back to 30 Hub (Real Device Final Fixes v1): replaces the old "30 HUB"
   kicker, which real users did not recognise as navigation. Same handler
   (set30HubTab('the30')); the Hub tab strip is hidden while the card shows. */
#hubResumeBody .pc5Back{
  position:relative;display:inline-flex;align-items:center;gap:5px;height:30px;margin:0 0 2px;padding:0 12px 0 7px;
  /* v2: thin metallic-gold rim (same 1.5px border box), navy interior, cyan arrow + text */
  border-radius:999px;border:1.5px solid transparent;cursor:pointer;
  background:linear-gradient(180deg,#0e2352 0%,#050e24 100%) padding-box,linear-gradient(100deg,#b98a2a 0%,#ffe9a3 38%,#ffd24a 62%,#9c7020 100%) border-box;
  box-shadow:0 0 10px rgba(255,210,74,.16),inset 0 0 0 1px rgba(0,210,255,.16);-webkit-tap-highlight-color:transparent;
  font-family:var(--pc5-cond);font-weight:700;font-size:15px;line-height:1;letter-spacing:.6px;color:var(--pc5-cyan-lt);white-space:nowrap;
}
#hubResumeBody .pc5Back .pc5BackIco{width:16px;height:16px;flex:0 0 auto}
#hubResumeBody .pc5Back:active{transform:translateY(1px)}
#hubResumeBody .pc5Back:focus-visible{outline:2px solid var(--pc5-cyan-lt);outline-offset:2px}
#hubResumeBody .pc5Back:after{content:"";position:absolute;inset:-7px -6px}
#hubResumeBody .pc5TeamsFoot .pc5Link:after,#hubResumeBody .pc5TeamsFoot .pc5Link:after,#hubResumeBody .pc5TeamMore:after{content:"";position:absolute;inset:-6px -8px}
#hubResumeBody .pc5Title{
  margin-top:4px;font-family:var(--pc5-cond);font-weight:700;font-size:var(--pc5-title);line-height:1;color:var(--pc5-text);
  text-shadow:0 1.5px 3px rgba(0,0,0,.6);white-space:nowrap;
}
#hubResumeBody .pc5Sub{margin-top:1px;font-size:14px;line-height:1.2;font-weight:500;color:var(--pc5-muted);text-shadow:0 1px 2px rgba(0,0,0,.7)}
#hubResumeBody .pc5Share{
  flex:0 0 auto;display:flex;align-items:center;justify-content:center;gap:8px;min-width:92px;height:40px;padding:0 14px 0 12px;
  border-radius:10px;border:1.5px solid var(--pc5-cyan);background:var(--pc5-btn);cursor:pointer;
  box-shadow:0 0 10px rgba(0,210,255,.24);
  font-family:var(--pc5-cond);font-weight:700;font-size:17px;color:var(--pc5-text);align-self:flex-start;margin-top:16px;
}
#hubResumeBody .pc5Share .pc5Ico{width:22px;height:22px;color:var(--pc5-cyan-lt)}

/* ---------------------------------------------------------------------
   4. Identity hero (TL/BR chamfers, TR/BL radius, cyan edge, gold corners)
   --------------------------------------------------------------------- */
#hubResumeBody .pc5Hero{position:relative;filter:drop-shadow(0 0 10px rgba(0,102,255,.45)) drop-shadow(0 0 4px rgba(0,210,255,.3))}
#hubResumeBody .pc5HeroFrame{
  position:relative;padding:1.6px;border-radius:0 12px 0 12px;
  clip-path:polygon(12px 0,100% 0,100% calc(100% - 12px),calc(100% - 12px) 100%,0 100%,0 12px);
  background:linear-gradient(135deg,#5fe3ff 0%,#00d2ff 50%,#0077c8 100%);
}
#hubResumeBody .pc5HeroFrame:after{ /* top highlight */
  content:"";position:absolute;left:20px;width:70%;top:0;height:2px;pointer-events:none;
  background:linear-gradient(90deg,rgba(255,255,255,0),#dff9ff 50%,rgba(255,255,255,0));
  box-shadow:0 0 6px rgba(223,249,255,.5);
}
#hubResumeBody .pc5HeroInner{
  position:relative;overflow:hidden;min-height:228px;padding:16px 10px 10px;
  border-radius:0 10.5px 0 10.5px;
  clip-path:polygon(11.3px 0,100% 0,100% calc(100% - 11.3px),calc(100% - 11.3px) 100%,0 100%,0 11.3px);
  background:
    linear-gradient(rgba(3,11,29,.5),rgba(3,11,29,.5)),
    url("assets/player-card/stadium.png") center/cover no-repeat,
    #061433;
}
#hubResumeBody .pc5Ghost{
  position:absolute;right:4px;top:48px;z-index:0;pointer-events:none;user-select:none;
  font-family:var(--pc5-cond);font-weight:700;font-size:170px;line-height:.8;letter-spacing:-4px;
  background:linear-gradient(180deg,rgba(27,79,184,.55),rgba(11,42,106,.15));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
  opacity:.28;
}
#hubResumeBody .pc5Season{
  position:absolute;right:14px;top:13px;z-index:2;font-family:var(--pc5-cond);font-weight:700;font-size:12px;line-height:1;letter-spacing:2px;color:var(--pc5-muted);
}
#hubResumeBody .pc5Corner{position:absolute;width:66px;height:42px;overflow:visible;pointer-events:none;z-index:3}
#hubResumeBody .pc5Corner path{fill:none;stroke:var(--pc5-gold);stroke-width:2;filter:drop-shadow(0 0 3px rgba(255,210,74,.55))}
#hubResumeBody .pc5Corner.tl{left:-1px;top:-1px}
#hubResumeBody .pc5Corner.br{right:-1px;bottom:-1px}
#hubResumeBody .pc5HeroTop{position:relative;z-index:1;display:flex;align-items:flex-start;gap:14px;padding-left:4px;min-width:0}

/* Avatar medallion: photo / helmet / emoji / initials from avatarHtml() */
#hubResumeBody .pc5Avatar{
  position:relative;flex:0 0 auto;width:var(--pc5-av);height:var(--pc5-av);border-radius:50%;padding:4px;
  background:linear-gradient(135deg,#fff3b8 0%,#ffc94a 30%,#b7650a 70%,#ffc94a 100%);
  box-shadow:0 0 18px 6px rgba(0,102,255,.35);
}
#hubResumeBody .pc5Avatar:before{ /* dark gap + cyan ring */
  content:"";position:absolute;inset:4px;border-radius:50%;background:#061433;
  box-shadow:inset 0 0 0 2px #061433,inset 0 0 0 4px var(--pc5-cyan);
}
#hubResumeBody .pc5Avatar:after{ /* specular arc on the gold ring */
  content:"";position:absolute;inset:0;border-radius:50%;pointer-events:none;
  background:conic-gradient(from 300deg,rgba(255,255,255,0) 0deg,rgba(255,255,255,.7) 22deg,rgba(255,255,255,0) 48deg);
  -webkit-mask:radial-gradient(circle,transparent calc(50% - 2px),#000 calc(50% - 1.5px));mask:radial-gradient(circle,transparent calc(50% - 2px),#000 calc(50% - 1.5px));
}
#hubResumeBody .pc5Avatar .playerAvatar{
  position:absolute;inset:9px;z-index:1;display:flex;align-items:center;justify-content:center;overflow:hidden;border-radius:50%;
  width:auto;height:auto;margin:0;border:0;padding:0;
  background:radial-gradient(circle at 50% 36%,rgba(0,210,255,.14) 0 40%,transparent 41%),var(--pc5-tile);
  font-family:var(--pc5-cond);font-weight:700;font-size:calc(var(--pc5-av)*.393);line-height:1;letter-spacing:.5px;color:#fff;
}
#hubResumeBody .pc5Avatar .playerAvatar:not(.photoAvatar):not(.helmetAvatar){
  background:radial-gradient(circle at 50% 36%,rgba(0,210,255,.14) 0 40%,transparent 41%),var(--pc5-tile);
  text-shadow:0 1.5px 1.5px rgba(0,0,0,.6);
}
#hubResumeBody .pc5Avatar .photoAvatar img{width:100%;height:100%;object-fit:cover;border-radius:50%;display:block}
#hubResumeBody .pc5Avatar .helmetAvatar img{width:84%;height:84%;object-fit:contain;display:block}

#hubResumeBody .pc5Identity{flex:1 1 auto;min-width:0;padding-top:14px}
#hubResumeBody .pc5Name{
  font-family:var(--pc5-cond);font-weight:700;font-size:var(--pc5-name);line-height:1.08;color:var(--pc5-text);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%;padding-right:2px;
  text-shadow:0 1.5px 3px rgba(0,0,0,.6);
}
#hubResumeBody .pc5League{
  display:flex;align-items:center;gap:6px;min-width:0;margin-top:2px;
  font-size:14px;line-height:1.3;font-weight:500;color:var(--pc5-muted);white-space:nowrap;
}
#hubResumeBody .pc5LeagueName{min-width:0;overflow:hidden;text-overflow:ellipsis}
#hubResumeBody .pc5Verified{
  flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;width:13px;height:13px;margin-left:-2px;border-radius:50%;
  background:rgba(255,210,74,.9);color:#241a04;font-size:8px;font-weight:900;line-height:1;
}
#hubResumeBody .pc5Dot{flex:0 0 auto}
#hubResumeBody .pc5League>span:last-child{flex:0 0 auto}

#hubResumeBody .pc5RankPill{
  position:relative;display:inline-flex;align-items:center;gap:8px;max-width:100%;height:30px;margin-top:8px;padding:0 14px 0 11px;
  border-radius:8px;border:1.5px solid rgba(0,210,255,.6);background:var(--pc5-btn);
}
#hubResumeBody .pc5RankPill b{font-family:var(--pc5-cond);font-weight:700;font-size:16px;line-height:1;letter-spacing:1px;color:var(--pc5-text);white-space:nowrap}
#hubResumeBody .pc5RankPill span{font-family:var(--pc5-cond);font-weight:700;font-size:11px;line-height:1;letter-spacing:1px;color:var(--pc5-muted);white-space:nowrap}
#hubResumeBody .pc5RankPill.gold{
  border:0;background:var(--pc5-btn-dark);box-shadow:0 0 10px rgba(255,210,74,.28);
}
#hubResumeBody .pc5RankPill.gold:before{
  content:"";position:absolute;inset:0;border-radius:8px;padding:1.5px;pointer-events:none;
  background:var(--pc5-edge-gold);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;
}
#hubResumeBody .pc5RankPill.gold b{color:var(--pc5-gold)}
#hubResumeBody .pc5RankPill.gold span{color:rgba(255,210,74,.7)}
#hubResumeBody .pc5RankCrown{width:18px;height:18px;color:var(--pc5-gold)}
#hubResumeBody .pc5RankPill.unranked{opacity:.7}

/* Four stat tiles */
#hubResumeBody .pc5Stats{position:relative;z-index:1;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;margin-top:12px}
#hubResumeBody .pc5Stat{
  position:relative;overflow:hidden;min-width:0;height:82px;padding:9px 3px 0;border-radius:8px;text-align:center;
  border:1px solid rgba(0,210,255,.42);background:var(--pc5-hot) top/100% 70% no-repeat,var(--pc5-tile);
}
#hubResumeBody .pc5Stat:before,#hubResumeBody .pc5WeekTile:before{
  content:"";position:absolute;left:20%;right:20%;top:0;height:1.2px;pointer-events:none;
  background:linear-gradient(90deg,rgba(255,255,255,0),rgba(191,243,255,.9),rgba(255,255,255,0));
}
#hubResumeBody .pc5Stat.gold{
  border-color:rgba(255,210,74,.85);background:var(--pc5-hot-gold) top/100% 70% no-repeat,var(--pc5-tile-gold);
  box-shadow:0 0 12px rgba(255,210,74,.25);
}
#hubResumeBody .pc5Stat.gold:before,#hubResumeBody .pc5WeekTile.latest:before{background:linear-gradient(90deg,rgba(255,255,255,0),rgba(255,233,163,.9),rgba(255,255,255,0))}
#hubResumeBody .pc5StatIco{margin:0 auto;color:var(--pc5-cyan-lt)}
#hubResumeBody .pc5Stat.gold .pc5StatIco{color:var(--pc5-gold)}
#hubResumeBody .pc5StatLabel{
  display:block;margin-top:5px;font-family:var(--pc5-cond);font-weight:700;font-size:13px;line-height:1;letter-spacing:.9px;text-transform:uppercase;
  color:var(--pc5-cyan-lt);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
#hubResumeBody .pc5Stat:nth-child(4) .pc5StatLabel{font-size:12px}
#hubResumeBody .pc5Stat.gold .pc5StatLabel{color:var(--pc5-gold)}
#hubResumeBody .pc5Stat b{
  display:flex;flex-wrap:wrap;align-items:baseline;justify-content:center;column-gap:3px;margin-top:4px;
  font-family:var(--pc5-cond);font-weight:700;font-size:26px;line-height:1.05;color:#fff;white-space:nowrap;
  background:var(--pc5-chrome);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
  overflow:hidden;
}
#hubResumeBody .pc5Stat b small{
  font-family:var(--pc5-cond);font-weight:700;font-size:12px;letter-spacing:.3px;
  background:none;-webkit-text-fill-color:var(--pc5-cyan-lt);color:var(--pc5-cyan-lt);
}

/* ---------------------------------------------------------------------
   5. Panels (Weekly Finishes / Trophies / Favorites)
   --------------------------------------------------------------------- */
#hubResumeBody .pc5Panel{
  position:relative;overflow:hidden;min-width:0;border-radius:12px;
  border:1px solid rgba(95,227,255,.22);
  background:var(--pc5-hot) top/100% 50% no-repeat,var(--pc5-card);
}
#hubResumeBody .pc5Panel:before{ /* top-left edge light, fades out along both edges */
  content:"";position:absolute;inset:0;border-radius:12px;pointer-events:none;
  border-top:1.3px solid rgba(159,239,255,.95);border-left:1.3px solid rgba(159,239,255,.95);
  -webkit-mask:radial-gradient(75% 90% at 0 0,#000 0%,rgba(0,0,0,.6) 40%,transparent 75%);
  mask:radial-gradient(75% 90% at 0 0,#000 0%,rgba(0,0,0,.6) 40%,transparent 75%);
}
#hubResumeBody .pc5PanelHead{display:flex;align-items:center;gap:8px;min-width:0}
#hubResumeBody .pc5PanelHead h3{
  flex:1 1 auto;min-width:0;font-family:var(--pc5-cond);font-weight:700;line-height:1;color:var(--pc5-cyan-lt);text-transform:uppercase;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
#hubResumeBody .pc5HeadIco{color:var(--pc5-cyan-lt)}
#hubResumeBody .pc5HeadIco.gold{color:var(--pc5-gold)}
#hubResumeBody .pc5HeadIco.heart{color:#ff6b6b}
#hubResumeBody .pc5Link{
  flex:0 0 auto;display:inline-flex;align-items:center;gap:2px;min-height:32px;padding:0 0 0 6px;border:0;background:none;cursor:pointer;
  font-family:var(--pc5-sans);font-weight:600;font-size:14px;line-height:1;color:var(--pc5-muted);
}
#hubResumeBody .pc5Chev{width:16px;height:16px;color:var(--pc5-cyan-lt)}

/* Weekly Finishes */
#hubResumeBody .pc5Weeks{margin-top:10px;padding:4px 10px 10px}
#hubResumeBody .pc5Weeks .pc5PanelHead{min-height:34px;padding-left:2px}
#hubResumeBody .pc5Weeks .pc5HeadIco{width:20px;height:20px}
#hubResumeBody .pc5Weeks .pc5PanelHead h3{font-size:17px;letter-spacing:1px;padding-left:8px}
#hubResumeBody .pc5Weeks .pc5Link{margin-right:-2px}
#hubResumeBody .pc5WeekGrid{display:grid;grid-template-columns:repeat(var(--pc5-weeks,4),minmax(0,1fr));gap:6px;margin-top:0}
#hubResumeBody .pc5WeekTile{
  position:relative;overflow:hidden;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;min-width:0;height:48px;padding:5px 2px 0;
  border-radius:7px;border:1px solid rgba(0,210,255,.42);cursor:pointer;
  background:var(--pc5-hot) top/100% 70% no-repeat,var(--pc5-tile);
}
#hubResumeBody .pc5WeekTile.latest{
  border-color:rgba(255,210,74,.85);background:var(--pc5-hot-gold) top/100% 70% no-repeat,var(--pc5-tile-gold);
  box-shadow:0 0 12px rgba(255,210,74,.22);
}
#hubResumeBody .pc5WeekNum{font-family:var(--pc5-cond);font-weight:700;font-size:12px;line-height:1;letter-spacing:1px;color:var(--pc5-muted)}
#hubResumeBody .pc5WeekTile.latest .pc5WeekNum{color:var(--pc5-gold)}
#hubResumeBody .pc5WeekFinish{
  margin-top:3px;font-family:var(--pc5-cond);font-weight:700;font-size:24px;line-height:1.05;color:#fff;
  background:var(--pc5-chrome);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
}
#hubResumeBody .pc5WeekAwards{position:absolute;top:3px;right:3px;display:flex;align-items:center;gap:1px;height:11px;padding:0 2px;border-radius:6px;background:rgba(4,11,27,.55)}
#hubResumeBody .pc5WeekAwards .pcWeekAwardIco{display:block;width:8px;height:8px;margin:0;color:var(--pc5-gold)}
#hubResumeBody .pc5WeekAwards i{font-style:normal;font-family:var(--pc5-cond);font-weight:700;font-size:9px;line-height:1;color:var(--pc5-gold)}
#hubResumeBody .pc5Empty{
  padding:12px;border:1px dashed rgba(95,227,255,.3);border-radius:8px;text-align:center;
  font-size:13px;line-height:1.35;color:var(--pc5-muted);
}

/* Trophies / Favorites split: ~62% / remainder, 8px gap */
#hubResumeBody .pc5Split{display:grid;grid-template-columns:minmax(0,1.725fr) minmax(0,1fr);gap:8px;margin-top:10px;align-items:stretch}
#hubResumeBody .pc5Split .pc5Panel{min-height:166px}
#hubResumeBody .pc5Split .pc5PanelHead{min-height:26px}
#hubResumeBody .pc5Split .pc5PanelHead h3{font-size:12.5px;letter-spacing:0}

#hubResumeBody .pc5Trophies{padding:10px 6px 10px 10px;display:flex;flex-direction:column}
#hubResumeBody .pc5Trophies .pc5HeadIco{width:20px;height:20px}
#hubResumeBody .pc5Trophies .pc5PanelHead{gap:4px;padding-right:10px}
#hubResumeBody .pc5Trophies .pc5Link{font-size:13px;min-height:26px;position:relative}
#hubResumeBody .pc5Trophies .pc5Link:after{content:"";position:absolute;inset:-8px -8px -8px -4px}
#hubResumeBody .pc5Trophies .pc5Chev{width:14px;height:14px}
#hubResumeBody .pc5CrestGrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin:0 0 0 -4px;padding-top:20px}
#hubResumeBody .pc5Crest{display:flex;flex-direction:column;align-items:center;min-width:0;text-align:center}
#hubResumeBody .pc5CrestArt{display:flex;align-items:center;justify-content:center;width:var(--pc5-crest);height:var(--pc5-crest)}
#hubResumeBody .pc5CrestArt img{display:block;width:100%;height:100%;object-fit:contain}
#hubResumeBody .pc5Crest.empty .pc5CrestArt img{opacity:.48}
#hubResumeBody .pc5CrestLabel{
  display:block;max-width:100%;margin-top:11px;font-family:var(--pc5-cond);font-weight:700;font-size:12px;line-height:1;letter-spacing:-.2px;
  text-transform:uppercase;color:var(--pc5-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
#hubResumeBody .pc5Crest.earned .pc5CrestLabel{color:var(--pc5-text)}
#hubResumeBody .pc5Crest b{display:block;margin-top:9px;font-family:var(--pc5-cond);font-weight:700;font-size:16px;line-height:1;color:var(--pc5-dim)}
#hubResumeBody .pc5Crest.earned b{color:var(--pc5-gold)}

#hubResumeBody .pc5Favs{padding:10px 8px 0;display:flex;flex-direction:column}
#hubResumeBody .pc5Favs .pc5PanelHead{gap:6px}
#hubResumeBody .pc5Favs .pc5HeadIco{width:16px;height:16px}
#hubResumeBody .pc5Favs .pc5PanelHead h3{font-size:13.5px}
#hubResumeBody .pc5Teams{
  list-style:none;margin:4px 0 0;padding:0;display:grid;grid-template-columns:repeat(2,46px);justify-content:center;column-gap:10px;row-gap:8px;
}
#hubResumeBody .pc5Team{
  position:relative;display:flex;align-items:center;justify-content:center;width:46px;height:46px;border-radius:50%;
  border:1px solid #5497bd;background:#091a32;overflow:hidden;
}
#hubResumeBody .pc5Team.light{background:#dfe9f5}
#hubResumeBody .pc5Team img.pc5TeamLogo{display:block;width:37px;height:37px;object-fit:contain}
#hubResumeBody .pc5Team .pc5TeamLogo:not(img),#hubResumeBody .pc5LogoFallback{
  display:flex;align-items:center;justify-content:center;width:100%;height:100%;
  font-family:var(--pc5-cond);font-weight:700;font-size:16px;letter-spacing:.5px;color:#dbe9f4;background:#0d2a62;
}
#hubResumeBody .pc5TeamsFoot{display:flex;align-items:center;justify-content:center;gap:6px;margin-top:auto;min-height:26px}
#hubResumeBody .pc5Favs .pc5Link{position:relative;font-size:13px;min-height:22px;padding:0 2px}
#hubResumeBody .pc5TeamMore{
  position:relative;flex:0 0 auto;min-width:32px;height:24px;padding:0 7px;border-radius:12px;cursor:pointer;
  border:1px solid rgba(95,227,255,.45);background:var(--pc5-btn);
  font-family:var(--pc5-cond);font-weight:700;font-size:13px;line-height:1;color:var(--pc5-cyan-lt);
}
#hubResumeBody .pc5EmptyTeams{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;flex:1 1 auto;padding:6px 2px 4px;text-align:center}
#hubResumeBody .pc5EmptyTeams span{font-size:12px;line-height:1.35;color:var(--pc5-muted)}
#hubResumeBody .pc5ChooseTeams{
  min-height:34px;padding:0 12px;border-radius:9px;cursor:pointer;border:1.5px solid var(--pc5-cyan);background:var(--pc5-btn);
  font-family:var(--pc5-cond);font-weight:700;font-size:14px;letter-spacing:.4px;color:var(--pc5-text);
}

/* ---------------------------------------------------------------------
   6. Week Recaps CTA (dark surface, gold edge)
   --------------------------------------------------------------------- */
#hubResumeBody .pc5Cta{
  position:relative;display:flex;align-items:center;gap:16px;width:100%;min-height:64px;margin-top:12px;padding:0 20px 0 14px;
  border:0;border-radius:12px;cursor:pointer;text-align:left;background:var(--pc5-btn-dark);
  box-shadow:0 0 14px rgba(255,210,74,.28);
}
#hubResumeBody .pc5Cta:before{ /* gold gradient edge */
  content:"";position:absolute;inset:0;border-radius:12px;padding:1.8px;pointer-events:none;background:var(--pc5-edge-gold);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;
}
#hubResumeBody .pc5Cta:after{ /* inner hairline */
  content:"";position:absolute;inset:4px;border-radius:9px;border:.8px solid rgba(255,210,74,.25);pointer-events:none;
}
#hubResumeBody .pc5CtaIcon{flex:0 0 auto;display:block;width:48px;height:36px;color:var(--pc5-gold)}
#hubResumeBody .pc5CtaGlyph{display:block;width:48px;height:36px}
#hubResumeBody .pc5CtaText{flex:1 1 auto;min-width:0}
#hubResumeBody .pc5CtaText b{
  display:block;font-family:var(--pc5-cond);font-weight:700;font-size:26px;line-height:1;letter-spacing:1.4px;text-transform:uppercase;color:var(--pc5-gold-lt);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
#hubResumeBody .pc5CtaText small{
  display:block;margin-top:3px;font-family:var(--pc5-cond);font-weight:700;font-size:12px;line-height:1.1;letter-spacing:.65px;text-transform:uppercase;color:var(--pc5-gold);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
#hubResumeBody .pc5CtaChevron{flex:0 0 auto;color:var(--pc5-gold)}
#hubResumeBody .pc5CtaChevron .pc5Ico{width:26px;height:26px}

#hubResumeBody .pc5 button:active{transform:scale(.985)}
@media (prefers-reduced-motion:reduce){#hubResumeBody .pc5 button:active{transform:none}}

/* ---------------------------------------------------------------------
   7. Responsive steps: 430 approved values, 360 safety
   --------------------------------------------------------------------- */
@media (min-width:415px){
  #hubResumeBody .pc5{--pc5-av:112px;--pc5-name:32px;--pc5-title:36px;--pc5-crest:54px}
  #hubResumeBody .pc5Identity{padding-top:12px}
}
@media (max-width:374px){
  #hubResumeBody .pc5{--pc5-av:90px;--pc5-name:27px;--pc5-title:31px;--pc5-crest:44px}
  #hubResumeBody .pc5HeroTop{gap:11px;padding-left:2px}
  #hubResumeBody .pc5Identity{padding-top:13px}
  #hubResumeBody .pc5League{font-size:13px}
  #hubResumeBody .pc5Sub{font-size:13px}
  #hubResumeBody .pc5Stats,#hubResumeBody .pc5WeekGrid{gap:5px}
  #hubResumeBody .pc5StatLabel{font-size:11.5px;letter-spacing:.5px}
  #hubResumeBody .pc5Stat:nth-child(4) .pc5StatLabel{font-size:10.5px;letter-spacing:.3px}
  #hubResumeBody .pc5Stat b{font-size:23px}
  #hubResumeBody .pc5Split .pc5PanelHead h3{font-size:11.5px}
  #hubResumeBody .pc5Favs .pc5PanelHead h3{font-size:12px}
  #hubResumeBody .pc5Favs{padding-left:6px;padding-right:6px}
  #hubResumeBody .pc5Teams{grid-template-columns:repeat(2,42px);column-gap:8px}
  #hubResumeBody .pc5Team{width:42px;height:42px}
  #hubResumeBody .pc5Team img.pc5TeamLogo{width:33px;height:33px}
  #hubResumeBody .pc5CrestLabel{font-size:11px}
  #hubResumeBody .pc5CtaText b{font-size:23px}
  #hubResumeBody .pc5CtaText small{font-size:11px;letter-spacing:.4px}
  #hubResumeBody .pc5Cta{gap:12px;padding-right:14px}
}
#hubResumeBody .pc5Teams[data-count="1"]{grid-template-columns:46px}
@media (max-width:339px){
  #hubResumeBody .pc5Favs .pc5PanelHead h3{font-size:10.5px}
  #hubResumeBody .pc5Favs .pc5HeadIco{width:13px;height:13px}
  #hubResumeBody .pc5Sub{font-size:12px}
}