/* PON Dashboard 1.0.0 - build 10010 full-audit baseline
 * Phase 7: responsive/theme/mobile-navigation certification while retaining
 * the locked 2x2 -> 3x3 hub and familiar narrow / wide / narrow dashboard.
 */
.cPONDash,
.cPONDashFocus {
  color-scheme: light dark;
  --pondash-bg: var(--i-background_1, Canvas);
  --pondash-bg-soft: var(--i-background_2, color-mix(in srgb, CanvasText 5%, Canvas));
  --pondash-bg-raised: var(--i-background_3, color-mix(in srgb, CanvasText 8%, Canvas));
  --pondash-border: var(--i-border_color, color-mix(in srgb, CanvasText 14%, transparent));
  --pondash-text: var(--i-color_hard, CanvasText);
  --pondash-muted: var(--i-color_medium, color-mix(in srgb, CanvasText 68%, Canvas));
  --pondash-soft: var(--i-color_soft, color-mix(in srgb, CanvasText 52%, Canvas));
  --pondash-accent: var(--i-color_primary, var(--i-primary, #be9747));
  --pondash-radius: 6px;
  --pondash-gap: clamp(10px, 1.1vw, 14px);
  color: var(--pondash-text);
}

/* The host page owns the header and Daily Content Goal. Remove extra widget chrome
 * so the Hub begins as a native-looking continuation beneath the goal. */
.ponDashboardWidget {
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
}

.cPONDash {
  display: grid;
  gap: var(--pondash-gap);
  width: 100%;
  min-width: 0;
}
.cPONDash__assistive {
  position: absolute;
  inline-size: 1px;
  block-size: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}

/* --------------------------------------------------------------------------
 * Dashboard navigation hub
 * Locked desktop contract: 2 x 2 major cards, THEN 3 x 3 focused cards.
 * ----------------------------------------------------------------------- */
.cPONDash__navigation {
  display: grid;
  gap: 11px;
  padding: clamp(10px, 1.2vw, 14px);
  border: 1px solid var(--pondash-border);
  border-radius: var(--pondash-radius);
  background: color-mix(in srgb, var(--pondash-bg-soft) 80%, transparent);
  box-shadow: 0 1px 0 rgba(255,255,255,.025) inset;
}
.cPONDash__majorGrid,
.cPONDash__minorGrid {
  display: grid;
  min-width: 0;
}
.cPONDash__majorGrid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-auto-rows: 1fr;
  gap: 10px;
}
.cPONDash__minorGrid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-auto-rows: 1fr;
  gap: 9px;
}

.cPONDashCard {
  position: relative;
  display: flex;
  align-items: flex-start;
  min-width: 0;
  gap: 11px;
  border: 1px solid var(--pondash-border);
  border-radius: 5px;
  background: var(--pondash-bg-raised);
  color: var(--pondash-text) !important;
  text-decoration: none !important;
  box-shadow: 0 1px 0 rgba(255,255,255,.02) inset, 0 1px 2px rgba(0,0,0,.10);
  transition: border-color .14s ease, background-color .14s ease, box-shadow .14s ease;
}
.cPONDashCard:hover,
.cPONDashCard:focus-visible {
  border-color: color-mix(in srgb, var(--pondash-accent) 42%, var(--pondash-border));
  background: color-mix(in srgb, var(--pondash-bg-raised) 88%, var(--pondash-accent) 12%);
  box-shadow: 0 2px 8px rgba(0,0,0,.14);
}
.cPONDashCard:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--pondash-accent) 70%, transparent);
  outline-offset: 2px;
}
.cPONDashCard--major {
  min-height: 112px;
  padding: clamp(14px, 1.5vw, 18px);
}
.cPONDashCard--minor {
  min-height: 82px;
  padding: 12px 13px;
}
.cPONDashCard__icon {
  display: grid;
  place-items: center;
  flex: 0 0 38px;
  width: 38px;
  height: 38px;
  border: 1px solid color-mix(in srgb, var(--pondash-accent) 28%, var(--pondash-border));
  border-radius: 5px;
  background: color-mix(in srgb, var(--pondash-accent) 10%, var(--pondash-bg-soft));
  color: var(--pondash-accent);
  font-size: .95rem;
}
.cPONDashCard__icon--small {
  flex-basis: 32px;
  width: 32px;
  height: 32px;
  font-size: .82rem;
}
.cPONDashCard__body {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  gap: 3px;
  min-width: 0;
}
.cPONDashCard__title {
  font-size: .92rem;
  line-height: 1.25;
  font-weight: 700;
}
.cPONDashCard__desc {
  color: var(--pondash-muted);
  line-height: 1.38;
  font-size: .78rem;
}
.cPONDashCard__meta {
  margin-top: auto;
  padding-top: 4px;
  color: var(--pondash-accent);
  font-size: .67rem;
  font-weight: 650;
  line-height: 1.25;
}
.cPONDashCard__arrow {
  align-self: center;
  margin-left: auto;
  color: var(--pondash-soft);
  font-size: .72rem;
  opacity: .8;
}
.cPONDashCard--minor .cPONDashCard__title { font-size: .82rem; }
.cPONDashCard--minor .cPONDashCard__desc { font-size: .69rem; }

/* --------------------------------------------------------------------------
 * Lower dashboard. The production screenshot is narrow rail / wide feed /
 * narrow rail. Keep that visual hierarchy while loading it progressively.
 * ----------------------------------------------------------------------- */
.cPONDash__secondary { min-height: 260px; }
.cPONDashSecondary,
.cPONDashSkeleton {
  display: grid;
  grid-template-columns: minmax(165px, .72fr) minmax(0, 2.08fr) minmax(175px, .78fr);
  gap: var(--pondash-gap);
  align-items: start;
  min-width: 0;
}
.cPONDashRail,
.cPONDashMain {
  display: grid;
  align-content: start;
  gap: var(--pondash-gap);
  min-width: 0;
}
.cPONDashMain { grid-column: 2; }
.cPONDashRail--left { grid-column: 1; grid-row: 1; }
.cPONDashRail--right { grid-column: 3; grid-row: 1; }

.cPONDashSkeleton__col {
  min-height: 250px;
  padding: 14px;
  border: 1px solid var(--pondash-border);
  border-radius: var(--pondash-radius);
  background: var(--pondash-bg);
}
.cPONDashSkeleton__col:nth-child(2) { min-height: 410px; }
.cPONDashSkeleton__col span {
  display: block;
  height: 14px;
  margin-bottom: 13px;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--pondash-bg-soft), var(--pondash-bg-raised), var(--pondash-bg-soft));
  background-size: 200% 100%;
  animation: pondashShimmer 1.6s linear infinite;
}
.cPONDashSkeleton__col span:nth-child(2n) { width: 78%; }
.cPONDashSkeleton__col span:nth-child(3n) { width: 58%; }
@keyframes pondashShimmer { to { background-position: -200% 0; } }

.cPONDashPanel {
  min-width: 0;
  overflow: hidden;
  border: 1px solid var(--pondash-border);
  border-radius: var(--pondash-radius);
  background: var(--pondash-bg);
  box-shadow: 0 1px 2px rgba(0,0,0,.09);
}
.cPONDashPanel__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-height: 42px;
  padding: 10px 12px;
  border-bottom: 1px solid var(--pondash-border);
  background: color-mix(in srgb, var(--pondash-bg-soft) 68%, transparent);
}
.cPONDashPanel__head h2 {
  margin: 1px 0 0;
  font-size: .82rem;
  line-height: 1.25;
  font-weight: 720;
}
.cPONDashPanel__head > a {
  flex: 0 0 auto;
  font-size: .67rem;
  font-weight: 650;
  text-decoration: none;
}
.cPONDashPanel__eyebrow {
  display: block;
  color: var(--pondash-soft);
  font-size: .55rem;
  font-weight: 750;
  letter-spacing: .075em;
  text-transform: uppercase;
}

.cPONDashTopicList { display: grid; }
.cPONDashTopic {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  color: var(--pondash-text) !important;
  text-decoration: none !important;
  border-bottom: 1px solid var(--pondash-border);
}
.cPONDashTopic:last-child { border-bottom: 0; }
.cPONDashTopic:hover { background: var(--pondash-bg-soft); }
.cPONDashTopic__main {
  min-width: 0;
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.cPONDashTopic__main strong {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: .77rem;
  line-height: 1.35;
}
.cPONDashTopic__main small { color: var(--pondash-soft); font-size: .61rem; }
.cPONDashTopic__stats {
  display: grid;
  grid-template-columns: auto auto;
  column-gap: 4px;
  text-align: right;
  align-items: baseline;
  flex: 0 0 auto;
}
.cPONDashTopic__stats b { font-size: .67rem; }
.cPONDashTopic__stats small { color: var(--pondash-soft); font-size: .53rem; }

.cPONDashFeed { display: grid; }
.cPONDashFeed__item {
  display: flex;
  gap: 9px;
  align-items: flex-start;
  padding: 10px 12px;
  border-bottom: 1px solid var(--pondash-border);
  color: var(--pondash-text) !important;
  text-decoration: none !important;
}
.cPONDashFeed__item:last-child { border-bottom: 0; }
.cPONDashFeed__item:hover { background: var(--pondash-bg-soft); }
.cPONDashFeed__icon {
  display: grid;
  place-items: center;
  flex: 0 0 27px;
  width: 27px;
  height: 27px;
  border-radius: 50%;
  background: color-mix(in srgb, var(--pondash-accent) 10%, var(--pondash-bg-soft));
  color: var(--pondash-accent);
  font-size: .62rem;
}
.cPONDashFeed__body {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 3px;
}
.cPONDashFeed__body strong { font-size: .74rem; line-height: 1.35; }
.cPONDashFeed__body small { color: var(--pondash-soft); font-size: .59rem; }
.cPONDashFeed--focus .cPONDashFeed__item { padding-block: 14px; }

.cPONDashMetrics {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1px;
  background: var(--pondash-border);
  border-bottom: 1px solid var(--pondash-border);
}
.cPONDashMetrics > div {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-height: 70px;
  background: var(--pondash-bg);
  padding: 9px;
}
.cPONDashMetrics strong { font-size: 1.1rem; }
.cPONDashMetrics span { color: var(--pondash-muted); font-size: .58rem; }
.cPONDashFeatureLine {
  display: grid;
  gap: 3px;
  padding: 12px;
  border-bottom: 1px solid var(--pondash-border);
}
.cPONDashFeatureLine > span {
  color: var(--pondash-soft);
  font-size: .56rem;
  text-transform: uppercase;
  letter-spacing: .06em;
}
.cPONDashFeatureLine a,
.cPONDashFeatureLine strong { font-size: .73rem; line-height: 1.35; }

.cPONDashLeaders {
  list-style: none;
  padding: 5px 12px 10px;
  margin: 0;
  counter-reset: leaders;
}
.cPONDashLeaders li {
  counter-increment: leaders;
  display: flex;
  justify-content: space-between;
  gap: 8px;
  padding: 7px 0;
  border-bottom: 1px solid var(--pondash-border);
  font-size: .69rem;
}
.cPONDashLeaders li:last-child { border-bottom: 0; }
.cPONDashLeaders li span::before { content: counter(leaders) '. '; color: var(--pondash-soft); }
.cPONDashLeaders b { color: var(--pondash-accent); }

.cPONDashMatchMini {
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin: 10px;
  padding: 12px;
  border: 1px solid var(--pondash-border);
  border-radius: 5px;
  background: var(--pondash-bg-soft);
  color: var(--pondash-text) !important;
  text-decoration: none !important;
}
.cPONDashMatchMini > span {
  color: var(--pondash-accent);
  font-size: .56rem;
  text-transform: uppercase;
  letter-spacing: .06em;
}
.cPONDashMatchMini strong { font-size: .78rem; }
.cPONDashMatchMini small,
.cPONDashMatchMini time { color: var(--pondash-muted); font-size: .61rem; }

.cPONDashStatList { margin: 0; padding: 5px 12px 10px; }
.cPONDashStatList > div {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  padding: 7px 0;
  border-bottom: 1px solid var(--pondash-border);
}
.cPONDashStatList > div:last-child { border-bottom: 0; }
.cPONDashStatList dt { color: var(--pondash-muted); font-size: .65rem; }
.cPONDashStatList dd { margin: 0; font-weight: 700; font-size: .67rem; text-align: right; }

.cPONDashMembersMini { padding: 10px 11px 12px; }
.cPONDashMembersMini__head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  margin: 0 0 8px;
  font-size: .62rem;
}
.cPONDashMembersMini__head strong { color: var(--pondash-muted); }
.cPONDashMembersMini__list { display: flex; flex-wrap: wrap; gap: 6px; }
.cPONDashMembersMini__list a {
  position: relative;
  display: block;
  width: 28px;
  height: 28px;
  border-radius: 50%;
}
.cPONDashMembersMini__list img {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  object-fit: cover;
  background: var(--pondash-bg-soft);
}
.cPONDashMembersMini__list span {
  position: absolute;
  right: -1px;
  bottom: -1px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  border: 2px solid var(--pondash-bg);
  background: var(--pondash-soft);
}
.cPONDashMembersMini__list span.is-online { background: #38b36a; }

.cPONDashHistoryMini { display: grid; gap: 1px; background: var(--pondash-border); }
.cPONDashHistoryMini > div {
  background: var(--pondash-bg);
  padding: 9px 11px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
}
.cPONDashHistoryMini strong { color: var(--pondash-accent); font-size: .78rem; }
.cPONDashHistoryMini span { color: var(--pondash-muted); font-size: .61rem; text-align: right; }

.cPONDashQuickLinks { display: grid; padding: 8px; gap: 5px; }
.cPONDashQuickLinks a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 8px 9px;
  border: 1px solid var(--pondash-border);
  border-radius: 4px;
  background: var(--pondash-bg-soft);
  text-decoration: none;
  font-size: .66rem;
}
.cPONDashQuickLinks a::after { content: '›'; color: var(--pondash-soft); }
.cPONDashEmpty { padding: 14px; margin: 0; color: var(--pondash-muted); font-size: .7rem; line-height: 1.45; }

/* --------------------------------------------------------------------------
 * Focused destinations retain the same compact visual language.
 * ----------------------------------------------------------------------- */
.cPONDashFocus { display: grid; gap: 12px; }
.cPONDashFocus__back a {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-size: .78rem;
  font-weight: 650;
  text-decoration: none;
}
.cPONDashFocus__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 18px;
  padding: clamp(15px, 1.8vw, 21px);
  border: 1px solid var(--pondash-border);
  border-left: 3px solid var(--pondash-accent);
  border-radius: var(--pondash-radius);
  background: var(--pondash-bg);
}
.cPONDashFocus__header h1 { margin: 2px 0 5px; font-size: clamp(1.2rem, 1.7vw, 1.55rem); }
.cPONDashFocus__header p { margin: 0; color: var(--pondash-muted); max-width: 720px; font-size: .78rem; line-height: 1.45; }
.cPONDashFocus__links { display: flex; flex-wrap: wrap; gap: 6px; }
.cPONDashFocus__links a {
  padding: 7px 10px;
  border: 1px solid var(--pondash-border);
  border-radius: 4px;
  background: var(--pondash-bg);
  text-decoration: none;
  font-size: .7rem;
  font-weight: 650;
}
.cPONDashFocus__grid { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(240px, .7fr); gap: 12px; }
.cPONDashFocus__grid--wide { grid-template-columns: minmax(0, 1.72fr) minmax(235px, .68fr); }
.cPONDashFocus__stack { display: grid; align-content: start; gap: 12px; }
.cPONDashTopicList--focus .cPONDashTopic { padding-block: 13px; }
.cPONDashMetrics--large { grid-template-columns: repeat(4, 1fr); }
.cPONDashMetrics--large > div { min-height: 92px; }
.cPONDashMetrics--large strong { font-size: 1.35rem; }
.cPONDashLeaders--focus { padding: 9px 14px 14px; }

.cPONDashMatchFocus { padding-bottom: 15px; }
.cPONDashMatchFocus__body { display: flex; align-items: center; gap: 17px; padding: clamp(20px, 3vw, 34px); }
.cPONDashMatchFocus__body > i { font-size: 2.4rem; color: var(--pondash-accent); }
.cPONDashMatchFocus__body > div { display: flex; flex-direction: column; gap: 4px; }
.cPONDashMatchFocus__body strong { font-size: clamp(1.15rem, 2vw, 1.65rem); }
.cPONDashMatchFocus__body span,
.cPONDashMatchFocus__body time { color: var(--pondash-muted); font-size: .76rem; }
.cPONDashMatchFocus > .ipsButton { margin-inline: 16px; }

.cPONDashDestination { display: flex; align-items: center; gap: 18px; padding: clamp(20px, 3vw, 36px); }
.cPONDashDestination__icon {
  display: grid;
  place-items: center;
  flex: 0 0 58px;
  width: 58px;
  height: 58px;
  border-radius: 5px;
  color: var(--pondash-accent);
  background: color-mix(in srgb, var(--pondash-accent) 10%, var(--pondash-bg-soft));
  font-size: 1.25rem;
}
.cPONDashDestination h2 { margin: 0 0 6px; font-size: 1rem; }
.cPONDashDestination p { margin: 0; color: var(--pondash-muted); font-size: .76rem; line-height: 1.5; max-width: 820px; }
.cPONDashLoadError {
  padding: 15px;
  border: 1px solid var(--pondash-border);
  border-radius: var(--pondash-radius);
  background: var(--pondash-bg);
  color: var(--pondash-muted);
  font-size: .76rem;
}

/* Supplied-app integration views */
.cPONDashFocusStats {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
  gap: 1px;
  overflow: hidden;
  border: 1px solid var(--pondash-border);
  border-radius: var(--pondash-radius);
  background: var(--pondash-border);
}
.cPONDashFocusStats > div {
  min-height: 70px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 3px;
  background: var(--pondash-bg);
  padding: 9px;
}
.cPONDashFocusStats strong { font-size: 1.08rem; }
.cPONDashFocusStats span { color: var(--pondash-muted); font-size: .59rem; text-transform: capitalize; }

.cPONDashCompactList { display: grid; }
.cPONDashCompactList a {
  display: flex;
  flex-direction: column;
  gap: 3px;
  padding: 10px 12px;
  border-bottom: 1px solid var(--pondash-border);
  color: var(--pondash-text);
  text-decoration: none;
}
.cPONDashCompactList a:last-child { border-bottom: 0; }
.cPONDashCompactList a:hover { background: var(--pondash-bg-soft); }
.cPONDashCompactList strong { font-size: .72rem; line-height: 1.35; }
.cPONDashCompactList small { color: var(--pondash-soft); font-size: .59rem; }
.cPONDashCompactList--spaced { margin-top: 10px; border-top: 1px solid var(--pondash-border); }

.cPONDashMemberGrid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1px; background: var(--pondash-border); }
.cPONDashMemberGrid a {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 11px;
  background: var(--pondash-bg);
  color: var(--pondash-text);
  text-decoration: none;
}
.cPONDashMemberGrid a:hover { background: var(--pondash-bg-soft); }
.cPONDashMemberGrid img { flex: 0 0 36px; width: 36px; height: 36px; border-radius: 50%; object-fit: cover; background: var(--pondash-bg-soft); }
.cPONDashMemberGrid span { min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.cPONDashMemberGrid strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .74rem; }
.cPONDashMemberGrid small { color: var(--pondash-muted); font-size: .58rem; }

.cPONDashContentCards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1px; background: var(--pondash-border); }
.cPONDashContentCards > a {
  display: flex;
  min-width: 0;
  min-height: 116px;
  flex-direction: column;
  gap: 6px;
  padding: 14px;
  background: var(--pondash-bg);
  color: var(--pondash-text);
  text-decoration: none;
}
.cPONDashContentCards > a:hover { background: var(--pondash-bg-soft); }
.cPONDashContentCards__icon { color: var(--pondash-accent); font-size: 1rem; }
.cPONDashContentCards strong { font-size: .76rem; line-height: 1.35; }
.cPONDashContentCards small { margin-top: auto; color: var(--pondash-soft); font-size: .58rem; }

.cPONDashHistoryGrid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1px; background: var(--pondash-border); }
.cPONDashHistoryGrid > div { min-height: 132px; padding: 15px; background: var(--pondash-bg); }
.cPONDashHistoryGrid > div > strong { display: block; color: var(--pondash-accent); font-size: 1.4rem; margin-bottom: 6px; }
.cPONDashHistoryGrid h3 { margin: 0 0 6px; font-size: .82rem; }
.cPONDashHistoryGrid p { margin: 0; color: var(--pondash-muted); font-size: .68rem; line-height: 1.45; }

/* Tablet: preserve the major/minor relationship, then move the wide feed above
 * the two support rails so there is no cramped three-column middle state. */
@media (max-width: 1050px) {
  .cPONDashSecondary,
  .cPONDashSkeleton { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cPONDashMain,
  .cPONDashSkeleton__col:nth-child(2) { grid-column: 1 / -1; grid-row: 1; }
  .cPONDashRail--left,
  .cPONDashSkeleton__col:nth-child(1) { grid-column: 1; grid-row: 2; }
  .cPONDashRail--right,
  .cPONDashSkeleton__col:nth-child(3) { grid-column: 2; grid-row: 2; }
  .cPONDashFocus__grid,
  .cPONDashFocus__grid--wide { grid-template-columns: 1fr; }
  .cPONDashContentCards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 760px) {
  .cPONDash { gap: 10px; }
  .cPONDash__navigation { padding: 9px; }
  .cPONDash__majorGrid { grid-template-columns: 1fr; }
  .cPONDash__minorGrid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cPONDashCard--major { min-height: 96px; padding: 13px; }
  .cPONDashCard--minor { min-height: 74px; padding: 11px; }
  .cPONDashCard__desc { font-size: .73rem; }
  .cPONDashCard--minor .cPONDashCard__desc { display: none; }

  .cPONDashSecondary,
  .cPONDashSkeleton { grid-template-columns: 1fr; }
  .cPONDashMain,
  .cPONDashRail--left,
  .cPONDashRail--right,
  .cPONDashSkeleton__col:nth-child(1),
  .cPONDashSkeleton__col:nth-child(2),
  .cPONDashSkeleton__col:nth-child(3) { grid-column: 1; }
  .cPONDashMain,
  .cPONDashSkeleton__col:nth-child(2) { grid-row: 1; }
  .cPONDashRail--left,
  .cPONDashSkeleton__col:nth-child(1) { grid-row: 2; }
  .cPONDashRail--right,
  .cPONDashSkeleton__col:nth-child(3) { grid-row: 3; }

  .cPONDashFocus__header { align-items: flex-start; flex-direction: column; }
  .cPONDashMetrics--large { grid-template-columns: repeat(2, 1fr); }
  .cPONDashTopic__stats { display: none; }
  .cPONDashMemberGrid,
  .cPONDashContentCards,
  .cPONDashHistoryGrid { grid-template-columns: 1fr; }
}

@media (max-width: 440px) {
  .cPONDash__minorGrid { grid-template-columns: 1fr; }
  .cPONDashCard--minor .cPONDashCard__desc { display: block; }
  .cPONDashDestination { align-items: flex-start; flex-direction: column; }
}

@media (prefers-reduced-motion: reduce) {
  .cPONDashCard { transition: none; }
  .cPONDashSkeleton__col span { animation: none; }
}

/* Revision 4 focused destinations: Groups, Events and Matchday. */
.cPONDashPanel__count {
  align-self: center;
  color: var(--pondash-soft);
  font-size: .62rem;
  white-space: nowrap;
}
.cPONDashFocusCopy {
  margin: 0;
  padding: 14px 16px 16px;
  color: var(--pondash-muted);
  font-size: .72rem;
  line-height: 1.55;
}
.cPONDashGroupGrid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px;
  padding: 9px;
}
.cPONDashGroupGrid > a {
  display: grid;
  grid-template-columns: 32px minmax(0, 1fr) auto;
  align-items: center;
  gap: 9px;
  min-height: 64px;
  padding: 10px;
  border: 1px solid var(--pondash-border);
  border-radius: 8px;
  background: var(--pondash-bg-soft);
  color: inherit;
  text-decoration: none;
}
.cPONDashGroupGrid > a:hover { border-color: color-mix(in srgb, var(--pondash-accent) 45%, var(--pondash-border)); }
.cPONDashGroupGrid__icon {
  display: grid;
  place-items: center;
  width: 32px;
  height: 32px;
  border-radius: 7px;
  background: color-mix(in srgb, var(--pondash-accent) 12%, transparent);
  color: var(--pondash-accent);
}
.cPONDashGroupGrid strong,
.cPONDashGroupGrid small { display: block; }
.cPONDashGroupGrid strong { font-size: .73rem; line-height: 1.25; }
.cPONDashGroupGrid small { margin-top: 3px; color: var(--pondash-soft); font-size: .59rem; }
.cPONDashGroupGrid > a > i { color: var(--pondash-soft); font-size: .6rem; }

.cPONDashEventList { display: grid; }
.cPONDashEventList > a {
  display: grid;
  grid-template-columns: 86px minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  min-height: 72px;
  padding: 10px 14px;
  border-bottom: 1px solid var(--pondash-border);
  color: inherit;
  text-decoration: none;
}
.cPONDashEventList > a:last-child { border-bottom: 0; }
.cPONDashEventList > a:hover { background: var(--pondash-bg-soft); }
.cPONDashEventList__date {
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-height: 48px;
  padding: 6px 8px;
  border: 1px solid var(--pondash-border);
  border-radius: 7px;
  text-align: center;
}
.cPONDashEventList__date b { font-size: .68rem; line-height: 1.2; }
.cPONDashEventList__date small { margin-top: 3px; color: var(--pondash-accent); font-size: .58rem; }
.cPONDashEventList__body strong,
.cPONDashEventList__body small { display: block; }
.cPONDashEventList__body strong { font-size: .75rem; line-height: 1.3; }
.cPONDashEventList__body small { margin-top: 4px; color: var(--pondash-soft); font-size: .6rem; line-height: 1.35; }
.cPONDashEventList > a > i { color: var(--pondash-soft); font-size: .62rem; }

.cPONDashMatchday {
  display: grid;
  grid-template-columns: minmax(0, 1.72fr) minmax(245px, .68fr);
  gap: 12px;
  align-items: start;
}
.cPONDashMatchday__primary { display: grid; gap: 12px; min-width: 0; }
.cPONDashMatchday__actions { display: flex; flex-wrap: wrap; gap: 7px; padding: 0 16px 15px; }
.cPONDashFixtureList,
.cPONDashResultList { display: grid; }
.cPONDashFixtureRow {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  padding: 10px 14px;
  border-bottom: 1px solid var(--pondash-border);
}
.cPONDashFixtureRow:last-child { border-bottom: 0; }
.cPONDashFixtureRow strong,
.cPONDashFixtureRow small { display: block; }
.cPONDashFixtureRow strong { font-size: .73rem; }
.cPONDashFixtureRow small { margin-top: 3px; color: var(--pondash-soft); font-size: .59rem; }
.cPONDashFixtureRow__right { display: flex; align-items: center; gap: 9px; color: var(--pondash-muted); font-size: .62rem; text-align: right; }
.cPONDashFixtureRow__right a { color: var(--pondash-accent); }
.cPONDashResultList > a {
  display: grid;
  grid-template-columns: 92px minmax(0, 1fr) 28px;
  align-items: center;
  gap: 8px;
  padding: 10px 14px;
  border-bottom: 1px solid var(--pondash-border);
  color: inherit;
  text-decoration: none;
}
.cPONDashResultList > a:last-child { border-bottom: 0; }
.cPONDashResultList > a:hover { background: var(--pondash-bg-soft); }
.cPONDashResultList time { color: var(--pondash-soft); font-size: .58rem; }
.cPONDashResultList > a > span { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); align-items: center; gap: 8px; }
.cPONDashResultList strong { font-size: .67rem; }
.cPONDashResultList > a > span strong:last-child { text-align: right; }
.cPONDashResultList b { font-size: .7rem; white-space: nowrap; }
.cPONDashResultList__status { justify-self: end; width: 24px; height: 24px; display: grid; place-items: center; border-radius: 999px; background: var(--pondash-bg-soft); font-size: .58rem; font-style: normal; font-weight: 800; }
.cPONDashLeagueMini { overflow-x: auto; padding: 6px 9px 10px; }
.cPONDashLeagueMini__head,
.cPONDashLeagueMini > a {
  display: grid;
  grid-template-columns: 28px minmax(105px, 1fr) 30px 34px 34px;
  align-items: center;
  gap: 5px;
  min-width: 270px;
}
.cPONDashLeagueMini__head { padding: 5px 7px; color: var(--pondash-soft); font-size: .53rem; text-transform: uppercase; letter-spacing: .05em; }
.cPONDashLeagueMini > a { padding: 7px; border-top: 1px solid var(--pondash-border); color: inherit; text-decoration: none; font-size: .62rem; }
.cPONDashLeagueMini > a.is-focus { background: color-mix(in srgb, var(--pondash-accent) 10%, transparent); }
.cPONDashLeagueMini > a strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cPONDashLeagueMini > a b { color: var(--pondash-accent); }

@media (max-width: 980px) {
  .cPONDashMatchday { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .cPONDashGroupGrid { grid-template-columns: 1fr; }
  .cPONDashEventList > a { grid-template-columns: 72px minmax(0, 1fr) auto; gap: 8px; padding-inline: 9px; }
  .cPONDashFixtureRow { grid-template-columns: 1fr; gap: 6px; }
  .cPONDashFixtureRow__right { justify-content: space-between; text-align: left; }
  .cPONDashResultList > a { grid-template-columns: 1fr 28px; }
  .cPONDashResultList time { grid-column: 1 / -1; }
}
.cPONDashCompactList > div {
  display: grid;
  gap: 3px;
  padding: 9px 11px;
  border-bottom: 1px solid var(--pondash-border);
}
.cPONDashCompactList > div:last-child { border-bottom: 0; }
.cPONDashCompactList > div strong { font-size: .72rem; line-height: 1.35; }
.cPONDashCompactList > div small { color: var(--pondash-soft); font-size: .59rem; }


/* --------------------------------------------------------------------------
 * Revision 7 responsive/theme integration layer.
 *
 * The viewport media queries above remain as a fallback. Container queries
 * additionally protect the 2x2 -> 3x3 contract when IPS places the widget in
 * a narrower page-builder region on an otherwise wide desktop viewport.
 * ----------------------------------------------------------------------- */
.cPONDash,
.cPONDashFocus {
  container-type: inline-size;
  container-name: pondashboard;
  max-width: 100%;
  min-inline-size: 0;
}
.cPONDash *,
.cPONDash *::before,
.cPONDash *::after,
.cPONDashFocus *,
.cPONDashFocus *::before,
.cPONDashFocus *::after { box-sizing: border-box; }

.cPONDashCard__title,
.cPONDashCard__desc,
.cPONDashCard__meta,
.cPONDashFeed__body strong,
.cPONDashFocus__header p,
.cPONDashGroupGrid strong,
.cPONDashEventList__body strong,
.cPONDashEventList__body small,
.cPONDashFixtureRow strong,
.cPONDashFixtureRow small,
.cPONDashDestination p {
  overflow-wrap: anywhere;
}

.cPONDash img,
.cPONDashFocus img { max-width: 100%; }

.cPONDashFocus__links a,
.cPONDashQuickLinks a {
  min-height: 40px;
  display: inline-flex;
  align-items: center;
}
.cPONDashQuickLinks a { width: 100%; }

/* Keep the visible PON 2x2 and 3x3 hierarchy for longer on smaller screens.
 * Only genuine phone widths collapse the four major cards to one column. */
@media (max-width: 760px) {
  .cPONDash__majorGrid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cPONDash__minorGrid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .cPONDashCard--major { min-height: 90px; }
  .cPONDashCard--minor { min-height: 68px; }
  .cPONDashCard--minor .cPONDashCard__desc { display: none; }
  .cPONDashFocus__links a,
  .cPONDashQuickLinks a { min-height: 44px; }
}
@media (max-width: 640px) {
  .cPONDash__minorGrid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 520px) {
  .cPONDash__majorGrid { grid-template-columns: 1fr; }
}
/* Override the older 440px fallback so the compact 3x3 destinations remain
 * two-across until a genuinely narrow handset width. */
@media (max-width: 440px) {
  .cPONDash__minorGrid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cPONDashCard--minor .cPONDashCard__desc { display: none; }
}
@media (max-width: 380px) {
  .cPONDash__minorGrid { grid-template-columns: 1fr; }
  .cPONDashCard--minor .cPONDashCard__desc { display: block; }
}

/* Width-aware fallback for Page Builder and narrow content columns. */
@container pondashboard (max-width: 1050px) {
  .cPONDashSecondary,
  .cPONDashSkeleton { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cPONDashMain,
  .cPONDashSkeleton__col:nth-child(2) { grid-column: 1 / -1; grid-row: 1; }
  .cPONDashRail--left,
  .cPONDashSkeleton__col:nth-child(1) { grid-column: 1; grid-row: 2; }
  .cPONDashRail--right,
  .cPONDashSkeleton__col:nth-child(3) { grid-column: 2; grid-row: 2; }
  .cPONDashFocus__grid,
  .cPONDashFocus__grid--wide,
  .cPONDashMatchday { grid-template-columns: 1fr; }
  .cPONDashContentCards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@container pondashboard (max-width: 760px) {
  .cPONDash__majorGrid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cPONDash__minorGrid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .cPONDashSecondary,
  .cPONDashSkeleton { grid-template-columns: 1fr; }
  .cPONDashMain,
  .cPONDashRail--left,
  .cPONDashRail--right,
  .cPONDashSkeleton__col:nth-child(1),
  .cPONDashSkeleton__col:nth-child(2),
  .cPONDashSkeleton__col:nth-child(3) { grid-column: 1; }
  .cPONDashMain,
  .cPONDashSkeleton__col:nth-child(2) { grid-row: 1; }
  .cPONDashRail--left,
  .cPONDashSkeleton__col:nth-child(1) { grid-row: 2; }
  .cPONDashRail--right,
  .cPONDashSkeleton__col:nth-child(3) { grid-row: 3; }
  .cPONDashFocus__header { align-items: flex-start; flex-direction: column; }
  .cPONDashMetrics--large { grid-template-columns: repeat(2, 1fr); }
  .cPONDashTopic__stats { display: none; }
}
@container pondashboard (max-width: 640px) {
  .cPONDash__minorGrid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cPONDashMemberGrid,
  .cPONDashContentCards,
  .cPONDashHistoryGrid,
  .cPONDashGroupGrid { grid-template-columns: 1fr; }
  .cPONDashEventList > a { grid-template-columns: 72px minmax(0, 1fr) auto; gap: 8px; padding-inline: 9px; }
  .cPONDashFixtureRow { grid-template-columns: 1fr; gap: 6px; }
  .cPONDashFixtureRow__right { justify-content: space-between; text-align: left; }
  .cPONDashResultList > a { grid-template-columns: 1fr 28px; }
  .cPONDashResultList time { grid-column: 1 / -1; }
}
@container pondashboard (max-width: 520px) {
  .cPONDash__majorGrid { grid-template-columns: 1fr; }
}
@container pondashboard (max-width: 380px) {
  .cPONDash__minorGrid { grid-template-columns: 1fr; }
}

/* Respect the user's OS/browser motion preference without changing layout. */
@media (prefers-reduced-motion: reduce) {
  .cPONDash *,
  .cPONDashFocus * { scroll-behavior: auto !important; }
}

/* ========================================================================== 
 * Main dashboard composition refresh - build 10017
 * Keeps focused-area styling above intact while replacing the hub/summary
 * layout with application-owned widget output.
 * ======================================================================= */
.cPONDash--summary {
  --pondash-summary-gap: clamp(10px, 1vw, 14px);
  gap: var(--pondash-summary-gap);
}

.cPONDash--summary :where(.cPONDash__welcome,.cPONDash__goal,.cPONDash__whoOnline,.cPONDashMatrix__cell,.cPONDashStatistics) {
  min-width: 0;
}

.cPONDashNativeWidget {
  min-width: 0;
  width: 100%;
  margin: 0 !important;
}

/* Do not impose a second skin over application widgets. This wrapper exists
 * only to provide the normal .ipsWidget ancestry several source apps expect. */
.cPONDashNativeWidget > :first-child { margin-top: 0; }
.cPONDashNativeWidget > :last-child { margin-bottom: 0; }

.cPONDash__welcome {
  min-width: 0;
}

.cPONDash__topGrid {
  display: grid;
  grid-template-columns: minmax(0, 3.25fr) minmax(260px, 1fr);
  gap: var(--pondash-summary-gap);
  align-items: start;
}
.cPONDash__topGrid--withoutGoal {
  grid-template-columns: minmax(0, 3.25fr) minmax(260px, 1fr);
}
.cPONDash__goal,
.cPONDash__whoOnline,
.cPONDash__goal > .cPONDashNativeWidget,
.cPONDash__whoOnline > .cPONDashNativeWidget {
  height: auto;
}
.cPONDash__topAside {
  display: flex;
  flex-direction: column;
  gap: var(--pondash-summary-gap);
  min-width: 0;
}
.cPONDash__whoOnline {
  align-self: stretch;
}
.cPONDash__whoOnline .ipsWidget__content {
  display: flex;
  flex-direction: column;
  min-height: 0;
}
.cPONDash__whoOnline [data-bwo-widget-root] .ipsWidget__content > p:last-child {
  margin-block: 13px 0;
  padding-top: 13px;
  border-top: 1px solid var(--pondash-border);
}

/* Dashboard-only public-content promotion. It replaces Community Goal when the
 * source widget correctly hides from guests, and appears beneath Who's Online
 * while a member has the contribution breakdown expanded. */
.cPONDashPromo {
  min-width: 0;
  padding: 20px;
  border: 1px solid var(--pondash-border);
  border-radius: var(--pondash-radius);
  background: linear-gradient(145deg, color-mix(in srgb, var(--pondash-bg-raised) 92%, var(--pondash-accent) 8%), var(--pondash-bg));
  box-shadow: 0 1px 2px rgba(0,0,0,.10);
}
.cPONDashPromo[hidden] { display: none !important; }
.cPONDashPromo__eyebrow {
  display: block;
  margin-bottom: 7px;
  color: var(--pondash-accent);
  font-size: .68rem;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.cPONDashPromo h2 {
  margin: 0;
  font-size: 1.05rem;
  line-height: 1.28;
}
.cPONDashPromo p {
  margin: 9px 0 16px;
  color: var(--pondash-muted);
  font-size: .82rem;
  line-height: 1.5;
}
.cPONDashPromo__actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px;
}
.cPONDashPromo__actions a {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 9px;
  min-height: 48px;
  padding: 10px 12px;
  border: 1px solid var(--pondash-border);
  border-radius: 6px;
  background: var(--pondash-bg-soft);
  color: var(--pondash-text) !important;
  font-size: .78rem;
  font-weight: 700;
  text-decoration: none !important;
}
.cPONDashPromo__actions a span {
  text-align: center;
}
.cPONDashPromo__actions a:hover {
  border-color: color-mix(in srgb, var(--pondash-accent) 50%, var(--pondash-border));
  background: color-mix(in srgb, var(--pondash-bg-soft) 90%, var(--pondash-accent) 10%);
}
.cPONDashPromo__actions a > i:first-child,
.cPONDashPromo__actions a > i:last-child { color: var(--pondash-accent); }
.cPONDashPromo--goalOpen { padding: 16px; }
.cPONDashPromo--goalOpen .cPONDashPromo__actions { grid-template-columns: minmax(0, 1fr); }
.cPONDashPromo--goalOpen h2 { font-size: .95rem; }
.cPONDashPromo--goalOpen p { font-size: .76rem; }

/* Four focused dashboard destinations. */
.cPONDashNavGrid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--pondash-summary-gap);
}
.cPONDashNavCard {
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  min-height: 96px;
  padding: 16px 16px;
  border: 1px solid var(--pondash-border);
  border-radius: var(--pondash-radius);
  background: var(--pondash-bg);
  color: var(--pondash-text) !important;
  text-decoration: none !important;
  box-shadow: 0 1px 2px rgba(0,0,0,.10);
  transition: border-color .15s ease, background-color .15s ease, transform .15s ease;
}
.cPONDashNavCard:hover,
.cPONDashNavCard:focus-visible {
  border-color: color-mix(in srgb, var(--pondash-accent) 48%, var(--pondash-border));
  background: color-mix(in srgb, var(--pondash-bg) 92%, var(--pondash-accent) 8%);
}
.cPONDashNavCard:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--pondash-accent) 64%, transparent);
  outline-offset: 2px;
}
.cPONDashNavCard__icon {
  display: grid;
  place-items: center;
  width: 48px;
  height: 48px;
  color: var(--pondash-accent);
  font-size: 1.65rem;
}
.cPONDashNavCard__body {
  display: grid;
  gap: 5px;
  min-width: 0;
}
.cPONDashNavCard__body strong {
  font-size: .98rem;
  line-height: 1.2;
}
.cPONDashNavCard__body span {
  color: var(--pondash-muted);
  font-size: .78rem;
  line-height: 1.42;
}
.cPONDashNavCard__arrow {
  color: var(--pondash-accent);
  font-size: .75rem;
}

/* Focused pages reuse the same four-card navigation language as the main hub.
 * Dashboard is first and the current primary destination is omitted. */
.cPONDashNavGrid--focus { margin-block: 0 2px; }
.cPONDashNavGrid--focus .cPONDashNavCard {
  min-height: 84px;
  padding-block: 13px;
}
.cPONDashNavCard--dashboard .cPONDashNavCard__icon { color: var(--pondash-accent); }

.cPONDash--summary .cPONDash__secondary {
  min-height: 430px;
}

/* Status / discussion / match matrix. Latest Discussions is one physical
 * ldwidget instance spanning all three rows rather than three duplicated feeds. */
.cPONDashMatrix {
  display: grid;
  grid-template-columns: minmax(230px, .9fr) minmax(440px, 2.1fr) minmax(240px, .95fr);
  grid-template-areas:
    "status discussions nextGame"
    "statusUpdates discussions streak"
    "moods discussions activity";
  gap: var(--pondash-summary-gap);
  align-items: start;
}
.cPONDashMatrix__cell--status { grid-area: status; }
.cPONDashMatrix__cell--statusUpdates { grid-area: statusUpdates; }
.cPONDashMatrix__cell--moods { grid-area: moods; }
.cPONDashMatrix__cell--discussions { grid-area: discussions; align-self: stretch; }
.cPONDashMatrix__cell--nextGame { grid-area: nextGame; }
.cPONDashMatrix__cell--streak { grid-area: streak; }
.cPONDashMatrix__cell--activity { grid-area: activity; }

.cPONDashMatrix__cell--discussions > .cPONDashNativeWidget,
.cPONDashMatrix__cell--discussions .ldWidget {
  height: 100%;
}

/* On phones the embedded ldwidget reads as one continuous feed, so drop the
 * "Featured Topics" / "Regular Topics" section separators and keep the compact
 * single-list presentation. Desktop keeps the separators for scannability. */
@media (max-width: 767px) {
  .cPONDash .ldWidget .ldWidget__sectionLabel {
    display: none;
  }
}

.cPONDashOwnedPanel,
.cPONDashActiveCard,
.cPONDashRecent24 {
  overflow: hidden;
  border: 1px solid var(--pondash-border);
  border-radius: var(--pondash-radius);
  background: var(--pondash-bg);
  box-shadow: 0 1px 2px rgba(0,0,0,.09);
}
.cPONDashOwnedPanel__header,
.cPONDashActiveCard__header,
.cPONDashRecent24__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 54px;
  padding: 13px 16px;
  border-bottom: 1px solid var(--pondash-border);
  background: color-mix(in srgb, var(--pondash-bg-soft) 52%, transparent);
}
.cPONDashOwnedPanel__header h2,
.cPONDashActiveCard__header h2,
.cPONDashRecent24__header h2 {
  margin: 0;
  font-size: 1rem;
  font-weight: 720;
  line-height: 1.25;
}
.cPONDashOwnedPanel__body { padding: 14px 16px; }
.cPONDashOwnedPanel__body .newStatusBtn { margin: 0 !important; }

/* uStatus' feed template includes its own create-status button. The Dashboard
 * already gives that control a dedicated Status cell, so suppress only the
 * duplicate inside Status Updates. The real uStatus feed/controller remains
 * untouched and all status rows keep their native interactions. */
.cPONDashMatrix__cell--statusUpdates[data-pon-status-feed-only='1'] .newStatusBtn {
  display: none !important;
}

/* Native widgets should look exactly like their source application. Only trim
 * margins introduced for normal Page Builder stacks. */
.cPONDashMatrix .cPONDashNativeWidget > .ipsWidget__header,
.cPONDashStatistics .cPONDashNativeWidget > .ipsWidget__header {
  margin-top: 0;
}
.cPONDashMatrix .mvnponMatchCentre,
.cPONDashMatrix .ldWidget {
  margin: 0;
}

.cPONDashStatistics {
  margin-top: var(--pondash-summary-gap);
}

/* Active Viewers historical selections. Month gets the newest selection; year
 * receives a non-overlapping continuation while Active Viewers remains the
 * owning integration for these dashboard blocks. */
.cPONDashActiveGrid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.55fr);
  gap: var(--pondash-summary-gap);
  margin-top: var(--pondash-summary-gap);
}
.cPONDashActiveCard__body {
  padding: 18px 20px 20px;
}
.cPONDashActiveCard__body > p {
  margin: 0 0 18px;
  color: var(--pondash-muted);
  font-size: .91rem;
  line-height: 1.55;
}
.cPONDashAvatarRun {
  display: flex;
  align-items: center;
  min-width: 0;
  padding: 3px 0 3px 8px;
  overflow-x: auto;
  overflow-y: hidden;
  overscroll-behavior-inline: contain;
  scrollbar-width: thin;
}
.cPONDashAvatarRun__member,
.cPONDashAvatarRun__more {
  flex: 0 0 48px;
  width: 48px;
  height: 48px;
  margin-left: -8px;
  border: 2px solid var(--pondash-bg);
  border-radius: 50%;
  box-sizing: border-box;
}
.cPONDashAvatarRun__member:first-child { margin-left: 0; }
.cPONDashAvatarRun__member {
  display: block;
  overflow: hidden;
  background: var(--pondash-bg-raised);
  transition: transform .12s ease, z-index .12s ease;
}
.cPONDashAvatarRun__member:hover,
.cPONDashAvatarRun__member:focus-visible {
  z-index: 3;
  transform: translateY(-2px);
}
.cPONDashAvatarRun__member img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.cPONDashAvatarRun__more {
  display: grid;
  place-items: center;
  background: var(--pondash-bg-raised);
  color: var(--pondash-text);
  font-size: .75rem;
  font-weight: 750;
}

.cPONDashRecent24 {
  margin-top: var(--pondash-summary-gap);
}
.cPONDashRecent24__header > span {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--pondash-muted);
  font-size: .85rem;
}
.cPONDashRecent24__body {
  padding: 22px 20px;
}
.cPONDashRecent24__members {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 0;
  margin: 0;
  line-height: 1.65;
}
.cPONDashRecent24__members > span:not(:last-child)::after {
  content: ',\00a0';
  color: var(--pondash-muted);
}
.cPONDashRecent24__members a {
  font-weight: 600;
  text-decoration: none;
}
/* Keep third-party/source-widget internals inside their assigned grid cell
 * without restyling the source application itself. */
.cPONDash--summary :where(.cPONDashNativeWidget, .cPONDashNativeWidget > *, .cPONDashMatrix__cell) {
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box;
}
.cPONDash--summary .cPONDashNativeWidget :where(img,video,iframe,canvas,svg) {
  max-width: 100%;
}
.cPONDash--summary .cPONDashNativeWidget :where(.ipsData, .ipsTable, table) {
  min-width: 0;
}
.cPONDash--summary :where(.cPONDashMatrix__cell,.cPONDashActiveCard,.cPONDashRecent24) {
  overflow-wrap: anywhere;
}

.cPONDashTextLink {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-weight: 650;
  text-decoration: none;
}

/* Summary skeleton follows the same three-column proportions but deliberately
 * contains no app-specific placeholder markup. */
.cPONDashSkeleton--summary {
  display: grid;
  grid-template-columns: minmax(230px, .9fr) minmax(440px, 2.1fr) minmax(240px, .95fr);
  gap: var(--pondash-summary-gap);
  min-height: 460px;
}
.cPONDashSkeleton--summary > div {
  min-height: 320px;
  padding: 14px;
  border: 1px solid var(--pondash-border);
  border-radius: var(--pondash-radius);
  background: var(--pondash-bg);
}
.cPONDashSkeleton--summary .cPONDashSkeleton__main { min-height: 460px; }
.cPONDashSkeleton--summary span {
  display: block;
  height: 14px;
  margin-bottom: 13px;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--pondash-bg-soft), var(--pondash-bg-raised), var(--pondash-bg-soft));
  background-size: 200% 100%;
  animation: pondashShimmer 1.6s linear infinite;
}
.cPONDashSkeleton--summary span:nth-child(even) { width: 78%; }
.cPONDashSkeleton--summary span:nth-child(3n) { width: 58%; }

@media (max-width: 1180px) {
  .cPONDash__topGrid {
    grid-template-columns: minmax(0, 2.35fr) minmax(240px, .9fr);
  }
  .cPONDashNavCard {
    grid-template-columns: 42px minmax(0, 1fr) auto;
    gap: 10px;
    min-height: 90px;
    padding: 14px;
  }
  .cPONDashNavCard__icon {
    width: 42px;
    height: 42px;
    font-size: 1.45rem;
  }
}

/* Tablet / narrow desktop: keep Latest Discussions dominant by giving the
 * single source widget the full row, then pair the smaller source widgets.
 * This avoids crushing three application templates into undersized columns. */
@media (max-width: 1040px) {
  .cPONDashNavGrid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .cPONDashMatrix,
  .cPONDashSkeleton--summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .cPONDashMatrix {
    grid-template-areas:
      "discussions discussions"
      "status nextGame"
      "statusUpdates streak"
      "moods activity";
  }
  .cPONDashMatrix__cell--discussions,
  .cPONDashMatrix__cell--activity { align-self: stretch; }
  .cPONDashSkeleton--summary .cPONDashSkeleton__main {
    grid-column: 1 / -1;
    grid-row: 1;
    min-height: 360px;
  }
}

@media (max-width: 820px) {
  .cPONDash__topGrid,
  .cPONDash__topGrid--withoutGoal,
  .cPONDashMatrix,
  .cPONDashSkeleton--summary,
  .cPONDashActiveGrid {
    grid-template-columns: minmax(0, 1fr);
  }
  .cPONDashMatrix {
    grid-template-areas:
      "discussions"
      "status"
      "nextGame"
      "statusUpdates"
      "streak"
      "moods"
      "activity";
  }
  .cPONDashSkeleton--summary .cPONDashSkeleton__main {
    grid-column: 1;
    min-height: 330px;
  }
  .cPONDashActiveGrid { gap: var(--pondash-summary-gap); }
}

@media (max-width: 820px) {
  .cPONDashPromo__actions { grid-template-columns: minmax(0, 1fr); }
  .cPONDash__topAside { gap: var(--pondash-summary-gap); }
}

@media (max-width: 560px) {
  .cPONDashNavGrid { grid-template-columns: minmax(0, 1fr); }
  .cPONDashNavCard {
    min-height: 80px;
    grid-template-columns: 38px minmax(0, 1fr) auto;
    padding: 12px 13px;
  }
  .cPONDashNavCard__icon {
    width: 38px;
    height: 38px;
    font-size: 1.28rem;
  }
  .cPONDashNavCard__body span {
    font-size: .76rem;
    line-height: 1.35;
  }
  .cPONDashOwnedPanel__header,
  .cPONDashActiveCard__header,
  .cPONDashRecent24__header {
    min-height: 50px;
    padding: 11px 14px;
  }
  .cPONDashActiveCard__body,
  .cPONDashRecent24__body { padding: 15px; }
  .cPONDashAvatarRun__member,
  .cPONDashAvatarRun__more {
    flex-basis: 42px;
    width: 42px;
    height: 42px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .cPONDashNavCard,
  .cPONDashAvatarRun__member { transition: none; }
  .cPONDashSkeleton--summary span { animation: none; }
}

/* ========================================================================== 
 * Build 10020 runtime hotfixes
 * ======================================================================= */

/* Dedicated Status cell: keep the source uStatus trigger compact and make the
 * whole control easy to hit without changing uStatus anywhere else. */
.cPONDashMatrix__cell--status .cPONDashOwnedPanel__body {
  padding: 12px;
}
.cPONDashMatrix__cell--status .newStatusBtn,
.cPONDashMatrix__cell--status .newStatusBtn .ipsButton {
  width: 100%;
  max-width: none;
}
.cPONDashMatrix__cell--status .newStatusBtn .ipsButton {
  min-height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  white-space: normal;
  line-height: 1.2;
}

/* PON Upgrades' normal Next Match widget is intentionally roomy. The Dashboard
 * right rail needs a compact variant only in this one placement. Keep the real
 * widget markup/data, but scale it to the narrow column and never split team
 * names at arbitrary character boundaries. */
.cPONDashMatrix__cell--nextGame .mvnponNextMatch {
  padding: .72rem .62rem .68rem;
  border-radius: 9px;
  box-shadow: 0 4px 14px rgba(0,0,0,.13);
}
.cPONDashMatrix__cell--nextGame .mvnponNextMatch:before {
  height: 3px;
}
.cPONDashMatrix__cell--nextGame .mvnponNextMatch__title {
  margin: .22rem 0 .6rem;
  font-size: .78rem;
  line-height: 1.15;
  letter-spacing: .045em;
}
.cPONDashMatrix__cell--nextGame .mvnponNextMatch__teams {
  grid-template-columns: minmax(0, 1fr) 22px minmax(0, 1fr);
  gap: .34rem;
  margin-bottom: .5rem;
}
.cPONDashMatrix__cell--nextGame .mvnponNextMatch__badge {
  width: 50px;
  height: 50px;
  margin-bottom: .36rem;
  border-radius: 11px;
}
.cPONDashMatrix__cell--nextGame .mvnponNextMatch__badge img {
  max-width: 40px;
  max-height: 40px;
}
.cPONDashMatrix__cell--nextGame .mvnponNextMatch__name {
  font-size: .72rem;
  line-height: 1.18;
  overflow-wrap: normal !important;
  word-break: normal !important;
  hyphens: none !important;
  text-wrap: balance;
}
.cPONDashMatrix__cell--nextGame .mvnponNextMatch__versus {
  margin-top: -.1rem;
  font-size: .64rem;
}
.cPONDashMatrix__cell--nextGame .mvnponNextMatch__meta {
  gap: .28rem .44rem;
  margin-top: .46rem;
  font-size: .65rem;
  line-height: 1.25;
}
.cPONDashMatrix__cell--nextGame .mvnponNextMatch__metaItem {
  gap: .25rem;
}
.cPONDashMatrix__cell--nextGame .mvnponNextMatch__competition {
  margin-top: .22rem;
}
.cPONDashMatrix__cell--nextGame .mvnponNextMatch__button {
  gap: .4rem;
  margin-top: .62rem;
  padding: .55rem .58rem;
  border-radius: 8px;
  font-size: .7rem;
  box-shadow: 0 7px 14px rgba(72,48,15,.15);
}

@media (max-width: 1050px) {
  .cPONDashMatrix__cell--nextGame .mvnponNextMatch__badge {
    width: 58px;
    height: 58px;
  }
  .cPONDashMatrix__cell--nextGame .mvnponNextMatch__badge img {
    max-width: 46px;
    max-height: 46px;
  }
  .cPONDashMatrix__cell--nextGame .mvnponNextMatch__name {
    font-size: .78rem;
  }
}


/* === Bundled PON Dashboard Welcome Header (build 10021) === */
.pdwh_container{box-sizing:border-box;max-width:100%;margin:.7rem 0}.pdwh_container *{box-sizing:border-box}.ipsWidget:has(.pdwh_container--memberbar),.ipsWidget_inner:has(>.pdwh_container--memberbar),.ipsBox:has(>.pdwh_container--memberbar){border:0!important;background:transparent!important;box-shadow:none!important}.ipsWidget_inner:has(>.pdwh_container--memberbar){padding:0!important}.pdwh_container--memberbar{container-type:inline-size;container-name:pdwh-memberbar;color:#e8e9ea}.pdwh_memberBar{display:flex;align-items:stretch;min-height:60px;width:100%;overflow:hidden;border:1px solid #2c3237;border-radius:7px;background:linear-gradient(180deg,#20262a 0%,#1b2024 100%);box-shadow:inset 0 1px 0 rgba(255,255,255,.035),0 9px 24px rgba(0,0,0,.22)}.pdwh_memberIdentity{display:flex;align-items:center;gap:9px;flex:0 0 auto;min-width:184px;padding:9px 11px}.pdwh_memberAvatarLink{display:block;flex:0 0 auto;border-radius:50%;text-decoration:none!important}.pdwh_memberAvatar{display:block!important;width:40px!important;height:40px!important;object-fit:cover;border-radius:50%!important;border:2px solid #56524a!important;background:#15191c;box-shadow:0 1px 0 rgba(255,255,255,.08),0 3px 8px rgba(0,0,0,.35)}.pdwh_memberGreeting{min-width:0;white-space:nowrap;font-size:11.5px;font-weight:500;line-height:1.25;color:#f1f2f2}.pdwh_memberStats{display:flex;align-items:stretch;min-width:0;flex:1 1 auto}.pdwh_memberStat{position:relative;display:flex;flex:1 1 84px;min-width:72px;max-width:116px;flex-direction:column;justify-content:center;padding:8px 8px 7px;border-left:1px solid rgba(255,255,255,.065)}.pdwh_memberStat--rank{min-width:104px;max-width:132px}.pdwh_memberStat--lastpost{min-width:96px;max-width:126px}.pdwh_memberStatLabel{display:block;margin:0 0 4px;font-size:9px;font-weight:500;line-height:1;color:#9fa4a7;white-space:nowrap}.pdwh_memberStatValue{display:flex;align-items:center;gap:5px;min-width:0;font-size:10.5px;font-weight:600;line-height:1.1;color:#e5e6e7;white-space:nowrap}.pdwh_memberStatValue i{flex:0 0 auto;width:12px;text-align:center;font-size:10px;color:#b79348;opacity:.96}.pdwh_memberStatValue span{display:block;min-width:0;overflow:hidden;text-overflow:ellipsis}.pdwh_memberActions{display:flex;align-items:center;justify-content:flex-end;gap:4px;flex:0 0 auto;padding:10px 8px;border-left:1px solid rgba(255,255,255,.065)}.pdwh_memberAction{display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:5px;min-height:27px;padding:6px 7px!important;border:1px solid #343a3f!important;border-radius:4px!important;background:linear-gradient(180deg,#282e33,#23282d)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.035)!important;color:#e9eaeb!important;font-size:9.5px!important;font-weight:600!important;line-height:1!important;white-space:nowrap;text-decoration:none!important;transition:background .14s ease,border-color .14s ease,transform .14s ease}.pdwh_memberAction i{font-size:10px;color:#f0f1f1}.pdwh_memberAction:hover{border-color:#454d53!important;background:linear-gradient(180deg,#30363b,#292f34)!important;color:#fff!important;text-decoration:none!important}.pdwh_memberAction:active{transform:translateY(1px)}.pdwh_memberAction:focus-visible,.pdwh_memberAvatarLink:focus-visible{outline:2px solid #b79348;outline-offset:2px}.pdwh_memberMessage{margin:6px 1px 0;padding:6px 10px;border-left:2px solid #b79348;border-radius:2px;background:rgba(183,147,72,.08);color:var(--i-color_root,currentColor);font-size:11px;line-height:1.35}
.pdwh_container--guest{container-type:inline-size;container-name:pdwh-guest}.pdwh_guestBar{position:relative;display:flex;align-items:stretch;min-height:76px;overflow:hidden;border:1px solid #2c3237;border-radius:7px;background:linear-gradient(180deg,#20262a 0%,#1b2024 100%);box-shadow:inset 0 1px 0 rgba(255,255,255,.035),0 9px 24px rgba(0,0,0,.22)}.pdwh_guestVisual{position:relative;flex:0 0 150px;min-height:76px;overflow:hidden;border-right:1px solid rgba(255,255,255,.065)}.pdwh_guestCover{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.46}.pdwh_guestCover--fallback{display:block;background:radial-gradient(circle at 25% 30%,rgba(190,151,71,.35),transparent 44%),linear-gradient(135deg,#22282d,#111518)}.pdwh_guestAvatar{position:absolute!important;left:50%;top:50%;transform:translate(-50%,-50%);width:48px!important;height:48px!important;object-fit:cover;border-radius:50%!important;border:2px solid rgba(255,255,255,.7)!important;box-shadow:0 4px 14px rgba(0,0,0,.42)}.pdwh_guestContent{display:flex;align-items:center;justify-content:space-between;gap:18px;flex:1 1 auto;min-width:0;padding:12px 14px}.pdwh_guestCopy{display:flex;flex-direction:column;gap:3px;min-width:0}.pdwh_guestCopy strong{font-size:14px;color:#f3f4f4}.pdwh_guestCopy span{font-size:11px;color:#c0c4c7}.pdwh_guestCopy small{font-size:10px;line-height:1.35;color:#989fa4}.pdwh_guestActions{display:flex;align-items:center;justify-content:flex-end;gap:6px;flex-wrap:wrap}.pdwh_guestActions .ipsButton{white-space:nowrap}
@container pdwh-memberbar (max-width:940px){.pdwh_memberBar{flex-wrap:wrap;min-height:unset}.pdwh_memberIdentity{min-width:184px}.pdwh_memberStats{flex:1 1 calc(100% - 184px)}.pdwh_memberActions{flex:1 1 100%;justify-content:flex-end;padding:7px 10px;border-left:0;border-top:1px solid rgba(255,255,255,.065)}}@container pdwh-memberbar (max-width:760px){.pdwh_memberIdentity{flex:1 1 100%;padding:10px 12px;border-bottom:1px solid rgba(255,255,255,.065)}.pdwh_memberGreeting{font-size:12.5px}.pdwh_memberStats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));flex:1 1 100%}.pdwh_memberStat,.pdwh_memberStat--rank,.pdwh_memberStat--lastpost{max-width:none;min-width:0;border-left:1px solid rgba(255,255,255,.065);border-top:1px solid rgba(255,255,255,.055)}.pdwh_memberStat:nth-child(3n+1){border-left:0}.pdwh_memberStat:nth-child(-n+3){border-top:0}.pdwh_memberActions{justify-content:flex-start;overflow-x:auto;flex-wrap:nowrap;scrollbar-width:thin}.pdwh_memberAction{flex:0 0 auto}.pdwh_memberMessage{font-size:10.5px}}@container pdwh-memberbar (max-width:460px){.pdwh_memberAvatar{width:38px!important;height:38px!important}.pdwh_memberIdentity{gap:8px}.pdwh_memberStats{grid-template-columns:repeat(2,minmax(0,1fr))}.pdwh_memberStat:nth-child(3n+1){border-left:1px solid rgba(255,255,255,.065)}.pdwh_memberStat:nth-child(2n+1){border-left:0}.pdwh_memberStat:nth-child(-n+3){border-top:1px solid rgba(255,255,255,.055)}.pdwh_memberStat:nth-child(-n+2){border-top:0}.pdwh_memberStat{padding:8px 9px}.pdwh_memberActions{padding:7px 8px}.pdwh_memberAction{min-height:27px;padding:6px 7px!important}.pdwh_memberStatLabel{font-size:9px}.pdwh_memberStatValue{font-size:10.5px}}@container pdwh-guest (max-width:760px){.pdwh_guestBar{flex-wrap:wrap}.pdwh_guestVisual{flex:0 0 100%;min-height:56px;border-right:0;border-bottom:1px solid rgba(255,255,255,.065)}.pdwh_guestAvatar{width:40px!important;height:40px!important}.pdwh_guestContent{align-items:flex-start;flex-direction:column;gap:9px}.pdwh_guestActions{justify-content:flex-start}}@media (max-width:940px){.pdwh_container--memberbar .pdwh_memberBar{flex-wrap:wrap}}

/* ========================================================================== 
 * Build 10022 corrective layout pass
 * - roomier bundled welcome header
 * - one continuous uStatus rail with no pagination
 * - Dashboard-owned narrow Next Match presentation
 * - visible Active Viewers month/year cards
 * ======================================================================= */

/* The status editor and feed are now one physical block spanning the first two
 * side-rail rows. Latest Discussions remains one physical centre widget. */
.cPONDashMatrix {
  grid-template-areas:
    "status discussions nextGame"
    "status discussions streak"
    "moods discussions activity";
}
.cPONDashMatrix__cell--status {
  align-self: stretch;
}
.cPONDashMatrix__cell--status .cPONDashOwnedPanel__body {
  padding: 12px;
}
.cPONDashMatrix__cell--status .newStatusBtn {
  margin: 0 0 12px !important;
}
.cPONDashMatrix__cell--status .newStatusBtn .ipsButton {
  min-height: 42px;
}
.cPONDashMatrix__cell--status .ustatus--feed > .ustatus--feed {
  margin: 0;
}
.cPONDashMatrix__cell--status .statusList {
  display: grid;
  gap: 10px;
}
.cPONDashMatrix__cell--status .ustatusWrapper {
  margin: 0 !important;
}
.cPONDashMatrix__cell--status [data-role="pagination"],
.cPONDashMatrix__cell--status .ipsPagination {
  display: none !important;
}

/* Dashboard-owned Next Match. The source fixture still comes from PON
 * Upgrades, but this markup is purpose-built for a narrow dashboard rail. */
.cPONDashNextMatch {
  --pondash-match-gold: #be9747;
  --pondash-match-panel: color-mix(in srgb, var(--pondash-accent) 8%, var(--pondash-bg));
  overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--pondash-accent) 34%, var(--pondash-border));
  border-radius: 12px;
  background: var(--pondash-bg);
  box-shadow: 0 5px 18px rgba(0,0,0,.13);
}
.cPONDashNextMatch__header {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 54px;
  padding: 12px 14px;
  border-bottom: 1px solid var(--pondash-border);
  background: color-mix(in srgb, var(--pondash-bg-soft) 58%, transparent);
}
.cPONDashNextMatch__header > span {
  flex: 0 0 4px;
  width: 4px;
  height: 22px;
  border-radius: 999px;
  background: var(--pondash-match-gold);
}
.cPONDashNextMatch__header h2 {
  margin: 0;
  font-size: 1rem;
  line-height: 1.15;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .025em;
}
.cPONDashNextMatch__body {
  padding: 15px 14px 14px;
}
.cPONDashNextMatch__metaTop {
  display: grid;
  gap: 6px;
  margin-bottom: 14px;
  color: var(--pondash-muted);
  font-size: .78rem;
  line-height: 1.3;
}
.cPONDashNextMatch__metaTop > span,
.cPONDashNextMatch__location {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  min-width: 0;
}
.cPONDashNextMatch__metaTop i,
.cPONDashNextMatch__location i {
  flex: 0 0 15px;
  width: 15px;
  margin-top: .08em;
  text-align: center;
  color: var(--pondash-match-gold);
}
.cPONDashNextMatch__teams {
  display: grid;
  gap: 8px;
}
.cPONDashNextMatch__team {
  display: grid;
  grid-template-columns: 52px minmax(0,1fr);
  align-items: center;
  gap: 11px;
  min-width: 0;
  padding: 8px;
  border: 1px solid color-mix(in srgb, var(--pondash-accent) 18%, var(--pondash-border));
  border-radius: 10px;
  background: var(--pondash-match-panel);
}
.cPONDashNextMatch__badge {
  display: grid;
  place-items: center;
  width: 52px;
  height: 52px;
  overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--pondash-accent) 28%, var(--pondash-border));
  border-radius: 10px;
  background: color-mix(in srgb, var(--pondash-accent) 8%, var(--pondash-bg-soft));
  color: var(--pondash-match-gold);
  font-size: .72rem;
  font-weight: 800;
}
.cPONDashNextMatch__badge img {
  display: block;
  width: 42px;
  height: 42px;
  object-fit: contain;
}
.cPONDashNextMatch__team strong {
  min-width: 0;
  font-size: .9rem;
  line-height: 1.22;
  font-weight: 780;
  overflow-wrap: normal !important;
  word-break: normal !important;
  hyphens: none !important;
}
.cPONDashNextMatch__vs {
  justify-self: center;
  display: grid;
  place-items: center;
  min-width: 38px;
  height: 28px;
  padding: 0 8px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--pondash-accent) 18%, var(--pondash-bg-soft));
  color: var(--pondash-text);
  font-size: .72rem;
  font-weight: 850;
  letter-spacing: .06em;
}
.cPONDashNextMatch__location {
  margin-top: 14px;
  color: var(--pondash-muted);
  font-size: .77rem;
  line-height: 1.35;
}
.cPONDashNextMatch__button {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-top: 13px;
  min-height: 38px;
  padding: 8px 11px;
  border: 1px solid color-mix(in srgb, var(--pondash-accent) 42%, var(--pondash-border));
  border-radius: 8px;
  background: color-mix(in srgb, var(--pondash-accent) 14%, var(--pondash-bg-soft));
  color: var(--pondash-text) !important;
  font-size: .75rem;
  font-weight: 700;
  text-decoration: none !important;
}
.cPONDashNextMatch__button:hover,
.cPONDashNextMatch__button:focus-visible {
  background: color-mix(in srgb, var(--pondash-accent) 21%, var(--pondash-bg-soft));
}
.cPONDashNextMatch__empty {
  padding: 18px 14px;
  color: var(--pondash-muted);
  font-size: .8rem;
}

/* The bundled member header should read as a useful welcome panel, not a
 * compressed toolbar. These values intentionally leave comfortable vertical
 * and horizontal breathing room on desktop. */
.pdwh_container--memberbar .pdwh_memberBar {
  min-height: 86px;
}
.pdwh_container--memberbar .pdwh_memberIdentity {
  min-width: 245px;
  padding: 14px 16px;
  gap: 12px;
}
.pdwh_container--memberbar .pdwh_memberAvatar {
  width: 56px !important;
  height: 56px !important;
  border-width: 2px !important;
}
.pdwh_container--memberbar .pdwh_memberGreeting {
  font-size: 14px;
  font-weight: 600;
  line-height: 1.3;
}
.pdwh_container--memberbar .pdwh_memberStat {
  flex-basis: 104px;
  min-width: 90px;
  max-width: 150px;
  padding: 12px 11px 10px;
}
.pdwh_container--memberbar .pdwh_memberStat--rank {
  min-width: 125px;
  max-width: 165px;
}
.pdwh_container--memberbar .pdwh_memberStat--lastpost {
  min-width: 132px;
  max-width: 185px;
}
.pdwh_container--memberbar .pdwh_memberStatLabel {
  margin-bottom: 6px;
  font-size: 10.5px;
}
.pdwh_container--memberbar .pdwh_memberStatValue {
  gap: 7px;
  font-size: 12.5px;
  line-height: 1.2;
}
.pdwh_container--memberbar .pdwh_memberStatValue i {
  width: 14px;
  font-size: 12px;
}
.pdwh_container--memberbar .pdwh_memberActions {
  gap: 7px;
  padding: 14px 12px;
}
.pdwh_container--memberbar .pdwh_memberAction {
  min-height: 34px;
  padding: 8px 10px !important;
  border-radius: 6px !important;
  font-size: 11px !important;
}
.pdwh_container--memberbar .pdwh_memberAction i {
  font-size: 11px;
}

/* Active Viewers blocks are first-class dashboard blocks. Keep the month card
 * slightly narrower while the year card has room for the longer continuation. */
.cPONDashActiveGrid {
  display: grid !important;
}
.cPONDashActiveCard {
  min-height: 178px;
}

@container pdwh-memberbar (max-width: 1180px) {
  .pdwh_container--memberbar .pdwh_memberBar { flex-wrap: wrap; }
  .pdwh_container--memberbar .pdwh_memberIdentity { min-width: 230px; }
  .pdwh_container--memberbar .pdwh_memberStats { flex: 1 1 calc(100% - 230px); }
  .pdwh_container--memberbar .pdwh_memberActions {
    flex: 1 1 100%;
    justify-content: flex-end;
    border-left: 0;
    border-top: 1px solid rgba(255,255,255,.065);
  }
}

@media (max-width: 1040px) {
  .cPONDashMatrix {
    grid-template-areas:
      "discussions discussions"
      "status nextGame"
      "status streak"
      "moods activity";
  }
}

@media (max-width: 820px) {
  .cPONDashMatrix {
    grid-template-areas:
      "discussions"
      "status"
      "nextGame"
      "streak"
      "moods"
      "activity";
  }
  .cPONDashNextMatch__team {
    grid-template-columns: 58px minmax(0,1fr);
  }
  .cPONDashNextMatch__badge {
    width: 58px;
    height: 58px;
  }
  .cPONDashNextMatch__badge img {
    width: 46px;
    height: 46px;
  }
}

@container pdwh-memberbar (max-width: 800px) {
  .pdwh_container--memberbar .pdwh_memberIdentity {
    flex: 1 1 100%;
    min-width: 0;
    padding: 13px 14px;
    border-bottom: 1px solid rgba(255,255,255,.065);
  }
  .pdwh_container--memberbar .pdwh_memberStats {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    flex: 1 1 100%;
  }
  .pdwh_container--memberbar .pdwh_memberStat,
  .pdwh_container--memberbar .pdwh_memberStat--rank,
  .pdwh_container--memberbar .pdwh_memberStat--lastpost {
    min-width: 0;
    max-width: none;
    padding: 11px 12px;
  }
  .pdwh_container--memberbar .pdwh_memberActions {
    justify-content: flex-start;
    overflow-x: auto;
    flex-wrap: nowrap;
  }
}

@container pdwh-memberbar (max-width: 480px) {
  .pdwh_container--memberbar .pdwh_memberAvatar {
    width: 48px !important;
    height: 48px !important;
  }
  .pdwh_container--memberbar .pdwh_memberGreeting { font-size: 13px; }
  .pdwh_container--memberbar .pdwh_memberStats { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .pdwh_container--memberbar .pdwh_memberStatLabel { font-size: 10px; }
  .pdwh_container--memberbar .pdwh_memberStatValue { font-size: 11.5px; }
}


/* ========================================================================== 
 * Build 10024 runtime visual fit pass
 * - balanced single-row welcome header on desktop
 * - simplified badge/name/vs Next Match hierarchy
 * - no-scroll Active Viewers avatar runs with runtime fit bubble
 * - Pages block #120 in the lower-right matrix rail
 * ======================================================================= */

/* Balanced welcome header: one useful row on normal desktop widths, not a
 * compressed toolbar and not a three-row panel with dead space. */
.pdwh_container--memberbar .pdwh_memberBar {
  display: grid;
  grid-template-columns: minmax(215px, 1.15fr) minmax(545px, 3.7fr) auto;
  align-items: stretch;
  min-height: 94px;
  overflow: hidden;
}
.pdwh_container--memberbar .pdwh_memberIdentity {
  min-width: 0;
  padding: 14px 15px;
}
.pdwh_container--memberbar .pdwh_memberAvatar {
  width: 54px !important;
  height: 54px !important;
}
.pdwh_container--memberbar .pdwh_memberGreeting {
  white-space: normal;
  font-size: 13px;
  line-height: 1.3;
}
.pdwh_container--memberbar .pdwh_memberStats {
  display: grid;
  grid-template-columns: 1.2fr repeat(4, minmax(82px, 1fr)) 1.35fr;
  min-width: 0;
  align-items: stretch;
}
.pdwh_container--memberbar .pdwh_memberStat,
.pdwh_container--memberbar .pdwh_memberStat--rank,
.pdwh_container--memberbar .pdwh_memberStat--lastpost {
  min-width: 0;
  max-width: none;
  padding: 13px 12px 11px;
}
.pdwh_container--memberbar .pdwh_memberStatLabel {
  margin-bottom: 7px;
  font-size: 10px;
}
.pdwh_container--memberbar .pdwh_memberStatValue {
  font-size: 12px;
  line-height: 1.22;
  white-space: normal;
}
.pdwh_container--memberbar .pdwh_memberActions {
  align-items: center;
  align-content: center;
  flex-wrap: wrap;
  max-width: 235px;
  padding: 13px 12px;
  border-top: 0;
}
.pdwh_container--memberbar .pdwh_memberAction {
  min-height: 36px;
  padding: 8px 10px !important;
  font-size: 10.5px !important;
}

/* Fourth right-rail slot for the requested Pages block. Discussions remains
 * the single continuous centre widget and spans the complete stack. */
.cPONDashMatrix {
  grid-template-areas:
    "status discussions nextGame"
    "status discussions streak"
    "moods discussions activity"
    ". discussions pages120";
}
.cPONDashMatrix__cell--pages120 { grid-area: pages120; min-width: 0; }
.cPONDashMatrix__cell--pages120 .cPONDashNativeWidget,
.cPONDashMatrix__cell--pages120 .cPONDashPagesBlock {
  max-width: 100%;
  min-width: 0;
  overflow: hidden;
}

/* Next Match: badge + name, VS, badge + name, then match information. Avoid
 * nested team cards so the narrow rail stays clean and readable. */
.cPONDashNextMatch__body { padding: 15px 15px 14px; }
.cPONDashNextMatch__teams {
  display: grid;
  gap: 9px;
}
.cPONDashNextMatch__teamLine {
  display: grid;
  grid-template-columns: 54px minmax(0, 1fr);
  align-items: center;
  gap: 12px;
  min-width: 0;
  padding: 2px 0;
}
.cPONDashNextMatch__teamLine strong {
  min-width: 0;
  font-size: .94rem;
  line-height: 1.22;
  font-weight: 800;
  overflow-wrap: normal !important;
  word-break: normal !important;
  hyphens: none !important;
}
.cPONDashNextMatch__badge {
  width: 54px;
  height: 54px;
  border-radius: 11px;
}
.cPONDashNextMatch__badge img { width: 44px; height: 44px; }
.cPONDashNextMatch__vs {
  justify-self: center;
  margin-left: 0;
  min-width: 42px;
  height: 30px;
}
.cPONDashNextMatch__info {
  display: grid;
  gap: 8px;
  margin-top: 14px;
  padding-top: 13px;
  border-top: 1px solid var(--pondash-border);
}
.cPONDashNextMatch__info > span {
  display: grid;
  grid-template-columns: 18px 76px minmax(0,1fr);
  align-items: start;
  gap: 7px;
  min-width: 0;
  color: var(--pondash-muted);
  font-size: .75rem;
  line-height: 1.35;
}
.cPONDashNextMatch__info i {
  width: 18px;
  margin-top: .1em;
  text-align: center;
  color: var(--pondash-match-gold);
}
.cPONDashNextMatch__info b {
  color: color-mix(in srgb, var(--pondash-text) 80%, var(--pondash-muted));
  font-weight: 650;
}
.cPONDashNextMatch__info em {
  min-width: 0;
  color: var(--pondash-muted);
  font-style: normal;
  overflow-wrap: normal;
  word-break: normal;
}

/* Active Viewers must never become horizontal scrollers. The small runtime
 * fitter hides only excess rendered avatars and updates the +remaining bubble. */
.cPONDashAvatarRun {
  overflow: hidden !important;
  scrollbar-width: none;
  padding-right: 2px;
}
.cPONDashAvatarRun::-webkit-scrollbar { display: none; }
.cPONDashAvatarRun__member[hidden],
.cPONDashAvatarRun__more[hidden] { display: none !important; }

/* Let the stock core activity widget use the rail width without inheriting
 * accidental minimum widths from a full-width Page Builder placement. */
.cPONDashMatrix__cell--activity :where(.ipsWidget,.ipsWidget__content,.ipsData,.ipsStream) {
  min-width: 0;
  max-width: 100%;
}

@container pdwh-memberbar (max-width: 1040px) {
  .pdwh_container--memberbar .pdwh_memberBar {
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas:
      "identity actions"
      "stats stats";
    min-height: 0;
  }
  .pdwh_container--memberbar .pdwh_memberIdentity { grid-area: identity; }
  .pdwh_container--memberbar .pdwh_memberStats {
    grid-area: stats;
    grid-template-columns: repeat(6, minmax(0,1fr));
    border-top: 1px solid rgba(255,255,255,.065);
  }
  .pdwh_container--memberbar .pdwh_memberActions {
    grid-area: actions;
    max-width: none;
    justify-content: flex-end;
    border-left: 1px solid rgba(255,255,255,.065);
    border-top: 0;
  }
}

@container pdwh-memberbar (max-width: 720px) {
  .pdwh_container--memberbar .pdwh_memberStats { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .pdwh_container--memberbar .pdwh_memberActions { overflow: visible; flex-wrap: wrap; }
}

@container pdwh-memberbar (max-width: 500px) {
  .pdwh_container--memberbar .pdwh_memberBar {
    grid-template-columns: minmax(0,1fr);
    grid-template-areas: "identity" "actions" "stats";
  }
  .pdwh_container--memberbar .pdwh_memberActions {
    justify-content: flex-start;
    border-left: 0;
    border-top: 1px solid rgba(255,255,255,.065);
  }
  .pdwh_container--memberbar .pdwh_memberStats { grid-template-columns: repeat(2,minmax(0,1fr)); }
}

@media (max-width: 1040px) {
  .cPONDashMatrix {
    grid-template-areas:
      "discussions discussions"
      "status nextGame"
      "status streak"
      "moods activity"
      "pages120 pages120";
  }
}

@media (max-width: 820px) {
  .cPONDashMatrix {
    grid-template-areas:
      "discussions"
      "status"
      "nextGame"
      "streak"
      "moods"
      "activity"
      "pages120";
  }
}


/* ========================================================================== 
 * Build 10026 rail-density / utility-widget pass
 * - side widgets stack naturally beside Latest Discussions (no shared row stretch)
 * - longer usernames get a dedicated greeting line with Welcome back below
 * - Next Match VS has a full-width centring row
 * - core Recent Achievements and Tell a friend slots
 * ======================================================================= */

/* Separate column stacks prevent the tall 26-topic discussion feed from
 * distributing its height across side-widget grid rows. Each side widget now
 * keeps its own intrinsic height and sits directly beneath the previous one. */
.cPONDashMatrix.cPONDashMatrix--stackedRails {
  display: grid;
  grid-template-columns: minmax(230px,.9fr) minmax(440px,2.1fr) minmax(240px,.95fr);
  grid-template-areas: none;
  gap: var(--pondash-summary-gap);
  align-items: start;
}
.cPONDashMatrix--stackedRails > .cPONDashRailStack {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: var(--pondash-summary-gap);
  min-width: 0;
  width: 100%;
  align-self: start;
}
/* These cells originally lived in the parent dashboard grid and therefore
 * still carry named grid-area values such as status, moods and nextGame.
 * Once nested inside a rail those names create implicit grid tracks and can
 * collapse the widgets into thin strips. Reset placement inside the rail so
 * every widget consumes the full rail width and stacks at its natural height. */
.cPONDashMatrix--stackedRails > .cPONDashRailStack > .cPONDashMatrix__cell {
  grid-area: auto !important;
  flex: 0 0 auto;
  width: 100%;
  max-width: 100%;
  min-width: 0;
}
.cPONDashMatrix--stackedRails > .cPONDashRailStack--left { grid-column: 1; grid-row: 1; }
.cPONDashMatrix--stackedRails > .cPONDashMatrix__cell--discussions { grid-column: 2; grid-row: 1; align-self: start; }
.cPONDashMatrix--stackedRails > .cPONDashRailStack--right { grid-column: 3; grid-row: 1; }
.cPONDashMatrix--stackedRails .cPONDashMatrix__cell { min-width: 0; align-self: start; }
.cPONDashMatrix--stackedRails .cPONDashMatrix__cell--discussions > .cPONDashNativeWidget,
.cPONDashMatrix--stackedRails .cPONDashMatrix__cell--discussions .ldWidget { height: auto !important; }

/* Give long usernames the whole first greeting line; the welcome message no
 * longer competes for the same horizontal space. */
.pdwh_container--memberbar .pdwh_memberBar {
  grid-template-columns: minmax(285px,1.45fr) minmax(520px,3.5fr) auto;
}
.pdwh_container--memberbar .pdwh_memberIdentity { gap: 12px; }
.pdwh_container--memberbar .pdwh_memberGreeting {
  display: grid;
  gap: 3px;
  min-width: 0;
  line-height: 1.2;
}
.pdwh_container--memberbar .pdwh_memberGreetingLine {
  display: block;
  min-width: 0;
  color: #f3f4f4;
  font-size: 14px;
  font-weight: 560;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.pdwh_container--memberbar .pdwh_memberGreetingLine strong { font-weight: 750; }
.pdwh_container--memberbar .pdwh_memberGreetingBack {
  display: block;
  color: #aeb3b7;
  font-size: 13px;
  font-weight: 600;
  white-space: nowrap;
}

/* Explicit full-width centring context fixes the VS pill regardless of any
 * inherited widget/grid alignment from the surrounding theme. */
.cPONDashNextMatch__teams { width: 100%; }
.cPONDashNextMatch__versusRow {
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: center;
  min-width: 0;
}
.cPONDashNextMatch__versusRow .cPONDashNextMatch__vs {
  flex: 0 0 auto;
  justify-self: auto !important;
  margin: 0 auto !important;
}

/* Stock core sidebar widgets should use their natural size in the rail. */
.cPONDashMatrix__cell--achievements,
.cPONDashMatrix__cell--tellFriend { min-width: 0; }
.cPONDashMatrix__cell--achievements :where(.ipsWidget,.ipsWidget__content),
.cPONDashMatrix__cell--tellFriend :where(.ipsWidget,.ipsWidget__content) {
  min-width: 0;
  max-width: 100%;
}

@container pdwh-memberbar (max-width: 1120px) {
  .pdwh_container--memberbar .pdwh_memberBar {
    grid-template-columns: minmax(0,1fr) auto;
    grid-template-areas: "identity actions" "stats stats";
  }
  .pdwh_container--memberbar .pdwh_memberIdentity { grid-area: identity; min-width: 0; }
  .pdwh_container--memberbar .pdwh_memberStats { grid-area: stats; }
  .pdwh_container--memberbar .pdwh_memberActions { grid-area: actions; }
}
@container pdwh-memberbar (max-width: 500px) {
  .pdwh_container--memberbar .pdwh_memberBar {
    grid-template-columns: minmax(0,1fr);
    grid-template-areas: "identity" "actions" "stats";
  }
  /* Centre the welcome row and shortcuts when the stacked mobile layout has
   * spare width. Longer usernames wrap naturally (greeting line already allows
   * wrapping below) so centring never clips, it just fills the dead space. */
  .pdwh_container--memberbar .pdwh_memberIdentity {
    justify-content: center;
  }
  .pdwh_container--memberbar .pdwh_memberGreeting {
    text-align: center;
  }
  .pdwh_container--memberbar .pdwh_memberActions {
    justify-content: center;
    max-width: none;
    border-left: 0;
    border-top: 1px solid rgba(255,255,255,.065);
  }
  .pdwh_container--memberbar .pdwh_memberGreetingLine { white-space: normal; }
}

@media (max-width: 1040px) {
  .cPONDashMatrix.cPONDashMatrix--stackedRails {
    grid-template-columns: minmax(0,1fr) minmax(0,1fr);
  }
  .cPONDashMatrix--stackedRails > .cPONDashMatrix__cell--discussions { grid-column: 1 / -1; grid-row: 1; }
  .cPONDashMatrix--stackedRails > .cPONDashRailStack--left { grid-column: 1; grid-row: 2; }
  .cPONDashMatrix--stackedRails > .cPONDashRailStack--right { grid-column: 2; grid-row: 2; }
}
@media (max-width: 820px) {
  .cPONDashMatrix.cPONDashMatrix--stackedRails { grid-template-columns: minmax(0,1fr); }
  .cPONDashMatrix--stackedRails > .cPONDashMatrix__cell--discussions { grid-column: 1; grid-row: 1; }
  .cPONDashMatrix--stackedRails > .cPONDashRailStack--left { grid-column: 1; grid-row: 2; }
  .cPONDashMatrix--stackedRails > .cPONDashRailStack--right { grid-column: 1; grid-row: 3; }
}


/* ==========================================================================
 * Build 10027 rail-placement / welcome-copy hotfix
 * - nested side rails use flex so legacy grid-area names cannot create
 *   implicit columns and collapse widgets
 * - Welcome back uses normal supporting-copy size rather than micro text
 * ======================================================================= */


/* ========================================================================== 
 * Build 10028 discussion-density / smart-sticky rail pass
 * - Latest Community Discussions is capped at 26 items by WidgetBridge
 * - desktop side rails remain alongside the long discussion feed as the page
 *   scrolls; tall rails use a calculated negative sticky top so their lower
 *   widgets remain reachable without a nested scrollbar or clipped popovers
 * ======================================================================= */
@media (min-width: 1041px) {
  .cPONDashMatrix--stackedRails > .cPONDashRailStack--left,
  .cPONDashMatrix--stackedRails > .cPONDashRailStack--right {
    position: -webkit-sticky;
    position: sticky;
    top: var(--pondash-rail-sticky-top, 16px);
    align-self: start;
    z-index: 1;
    will-change: top;
  }
}
@media (max-width: 1040px) {
  .cPONDashMatrix--stackedRails > .cPONDashRailStack--left,
  .cPONDashMatrix--stackedRails > .cPONDashRailStack--right {
    position: static;
    top: auto;
    z-index: auto;
  }
}


/* ========================================================================== 
 * Build 10030 guest/member promotion and bundled guest-header fit
 * ======================================================================= */
/* The welcome widget is already hosted by the Dashboard. Strip IPS widget chrome
 * for both member and guest variants so a guest does not get a second empty
 * rounded panel above/around the bundled header. */
.cPONDash__welcome > .cPONDashNativeWidget.ponDashboardWelcomeWidget,
.cPONDash__welcome > .cPONDashNativeWidget.ipsWidget,
.ipsWidget:has(.pdwh_container--guest),
.ipsWidget_inner:has(> .pdwh_container--guest),
.ipsBox:has(> .pdwh_container--guest) {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
.cPONDash__welcome > .cPONDashNativeWidget.ponDashboardWelcomeWidget,
.ipsWidget_inner:has(> .pdwh_container--guest) { padding: 0 !important; }
.cPONDash__welcome .pdwh_container { margin: 0 !important; }

/* Members get four compact discovery destinations while the Content Goal is
 * expanded. Keep this panel compact enough to sit under Who's Online. */
.cPONDashPromo--goalOpen .cPONDashPromo__actions--member {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.cPONDashPromo--goalOpen .cPONDashPromo__actions--member a {
  min-height: 43px;
  padding-block: 8px;
}

/* Guest replacement: two primary choices, then three secondary discovery links,
 * followed by the deliberately stronger ACP-configurable Why join call to action. */
.cPONDashPromo--guest .cPONDashPromo__actions--guestPrimary {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.cPONDashPromo--guest .cPONDashPromo__actions--guestSecondary {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-top: 9px;
}
.cPONDashPromo--guest .cPONDashPromo__actions--guestSecondary a {
  min-height: 44px;
  padding: 9px 10px;
}
.cPONDashPromo__whyJoin {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-top: 12px;
  min-height: 64px;
  padding: 12px 16px;
  border: 1px solid color-mix(in srgb, var(--pondash-accent) 58%, var(--pondash-border));
  border-radius: 8px;
  background: linear-gradient(135deg, color-mix(in srgb, var(--pondash-accent) 20%, var(--pondash-bg-soft)), var(--pondash-bg-soft));
  color: var(--pondash-text) !important;
  text-decoration: none !important;
}
.cPONDashPromo__whyJoin > span { display: grid; gap: 3px; min-width: 0; }
.cPONDashPromo__whyJoin strong { font-size: .92rem; line-height: 1.2; }
.cPONDashPromo__whyJoin small { color: var(--pondash-muted); font-size: .75rem; line-height: 1.3; }
.cPONDashPromo__whyJoin > i { flex: 0 0 auto; color: var(--pondash-accent); }
.cPONDashPromo__whyJoin:hover,
.cPONDashPromo__whyJoin:focus-visible {
  border-color: color-mix(in srgb, var(--pondash-accent) 80%, var(--pondash-border));
  background: linear-gradient(135deg, color-mix(in srgb, var(--pondash-accent) 28%, var(--pondash-bg-soft)), var(--pondash-bg-soft));
}

@media (max-width: 760px) {
  .cPONDashPromo--guest .cPONDashPromo__actions--guestSecondary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  /* Three secondary links in a two-column grid leave the last one orphaned on
   * its own row. Centre that trailing link so "Wallpapers" no longer hangs left. */
  .cPONDashPromo--guest .cPONDashPromo__actions--guestSecondary a:last-child:nth-child(odd) {
    grid-column: 1 / -1;
    justify-self: center;
    width: calc(50% - 4.5px);
  }
}
@media (max-width: 520px) {
  .cPONDashPromo--guest .cPONDashPromo__actions--guestPrimary,
  .cPONDashPromo--guest .cPONDashPromo__actions--guestSecondary,
  .cPONDashPromo--goalOpen .cPONDashPromo__actions--member {
    grid-template-columns: minmax(0, 1fr);
  }
}

/* ========================================================================== 
 * Build 10031 member promotion button fit
 * Give the two long content destinations the full rail width, then keep the
 * shorter Store/History destinations side-by-side. This uses the available
 * vertical room beside an expanded Content Goal and prevents awkward wrapping.
 * ======================================================================= */
.cPONDashPromo--goalOpen {
  width: 100%;
  padding: 18px;
}
.cPONDashPromo--goalOpen .cPONDashPromo__actions--member {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-template-areas:
    "articles articles"
    "discussions discussions"
    "store history";
  gap: 10px;
}
.cPONDashPromo--goalOpen .cPONDashPromo__actions--member > a:nth-child(1) { grid-area: articles; }
.cPONDashPromo--goalOpen .cPONDashPromo__actions--member > a:nth-child(2) { grid-area: discussions; }
.cPONDashPromo--goalOpen .cPONDashPromo__actions--member > a:nth-child(3) { grid-area: store; }
.cPONDashPromo--goalOpen .cPONDashPromo__actions--member > a:nth-child(4) { grid-area: history; }
.cPONDashPromo--goalOpen .cPONDashPromo__actions--member > a {
  min-width: 0;
  min-height: 48px;
  padding: 10px 13px;
  font-size: .82rem;
  line-height: 1.25;
}
.cPONDashPromo--goalOpen .cPONDashPromo__actions--member > a:nth-child(-n+2) {
  min-height: 52px;
  padding-inline: 14px;
}
.cPONDashPromo--goalOpen .cPONDashPromo__actions--member > a span {
  min-width: 0;
  overflow-wrap: normal;
  word-break: normal;
}

@media (max-width: 520px) {
  .cPONDashPromo--goalOpen .cPONDashPromo__actions--member {
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas:
      "articles"
      "discussions"
      "store"
      "history";
  }
}

/* =======================================================================
 * Build 10032 Who's Online width refinement
 * Give the source Better Who's Online widget and its companion promotion a
 * little more horizontal breathing room without materially shrinking the
 * Community Contributions feature. The grid still collapses to one column at
 * the existing mobile breakpoint.
 * ======================================================================= */
@media (min-width: 1181px) {
  .cPONDash__topGrid,
  .cPONDash__topGrid--withoutGoal {
    grid-template-columns: minmax(0, 2.85fr) minmax(320px, 1.15fr);
  }
}

@media (min-width: 821px) and (max-width: 1180px) {
  .cPONDash__topGrid,
  .cPONDash__topGrid--withoutGoal {
    grid-template-columns: minmax(0, 2.1fr) minmax(290px, 1fr);
  }
}



/* =======================================================================
 * Build 10033 Who's Online height refinement
 * Build 10032 interpreted "more room" horizontally. Restore the proven
 * column proportions and instead give Better Who's Online additional
 * vertical breathing room on desktop/narrow desktop. The recent-activity
 * summary remains anchored at the bottom of the taller content area.
 * ======================================================================= */
@media (min-width: 1181px) {
  .cPONDash__topGrid,
  .cPONDash__topGrid--withoutGoal {
    grid-template-columns: minmax(0, 3.25fr) minmax(260px, 1fr);
  }

  .cPONDash__whoOnline > .cPONDashNativeWidget > [data-bwo-widget-root] {
    display: flex;
    flex-direction: column;
    min-height: 455px;
  }
}

@media (min-width: 821px) and (max-width: 1180px) {
  .cPONDash__topGrid,
  .cPONDash__topGrid--withoutGoal {
    grid-template-columns: minmax(0, 2.35fr) minmax(240px, .9fr);
  }

  .cPONDash__whoOnline > .cPONDashNativeWidget > [data-bwo-widget-root] {
    display: flex;
    flex-direction: column;
    min-height: 420px;
  }
}

@media (min-width: 821px) {
  .cPONDash__whoOnline > .cPONDashNativeWidget,
  .cPONDash__whoOnline > .cPONDashNativeWidget > [data-bwo-widget-root] {
    height: 100%;
  }

  .cPONDash__whoOnline > .cPONDashNativeWidget > [data-bwo-widget-root] > .ipsWidget__content {
    flex: 1 1 auto;
  }

  .cPONDash__whoOnline [data-bwo-widget-root] .ipsWidget__content > p:last-child {
    margin-top: auto;
    margin-bottom: 0;
    padding-top: 18px;
  }
}


/* =======================================================================
 * Build 10036 Who's Online height final trim
 * The real PON theme showed that 10035 still carried more empty height than
 * needed. Keep only a very small amount of extra breathing room over the
 * Better Who's Online widget's natural height so the promotion sits closer.
 * ======================================================================= */
@media (min-width: 1181px) {
  .cPONDash__whoOnline > .cPONDashNativeWidget > [data-bwo-widget-root] {
    min-height: 300px;
  }
}

@media (min-width: 821px) and (max-width: 1180px) {
  .cPONDash__whoOnline > .cPONDashNativeWidget > [data-bwo-widget-root] {
    min-height: 290px;
  }
}

/* --------------------------------------------------------------------------
 * Build 10037 Phase 2: focused-page source-widget composition.
 * These rules only provide safe layout bounds for native/source widgets. The
 * detailed Invision-style visual polish is intentionally deferred to Phase 3.
 * ----------------------------------------------------------------------- */
.cPONDashFocusNative {
  min-width: 0;
}
.cPONDashFocusNative > .cPONDashNativeWidget,
.cPONDashFocusNative > .cPONDashNativeWidget > .ipsWidget {
  min-width: 0;
  max-width: 100%;
}
.cPONDashFocusNativeGrid {
  display: grid;
  gap: 12px;
  align-items: start;
}
.cPONDashFocusNativeGrid--members {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.cPONDashFocusNativeGrid--members .cPONDashFocusNative--activeMembers,
.cPONDashFocusNativeGrid--members .cPONDashFocusNative--achievements,
.cPONDashFocusNativeGrid--members .cPONDashFocusNative--onlineToday {
  grid-column: 1 / -1;
}
.cPONDashFocusNativeGrid--community {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.cPONDashMatchday--native .cPONDashFocusNative--nextMatch {
  min-width: 0;
}
@media (max-width: 980px) {
  .cPONDashFocusNativeGrid--members,
  .cPONDashFocusNativeGrid--community {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .cPONDashFocusNativeGrid--members .cPONDashFocusNative--activeMembers,
  .cPONDashFocusNativeGrid--members .cPONDashFocusNative--achievements,
  .cPONDashFocusNativeGrid--members .cPONDashFocusNative--onlineToday {
    grid-column: 1 / -1;
  }
}
@media (max-width: 640px) {
  .cPONDashFocusNativeGrid--members,
  .cPONDashFocusNativeGrid--community {
    grid-template-columns: 1fr;
  }
  .cPONDashFocusNativeGrid--members .cPONDashFocusNative--activeMembers,
  .cPONDashFocusNativeGrid--members .cPONDashFocusNative--achievements,
  .cPONDashFocusNativeGrid--members .cPONDashFocusNative--onlineToday {
    grid-column: auto;
  }
}

/* ========================================================================== 
 * Build 10038 - Phase 3 shared focused-page UI framework
 *
 * The focused destinations now share one Invision-style shell. Source widgets
 * retain ownership of their templates and behaviour; these rules standardise
 * only page hierarchy, spacing, frames, touch targets, overflow and responsive
 * composition around those widgets.
 * ======================================================================= */
.cPONDashFocus[data-layout-contract='pon-focus-v1'] {
  --pondash-focus-gap: clamp(10px, 1.1vw, 14px);
  --pondash-focus-control: 42px;
  gap: var(--pondash-focus-gap);
  width: 100%;
  max-width: 100%;
  min-width: 0;
}

.cPONDashFocus[data-layout-contract='pon-focus-v1'] > * {
  min-width: 0;
}

.cPONDashFocus[data-layout-contract='pon-focus-v1'] .cPONDashFocus__header {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: clamp(16px, 2.2vw, 28px);
  min-height: 112px;
  margin: 0;
  padding: clamp(17px, 2vw, 24px) clamp(18px, 2.2vw, 26px);
  overflow: hidden;
  border: 1px solid var(--pondash-border);
  border-radius: var(--pondash-radius);
  background: var(--pondash-bg);
  box-shadow: 0 1px 2px rgba(0,0,0,.08);
}

.cPONDashFocus[data-layout-contract='pon-focus-v1'] .cPONDashFocus__header::before {
  content: '';
  position: absolute;
  inset-block: 0;
  inset-inline-start: 0;
  width: 3px;
  background: var(--pondash-accent);
}

.cPONDashFocus__heading {
  display: grid;
  gap: 5px;
  min-width: 0;
}

.cPONDashFocus__eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  width: max-content;
  max-width: 100%;
  color: var(--pondash-soft);
  font-size: .61rem;
  font-weight: 760;
  letter-spacing: .06em;
  line-height: 1.2;
  text-transform: uppercase;
}

.cPONDashFocus__eyebrow i {
  color: var(--pondash-accent);
  font-size: .68rem;
}

.cPONDashFocus[data-layout-contract='pon-focus-v1'] .cPONDashFocus__header h1 {
  margin: 0;
  color: var(--pondash-text);
  font-size: clamp(1.2rem, 1.75vw, 1.55rem);
  font-weight: 720;
  line-height: 1.2;
}

.cPONDashFocus[data-layout-contract='pon-focus-v1'] .cPONDashFocus__header p {
  max-width: 760px;
  margin: 0;
  color: var(--pondash-muted);
  font-size: .78rem;
  line-height: 1.5;
}

.cPONDashFocus__primaryAction {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: 9px;
  min-height: var(--pondash-focus-control);
  flex: 0 0 auto;
  white-space: nowrap;
}

/* Focus navigation is one grouped IPS-style row rather than four unrelated
 * promotional cards. The main Dashboard navigation remains unchanged. */
.cPONDashFocus[data-layout-contract='pon-focus-v1'] .cPONDashNavGrid--focus {
  gap: 1px;
  margin: 0;
  overflow: hidden;
  border: 1px solid var(--pondash-border);
  border-radius: var(--pondash-radius);
  background: var(--pondash-border);
  box-shadow: 0 1px 2px rgba(0,0,0,.06);
}

.cPONDashFocus[data-layout-contract='pon-focus-v1'] .cPONDashNavGrid--focus .cPONDashNavCard {
  min-height: 78px;
  padding: 12px 14px;
  border: 0;
  border-radius: 0;
  background: var(--pondash-bg);
  box-shadow: none;
}

.cPONDashFocus[data-layout-contract='pon-focus-v1'] .cPONDashNavGrid--focus .cPONDashNavCard:hover,
.cPONDashFocus[data-layout-contract='pon-focus-v1'] .cPONDashNavGrid--focus .cPONDashNavCard:focus-visible {
  background: color-mix(in srgb, var(--pondash-bg) 92%, var(--pondash-accent) 8%);
}

.cPONDashFocus[data-layout-contract='pon-focus-v1'] .cPONDashNavGrid--focus .cPONDashNavCard__icon {
  width: 42px;
  height: 42px;
  font-size: 1.35rem;
}

.cPONDashFocus[data-layout-contract='pon-focus-v1'] .cPONDashNavGrid--focus .cPONDashNavCard__body {
  gap: 3px;
}

.cPONDashFocus[data-layout-contract='pon-focus-v1'] .cPONDashNavGrid--focus .cPONDashNavCard__body strong {
  font-size: .88rem;
}

.cPONDashFocus[data-layout-contract='pon-focus-v1'] .cPONDashNavGrid--focus .cPONDashNavCard__body span {
  font-size: .69rem;
  line-height: 1.35;
}

/* Secondary routes use a compact native-style utility strip. */
.cPONDashFocusToolbar {
  display: flex;
  align-items: stretch;
  min-width: 0;
  min-height: var(--pondash-focus-control);
  margin: 0;
  overflow: hidden;
  border: 1px solid var(--pondash-border);
  border-radius: var(--pondash-radius);
  background: var(--pondash-bg);
  box-shadow: 0 1px 2px rgba(0,0,0,.05);
}

.cPONDashFocusToolbar__label {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  flex: 0 0 auto;
  min-height: var(--pondash-focus-control);
  padding: 0 13px;
  border-inline-end: 1px solid var(--pondash-border);
  background: color-mix(in srgb, var(--pondash-bg-soft) 72%, transparent);
  color: var(--pondash-muted);
  font-size: .68rem;
  font-weight: 700;
}

.cPONDashFocusToolbar__label i {
  color: var(--pondash-accent);
}

.cPONDashFocusToolbar__links {
  display: flex;
  align-items: stretch;
  flex: 1 1 auto;
  min-width: 0;
  overflow-x: auto;
  scrollbar-width: thin;
}

.cPONDashFocusToolbar__links a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: var(--pondash-focus-control);
  padding: 0 13px;
  border-inline-end: 1px solid var(--pondash-border);
  color: var(--pondash-text) !important;
  font-size: .69rem;
  font-weight: 650;
  text-decoration: none !important;
  white-space: nowrap;
}

.cPONDashFocusToolbar__links a:last-child {
  border-inline-end: 0;
}

.cPONDashFocusToolbar__links a:hover,
.cPONDashFocusToolbar__links a:focus-visible {
  background: var(--pondash-bg-soft);
}

.cPONDashFocusToolbar__links a i {
  color: var(--pondash-soft);
  font-size: .58rem;
}

.cPONDashFocus__content {
  display: grid;
  gap: var(--pondash-focus-gap);
  min-width: 0;
}

.cPONDashFocus__content > * {
  min-width: 0;
  margin-block: 0;
}

/* A source widget gets a predictable layout boundary without restyling its
 * internal content. This is important for core IPS widgets, which already
 * provide their own menus, permission states and interactive behaviour. */
.cPONDashFocusNative {
  position: relative;
  min-width: 0;
  max-width: 100%;
  margin: 0;
  border-radius: var(--pondash-radius);
  isolation: isolate;
}

.cPONDashFocusNative > .cPONDashNativeWidget {
  width: 100%;
  min-width: 0;
  max-width: 100%;
  margin: 0;
}

.cPONDashFocusNative > .cPONDashNativeWidget > * {
  max-width: 100%;
  margin-block-start: 0;
  margin-block-end: 0;
}

.cPONDashFocusNative > .cPONDashNativeWidget > :is(.ipsBox, .ipsWidget) {
  width: 100%;
}

.cPONDashFocusNative :is(table, .ipsTable, .ipsData) {
  max-width: 100%;
}

.cPONDashFocusNative :is(input, select, textarea, button) {
  max-width: 100%;
}

.cPONDashFocusNative img,
.cPONDashFocusNative video,
.cPONDashFocusNative iframe {
  max-width: 100%;
}

.cPONDashFocusNative a:focus-visible,
.cPONDashFocusToolbar a:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--pondash-accent) 70%, transparent);
  outline-offset: -2px;
}

.cPONDashFocusNativeGrid,
.cPONDashMatchday--native,
.cPONDashFocus__grid,
.cPONDashFocus__stack {
  gap: var(--pondash-focus-gap);
}

/* Shared fail-soft state used when a whole destination has no usable source
 * widgets. Individual optional widgets still disappear silently. */
.cPONDashFocusState {
  display: flex;
  align-items: center;
  gap: 13px;
  min-height: 88px;
  margin: 0;
  padding: 16px 18px;
  border: 1px solid var(--pondash-border);
  border-radius: var(--pondash-radius);
  background: var(--pondash-bg);
  color: var(--pondash-muted);
}

.cPONDashFocusState > i {
  display: grid;
  place-items: center;
  flex: 0 0 38px;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: color-mix(in srgb, var(--pondash-accent) 10%, var(--pondash-bg-soft));
  color: var(--pondash-accent);
  font-size: .95rem;
}

.cPONDashFocusState > div {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.cPONDashFocusState strong {
  color: var(--pondash-text);
  font-size: .78rem;
  line-height: 1.3;
}

.cPONDashFocusState span {
  color: var(--pondash-muted);
  font-size: .69rem;
  line-height: 1.45;
}

/* Loading skeleton contract for the later lazy forum browser. Defining it in
 * the shared framework prevents that feature from inventing another visual
 * language in Phase 5. */
.cPONDashFocusState--loading {
  min-height: 116px;
}

.cPONDashFocusState--loading::after {
  content: '';
  display: block;
  flex: 1 1 auto;
  height: 12px;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--pondash-bg-soft), var(--pondash-bg-raised), var(--pondash-bg-soft));
  background-size: 200% 100%;
  animation: pondashShimmer 1.6s linear infinite;
}

/* Container-aware behaviour is based on the actual IPS content column rather
 * than the browser width. This protects Page Builder and side-column use. */
@container pondashboard (max-width: 920px) {
  .cPONDashFocus[data-layout-contract='pon-focus-v1'] .cPONDashNavGrid--focus {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .cPONDashFocus[data-layout-contract='pon-focus-v1'] .cPONDashFocus__grid,
  .cPONDashFocus[data-layout-contract='pon-focus-v1'] .cPONDashFocus__grid--wide,
  .cPONDashFocus[data-layout-contract='pon-focus-v1'] .cPONDashMatchday {
    grid-template-columns: minmax(0, 1fr);
  }

  .cPONDashFocus[data-layout-contract='pon-focus-v1'] .cPONDashFocusNativeGrid--members,
  .cPONDashFocus[data-layout-contract='pon-focus-v1'] .cPONDashFocusNativeGrid--community {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@container pondashboard (max-width: 680px) {
  .cPONDashFocus[data-layout-contract='pon-focus-v1'] .cPONDashFocus__header {
    align-items: flex-start;
    flex-direction: column;
    min-height: 0;
  }

  .cPONDashFocus__primaryAction {
    align-self: flex-start;
  }

  .cPONDashFocusToolbar {
    align-items: stretch;
    flex-direction: column;
  }

  .cPONDashFocusToolbar__label {
    border-inline-end: 0;
    border-block-end: 1px solid var(--pondash-border);
  }

  .cPONDashFocusToolbar__links {
    width: 100%;
  }

  .cPONDashFocus[data-layout-contract='pon-focus-v1'] .cPONDashFocusNativeGrid--members,
  .cPONDashFocus[data-layout-contract='pon-focus-v1'] .cPONDashFocusNativeGrid--community {
    grid-template-columns: minmax(0, 1fr);
  }

  .cPONDashFocus[data-layout-contract='pon-focus-v1'] .cPONDashFocusNativeGrid--members .cPONDashFocusNative--activeMembers,
  .cPONDashFocus[data-layout-contract='pon-focus-v1'] .cPONDashFocusNativeGrid--members .cPONDashFocusNative--achievements,
  .cPONDashFocus[data-layout-contract='pon-focus-v1'] .cPONDashFocusNativeGrid--members .cPONDashFocusNative--onlineToday {
    grid-column: auto;
  }
}

@container pondashboard (max-width: 520px) {
  .cPONDashFocus[data-layout-contract='pon-focus-v1'] {
    --pondash-focus-gap: 9px;
  }

  .cPONDashFocus[data-layout-contract='pon-focus-v1'] .cPONDashFocus__header {
    padding: 15px 16px;
  }

  .cPONDashFocus[data-layout-contract='pon-focus-v1'] .cPONDashNavGrid--focus {
    grid-template-columns: minmax(0, 1fr);
  }

  .cPONDashFocus[data-layout-contract='pon-focus-v1'] .cPONDashNavGrid--focus .cPONDashNavCard {
    min-height: 68px;
    grid-template-columns: 38px minmax(0, 1fr) auto;
    padding: 10px 12px;
  }

  .cPONDashFocus[data-layout-contract='pon-focus-v1'] .cPONDashNavGrid--focus .cPONDashNavCard__icon {
    width: 38px;
    height: 38px;
    font-size: 1.15rem;
  }

  .cPONDashFocus__primaryAction {
    width: 100%;
  }

  .cPONDashFocusToolbar__links a {
    min-width: max-content;
  }

  .cPONDashFocusState {
    align-items: flex-start;
    padding: 14px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .cPONDashFocusState--loading::after {
    animation: none;
  }
}

/* ==========================================================================
   PHASE 5 - FORUMS DISCUSSION BROWSER
   Native IPS topic rows inside a Dashboard-owned tab shell. Only the active
   source is present in the DOM; alternate views are fetched on demand.
   ========================================================================== */
.cPONDashForums {
  display: grid;
  gap: var(--pondash-focus-gap);
  min-width: 0;
}

.cPONDashForumBrowser {
  display: grid;
  min-width: 0;
  margin: 0;
  overflow: hidden;
  border: 1px solid var(--pondash-border);
  border-radius: var(--pondash-radius);
  background: var(--pondash-bg);
  box-shadow: 0 1px 2px rgba(0,0,0,.06);
}

.cPONDashForumBrowser__tabBar {
  display: flex;
  align-items: stretch;
  min-width: 0;
  border-block-end: 1px solid var(--pondash-border);
  background: color-mix(in srgb, var(--pondash-bg-soft) 54%, var(--pondash-bg) 46%);
}

.cPONDashForumBrowser__tools {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  flex: 0 0 auto;
  padding: 0 8px 0 12px;
  border-inline-start: 1px solid var(--pondash-border);
}

.cPONDashForumBrowser__status {
  color: var(--pondash-muted);
  font-size: .65rem;
  font-weight: 600;
  white-space: nowrap;
}

.cPONDashForumBrowser__refresh {
  display: inline-grid;
  place-items: center;
  width: 32px;
  height: 32px;
  margin: 0;
  padding: 0;
  border: 1px solid transparent;
  border-radius: 7px;
  background: transparent;
  color: var(--pondash-muted);
  cursor: pointer;
}

.cPONDashForumBrowser__refresh:hover {
  border-color: var(--pondash-border);
  background: var(--pondash-bg-soft);
  color: var(--pondash-text);
}

.cPONDashForumBrowser__refresh:focus-visible,
.cPONDashForumBrowser__tab:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--pondash-accent) 72%, transparent);
  outline-offset: -2px;
}

.cPONDashForumBrowser.is-loading .cPONDashForumBrowser__refresh i {
  animation: pondashForumSpin .8s linear infinite;
}

.cPONDashForumBrowser__tabScroller {
  flex: 1 1 auto;
  min-width: 0;
  overflow-x: auto;
  overflow-y: hidden;
  scrollbar-width: thin;
}

.cPONDashForumBrowser__tabs {
  display: flex;
  align-items: stretch;
  min-width: max-content;
  padding-inline: 8px;
}

.cPONDashForumBrowser__tab {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 45px;
  padding: 0 13px;
  border: 0;
  background: transparent;
  color: var(--pondash-muted);
  font: inherit;
  font-size: .72rem;
  font-weight: 680;
  line-height: 1;
  white-space: nowrap;
  cursor: pointer;
}

.cPONDashForumBrowser__tab::after {
  content: '';
  position: absolute;
  inset-inline: 13px;
  inset-block-end: 0;
  height: 2px;
  border-radius: 2px 2px 0 0;
  background: transparent;
}

.cPONDashForumBrowser__tab:hover {
  color: var(--pondash-text);
}

.cPONDashForumBrowser__tab.is-active,
.cPONDashForumBrowser__tab[aria-selected='true'] {
  color: var(--pondash-text);
}

.cPONDashForumBrowser__tab.is-active::after,
.cPONDashForumBrowser__tab[aria-selected='true']::after {
  background: var(--pondash-accent);
}

.cPONDashForumBrowser__mount {
  min-width: 0;
  min-height: 168px;
  margin: 0;
  background: var(--pondash-bg);
}

.cPONDashForumBrowser__panelInner {
  min-width: 0;
  margin: 0;
}

/* The browser shell replaces the source widget title with the tab bar. Source
 * rows, menus, badges, permissions and links remain the native widget output. */
.cPONDashForumBrowser__panelInner .cPONDashFocusNative--browserPrimary .ipsWidget__header {
  display: none;
}

.cPONDashForumBrowser__mount > .cPONDashForumBrowser__panelInner > .cPONDashFocusNative {
  border-radius: 0;
}

.cPONDashForumBrowser__mount .cPONDashFocusNative--browserPrimary > .cPONDashNativeWidget > :is(.ipsBox, .ipsWidget) {
  margin: 0;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

.cPONDashForumBrowser__mount .cPONDashFocusNative--browserPrimary > .cPONDashNativeWidget {
  border-radius: 0;
}

.cPONDashForumBrowser__empty {
  min-height: 168px;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

.cPONDashForumBrowser__loading {
  min-height: 168px;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

.cPONDashForumSupport {
  display: grid;
  grid-template-columns: minmax(0, 1.55fr) minmax(230px, .65fr);
  gap: var(--pondash-focus-gap);
  min-width: 0;
  align-items: start;
}

.cPONDashForumSupport > :only-child {
  grid-column: 1 / -1;
}

.cPONDashForumSupport__catchup,
.cPONDashForumSupport__statistics {
  min-width: 0;
}

@keyframes pondashForumSpin {
  to { transform: rotate(360deg); }
}

@container pondashboard (max-width: 760px) {
  .cPONDashForumSupport {
    grid-template-columns: minmax(0, 1fr);
  }

  .cPONDashForumSupport > :only-child {
    grid-column: auto;
  }
}

@container pondashboard (max-width: 520px) {
  .cPONDashForumBrowser__status {
    display: none;
  }

  .cPONDashForumBrowser__tools {
    padding-inline: 5px;
  }

  .cPONDashForumBrowser__tab {
    min-height: 42px;
    padding-inline: 11px;
    font-size: .69rem;
  }

  .cPONDashForumBrowser__tab::after {
    inset-inline: 11px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .cPONDashForumBrowser.is-loading .cPONDashForumBrowser__refresh i {
    animation: none;
  }
}

/* ==========================================================================
   PHASE 6 - FORUMS SUPPORTING CONTENT
   Catch Up / core Guest Sign Up remain source-owned widgets. Dashboard only
   controls their relationship to the compact core Forum Statistics block.
   ========================================================================== */
.cPONDashForumSupport {
  grid-template-columns: minmax(0, 1.48fr) minmax(230px, .52fr);
  align-items: stretch;
}

.cPONDashForumSupport--statsOnly {
  grid-template-columns: minmax(0, 1fr);
}

.cPONDashForumSupport__primary,
.cPONDashForumSupport__statistics,
.cPONDashForumSupport__primary > .cPONDashNativeWidget,
.cPONDashForumSupport__statistics > .cPONDashNativeWidget {
  min-width: 0;
  height: 100%;
}

/* The core stats widget is naturally a narrow sidebar widget. When it is the
 * only secondary source available, turn its own two-item list into a shallow
 * horizontal summary rather than stretching two stacked rows across the page. */
.cPONDashForumSupport--statsOnly .cPONDashForumSupport__statistics .ipsList--stats {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.cPONDashForumSupport--statsOnly .cPONDashForumSupport__statistics .ipsList--stats > li {
  min-width: 0;
}

/* Guest Sign Up is an official core widget and can contain both local account
 * and external-login buttons. Keep its native SubmitRow flexible at dashboard
 * widths instead of letting button groups force horizontal overflow. */
.cPONDashForumSupport__guest .ipsSubmitRow,
.cPONDashForumSupport__guest .ipsButtons {
  max-width: 100%;
}

.cPONDashForumSupport__guest .ipsButtons {
  flex-wrap: wrap;
}

/* Catch Up can legitimately contain several source-owned groups. Keep long
 * titles/metadata inside the available column without clipping native links. */
.cPONDashForumSupport__catchup :is(.ipsDataItem_main, .ipsData__main, h4, h5, p) {
  min-width: 0;
  overflow-wrap: anywhere;
}

@container pondashboard (max-width: 760px) {
  .cPONDashForumSupport {
    grid-template-columns: minmax(0, 1fr);
  }

  .cPONDashForumSupport .cPONDashForumSupport__statistics .ipsList--stats {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@container pondashboard (max-width: 420px) {
  .cPONDashForumSupport .cPONDashForumSupport__statistics .ipsList--stats {
    grid-template-columns: minmax(0, 1fr);
  }
}


/* ========================================================================== 
 * Build 10042 - Phase 7 Members destination
 *
 * The page is deliberately composed from the native/core member widgets already
 * selected by WidgetBridge. Dashboard only establishes hierarchy and responsive
 * relationships around them; it does not restyle member identities or duplicate
 * source application queries.
 * ======================================================================= */
.cPONDashMembers {
  display: grid;
  gap: var(--pondash-focus-gap);
  min-width: 0;
}

/* New Members is the richer discovery list. Birthdays and Active Members are
 * compact discovery signals, so they share a supporting stack instead of being
 * forced to the same height as a six-row member list. */
.cPONDashMembers__discovery {
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(270px, .72fr);
  gap: var(--pondash-focus-gap);
  align-items: start;
  min-width: 0;
}

.cPONDashMembers__discovery--stackOnly {
  grid-template-columns: minmax(0, 1fr);
}

.cPONDashMembers__discoveryStack {
  display: grid;
  gap: var(--pondash-focus-gap);
  align-content: start;
  min-width: 0;
}

.cPONDashMembers__leaderboards {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--pondash-focus-gap);
  align-items: start;
  min-width: 0;
}

.cPONDashMembers__leaderboards--single {
  grid-template-columns: minmax(0, 1fr);
}

/* Keep the native IPS widget header/content boundary visible. The very small
 * adjustments below only make repeated source widgets sit consistently inside
 * this dedicated members composition. */
.cPONDashMembers .cPONDashFocusNative > .cPONDashNativeWidget {
  overflow: hidden;
  border-radius: var(--pondash-radius);
}

.cPONDashMembers .cPONDashNativeWidget > .ipsWidget__header,
.cPONDashMembers .cPONDashNativeWidget > header.ipsWidget__header,
.cPONDashMembers .cPONDashNativeWidget > h3.ipsWidget__header {
  margin: 0;
}

.cPONDashMembers :is(.ipsData--members, .ipsData--achievements) .ipsData__item {
  min-width: 0;
}

.cPONDashMembers :is(.ipsData--members, .ipsData--achievements) .ipsData__content,
.cPONDashMembers :is(.ipsData--members, .ipsData--achievements) .ipsData__main {
  min-width: 0;
}

.cPONDashMembers :is(.ipsData--members, .ipsData--achievements) :is(h4, .ipsData__title) {
  overflow-wrap: anywhere;
}

/* Birthdays uses the core Members CSV mode intentionally. Let names wrap on
 * narrow cards rather than creating a horizontal scrollbar. */
.cPONDashMembers__birthdays .ipsList--csv {
  display: flex;
  flex-wrap: wrap;
  gap: 5px 12px;
  min-width: 0;
}

.cPONDashMembers__birthdays .ipsList--csv > li {
  min-width: 0;
  max-width: 100%;
  overflow-wrap: anywhere;
}

/* Active Members and Online Today are avatar-led presence widgets. Their own
 * applications still own avatar size, online rings, hovercards and counts. */
.cPONDashMembers__active .cActiveMembers,
.cPONDashMembers__onlineToday .ipsWidget__content {
  min-width: 0;
}

.cPONDashMembers__active .cActiveMembers__wrapper,
.cPONDashMembers__onlineToday .cOnlineTodayPlus_avatarList {
  max-width: 100%;
}

/* Leaderboards use the same core Members rows, but two columns must remain
 * visually comparable even when one group contains longer names or labels. */
.cPONDashMembers__leaderboards > .cPONDashFocusNative {
  min-width: 0;
  height: 100%;
}

.cPONDashMembers__leaderboards > .cPONDashFocusNative > .cPONDashNativeWidget {
  height: 100%;
}

/* Recent Achievements and Online Today are intentionally full-width closing
 * sections. This preserves useful breathing room and avoids another cramped
 * three-column row at the bottom of the destination. */
.cPONDashMembers__achievements,
.cPONDashMembers__onlineToday {
  width: 100%;
  min-width: 0;
}

@container pondashboard (max-width: 920px) {
  .cPONDashMembers__discovery {
    grid-template-columns: minmax(0, 1fr);
  }

  .cPONDashMembers__discoveryStack {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@container pondashboard (max-width: 720px) {
  .cPONDashMembers__leaderboards,
  .cPONDashMembers__discoveryStack {
    grid-template-columns: minmax(0, 1fr);
  }
}

@container pondashboard (max-width: 520px) {
  .cPONDashMembers__birthdays .ipsList--csv {
    gap: 4px 9px;
  }

  .cPONDashMembers :is(.ipsData--members, .ipsData--achievements) .ipsData__item {
    padding-inline: 10px;
  }
}


/* ========================================================================== 
 * Build 10043 - Phase 8 Matchday destination
 *
 * Matchday is a focused landing page, not a second fixture application. PON
 * Upgrades owns match, standings, fixture and result rendering; IPS Forums owns
 * the discussion feed. Dashboard only establishes hierarchy, width and safe
 * responsive behaviour around those source widgets.
 * ======================================================================= */
.cPONDashMatchday--destination {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--pondash-focus-gap);
  min-width: 0;
}

.cPONDashMatchday--destination > .cPONDashFocusNative,
.cPONDashMatchday__schedule > .cPONDashFocusNative {
  min-width: 0;
}

.cPONDashMatchday__hero .mvnponMatchCentre--featured {
  width: 100%;
}

.cPONDashMatchday__hero .mvnponMatchCentre--featured .mvnponMatchCentre__featuredBody {
  padding: .35rem;
}

@container pondashboard (min-width: 760px) {
  .cPONDashMatchday__hero .mvnponMatchCentre--featured .mvnponMatchRow {
    padding: 1.25rem 1.1rem 1.15rem;
  }

  .cPONDashMatchday__hero .mvnponMatchCentre--featured .mvnponMatchRow__badge {
    width: 78px;
    height: 78px;
    border-radius: 18px;
  }

  .cPONDashMatchday__hero .mvnponMatchCentre--featured .mvnponMatchRow__badge img {
    width: 62px !important;
    height: 62px !important;
    max-width: 62px !important;
    max-height: 62px !important;
  }

  .cPONDashMatchday__hero .mvnponMatchCentre--featured .mvnponMatchRow__team--home {
    grid-template-columns: minmax(0, 1fr) 78px;
  }

  .cPONDashMatchday__hero .mvnponMatchCentre--featured .mvnponMatchRow__team--away {
    grid-template-columns: 78px minmax(0, 1fr);
  }

  .cPONDashMatchday__hero .mvnponMatchCentre--featured .mvnponMatchRow__name {
    font-size: 1.08rem;
  }
}

/* The table gets the full content width instead of the old narrow right rail.
 * A bounded vertical scroll keeps a complete league useful without making the
 * focused page excessively tall; PON Upgrades' sticky header remains active. */
.cPONDashMatchday__standings .mvnponLeagueTable__scroll {
  max-height: 460px;
  overflow: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
}

.cPONDashMatchday__standings .mvnponLeagueTable__table {
  width: 100%;
}

.cPONDashMatchday__schedule {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--pondash-focus-gap);
  align-items: start;
  min-width: 0;
}

.cPONDashMatchday__schedule--single {
  grid-template-columns: minmax(0, 1fr);
}

.cPONDashMatchday__schedule .mvnponMatchCentre {
  height: 100%;
}

.cPONDashMatchday__schedule .mvnponMatchRow__name,
.cPONDashMatchday__discussions :is(.ipsData__title, .ipsData__content, .ipsData__main) {
  min-width: 0;
  overflow-wrap: anywhere;
}

.cPONDashMatchday__discussions > .cPONDashNativeWidget {
  min-width: 0;
}

@container pondashboard (max-width: 900px) {
  .cPONDashMatchday__schedule {
    grid-template-columns: minmax(0, 1fr);
  }

  .cPONDashMatchday__standings .mvnponLeagueTable__scroll {
    max-height: 420px;
  }
}

@container pondashboard (max-width: 520px) {
  .cPONDashMatchday__standings .mvnponLeagueTable__scroll {
    max-height: 380px;
  }

  .cPONDashMatchday__hero .mvnponMatchRow__topline,
  .cPONDashMatchday__hero .mvnponMatchRow__bottomline {
    gap-inline: .5rem;
  }
}

/* ========================================================================== 
 * Build 10044 - Phase 9 Community Info destination
 *
 * Community Info is intentionally compact. Calendar/Core continue to own event,
 * statistics, invite and club markup; Dashboard only arranges those widgets as
 * a useful information landing page and provides responsive containment.
 * ======================================================================= */
.cPONDashCommunity--destination {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--pondash-focus-gap);
  min-width: 0;
}

.cPONDashCommunity__overview {
  display: grid;
  grid-template-columns: minmax(0, 1.7fr) minmax(250px, .8fr);
  gap: var(--pondash-focus-gap);
  align-items: start;
  min-width: 0;
}

.cPONDashCommunity__side {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--pondash-focus-gap);
  min-width: 0;
}

.cPONDashCommunity__overview--withoutEvents {
  grid-template-columns: minmax(0, 1fr);
}

.cPONDashCommunity__overview--withoutEvents .cPONDashCommunity__side:not(.cPONDashCommunity__side--single) {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.cPONDashCommunity :where(.cPONDashFocusNative, .cPONDashNativeWidget) {
  min-width: 0;
  max-width: 100%;
}

/* The native Stats and Invite widgets are compact support blocks. Give them
 * equal visual containment when stacked without replacing their IPS styling. */
.cPONDashCommunity__side > .cPONDashFocusNative > .cPONDashNativeWidget {
  overflow: hidden;
  border-radius: var(--pondash-radius);
}

.cPONDashCommunity__statistics .ipsList--stats {
  min-width: 0;
}

.cPONDashCommunity__statistics .ipsPhotoPanel,
.cPONDashCommunity__statistics .ipsPhotoPanel__text {
  min-width: 0;
}

.cPONDashCommunity__statistics .ipsPhotoPanel__primary,
.cPONDashCommunity__statistics .ipsPhotoPanel__secondary {
  overflow-wrap: anywhere;
}

/* Core Invite uses an inline button list. Let it wrap within a narrow support
 * column rather than forcing the overall page wider. */
.cPONDashCommunity__invite .ipsButtons {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px;
}

.cPONDashCommunity__invite .ipsButtons > li {
  min-width: 0;
  margin: 0;
}

.cPONDashCommunity__invite .ipsButton {
  max-width: 100%;
  white-space: normal;
}

/* Clubs closes the page at full width. The source widget remains responsible
 * for club visibility and club-card output; these rules only prevent long club
 * names from causing overflow in a Dashboard/Page Builder column. */
.cPONDashCommunity__clubs :is(.ipsData__item, .ipsData__content, .ipsData__main) {
  min-width: 0;
}

.cPONDashCommunity__clubs :is(.ipsData__title, .ipsData__meta) {
  overflow-wrap: anywhere;
}

@container pondashboard (max-width: 900px) {
  .cPONDashCommunity__overview {
    grid-template-columns: minmax(0, 1fr);
  }

  .cPONDashCommunity__side:not(.cPONDashCommunity__side--single) {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@container pondashboard (max-width: 620px) {
  .cPONDashCommunity__side,
  .cPONDashCommunity__side:not(.cPONDashCommunity__side--single),
  .cPONDashCommunity__overview--withoutEvents .cPONDashCommunity__side:not(.cPONDashCommunity__side--single) {
    grid-template-columns: minmax(0, 1fr);
  }

  .cPONDashCommunity__invite .ipsButtons > li,
  .cPONDashCommunity__invite .ipsButton {
    width: 100%;
  }
}

/* ========================================================================== 
 * Build 10045 - Phase 10 Invision visual integration
 *
 * The focused destinations now consume Invision's own widget, background,
 * border, radius and shadow tokens wherever the suite exposes them. This keeps
 * PON's hierarchy and gold identity while allowing each installed theme to
 * decide how a native IPS surface should actually look in light and dark mode.
 * No source-widget content queries or source templates are replaced here.
 * ======================================================================= */
.cPONDashFocus[data-layout-contract='pon-focus-v1'] {
  --pondash-focus-surface: var(--i-widget--ba-co, var(--pondash-bg));
  --pondash-focus-border-color: var(--i-widget--bo-co, var(--pondash-border));
  --pondash-focus-border-width: var(--i-widget--bo-wi, 1px);
  --pondash-focus-border-style: var(--i-widget--bo-st, solid);
  --pondash-focus-radius: var(--i-widget--bo-ra, var(--i-box--bo-ra, var(--pondash-radius)));
  --pondash-focus-shadow: var(--i-widget--bo-sh, none);
  --pondash-focus-header-bg: var(--i-widget-header--ba-co, var(--pondash-bg-soft));
  --pondash-focus-header-color: var(--i-widget-header--co, var(--pondash-text));
  --pondash-focus-subtle: var(--i-background_2, var(--pondash-bg-soft));
  --pondash-focus-hover: var(--i-background_3, var(--pondash-bg-raised));
  --pondash-focus-strong: var(--i-color_hard, var(--pondash-text));
  --pondash-focus-medium: var(--i-color_root, var(--pondash-muted));
  --pondash-focus-soft-text: var(--i-color_soft, var(--pondash-soft));
  --pondash-focus-primary: var(--i-primary, var(--pondash-accent));
}

/* Page hero: use the same surface contract as an IPS widget. The thin PON
 * marker is deliberately the only bespoke brand treatment. */
.cPONDashFocus[data-layout-contract='pon-focus-v1'] .cPONDashFocus__header {
  border-width: var(--pondash-focus-border-width);
  border-style: var(--pondash-focus-border-style);
  border-color: var(--pondash-focus-border-color);
  border-radius: var(--pondash-focus-radius);
  background: var(--pondash-focus-surface);
  box-shadow: var(--pondash-focus-shadow);
}

.cPONDashFocus[data-layout-contract='pon-focus-v1'] .cPONDashFocus__header::before {
  width: 3px;
  background: var(--pondash-focus-primary);
}

.cPONDashFocus__eyebrow {
  color: var(--pondash-focus-soft-text);
  font-weight: 600;
  letter-spacing: .055em;
}

.cPONDashFocus__eyebrow i {
  color: var(--pondash-focus-primary);
}

.cPONDashFocus[data-layout-contract='pon-focus-v1'] .cPONDashFocus__header h1 {
  color: var(--pondash-focus-strong);
  font-weight: 650;
}

.cPONDashFocus[data-layout-contract='pon-focus-v1'] .cPONDashFocus__header p {
  color: var(--pondash-focus-medium);
}

/* Let the real ipsButton sizing win. Earlier phases forced the primary action
 * to a bespoke 42px control which made it look different from suite buttons. */
.cPONDashFocus__primaryAction {
  min-height: 0;
  border-radius: calc(var(--i-button--bo-ra, 5) * 1px);
}

/* Focus navigation mirrors a grouped IPS widget. Icons are intentionally
 * unboxed, matching current Invision navigation/card language. */
.cPONDashFocus[data-layout-contract='pon-focus-v1'] .cPONDashNavGrid--focus {
  gap: 1px;
  border-width: var(--pondash-focus-border-width);
  border-style: var(--pondash-focus-border-style);
  border-color: var(--pondash-focus-border-color);
  border-radius: var(--pondash-focus-radius);
  background: var(--pondash-focus-border-color);
  box-shadow: var(--pondash-focus-shadow);
}

.cPONDashFocus[data-layout-contract='pon-focus-v1'] .cPONDashNavGrid--focus .cPONDashNavCard {
  background: var(--pondash-focus-surface);
}

.cPONDashFocus[data-layout-contract='pon-focus-v1'] .cPONDashNavGrid--focus .cPONDashNavCard:hover,
.cPONDashFocus[data-layout-contract='pon-focus-v1'] .cPONDashNavGrid--focus .cPONDashNavCard:focus-visible {
  background: var(--pondash-focus-hover);
}

.cPONDashFocus[data-layout-contract='pon-focus-v1'] .cPONDashNavGrid--focus .cPONDashNavCard__icon {
  width: 40px;
  height: 40px;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: var(--pondash-focus-soft-text);
  font-size: 1.25rem;
}

.cPONDashFocus[data-layout-contract='pon-focus-v1'] .cPONDashNavGrid--focus .cPONDashNavCard--dashboard .cPONDashNavCard__icon {
  color: var(--pondash-focus-primary);
}

.cPONDashFocus[data-layout-contract='pon-focus-v1'] .cPONDashNavGrid--focus .cPONDashNavCard__body strong {
  color: var(--pondash-focus-strong);
  font-weight: 600;
}

.cPONDashFocus[data-layout-contract='pon-focus-v1'] .cPONDashNavGrid--focus .cPONDashNavCard__body span,
.cPONDashFocus[data-layout-contract='pon-focus-v1'] .cPONDashNavGrid--focus .cPONDashNavCard__arrow {
  color: var(--pondash-focus-medium);
}

/* Shortcut strip uses native widget tokens and the same neutral hover used by
 * IPS navigation, rather than a Dashboard-only background mix. */
.cPONDashFocusToolbar {
  border-width: var(--pondash-focus-border-width);
  border-style: var(--pondash-focus-border-style);
  border-color: var(--pondash-focus-border-color);
  border-radius: var(--pondash-focus-radius);
  background: var(--pondash-focus-surface);
  box-shadow: var(--pondash-focus-shadow);
}

.cPONDashFocusToolbar__label {
  border-inline-end-color: var(--pondash-focus-border-color);
  background: var(--pondash-focus-subtle);
  color: var(--pondash-focus-medium);
  font-weight: 600;
}

.cPONDashFocusToolbar__label i {
  color: var(--pondash-focus-primary);
}

.cPONDashFocusToolbar__links a {
  border-inline-end-color: var(--pondash-focus-border-color);
  color: var(--pondash-focus-strong) !important;
  font-weight: 600;
}

.cPONDashFocusToolbar__links a:hover,
.cPONDashFocusToolbar__links a:focus-visible {
  background: var(--pondash-focus-hover);
}

.cPONDashFocusToolbar__links a i {
  color: var(--pondash-focus-soft-text);
}

/* Use the suite's focus colour and offset conventions on Dashboard-owned
 * controls. Source widgets keep their own IPS focus rules. */
.cPONDashFocus :where(.cPONDashNavCard, .cPONDashFocusToolbar a, .cPONDashForumBrowser__tab, .cPONDashForumBrowser__refresh):focus-visible {
  outline: 2px solid var(--pondash-focus-primary);
  outline-offset: -2px;
}

/* Source-widget containment must never create a second fake card around the
 * real IPS widget. The source widget owns its radius, border and shadow. */
.cPONDashFocusNative,
.cPONDashFocusNative > .cPONDashNativeWidget {
  border-radius: var(--pondash-focus-radius);
}

.cPONDashFocusNative > .cPONDashNativeWidget > :is(.ipsWidget, .ipsBox) {
  max-width: 100%;
}

/* Some earlier destination-specific wrappers used overflow:hidden simply to
 * round corners. Native IPS widgets already round themselves and can contain
 * menus/hovercards, so do not clip their interactive UI. */
.cPONDashMembers .cPONDashFocusNative > .cPONDashNativeWidget,
.cPONDashCommunity__side > .cPONDashFocusNative > .cPONDashNativeWidget {
  overflow: visible;
}

/* Shared fail-soft state is styled exactly as another native widget surface. */
.cPONDashFocusState {
  border-width: var(--pondash-focus-border-width);
  border-style: var(--pondash-focus-border-style);
  border-color: var(--pondash-focus-border-color);
  border-radius: var(--pondash-focus-radius);
  background: var(--pondash-focus-surface);
  box-shadow: var(--pondash-focus-shadow);
  color: var(--pondash-focus-medium);
}

.cPONDashFocusState > i {
  border-radius: min(var(--i-design-radius, 6px), 6px);
  background: var(--pondash-focus-subtle);
  color: var(--pondash-focus-soft-text);
}

.cPONDashFocusState strong { color: var(--pondash-focus-strong); }
.cPONDashFocusState span { color: var(--pondash-focus-medium); }

/* Discussion Browser keeps the supplied reference's underline-tab treatment,
 * but its surfaces, hover state, typography and controls now come directly
 * from IPS theme tokens. */
.cPONDashForumBrowser {
  border-width: var(--pondash-focus-border-width);
  border-style: var(--pondash-focus-border-style);
  border-color: var(--pondash-focus-border-color);
  border-radius: var(--pondash-focus-radius);
  background: var(--pondash-focus-surface);
  box-shadow: var(--pondash-focus-shadow);
}

.cPONDashForumBrowser__tabBar {
  border-block-end-color: var(--pondash-focus-border-color);
  background: var(--pondash-focus-header-bg);
  color: var(--pondash-focus-header-color);
}

.cPONDashForumBrowser__tools {
  border-inline-start-color: var(--pondash-focus-border-color);
}

.cPONDashForumBrowser__status {
  color: var(--pondash-focus-soft-text);
  font-weight: 500;
}

.cPONDashForumBrowser__refresh {
  border-radius: min(var(--i-design-radius, 6px), 6px);
  color: var(--pondash-focus-soft-text);
}

.cPONDashForumBrowser__refresh:hover {
  border-color: color-mix(in srgb, var(--pondash-focus-soft-text) 20%, transparent);
  background: var(--pondash-focus-hover);
  color: var(--pondash-focus-strong);
}

.cPONDashForumBrowser__tabs {
  gap: 2px;
}

.cPONDashForumBrowser__tab {
  min-height: 46px;
  border-radius: min(var(--i-design-radius, 5px), 5px) min(var(--i-design-radius, 5px), 5px) 0 0;
  color: var(--pondash-focus-soft-text);
  font-size: .74rem;
  font-weight: 600;
}

.cPONDashForumBrowser__tab:hover {
  background: var(--pondash-focus-hover);
  color: var(--pondash-focus-strong);
}

.cPONDashForumBrowser__tab.is-active,
.cPONDashForumBrowser__tab[aria-selected='true'] {
  background: var(--pondash-focus-surface);
  color: var(--pondash-focus-strong);
}

.cPONDashForumBrowser__tab.is-active::after,
.cPONDashForumBrowser__tab[aria-selected='true']::after {
  background: var(--pondash-focus-primary);
}

.cPONDashForumBrowser__mount {
  background: var(--pondash-focus-surface);
}

/* Supporting columns should read as native widgets, not as equal-height custom
 * panels. Let each source decide its own minimum height and shadow. */
.cPONDashForumSupport,
.cPONDashMembers__discovery,
.cPONDashMembers__leaderboards,
.cPONDashMatchday__schedule,
.cPONDashCommunity__overview,
.cPONDashCommunity__side {
  align-items: start;
}

/* Third-party source widgets occasionally hard-code a border-radius on their
 * outermost container. Restrict reconciliation to the outer root only; member
 * avatars, badges, buttons and match crests are deliberately untouched. */
.cPONDashFocusNative > .cPONDashNativeWidget > :first-child {
  border-radius: var(--pondash-focus-radius);
}

/* At phone widths the native IPS layout is flatter and controls are easier to
 * scan when they occupy full rows. Keep that convention here as well. */
@container pondashboard (max-width: 520px) {
  .cPONDashFocus[data-layout-contract='pon-focus-v1'] .cPONDashFocus__header {
    padding: 15px 14px;
  }

  .cPONDashFocus__primaryAction {
    width: 100%;
  }

  .cPONDashFocusToolbar__label {
    background: var(--pondash-focus-subtle);
  }

  .cPONDashForumBrowser__tab {
    font-size: .72rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .cPONDashFocus[data-layout-contract='pon-focus-v1'] *,
  .cPONDashFocus[data-layout-contract='pon-focus-v1'] *::before,
  .cPONDashFocus[data-layout-contract='pon-focus-v1'] *::after {
    scroll-behavior: auto !important;
  }
}

/* ==========================================================================\n   Phase 11 / build 10046: responsive + runtime regression hardening\n   ========================================================================== */
.cPONDashForumBrowser__tabScroller,
.cPONDashFocusToolbar__links {
  overscroll-behavior-inline: contain;
  -webkit-overflow-scrolling: touch;
  scroll-padding-inline: 6px;
}

.cPONDashForumBrowser__tabScroller {
  scroll-snap-type: x proximity;
}

.cPONDashForumBrowser__tab {
  scroll-snap-align: start;
  touch-action: manipulation;
}

.cPONDashFocusToolbar__links a {
  touch-action: manipulation;
}

.cPONDashFocusNative .ipsTable_scroll {
  max-width: 100%;
  overflow-x: auto;
  overscroll-behavior-inline: contain;
  -webkit-overflow-scrolling: touch;
}

.cPONDashMatchday__hero :is(.mvnponMatchRow__team, .mvnponMatchRow__name) {
  min-width: 0;
}

.cPONDashMatchday__hero .mvnponMatchRow__name {
  overflow-wrap: anywhere;
}

.cPONDashMatchday__standings .mvnponLeagueTable__scroll {
  -webkit-overflow-scrolling: touch;
  touch-action: pan-x pan-y;
}

@container pondashboard (max-width: 680px) {
  .cPONDashFocusToolbar__label {
    border-block-end-color: var(--pondash-focus-border-color);
  }
}

@container pondashboard (max-width: 520px) {
  .cPONDashFocusNative :is(.ipsData__title, .ipsDataItem_title, .ipsWidget__header) {
    overflow-wrap: anywhere;
  }

  .cPONDashForumBrowser__tab,
  .cPONDashFocusToolbar__links a {
    min-height: 44px;
  }
}

/* ========================================================================== 
 * Build 10048 - post-release dashboard refinement
 *
 * Community Info no longer consumes generic Calendar/OTD entries; Matchday
 * gains a current-fixture companion strip and a de-duplicated future-fixture
 * list; Members gets one purpose-built split leaderboard widget.
 * ======================================================================= */

/* --- Matchday companion -------------------------------------------------- */
.cPONDashMatchday__companion,
.cPONDashMatchday__companion > .cPONDashNativeWidget {
  min-width: 0;
}

.cPONDashMatchCompanion > .cPONDashMatchCompanion,
.cPONDashMatchCompanion__header,
.cPONDashMatchCompanion__grid {
  min-width: 0;
}

.cPONDashMatchCompanion > .cPONDashMatchCompanion {
  border: var(--pondash-focus-border-width) var(--pondash-focus-border-style) var(--pondash-focus-border-color);
  border-radius: var(--pondash-focus-radius);
  background: var(--pondash-focus-surface);
  box-shadow: var(--pondash-focus-shadow);
  overflow: clip;
}

.cPONDashMatchCompanion__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 12px 14px;
  border-bottom: var(--pondash-focus-border-width) var(--pondash-focus-border-style) var(--pondash-focus-border-color);
  background: var(--pondash-focus-header-bg);
}

.cPONDashMatchCompanion__header h2,
.cPONDashCommunityLeaderboard__header h2,
.cPONDashCommunityGuide__header h2 {
  margin: 0;
  color: var(--pondash-focus-strong);
  font-size: .92rem;
  line-height: 1.25;
  font-weight: 700;
}

.cPONDashMatchCompanion__header div > span,
.cPONDashCommunityLeaderboard__header div > span,
.cPONDashCommunityGuide__header > span {
  display: block;
  margin-top: 2px;
  color: var(--pondash-focus-soft-text);
  font-size: .72rem;
}

.cPONDashMatchCompanion__header > small {
  max-width: 42%;
  color: var(--pondash-focus-medium);
  font-size: .72rem;
  text-align: right;
  overflow-wrap: anywhere;
}

.cPONDashMatchCompanion__grid {
  display: grid;
  grid-template-columns: minmax(0, .9fr) minmax(0, .9fr) minmax(280px, 1.4fr);
}

.cPONDashMatchCompanion__action,
.cPONDashMatchCompanion__coverage {
  min-width: 0;
  min-height: 112px;
  padding: 14px;
  border-right: var(--pondash-focus-border-width) var(--pondash-focus-border-style) var(--pondash-focus-border-color);
  color: var(--pondash-focus-strong);
  background: var(--pondash-focus-surface);
}

.cPONDashMatchCompanion__action {
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  text-decoration: none;
}

.cPONDashMatchCompanion__action:hover {
  background: var(--pondash-focus-hover);
  color: var(--pondash-focus-strong);
  text-decoration: none;
}

.cPONDashMatchCompanion__action--pending {
  color: var(--pondash-focus-medium);
}

.cPONDashMatchCompanion__action--live {
  box-shadow: inset 3px 0 0 var(--pondash-focus-primary);
}

.cPONDashMatchCompanion__actionIcon {
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  border-radius: var(--pondash-focus-radius);
  background: var(--pondash-focus-subtle);
  color: var(--pondash-focus-primary);
  font-size: 1rem;
}

.cPONDashMatchCompanion__action strong,
.cPONDashMatchCompanion__action small {
  display: block;
  min-width: 0;
  overflow-wrap: anywhere;
}

.cPONDashMatchCompanion__action strong {
  font-size: .82rem;
}

.cPONDashMatchCompanion__action small {
  margin-top: 3px;
  color: var(--pondash-focus-soft-text);
  font-size: .7rem;
  line-height: 1.35;
}

.cPONDashMatchCompanion__status {
  align-self: start;
  padding: 3px 7px;
  border-radius: 999px;
  background: var(--pondash-focus-subtle);
  color: var(--pondash-focus-soft-text);
  font-size: .62rem;
  font-weight: 700;
  white-space: nowrap;
}

.cPONDashMatchCompanion__action--live .cPONDashMatchCompanion__status {
  background: color-mix(in srgb, var(--pondash-focus-primary) 18%, var(--pondash-focus-surface));
  color: var(--pondash-focus-primary);
}

.cPONDashMatchCompanion__coverage {
  border-right: 0;
}

.cPONDashMatchCompanion__coverageHead,
.cPONDashMatchCompanion__coverageHead > span {
  display: flex;
  align-items: center;
  gap: 7px;
}

.cPONDashMatchCompanion__coverageHead {
  justify-content: space-between;
  margin-bottom: 8px;
  font-size: .75rem;
}

.cPONDashMatchCompanion__coverageHead > a {
  color: var(--pondash-focus-primary);
  font-size: .68rem;
  font-weight: 600;
  text-decoration: none;
}

.cPONDashMatchCompanion__articles {
  display: grid;
  gap: 2px;
}

.cPONDashMatchCompanion__articles a {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 10px;
  padding: 5px 0;
  border-top: 1px solid color-mix(in srgb, var(--pondash-focus-border-color) 65%, transparent);
  color: var(--pondash-focus-strong);
  font-size: .7rem;
  text-decoration: none;
}

.cPONDashMatchCompanion__articles a:first-child {
  border-top: 0;
}

.cPONDashMatchCompanion__articles strong {
  min-width: 0;
  font-weight: 600;
  overflow-wrap: anywhere;
}

.cPONDashMatchCompanion__articles small {
  flex: 0 0 auto;
  color: var(--pondash-focus-soft-text);
  font-size: .62rem;
}

.cPONDashMatchCompanion__empty {
  margin: 12px 0 0;
  color: var(--pondash-focus-soft-text);
  font-size: .7rem;
  line-height: 1.4;
}

/* The adapter deliberately keeps all five post-hero fixtures visible. */
.cPONDashMatchday__fixtures .mvnponMatchCentre__group[open] > summary {
  cursor: default;
}

/* --- Members: one split leaderboard widget ------------------------------ */
.cPONDashMembers__leaderboard,
.cPONDashMembers__leaderboard > .cPONDashNativeWidget {
  min-width: 0;
}

.cPONDashCommunityLeaderboard > .cPONDashCommunityLeaderboard,
.ponCommunityLeaderboardWidget .cPONDashCommunityLeaderboard {
  border: var(--pondash-focus-border-width) var(--pondash-focus-border-style) var(--pondash-focus-border-color);
  border-radius: var(--pondash-focus-radius);
  background: var(--pondash-focus-surface);
  box-shadow: var(--pondash-focus-shadow);
  overflow: clip;
}

.cPONDashCommunityLeaderboard__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 12px 14px;
  border-bottom: var(--pondash-focus-border-width) var(--pondash-focus-border-style) var(--pondash-focus-border-color);
  background: var(--pondash-focus-header-bg);
}

.cPONDashCommunityLeaderboard__header > a {
  color: var(--pondash-focus-primary);
  font-size: .7rem;
  font-weight: 600;
  text-decoration: none;
  white-space: nowrap;
}

.cPONDashCommunityLeaderboard__columns {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.cPONDashCommunityLeaderboard__section {
  min-width: 0;
}

.cPONDashCommunityLeaderboard__section + .cPONDashCommunityLeaderboard__section {
  border-left: var(--pondash-focus-border-width) var(--pondash-focus-border-style) var(--pondash-focus-border-color);
}

.cPONDashCommunityLeaderboard__sectionHead {
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 10px 12px;
  border-bottom: var(--pondash-focus-border-width) var(--pondash-focus-border-style) var(--pondash-focus-border-color);
  background: var(--pondash-focus-subtle);
}

.cPONDashCommunityLeaderboard__sectionIcon {
  display: grid;
  place-items: center;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: var(--pondash-focus-surface);
  color: var(--pondash-focus-primary);
}

.cPONDashCommunityLeaderboard__sectionHead h3 {
  margin: 0;
  color: var(--pondash-focus-strong);
  font-size: .78rem;
}

.cPONDashCommunityLeaderboard__sectionHead div > span {
  color: var(--pondash-focus-soft-text);
  font-size: .64rem;
}

.cPONDashCommunityLeaderboard__list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.cPONDashCommunityLeaderboard__list li {
  display: grid;
  grid-template-columns: 24px 34px minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
  min-width: 0;
  padding: 9px 12px;
  border-top: 1px solid color-mix(in srgb, var(--pondash-focus-border-color) 70%, transparent);
}

.cPONDashCommunityLeaderboard__list li:first-child {
  border-top: 0;
}

.cPONDashCommunityLeaderboard__position {
  display: grid;
  place-items: center;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: var(--pondash-focus-subtle);
  color: var(--pondash-focus-medium);
  font-size: .66rem;
  font-weight: 700;
}

.cPONDashCommunityLeaderboard__list li:nth-child(-n+3) .cPONDashCommunityLeaderboard__position {
  color: var(--pondash-focus-primary);
}

.cPONDashCommunityLeaderboard__photo,
.cPONDashCommunityLeaderboard__photo .ipsUserPhoto {
  width: 34px;
  height: 34px;
}

.cPONDashCommunityLeaderboard__member,
.cPONDashCommunityLeaderboard__member a,
.cPONDashCommunityLeaderboard__member small,
.cPONDashCommunityLeaderboard__score {
  min-width: 0;
}

.cPONDashCommunityLeaderboard__member a {
  display: block;
  color: var(--pondash-focus-strong);
  font-size: .73rem;
  font-weight: 600;
  text-decoration: none;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.cPONDashCommunityLeaderboard__member small,
.cPONDashCommunityLeaderboard__score small {
  display: block;
  margin-top: 1px;
  color: var(--pondash-focus-soft-text);
  font-size: .59rem;
}

.cPONDashCommunityLeaderboard__score {
  text-align: right;
}

.cPONDashCommunityLeaderboard__score strong {
  color: var(--pondash-focus-strong);
  font-size: .76rem;
}

.cPONDashCommunityLeaderboard__empty {
  padding: 18px 14px;
  color: var(--pondash-focus-soft-text);
  font-size: .7rem;
  text-align: center;
}

/* --- Community Info: replace generic Upcoming Events/OTD with essentials - */
.cPONDashCommunityGuide {
  min-width: 0;
  border: var(--pondash-focus-border-width) var(--pondash-focus-border-style) var(--pondash-focus-border-color);
  border-radius: var(--pondash-focus-radius);
  background: var(--pondash-focus-surface);
  box-shadow: var(--pondash-focus-shadow);
  overflow: clip;
}

.cPONDashCommunityGuide__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 14px;
  border-bottom: var(--pondash-focus-border-width) var(--pondash-focus-border-style) var(--pondash-focus-border-color);
  background: var(--pondash-focus-header-bg);
}

.cPONDashCommunityGuide__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.cPONDashCommunityGuide__item {
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  min-width: 0;
  min-height: 76px;
  padding: 11px 12px;
  border-top: 1px solid color-mix(in srgb, var(--pondash-focus-border-color) 70%, transparent);
  color: var(--pondash-focus-strong);
  text-decoration: none;
}

.cPONDashCommunityGuide__item:nth-child(-n+2) {
  border-top: 0;
}

.cPONDashCommunityGuide__item:nth-child(even) {
  border-left: 1px solid color-mix(in srgb, var(--pondash-focus-border-color) 70%, transparent);
}

.cPONDashCommunityGuide__item:hover {
  background: var(--pondash-focus-hover);
  color: var(--pondash-focus-strong);
  text-decoration: none;
}

.cPONDashCommunityGuide__icon {
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  border-radius: var(--pondash-focus-radius);
  background: var(--pondash-focus-subtle);
  color: var(--pondash-focus-primary);
}

.cPONDashCommunityGuide__copy strong,
.cPONDashCommunityGuide__copy small {
  display: block;
  min-width: 0;
  overflow-wrap: anywhere;
}

.cPONDashCommunityGuide__copy strong {
  font-size: .75rem;
}

.cPONDashCommunityGuide__copy small {
  margin-top: 3px;
  color: var(--pondash-focus-soft-text);
  font-size: .64rem;
  line-height: 1.35;
}

.cPONDashCommunityGuide__arrow {
  color: var(--pondash-focus-soft-text);
  font-size: .62rem;
}

@container pondashboard (max-width: 900px) {
  .cPONDashMatchCompanion__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .cPONDashMatchCompanion__coverage {
    grid-column: 1 / -1;
    border-top: var(--pondash-focus-border-width) var(--pondash-focus-border-style) var(--pondash-focus-border-color);
  }

  .cPONDashMatchCompanion__action:nth-child(2) {
    border-right: 0;
  }
}

@container pondashboard (max-width: 720px) {
  .cPONDashCommunityLeaderboard__columns {
    grid-template-columns: minmax(0, 1fr);
  }

  .cPONDashCommunityLeaderboard__section + .cPONDashCommunityLeaderboard__section {
    border-left: 0;
    border-top: var(--pondash-focus-border-width) var(--pondash-focus-border-style) var(--pondash-focus-border-color);
  }
}

@container pondashboard (max-width: 620px) {
  .cPONDashCommunityGuide__grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .cPONDashCommunityGuide__item,
  .cPONDashCommunityGuide__item:nth-child(-n+2),
  .cPONDashCommunityGuide__item:nth-child(even) {
    border-left: 0;
    border-top: 1px solid color-mix(in srgb, var(--pondash-focus-border-color) 70%, transparent);
  }

  .cPONDashCommunityGuide__item:first-child {
    border-top: 0;
  }
}

@container pondashboard (max-width: 560px) {
  .cPONDashMatchCompanion__header,
  .cPONDashCommunityLeaderboard__header,
  .cPONDashCommunityGuide__header {
    align-items: flex-start;
    flex-direction: column;
  }

  .cPONDashMatchCompanion__header > small {
    max-width: 100%;
    text-align: left;
  }

  .cPONDashMatchCompanion__grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .cPONDashMatchCompanion__action,
  .cPONDashMatchCompanion__action:nth-child(2),
  .cPONDashMatchCompanion__coverage {
    border-right: 0;
    border-top: var(--pondash-focus-border-width) var(--pondash-focus-border-style) var(--pondash-focus-border-color);
  }

  .cPONDashMatchCompanion__action:first-child {
    border-top: 0;
  }

  .cPONDashCommunityLeaderboard__list li {
    grid-template-columns: 22px 32px minmax(0, 1fr) auto;
    gap: 6px;
    padding-inline: 9px;
  }
}

/* Standalone Page Builder instances of the new leaderboard do not sit inside
 * .cPONDashFocus, so give that widget the same IPS-token defaults locally. */
.ponCommunityLeaderboardWidget {
  --pondash-focus-surface: var(--i-widget--ba-co, var(--i-background_1, transparent));
  --pondash-focus-border-color: var(--i-widget--bo-co, var(--i-color_soft, currentColor));
  --pondash-focus-border-width: var(--i-widget--bo-wi, 1px);
  --pondash-focus-border-style: var(--i-widget--bo-st, solid);
  --pondash-focus-radius: var(--i-widget--bo-ra, var(--i-design-radius, 5px));
  --pondash-focus-shadow: var(--i-widget--bo-sh, none);
  --pondash-focus-header-bg: var(--i-widget-header--ba-co, var(--i-background_2, transparent));
  --pondash-focus-strong: var(--i-color_hard, currentColor);
  --pondash-focus-medium: var(--i-color_root, currentColor);
  --pondash-focus-soft-text: var(--i-color_soft, currentColor);
  --pondash-focus-subtle: var(--i-background_2, transparent);
  --pondash-focus-hover: var(--i-background_3, transparent);
  --pondash-focus-primary: var(--i-primary, currentColor);
}

/* Build 10049 - Forums browser policy refinement phase 1. */


/* Build 10050 - Forums browser refinement phase 2.
 * Seven-tab presentation integration. Wide layouts distribute all tabs evenly;
 * constrained layouts switch to a touch-friendly horizontal scroller. The
 * Featured/Spotlight adapter now emits the stock IPS Forums topicFeed template,
 * so every browser panel shares the same native row grammar. */
.cPONDashForumBrowser__tabScroller {
  overscroll-behavior-inline: contain;
}

.cPONDashForumBrowser__tabs {
  width: 100%;
  min-width: 0;
  padding-inline: 6px;
}

.cPONDashForumBrowser__tab {
  flex: 1 1 0;
  min-width: 0;
  padding-inline: 9px;
}

.cPONDashForumBrowser__tab > span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}

.cPONDashForumBrowser__tab::after {
  inset-inline: 9px;
}

.cPONDashForumBrowser__tools {
  gap: 7px;
  min-width: max-content;
}

.cPONDashForumBrowser__context,
.cPONDashForumBrowser__status {
  font-size: .64rem;
  font-weight: 600;
  white-space: nowrap;
}

.cPONDashForumBrowser__context {
  color: var(--pondash-focus-medium, var(--pondash-muted));
}

.cPONDashForumBrowser__status {
  position: relative;
  padding-inline-start: 9px;
  color: var(--pondash-focus-soft-text, var(--pondash-muted));
}

.cPONDashForumBrowser__status::before {
  content: '';
  position: absolute;
  inset-inline-start: 1px;
  inset-block-start: 50%;
  width: 3px;
  height: 3px;
  border-radius: 50%;
  background: currentColor;
  transform: translateY(-50%);
  opacity: .65;
}

/* All seven panels intentionally use IPS' table Topic Feed shape. These rules
 * are width-safety only: they do not replace native IPS data styling. */
.cPONDashForumBrowser__mount .ipsData--topic-feed-widget,
.cPONDashForumBrowser__mount .ipsData--topic-feed-widget .ipsData__item,
.cPONDashForumBrowser__mount .ipsData--topic-feed-widget .ipsData__content,
.cPONDashForumBrowser__mount .ipsData--topic-feed-widget .ipsData__main {
  min-width: 0;
}

.cPONDashForumBrowser__mount .ipsData--topic-feed-widget .ipsData__title h4,
.cPONDashForumBrowser__mount .ipsData--topic-feed-widget .ipsData__title h4 > a,
.cPONDashForumBrowser__mount .ipsData--topic-feed-widget .ipsData__category {
  min-width: 0;
  overflow-wrap: anywhere;
}

/* Defensive fallback only. If a future IPS template-signature change causes
 * the Featured adapter to fall back to ldwidget output, remove ldwidget's
 * excerpt so that tab switching still does not produce a visibly taller feed. */
.cPONDashForumBrowser__panelInner .ldWidget .ipsData__desc {
  display: none;
}

@container pondashboard (max-width: 980px) {
  .cPONDashForumBrowser__tabScroller {
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: thin;
    scroll-snap-type: inline proximity;
    -webkit-overflow-scrolling: touch;
  }

  .cPONDashForumBrowser__tabs {
    width: max-content;
    min-width: max-content;
  }

  .cPONDashForumBrowser__tab {
    flex: 0 0 auto;
    min-width: 108px;
    scroll-snap-align: start;
  }
}

@container pondashboard (max-width: 700px) {
  .cPONDashForumBrowser__context,
  .cPONDashForumBrowser__status {
    display: none;
  }

  .cPONDashForumBrowser__tools {
    padding-inline: 5px;
  }

  .cPONDashForumBrowser__refresh {
    width: 42px;
    height: 42px;
  }
}

@container pondashboard (max-width: 520px) {
  .cPONDashForumBrowser__tab {
    min-width: 104px;
    min-height: 44px;
    padding-inline: 10px;
    font-size: .69rem;
  }

  .cPONDashForumBrowser__tab::after {
    inset-inline: 10px;
  }
}

/* Build 10052 - Forums refinement final release. Phase 4 is regression/packaging only;
 * seven-tab layout and IPS-native presentation remain intentionally unchanged. */

/* Build 10053 - Centre the bundled guest welcome header (copy + actions) in the
 * stacked mobile layout so the buttons no longer hang left with dead space. The
 * visual (cover + avatar) is already centred; stretch the copy to the full bar
 * width and lay the guest buttons out as an equal two-column (2x2) grid. */
@container pdwh-guest (max-width: 760px) {
  .pdwh_guestContent { align-items: stretch; }
  .pdwh_guestCopy { text-align: center; }
  .pdwh_guestActions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    width: 100%;
  }
  .pdwh_guestActions .ipsButton {
    width: 100%;
    justify-content: center;
  }
}