/* Overnight round 13 (Oct 14, 2026 ~5:25 AM CT): town pages, service area, refer, about, 404, quest, Arcade + games.
   Loaded last (end of footer partial, after r12.css). Revert all = remove the r13.css link in src/partials/footer.html and rebuild.
   Each block is tagged with its SITE-CHANGES.md number. */

/* #335 FAQ questions no longer run under the "+" marker (r11 padding had dropped the right gutter) */
details.px-box > summary,.faq details > summary{padding-right:2.75rem}

/* #338 / #376 Town pages: Text + email line stands out */
.city-contact a{font-weight:700}

/* #340 Town pages: quick-links row (was an inline style) */
.city-quicklinks{margin-top:1.25rem;font-size:1.15rem;line-height:1.6}
.city-quicklinks a{display:inline-flex;align-items:center;min-height:44px}

/* #341 Refer: "Get your link" box (was inline styles) */
.ref-box{padding:1.75rem}
.ref-h2{font-size:1.1rem;line-height:1.5}
.ref-rewards{margin-top:1.5rem}
@media (max-width:420px){.ref-box{padding:1.15rem}}

/* #343 Refer: step numbers in gold, easier to follow */
.ref-steps li::marker{color:var(--gold,#ffd23f);font-weight:700}
.ref-steps li{padding-left:.25rem}

/* #344 About: photo + "What to expect" row spacing (was an inline style) */
.about-expect{margin-top:1.5rem}

/* #345 About: signature line under the story */
.about-sig{font-weight:700;color:var(--gold,#ffd23f);font-size:1.1rem;line-height:1.5;margin-top:1rem}

/* #349 Service area: St. Paul row (was an inline style); button on its own line on phones */
.sa-stp-row{margin-top:1.5rem;line-height:1.7}
.sa-stp-row .btn{margin:.35rem .5rem .35rem 0}
@media (max-width:420px){.sa-stp-row .btn{display:flex;width:100%;justify-content:center;margin:.6rem 0}}

/* #350 Game win headings are now h2 (correct heading order) with the same look as before */
.tip-box h2.win-h{background:none!important;-webkit-text-fill-color:#ffd23f!important;color:#ffd23f!important;font-family:"Press Start 2P",monospace;font-size:1rem!important;line-height:1.5;text-shadow:2px 2px 0 #c0187a!important;margin:0 0 .6rem;filter:none}

/* #355 Text links: the phone number never splits across two lines */
main a[href^="sms:"],footer a[href^="sms:"],.askq a[href^="sms:"]{white-space:nowrap}

/* #356 Email links wrap safely on 360px phones instead of pushing the page sideways */
main a[href^="mailto:"]{overflow-wrap:anywhere}

/* #357 Arcade: play buttons full width on phones */
@media (max-width:420px){.cabinet .btn{align-self:stretch;justify-content:center;width:100%}}

/* #358 Games: Easy / Normal buttons equal width on phones */
@media (max-width:420px){.mode .btn{width:100%;justify-content:center;min-height:52px}}

/* #359 Games: score bar a little larger */
.hud{font-size:1rem}

/* #360 Games: keyboard keys look like little retro keycaps */
kbd{border:2px solid #3cbcfc;border-bottom-width:4px;border-radius:3px;padding:.05rem .45rem;background:#1d2350;color:#fff;font-weight:700}

/* #361 Games: win box gold frame + bigger Play again */
.tip-box#win{border-color:var(--gold,#ffd23f)}
.tip-box#win .btn{min-height:52px}

/* #362 Service area: town card buttons full width on phones */
@media (max-width:420px){.city-cards .btn{display:flex;width:100%;justify-content:center}}

/* #363 Area checker answer box clearer */
.ac-result .ac-box{font-size:1.15rem;line-height:1.55;border-left:6px solid var(--gold,#ffd23f)}

/* #364 Open FAQ answer gets a gold edge so it's clear which one is open */
details.px-box[open]{border-left-color:var(--gold,#ffd23f);border-left-width:6px}

/* #365 Open FAQ answer fades in softly (only when motion is on) */
@keyframes r13-fade{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:no-preference){
  html:not(.calm) details.px-box[open] > summary + *{animation:r13-fade .22s ease-out}
}

/* #366 "Text 763-329-5464" hint links in bold */
.hint a[href^="sms:"],.acct-nudge + .hint a[href^="sms:"],.game-text-hint a[href^="sms:"]{font-weight:700}

/* #367 High contrast: difficulty badges and reward chips outlined */
html.hc .diff,html.hc .tierchip,html.hc .mg-diff{outline:2px solid #fff;outline-offset:1px}

/* #368 Print: skip the ZIP checker, nearby-town links and game boards */
@media print{.area-check,.nearby,.cc-field,.mode,.hud,.td-phone,.pp-btns{display:none!important}}

/* #369 About: story keeps a comfortable line length on wide screens */
@media (min-width:900px){.about-grid .quote{max-width:38em}}

/* #370 Refer: reward chips line up with their text */
.ref-rewards .tierchip{display:inline-block;vertical-align:middle;margin-right:.35rem}

/* #371 Refer: both columns start at the top on desktop */
@media (min-width:700px){#ref-members{align-self:start}}

/* #372 404: headline fits 360px phones without awkward breaks */
@media (max-width:420px){.nf h1{font-size:clamp(1.5rem,8vw,2rem);line-height:1.25}}

/* #373 404: popular links spaced out + clear focus ring */
.nf-links{gap:.5rem 1.6rem}
.nf-links a:focus-visible{outline:3px solid #ff3fb4;outline-offset:3px}

/* #374 Games: "Keep playing" cards spaced on phones */
@media (max-width:420px){.mg-grid{gap:.85rem}}

/* #375 Games: "Keep playing" cards show a clear focus ring */
.mg-card:focus-visible{outline:3px solid #ff3fb4;outline-offset:3px}

/* #377 Town + service pages: account line spacing matches other pages */
.nearby ~ .acct-nudge,.checks.trust + .actions + .acct-nudge{margin-top:1.25rem}

/* #378 Desktop: Text / email links get a gold underline on hover */
@media (hover:hover){main a[href^="sms:"]:not(.btn):hover,main a[href^="mailto:"]:not(.btn):hover{text-decoration-color:var(--gold,#ffd23f)}}

/* #379 Phones: softer tap flash on buttons and links */
a,button,summary{-webkit-tap-highlight-color:rgba(255,210,63,.25)}

/* #380 Page-head crumb links (Service area, Arcade, Sessions, Contact): gold on hover/focus */
.page-head .label a:hover,.page-head .label a:focus-visible{color:var(--gold,#ffd23f)}
.page-head .label a:focus-visible{outline:3px solid #ff3fb4;outline-offset:3px}