*{box-sizing:border-box}body{margin:0;color:var(--ink);background:var(--cream);font-family:var(--font-body);-webkit-font-smoothing:antialiased}main{max-width:1160px;margin:0 auto;padding:44px 28px 24px}a{color:inherit}.intro{text-align:center}.brand{font:italic 600 32px/1.1 var(--font-display);margin:0}.brand span{display:inline-block;color:var(--orange);font-size:45px;vertical-align:middle;transform:rotate(-10deg)}.tagline{font-size:13px;margin:6px 0 30px;color:var(--muted)}.title-line{display:flex;align-items:center;justify-content:center;gap:14px}h1{font:600 clamp(38px,5vw,60px)/1.1 var(--font-display);letter-spacing:-1.6px;margin:0}.season{font-size:12px;border:1px solid var(--line);border-radius:4px;padding:5px 8px;transform:rotate(4deg)}.intro-copy{font-size:14px;margin:10px 0 22px}.count-note{text-align:center;font-size:13px;color:var(--muted);margin:0 0 26px}.hoods{list-style:none;margin:0;padding:0;display:grid;gap:12px}.hood{position:relative;display:grid;grid-template-columns:32px minmax(200px,1fr) minmax(180px,1fr) 110px;gap:18px;align-items:center;min-height:98px;padding:18px 24px;text-decoration:none;background:var(--surface-card);border:1px solid var(--border-card);border-radius:var(--radius-card);box-shadow:2px 3px 0 #e6dbcb}.hood:hover{border-color:var(--ink);background:#fff8e9}.hood.leader{background:#ece1e8}.rank{font-size:15px;color:var(--muted);text-align:center}.hood-copy{min-width:0}.hood h2{font:600 24px/1.16 var(--font-display);margin:0;overflow-wrap:anywhere}.rate{text-align:right;font:600 30px/1 var(--font-display);font-variant-numeric:tabular-nums}.rate small{display:block;margin-top:7px;font:400 10px/1.2 var(--font-body);color:var(--muted)}.plot{min-width:0;margin-right:24px;height:6px;position:relative}.bar{height:6px;border-radius:3px;background:var(--stage)}.ghost{--stage:#a9cac0}.pumpkin{--stage:#d69660}.witch{--stage:#9670a0}.mansion{--stage:#49334e}.bar img{position:relative;left:100%;top:-25px;transform:translateX(-50%);display:block;max-width:none}.pending{display:block;white-space:normal;font-size:12px;line-height:1.3;color:var(--muted);transform:translateY(-5px)}.award{position:absolute;left:48px;top:-14px;z-index:1;font-size:9px;font-weight:700;letter-spacing:1.3px;text-transform:uppercase;padding:8px 22px;background:#dfab72;color:#49334e;box-shadow:2px 3px 0 #bca38c;transform:rotate(-1.5deg);clip-path:polygon(0 0,100% 0,97% 50%,100% 100%,0 100%,3% 50%)}.method{font-size:11px;line-height:1.5;color:var(--muted);text-align:center;max-width:660px;margin:19px auto}.contribute{text-align:center;margin:24px 0}.contribute p{font-size:13px;margin:0 0 12px}.contribute .action-primary{display:inline-flex;align-items:center;justify-content:center;text-decoration:none;min-height:44px;min-width:220px;font-size:14px}footer{text-align:center;color:var(--muted);font-size:11px;margin:30px 0 0}.error{text-align:center;padding:45px 0}.error h2{font-family:var(--font-display)}.error a{display:inline-block;text-decoration:none}
@media(max-width:720px){main{padding:20px 20px 92px}.brand{font-size:26px}.brand span{font-size:34px}.tagline{font-size:12px;line-height:1.4;margin:5px 0 22px}h1{font-size:38px}.intro-copy{font-size:12px;margin:8px 0 16px}.count-note{font-size:12px;line-height:1.4;margin-bottom:20px}.hoods{gap:10px}.hood{grid-template-columns:16px minmax(0,1fr) 70px;grid-template-rows:auto 20px;gap:5px 10px;min-height:98px;padding:15px 13px 11px}.rank{grid-row:1/3;font-size:13px}.hood h2{font-size:18px}.rate{font-size:23px;align-self:start}.rate small{font-size:9px;line-height:1.3}.plot{grid-column:2/4;grid-row:2;margin-right:24px;align-self:center}.pending{font-size:10px;transform:none}.award{left:31px;top:-12px;padding:6px 17px}.method{font-size:10px;margin:16px 4px}.contribute{position:fixed;bottom:0;left:20px;right:20px;margin:14px 0 0;padding:12px 0;background:var(--cream);z-index:2}.contribute p{display:none}.contribute .action-primary{width:100%;font-size:13px;padding:12px 20px}footer{margin-top:20px}.bar img{width:40px;height:40px;top:-21px}}
@media(max-width:350px){main{padding-inline:12px}.hood{padding-inline:10px;column-gap:7px}.hood h2{font-size:17px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto}}

/* Reuse the map's paper-cut wordmark without adding a navigation bar. */
.intro{text-align:left}.intro .fright-title{display:flex;flex-wrap:nowrap;align-items:baseline;gap:0 .075em;font:700 clamp(60px,7vw,96px)/1.04 var(--font-display);letter-spacing:-.055em;margin:0 0 15px;color:#44294e}.fright-word{display:inline-block;transform:rotate(-4deg);font-style:italic;text-shadow:2px 3px 0 #d7bd98}.this-word{font-size:.32em;letter-spacing:.035em;text-transform:uppercase;transform:rotate(5deg) translateY(-.45em);margin:0 .05em;color:#96613f;flex-shrink:0}.way-word{display:inline-flex;align-items:baseline;transform:rotate(2deg);text-shadow:2px 3px 0 #d7bd98;flex-shrink:0}.title-arrow{width:.72em;height:.6em;color:#a86b44;margin-left:.15em;transform:rotate(-3deg);align-self:center}.title-line{justify-content:space-between;margin-top:24px}.season{border:0;transform:none;padding:0;font-size:13px}.count-note{text-align:left;margin:12px 0 26px}.tagline{margin-bottom:0}.award{left:auto;right:12px}.rank{font-family:var(--font-display);font-style:italic;font-weight:600}
@media(max-width:720px){.intro .fright-title{font-size:clamp(38px,13vw,68px);gap:0 .05em;margin-bottom:12px}.this-word{font-size:.27em}.title-arrow{width:.5em;margin-left:.06em}.title-line{margin-top:20px}.tagline{margin-bottom:0}.count-note{margin:10px 0 24px}.award{right:9px}.rank{align-self:start;padding-top:3px}}

/* Compact mobile rows keep the leading four neighborhoods in easy reach. */
@media(max-width:720px){main{padding-top:16px}.title-line{margin-top:16px}.count-note{margin-bottom:20px}.hood{min-height:88px;padding-top:12px;padding-bottom:9px;grid-template-rows:auto 16px}.hoods{gap:10px}.rate{font-size:29px}.rate small{margin-top:4px;font-size:10px}.bar img{width:36px;height:36px;top:-19px}}

/* Paper-cut competition medals: the same fixed column is reserved on every row.
   Artwork colors are local gold/silver/bronze variants; outlines/text reuse plum ink. */
.hoods .hood{grid-template-columns:44px minmax(200px,1fr) minmax(180px,1fr) 110px}
.hoods .medal-rank{display:flex;align-items:center;justify-content:center;align-self:center;padding:0}
.rank-medal{display:block;width:44px;height:57px;flex:none;overflow:visible;--medal-face:#e9bb65;--medal-ribbon:#d6a355;--medal-tilt:-4deg;transform:rotate(var(--medal-tilt))}
.medal-silver{--medal-face:#c6c9c3;--medal-ribbon:#a6b0a5;--medal-tilt:4deg}
.medal-bronze{--medal-face:#d99b6b;--medal-ribbon:#b97950;--medal-tilt:-3deg}
.medal-face,.medal-ribbons{stroke:var(--ink);stroke-width:1.8;stroke-linejoin:round}
.medal-face{fill:var(--medal-face)}.medal-ribbons{fill:var(--medal-ribbon)}
.rank-medal text{fill:var(--ink);font:600 18px var(--font-display);font-style:normal}
@media(min-width:721px){.explore-board .hoods .hood{grid-template-columns:44px minmax(180px,1fr) minmax(100px,1fr) 90px}}
/* Reserve 3px more above a mobile leader's count from its first layout. Keep
   the banner fixed so tied leaders still clear the preceding row's artwork. */
@media(max-width:720px){.hoods .hood{grid-template-columns:32px minmax(0,1fr) 70px}.rank-medal{width:32px;height:42px}.hoods .hood.leader{padding-top:15px}}

/* One synchronized, constant-speed entrance per rendered board. Only transforms/opacity animate;
   the bar retains its final measured width and the cards never change size. */
.hoods .bar{position:relative;background:transparent}
.hoods .bar::before{content:"";position:absolute;inset:0;border-radius:inherit;background:var(--stage);transform-origin:left center;animation:scareboard-fill var(--scare-duration,1400ms) linear var(--scare-delay,120ms) both}
.hoods .bar-icon{display:block;width:100%;height:100%;animation:scareboard-travel var(--scare-duration,1400ms) linear var(--scare-delay,120ms) both}
.hoods .bar img{animation:scareboard-settle 160ms ease-out calc(var(--scare-delay,120ms) + var(--scare-duration,1400ms)) both}
.hoods .rank-medal{animation:scareboard-medal 240ms ease-out var(--award-delay,1680ms) both}
.hoods .award{animation:scareboard-award 240ms ease-out var(--award-delay,1680ms) both}
@keyframes scareboard-fill{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes scareboard-travel{from{transform:translateX(-100%);opacity:0}8%{opacity:1}to{transform:translateX(0);opacity:1}}
@keyframes scareboard-settle{0%,100%{transform:translateX(-50%) translateY(0) rotate(0)}45%{transform:translateX(-50%) translateY(-4px) rotate(-5deg)}}
@keyframes scareboard-medal{from{opacity:0;transform:translateY(5px) rotate(var(--medal-tilt))}to{opacity:1;transform:translateY(0) rotate(var(--medal-tilt))}}
@keyframes scareboard-award{from{opacity:0;transform:translateY(5px) rotate(-1.5deg)}to{opacity:1;transform:translateY(0) rotate(-1.5deg)}}
@media(prefers-reduced-motion:reduce){.hoods .bar::before,.hoods .bar-icon,.hoods .bar img,.hoods .award,.hoods .rank-medal{animation:none}}