/* NN One PWA — install FAB + iOS "Add to Home Screen" guide.
   All styling is class-based (strict CSP, no inline styles). */
.nnpwa-hidden{display:none!important}

/* Floating install button — sits ABOVE the persistent customer-service FAB
   (.lp-float is 54px tall docked ~26px from the bottom, i.e. occupies ~80px). */
.nnpwa-fab{
  position:fixed;
  right:16px;
  bottom:calc(96px + env(safe-area-inset-bottom));
  z-index:9000;
  display:flex;align-items:center;gap:9px;
  max-width:min(80vw,248px);
  padding:9px 10px 9px 13px;
  border:none;border-radius:999px;
  background:linear-gradient(145deg,#ef8e6e,#c14e31);
  color:#fff;
  font-family:"Noto Sans Thai","Noto Sans KR","PingFang SC","Microsoft YaHei",system-ui,sans-serif;
  box-shadow:0 10px 26px rgba(168,67,44,.38),0 2px 6px rgba(0,0,0,.18);
  cursor:pointer;
  animation:nnpwa-pop .32s cubic-bezier(.2,.9,.3,1.2);
}
.nnpwa-fab:active{transform:scale(.97)}
/* raised further when a tall bottom bar is detected on the page */
.nnpwa-fab--high{bottom:calc(164px + env(safe-area-inset-bottom))}
@keyframes nnpwa-pop{from{opacity:0;transform:translateY(12px) scale(.92)}to{opacity:1;transform:none}}
.nnpwa-fab-ico{display:flex;align-items:center;justify-content:center;flex:0 0 auto;
  width:30px;height:30px;border-radius:50%;background:rgba(255,255,255,.18)}
.nnpwa-fab-ico svg{width:18px;height:18px;display:block}
.nnpwa-fab-txt{display:flex;flex-direction:column;align-items:flex-start;line-height:1.18;text-align:left}
.nnpwa-fab-act{font-size:14px;font-weight:800;letter-spacing:.2px;white-space:nowrap}
.nnpwa-fab-name{font-size:10px;font-weight:600;opacity:.92;white-space:nowrap;max-width:150px;overflow:hidden;text-overflow:ellipsis}
.nnpwa-fab-close{
  flex:0 0 auto;display:flex;align-items:center;justify-content:center;
  width:20px;height:20px;margin-left:2px;border-radius:50%;
  background:rgba(0,0,0,.18);color:#fff;font-size:14px;line-height:1;font-weight:700;
}
.nnpwa-fab-close:active{background:rgba(0,0,0,.32)}

/* iOS guide modal */
.nnpwa-overlay{
  position:fixed;inset:0;z-index:9001;
  background:rgba(28,25,22,.52);backdrop-filter:blur(2px);
  display:flex;align-items:flex-end;justify-content:center;
  padding:16px;padding-bottom:calc(16px + env(safe-area-inset-bottom));
  animation:nnpwa-fade .2s ease;
}
@keyframes nnpwa-fade{from{opacity:0}to{opacity:1}}
.nnpwa-modal{
  width:100%;max-width:430px;background:#fffdfa;border-radius:20px;
  padding:22px 20px calc(20px + env(safe-area-inset-bottom));
  box-shadow:0 18px 50px rgba(0,0,0,.32);
  font-family:"Noto Sans Thai","Noto Sans KR","PingFang SC","Microsoft YaHei",system-ui,sans-serif;
  color:#201e1b;animation:nnpwa-up .28s cubic-bezier(.2,.9,.3,1.1);
}
@keyframes nnpwa-up{from{opacity:0;transform:translateY(26px)}to{opacity:1;transform:none}}
.nnpwa-modal-head{display:flex;align-items:flex-start;gap:12px;margin-bottom:6px}
.nnpwa-modal-logo{width:46px;height:46px;border-radius:12px;flex:0 0 auto;
  background:linear-gradient(145deg,#ef8e6e,#bc482e);display:flex;align-items:center;justify-content:center;
  color:#fff;font-weight:900;font-size:18px;letter-spacing:-1px;box-shadow:0 6px 16px rgba(168,67,44,.35)}
.nnpwa-modal-title{font-size:18px;font-weight:800;margin:0;line-height:1.3}
.nnpwa-modal-sub{margin:4px 0 0;font-size:12.5px;color:#777169;line-height:1.45}
.nnpwa-steps{list-style:none;margin:16px 0 4px;padding:0;display:flex;flex-direction:column;gap:13px}
.nnpwa-steps li{display:flex;gap:12px;align-items:flex-start;font-size:14px;line-height:1.45}
.nnpwa-step-n{flex:0 0 auto;width:24px;height:24px;border-radius:50%;
  background:#fff0e9;color:#a8432c;font-weight:800;font-size:13px;
  display:flex;align-items:center;justify-content:center}
.nnpwa-steps b{font-weight:700}
.nnpwa-shareico{display:inline-flex;vertical-align:-3px;margin:0 2px}
.nnpwa-shareico svg{width:17px;height:17px;display:block}
.nnpwa-addico{display:inline-flex;vertical-align:-3px;margin:0 2px}
.nnpwa-addico svg{width:17px;height:17px;display:block}
.nnpwa-modal-actions{display:flex;gap:10px;margin-top:18px}
.nnpwa-modal-close{
  flex:1;border:none;border-radius:12px;padding:13px;font-size:15px;font-weight:800;
  background:linear-gradient(145deg,#ef8e6e,#c14e31);color:#fff;cursor:pointer;
  font-family:inherit;box-shadow:0 8px 18px rgba(168,67,44,.3);
}
.nnpwa-modal-close:active{transform:scale(.98)}
.nnpwa-modal-x{
  position:absolute;top:12px;right:14px;width:30px;height:30px;border:none;background:transparent;
  color:#777169;font-size:22px;line-height:1;cursor:pointer;border-radius:50%;
}
.nnpwa-modal-wrap{position:relative}
@media (min-width:640px){.nnpwa-overlay{align-items:center}}