@font-face{font-family:"Anton";font-style:normal;font-weight:400;font-display:swap;src:url(fonts/anton-400.woff2) format("woff2")}
@font-face{font-family:"Barlow";font-style:normal;font-weight:400;font-display:swap;src:url(fonts/barlow-400.woff2) format("woff2")}
@font-face{font-family:"Barlow";font-style:normal;font-weight:500;font-display:swap;src:url(fonts/barlow-500.woff2) format("woff2")}
@font-face{font-family:"Barlow";font-style:normal;font-weight:600;font-display:swap;src:url(fonts/barlow-600.woff2) format("woff2")}
@font-face{font-family:"Barlow";font-style:normal;font-weight:700;font-display:swap;src:url(fonts/barlow-700.woff2) format("woff2")}
:root{
  --bg:#F3F4F6; --panel:#FFFFFF; --raised:#F7F8FA; --ink:#14161B; --muted:#5B616E; --line:#E2E5EA; --chip:#EEF0F3;
  --red:#C0392B; --blue:#2348B8; --rope3:#14161B; --ok:#0F7A4D; --warn:#A15C00;
  --gold:#D6A62E; --gold-ink:#8A6510; --on-gold:#14161B; --vinyl:#111317; --vinyl-ink:#F2F1EC; --vinyl-muted:#B7B9BF;
  --map-empty:#E9ECF1; --shadow:0 1px 2px rgba(16,18,24,.05),0 10px 28px rgba(16,18,24,.07); --glow:rgba(214,166,46,.16);
  --display:"Anton","Impact","Arial Narrow Bold",sans-serif; --body:"Barlow","Helvetica Neue",Arial,sans-serif;
  color-scheme: light;
  box-sizing:border-box; padding-top:env(safe-area-inset-top,0px); padding-bottom:env(safe-area-inset-bottom,0px);
}
:root[data-theme="dark"]{
  --bg:#0B0C0F; --panel:#14161B; --raised:#1B1E24; --ink:#F1F2F4; --muted:#9AA2AE; --line:#272B33; --chip:#21252D;
  --red:#FF6B5E; --blue:#8AA8FF; --rope3:#F1F2F4; --ok:#4ADE80; --warn:#F5B84C;
  --gold:#E3B23C; --gold-ink:#F0C75A; --on-gold:#14161B; --vinyl:#0F1115; --vinyl-ink:#F2F1EC; --vinyl-muted:#A9ADB6;
  --map-empty:#262A33; --shadow:0 1px 0 rgba(255,255,255,.03) inset,0 12px 32px rgba(0,0,0,.38); --glow:rgba(227,178,60,.20);
  color-scheme:dark;
}
/* if the theme script couldn't run, follow the system setting */
@media (prefers-color-scheme: dark){
  :root:not([data-theme]){
    --bg:#0B0C0F; --panel:#14161B; --raised:#1B1E24; --ink:#F1F2F4; --muted:#9AA2AE; --line:#272B33; --chip:#21252D;
    --red:#FF6B5E; --blue:#8AA8FF; --rope3:#F1F2F4; --ok:#4ADE80; --warn:#F5B84C; --gold:#E3B23C; --gold-ink:#F0C75A;
    --map-empty:#262A33; --shadow:0 12px 32px rgba(0,0,0,.38); --glow:rgba(227,178,60,.20); color-scheme:dark;
  }
}
*,*::before,*::after{box-sizing:inherit}
html{scroll-padding-top:env(safe-area-inset-top,0px)}
body{margin:0;background:var(--bg);color:var(--ink);font:400 17px/1.55 var(--body)}
a{color:var(--blue)}
:focus-visible{outline:3px solid var(--gold);outline-offset:2px;border-radius:4px}
.wrap{max-width:980px;margin:0 auto;padding:0 20px}
header.hero{background:var(--vinyl);color:var(--vinyl-ink);border-radius:0 0 16px 16px;padding:46px 30px 30px;margin:0 0 22px}
@media (max-width:640px){header.hero{padding:34px 20px 24px}}
.plate{position:relative;display:inline-block;background:var(--gold);color:var(--on-gold);border-radius:10px;padding:14px 34px 8px;margin:0 0 18px;
  box-shadow:inset 0 0 0 4px var(--gold),inset 0 0 0 6px var(--on-gold),inset 0 0 0 9px var(--gold),inset 0 0 0 10px rgba(28,26,23,.55)}
.plate::before,.plate::after{content:"";position:absolute;top:50%;width:9px;height:9px;margin-top:-4px;border-radius:50%;background:var(--on-gold);box-shadow:0 0 0 2px var(--gold),0 0 0 3px rgba(28,26,23,.4)}
.plate::before{left:14px}.plate::after{right:14px}
.plate b{display:block;font:400 clamp(58px,12vw,132px)/.9 var(--display);letter-spacing:.07em;margin-right:-.07em}
.plate{max-width:100%}
@media (max-width:640px){.plate{padding:10px 22px 5px}.plate b{font-size:clamp(34px,10vw,64px);letter-spacing:.04em;margin-right:-.04em}.plate::before{left:8px}.plate::after{right:8px}}
.strap{height:12px;border-radius:6px;background:repeating-linear-gradient(90deg,transparent 0 10px,var(--gold) 10px 16px);opacity:.55;max-width:720px;margin:0 0 22px}
.hero h1{font:700 clamp(24px,3.4vw,34px)/1.15 var(--body);letter-spacing:.005em;margin:0 0 12px;color:var(--gold)}
.ropes{display:none}
.ropes span{display:block;height:5px;border-radius:3px}
.ropes span:nth-child(1){background:var(--red)} .ropes span:nth-child(2){background:var(--rope3);opacity:.85} .ropes span:nth-child(3){background:var(--blue)}
.hero p.lede{font-size:19px;max-width:60ch;color:var(--vinyl-muted);margin:0 0 20px}
.hero .status{color:var(--vinyl-muted)}
.hero button{background:transparent;color:var(--vinyl-ink);border-color:rgba(241,239,233,.35)}
.hero button:hover{border-color:var(--gold);color:var(--gold)}
.tally span{color:var(--vinyl-muted);font-weight:600}
.tally{display:flex;flex-wrap:wrap;gap:22px;font-weight:600}
.tally b{font:400 38px/1 var(--display);color:var(--gold);display:block}
.tally div{min-width:90px}
section.step{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:26px 26px 22px;margin:0 0 22px}
.step > h2{display:flex;align-items:baseline;gap:14px;font:400 30px/1.1 var(--display);margin:0 0 6px;letter-spacing:.01em}
.step > h2 .n{color:var(--gold-ink);font-size:34px;min-width:1ch}
.step > p.sub{color:var(--muted);margin:0 0 18px;max-width:68ch}
.two{display:grid;grid-template-columns:1fr 1fr;gap:18px}
@media (max-width:760px){.two{grid-template-columns:1fr}}
.drop{border:2px dashed var(--line);border-radius:12px;padding:26px 18px;text-align:center;cursor:pointer;transition:border-color .15s,background .15s}
.drop:hover,.drop.over{border-color:var(--gold);background:color-mix(in srgb,var(--gold) 10%,transparent)}
.drop strong{display:block;font-size:19px;margin-bottom:4px}
.drop small{color:var(--muted)}
details.help{margin-top:12px;color:var(--muted);font-size:15px}
details.help summary{cursor:pointer;color:var(--ink);font-weight:600}
label{display:block;font-weight:600;font-size:14px;margin:0 0 4px}
input[type=text],input[type=search],input[type=date],input[type=number],select,textarea{width:100%;font:inherit;font-size:15px;color:var(--ink);background:var(--bg);border:1px solid var(--line);border-radius:8px;padding:9px 11px}
textarea{min-height:120px;resize:vertical;font-family:ui-monospace,Menlo,Consolas,monospace;font-size:13px;line-height:1.45}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px}
.field{margin-bottom:12px}
button{font:600 15px var(--body);border-radius:999px;padding:10px 18px;border:1px solid var(--line);background:var(--panel);color:var(--ink);cursor:pointer}
button.primary{background:var(--gold);border-color:var(--gold);color:var(--on-gold);font-weight:700}
button.primary:hover:not(:disabled){background:#C4951F}
button.primary:disabled{opacity:.45;cursor:not-allowed}
button.ghost{background:transparent}
button.small{padding:6px 12px;font-size:13px}
.row{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.status{font-size:14px;color:var(--muted);margin-top:10px;min-height:1.4em}
.status.err{color:var(--red)} .status.ok{color:var(--ok)}
.night{border-top:1px solid var(--line);padding:18px 0}
.night:first-of-type{border-top:0;padding-top:4px}
.night h3{margin:0;font-size:19px;line-height:1.3}
.night .meta{color:var(--muted);font-size:14px;margin:2px 0 12px}
.night .grid{grid-template-columns:100px 120px 1fr 1fr 100px 1fr}
@media (max-width:980px){.night .grid{grid-template-columns:1fr 1fr 1fr}}
@media (max-width:760px){.night .grid{grid-template-columns:1fr 1fr}}
.chip{display:inline-block;background:var(--chip);border-radius:999px;padding:2px 10px;font-size:13px;margin:0 6px 6px 0}
.chip.warn{color:var(--warn)}
details.matches summary{cursor:pointer;font-weight:600;font-size:15px;margin-top:4px}
ol.mlist{margin:10px 0 0;padding-left:22px;font-size:14px}
ol.mlist li{margin:0 0 8px}
ol.mlist .t{color:var(--muted);display:block;font-size:13px}
ol.mlist li.off{opacity:.5;text-decoration:line-through}
ol.mlist label.inc{display:inline-flex;gap:6px;align-items:center;font-weight:500;font-size:13px;color:var(--muted);margin:2px 0 0}
.empty{color:var(--muted);font-style:italic}
.big{font-size:17px;padding:14px 26px}
.foot{color:var(--muted);font-size:14px;padding:10px 0 50px}
.check{display:flex;gap:8px;align-items:center;font-weight:500}
.check input{width:18px;height:18px}
.contents{columns:2;column-gap:28px;font-size:15px;color:var(--muted);margin:6px 0 18px;padding-left:20px}
@media (max-width:760px){.contents{columns:1}}
.datarow{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}
.mrow{border:1px solid var(--line);border-radius:10px;padding:12px;margin:0 0 10px;display:grid;grid-template-columns:1.3fr 1fr auto 1fr .5fr;gap:8px;align-items:end}
.mrow .flags{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:16px;align-items:center}
@media (max-width:760px){.mrow{grid-template-columns:1fr 1fr}}
.mrow label{font-size:12px}
.hint{font-size:13px;color:var(--muted);margin:4px 0 10px}
dialog{border:1px solid var(--line);border-radius:14px;background:var(--panel);color:var(--ink);padding:22px;width:min(640px,94vw)}
dialog::backdrop{background:rgba(10,12,16,.55)}
dialog h3{font:400 26px/1.1 var(--display);margin:0 0 12px}
.choice{border-top:1px solid var(--line);padding:10px 0;font-size:14px}
.choice b{font-weight:600}
.choice select{margin-top:6px}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:12px;margin:0 0 18px}
.card{background:var(--bg);border-radius:10px;padding:12px 14px}
.card b{display:block;font:400 32px/1 var(--display);color:var(--gold-ink)}
.card span{font-size:13px;color:var(--muted)}
.cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:20px}
.cols h4{margin:0 0 8px;font-size:16px}
.cols ol{margin:0;padding-left:20px;font-size:14px}
.cols ol li{margin:0 0 4px}
.charts{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:14px;margin-top:18px}
.charts img{width:100%;height:auto;border-radius:12px;border:1px solid var(--line);background:var(--panel)}
.illo{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px;margin:10px 0}
.illo figure{margin:0}
.illo svg{width:100%;height:auto;border:1px solid var(--line);border-radius:10px;background:var(--bg)}
.illo figcaption{font-size:13px;color:var(--muted);margin-top:4px}
.edit{margin-left:6px}
.star{border:0;background:none;padding:0 6px 0 0;font-size:20px;line-height:1;color:var(--muted);cursor:pointer;vertical-align:-2px}
.star.on{color:#E0A100}
.mrate{width:64px!important;padding:3px 6px!important;font-size:13px!important;margin-right:8px;vertical-align:1px;text-align:center}
.star:hover{color:#E0A100}
#hl{position:fixed;inset:0;z-index:60;background:#000000;color:#F3F4F2;display:none;flex-direction:column;padding:env(safe-area-inset-top,0px) 0 env(safe-area-inset-bottom,0px)}
#hl.on{display:flex}
#hl .bar{display:flex;align-items:center;justify-content:space-between;padding:14px 20px;gap:12px}
#hl .dots{display:flex;gap:6px;flex-wrap:wrap}
#hl .dots span{width:9px;height:9px;border-radius:50%;background:#3A3F49}
#hl .dots span.on{background:#E8C15A}
#hl .stage{flex:1;display:flex;padding:0 24px;overflow:auto}
#hl .slide{width:min(1000px,100%);margin:auto;padding:8px 0;animation:hlIn .35s ease}
@keyframes hlIn{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
#hl h2{font:400 clamp(40px,7vw,84px)/.95 var(--display);margin:0 0 14px;letter-spacing:.01em}
#hl .kicker{color:#E8C15A;font-weight:700;letter-spacing:.04em;margin:0 0 10px;font-size:15px}
#hl .rope{display:grid;gap:6px;margin:0 0 26px;max-width:520px}
#hl .rope i{display:block;height:5px;border-radius:3px}
#hl .rope i:nth-child(1){background:#D6A62E}#hl .rope i:nth-child(2){background:#F3F4F2}#hl .rope i:nth-child(3){background:#D6A62E}
#hl .nums{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:22px}
#hl .nums b{display:block;font:400 clamp(52px,8vw,96px)/1 var(--display);color:#E8C15A}
#hl .nums span{color:#C9CDD6;font-weight:600;font-size:18px}
#hl ol.big{margin:0;padding-left:0;list-style:none;counter-reset:n}
#hl ol.big li{counter-increment:n;display:flex;align-items:baseline;gap:16px;font-size:clamp(20px,2.6vw,30px);padding:10px 0;border-bottom:1px solid #2A2E36}
#hl ol.big li::before{content:counter(n);font:400 1.4em/1 var(--display);color:#E8C15A;min-width:1.2em}
#hl ol.big small{color:#A1A7B3;font-size:.62em;margin-left:auto;text-align:right}
#hl .two{display:grid;grid-template-columns:1fr 1fr;gap:30px}
@media (max-width:760px){#hl .two{grid-template-columns:1fr}}
#hl img.map{width:100%;border-radius:12px;background:#fff}
#hl .ctrl button{background:#1F232A;color:#F3F4F2;border:1px solid #3A3F49}
#hl .ctrl button.primary{background:#D6A62E;border-color:#D6A62E;color:#1C1A17}
#hl .note{color:#A1A7B3;font-size:16px;margin-top:16px}
@media (max-height:860px){#hl h2{font-size:clamp(34px,5.2vw,60px)}#hl ol.big li{font-size:clamp(17px,2vw,23px);padding:6px 0}#hl .rope{margin-bottom:16px}#hl .nums b{font-size:clamp(44px,6vw,72px)}}
@media (prefers-reduced-motion: reduce){*{transition:none!important}}
/* Wikidata facts and photos in the preview */
.wiki{margin-top:22px;border-top:1px solid var(--line);padding-top:16px}
.wiki h4{margin:0 0 8px;font-size:16px}
.faces{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:14px;margin:0 0 16px}
.face{background:var(--bg);border-radius:10px;overflow:hidden;font-size:13px;display:flex;flex-direction:column}
.face .ph{position:relative;aspect-ratio:4/5;background:var(--chip);display:flex;align-items:center;justify-content:center;color:var(--muted);font:400 34px/1 var(--display)}
.face img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 20%;display:block}
.face .tx{padding:8px 10px 10px;display:flex;flex-direction:column;gap:4px;flex:1}
.face b{font-size:15px}
.face p{margin:0;color:var(--ink)}
.face .cr{margin-top:auto;font-size:11px;color:var(--muted);overflow-wrap:anywhere}
.face .cr a,.wiki .cr a{color:var(--muted)}
.wiki .cr{font-size:12px;color:var(--muted);margin:10px 0 0}
/* show search */
.finds{list-style:none;margin:8px 0 0;padding:0;display:flex;flex-direction:column;gap:6px}
.finds li{display:flex;gap:10px;align-items:center;justify-content:space-between;background:var(--bg);border-radius:8px;padding:8px 10px;font-size:14px}
.finds li span{min-width:0;overflow-wrap:anywhere}
.finds li small{display:block;color:var(--muted);font-size:12px}
.finds li button{flex:none}
.finds li.cr{display:block;font-size:12px;color:var(--muted);background:none;padding:2px 0}
.finds .cr a{color:var(--muted)}
/* save warnings and backup reminders */
.notice{max-width:980px;margin:16px auto 0;padding:14px 18px;border-radius:12px;background:var(--panel);border:2px solid var(--gold);font-size:15px}
.notice p{margin:0 0 10px}
.notice.bad{border-color:var(--red)}
.notice.bad p{color:var(--red);font-weight:600}
@media (max-width:1020px){.notice{margin:16px 16px 0}}
/* fan score */
.fan{display:flex;gap:20px;align-items:flex-start;background:var(--bg);border-radius:12px;padding:16px 18px;margin:0 0 18px}
.fan-num{flex:none;text-align:center;min-width:96px}
.fan-num b{display:block;font:400 64px/1 var(--display);color:var(--gold-ink)}
.fan-num span{font-size:13px;color:var(--muted)}
.fan-tx{flex:1;min-width:0}
.fan-tx h4{margin:2px 0 6px;font-size:18px}
.fan-up{margin:0 0 8px;font-size:14px}
.fan details summary{cursor:pointer;font-size:14px;font-weight:600}
.fan-t{width:100%;border-collapse:collapse;font-size:13px;margin-top:8px}
.fan-t th,.fan-t td{text-align:left;padding:4px 6px;border-bottom:1px solid var(--line)}
.fan-t td:nth-child(2),.fan-t td:nth-child(4){white-space:nowrap;text-align:right}
.fan-t th:nth-child(2),.fan-t th:nth-child(4){text-align:right}
.fan-t td:nth-child(3){width:30%}
.fan .bar{display:block;height:8px;background:var(--line);border-radius:4px;overflow:hidden}
.fan .bar i{display:block;height:100%;background:var(--gold)}
@media (max-width:560px){.fan{flex-direction:column;gap:6px}.fan-num{text-align:left}.fan-t td:nth-child(3),.fan-t th:nth-child(3){display:none}}
/* leaderboard */
.lb{width:100%;border-collapse:collapse;font-size:14px}
.lb th,.lb td{text-align:left;padding:6px 8px;border-bottom:1px solid var(--line)}
.lb th:nth-child(1),.lb td:nth-child(1),.lb th:nth-child(3),.lb td:nth-child(3),.lb th:nth-child(4),.lb td:nth-child(4){text-align:right;white-space:nowrap}
.lb td:nth-child(2){overflow-wrap:anywhere}
.lb tr.me td{background:var(--chip);font-weight:700}
.lb small{display:block;color:var(--muted);font-weight:400;font-size:12px}
.lb-you{background:var(--bg);border-radius:10px;padding:10px 12px;margin:0 0 12px;font-size:14px}
.lb-you b{font:400 28px/1 var(--display);color:var(--gold-ink);margin-right:6px}
.lb-ev{margin:0;padding-left:20px;font-size:14px}
.lb-ev li{margin:0 0 4px}
.fans{display:inline-block;background:var(--chip);border-radius:999px;padding:1px 8px;font-size:12px;color:var(--muted);margin-left:6px;white-space:nowrap}
/* PDF progress and file list */
#pdfProgress{width:100%;height:8px;margin-top:10px;accent-color:var(--gold)}
.pdf-list{list-style:none;margin:8px 0 0;padding:0;font-size:13px}
.pdf-list li{display:flex;gap:8px;align-items:baseline;padding:3px 0;border-bottom:1px solid var(--line)}
.pdf-list li b{flex:none;width:1.2em;text-align:center}
.pdf-list .ok b{color:var(--ok)} .pdf-list .err b{color:var(--red)} .pdf-list .dup b{color:var(--muted)}
.pdf-list span{min-width:0;overflow-wrap:anywhere}
.pdf-list small{color:var(--muted)}
/* step 2 filter */
#clearRow{gap:10px;align-items:center;flex-wrap:wrap}
.night.filtered{display:none}
/* interactive maps in the preview */
.smap{margin:0;background:var(--panel);border-radius:12px;padding:10px 12px;border:1px solid var(--line);color:var(--ink)}
.smap figcaption{font-weight:700;font-size:14px;margin:0 0 6px;display:flex;flex-wrap:wrap;gap:4px 10px;justify-content:space-between}
.smap-tip{font-weight:500;color:var(--muted)}
.smap svg{display:block;width:100%;height:auto}
.smap path{stroke:var(--panel);stroke-width:1;transition:fill .1s}
.smap path:not([tabindex]){fill:var(--map-empty)}
.smap [tabindex]{cursor:pointer;outline:none}
.smap [tabindex]:hover,.smap [tabindex]:focus{stroke:var(--ink);stroke-width:2}
.smap svg path:not([tabindex]):hover{fill:var(--chip)}
.smap-legend{display:flex;gap:12px;flex-wrap:wrap;font-size:12px;margin-top:6px;color:var(--muted)}
.smap-legend i{display:inline-block;width:12px;height:12px;border-radius:2px;margin-right:4px;vertical-align:-1px}

/* ---------- 2026 redesign: sleeker panels, header, controls and a sticky step bar ---------- */
body{font-size:16.5px;-webkit-font-smoothing:antialiased;background:var(--bg)}
.wrap{max-width:1040px}
header.hero{position:relative;overflow:hidden;margin:16px 0 18px;border-radius:22px;border:1px solid var(--line);padding:42px 34px 30px;
  background:radial-gradient(900px 340px at 0% -10%,var(--glow),transparent 62%),radial-gradient(700px 300px at 110% 120%,var(--glow),transparent 60%),linear-gradient(180deg,#14161B,#0D0E12);box-shadow:var(--shadow)}
@media (max-width:640px){header.hero{margin:10px 0 14px;padding:30px 18px 22px;border-radius:18px}}
.strap{height:2px;border-radius:2px;background:linear-gradient(90deg,var(--gold),transparent);opacity:.9;max-width:520px;margin:0 0 20px}
.hero h1{letter-spacing:.01em}
.tally{gap:12px}
.tally div{min-width:110px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);border-radius:14px;padding:12px 16px}
.tally b{font-size:40px}
.hero button{border-color:rgba(255,255,255,.18);background:rgba(255,255,255,.04)}
.hero button:hover{background:rgba(255,255,255,.08)}
.theme-btn{position:absolute;top:16px;right:16px;width:40px;height:40px;padding:0;display:grid;place-items:center;font-size:18px;line-height:1}
section.step{border-radius:20px;padding:30px 30px 24px;margin:0 0 18px;box-shadow:var(--shadow);scroll-margin-top:70px}
@media (max-width:640px){section.step{padding:22px 18px 18px;border-radius:16px}}
.step > h2{align-items:center;font-size:32px}
.step > h2 .n{display:inline-grid;place-items:center;flex:none;width:42px;height:42px;border-radius:50%;font-size:24px;line-height:1;
  background:color-mix(in srgb,var(--gold) 16%,transparent);color:var(--gold-ink);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--gold) 45%,transparent)}
input[type=text],input[type=search],input[type=date],input[type=number],select,textarea{background:var(--raised);border-radius:10px;transition:border-color .15s,box-shadow .15s}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--gold);box-shadow:0 0 0 3px color-mix(in srgb,var(--gold) 28%,transparent)}
button{background:var(--raised);transition:background .15s,border-color .15s,transform .05s}
button:hover:not(:disabled){border-color:color-mix(in srgb,var(--gold) 60%,var(--line))}
button:active:not(:disabled){transform:translateY(1px)}
button.primary{background:linear-gradient(180deg,color-mix(in srgb,var(--gold) 88%,#fff),var(--gold));box-shadow:0 1px 0 rgba(255,255,255,.25) inset,0 6px 16px color-mix(in srgb,var(--gold) 25%,transparent)}
button.primary:hover:not(:disabled){background:var(--gold)}
button.ghost{background:transparent}
.drop{border-radius:16px;background:var(--raised)}
.card,.fan,.face,.finds li,.lb-you{background:var(--raised);border:1px solid var(--line)}
.card{border-radius:14px}
.notice{border-radius:16px;box-shadow:var(--shadow)}
.night{border-top-color:var(--line)}
dialog{border-radius:18px;box-shadow:var(--shadow)}
/* sticky step bar */
.stepnav{position:sticky;top:0;z-index:30;margin:0 0 16px;padding:8px 0;background:color-mix(in srgb,var(--bg) 82%,transparent);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.stepnav ol{list-style:none;margin:0;padding:4px;display:flex;gap:4px;overflow-x:auto;scrollbar-width:none;background:var(--panel);border:1px solid var(--line);border-radius:999px;box-shadow:var(--shadow)}
.stepnav ol::-webkit-scrollbar{display:none}
.stepnav a{display:flex;align-items:center;gap:8px;white-space:nowrap;padding:7px 14px;border-radius:999px;color:var(--muted);text-decoration:none;font-weight:600;font-size:14px}
.stepnav a b{display:inline-grid;place-items:center;width:22px;height:22px;border-radius:50%;font-size:12px;background:var(--chip);color:var(--ink)}
.stepnav a:hover{color:var(--ink)}
.stepnav a.on{background:color-mix(in srgb,var(--gold) 16%,transparent);color:var(--ink)}
.stepnav a.on b{background:var(--gold);color:var(--on-gold)}
@media (max-width:560px){.stepnav a{padding:7px 10px}.stepnav a span{display:none}}
.step > h2{scroll-margin-top:80px}
@media (max-width:560px){.tally{flex-wrap:nowrap;gap:8px}.tally div{flex:1 1 0;min-width:0;padding:10px 12px}.tally b{font-size:30px}.tally span{font-size:13px}}
.lb-ev li.empty{list-style:none;margin-left:-20px}
/* enlarged charts and maps */
#chartImgs img{cursor:zoom-in;transition:transform .12s,box-shadow .12s}
#chartImgs img:hover,#chartImgs img:focus-visible{transform:translateY(-1px);box-shadow:var(--shadow)}
.zoom-btn{margin-left:auto}
dialog.zoom{width:min(1200px,96vw);max-height:94vh;padding:14px 16px 18px;overflow:auto}
.zoom-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 10px}
.zoom-bar b{font-size:16px}
#zoomBody img{display:block;width:100%;height:auto;border-radius:12px;border:1px solid var(--line);background:var(--panel)}
#zoomBody .smap{border:0;padding:0}
ol.mlist .moved{color:var(--ok)}
dialog.sync-dlg{max-width:560px;width:calc(100% - 32px)}
dialog.sync-dlg input{flex:1;min-width:0}
.sync-code code{font-size:1.15em;letter-spacing:.04em;padding:6px 10px;border-radius:8px;background:var(--panel2,rgba(127,127,127,.12));user-select:all}
#syncLine{margin-top:6px}
details.bm .bm-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.bm-btn{display:inline-block;padding:9px 16px;border-radius:999px;background:var(--accent,#c8102e);color:#fff !important;font-weight:700;text-decoration:none;cursor:grab;user-select:none}
.bm-btn:active{cursor:grabbing}
.wfind{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin:0 0 14px}
.wfind input{flex:1;min-width:220px;max-width:420px}
.wfind .hint{margin:0}
button.wlink{all:unset;cursor:pointer;color:inherit;text-decoration:underline;text-decoration-color:color-mix(in srgb,currentColor 35%,transparent);text-underline-offset:3px}
button.wlink:hover,button.wlink:focus-visible{text-decoration-color:currentColor;outline:none}
button.wlink:focus-visible{box-shadow:0 0 0 2px var(--accent,#c8102e);border-radius:3px}
dialog.w-dlg{width:min(960px,96vw);max-height:92vh;overflow:auto}
.wp-head{display:flex;gap:18px;align-items:flex-start;flex-wrap:wrap}
.wp-head>div{flex:1;min-width:240px}
.wp-head figure{margin:0;width:160px;flex:none}
.wp-head img{width:160px;height:auto;border-radius:12px;display:block}
.wp-head figcaption{font-size:11px;color:var(--muted);margin-top:4px}
.wp-head h3{margin:0 0 10px}
.wp-table{overflow-x:auto;margin-top:6px}
.wp-table table{width:100%;border-collapse:collapse;font-size:14px}
.wp-table th,.wp-table td{text-align:left;padding:7px 8px;border-bottom:1px solid var(--line);vertical-align:top}
.wp-table td:first-child{white-space:nowrap}
.wp-table small{color:var(--muted)}
.wp-table tr.tc td{background:color-mix(in srgb,var(--accent,#c8102e) 10%,transparent)}
b.res{display:inline-block;min-width:22px;text-align:center;border-radius:6px;font-size:12px;padding:2px 4px}
b.res.w{background:color-mix(in srgb,#22c55e 25%,transparent)}
b.res.l{background:color-mix(in srgb,#ef4444 22%,transparent)}
b.res.d{background:color-mix(in srgb,#a3a3a3 30%,transparent)}
.cl-in{flex:1;min-width:180px;max-width:320px}
.plate small{display:block;font:400 clamp(20px,3.6vw,40px)/1 var(--display);letter-spacing:.32em;margin:0 -.32em 4px 0;text-align:center}
@media (max-width:640px){.plate small{font-size:clamp(14px,4.4vw,24px);letter-spacing:.24em;margin-right:-.24em}}
.plate small,.plate b{text-transform:uppercase}
.w619{margin:0 0 18px;padding:18px 20px;border-radius:14px;background:linear-gradient(135deg,#1d4ed8,#0e7490 55%,#ca8a04);color:#fff;box-shadow:0 8px 30px rgba(0,0,0,.35);animation:w619 .5s ease-out}
.w619 b{display:block;font:400 30px/1.1 var(--display);margin-bottom:8px}
.w619 p{margin:6px 0 0;font-size:16px}
@keyframes w619{from{transform:scale(.6) rotate(-6deg);opacity:0}to{transform:none;opacity:1}}
@media (prefers-reduced-motion:reduce){.w619{animation:none}}
