@font-face { font-family:"Source Sans 3"; font-style:normal; font-weight:200 900; font-display:swap; src:url("fonts/source-sans-3-latin.woff2") format("woff2"); unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family:"Source Sans 3"; font-style:normal; font-weight:200 900; font-display:swap; src:url("fonts/source-sans-3-latin-ext.woff2") format("woff2"); unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family:"Source Sans 3"; font-style:normal; font-weight:200 900; font-display:swap; src:url("fonts/source-sans-3-cyrillic.woff2") format("woff2"); unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116; }
/* Colours from uwc.org's theme: UWC blue #004E89, light blue #6da8d4, dark #212121,
   light grey #DDDDDD, crimson #ad1644, teal #009482, amber #fcb900. Font: Source Sans 3 (as uwc.org). */
:root { --fg:#212121; --muted:#5f6670; --line:#DDDDDD; --bg:#f5f7fa; --card:#fff;
  --accent:#004E89; --accent-hover:#003d6b; --accent-tint:#e8f1f8; --accent-line:#b9d4ea;
  --ok:#007a6b; --ok-tint:#e0f3f0; --ok-line:#9fd8cf;
  --warn:#8a5a00; --warn-tint:#fff4d1; --warn-line:#f3d98a;
  --bad:#ad1644; --bad-tint:#fbe6ec; }
[hidden] { display:none !important; }
* { box-sizing: border-box; }
body { margin:0; font:16px/1.5 "Source Sans 3",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif; color:var(--fg); background:var(--bg); }
a { color:var(--accent); }
main { max-width:1400px; margin:0 auto; padding:16px 20px 120px; }
h1 { font-size:24px; margin:8px 0; } h2 { font-size:19px; margin:24px 0 8px; } h3,h4 { margin:0 0 4px; font-size:15px; }
.top { display:flex; gap:16px; align-items:center; padding:10px 20px; background:#fff; border-bottom:3px solid var(--accent); }
.brand img { display:block; height:36px; width:auto; }
.brand { margin-right:auto; }
.who { color:var(--muted); }
.inline { display:inline; margin:0; }
button { font:inherit; padding:7px 14px; border:1px solid var(--line); border-radius:8px; background:#fff; cursor:pointer; }
button:hover { border-color:var(--accent-line); } button:disabled { opacity:.5; cursor:wait; }
button.primary { background:var(--accent); color:#fff; border-color:var(--accent); font-weight:600; }
button.primary:hover { background:var(--accent-hover); }
button.link { border:0; background:none; color:var(--accent); padding:0; }
.muted { color:var(--muted); } .error { color:var(--bad); } .req { color:var(--bad); font-size:12px; font-weight:400; }
.card { background:var(--card); border:1px solid var(--line); border-radius:12px; padding:16px 20px; margin:12px 0; }
.login { max-width:360px; margin:60px auto; display:flex; flex-direction:column; gap:12px; }
.login input { width:100%; padding:8px; font:inherit; border:1px solid var(--line); border-radius:8px; margin-top:4px; }
table.list { border-collapse:collapse; background:#fff; width:100%; }
table.list th, table.list td { text-align:left; padding:8px 10px; border-bottom:1px solid var(--line); vertical-align:top; }
table.list th { font-size:inherit; color:var(--muted); font-weight:600; }
table.list tr.first td { border-top:2px solid var(--line); }
.checks tr.error td { color:var(--bad); }
.scroll { overflow-x:auto; }
.num { text-align:right; font-variant-numeric:tabular-nums; }
.badge { display:inline-block; padding:1px 8px; border-radius:20px; font-size:inherit; background:#eceef1; white-space:nowrap; }
.badge.final { background:var(--ok-tint); color:var(--ok); } .badge.draft { background:var(--warn-tint); color:var(--warn); } .badge.closed { background:var(--bad-tint); color:var(--bad); }
.banner { padding:10px 14px; border-radius:8px; } .banner.ok { background:var(--ok-tint); } .banner.bad { background:var(--bad-tint); color:var(--bad); }
.adminbar { display:flex; flex-wrap:wrap; gap:12px; align-items:center; }
.crumbs { margin:4px 0; }
.text { white-space:pre-wrap; overflow-wrap:anywhere; }
.cols { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:24px; align-items:start; }
@media (max-width:900px) { .cols { grid-template-columns:1fr; } }
.app .qa { background:#fff; border:1px solid var(--line); border-radius:10px; padding:12px 14px; margin:10px 0; }
.app h3.section { margin:26px 0 6px; font-size:1.15rem; color:#004E89; }
.app .qa.short { padding:8px 14px; }
.app h4.subhead { margin:18px 0 4px; }
.app .qa.joined { margin-bottom:0; border-bottom:none; border-radius:10px 10px 0 0; }
.app .qa.attached { margin-top:0; border-top:none; border-radius:0 0 10px 10px; padding-top:4px; }
.note { background:var(--accent-tint); border:1px solid var(--accent-line); border-radius:10px; padding:12px 14px; margin:10px 0; }
.note.wellbeing { background:var(--warn-tint); border-color:var(--warn-line); }
.filebox img { max-width:100%; border:1px solid var(--line); border-radius:6px; display:block; }
.filebox iframe { width:100%; height:640px; border:1px solid var(--line); border-radius:6px; }
.filebox video { width:100%; max-height:560px; background:#000; border-radius:6px; display:block; }
.scoring { position:sticky; top:0; }
@media (min-width:901px) { .scoring { max-height:100vh; overflow-y:auto; padding-bottom:110px; } }
fieldset { border:1px solid var(--line); border-radius:10px; background:#fff; margin:10px 0; padding:10px 14px; }
fieldset.criterion.done { border-color:var(--ok-line); }
legend { font-weight:600; padding:0 4px; }
details summary { cursor:pointer; color:var(--muted); }
details ul { margin:6px 0; padding-left:20px; }
.seg { display:flex; flex-wrap:wrap; gap:4px; margin-top:8px; }
.seg label { position:relative; }
.seg input { position:absolute; opacity:0; inset:0; margin:0; cursor:pointer; }
.seg span { display:inline-block; min-width:36px; text-align:center; padding:5px 8px; border:1px solid var(--line); border-radius:6px; background:#fafbfc; }
.seg label:hover span { border-color:var(--accent-line); }
.seg.wide span { min-width:80px; }
.seg input:checked + span { background:var(--accent); border-color:var(--accent); color:#fff; }
.seg input:focus-visible + span { outline:2px solid var(--accent); outline-offset:2px; }
.seg input:disabled { cursor:default; }
.seg-label { min-height:1.5em; font-size:13px; }
label.check { display:flex; gap:8px; align-items:flex-start; margin:4px 0; }
textarea { width:100%; font:inherit; padding:8px; border:1px solid var(--line); border-radius:8px; resize:vertical; }
.rfc { display:block; margin-top:8px; font-weight:600; }
.bar { position:fixed; left:0; right:0; bottom:0; background:#fff; border-top:1px solid var(--line); padding:10px 20px; display:flex; flex-wrap:wrap; gap:8px 16px; align-items:center; justify-content:flex-end; z-index:5; }
.bar .status { margin-right:auto; } .bar .buttons { display:flex; gap:8px; }
.status.ok { color:var(--ok); } .status.warn { color:var(--warn); } .status.bad { color:var(--bad); }
.problems { flex-basis:100%; order:-1; color:var(--bad); }
.confirm { flex-basis:100%; display:flex; gap:8px; align-items:center; justify-content:flex-end; }
form.locked .seg span { opacity:.85; }
.checks td.icon { width:32px; } .checks td.where { width:260px; white-space:nowrap; }
.site-title { margin:12px 0 0; font-size:30px; font-weight:700; color:var(--accent); line-height:1.2; }
table.grades { border-collapse:collapse; width:100%; max-width:520px; margin-top:6px; }
table.grades th, table.grades td { border:1px solid var(--line); padding:5px 10px; text-align:left; }
table.grades th { background:var(--bg, #f5f6f8); font-weight:600; }
table.grades td.num { width:30%; }
