/* Non-intrusive iOS/Android web banner, modelled on a Smart App Banner.
 * It links to instructions, NOT to an unavailable App Store listing.
 * Consistently legible regardless of the selected decorative theme.
 */
.install-smart-banner[hidden],.install-guide[hidden],.install-help[hidden],
.install-platform-instructions[hidden],.install-ios-quickbar[hidden]{display:none!important}
.install-smart-banner{
  position:relative;z-index:20;width:100%;background:#f3f3f7;
  color:#171b24;border-bottom:1px solid #d4d7e0;
  padding:max(6px,env(safe-area-inset-top,0px)) 12px 7px;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif
}
.install-smart-inner{
  max-width:830px;margin:0 auto;min-height:70px;
  display:flex;align-items:center;gap:12px
}
.install-banner-dismiss{
  flex:0 0 30px;width:30px;min-height:44px;border:0;background:transparent;
  color:#818692;font-size:29px;font-weight:350;padding:0;line-height:1
}
.install-banner-icon{
  width:64px;height:64px;flex:0 0 64px;border-radius:15px;
  background:#071a2c;object-fit:contain;box-shadow:0 1px 5px #101a2b25
}
.install-banner-copy{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.install-banner-name{
  display:block;color:#191b22;font-size:clamp(18px,4.7vw,23px);
  letter-spacing:-.45px;font-weight:720;line-height:1.12
}
.install-banner-subtitle{
  display:block;color:#596372;font-size:12px;font-weight:550;line-height:1.3
}
.install-banner-button{
  flex:none;min-height:48px;min-width:74px;padding:8px 5px;
  background:transparent;border:0;color:#007aff;font-size:20px;font-weight:650;
  text-align:center;white-space:nowrap
}
.install-smart-banner button:focus-visible{outline:3px solid #007aff;outline-offset:1px;border-radius:6px}
body.install-active{overflow:hidden}

/* Big, plain, high-contrast guide for older passengers. */
.install-guide{
  position:fixed;inset:0;z-index:200;display:flex;align-items:center;
  justify-content:center;overflow-y:auto;overscroll-behavior:contain;
  padding:calc(13px + env(safe-area-inset-top,0px)) 13px
          calc(13px + env(safe-area-inset-bottom,0px));
  background:#071b2d;color:#f4fbff;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif
}
.install-sheet{
  width:min(100%,560px);max-height:100%;margin:auto;overflow-y:auto;
  overscroll-behavior:contain;
  border:1px solid #478b9c;border-radius:22px;padding:20px 19px 22px;
  background:#102e45;box-shadow:0 20px 75px #0008
}
.install-head{display:flex;align-items:center;justify-content:flex-end;min-height:48px}
.install-x{
  width:48px;height:48px;flex:none;display:grid;place-items:center;
  border:2px solid #6994a8;border-radius:50%;padding:0;
  background:#173d56;color:#fff;font-size:33px;line-height:1
}
.install-art{display:flex;justify-content:center;align-items:center;margin:0 auto 15px}
.install-icon{
  width:102px;height:102px;display:grid;place-items:center;
  border-radius:25px;overflow:hidden;background:#071a2c;
  border:2px solid #8fe3cd;box-shadow:0 10px 26px #0006
}
.install-icon img{width:100%;height:100%;object-fit:contain;display:block}
.install-sheet h1{
  font-size:clamp(30px,7.5vw,41px);font-weight:850;line-height:1.15;
  letter-spacing:-1px;text-align:center;margin:0 0 9px;color:#fff
}
.install-intro{
  font-size:18px;line-height:1.4;font-weight:500;
  text-align:center;color:#ddedf6;margin:0 auto 20px;max-width:440px
}
/* Android keeps its in-sheet sticky reminder. iOS pins a separate reminder
   to the browser viewport, ABOVE the independently scrolling instructions.
   Native Apple Share sheets still cover webpage content at their own position. */
.install-tldr{
  position:sticky;top:0;z-index:5;margin:0 0 14px;
  padding:11px 9px;border:1px solid #7cbbc3;border-radius:13px;
  background:#205069;box-shadow:0 4px 14px #071927bb;
}
.install-tldr-flow{
  display:grid;grid-template-columns:minmax(0,1fr) 13px minmax(0,1fr) 13px minmax(0,1.3fr);
  gap:5px;align-items:center;
}
.install-tldr-item{
  min-width:0;display:block;text-align:center;color:#f4fcff;
  font-size:13px;font-weight:800;line-height:1.23;
}
.install-tldr-item small{display:block;color:#cde8f2;font-size:11px;line-height:1.25}
.install-tldr-next{color:#75f0cb;font-size:20px;font-weight:850;text-align:center}
.install-tldr-share,.install-tldr-down{
  display:inline-block;width:17px;height:17px;vertical-align:-3px;
  color:#88f9d8;margin-left:2px;
}
.install-steps{display:grid;gap:12px;margin-bottom:19px}
.install-step{
  display:grid;grid-template-columns:55px minmax(0,1fr);gap:14px;
  align-items:start;padding:17px 15px;
  border:1px solid #5b91a2;border-radius:15px;background:#193d56
}
.install-step-count{
  width:54px;height:54px;display:grid;place-items:center;
  border-radius:13px;background:#60e6bf;color:#092a32;
  font-size:30px;font-weight:900;font-variant-numeric:tabular-nums
}
.install-step strong{
  display:block;color:#fff;font-size:21px;font-weight:850;line-height:1.24
}
.install-step p{
  font-size:18px;line-height:1.43;font-weight:450;
  color:#e1f2fa;margin:7px 0 0
}
/* The step heading is block-level. Emphasised words within descriptions
   must stay INLINE at paragraph size, otherwise Android stacks each word. */
.install-step p strong{
  display:inline;font-size:inherit;line-height:inherit;
  letter-spacing:inherit;font-weight:850;color:#fff;
}
.install-share-icon{
  display:inline-block;vertical-align:-5px;
  width:24px;height:24px;margin-left:6px;color:#78f7cf
}
.install-action{
  width:100%;min-height:57px;display:block;padding:13px 18px;
  background:#60e6bf;border:0;border-radius:13px;
  color:#0b2930;font-size:19px;font-weight:850
}
.install-footnote{
  font-size:14px;line-height:1.5;text-align:center;
  color:#c3dce8;margin:14px 0 0
}
.install-roadmap{
  font-size:13px;line-height:1.45;text-align:center;
  color:#9fbecd;margin:7px auto 0;max-width:400px
}
.install-help{
  border:1px solid var(--border);background:var(--panel);color:var(--mint);
  border-radius:10px;min-height:44px;padding:9px 12px;
  font-size:13px;font-weight:800;white-space:nowrap
}
.install-sheet button:focus-visible,.install-help:focus-visible{
  outline:3px solid #fff;outline-offset:3px
}
@media(max-width:550px){
  .topbar{gap:8px}
  .topbar .theme-wrap{margin-left:auto}
}
@media(max-width:390px){
  .install-smart-banner{padding-left:8px;padding-right:8px}
  .install-smart-inner{gap:8px}
  .install-banner-dismiss{flex-basis:25px;width:25px;font-size:26px}
  .install-banner-icon{width:52px;height:52px;flex-basis:52px;border-radius:12px}
  .install-banner-button{min-width:65px;font-size:18px}
  .install-banner-subtitle{font-size:11px;line-height:1.22}
  .install-sheet{padding:14px 11px 17px}
  .install-step{grid-template-columns:46px minmax(0,1fr);gap:10px;padding:15px 10px}
  .install-step-count{width:46px;height:46px;font-size:27px}
  .install-step strong{font-size:20px}
  .install-tldr{padding:10px 5px}
  .install-tldr-flow{gap:3px;grid-template-columns:minmax(0,1fr) 10px minmax(0,1fr) 10px minmax(0,1.25fr)}
  .install-tldr-item{font-size:12px}
  .install-tldr-next{font-size:17px}
  .install-tldr-share,.install-tldr-down{width:15px;height:15px}
}
@media(max-height:620px){.install-icon{width:82px;height:82px}.install-art{margin-bottom:10px}}

/* Android three-dot menu cue. Reuse the large accessible three-step layout. */
.install-menu-dots{display:inline-block;color:#88f9d8;font-size:1.5em;line-height:.8;
 font-weight:900;vertical-align:-.08em;padding:0 .06em}
.install-tldr-android .install-tldr-item{font-size:12px}
.install-tldr-android .install-tldr-item small{font-size:11px}
@media(max-width:390px){
 .install-tldr-android .install-tldr-item{font-size:11px}
 .install-tldr-android .install-tldr-item small{font-size:10px}
}

/* iOS-only: opaque, fixed, high-contrast quick reference. Keep it outside
   .install-sheet's scrolling region so it remains onscreen when the user scrolls. */
.install-guide[data-install-platform="ios"]{
  flex-direction:column;align-items:stretch;justify-content:flex-start;
  padding-top:calc(105px + env(safe-area-inset-top,0px));
}
.install-guide[data-install-platform="ios"] .install-sheet{
  flex:1 1 auto;min-height:0;margin:0 auto;-webkit-overflow-scrolling:touch;
}
.install-ios-quickbar{
  position:fixed;top:calc(7px + env(safe-area-inset-top,0px));
  left:10px;right:10px;max-width:560px;margin-inline:auto;
  z-index:202;padding:5px;border:2px solid #02090f;border-radius:17px;
  background:#071a29;box-shadow:0 0 0 1px #518ca0,0 9px 24px #000b;
}
.install-ios-quickbar .install-tldr{
  position:static;top:auto;z-index:auto;margin:0;
  background:#20475e;border:1px solid #76adba;
  box-shadow:none;
}
@media(max-width:390px){
 .install-guide[data-install-platform="ios"]{
   padding-top:calc(112px + env(safe-area-inset-top,0px));
 }
 .install-ios-quickbar{left:6px;right:6px;padding:4px}
}

/* Non-Safari iPhone users get an uncomplicated Safari hand-off, not
   Share-menu guidance which may not match their actual browser. */
.install-safari-address{display:inline-block;max-width:100%;font-weight:900;
  color:#a5ffdc;font-size:1.08em;overflow-wrap:anywhere;user-select:text}