/* Solution finder on phones: compact, app-like screens */
@media (max-width: 639px) {
    /* Wizard */
    html body #finder-screen-wizard > div:first-child { padding-top: 1rem; padding-bottom: 4.75rem; }
    html body #finder-screen-wizard > div:first-child h1 { margin-top: .5rem; font-size: 1.5rem !important; line-height: 1.2 !important; }
    html body #finder-screen-wizard > div:first-child p { display: none; }
    html body #finder-screen-wizard > div:nth-child(2) > div:first-child { border-radius: 1.25rem; }
    html body #finder-stepper button { justify-content: center; padding: .625rem .25rem; }
    html body #finder-wizard { padding: 1rem; }
    html body #finder-question { margin-top: .25rem; font-size: 1.2rem !important; line-height: 1.3 !important; }
    html body #finder-hint { margin-top: .25rem; font-size: .8rem; }
    html body #finder-options { margin-top: 1rem; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .625rem; }
    html body #finder-options > button { padding: .875rem .5rem; border-width: 1.5px; border-radius: 1rem; -webkit-tap-highlight-color: transparent; }
    html body #finder-options > button:active { transform: scale(.97); }
    html body #finder-options > button:last-child:nth-child(odd) { grid-column: span 2; }
    html body #finder-options > button > span[class*="h-16"] { width: 2.75rem; height: 2.75rem; border-radius: .875rem; }
    html body #finder-options > button > span.mt-4 { margin-top: .5rem; font-size: .8125rem; line-height: 1.25; }
    html body #finder-options > button > span.mt-1 { font-size: .6875rem; }

    /* Results */
    html body #finder-screen-results > div:first-child > div { gap: .75rem; padding-top: .875rem; padding-bottom: .875rem; }
    html body #finder-results-title { font-size: 1.25rem !important; line-height: 1.25 !important; }
    html body #finder-summary { flex-wrap: nowrap; margin-right: -1rem; padding-right: 1rem; overflow-x: auto; scrollbar-width: none; }
    html body #finder-summary::-webkit-scrollbar { display: none; }
    html body #finder-summary > * { flex: none; }
    html body #finder-copy, html body #finder-restart { flex: 1; justify-content: center; }
    html body #finder-screen-results > div:nth-child(2) { gap: 1rem; padding-top: 1rem; padding-bottom: 5.5rem; }
    html body #finder-panel > summary { padding: .875rem 1rem; }
    html body #finder-best article > a { height: 11rem; padding: 1rem; }
    html body #finder-best article > div { padding: 1rem; }
    html body #kafkas-finder #finder-best h2 { font-size: 1.1rem !important; }
    html body #finder-list { margin-top: .75rem; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .625rem; }
    html body #finder-list article > a { height: 7.5rem; padding: .625rem; }
    html body #finder-list article > a > span { top: .375rem; right: .375rem; padding: .125rem .4rem; font-size: .625rem; }
    html body #finder-list article > div { padding: .75rem; }
    html body #finder-list article > div > p:first-child { font-size: .625rem; }
    html body #finder-list article ul { display: none; }
    html body #kafkas-finder #finder-list h3 { font-size: .8rem !important; }
    html body #finder-list article .grid-cols-2 { grid-template-columns: minmax(0, 1fr); gap: .375rem; }

    /* The floating buttons would cover the choices; results get one fixed action above the tab bar */
    html body #finder-whatsapp-m { position: fixed; left: .75rem; right: .75rem; bottom: calc(5.25rem + env(safe-area-inset-bottom)); z-index: 37; margin: 0; border-radius: 1rem; box-shadow: 0 12px 30px -8px rgba(15, 23, 42, .4); }
    html body:has(#kafkas-finder) #webasto-floating-wrap { display: none !important; }
}