/* ---------- APP FEEL: touch + motion polish, applied site-wide ---------- */

html {
    -webkit-text-size-adjust: 100%;
    overscroll-behavior-y: none;
}

body {
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-y: none;
}

* {
    -webkit-tap-highlight-color: transparent;
}

a, button, .nav-item, .filter-btn, .tab-btn, input[type="submit"], input[type="button"] {
    touch-action: manipulation;
}

/* Bigger, thumb-friendly tap targets on touch devices */
@media (pointer: coarse) {
    button,
    a.btn,
    .btn,
    .hero-rush-btn,
    .enter-btn,
    .submit-btn,
    .rush-submit,
    .site-login-btn,
    .site-authed-links a,
    .nav-item,
    .tab-btn,
    .filter-btn,
    .icon-btn {
        min-height: 44px;
    }
}

/* Tactile press feedback: buttons and nav controls dip slightly on tap */
a, button, .nav-item, .tab-btn, .filter-btn, .icon-btn {
    transition: transform 0.15s cubic-bezier(0.4, 0, 0.2, 1);
}
a:active, button:active, .nav-item:active, .tab-btn:active, .filter-btn:active, .icon-btn:active {
    transform: scale(0.96);
}

/* Safe-area padding for notches / home indicators (requires viewport-fit=cover).
   Deliberately NOT applied to fixed-height headers: adding padding-top there
   would shrink their content box and cramp/clip the logo and nav. */
footer {
    padding-bottom: calc(env(safe-area-inset-bottom) + 20px);
}
body {
    padding-left: env(safe-area-inset-left);
    padding-right: env(safe-area-inset-right);
}

/* ---------- UNIVERSAL CASCADE-IN (see assets/js/app-motion.js) ---------- */
.app-cascade {
    opacity: 0;
    transform: translateY(22px);
    transition: opacity 0.55s cubic-bezier(0.22, 1, 0.36, 1), transform 0.55s cubic-bezier(0.22, 1, 0.36, 1);
}
.app-cascade-in {
    opacity: 1;
    transform: translateY(0);
}
@media (prefers-reduced-motion: reduce) {
    .app-cascade {
        opacity: 1;
        transform: none;
        transition: none;
    }
}