:root {
  --vt-app-purple: #4c1d95;
  --vt-app-purple-dark: #2e1065;
  --vt-app-lilac: #f3e8ff;
}

.vt-app-install {
  position: fixed;
  right: 16px;
  bottom: 18px;
  z-index: 10000;
  display: flex;
  max-width: min(360px, calc(100vw - 32px));
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border: 1px solid rgba(76, 29, 149, .18);
  border-radius: 16px;
  background: rgba(255, 255, 255, .97);
  box-shadow: 0 14px 40px rgba(46, 16, 101, .22);
  color: #25133f;
  font: 600 14px/1.25 system-ui, sans-serif;
}

.vt-app-install strong { display: block; font-size: 14px; }
.vt-app-install small { display: block; margin-top: 2px; color: #665b72; font-weight: 500; }
.vt-app-install button { border: 0; cursor: pointer; font: inherit; }
.vt-app-install__go {
  flex: 0 0 auto;
  padding: 10px 13px;
  border-radius: 10px;
  background: var(--vt-app-purple) !important;
  color: #fff;
}
.vt-app-install__close {
  align-self: flex-start;
  padding: 0 3px;
  background: transparent;
  color: #756a80;
  font-size: 18px !important;
}

.vt-app-toast {
  position: fixed;
  left: 50%;
  bottom: 86px;
  z-index: 10002;
  transform: translateX(-50%);
  max-width: calc(100vw - 32px);
  padding: 10px 15px;
  border-radius: 999px;
  background: #24113f;
  color: #fff;
  box-shadow: 0 10px 30px rgba(0, 0, 0, .24);
  font: 700 13px/1.2 system-ui, sans-serif;
  text-align: center;
}

.vt-app-nav { display: none; }

@media (display-mode: standalone) {
  body.vt-app-standalone { padding-bottom: calc(68px + env(safe-area-inset-bottom)); }
  .vt-app-nav {
    position: fixed;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 9998;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    padding: 7px 8px calc(6px + env(safe-area-inset-bottom));
    border-top: 1px solid #e5ddec;
    background: rgba(255, 255, 255, .97);
    box-shadow: 0 -8px 24px rgba(46, 16, 101, .09);
    backdrop-filter: blur(16px);
  }
  .vt-app-nav a {
    display: flex;
    min-width: 0;
    min-height: 46px;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 3px;
    border-radius: 12px;
    color: #675d70;
    font: 700 11px/1 system-ui, sans-serif;
    text-decoration: none;
  }
  .vt-app-nav a span { font-size: 20px; line-height: 1; }
  .vt-app-nav a[aria-current="page"] { background: var(--vt-app-lilac); color: var(--vt-app-purple); }
  .vt-app-install { bottom: calc(78px + env(safe-area-inset-bottom)); }
}

@media (max-width: 430px) {
  .vt-app-install { left: 12px; right: 12px; bottom: 12px; max-width: none; }
}

@media (prefers-reduced-motion: reduce) {
  .vt-app-install, .vt-app-toast { scroll-behavior: auto; }
}