/* Layout, colours and copy from Quill's v4-both-50g build-ref (handoff SUMS 8a871a3c317c). No web fonts or CDNs. */
*{box-sizing:border-box}
body{margin:0;background:#FBF6EC;color:#1E3546;font-family:Nunito,Inter,system-ui,-apple-system,"Segoe UI",sans-serif}
header{display:flex;align-items:center;justify-content:space-between;padding:18px 48px;border-bottom:1px solid #ECE2CC;background:#FBF6EC}
header img.lockup{height:104px;display:block}
.btn{display:inline-block;border-radius:10px;padding:11px 20px;font:inherit;font-weight:800;font-size:16px;border:1px solid #ECE2CC;background:linear-gradient(180deg,#fff,#F3EEE2);color:#1E3546;box-shadow:inset 0 1px 0 #fff,0 1px 2px rgba(30,53,70,.12);cursor:pointer;text-decoration:none}
.btn.primary{background:linear-gradient(180deg,#3B84BC,#2A70A5);color:#fff;border-color:#225d89;box-shadow:inset 0 1px 0 rgba(255,255,255,.25),0 2px 6px rgba(42,112,165,.35)}
.btn:disabled{opacity:.55;cursor:default}
.btn:focus-visible,.in:focus-visible{outline:3px solid #9FD6F2;outline-offset:2px}
main{display:grid;grid-template-columns:1fr 1.1fr;gap:48px;padding:44px 48px 36px;max-width:1344px}
main.one{grid-template-columns:minmax(0,640px);justify-content:center;max-width:none}
main.admin{grid-template-columns:1fr;max-width:1200px}
h1{font-size:46px;line-height:1.08;margin:6px 0 14px;font-weight:800}
.lead{font-size:19px;color:#5E6873;line-height:1.5;margin:0 0 22px;max-width:30rem}
.lead.small{font-size:16px}
.points{list-style:none;padding:0;margin:0 0 26px}
.points li{display:flex;gap:10px;align-items:center;font-size:17px;margin:10px 0}
.points b{display:inline-grid;place-items:center;width:28px;height:28px;border-radius:50%;background:#E4F2FA;color:#2A70A5;font-size:15px;flex:none}
.mascot{display:flex;align-items:center;gap:16px;margin-top:8px;background:#F3EEE2;border:1px solid #ECE2CC;border-radius:16px;padding:14px 18px;max-width:30rem}
.mascot img{width:84px;height:84px;border-radius:50%;box-shadow:0 2px 8px rgba(30,53,70,.18);flex:none}
.mascot p{margin:0;font-size:15.5px;color:#5E6873;line-height:1.45}
.mascot b{color:#1E3546}
.card{background:#fff;border:1px solid #ECE2CC;border-radius:18px;box-shadow:0 10px 30px rgba(30,53,70,.10);padding:24px;min-width:0}
.card h2{margin:0 0 14px;font-size:24px;font-weight:800}
.drop{border:2px dashed #9FD6F2;background:#E4F2FA url(/assets/wm4-light.jpg) center/contain no-repeat;border-radius:14px;text-align:center;padding:26px 16px;min-height:170px}
.drop.over{border-color:#2A70A5;border-style:solid}
.drop .big{font-size:20px;font-weight:800;margin:8px 0 4px}
.drop .sub{color:#3f4a55;font-size:15px;font-weight:700;margin-bottom:14px}
.drop .big,.drop .sub{text-shadow:0 0 6px #E4F2FA,0 0 2px #E4F2FA}
.arrow{width:54px;height:54px;margin:0 auto;border-radius:14px;background:linear-gradient(180deg,#3B84BC,#2A70A5);color:#fff;display:grid;place-items:center;font-size:30px;font-weight:800;box-shadow:0 4px 10px rgba(42,112,165,.35)}
.files{margin:16px 0 6px}
.f{display:grid;grid-template-columns:1fr auto auto;gap:12px;align-items:center;padding:10px 4px;border-bottom:1px solid #F1EADB;font-size:15.5px}
.f .n{font-weight:700;overflow-wrap:anywhere}.f .s{color:#5E6873;font-size:13.5px}
.bar{grid-column:1/-1;height:8px;border-radius:99px;background:#ECE2CC;overflow:hidden}.bar i{display:block;height:100%;width:0;background:linear-gradient(90deg,#9FD6F2,#2A70A5)}
.ok{color:#2C7A57;font-weight:800;font-size:14px}.pct{color:#2A70A5;font-weight:800;font-size:14px}
.x{color:#5E6873;background:none;border:0;font-size:16px;cursor:pointer;padding:4px 6px}
.tot{display:flex;justify-content:space-between;color:#5E6873;font-size:14px;margin:6px 4px 16px}
.row{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:12px}
.row3{display:grid;grid-template-columns:2fr 1fr auto;gap:14px;align-items:end;margin-bottom:12px}
label.fl{display:block;font-size:14px;font-weight:700;margin-bottom:5px}
.in{border:1px solid #D9CFB8;border-radius:9px;padding:10px 12px;font:inherit;font-size:15.5px;background:#FFFDF8;color:#1E3546;width:100%}
textarea.in{resize:vertical;margin-bottom:6px}
.in::placeholder{color:#8b939b}
.chk{display:flex;gap:8px;align-items:center;font-size:15.5px;margin:8px 0 2px}
.chk input{width:18px;height:18px;accent-color:#2A70A5}
.help{color:#5E6873;font-size:13.5px;margin:0 0 14px 26px}
.acts{display:flex;justify-content:flex-end;gap:10px;margin-top:8px}
.err{color:#9b2c2c;font-weight:700;background:#fdecea;border:1px solid #f3c1bb;border-radius:9px;padding:10px 12px;margin:12px 0}
.note{background:#F3EEE2;border-radius:9px;padding:10px 12px;white-space:pre-wrap}
.done{margin-top:16px}
.codeout{font-size:15.5px;background:#E4F2FA;border-radius:9px;padding:12px;margin:8px 0}
.codeout code{font-size:22px;font-weight:800;letter-spacing:.06em}
table{width:100%;border-collapse:collapse;font-size:14.5px}
th,td{text-align:left;padding:8px 6px;border-bottom:1px solid #F1EADB;vertical-align:top}
footer{padding:16px 48px 24px;color:#5E6873;font-size:14px;border-top:1px solid #ECE2CC;display:flex;justify-content:space-between}
.tag{display:inline-block;background:#E4F2FA;color:#2A70A5;font-weight:800;font-size:13px;padding:4px 10px;border-radius:99px;letter-spacing:.03em}
[hidden]{display:none!important}
@media (max-width:900px){
  main{grid-template-columns:1fr;gap:28px;padding:24px 16px}
  header{padding:12px 16px} header img.lockup{height:72px}
  h1{font-size:34px} footer{padding:14px 16px;flex-direction:column;gap:6px}
  .row,.row3{grid-template-columns:1fr}
}
@media (prefers-color-scheme:dark){
  body{background:#22272E;color:#FBF6EC}
  header{background:#22272E;border-color:#343b45} footer{border-color:#343b45}
  .tag,.pct{color:#9FD6F2} .tag,.points b{background:#2b3d4d;color:#9FD6F2}
  .lead,.mascot p,.f .s,.tot,.help,footer,.x{color:#b9c1c9}
  .mascot{background:#2a3038;border-color:#343b45} .mascot b{color:#FBF6EC}
  .card{background:#2a3038;border-color:#343b45;box-shadow:0 10px 30px rgba(0,0,0,.35)}
  .drop{background:#22272E url(/assets/wm4-dark.jpg) center/contain no-repeat;border-color:#2A70A5}
  .drop .sub{color:#d5dbe0}
  .drop .big,.drop .sub{text-shadow:0 0 6px #22272E,0 0 2px #22272E}
  .f,th,td{border-color:#343b45} .bar{background:#3a424d}
  .in{background:#22272E;border-color:#45505c;color:#FBF6EC}
  .btn:not(.primary){background:linear-gradient(180deg,#3a424d,#2a3038);color:#FBF6EC;border-color:#45505c;box-shadow:none}
  .ok{color:#5fbf8e} .note{background:#22272E} .codeout{background:#2b3d4d}
  .err{background:#3b2424;border-color:#6b3434;color:#f3b5b5}
}
