/* ==========================================================================
   THEME — the final layer, loaded last on every page.
   White ground · gold lines · green weight · blue for the boys' competition,
   purple for the girls'. The competition colour comes from tokens.css
   (--competition*), switched by <html data-competition>. Only looks; no
   behaviour lives here.
   ========================================================================== */

/* ------------------------------------------------------------ the logo */
.front-head .topbar-brand img,.topbar .topbar-brand img{height:60px;width:auto}
.front-head .topbar-brand span{font-size:22px}
body.console-workspace .bar>img:first-child,body .shell>.bar>img{height:52px!important;width:auto!important;max-height:none!important}
body.instrument .gate img,.gate form>img{max-width:380px!important;width:100%!important;margin-bottom:18px!important}
html body.programme-choice .programme-choice-brand img{width:460px!important;max-width:100%!important;height:auto!important}
html body.simple-home .simple-brand img{width:460px!important;max-width:100%!important;max-height:none!important;height:auto!important}
html body.simple-home .simple-brand{align-items:center!important}

/* ------------------------------------------------ competition identity */
.active-competition-badge{display:inline-flex!important;align-items:center;gap:8px;min-height:36px;padding:0 14px!important;border-radius:999px!important;
  background:var(--competition)!important;color:#fff!important;border:0!important;font:800 12.5px/1 var(--ui)!important;letter-spacing:.08em;text-transform:uppercase;white-space:nowrap;margin-left:0!important}
.active-competition-badge::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--gold-300)}
.front-head{border-bottom:0!important;box-shadow:inset 0 -4px 0 var(--competition),inset 0 -5px 0 var(--gold-500)}
body.console-workspace .bar{box-shadow:inset 0 -4px 0 var(--competition)!important}
.rail a.on{box-shadow:inset 4px 0 0 var(--competition),var(--shadow-1)}
.front :focus-visible{outline-color:var(--competition-lumen)!important}
.lineup li[data-state="now"]{background:var(--competition)!important}
.catcard[data-accent="blue"] .big{color:var(--competition)!important}
.letter[data-accent="blue"]{background:var(--competition)!important}
.pill.now{background:var(--competition)!important}

/* Entrances: the chosen competition carries its colour. */
.competition-portal{--competition-accent:var(--competition)!important;--competition-dark:var(--competition)!important;--competition-soft:var(--competition-tint)!important}
html body.simple-home .competition-identity{background:var(--competition-tint)!important;border:1px solid var(--competition-line)!important;border-left:5px solid var(--competition)!important;color:var(--competition)!important}
html body.simple-home .competition-identity>span{background:var(--competition)!important}
html body.simple-home .competition-identity small{color:var(--competition)!important}
html body.simple-home .competition-back{color:var(--competition)!important;border-color:var(--competition-line)!important}
html body.simple-home .launch-primary .launch-card.screen{border-top-color:var(--competition)!important}
html body.simple-home .launch-primary .launch-card.screen strong{color:var(--competition)!important}
html body.simple-home .launch-primary .launch-card::before{background:var(--competition)!important}
html body.programme-choice .programme-choice-card.boys::before{background:var(--boys)!important}
html body.programme-choice .programme-choice-card.boys h2,html body.programme-choice .programme-choice-card.boys strong{color:var(--boys)!important}
html body.programme-choice .programme-choice-card.boys .programme-choice-mark{background:var(--boys-tint)!important;color:var(--boys)!important;border-color:var(--boys-line)!important}
html body.programme-choice .programme-choice-card.female::before{background:var(--girls)!important}
html body.programme-choice .programme-choice-card.female h2,html body.programme-choice .programme-choice-card.female strong{color:var(--girls)!important}
html body.programme-choice .programme-choice-card.female .programme-choice-mark{background:var(--girls-tint)!important;color:var(--girls)!important;border-color:var(--girls-line)!important}

/* ------------------------------------------------ judging pages detail */
.judge-screen #hcard p.q{font-family:var(--ui)!important;font-weight:500!important;font-size:17px!important;line-height:1.55!important;color:var(--ink-soft)!important}
.judge-screen #hcard p.q:first-child{font-family:var(--display)!important;font-weight:700!important;font-size:22px!important;color:var(--green-900)!important}
.judge-screen .now-tag{background:var(--competition)!important}

/* ------------------------------------------------------ phones */
@media (max-width:720px){
  .front-head .topbar-brand img{height:46px}
  .active-competition-badge{min-height:30px;padding:0 10px!important;font-size:11px!important}
  html body.programme-choice .programme-choice-brand img,html body.simple-home .simple-brand img{width:300px!important}
}

/* ------------------------------------------------ sign-in: white ground */
body.instrument .gate,body .gate{background:radial-gradient(1100px 700px at 50% 35%,var(--gold-50),#fff 70%)!important}
body.instrument .gate form,body .gate form{box-shadow:0 0 0 1.5px var(--gold-500),0 0 0 7px #fff,0 0 0 8.5px var(--competition-line),0 30px 70px #0a2a1822!important;border-top:6px solid var(--competition)!important}

/* The rehearsal banner never covers the last button on a page. */
body.front,body.console-workspace{padding-bottom:56px}

/* Judging door: three cards, centred. */
.grid-cats{justify-content:center;grid-template-columns:repeat(auto-fill,minmax(260px,300px))}
.catcard .pill{align-self:flex-start;background:var(--green-50);color:var(--green-800);font-size:13px;padding:6px 12px}
body .gate form{background:#fff!important;border-radius:var(--r3)!important;padding:32px!important;width:min(420px,100%)!important}
@media (max-width:720px){
  html body.simple-home .simple-brand,html body.programme-choice .programme-choice-brand{display:flex!important;flex-direction:column!important;align-items:flex-start!important;gap:14px!important}
  html body.simple-home .simple-brand img,html body.programme-choice .programme-choice-brand img{width:260px!important}
  html body.simple-home .simple-brand h1{font-size:2.1rem!important}
  html body.simple-home .simple-launch{padding:24px 18px!important}
  html body.simple-home .doors{grid-template-columns:1fr!important}
}
@media (max-width:720px){body.console-workspace .bar .sep{display:none!important}}