/* Shared by the framework pages, managed demo and private access screen.
   Keep action colors separate from branding, team colors and result semantics. */
:root{
 --elo-canvas-marketing:#f8faf7;
 --elo-canvas-reading:#ffffff;
 --elo-canvas-data:#f5f7fa;
 --elo-surface:#ffffff;
 --elo-surface-border:#dce5df;
 --elo-preview-halo:radial-gradient(ellipse at 24% 32%,#bdd5bb55 0,transparent 68%),radial-gradient(ellipse at 80% 72%,#e5d6ad44 0,transparent 68%);
 --elo-page-title-gap:20px;
 --elo-section-title-gap:14px;
 --elo-answer-title-gap:10px;
 --app-canvas:var(--elo-canvas-data);
 --league-surface:var(--elo-surface);
 --league-border:var(--elo-surface-border);
 --elo-link-ink:#263d50;
 --elo-link-underline:#9aa8b3;
 --elo-nav-muted:#526573;
 --elo-action-bg:#dce9d6;
 --elo-action-hover:#d2e2cd;
 --elo-action-active:#c7d9c1;
 --elo-action-ink:#253b38;
 --elo-action-border:#c8d9c6;
 --elo-focus:#276448;
 --elo-highlight-bg:#edf5e8;
 --elo-highlight-ink:#294c39;
 --elo-highlight-muted:#53665e;
 --elo-highlight-border:#d1ddd3;
 --brand-sage:var(--elo-action-bg);
 --brand-sage-border:var(--elo-action-border);
}
/* Default component buttons use the action palette, while text-primary links
   can continue using the dark branding color. */
[data-slot="button"][data-variant="default"]{
 background:var(--elo-action-bg);color:var(--elo-action-ink);border:1px solid var(--elo-action-border);
}
[data-slot="button"][data-variant="default"]:hover{background:var(--elo-action-hover)}
[data-slot="button"][data-variant="default"]:active{background:var(--elo-action-active)}
:is(.button,.elo-primary,[data-slot="button"],.continue):focus-visible{outline:2px solid var(--elo-focus);outline-offset:3px}
.demo-return{background:var(--elo-highlight-bg);color:var(--elo-highlight-ink);border-bottom:1px solid var(--elo-highlight-border)}
.demo-return a{color:var(--elo-highlight-ink)}

/* Managed/demo controls use the same selected-state language. */
:is(.fixturequickfilters button[aria-pressed="true"],.plannerweekfilters button[aria-pressed="true"],.wirequicknav button[aria-current="location"]){
 background:var(--elo-action-bg)!important;color:var(--elo-action-ink)!important;border-color:var(--elo-action-border)!important;
}

/* The working league admin uses the same light actions and selection states. */
.leagueconsole .adminshortcuts button[aria-current="page"],
.leagueconsole button[type="submit"]:not(.danger),
.leagueconsole #addNewScore,
.leagueconsole #availabilitySave,
.leagueconsole #plannerSave{
 background:var(--elo-action-bg)!important;color:var(--elo-action-ink)!important;border-color:var(--elo-action-border)!important;
}
.leagueconsole .adminshortcuts button:hover{background:var(--elo-action-hover)!important;color:var(--elo-action-ink)!important}
.leagueconsole button:focus-visible{outline:2px solid var(--elo-focus);outline-offset:3px}

/* Navigation acknowledgment is independent of data preparation. */
a[data-navigation-pending="true"]{color:var(--elo-focus)!important;cursor:progress}
a[data-navigation-pending="true"]:not(.button,.header-example,.brand,.player-avatar-profile-link,.finder-shortcut,.directory-simple-club,.catalog-suggestion,.app-primary,.app-secondary,.app-icon-button,.continue,[data-slot="button"]){text-decoration:underline;text-decoration-thickness:2px!important;text-underline-offset:3px;text-decoration-color:var(--elo-focus)!important}
a[data-navigation-pending="true"]:not(:focus-visible){outline:none!important}
:is(a,button,[role="tab"]):focus-visible{outline:2px solid var(--elo-focus);outline-offset:3px}
:is(.button,.elo-primary,.header-example,.app-primary,.app-secondary,.app-icon-button,[data-slot="button"]):not(.danger,.app-danger,[data-variant="destructive"]):active{background:var(--elo-action-active)!important;transform:none!important}
a:is(.button,.header-example,.app-primary,.app-secondary,.app-icon-button,[data-slot="button"])[data-navigation-pending="true"]:not(.danger,.app-danger,[data-variant="destructive"]),button[aria-busy="true"]:not(.danger,.app-danger,[data-variant="destructive"]),form[aria-busy="true"] button[type="submit"]:not(.danger,.app-danger,[data-variant="destructive"]){background:var(--elo-action-active)!important;border-color:var(--elo-action-border)!important;color:var(--elo-action-ink)!important;text-decoration:none!important;cursor:progress;transform:none!important}
a:is(.finder-shortcut,.directory-simple-club,.catalog-suggestion,.home-audience-path)[data-navigation-pending="true"]{background:var(--elo-highlight-bg);box-shadow:inset 0 0 0 1px var(--elo-highlight-border);text-decoration:none}
a:is(.brand,.player-avatar-profile-link)[data-navigation-pending="true"]{filter:brightness(.94);text-decoration:none}
.elocup-navigation-progress{position:fixed;inset:0 0 auto;height:2px;z-index:10000;overflow:hidden;pointer-events:none;background:var(--elo-action-bg)}
.elocup-navigation-progress>span[aria-hidden="true"]{display:block;width:35%;height:100%;background:var(--elo-focus);animation:elocup-navigation-travel 1.1s ease-in-out infinite}
.elocup-navigation-status{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
@keyframes elocup-navigation-travel{from{transform:translateX(-100%)}to{transform:translateX(390%)}}
@keyframes elocup-navigation-wait{0%,100%{opacity:1}50%{opacity:.45}}
.elocup-navigation-notice{position:fixed;bottom:100px;left:50%;transform:translateX(-50%);z-index:10001;background:#fff;color:var(--elo-action-ink);border:1px solid var(--elo-action-border);border-radius:12px;padding:14px 18px;box-shadow:0 4px 24px #253b3826;width:max-content;max-width:calc(100vw - 32px);font-size:14px}
.elocup-navigation-notice a{color:var(--elo-focus);text-decoration:underline}
.player-avatar .player-avatar-profile-link{display:flex;width:100%;height:100%;border-radius:50%;text-decoration:none}
.player-avatar .player-avatar-profile-link:hover{filter:brightness(.97)}
.profile-personalization .profile-action-help{display:block;font-size:12px;color:#526573;margin-top:4px}
.profile-loading-shell{max-width:1120px;margin:24px auto;padding:24px}.profile-loading-shell .app-skeleton{height:120px;margin-top:18px}.profile-loading-shell .app-skeleton:first-child{height:68px}
@media(prefers-reduced-motion:reduce){.elocup-navigation-progress>span[aria-hidden="true"]{animation:none;width:100%;opacity:.7}.profile-loading-shell .app-skeleton{animation:none}}

.wait-picker-backdrop{z-index:3000!important}
.profile-personalization>a:first-of-type{display:inline-flex;align-items:center;padding:6px 10px;border-radius:8px;background:var(--elo-action-bg);border:1px solid var(--elo-action-border);color:var(--elo-action-ink);font-weight:600;text-decoration:none}.profile-personalization>a:first-of-type:hover{background:var(--elo-action-hover)}


a[data-player-profile][data-navigation-pending="true"],.playerlink[data-navigation-pending="true"]{box-shadow:none}
a[href]:active{filter:brightness(.94)}

/* Full-width canvases follow the page purpose, including mounted navigation. */
.site-frame[data-surface="marketing"]{--elo-page-canvas:var(--elo-canvas-marketing)}
.site-frame[data-surface="reading"]{--elo-page-canvas:var(--elo-canvas-reading)}
.site-frame[data-surface="data"]{--elo-page-canvas:var(--elo-canvas-data)}
.site-frame[data-surface],.site-frame[data-surface]>#main-content{background:var(--elo-page-canvas)}
html:has(.site-frame[data-surface="marketing"]),body:has(.site-frame[data-surface="marketing"]){background:var(--elo-canvas-marketing)!important}
html:has(.site-frame[data-surface="reading"]),body:has(.site-frame[data-surface="reading"]){background:var(--elo-canvas-reading)!important}
html:has(.site-frame[data-surface="data"]),body:has(.site-frame[data-surface="data"]),body:has(.cup-header-frame),html.elocup-app-ui body:has(.cup-header-frame){background:var(--elo-canvas-data)!important}
.site-frame[data-surface="marketing"] .marketing-home{background:transparent}
/* Dashboard cards share a white surface; team colors and result colors stay local. */
.site-frame[data-surface="data"]{--app-canvas:var(--elo-canvas-data);--league-surface:var(--elo-surface);--league-border:var(--elo-surface-border)}
html.elocup-app-ui .site-frame[data-surface="data"]>#main-content{background:var(--elo-canvas-data)}
/* Apply reading rhythm to prose, never to the nested dashboard previews. */
.site-frame[data-surface] :is(.editorial-page>h1,.prosepage>h1,.contact-intro>h1,.story-hero-copy>h1,.home-hero-copy>h1){margin-bottom:var(--elo-page-title-gap)}
.site-frame[data-surface] :is(.editorial-page>section>h2,.prosepage>h2,.prosepage>section>h2,.editorial-setup-steps h2,.ratings-question-list h3){margin-bottom:var(--elo-section-title-gap)}
.site-frame[data-surface="reading"] .faq-page details>summary{line-height:1.5}
.site-frame[data-surface="reading"] .faq-page details[open]>summary{margin-bottom:var(--elo-answer-title-gap)}
/* A fading halo belongs behind a preview, not behind a text column. */
.site-frame[data-surface="marketing"] .story-hero-visual{position:relative;isolation:isolate}
.site-frame[data-surface="marketing"] .story-hero-visual::before{content:"";position:absolute;z-index:-1;pointer-events:none;inset:4% -24px 0;background:var(--elo-preview-halo);border-radius:0;filter:blur(28px)}
@media(max-width:767px){
 :root{--elo-page-title-gap:16px;--elo-section-title-gap:12px;--elo-answer-title-gap:8px}
 .site-frame[data-surface="marketing"] .story-hero-visual::before{inset:5% -10px 0;filter:blur(22px)}
}

.site-frame[data-surface="marketing"] .home-shared-hero>.home-hero-preview{box-shadow:-18px -12px 48px #bdd5bb33,20px 18px 48px #e5d6ad26,0 2px 8px #0f172a08}

/* The following paragraph must not add a second gap below a prose heading. */
.site-frame[data-surface] :is(.editorial-page>h1,.prosepage>h1,.contact-intro>h1,.story-hero-copy>h1,.home-hero-copy>h1,.editorial-page>section>h2,.prosepage>h2,.prosepage>section>h2,.editorial-setup-steps h2,.ratings-question-list h3)+p{margin-top:0}
.site-frame[data-surface="reading"] .faq-page details[open]>summary+p{margin-top:0}

/* A pressed menu acknowledges before scripts initialize. Pending and current
   remain separate: a target never erases the existing page selection. */
.marketing-header-fixed .home-header .navwrap>nav.marketing-menu>a.marketing-menu-item:active::after{opacity:1;transform:scaleX(1);height:2px}
html.elocup-unified-navigation body:not(.leagueconsole) :is(.wait-secondary-inner>nav>a,.appheader .navwrap nav.primarynav>[role=tab])[data-navigation-pending="true"]{text-decoration:none!important;transform:none!important}
html.elocup-unified-navigation body:not(.leagueconsole) :is(.wait-secondary-inner>nav>a,.appheader .navwrap nav.primarynav>[role=tab]):active:not([aria-current=page]):not([aria-selected=true])::before{content:'';position:absolute;inset:auto 0 -3px;height:2px;background:var(--nav-accent,var(--elo-focus));pointer-events:none}
@media(prefers-reduced-motion:reduce){[data-navigation-pending="true"]::before,[data-navigation-pending="true"]::after{animation:none!important;transition:none!important}}
.contact-submit>.button{min-inline-size:150px}

a[data-navigation-pending="true"] :is(span,h3,.profile-team-name){text-decoration-color:var(--elo-focus)!important;text-decoration-thickness:2px!important}

:is(.home-audience-paths,.home-next-step>div)>a[data-navigation-pending="true"],.finder-shortcut>a[data-navigation-pending="true"]{background:var(--elo-highlight-bg);box-shadow:inset 0 0 0 1px var(--elo-highlight-border);text-decoration:none!important}

@media(prefers-reduced-motion:reduce){
 .marketing-header-fixed .home-header .navwrap>nav.marketing-menu>a.marketing-menu-item[data-navigation-pending="true"]:not([aria-current=page])::after,
 html.elocup-unified-navigation :is(.wait-secondary-inner>nav>a,.appheader .navwrap nav.primarynav>[role=tab])[data-navigation-pending="true"]:not([aria-current=page]):not([aria-selected=true])::before{background:repeating-linear-gradient(90deg,var(--elo-focus) 0 4px,transparent 4px 7px)}
}
