/* B&S Atlas of Books. Same palette as the rest of the site: marigold #f6bd28, black, cream, poppy red, sky blue. */
:root { --yellow:#f6bd28; --black:#000; --ink:#111; --gray:#444; --cream:#f4e9d3; --red:#d8312b; --sky:#6fb5d6; --teal:#2ba5a0; }
* { margin:0; padding:0; box-sizing:border-box; }
html { font-size:100%; -webkit-text-size-adjust:100%; }
body { background:var(--yellow); color:var(--black); font-family:'IBM Plex Mono',monospace; line-height:1.6; min-height:100vh; font-size:clamp(1rem,3.5vw,1.125rem); overflow-x:hidden; }
a { color:inherit; }
header { padding:2.2rem 1rem 1.4rem; text-align:center; border-bottom:4px solid var(--black); }
header .site-name { font-family:'Oswald',sans-serif; font-size:clamp(3rem,9vw,6.5rem); font-weight:700; letter-spacing:-0.03em; line-height:.92; text-transform:uppercase; }
header .site-name a { text-decoration:none; }
nav { margin:1.6rem 0 .6rem; display:flex; justify-content:center; gap:1.8rem; flex-wrap:wrap; }
nav a { text-decoration:none; font-size:clamp(1rem,4vw,1.2rem); font-weight:500; letter-spacing:.08em; text-transform:uppercase; }
@media (max-width:480px) { nav { gap:.4rem 1.1rem; } nav a { font-size:.92rem; letter-spacing:.05em; } }
nav a:hover, nav a[aria-current="page"] { text-decoration:underline; text-underline-offset:6px; text-decoration-thickness:3px; }
:focus-visible { outline:3px solid var(--black); outline-offset:3px; }
main { max-width:1200px; margin:0 auto; padding:1.5rem 1rem 3rem; }
h2 { font-family:'Oswald',sans-serif; font-weight:700; line-height:1.05; }

/* Hero */
.atlas-hero { position:relative; text-align:center; max-width:960px; margin:1.2rem auto 2.2rem; padding:0 .5rem; }
.hero-row { display:flex; align-items:center; justify-content:center; gap:clamp(1.2rem,4vw,2.6rem); text-align:left; }
.hero-mug { flex:none; width:clamp(170px,22vw,260px); display:block; } .hero-mug img { display:block; width:100%; height:auto; aspect-ratio:360/269; object-fit:contain; filter:drop-shadow(6px 7px 0 rgba(0,0,0,.85)); }
.hero-text { text-align:left; }
@media (max-width:680px) { .hero-row { flex-direction:column; text-align:center; gap:1rem; } .hero-text { text-align:center; } .hero-mug { width:170px; } }
.eyebrow { font-family:'IBM Plex Mono',monospace; font-size:.8rem; font-weight:600; letter-spacing:.22em; text-transform:uppercase; }
.atlas-hero h1 { font-family:'Oswald',sans-serif; font-weight:700; line-height:1.02; font-size:clamp(2.4rem,7.6vw,5rem); text-transform:uppercase; letter-spacing:-.01em; margin:.5rem 0 .6rem; }
.atlas-hero h1 span { display:block; }
.tagline { margin-top:1.2rem; font-size:clamp(1.05rem,3.6vw,1.45rem); font-weight:500; font-style:italic; border-top:3px solid var(--black); border-bottom:3px solid var(--black); display:inline-block; padding:.45rem 1.1rem; margin-bottom:1rem; }
.lede { max-width:620px; margin:0 auto; }
.lede.small { font-size:.95rem; margin:-.4rem auto 1.4rem; color:var(--gray); }
#pin-count { margin-bottom:.3rem; }
.lede.small.claim-hint { margin-top:0; }
.claim-hint a { color:inherit; text-decoration:underline; white-space:nowrap; }
#claim-a-pin { scroll-margin-top:1rem; }
@media (prefers-reduced-motion: no-preference) { html { scroll-behavior:smooth; } }

/* Map */
.map-section { max-width:1100px; margin:0 auto 2.5rem; }
.region-bar { display:flex; flex-wrap:wrap; justify-content:center; gap:.6rem; margin-bottom:1rem; }
.region-bar button { font:inherit; font-size:.85rem; font-weight:600; letter-spacing:.08em; text-transform:uppercase; padding:.45rem 1rem; background:transparent; color:var(--black); border:3px solid var(--black); border-radius:999px; cursor:pointer; }
.region-bar button[aria-pressed="true"], .region-bar button:hover { background:var(--black); color:var(--yellow); }
.airmail { padding:0; background:transparent; border:3px solid var(--black); box-shadow:0 8px 24px rgba(0,0,0,.18); }
.map-frame { position:relative; background:var(--cream); padding:0; }
#map { width:100%; height:clamp(420px,72vh,680px); background:var(--sky); border:0; }
.map-fallback { position:absolute; inset:0; display:flex; align-items:center; justify-content:center; text-align:center; padding:2rem; background:var(--cream); border:3px solid var(--black); font-weight:500; }
.map-fallback[hidden] { display:none; }
.map-note { text-align:center; font-size:.85rem; color:var(--gray); margin-top:.9rem; max-width:700px; margin-left:auto; margin-right:auto; }

/* Pins (DOM markers). Every pin is the "read me." mug, circle-cropped from our own photo (atlas/mug3d-pin.png).
   Never transform .pin itself (MapLibre positions markers with transform); animate the inner .mug instead. */
.pin { width:44px; height:44px; padding:0; border:0; background:none; cursor:pointer; display:block; border-radius:50%; }
.pin .mug { display:block; width:100%; height:100%; object-fit:contain; filter:drop-shadow(0 3px 3px rgba(0,0,0,.5)); pointer-events:none; }
.pin.area::after { content:""; position:absolute; inset:-9px; border-radius:50%; border:2px dashed var(--ink); pointer-events:none; }
.pin .n { position:absolute; top:-8px; right:-9px; min-width:19px; height:19px; padding:0 4px; border-radius:999px; background:var(--red); color:#fff; border:2px solid var(--ink); font:600 .68rem/15px 'IBM Plex Mono',monospace; text-align:center; z-index:1; }
.pin:hover .mug, .pin:focus-visible .mug, .pin.on .mug { filter:drop-shadow(0 0 0 var(--red)) drop-shadow(0 0 3px var(--red)) drop-shadow(0 0 3px var(--red)); }
.pin:focus-visible { outline:3px solid var(--ink); outline-offset:6px; }
.pin .rnum { display:none; }
@media (prefers-reduced-motion:no-preference) { .pin .mug { transition:transform .15s ease; } .pin:hover .mug, .pin:focus-visible .mug { transform:scale(1.18); } }

/* Place search */
.place-search { max-width:760px; margin:0 auto 1rem; text-align:center; }
.ps-label { display:block; font-family:'Oswald',sans-serif; font-size:1.5rem; font-weight:700; text-transform:uppercase; letter-spacing:.05em; margin-bottom:.4rem; }
.ps-row { display:flex; gap:.5rem; align-items:stretch; }
.ps-box { position:relative; flex:1; min-width:0; text-align:left; }
.ps-box input { width:100%; font:inherit; font-size:1rem; padding:.7rem .9rem; background:#fffaf0; color:var(--black); border:3px solid var(--black); border-radius:8px; }
.ps-box input::placeholder { color:#6b6250; }
.ps-go { font:inherit; font-size:.9rem; font-weight:600; letter-spacing:.08em; text-transform:uppercase; padding:.6rem 1.1rem; background:var(--black); color:var(--yellow); border:3px solid var(--black); border-radius:8px; cursor:pointer; }
.ps-go:hover, .ps-go:focus-visible { background:var(--red); border-color:var(--red); color:#fff; }
.ps-sug { position:absolute; left:0; right:0; top:calc(100% + 4px); z-index:20; list-style:none; background:#fffaf0; border:3px solid var(--black); border-radius:8px; box-shadow:5px 5px 0 rgba(0,0,0,.85); max-height:260px; overflow:auto; }
.ps-sug[hidden] { display:none; }
.ps-sug li { padding:.55rem .8rem; font-size:.9rem; line-height:1.3; cursor:pointer; border-bottom:1px solid rgba(0,0,0,.15); }
.ps-sug li:last-child { border-bottom:0; }
.ps-sug li small { display:block; font-size:.72rem; color:var(--gray); }
.ps-sug li[aria-selected="true"], .ps-sug li:hover { background:var(--black); color:var(--yellow); }
.ps-sug li[aria-selected="true"] small, .ps-sug li:hover small { color:var(--cream); }
.ps-status { min-height:1.4em; font-size:.82rem; margin-top:.4rem; color:var(--gray); }
.search-results { max-width:1000px; margin:0 auto 1.2rem; padding:1rem 1.1rem 1.1rem; background:var(--cream); border:3px solid var(--black); border-radius:8px; box-shadow:6px 6px 0 rgba(0,0,0,.85); text-align:left; }
.search-results[hidden] { display:none; }
.sr-head { display:flex; align-items:center; justify-content:space-between; gap:.8rem; margin-bottom:.7rem; flex-wrap:wrap; }
.sr-head h2 { font-size:clamp(1.3rem,4vw,1.8rem); text-transform:uppercase; letter-spacing:.03em; }
.sr-head h2:focus { outline:none; }
.sr-clear { font:inherit; font-size:.74rem; font-weight:600; letter-spacing:.08em; text-transform:uppercase; padding:.4rem .8rem; background:transparent; color:var(--black); border:2px solid var(--black); border-radius:5px; cursor:pointer; }
.sr-clear:hover, .sr-clear:focus-visible { background:var(--black); color:var(--yellow); }
.sr-list { list-style:none; display:grid; grid-template-columns:repeat(auto-fill,minmax(290px,1fr)); gap:.8rem; }
.sr-card { display:grid; grid-template-columns:72px 1fr; gap:.7rem; padding:.7rem; background:#fffaf0; border:2px solid var(--black); border-radius:6px; }
.sr-card img { width:72px; aspect-ratio:2/3; object-fit:contain; background:#fff; border:2px solid var(--black); }
.sr-where { font-size:.66rem; letter-spacing:.12em; text-transform:uppercase; color:var(--gray); }
.sr-title { font-family:'Oswald',sans-serif; font-size:1.1rem; font-weight:700; line-height:1.15; }
.sr-author { font-size:.78rem; margin-bottom:.3rem; }
.sr-set { font-size:.72rem; line-height:1.4; }
.sr-actions { display:flex; flex-wrap:wrap; gap:.4rem; margin-top:.5rem; }
.sr-actions a, .sr-actions button { font:inherit; font-size:.7rem; font-weight:600; letter-spacing:.06em; text-transform:uppercase; text-decoration:none; padding:.38rem .6rem; border-radius:4px; border:2px solid var(--black); line-height:1.2; cursor:pointer; background:transparent; color:var(--black); }
.sr-actions a.buy { background:var(--black); color:var(--yellow); }
.sr-actions a.buy:hover, .sr-actions a.buy:focus-visible { background:var(--red); border-color:var(--red); color:#fff; }
.sr-actions a.alt { background:var(--yellow); }
.sr-actions a.alt:hover, .sr-actions button:hover, .sr-actions a.alt:focus-visible, .sr-actions button:focus-visible { background:#fff; }
.sr-page { display:inline-block; margin-top:.45rem; font-size:.72rem; font-weight:600; text-decoration:underline; text-underline-offset:3px; }
.sr-empty { font-size:1rem; }
.sr-empty a { font-weight:600; }
.sr-more { font-size:.78rem; margin-top:.8rem; }
@media (max-width:480px) { .ps-label { font-size:1.3rem; } .ps-go { padding:.6rem .8rem; } }

/* Search mode on the map: matching pins pop in (mug drops onto the place), the rest recede, the searched place gets a big mug */
.pin.faded .mug { opacity:.4; filter:grayscale(.6); }
.pin.hit .mug { filter:drop-shadow(0 0 2px var(--red)) drop-shadow(0 0 5px var(--red)) drop-shadow(0 3px 3px rgba(0,0,0,.5)); }
@keyframes mugdrop { 0% { transform:translateY(-44px) scale(.3); opacity:0; } 55% { transform:translateY(5px) scale(1.12); opacity:1; } 78% { transform:translateY(-3px) scale(.96); } 100% { transform:none; opacity:1; } }
@media (prefers-reduced-motion:no-preference) { .pin.pop .mug { animation:mugdrop .62s cubic-bezier(.3,.7,.4,1) both; animation-delay:var(--d,0s); } .yah .mug { animation:mugdrop .7s cubic-bezier(.3,.7,.4,1) both; } .yah::before { animation:yahpulse 2.4s ease-out 1s 2; } }
@keyframes yahpulse { 0% { transform:scale(.7); opacity:.7; } 100% { transform:scale(1.9); opacity:0; } }
.yah-wrap { width:58px; height:58px; pointer-events:none; }
.yah { position:relative; width:100%; height:100%; }
.yah::before { content:""; position:absolute; inset:0; border-radius:50%; border:3px solid var(--red); opacity:0; }
.yah .mug { display:block; width:100%; height:100%; object-fit:contain; filter:drop-shadow(0 0 2px var(--red)) drop-shadow(0 0 4px var(--red)) drop-shadow(0 5px 6px rgba(0,0,0,.45)); }
.yah .tag { position:absolute; left:50%; top:calc(100% + 5px); transform:translateX(-50%); white-space:nowrap; background:var(--ink); color:var(--yellow); font:600 .62rem/1 'IBM Plex Mono',monospace; letter-spacing:.12em; text-transform:uppercase; padding:.3rem .5rem; border-radius:4px; }
.yah-wrap { z-index:4; }

/* Popup */
.maplibregl-popup { z-index:5; }
.maplibregl-popup-content { padding:0; border:3px solid var(--black); border-radius:6px; background:var(--cream); box-shadow:6px 6px 0 rgba(0,0,0,.85); font-family:'IBM Plex Mono',monospace; color:var(--black); width:min(340px,calc(var(--map-w,100vw) - 40px)); }
.maplibregl-popup-close-button { font-size:1.5rem; width:34px; height:34px; color:var(--black); z-index:3; }
.maplibregl-popup-close-button:hover { background:transparent; color:var(--red); }
.maplibregl-popup-tip { display:none; }
.pp-head { background:var(--black); color:var(--yellow); padding:.5rem 2.4rem .5rem .8rem; font-family:'Oswald',sans-serif; font-size:1.05rem; letter-spacing:.06em; text-transform:uppercase; }
.pp-head small { display:block; font-family:'IBM Plex Mono',monospace; font-size:.64rem; letter-spacing:.14em; color:var(--cream); opacity:.85; }
.pp-body { max-height:min(330px,calc(var(--map-h,560px) - 110px)); overflow:auto; }
.pp-book { display:grid; grid-template-columns:72px 1fr; gap:.7rem; padding:.8rem; border-bottom:2px dashed rgba(0,0,0,.4); }
.pp-book:last-child { border-bottom:0; }
.pp-book img { width:72px; aspect-ratio:2/3; object-fit:cover; border:2px solid var(--black); background:#fff; box-shadow:0 3px 8px rgba(0,0,0,.25); }
.pp-title { font-family:'Oswald',sans-serif; font-size:1.12rem; font-weight:700; line-height:1.15; }
.pp-author { font-size:.78rem; margin-bottom:.35rem; }
.pp-set { font-size:.74rem; line-height:1.4; }
.pp-set b { font-weight:600; }
.partner-tag { display:inline-block; font-size:.68rem; letter-spacing:.08em; text-transform:uppercase; border:1.5px solid currentColor; border-radius:4px; padding:.05rem .35rem; margin-top:.3rem; }
.pp-note { font-size:.72rem; color:var(--gray); margin-top:.25rem; line-height:1.4; }
.pp-actions { display:flex; flex-wrap:wrap; gap:.4rem; margin-top:.55rem; }
.pp-actions a { font-size:.7rem; font-weight:600; letter-spacing:.06em; text-transform:uppercase; text-decoration:none; padding:.38rem .6rem; border-radius:4px; border:2px solid var(--black); line-height:1.2; }
.pp-actions a.buy { background:var(--black); color:var(--yellow); }
.pp-actions a.buy:hover, .pp-actions a.buy:focus-visible { background:var(--red); color:#fff; }
.pp-actions a.alt { background:var(--yellow); color:var(--black); }
.pp-actions a.alt:hover, .pp-actions a.alt:focus-visible { background:#fff; }
.pp-page { display:inline-block; margin-top:.5rem; font-size:.72rem; font-weight:600; text-decoration:underline; text-underline-offset:3px; }
.maplibregl-ctrl-attrib { font-family:'IBM Plex Mono',monospace; font-size:10px; }

/* Pin list */
.pin-list { max-width:1000px; margin:0 auto 3rem; text-align:center; }
.pin-list h2 { font-size:clamp(2rem,5vw,3rem); margin-bottom:1rem; }
.pins-ul { list-style:none; display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:1rem; text-align:left; }
.pins-ul li { border:3px solid var(--black); border-radius:8px; background:rgba(255,255,255,.08); padding:.9rem 1rem; display:flex; flex-direction:column; gap:.2rem; }
.pins-ul .pl-place { font-family:'Oswald',sans-serif; font-weight:700; font-size:1.15rem; text-transform:uppercase; letter-spacing:.04em; }
.pins-ul .pl-book { font-size:.88rem; line-height:1.35; }
.pins-ul .pl-book a { font-weight:600; }
.pins-ul .pl-show { align-self:flex-start; margin-top:.5rem; font:inherit; font-size:.76rem; font-weight:600; letter-spacing:.08em; text-transform:uppercase; padding:.4rem .8rem; background:var(--black); color:var(--yellow); border:0; border-radius:5px; cursor:pointer; }
.pins-ul .pl-show:hover { background:var(--red); color:#fff; }

/* Claim postcard */
.claim { max-width:900px; margin:0 auto; }
.postcard { display:grid; grid-template-columns:1.25fr 1fr; background:var(--cream); border:3px solid var(--black); border-radius:6px; box-shadow:8px 8px 0 rgba(0,0,0,.85); position:relative; }
.postcard::before { content:""; position:absolute; inset:7px; border:1px solid var(--black); pointer-events:none; }
.pc-msg { padding:1.8rem 1.6rem; border-right:2px solid var(--black); }
.pc-msg h2 { font-size:clamp(2.2rem,6vw,3.2rem); text-transform:uppercase; margin:.3rem 0 .7rem; color:var(--red); font-style:italic; letter-spacing:-.01em; }
.pc-msg p { font-size:.95rem; }
.btn { display:inline-block; padding:.7rem 1.4rem; background:var(--black); color:var(--yellow); font-weight:600; border-radius:6px; text-decoration:none; margin-top:1.1rem; letter-spacing:.06em; text-transform:uppercase; font-size:.95rem; }
.btn:hover, .btn:focus-visible { background:var(--ink); color:#fff; }
.soon { margin-top:.6rem; font-size:.78rem !important; color:var(--gray); font-style:italic; }
.pc-addr { padding:1.8rem 1.4rem; display:flex; flex-direction:column; gap:1.1rem; position:relative; }
.pc-stamp { align-self:flex-end; width:64px; height:76px; border:3px dotted var(--black); display:flex; align-items:center; justify-content:center; text-align:center; font-size:.55rem; letter-spacing:.1em; text-transform:uppercase; line-height:1.25; margin-bottom:.4rem; }
.pc-addr .line { border-bottom:2px solid var(--black); padding-bottom:.15rem; font-size:.85rem; color:var(--gray); }
@media (max-width:640px) { .postcard { grid-template-columns:1fr; } .pc-msg { border-right:0; border-bottom:2px solid var(--black); } .pc-addr { padding-top:1.2rem; } .pc-stamp { position:absolute; top:1rem; right:1.2rem; margin:0; } .pc-addr .line:first-of-type { margin-top:2.6rem; } }

footer { text-align:center; padding:3rem 1.5rem 3rem; background:rgba(0,0,0,.03); border-top:4px solid var(--black); }
footer .fine { font-size:.82rem; color:var(--gray); margin-top:.7rem; max-width:760px; margin-left:auto; margin-right:auto; }
footer a { color:var(--black); }

.only-sm { display:none; }
@media (max-width:600px) { .only-sm { display:inline; } }

/* ---------- Gothic October route (moody accent: oxblood + night ink on the same marigold/cream/black base) ---------- */
:root { --blood:#4a0f22; --night:#1c1420; }
.route-chip { background:var(--night) !important; color:var(--cream) !important; border-color:var(--night) !important; display:inline-flex; align-items:center; gap:.5rem; }
.region-bar button.route-chip[aria-pressed="true"], .region-bar button.route-chip:hover { background:var(--blood) !important; border-color:var(--blood) !important; color:var(--yellow) !important; }
.route-chip .new { font-size:.6rem; letter-spacing:.12em; background:var(--yellow); color:var(--black); padding:.05rem .35rem; border-radius:3px; }
.route-banner { max-width:760px; margin:0 auto 1.2rem; padding:1rem 1.2rem 1.1rem; text-align:center; background:var(--night); color:var(--cream); border:3px solid var(--black); border-radius:6px; box-shadow:6px 6px 0 var(--blood); }
.route-banner[hidden], .route-list[hidden] { display:none; }
.rb-eyebrow { font-size:.7rem; letter-spacing:.2em; text-transform:uppercase; color:var(--yellow); opacity:.9; }
.route-banner h3 { font-family:'Oswald',sans-serif; font-size:clamp(1.9rem,6vw,2.7rem); line-height:1.05; text-transform:uppercase; color:var(--yellow); letter-spacing:.03em; margin:.2rem 0 .35rem; }
.rb-blurb { font-size:.92rem; margin-bottom:.7rem; }
.rb-actions { display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:.4rem .9rem; }
.rb-copy { font:inherit; font-size:.74rem; font-weight:600; letter-spacing:.08em; text-transform:uppercase; padding:.4rem .8rem; background:var(--yellow); color:var(--black); border:2px solid var(--yellow); border-radius:5px; cursor:pointer; }
.rb-copy:hover, .rb-copy:focus-visible { background:transparent; color:var(--yellow); }
.route-banner :focus-visible { outline-color:var(--yellow); }
.rb-status { font-size:.72rem; color:var(--cream); word-break:break-all; }
.rb-status:empty { display:none; }

/* Award routes (National Book Awards, Booker): black and marigold, no map tint */
.region-bar button.route-chip.award { background:var(--black) !important; color:var(--yellow) !important; border-color:var(--black) !important; }
.region-bar button.route-chip.award[aria-pressed="true"], .region-bar button.route-chip.award:hover { background:var(--yellow) !important; color:var(--black) !important; border-color:var(--black) !important; }
.route-banner.award { background:var(--black); box-shadow:6px 6px 0 var(--cream); }
.route-list.award { background:var(--black); box-shadow:6px 6px 0 var(--cream); }

/* moody map: tint the tiles only, markers and popups stay crisp */
#map .maplibregl-canvas { transition:filter .6s ease; }
#map.moody .maplibregl-canvas { filter:sepia(.3) saturate(.7) brightness(.84) contrast(1.06); }

.airmail.moody { border-color:var(--night); box-shadow:0 8px 24px rgba(28,20,32,.4); }
@media (prefers-reduced-motion:reduce) { #map .maplibregl-canvas, .airmail { transition:none; } }

.pin.dim { opacity:.3; filter:grayscale(.7); }
.pin.route { width:42px; height:42px; }
.pin.route .mug { filter:drop-shadow(0 0 2px var(--night)) drop-shadow(0 4px 4px rgba(0,0,0,.6)); }
.pin.route .rnum { display:flex; position:absolute; left:-9px; bottom:-8px; width:22px; height:22px; border-radius:50%; background:var(--night); color:var(--yellow); border:2px solid var(--yellow); align-items:center; justify-content:center; font:700 .8rem/1 'Oswald',sans-serif; z-index:1; pointer-events:none; }
.pin.route:hover .mug, .pin.route:focus-visible .mug, .pin.route.on .mug { filter:drop-shadow(0 0 2px var(--blood)) drop-shadow(0 0 4px var(--blood)); }
.pin.route.area::after { inset:-10px; border-color:var(--night); }
.pin.route .n { top:-10px; right:-11px; }

.pp-stop { color:var(--yellow) !important; opacity:1 !important; }
.pp-route { display:flex; justify-content:space-between; gap:.5rem; padding:.5rem .7rem; background:var(--night); border-top:3px solid var(--black); }
.pp-step { font:inherit; font-size:.7rem; font-weight:600; letter-spacing:.08em; text-transform:uppercase; padding:.35rem .6rem; background:transparent; color:var(--yellow); border:2px solid var(--yellow); border-radius:4px; cursor:pointer; }
.pp-step:hover:not(:disabled), .pp-step:focus-visible { background:var(--yellow); color:var(--black); }
.pp-step:disabled { opacity:.45; cursor:default; }
.pp-step:focus-visible { outline:3px solid var(--cream); outline-offset:2px; }

.route-list { max-width:900px; margin:1.6rem auto 0; padding:1.2rem 1.2rem 1rem; background:var(--night); color:var(--cream); border:3px solid var(--black); border-radius:6px; box-shadow:6px 6px 0 var(--blood); }
.route-list h3 { font-family:'Oswald',sans-serif; text-transform:uppercase; letter-spacing:.06em; color:var(--yellow); font-size:1.5rem; text-align:center; margin-bottom:.8rem; }
.route-ol { list-style:none; display:grid; grid-template-columns:repeat(auto-fill,minmax(250px,1fr)); gap:.8rem 1rem; }
.route-ol li { display:flex; gap:.75rem; align-items:flex-start; }
.route-ol .rn { flex:none; width:34px; height:34px; border-radius:50%; border:3px solid var(--yellow); display:flex; align-items:center; justify-content:center; font:700 1rem/1 'Oswald',sans-serif; color:var(--yellow); }
.route-ol .rp { font-family:'Oswald',sans-serif; text-transform:uppercase; letter-spacing:.04em; color:var(--yellow); line-height:1.2; }
.route-ol .rt { font-size:.82rem; line-height:1.35; }
.route-ol .pl-show { background:var(--yellow); color:var(--black); margin-top:.4rem; }
.route-ol .pl-show:hover { background:var(--cream); color:var(--black); }
.route-list :focus-visible { outline-color:var(--yellow); }
.rl-note { font-size:.74rem; text-align:center; margin-top:1rem; opacity:.85; }
@media (max-width:480px) { .route-chip { font-size:.8rem; } }

.subline { font-family:'Oswald',sans-serif; font-weight:500; text-transform:uppercase; letter-spacing:.22em; font-size:clamp(1rem,3.4vw,1.35rem); margin:-.2rem 0 1rem; }

@media (max-width:600px) { .pp-body { max-height:min(260px,calc(var(--map-h,560px) - 230px)); } .pp-head small { letter-spacing:.04em; font-size:.6rem; } .pp-head { font-size:.98rem; } .pin.route { width:38px; height:38px; } .pin { width:36px; height:36px; } .yah-wrap { width:50px; height:50px; } }

.claim-alt { font-size:.85rem; }
.claim-alt-link { background:none; border:0; padding:0; font:inherit; color:inherit; text-decoration:underline; cursor:pointer; }
.pins-ul .pl-place a { color:inherit; text-decoration-thickness:2px; }
.pins-all { margin-top:1.4rem; }
.pins-pill { display:inline-block; font-size:.85rem; font-weight:600; letter-spacing:.08em; text-transform:uppercase; white-space:nowrap; padding:.6rem 1.3rem; background:var(--black); color:var(--yellow) !important; border:3px solid var(--black); border-radius:999px; text-decoration:none; }
.pins-pill:hover, .pins-pill:focus-visible { background:var(--yellow); color:var(--black) !important; }
.pins-short-note { margin:0 0 .9rem; font-size:.72rem; }
