/* r21 Oct 15 overnight polish. Linked after r20.css. Palette, fonts, typing FX, galaxy, glow unchanged. No green. */

/* r21 #632 Retired r20 Senior mode prompt: if an old cached r20.js ever runs, its box stays hidden (senior-popup.js on home is the only prompt) */
.ka-sm{display:none!important}

/* r21 #633 Smoother hover easing now really applies to buttons and quest tiles (cartridge.css had a .12s !important that cancelled r20 #623). Press-down stays snappy. */
.btn,.quest-btn,.td-chip{transition:transform .18s cubic-bezier(.22,.8,.3,1),box-shadow .18s ease,background-color .18s ease,border-color .18s ease!important}
.btn:active,.quest-btn:active,.td-chip:active{transition-duration:.06s!important}

/* r21 #634 Motion OFF / reduce-motion: buttons, quest tiles, task cards and top-nav links don't lift on hover */
html.calm .btn:hover,html.calm .quest-btn:hover,html.calm .td-chip:hover,html.calm .task:hover,html.calm .levelnav a:hover,html.calm .card:hover,html.calm .v5-card:hover,html.calm .level:hover{transform:none!important}
@media (prefers-reduced-motion:reduce){.btn:hover,.quest-btn:hover,.td-chip:hover,.task:hover,.levelnav a:hover,.card:hover,.v5-card:hover,.level:hover{transform:none!important}}

/* r21 #635 Motion OFF / reduce-motion: "See more help topics" arrow flips instantly (no spin) */
html.calm .more-quests>summary::after{transition:none!important}
@media (prefers-reduced-motion:reduce){.more-quests>summary::after{transition:none!important}}

/* r21 #636 "See more help topics" box matches the other cartridge cards (14px corners, same panel, magenta drop shadow) */
.more-quests{border:2px solid var(--cart-line,#3d3a78)!important;border-radius:var(--cart-r,14px)!important;background:var(--cart-panel,rgba(21,26,61,.82))!important;box-shadow:5px 5px 0 var(--cart-sh,#ff3ea5),0 0 28px rgba(143,123,255,.14)!important;overflow:hidden}
.more-quests>summary{border-radius:calc(var(--cart-r,14px) - 2px)}

/* r21 #637 "See more help topics" bar: gold focus ring drawn inside the box when tabbed, soft gold glow on hover */
.more-quests>summary:focus-visible{outline:3px solid #ffd23f!important;outline-offset:-5px!important}
.more-quests>summary:hover{background:rgba(255,210,63,.07)}
.more-quests>summary:hover span{text-decoration:underline;text-underline-offset:.2em}

/* r21 #638 Opened "See more": thin dashed divider under the bar, tiles get a little room from it */
.more-quests[open]>summary{border-bottom:2px dashed var(--cart-line,#3d3a78);margin-bottom:1rem}

/* r21 #639 Phones: the "(small business, websites, quick tasks)" hint sits on its own line and reads at 16px */
@media (max-width:620px){.more-quests>summary small{flex-basis:100%;text-align:center;font-size:1rem;line-height:1.4}}

/* r21 #640 Headings break more evenly across lines (text-wrap: balance) */
main h2,main h3,.page-head h1{text-wrap:balance}

/* r21 #641 Jump links (e.g. "Choose your quest ↓", FAQ, #refer) land below the sticky top bars instead of under them */
main [id],main section{scroll-margin-top:6rem}

/* r21 #642 Home menu tile small print under titles: 12px -> 13.6px on phones (was the smallest plain text on the home page) */
ol.levels .level small,a.level small{font-size:.85rem!important;line-height:1.4}

/* r21 #645 Motion OFF: FAQ answers open with no drop-in animation and the arrow flips instantly (reduce-motion already did; the site's Motion OFF switch now matches) */
html.calm .faq details[open] p{animation:none!important}
html.calm .faq summary::after,html.calm details.px-box>summary::after{transition:none!important}

/* r21 #646 Links inside paragraphs: underline sits a bit lower and thicker, easier to spot for older eyes */
main p a:not(.btn),main li a:not(.btn),.assist a,.hint a{text-decoration-thickness:2px;text-underline-offset:.22em}

/* r21 #647 Highlighting text uses the brand gold on navy (was browser blue) */
::selection{background:#ffd23f;color:#0b1030}

/* r21 #648 Printing a page: no dock ship, popups, chat bubble or senior prompt on paper */
@media print{.ka-ship,.ka-shot,.ka-sm,.ka-spop,.ka-nudge,.ka-gate,.katr,.more-quests>summary::after{display:none!important}.more-quests{box-shadow:none!important;border-color:#999!important}}

/* r21 #649 Hero trust checklist on in-between widths (621-900px): columns shrink a little so long lines never squeeze */
@media (min-width:621px) and (max-width:900px){.v5-hero ul.checks.trust{grid-template-columns:repeat(2,minmax(13rem,1fr));gap:.6rem 1.6rem;max-width:44rem}}

/* r21 #650 Section titles on desktop: a touch more air under the small "Player 1 ·" eyebrow labels before the big heading */
@media (min-width:1100px){main .label+h2,main .eyebrow+h2{margin-top:.5rem}}

/* r21 #651 Service-area box finished state: town names wrap cleanly on small phones (no word split mid-town) */
.fx-serve .sv-towns b{white-space:nowrap}

/* r21 #652 Keyboard users: top-nav and bottom-dock items show the same 3px gold focus ring (dock had only the inset bar) */
.levelnav a:focus-visible,.fx-dock a:focus-visible,.fx-dock button:focus-visible{outline:3px solid #ffd23f!important;outline-offset:-3px!important;position:relative;z-index:2}

/* r21 #653 Senior popup (home): Motion OFF / reduce-motion means it appears with no fade or slide */
html.calm .ka-spop,html.calm .ka-spop .px-box{animation:none!important;transition:none!important}
@media (prefers-reduced-motion:reduce){.ka-spop,.ka-spop .px-box{animation:none!important;transition:none!important}}

/* r21 #654 Senior popup buttons: full 64px height and gold focus ring kept even with cartridge button styles */
.ka-spop .btn{min-height:64px!important}
.ka-spop .ka-sp-x{min-width:48px;min-height:48px}