/* Almer Smart Motion v4.3.38 - progressive enhancement; no layout shifts */
html[data-motion="1"] body :is(.card,.app-menu-grid a,.app-bottom-nav a,.btn,button):where(:not(.ui-tech-preloader *)){
  transition:transform 180ms ease,box-shadow 200ms ease,border-color 180ms ease,background-color 180ms ease;
}
@media (hover:hover) and (pointer:fine){
 html[data-motion="1"] body :is(.card,.app-menu-grid a):hover{transform:translateY(-2px)}
 html[data-motion="1"] body :is(button,.btn):not(:disabled):hover{transform:translateY(-1px)}
}
html[data-motion="1"] body :is(button,.btn,.app-bottom-nav a).almer-pressed{transform:scale(.985)}
html[data-motion="1"] body :is(button,.btn,.app-menu-grid a,.app-bottom-nav a):focus-visible{
 outline:3px solid color-mix(in srgb,var(--primary,#7756cd) 70%,white);outline-offset:3px;
}
/* Retain visibility and fixed hit targets: payment QR / form fields never move. */
html[data-motion="1"] body:has(.tripay-qr) .card:hover{transform:none}
.almer-mini-progress{height:3px;position:relative;background:color-mix(in srgb,var(--primary,#7756cd) 13%,transparent);border-radius:99px;overflow:hidden}
.almer-mini-progress>span{display:block;background:var(--primary,#7756cd);height:100%;width:35%;border-radius:99px;animation:almer-progress 1.2s ease-in-out infinite alternate}
@keyframes almer-progress{to{transform:translateX(185%)}}
@media (prefers-reduced-motion:reduce){
 html[data-motion] body :is(.card,button,.btn,.app-menu-grid a,.app-bottom-nav a){transition:none!important;animation:none!important;transform:none!important}
 .almer-mini-progress>span{animation:none!important;width:100%}
}
html[data-motion="0"] body :is(.card,button,.btn,.app-menu-grid a,.app-bottom-nav a){transition:none!important;animation:none!important}

/* Transaction status component: no auto-refresh or payment effects. */
.almer-transaction-timeline{margin-block:12px;gap:10px}
.almer-transaction-timeline h3{font-size:1rem;margin:0}
.almer-timeline{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));list-style:none;margin:8px 0;padding:0;gap:8px}
.almer-step{display:flex;min-width:0;flex-direction:column;align-items:center;text-align:center;gap:7px;font-size:clamp(.64rem,2.5vw,.85rem);color:var(--muted,#697081)}
.almer-step-mark{width:31px;height:31px;border-radius:50%;display:grid;place-items:center;border:2px solid currentColor;font-weight:700;font-size:.78rem}
.almer-step--done{color:#13805e}.almer-step--done .almer-step-mark{background:#13805e;color:#fff;border-color:#13805e}
.almer-step--current{color:var(--primary,#7756cd);font-weight:700}.almer-step--current .almer-step-mark{box-shadow:0 0 0 3px rgba(116,86,200,.12)}
.almer-step--stopped{opacity:.62}
@media(max-width:370px){.almer-timeline{gap:3px}.almer-step-mark{width:27px;height:27px}}

.almer-health-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,250px),1fr));gap:12px}
.almer-health-item{border:1px solid var(--border,rgba(120,120,145,.2));padding:14px;border-radius:13px;overflow-wrap:anywhere}
.almer-health-item strong{display:block;margin-bottom:8px}.almer-health-item p{margin:.5rem 0}

.almer-reliability-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,270px),1fr));gap:14px}
.almer-reliability-card[data-state="attention"]{border-inline-start:4px solid #df9850}
.almer-reliability-card[data-state="ok"]{border-inline-start:4px solid #199d74}
.almer-reliability-card[data-state="unknown"]{border-inline-start:4px solid #8793a4}
.almer-reliability-card .stat{font-size:clamp(1.4rem,3vw,2rem)}