/* Pinvorix V0.23.15 approved photographic identity layer. All Pinvorix-controlled
 * sports photography must come from /assets/images/library/.?v=2026.09.42 The existing homepage
 * hero is intentionally protected separately in /assets/images/v0212/.?v=2026.09.42 */
:root {
  --sport-scene: url("/assets/images/library/coach-staff-sideline.webp?v=2026.09.42");
  --sport-scene-alt: var(--sport-scene);
  --sport-focus: 50% 50%;
}

/* V0.24.22 role-specific hero photography. The visual construction remains shared;
 * only the approved photograph and focal point vary by portal. */
.universal-dashboard-page { --dashboard-hero-focus: 50% 25%; }
.operations-page {
  --portal-hero-scene: url("/assets/images/library/operations-coaches-laptop.webp?v=2026.09.42");
  --portal-hero-focus: 70% 22%;
}
.family-page {
  --portal-hero-scene: url("/assets/images/library/family-player-sideline.webp?v=2026.09.42");
  --portal-hero-focus: 70% 25%;
}
.player-page {
  --portal-hero-scene: url("/assets/images/library/player-bleachers-phone.webp?v=2026.09.42");
  --portal-hero-focus: 70% 22%;
}
html[data-sport="basketball"] { --sport-scene:url("/assets/images/library/basketball-team-huddle.webp?v=2026.09.42"); --sport-focus:52% 45%; }
html[data-sport="volleyball"] { --sport-scene:url("/assets/images/library/volleyball-team-huddle.webp?v=2026.09.42"); --sport-focus:50% 48%; }
html[data-sport="soccer"] { --sport-scene:url("/assets/images/library/soccer-team-huddle.webp?v=2026.09.42"); --sport-focus:50% 48%; }
html[data-sport="baseball"] { --sport-scene:url("/assets/images/library/baseball-coaches-player.webp?v=2026.09.42"); --sport-focus:50% 42%; }
html[data-sport="softball"] { --sport-scene:url("/assets/images/library/softball-player-bleachers.webp?v=2026.09.42"); --sport-focus:52% 45%; }
html[data-sport="swimming"],html[data-sport="swim"] { --sport-scene:url("/assets/images/library/swim-coach-athlete-deck.webp?v=2026.09.42"); --sport-focus:50% 46%; }
html[data-sport="track"],html[data-sport="track-and-field"] { --sport-scene:url("/assets/images/library/track-team-huddle.webp?v=2026.09.42"); --sport-focus:50% 45%; }
html[data-sport="football"],html[data-sport="hockey"],html[data-sport="lacrosse"],html[data-sport="tennis"],html[data-sport="cheer"],html[data-sport="wrestling"] { --sport-scene:url("/assets/images/library/coach-staff-sideline.webp?v=2026.09.42"); --sport-focus:50% 46%; }

.dashboard-page.application-page,
.family-page.application-page,
.player-page.application-page,
.event-page.application-page {
  background-color:#0b213b;
  background-image:linear-gradient(112deg,rgba(3,9,18,.88),rgba(4,14,27,.67)),var(--sport-scene-alt);
  background-position:center,center 45%;background-size:cover;background-repeat:no-repeat;
}
.command-hero,.family-command-hero,.player-command-hero {position:relative;isolation:isolate;overflow:hidden;border-radius:24px;padding:28px;border:1px solid rgba(255,255,255,.15);color:#fff;box-shadow:0 20px 54px rgba(4,12,24,.18)}
.command-hero::before,.family-command-hero::before,.player-command-hero::before {content:"";position:absolute;inset:0;z-index:-2;background:var(--sport-scene-alt) center 45%/cover no-repeat;background-color:#0b2748;filter:saturate(.92) contrast(1.03)}
.command-hero::after,.family-command-hero::after,.player-command-hero::after {content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(4,13,25,.93) 0%,rgba(5,17,31,.79) 48%,rgba(7,20,37,.48) 100%)}
.command-hero h1,.command-hero .muted,.family-command-hero h1,.family-command-hero .muted,.player-command-hero h1,.player-command-hero .muted {color:#fff}
.sport-context-pill {display:inline-flex;align-items:center;gap:8px;margin-top:10px;padding:6px 10px;border-radius:999px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.18);color:#f5f7fb;font-size:.82rem;font-weight:700;backdrop-filter:blur(12px)}

.marketing-page .showcase-section {background-image:linear-gradient(90deg,rgba(244,242,236,.95),rgba(238,241,245,.88)),url("/assets/images/library/volleyball-team-huddle.webp?v=2026.09.42")}
.marketing-page .platform-section {position:relative;isolation:isolate;overflow:hidden}
.marketing-page .platform-section::before {content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(5,17,33,.94),rgba(5,17,33,.78)),url("/assets/images/library/operations-team-office.webp?v=2026.09.42") center 44%/cover no-repeat}
.marketing-page .roles-section {position:relative;isolation:isolate;overflow:hidden}
.marketing-page .roles-section::before {content:"";position:absolute;inset:0;z-index:-2;background:url("/assets/images/library/family-player-sideline.webp?v=2026.09.42") center 46%/cover no-repeat;opacity:.10}

.team-sport-card {position:relative;overflow:hidden}
.team-sport-card::after {content:"";position:absolute;right:-28px;top:-28px;width:110px;height:110px;border-radius:50%;background:radial-gradient(circle,rgba(231,169,37,.12),transparent 70%);pointer-events:none}
.calendar-link-row {display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}

@media (max-width:680px){
  .command-hero,.family-command-hero,.player-command-hero{border-radius:18px;padding:20px 18px;min-height:190px;align-items:end}
  .command-grid,.command-grid--lower{grid-template-columns:1fr!important}
  .family-action{align-items:flex-start;gap:14px}
  .availability-actions{display:grid;grid-template-columns:1fr 1fr;width:100%}
  .availability-actions .button{min-height:46px}
  .event-row{align-items:flex-start;gap:12px}.response-summary{justify-content:flex-start}
  .application-page .app-main{padding-inline:14px}
}
.family-intro.family-command-hero{display:flex;justify-content:space-between;align-items:flex-start;gap:20px;margin-bottom:18px}
.family-intro.family-command-hero .truth-state{background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.22);color:#fff}
@media(max-width:680px){.family-intro.family-command-hero{display:block}.family-intro.family-command-hero .truth-state{display:inline-flex;margin-top:14px}.family-page .family-up-next{border-radius:18px}.family-page .button{min-height:44px}}

/* V0.24.19 portal section-transition continuity: keep the photographic hero scene on its own compositor layer so in-page section swaps do not visibly drop the image while the content outlet repaints. */
.family-page .family-command-hero::before,
.player-page .player-command-hero::before {
  will-change: transform;
  transform: translateZ(0);
  backface-visibility: hidden;
}