@view-transition { navigation: auto; }

::view-transition-old(root) { animation: app-view-out .16s ease both; }
::view-transition-new(root) { animation: app-view-in .22s cubic-bezier(.22,1,.36,1) both; }

@keyframes app-view-out { to { opacity:.35;transform:translateY(-4px) scale(.995); } }
@keyframes app-view-in { from { opacity:0;transform:translateY(7px) scale(.995); } }

.site-header { view-transition-name: app-header; }
.mobile-bottom-nav { view-transition-name: app-bottom-nav; }

.app-route-progress {
	position:fixed;
	z-index:50000;
	top:0;
	right:0;
	width:0;
	height:3px;
	border-radius:0 0 0 99px;
	background:linear-gradient(90deg,#b86d1d,#efb35b);
	opacity:0;
	pointer-events:none;
	box-shadow:0 2px 12px rgba(203,130,35,.35);
	transition:opacity .12s;
}

.app-route-pending .app-route-progress { width:78%;opacity:1;animation:app-route-progress 1.1s cubic-bezier(.2,.75,.3,1) infinite; }
@keyframes app-route-progress { 0%{transform:translateX(115%);width:20%}55%{width:72%}100%{transform:translateX(-145%);width:25%} }

@media(max-width:640px) {
	html { overscroll-behavior-y:contain;-webkit-tap-highlight-color:transparent; }
	body { min-height:100svh; }
	:is(.mobile-app,.account-app,.reminders-app,.vehicle-editor-app,.vehicles-app,.repairs-app,.repair-editor-app,.profile-editor-app,.inquiries-app,.club-app) { min-height:calc(100svh - env(safe-area-inset-top)); }
	:is(a,button,[role="button"],input,select,textarea) { touch-action:manipulation; }
	:is(a,button,[role="button"]).is-pressed { transform:scale(.97)!important;filter:brightness(.96);transition-duration:.08s!important; }
	:is(.home-intro-card,.home-main-services__grid>a,.home-financial-services__grid>a,.profile-insight-card,.reminder-list-card,.vehicle-list-card,.inquiries-grid>button) { will-change:transform; }
}

@media(prefers-reduced-motion:reduce) {
	::view-transition-old(root),::view-transition-new(root),.app-route-pending .app-route-progress { animation-duration:.01ms!important;animation-iteration-count:1!important; }
}
