/* Exam Center — v530: the website's dark design for the public competition pages, terms and privacy.
   Loaded LAST by each page, so it only re-colours: layout, ids and scripts stay the page's own.
   Printing keeps the light look (see @media print at the end). */
@font-face { font-family: 'EC Display'; src: url(/demo/fonts/space-grotesk-latin-wght-normal.woff2) format('woff2'); font-weight: 300 700; font-display: swap; }
@font-face { font-family: 'EC Body'; src: url(/demo/fonts/inter-latin-wght-normal.woff2) format('woff2'); font-weight: 100 900; font-display: swap; }
@media screen {
:root {
  --ink: #E2E8F0; --mute: #94A3B8; --line: rgba(148,163,184,.18); --bg: #050816; --card: rgba(15,23,48,.72);
  --blue: #67E8F9; --orange: #F97316; --ok: #4ADE80; --warn: #FBBF24; --bad: #F87171; --gold: #FACC15;
  --ec-text: #F8FAFC; --ec-soft: #CBD5E1; --ec-field: rgba(5,8,22,.6); --ec-field-line: rgba(148,163,184,.26); --ec-cyan: #22D3EE;
  color-scheme: dark;
}
html { background: #050816; }
body { background: #050816 !important; color: var(--ink) !important; font-family: 'EC Body', Inter, system-ui, -apple-system, 'Segoe UI', sans-serif !important; -webkit-font-smoothing: antialiased; position: relative; }
body::before { content: ''; position: fixed; inset: 0; z-index: -1; pointer-events: none;
  background: radial-gradient(70% 45% at 50% -5%, rgba(23,37,84,.95), transparent 70%), radial-gradient(40% 35% at 95% 100%, rgba(249,115,22,.08), transparent 70%),
    repeating-conic-gradient(from 0deg at 50% -10%, rgba(59,130,246,.07) 0deg .6deg, transparent .6deg 7deg), linear-gradient(180deg, #050816, #0B1226 55%, #050816); }
a { color: #67E8F9; }

/* header: glass bar, the website's logo and type */
header { background: rgba(5,8,22,.72) !important; -webkit-backdrop-filter: blur(16px) saturate(140%); backdrop-filter: blur(16px) saturate(140%); border-bottom: 1px solid rgba(148,163,184,.14); color: #F8FAFC !important; }
header .brand { display: inline-flex !important; align-items: center; gap: 9px; font-family: 'EC Display', system-ui, sans-serif; font-weight: 700 !important; letter-spacing: -.01em; color: #F8FAFC !important; }
header .brand::before { content: ''; width: 30px; height: 30px; flex: none; background: #fff url(/demo/img/logo-ec.png) center / contain no-repeat; border-radius: 22%; }
header .brand img { display: none !important; }
header .brand span { color: #F97316 !important; }
header .crumb { color: #94A3B8; opacity: 1 !important; }
header a, header button, header a.btnl { color: #CBD5E1 !important; background: rgba(15,23,48,.5) !important; border: 1px solid rgba(148,163,184,.22) !important; border-radius: 10px !important; opacity: 1 !important; }
header a:hover, header button:hover { color: #fff !important; border-color: rgba(34,211,238,.45) !important; }
header .brand, header a.brand { background: none !important; border: 0 !important; padding: 0 !important; }
header button.primary, header a.primary { color: #fff !important; background: linear-gradient(135deg, #FB923C, #F97316 55%, #EA580C) !important; border-color: transparent !important; box-shadow: 0 6px 20px rgba(249,115,22,.35); }

/* type */
h1, h2, h3, h4, .hero h1, .ccard h3, section.blk h2 { color: #F8FAFC !important; font-family: 'EC Display', 'Space Grotesk', system-ui, sans-serif; letter-spacing: -.01em; }
.lead, .meta, .tiny, .desc, .hero .desc, .fact .k, .fact .s, .ccard p, .reading, .empty { color: #94A3B8 !important; }
.fact .v, .facts b, .qn b { color: #F8FAFC !important; }
p, li, td { color: inherit; }
b, strong { color: inherit; }

/* surfaces */
.card, main, .box, .ccard, .modal, .dlg, .panel, .tile, .sheet {
  background: linear-gradient(180deg, rgba(15,23,48,.78), rgba(8,13,30,.78)) !important; border: 1px solid rgba(148,163,184,.16) !important; border-radius: 18px !important; color: var(--ink);
  box-shadow: 0 20px 60px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.04); }
.card .card, .card .box, .box .box { box-shadow: none; background: rgba(5,8,22,.45) !important; border-radius: 14px !important; }
.ccard:hover { border-color: rgba(34,211,238,.45) !important; }
.facts, section.blk { border-color: rgba(148,163,184,.14) !important; }
hr { border: 0; border-top: 1px solid rgba(148,163,184,.16); }

/* buttons: navy → blue glass, orange stays the call to action, secondary → outline */
.btn { background: linear-gradient(135deg, rgba(59,130,246,.42), rgba(34,211,238,.2)) !important; border: 1px solid rgba(34,211,238,.35) !important; color: #fff !important; border-radius: 12px !important; }
.btn:hover { border-color: rgba(34,211,238,.7) !important; }
.btn.orange, button.orange, .btn.primary { background: linear-gradient(135deg, #FB923C, #F97316 55%, #EA580C) !important; border-color: transparent !important; box-shadow: 0 8px 24px rgba(249,115,22,.3); }
.btn.sec, .btn.ghost, .btn.light { background: rgba(15,23,48,.55) !important; color: #E2E8F0 !important; border: 1px solid rgba(148,163,184,.3) !important; }
.btn.bad, .btn.danger, .btn.red { background: rgba(239,68,68,.18) !important; border-color: rgba(239,68,68,.45) !important; color: #FCA5A5 !important; }

/* fields */
input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file]), select, textarea {
  background: var(--ec-field) !important; color: #F8FAFC !important; border: 1px solid var(--ec-field-line) !important; border-radius: 10px !important; }
input::placeholder, textarea::placeholder { color: #64748B !important; }
input:focus, select:focus, textarea:focus { outline: none; border-color: rgba(34,211,238,.65) !important; box-shadow: 0 0 0 3px rgba(34,211,238,.15) !important; }
select option { background: #0B1226; color: #F8FAFC; }
.f label, label { color: #CBD5E1; }
input:-webkit-autofill { -webkit-text-fill-color: #F8FAFC; -webkit-box-shadow: 0 0 0 40px #0B1226 inset; }

/* tables */
table.t th { color: #94A3B8 !important; border-color: rgba(148,163,184,.18) !important; }
table.t td { border-color: rgba(148,163,184,.1) !important; }
table.t tr:hover td { background: rgba(34,211,238,.04); }

/* tags, badges, notes: pale fills → tinted glass */
.tag { background: rgba(59,130,246,.16) !important; color: #BFDBFE !important; }
.tag.o { background: rgba(249,115,22,.16) !important; color: #FDBA74 !important; }
.badge { background: rgba(148,163,184,.16); color: #E2E8F0; }
.badge.paid, .badge.ok { background: rgba(34,197,94,.16) !important; color: #86EFAC !important; }
.err { color: #FCA5A5 !important; }
.key, .verdict.ok { background: rgba(34,197,94,.12) !important; border-color: rgba(34,197,94,.35) !important; color: #86EFAC !important; }
.key.void { background: rgba(148,163,184,.1) !important; border-color: rgba(148,163,184,.25) !important; color: #CBD5E1 !important; }
.verdict.bad { background: rgba(239,68,68,.12) !important; border-color: rgba(239,68,68,.35) !important; color: #FCA5A5 !important; }
.verdict.blank { background: rgba(251,191,36,.1) !important; border-color: rgba(251,191,36,.3) !important; color: #FDE68A !important; }

/* inline light colours written by the pages' scripts */
[style*="background:#fff"]:not(img):not(svg), [style*="background: #fff"]:not(img):not(svg), [style*="background:white"]:not(img):not(svg),
[style*="background:#fafbfe"], [style*="background:#f4f6fb"], [style*="background:#eef0f4"], [style*="background:#eef2fb"], [style*="background:#f8f9fc"],
[style*="background: rgb(255, 255, 255)"]:not(img):not(svg) { background: rgba(15,23,48,.6) !important; }
[style*="background:#e3f2e6"], [style*="background:#eef8ef"], [style*="background:#e8f5e9"] { background: rgba(34,197,94,.12) !important; color: #86EFAC !important; }
[style*="background:#fdecea"], [style*="background:#ffebee"] { background: rgba(239,68,68,.12) !important; color: #FCA5A5 !important; }
[style*="background:#fff7e6"], [style*="background:#fff8e0"], [style*="background:#fff3e0"], [style*="background:#fdf6ec"], [style*="background:#fffaf2"] { background: rgba(251,191,36,.08) !important; }
[style*="color:#1f2937"], [style*="color:#222"], [style*="color:#374151"], [style*="color:#333"], [style*="color:var(--navy)"], [style*="color:#2c3e80"] { color: #E2E8F0 !important; }
[style*="color:#4b5563"], [style*="color:#666"], [style*="color:#6b7280"], [style*="color:#555"], [style*="color:#888"] { color: #94A3B8 !important; }
[style*="color:#b34108"] { color: #FDBA74 !important; } [style*="color:#2e7d32"] { color: #86EFAC !important; }
[style*="border:1px solid #"], [style*="border-top:1px solid #"], [style*="border-bottom:1px solid #"] { border-color: rgba(148,163,184,.18) !important; }

/* answer screen (shared with exam day and practice) */
.choice { background: rgba(5,8,22,.45); border-color: rgba(148,163,184,.22) !important; color: #E2E8F0; }
.choice:hover { border-color: rgba(34,211,238,.55) !important; }
.choice .l { border-color: #60A5FA !important; color: #BFDBFE !important; }
.choice.sel { background: rgba(59,130,246,.18) !important; border-color: rgba(96,165,250,.8) !important; }
.choice.sel .l { background: #3B82F6 !important; color: #fff !important; }
.choice.right { background: rgba(34,197,94,.14) !important; border-color: rgba(74,222,128,.6) !important; }
.tplbar button { background: rgba(15,23,48,.6) !important; color: #CBD5E1 !important; border-color: rgba(148,163,184,.25) !important; }
.tplbar button.on { background: #3B82F6 !important; color: #fff !important; border-color: #3B82F6 !important; }
.tplform, .hints { background: rgba(5,8,22,.45) !important; border-color: rgba(148,163,184,.2) !important; }
.tplform .big { color: #BFDBFE !important; } .tplform .frac .bar { background: #E2E8F0 !important; } .tplform .rt .under { border-top-color: #E2E8F0 !important; }
.prev { color: #CBD5E1 !important; }
.nav .q { background: rgba(5,8,22,.5) !important; border-color: rgba(148,163,184,.22) !important; color: #E2E8F0; }
.nav .q.ok { background: rgba(34,197,94,.16) !important; border-color: rgba(74,222,128,.45) !important; }
.nav .q.bad { background: rgba(239,68,68,.14) !important; border-color: rgba(248,113,113,.45) !important; }
.nav .q.cur { outline-color: #F97316 !important; }
.stage { border-color: rgba(148,163,184,.18) !important; background: rgba(5,8,22,.35); }
.stage .n { background: linear-gradient(135deg, #3B82F6, #22D3EE) !important; color: #fff !important; }
/* figures inside questions keep a white "paper" so their lines stay readable */
.qtext svg, .qtext img, .qcard svg[style*="background"], .qcard img { background: #fff; border-radius: 10px; }
.katex { color: inherit; }
::selection { background: rgba(34,211,238,.35); }

/* competition home: hero, sample screen, cards */
.lhero { background: radial-gradient(70% 90% at 85% 10%, rgba(34,211,238,.16), transparent 60%), linear-gradient(135deg, #0B1226 0%, #111C3D 55%, #172554 100%) !important; border: 1px solid rgba(148,163,184,.16); border-radius: 22px !important; box-shadow: 0 30px 80px rgba(0,0,0,.4); }
.lhero::after { background: radial-gradient(circle, rgba(249,115,22,.22), transparent 70%) !important; }
.lhero h1 { color: #F8FAFC !important; } .lhero .sub { color: #CBD5E1; opacity: 1 !important; }
.lhero .btn.ghost { background: rgba(15,23,48,.55) !important; border-color: rgba(148,163,184,.35) !important; }
.screen { background: rgba(5,8,22,.75) !important; color: #E2E8F0 !important; border: 1px solid rgba(148,163,184,.2); box-shadow: 0 20px 50px rgba(0,0,0,.45) !important; }
.screen * { color: inherit; } .screen [style*="color"] { color: #94A3B8 !important; } .screen .q { color: #F8FAFC !important; }
.screen .frac .b { border-top-color: #E2E8F0 !important; } .screen .box { border-color: rgba(148,163,184,.3) !important; background: rgba(15,23,48,.6); }
.screen .ok, .screen .ok * { color: #4ADE80 !important; }
.stat { background: rgba(15,23,48,.55) !important; border-color: rgba(148,163,184,.2) !important; } .stat .n { color: #FB923C !important; }
.badge-live { background: rgba(15,23,48,.6) !important; border-color: rgba(148,163,184,.3) !important; color: #E2E8F0; } .badge-live.open { background: rgba(34,197,94,.25) !important; border-color: rgba(74,222,128,.5) !important; }
.ticker { background: rgba(5,8,22,.45) !important; border-color: rgba(148,163,184,.18) !important; }
.ecard p, .hl p, .steps p, .ccard .meta, .intro p { color: #A9B6C9 !important; }
.ccard .meta b, .hl h3, .steps h3, .ecard h3, .sec h2, .intro h3, .intro h4 { color: #F8FAFC !important; }
.steps .n { background: linear-gradient(135deg, #FB923C, #EA580C) !important; }
.band { background: rgba(15,23,48,.6) !important; border-color: rgba(148,163,184,.25) !important; color: #E2E8F0 !important; } .band:hover { border-color: rgba(34,211,238,.6) !important; }
.podium span { background: rgba(15,23,48,.6) !important; border-color: rgba(148,163,184,.2) !important; } .podium .g { background: rgba(250,204,21,.12) !important; border-color: rgba(250,204,21,.45) !important; }
details.faq, .intro { background: rgba(15,23,48,.7) !important; border-color: rgba(148,163,184,.16) !important; border-radius: 14px !important; } details.faq summary { color: #F8FAFC !important; } details.faq p { color: #CBD5E1 !important; }
footer.site { border-color: rgba(148,163,184,.16) !important; }
/* narrow screens: the header never pushes the page sideways */
@media (max-width: 640px) {
  header { gap: 8px !important; padding: 0 12px !important; overflow-x: auto; scrollbar-width: none; }
  header::-webkit-scrollbar { display: none; }
  header .crumb { display: none !important; }
  header #hdr, header > span, header > div:not(.sp):not(.crumb) { display: flex; gap: 6px; flex: none; white-space: nowrap; align-items: center; }
  header .sp { min-width: 0; }
  header .brand { font-size: 15px !important; flex: none; } header .brand::before { width: 26px; height: 26px; }
  header a, header button, header a.btnl { white-space: nowrap; padding: 5px 9px !important; font-size: 12px !important; flex: none; }
}
}
/* printing stays light: the dark theme is screen-only */
@media print { header .brand::before { display: none; } }
