/* Layout concept: chalk-white pages with mown-stripe pitch heroes. Qualification need is shown as referee cards: red = required, yellow = strongly preferred, outline = helpful, green = not needed. */
:root{
  --ink:#10201a;--muted:#4f6258;--bg:#f2f5ee;--card:#ffffff;--line:#d6ddd0;
  --brand:#136338;--brand-d:#0a4527;--on-brand:#ffffff;--accent:#f2c230;--on-accent:#1b1700;--soft:#e2eddc;
  --pitch-a:#1d6d3f;--pitch-b:#195f37;--pitch-line:rgba(255,255,255,.28);--on-pitch:#f7fbf5;
  --red:#c63a2e;--on-red:#ffffff;--yellow:#f2c230;--on-yellow:#1b1700;--green:#2e8b57;--on-green:#ffffff;
  --good:#1f7a4d;--shadow:0 1px 2px rgba(16,32,26,.06),0 6px 18px rgba(16,32,26,.05);--radius:12px;
  --display:"Barlow Condensed","Arial Narrow","Roboto Condensed","Helvetica Neue",Arial,sans-serif;
  --body:"Barlow",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  color-scheme:light;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --ink:#e9f2ec;--muted:#9db3a5;--bg:#0d1612;--card:#14221b;--line:#243830;
  --brand:#5ccf8a;--brand-d:#8fe3b0;--on-brand:#0a1a12;--accent:#f4cc4a;--on-accent:#1b1700;--soft:#19302a;
  --pitch-a:#14452a;--pitch-b:#113b24;--pitch-line:rgba(255,255,255,.2);--on-pitch:#f1f8f3;
  --red:#e0584a;--on-red:#1b0603;--yellow:#f4cc4a;--on-yellow:#1b1700;--green:#4fbf82;--on-green:#06180e;
  --good:#5fd08f;--shadow:none;color-scheme:dark}}
:root[data-theme="dark"]{
  --ink:#e9f2ec;--muted:#9db3a5;--bg:#0d1612;--card:#14221b;--line:#243830;
  --brand:#5ccf8a;--brand-d:#8fe3b0;--on-brand:#0a1a12;--accent:#f4cc4a;--on-accent:#1b1700;--soft:#19302a;
  --pitch-a:#14452a;--pitch-b:#113b24;--pitch-line:rgba(255,255,255,.2);--on-pitch:#f1f8f3;
  --red:#e0584a;--on-red:#1b0603;--yellow:#f4cc4a;--on-yellow:#1b1700;--green:#4fbf82;--on-green:#06180e;
  --good:#5fd08f;--shadow:none;color-scheme:dark}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font:16px/1.65 var(--body);color:var(--ink);background:var(--bg);padding-left:max(0px,env(safe-area-inset-left,0px));padding-right:max(0px,env(safe-area-inset-right,0px))}
#page{background:var(--bg);color:var(--ink);font:16px/1.65 var(--body)}
h1,h2,h3{font-family:var(--display);line-height:1.1;letter-spacing:.005em;text-wrap:balance;font-weight:700}
h1{font-size:clamp(2.2rem,5.5vw,3.4rem);margin:.2em 0 .3em;text-transform:none}
h2{font-size:1.75rem;margin:1.8em 0 .5em}
h3{font-size:1.3rem;margin:.2em 0 .3em}
a{color:var(--brand);text-underline-offset:3px}
a:hover{color:var(--brand-d)}
:focus-visible{outline:3px solid var(--accent);outline-offset:2px;border-radius:4px}
.wrap{max-width:1100px;margin:0 auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
.skip{position:absolute;left:-999px;top:0;background:var(--brand);color:var(--on-brand);padding:8px 14px;z-index:99}
.skip:focus{left:8px;top:8px}
.top{position:sticky;top:env(safe-area-inset-top,0px);z-index:10;background:var(--bg);border-bottom:1px solid var(--line)}
.bar{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:60px;flex-wrap:wrap}
.brand{display:flex;align-items:center;gap:10px;font:800 1.45rem var(--display);letter-spacing:.02em;text-transform:uppercase;text-decoration:none;color:var(--ink)}
.mark{position:relative;display:inline-block;width:30px;height:30px;border-radius:50%;background:var(--pitch-a);border:2px solid var(--brand)}
.mark::before{content:"";position:absolute;left:50%;top:0;bottom:0;width:2px;margin-left:-1px;background:var(--on-pitch);opacity:.9}
.mark::after{content:"";position:absolute;left:50%;top:50%;width:10px;height:10px;margin:-5px 0 0 -5px;border-radius:50%;border:2px solid var(--on-pitch)}
.nav{display:flex;gap:2px;flex-wrap:wrap}
.nav a{padding:7px 10px;border-radius:8px;text-decoration:none;color:var(--ink);font-size:.95rem;font-weight:500}
.nav a:hover{background:var(--soft);color:var(--brand-d)}
.nav a[aria-current]{background:var(--brand);color:var(--on-brand)}
.menu{display:none;background:none;border:1px solid var(--line);border-radius:9px;padding:7px 12px;color:var(--ink);font:inherit}
@media (max-width:900px){.menu{display:block}.nav{display:none;width:100%;flex-direction:column;padding-bottom:10px}.nav.open{display:flex}}
main{padding-bottom:60px}
.crumbs{font-size:.88rem;color:var(--muted);padding:18px 0 4px}
.crumbs a{color:var(--muted)}
.crumbs span{opacity:.7;margin:0 3px}
.hero{padding:22px 0 8px}
.hero.big{padding:44px 0 30px}
.hero.big h1{font-size:clamp(2.6rem,7vw,4.6rem);max-width:15ch;line-height:.98}
.hero.pitch{position:relative;margin-top:16px;padding:44px max(22px,4vw) 34px;border-radius:var(--radius);color:var(--on-pitch);overflow:hidden;
  background:repeating-linear-gradient(90deg,var(--pitch-a) 0,var(--pitch-a) 64px,var(--pitch-b) 64px,var(--pitch-b) 128px)}
.hero.pitch::before{content:"";position:absolute;right:-90px;top:50%;width:300px;height:300px;margin-top:-150px;border-radius:50%;border:3px solid var(--pitch-line);pointer-events:none}
.hero.pitch::after{content:"";position:absolute;right:59px;top:0;bottom:0;width:3px;background:var(--pitch-line);pointer-events:none}
.hero.pitch>*{position:relative;z-index:1}
.hero.pitch .eyebrow{color:var(--accent)}
.hero.pitch .lead{color:var(--on-pitch);opacity:.92;max-width:58ch}
.hero.pitch .btn{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}
.hero.pitch .btn:hover{filter:brightness(1.06);color:var(--on-accent)}
.hero.pitch .btn.ghost{background:transparent;color:var(--on-pitch);border-color:var(--on-pitch)}
.hero.pitch .btn.ghost:hover{background:rgba(255,255,255,.14);color:var(--on-pitch)}
.eyebrow{margin:0;color:var(--brand);font-weight:600;font-size:.85rem;text-transform:uppercase;letter-spacing:.09em}
.eyebrow a{color:inherit;text-decoration:none}
.lead{font-size:1.14rem;color:var(--muted);max-width:68ch}
.actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}
.btn{display:inline-block;background:var(--brand);color:var(--on-brand);border:1px solid var(--brand);padding:10px 18px;border-radius:10px;font:600 .97rem var(--body);text-decoration:none;cursor:pointer}
.btn:hover{background:var(--brand-d);color:var(--on-brand)}
.btn.ghost{background:transparent;color:var(--brand)}
.btn.ghost:hover{background:var(--soft);color:var(--brand-d)}
.btn.saved{background:var(--good);border-color:var(--good);color:var(--on-brand)}
.facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px;margin:20px 0}
.facts div{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:14px 16px;min-width:0}
.facts b{display:block;font:700 1.45rem var(--display);overflow-wrap:anywhere;line-height:1.15}
.facts span{color:var(--muted);font-size:.85rem}
.cards{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:16px 18px;min-width:0}
.card h3 a{text-decoration:none}
.card p{margin:.35em 0 0}
.card .pay{color:var(--ink);font-weight:600}
.two{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:14px}
.three{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px;margin-top:12px}
.small{font-size:.9rem;color:var(--muted)}
.pills{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:8px}
.pills a{display:inline-block;padding:6px 13px;border-radius:99px;background:var(--soft);color:var(--brand-d);text-decoration:none;font-size:.92rem;border:1px solid transparent}
.pills a:hover{border-color:var(--brand)}
.tag{display:inline-block;padding:2px 9px;border-radius:99px;background:var(--soft);color:var(--brand-d);font:600 .75rem var(--body)}
.tag.strong{background:var(--green);color:var(--on-green)}
.tag.recognised{background:var(--yellow);color:var(--on-yellow)}
.tag.limited{background:var(--line);color:var(--ink)}
/* Referee-card requirement chips */
.rc{display:inline-flex;align-items:center;gap:6px;font:600 .78rem var(--body);padding:2px 9px 2px 6px;border-radius:99px;border:1px solid var(--line);background:var(--card);color:var(--ink);white-space:nowrap}
.rc i{display:inline-block;width:9px;height:13px;border-radius:2px;border:1.5px solid var(--muted);background:transparent;transform:rotate(8deg)}
.rc.req-m i{background:var(--red);border-color:var(--red)}
.rc.req-p i{background:var(--yellow);border-color:var(--yellow)}
.rc.req-h i{background:transparent;border-color:var(--muted)}
.rc.req-n i{background:var(--green);border-color:var(--green)}
/* Qualification gate panel on career pages */
.gate{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.4fr);gap:18px;align-items:start;background:var(--card);border:1px solid var(--line);border-left:6px solid var(--muted);border-radius:var(--radius);padding:16px 20px;margin:18px 0}
.gate.req-m{border-left-color:var(--red)}.gate.req-p{border-left-color:var(--yellow)}.gate.req-h{border-left-color:var(--muted)}.gate.req-n{border-left-color:var(--green)}
.gate p{margin:.2em 0}
.gate-label{font-size:.78rem;text-transform:uppercase;letter-spacing:.09em;color:var(--muted);font-weight:600}
.gate-answer{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
@media (max-width:720px){.gate{grid-template-columns:1fr}}
.meter{display:flex;gap:4px;margin-top:8px;max-width:220px}
.meter i{flex:1;height:8px;border-radius:99px;background:var(--line)}
.meter i.on.req-m{background:var(--red)}.meter i.on.req-p{background:var(--yellow)}.meter i.on.req-h{background:var(--muted)}.meter i.on.req-n{background:var(--green)}
.callout{border-left:5px solid var(--yellow);background:var(--soft);padding:10px 14px;border-radius:8px;font-size:.93rem;margin:10px 0}
.callout.req-m{border-left-color:var(--red)}
/* Qualification mix */
.stack{display:flex;height:22px;border-radius:99px;overflow:hidden;gap:3px;margin:12px 0}
.stack i{display:block;min-width:6px}
.stack i.req-m,.mixbar i.req-m{background:var(--red)}.stack i.req-p,.mixbar i.req-p{background:var(--yellow)}.stack i.req-h,.mixbar i.req-h{background:var(--muted)}.stack i.req-n,.mixbar i.req-n{background:var(--green)}
.legend{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:8px 20px}
.mixhome{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:4px 22px 18px;margin-top:22px}
.mixhome h2{margin-top:.8em}
.mix{display:grid;gap:8px}
.mixrow{display:grid;grid-template-columns:150px minmax(0,1fr) 28px;gap:10px;align-items:center}
.mixbar{display:block;height:12px;background:var(--soft);border-radius:99px;overflow:hidden}
.mixbar i{display:block;height:100%}
.mixn{text-align:right;font-variant-numeric:tabular-nums;font-weight:600}
@media (max-width:520px){.mixrow{grid-template-columns:120px minmax(0,1fr) 24px}}
.check,.list,.steps{padding-left:1.2em}
.check{list-style:none;padding-left:0}
.check li{padding-left:1.7em;position:relative;margin:.4em 0}
.check li::before{content:"";position:absolute;left:0;top:.45em;width:.95em;height:.95em;border-radius:50%;background:var(--soft);border:2px solid var(--brand)}
.steps li,.list li{margin:.5em 0}
.tablewrap{overflow-x:auto;border:1px solid var(--line);border-radius:var(--radius);background:var(--card)}
table{border-collapse:collapse;width:100%;min-width:480px}
th,td{padding:11px 14px;text-align:left;border-bottom:1px solid var(--line);vertical-align:top}
th{font-size:.8rem;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);background:var(--soft)}
tr:last-child td{border-bottom:0}
tr.grouprow th{background:var(--soft);color:var(--brand-d)}
.panel{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:20px;display:grid;gap:14px;margin:16px 0}
label{display:grid;gap:5px;font-weight:600;font-size:.92rem}
label.inline{display:flex;align-items:center;gap:8px;font-weight:500}
select,input[type=search],input[type=text],textarea{font:inherit;padding:10px 12px;border-radius:10px;border:1px solid var(--line);background:var(--bg);color:var(--ink);width:100%;min-width:0}
.copybox{margin-top:8px;min-height:140px}
.filter{margin-top:14px;max-width:520px}
.chips{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:12px}
.chip{background:var(--card);border:1px solid var(--line);border-radius:99px;padding:3px 6px;cursor:pointer;color:var(--ink);font:inherit}
.chip.on{border-color:var(--brand);box-shadow:0 0 0 2px var(--soft)}
.chip.clear{padding:5px 12px;font-size:.85rem}
fieldset{border:1px solid var(--line);border-radius:10px;padding:12px 14px;min-width:0}
legend{font-weight:700;font-size:.95rem;padding:0 6px}
.checks{display:flex;flex-wrap:wrap;gap:8px 18px}
.checks label{display:flex;align-items:center;gap:7px;font-weight:400;min-width:0}
.fold{border:1px solid var(--line);border-radius:10px;padding:10px 14px}
.fold summary{cursor:pointer;font-weight:700}
.fold .checks,.fold>div{margin-top:12px}
.sub{margin:12px 0}
.sublabel{margin:0 0 6px;font-size:.8rem;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);font-weight:600}
details>summary.small{cursor:pointer}
.pager{display:flex;justify-content:space-between;gap:12px;margin-top:34px;flex-wrap:wrap}
.timeline{list-style:none;padding:0;margin:0;border-left:3px solid var(--brand);margin-left:8px}
.timeline>li{position:relative;margin:0 0 18px 22px;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:16px 18px}
.timeline>li::before{content:attr(data-n);position:absolute;left:-42px;top:14px;width:28px;height:28px;border-radius:50%;background:var(--accent);color:var(--on-accent);display:grid;place-items:center;font:700 .85rem var(--body)}
.bar-wrap{height:10px;background:var(--soft);border-radius:99px;overflow:hidden;margin:6px 0 10px}
.bar-wrap i{display:block;height:100%;background:var(--brand)}
.opt{display:block;border:1px solid var(--line);border-radius:10px;padding:10px 14px;margin:6px 0;cursor:pointer;font-weight:400}
.opt:hover{background:var(--soft)}
.opt input{margin-right:8px}
.fitrow{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}
.fit{text-align:right;flex:none}
.fit b{display:block;font:800 1.9rem var(--display);line-height:1}
.fit span{font-size:.75rem;color:var(--muted);text-transform:uppercase;letter-spacing:.08em}
.warnline{color:var(--red);font-weight:600}
.gloss{margin:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:12px}
.gloss>div{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:12px 16px}
.gloss dt{font:700 1.15rem var(--display)}
.gloss dd{margin:.2em 0 0;font-size:.93rem;color:var(--muted)}
.gloss>div:target,.card:target{outline:3px solid var(--accent)}
.hidden{display:none!important}
.foot{border-top:1px solid var(--line);padding:26px 0;color:var(--muted);background:var(--card)}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
@media print{.top,.foot,.actions,.crumbs,form,.menu{display:none!important}body{background:#fff;color:#000}}