
/* ShowPets PWA V1C */
.sp-pwa-card,
.install-pwa-card{
  position:relative;
  margin:0 0 18px;
  padding:16px;
  border-radius:22px;
  background:linear-gradient(180deg, rgba(255,255,255,.96), rgba(243,249,255,.98));
  border:1px solid rgba(148, 163, 184, .22);
  box-shadow:0 18px 38px rgba(15,23,42,.10);
  overflow:hidden;
}
.sp-pwa-card::before,
.install-pwa-card::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at top left, rgba(0,168,150,.10), transparent 32%),
    radial-gradient(circle at 100% 0%, rgba(29,78,216,.10), transparent 28%),
    linear-gradient(90deg, rgba(0,168,150,.04), rgba(255,255,255,0));
  pointer-events:none;
}
.sp-pwa-card>* ,
.install-pwa-card>*{position:relative;z-index:1}
.sp-pwa-card--compact{padding:14px 14px 12px;border-radius:20px;margin-top:14px}
.sp-pwa-card-top,
.install-pwa-top{display:flex;align-items:flex-start;gap:14px}
.sp-pwa-icon,
.install-pwa-icon{width:54px;height:54px;border-radius:18px;display:grid;place-items:center;flex:0 0 auto;background:linear-gradient(135deg,#00a896,#12b1a0);color:#fff;box-shadow:0 12px 24px rgba(0,168,150,.22);font-size:1.24rem}
.sp-pwa-card--compact .sp-pwa-icon{width:46px;height:46px;border-radius:16px;font-size:1.05rem}
.sp-pwa-copy,
.install-pwa-copy{min-width:0;flex:1}
.sp-pwa-badge,
.install-pwa-badge{display:inline-flex;align-items:center;gap:8px;padding:7px 11px;border-radius:999px;background:#ecfeff;border:1px solid #c8f6f1;color:#0f766e;font-size:.74rem;font-weight:800;letter-spacing:.02em;text-transform:uppercase;margin-bottom:10px}
.sp-pwa-title,
.install-pwa-title{margin:0 0 6px;color:#0f172a;font-size:1.08rem;font-weight:800;line-height:1.18;letter-spacing:-.01em}
.sp-pwa-card--compact .sp-pwa-title{font-size:1rem}
.sp-pwa-text,
.install-pwa-text{margin:0;color:#64748b;font-size:.94rem;line-height:1.5}
.sp-pwa-actions,
.install-pwa-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px}
.sp-pwa-btn,.sp-pwa-btn:visited,
.btn-install-pwa,.btn-install-guide{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:46px;padding:0 18px;border-radius:16px;font-weight:800;font-size:.94rem;letter-spacing:.01em;border:none;text-decoration:none;transition:all .2s ease;cursor:pointer}
.sp-pwa-btn--primary,
.btn-install-pwa{background:linear-gradient(90deg,#ff7a18,#ffb703);color:#fff;box-shadow:0 16px 30px rgba(255,122,24,.24)}
.sp-pwa-btn--primary:hover,
.btn-install-pwa:hover{color:#fff;transform:translateY(-1px);box-shadow:0 20px 34px rgba(255,122,24,.30)}
.sp-pwa-btn--secondary,
.btn-install-guide{background:#ffffff;color:#0f172a;border:1px solid #d9e3ef;box-shadow:0 10px 20px rgba(15,23,42,.05)}
.sp-pwa-btn--secondary:hover,
.btn-install-guide:hover{background:#f8fbff;color:#0f172a}
.sp-pwa-help,
.install-pwa-help{margin-top:12px;color:#475569;font-size:.89rem;line-height:1.5}
.sp-pwa-help strong,
.install-pwa-help strong{color:#0f172a}
.sp-pwa-status,
.install-pwa-status{display:none;align-items:center;gap:8px;margin-top:12px;padding:10px 12px;border-radius:14px;background:#ecfdf5;border:1px solid #cdeed8;color:#166534;font-size:.9rem;font-weight:700}
.sp-pwa-card.is-installed .sp-pwa-status,
.install-pwa-card.is-installed .install-pwa-status{display:inline-flex}
.sp-pwa-card.is-installed .sp-pwa-actions,
.install-pwa-card.is-installed .install-pwa-actions{display:none}
.sp-pwa-card.is-installed .sp-pwa-help,
.install-pwa-card.is-installed .install-pwa-help{display:none}
.sp-pwa-card--dashboard{background:linear-gradient(180deg, rgba(246,255,253,.98), rgba(247,250,255,.98)); margin-top:16px}
.sp-pwa-card--dashboard .sp-pwa-badge{margin-bottom:8px}
.sp-pwa-card--dashboard .sp-pwa-actions{margin-top:12px}
.sp-pwa-card--dashboard .sp-pwa-btn{min-height:42px;padding:0 16px;font-size:.9rem}
.sp-pwa-link-row{display:flex;gap:10px;flex-wrap:wrap;margin-top:12px}
.sp-pwa-note-chip{display:inline-flex;align-items:center;gap:8px;padding:8px 12px;border-radius:999px;background:rgba(255,255,255,.78);border:1px solid rgba(226,232,240,.94);font-size:.82rem;font-weight:700;color:#0f172a}
.sp-pwa-floating-btn{position:fixed;right:16px;bottom:16px;z-index:2140;min-height:48px;padding:0 16px;border:none;border-radius:999px;background:linear-gradient(90deg,#ff7a18,#ffb703);color:#fff;font-weight:800;box-shadow:0 10px 24px rgba(255,122,24,.28);cursor:pointer}
.sp-pwa-install-sheet{position:fixed;inset:0;z-index:2141;display:none;align-items:flex-end;justify-content:center;background:rgba(2,6,23,.46);padding:18px}
.sp-pwa-install-sheet.is-open{display:flex}
.sp-pwa-install-card{width:min(560px,100%);background:#fff;border-radius:24px;padding:22px 18px 18px;box-shadow:0 18px 42px rgba(15,23,42,.24)}
.sp-pwa-install-title{margin:0 0 8px;font-size:1.16rem;font-weight:800;color:#111827}
.sp-pwa-install-text{margin:0;color:#667085;line-height:1.6}
.sp-pwa-install-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:16px;flex-wrap:wrap}
.sp-pwa-install-actions button{min-height:42px;padding:0 16px;border-radius:999px;border:1px solid rgba(15,23,42,.1);background:#fff;font-weight:700;cursor:pointer}
.sp-pwa-install-actions .primary{background:#0d6efd;color:#fff;border-color:#0d6efd}
@media (max-width:767.98px){
  .sp-pwa-card,.install-pwa-card{margin:0 0 16px;padding:14px;border-radius:20px}
  .sp-pwa-card-top,.install-pwa-top{gap:12px}
  .sp-pwa-icon,.install-pwa-icon{width:46px;height:46px;border-radius:16px;font-size:1.05rem}
  .sp-pwa-title,.install-pwa-title{font-size:1rem}
  .sp-pwa-text,.install-pwa-text{font-size:.9rem}
  .sp-pwa-actions,.install-pwa-actions{flex-direction:column}
  .sp-pwa-btn,.btn-install-pwa,.btn-install-guide{width:100%}
  .sp-pwa-floating-btn{left:16px;right:16px;width:auto}
  .sp-pwa-install-sheet{padding:12px}
}
@media (prefers-reduced-motion: reduce){
  .sp-pwa-btn,.btn-install-pwa,.btn-install-guide{transition:none}
}
