.ntb-pwa-shell,
.ntb-pwa-shell * { box-sizing: border-box; }

.ntb-pwa-shell { position: fixed; z-index: 2147483000; inset: auto 22px 22px auto; color: #eef8ff; font-family: "Google Sans Flex", "Roboto Mono", ui-sans-serif, sans-serif; }
.ntb-pwa-shell[hidden] { display: none; }
.ntb-pwa-banner { display: grid; width: min(620px, calc(100vw - 44px)); grid-template-columns: 44px minmax(0, 1fr) auto auto 30px; align-items: center; gap: 12px; padding: 12px; border: 1px solid rgba(71, 191, 255, .28); border-radius: 20px; background: rgba(8, 17, 31, .96); box-shadow: 0 22px 60px rgba(0, 0, 0, .34), 0 0 0 1px rgba(255, 255, 255, .04) inset; backdrop-filter: blur(18px); }
.ntb-pwa-logo { width: 44px; height: 44px; object-fit: cover; border-radius: 14px; background: #fff; }
.ntb-pwa-copy { min-width: 0; }
.ntb-pwa-copy strong, .ntb-pwa-copy span { display: block; }
.ntb-pwa-copy strong { color: #fff; font-family: "Lobster Two", cursive; font-size: 17px; font-weight: 700; line-height: 1.05; }
.ntb-pwa-copy span { margin-top: 5px; overflow: hidden; color: #a9c0cc; font-size: 10px; line-height: 1.45; text-overflow: ellipsis; }
.ntb-pwa-install, .ntb-pwa-dialog-action { display: inline-flex; min-height: 40px; align-items: center; justify-content: center; gap: 7px; padding: 0 13px; border: 0; border-radius: 11px; color: #06131d; background: #47bfff; cursor: pointer; font: 700 10px/1 "Google Sans Flex", sans-serif; transition: background-color .2s ease, box-shadow .2s ease; }
.ntb-pwa-install:hover, .ntb-pwa-install:focus-visible, .ntb-pwa-dialog-action:hover, .ntb-pwa-dialog-action:focus-visible { background: #8bd8ff; box-shadow: 0 0 0 3px rgba(71, 191, 255, .17); outline: 0; }
.ntb-pwa-install-icon { display: grid; width: 15px; height: 15px; place-items: center; }
.ntb-pwa-install-icon svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; }
.ntb-pwa-notify { display: inline-flex; min-height: 40px; align-items: center; justify-content: center; gap: 7px; padding: 0 13px; border: 1px solid rgba(71, 191, 255, .36); border-radius: 11px; color: #bceaff; background: rgba(71, 191, 255, .09); cursor: pointer; font: 700 10px/1 "Google Sans Flex", sans-serif; transition: background-color .2s ease, border-color .2s ease; }
.ntb-pwa-notify:hover, .ntb-pwa-notify:focus-visible { border-color: rgba(71, 191, 255, .75); background: rgba(71, 191, 255, .18); outline: 0; }
.ntb-pwa-notify[hidden] { display: none; }
.ntb-pwa-close, .ntb-pwa-dialog-close { display: grid; width: 30px; height: 30px; padding: 0; place-items: center; border: 0; border-radius: 9px; color: #a9c0cc; background: transparent; cursor: pointer; font-size: 20px; line-height: 1; }
.ntb-pwa-close:hover, .ntb-pwa-close:focus-visible, .ntb-pwa-dialog-close:hover, .ntb-pwa-dialog-close:focus-visible { color: #fff; background: rgba(255, 255, 255, .09); outline: 0; }
.ntb-pwa-backdrop { position: fixed; z-index: 1; inset: 0; display: grid; padding: 20px; place-items: center; background: rgba(1, 7, 14, .68); }
.ntb-pwa-backdrop[hidden] { display: none; }
.ntb-pwa-dialog { position: relative; width: min(100%, 420px); padding: 30px 26px 24px; border: 1px solid rgba(71, 191, 255, .3); border-radius: 24px; background: #0c1b2a; box-shadow: 0 28px 80px rgba(0, 0, 0, .52); }
.ntb-pwa-dialog-close { position: absolute; top: 13px; right: 13px; }
.ntb-pwa-dialog-kicker { color: #47bfff; font: 700 9px/1.2 "Roboto Mono", monospace; letter-spacing: .15em; }
.ntb-pwa-dialog h2 { margin: 10px 42px 8px 0; color: #fff; font-size: 24px; letter-spacing: -.04em; line-height: 1.1; }
.ntb-pwa-dialog-lead { margin: 0; color: #aec4d0; font-size: 11px; line-height: 1.65; }
.ntb-pwa-steps { display: grid; gap: 10px; margin: 20px 0; padding-left: 21px; color: #e6f4fa; font-size: 11px; line-height: 1.55; }
.ntb-pwa-steps strong { color: #8bd8ff; }
.ntb-pwa-dialog-action { width: 100%; }

@media (max-width: 600px) {
  .ntb-pwa-shell { right: 12px; bottom: max(12px, env(safe-area-inset-bottom)); left: 12px; }
  .ntb-pwa-banner { width: 100%; grid-template-columns: 42px minmax(0, 1fr) 30px; gap: 10px; padding: 11px; border-radius: 18px; }
  .ntb-pwa-logo { width: 42px; height: 42px; }
  .ntb-pwa-copy strong { font-size: 16px; }
  .ntb-pwa-copy span { font-size: 9px; }
  .ntb-pwa-install { grid-column: 1 / -1; width: 100%; min-height: 38px; }
  .ntb-pwa-notify { grid-column: 1 / -1; width: 100%; min-height: 38px; }
  .ntb-pwa-close { grid-column: 3; grid-row: 1; }
  .ntb-pwa-dialog { padding: 28px 21px 21px; }
}

@media (prefers-reduced-motion: reduce) {
  .ntb-pwa-install, .ntb-pwa-dialog-action { transition: none; }
}
