
:root {
  --ayri-primary: #0891b2;
  --ayri-primary-dark: #0e7490;
  --ayri-surface: #ffffff;
  --ayri-border: rgba(14,165,233,.14);
  --ayri-shadow: 0 16px 40px rgba(8,47,73,.10);
}
body { padding-bottom: calc(env(safe-area-inset-bottom,0px) + 88px); }
@media (min-width: 768px){ body { padding-bottom: 0; } }
nav.bg-cyan-600 {
  background: linear-gradient(135deg, #0891b2 0%, #0ea5e9 100%) !important;
  box-shadow: 0 12px 32px rgba(8,145,178,.22);
}
.ayri-top-link { backdrop-filter: blur(10px); }
main { min-height: calc(100vh - 220px); }
.rounded-3xl.bg-white,
.rounded-\[2rem\].bg-white,
.card,
.dashboard-card {
  box-shadow: var(--ayri-shadow) !important;
  border-color: var(--ayri-border) !important;
}
button, a, input, textarea, select { transition: all .18s ease; }
button:hover, a:hover { transform: translateY(-1px); }
button:active, a:active { transform: translateY(0) scale(.985); }
img[data-skeleton] { background: linear-gradient(90deg,#e6f6fb 25%,#f4fbff 37%,#e6f6fb 63%); background-size: 400% 100%; animation: ayriShimmer 1.2s infinite; }
img[data-skeleton].is-loaded { background: none; animation: none; }
@keyframes ayriShimmer { 0% { background-position: 100% 0; } 100% { background-position: 0 0; } }
.ayri-bottom-nav {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 60;
  padding: .65rem .9rem calc(env(safe-area-inset-bottom,0px) + .8rem);
  background: linear-gradient(180deg, rgba(248,250,252,0), rgba(248,250,252,.85) 28%, rgba(255,255,255,.98));
  backdrop-filter: blur(14px);
}
.ayri-bottom-nav__shell {
  max-width: 34rem; margin: 0 auto; background: rgba(255,255,255,.96);
  border: 1px solid rgba(186,230,253,.95); border-radius: 1.65rem;
  box-shadow: 0 16px 40px rgba(8,47,73,.12);
  display: grid; grid-template-columns: repeat(5, 1fr); gap: .35rem; padding: .55rem;
}
.ayri-bottom-nav__item {
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:.35rem;
  min-height:58px; color:#64748b; font-size:.72rem; font-weight:800; border-radius:1.1rem;
}
.ayri-bottom-nav__item.is-active { color:#0e7490; background:#ecfeff; }
.ayri-bottom-nav__item.is-center { background:linear-gradient(135deg,#0891b2,#06b6d4); color:#fff; transform:translateY(-14px); box-shadow:0 14px 28px rgba(8,145,178,.28); }
.ayri-bottom-nav__icon { position:relative; width:28px; height:28px; display:flex; align-items:center; justify-content:center; }
.ayri-bottom-nav__badge { position:absolute; top:-4px; right:-10px; min-width:18px; height:18px; padding:0 .28rem; border-radius:999px; background:#ef4444; color:#fff; font-size:.62rem; display:flex; align-items:center; justify-content:center; }
.ayri-sticky-cta {
  position: fixed; left: 1rem; right: 1rem; bottom: calc(env(safe-area-inset-bottom,0px) + 5.9rem); z-index: 55;
}
.ayri-sticky-cta__shell {
  max-width: 34rem; margin: 0 auto; display:flex; align-items:center; gap:.85rem;
  background: rgba(15,23,42,.94); color:#fff; border-radius:1.35rem; padding:.85rem .9rem; box-shadow:0 20px 40px rgba(15,23,42,.28);
}
.ayri-sticky-cta__copy { flex:1; min-width:0; }
.ayri-sticky-cta__title { font-size:.9rem; font-weight:900; }
.ayri-sticky-cta__desc { font-size:.72rem; opacity:.82; }
.ayri-sticky-cta__btn { padding:.8rem 1rem; border-radius:1rem; background:linear-gradient(135deg,#06b6d4,#0ea5e9); font-weight:900; white-space:nowrap; }
@media (min-width: 768px){ .ayri-bottom-nav, .ayri-sticky-cta { display:none !important; } }
