/* Onboarding / main menu follow the active theme (touchline by default) instead of the original ERA gold.
   Loaded after every other stylesheet; the gold theme maps back to gold through the same tokens. */
:root{--entry-accent:var(--theme-accent,#cbb373);--entry-accent-deep:var(--theme-accent-deep,#8d7849);--entry-ink:var(--theme-accent-ink,#151b20);--entry-bg:var(--theme-bg,#070e13);--entry-glow:var(--theme-glow,#b49b5d20)}
/* The entry screens sit on a dark stadium photo; the light journal theme keeps that dark base with its forest accent lifted. */
:root[data-theme=journal]{--entry-accent:#8fcfae;--entry-accent-deep:#3f7b64;--entry-ink:#0f231b;--entry-bg:#0f1c17;--entry-glow:#3f7b6430}
.era-entry{background:var(--entry-bg);color-scheme:dark}
.era-entry:before{background:linear-gradient(0deg,var(--entry-bg) 0%,color-mix(in srgb,var(--entry-bg) 20%,transparent) 48%,color-mix(in srgb,var(--entry-bg) 5%,transparent)),url('/assets/game/era-tunnel.png') center 38%/cover}
.era-entry.studio-scene:before{background:linear-gradient(0deg,var(--entry-bg) 10%,color-mix(in srgb,var(--entry-bg) 93%,transparent) 52%,color-mix(in srgb,var(--entry-bg) 53%,transparent)),url('/assets/game/era-tunnel.png') center 34%/cover}
.era-entry .era-wordmark,.era-entry .entry-kicker,.era-entry .studio-controls .entry-kicker,.era-entry .studio-display>p span{color:var(--entry-accent)}
.era-entry .entry-primary{background:linear-gradient(100deg,var(--entry-accent-deep),var(--entry-accent) 55%,var(--entry-accent-deep));border-color:var(--entry-accent);color:var(--entry-ink)}
.era-entry .entry-primary:hover{background:var(--entry-accent);filter:brightness(1.06)}
.era-entry .entry-secondary{border-color:color-mix(in srgb,var(--entry-accent) 70%,transparent);color:color-mix(in srgb,var(--entry-accent) 70%,#fff)}
.era-entry .entry-secondary:hover{background:color-mix(in srgb,var(--entry-accent) 13%,transparent)}
.era-entry .entry-text:hover{color:var(--entry-accent)}
.era-entry :is(button,input,textarea):focus-visible{outline-color:var(--entry-accent)}
.era-entry .entry-input:focus{border-color:var(--entry-accent)}
.era-entry .era-stepper button[aria-current],.era-entry .era-stepper button:not(:disabled){color:color-mix(in srgb,var(--entry-accent) 80%,#fff)}
.era-entry .era-stepper button[aria-current] i{background:var(--entry-accent);border-color:var(--entry-accent);color:var(--entry-ink)}
.era-entry .era-stepper button:not(:disabled):not([aria-current]) i{border-color:var(--entry-accent);color:var(--entry-accent)}
.era-entry :is(.era-options,.badge-symbols) button:hover{border-color:var(--entry-accent);color:color-mix(in srgb,var(--entry-accent) 70%,#fff)}
.era-entry :is(.era-options button.selected,.era-kit-tabs button.selected,.preview-switch button[aria-pressed=true]),.era-entry fieldset:disabled :is(.era-options button.selected,.era-kit-tabs button.selected){background:var(--entry-accent);border-color:var(--entry-accent);color:var(--entry-ink)}
.era-entry .badge-symbols button.selected{border-color:var(--entry-accent);background:color-mix(in srgb,var(--entry-accent) 9%,transparent);color:var(--entry-accent)}
.era-entry .era-colors input{border-color:color-mix(in srgb,var(--entry-accent) 55%,#333)}
.era-entry .studio-history button{color:var(--entry-accent)}
.era-entry .kit-lineup button[aria-pressed=true]{background:color-mix(in srgb,var(--entry-accent) 9%,transparent);box-shadow:inset 0 -2px var(--entry-accent)}
.era-entry .founding-badge svg{filter:drop-shadow(0 0 30px var(--entry-glow))}
.era-entry .era-recovery-code{border-color:color-mix(in srgb,var(--entry-accent) 55%,#333);color:var(--entry-accent)}
.era-entry .recovery-check input{accent-color:var(--entry-accent)}
.era-entry .studio-display{background:radial-gradient(ellipse,var(--entry-glow),transparent 65%)}
/* Step 1 (club name) has no preview column: centre the form instead of leaving it in the left grid track. */
.era-entry fieldset.studio-body.name-only{display:block;max-width:460px;margin:4vh auto 0}
.era-entry .name-stage .suggestions button.selected{background:var(--entry-accent);border-color:var(--entry-accent);color:var(--entry-ink)}
/* 16 symbols: full rows of 4, or 8 on wide screens. */
.era-entry .badge-symbols{grid-template-columns:repeat(4,1fr)}
@media(min-width:1100px){.era-entry .badge-symbols{grid-template-columns:repeat(8,1fr);gap:6px}.era-entry .badge-symbols button{padding:5px 2px}.era-entry .badge-symbols svg{width:36px;height:40px}.era-entry .badge-symbols span{font-size:12px}}
@media(max-width:900px){.era-footer>span:first-child,.era-footer>span:last-child{display:none}.era-footer{justify-content:center}}
