/* Download bar + store-button states. Loaded on every page. */
.eb-bar{position:fixed;left:0;right:0;bottom:0;z-index:900;
  background:#12241A;color:#fff;border-top:1px solid rgba(255,255,255,.1);
  transform:translateY(110%);transition:transform .26s ease;
  padding-bottom:env(safe-area-inset-bottom)}
.eb-bar.on{transform:translateY(0)}
.eb-bar-in{max-width:1120px;margin:0 auto;padding:11px 16px;
  display:flex;align-items:center;gap:13px}
.eb-bar-ic{width:34px;height:34px;flex:none;border-radius:9px}
.eb-bar-txt{flex:1;min-width:0;line-height:1.3}
.eb-bar-txt strong{display:block;font-size:14.5px;font-weight:800;letter-spacing:-.2px;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.eb-bar-txt span{display:block;font-size:12.5px;color:rgba(255,255,255,.66);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.eb-bar-actions{display:flex;gap:8px;flex:none}
/* Official store artwork. Google's PNG carries ~16% transparent padding
   (564x168 artwork inside a 646x250 file), so its box must be taller to render
   the SAME visible height as Apple's edge-to-edge SVG: 34 / 0.672 = 51px. */
.eb-bar-badge{display:inline-flex;align-items:center;flex:none;text-decoration:none;
  transition:transform .15s ease}
.eb-bar-badge:hover{transform:translateY(-1px)}
.eb-bar-badge img{display:block;width:auto}
.eb-bar-badge[data-store="play"] img{height:51px}
.eb-bar-badge[data-store="ios"]  img{height:34px}
.eb-bar-badge.is-soon{cursor:not-allowed}
.eb-bar-badge.is-soon img{opacity:.6;filter:grayscale(.45)}
.eb-bar-x{flex:none;background:none;border:0;color:rgba(255,255,255,.5);
  font-size:23px;line-height:1;cursor:pointer;padding:0 2px}
.eb-bar-x:hover{color:#fff}
@media(max-width:620px){
  .eb-bar-txt span{display:none}
  .eb-bar-in{padding:8px 12px;gap:10px}
  .eb-bar-ic{width:30px;height:30px}
  .eb-bar-actions{gap:6px}
  .eb-bar-badge[data-store="play"] img{height:45px}
  .eb-bar-badge[data-store="ios"]  img{height:30px}
}
/* A narrow desktop window still shows both stores, and two buttons plus a label
   do not fit. The buttons say what they are, so the label is what gives way. */
/* Two badges plus a label will not fit on a narrow phone. The badges say what
   they are, so the label is what gives way — not one of the stores. */
@media(max-width:480px){
  .eb-bar-txt{display:none}
  .eb-bar-ic{display:none}
  .eb-bar-actions{flex:1;justify-content:center}
}
@media(max-width:340px){
  .eb-bar-badge[data-store="play"] img{height:40px}
  .eb-bar-badge[data-store="ios"]  img{height:27px}
}
/* Store buttons elsewhere on the page, while the listing is in review. */
.store.is-soon{opacity:.58;cursor:not-allowed}
.eb-toast{position:fixed;left:50%;bottom:86px;transform:translate(-50%,14px);
  background:#12241A;color:#fff;font-size:13.5px;font-weight:600;line-height:1.45;
  padding:12px 17px;border-radius:12px;max-width:min(420px,calc(100vw - 32px));
  box-shadow:0 12px 34px rgba(0,0,0,.3);opacity:0;pointer-events:none;
  transition:opacity .2s ease,transform .2s ease;z-index:950;text-align:center}
.eb-toast.on{opacity:1;transform:translate(-50%,0)}

/* ─── Mobile navigation drawer ───────────────────────────────────────────────
   Replaces an earlier horizontal-scroll nav that clipped the CTA off the right
   edge with no affordance — it read as broken rather than scrollable. Below the
   breakpoint the links move into a slide-in sidebar behind a hamburger. */
.eb-burger{display:none;align-items:center;justify-content:center;width:42px;height:42px;
  margin:-6px -8px -6px 0;background:none;border:0;cursor:pointer;color:inherit;border-radius:10px}
.eb-burger:hover{background:rgba(19,26,22,.06)}
.eb-burger svg{width:21px;height:21px;fill:currentColor;display:block}

.eb-drawer-bd{position:fixed;inset:0;background:rgba(10,22,15,.5);backdrop-filter:blur(2px);
  opacity:0;pointer-events:none;transition:opacity .22s ease;z-index:980}
.eb-drawer-bd.on{opacity:1;pointer-events:auto}

.eb-drawer{position:fixed;top:0;right:0;bottom:0;width:min(310px,84vw);background:#fff;
  z-index:981;transform:translateX(100%);transition:transform .24s ease;
  display:flex;flex-direction:column;box-shadow:-18px 0 50px rgba(10,22,15,.26);
  padding-bottom:env(safe-area-inset-bottom);overflow-y:auto}
.eb-drawer.on{transform:none}
.eb-drawer-top{display:flex;align-items:center;justify-content:space-between;
  padding:16px 18px;border-bottom:1px solid #DCE6DA}
.eb-drawer-top strong{font-size:15px;font-weight:800;letter-spacing:-.2px;color:#131A16}
.eb-drawer-x{width:40px;height:40px;margin:-8px -10px -8px 0;background:none;border:0;
  cursor:pointer;color:#7C8C82;border-radius:10px;display:flex;align-items:center;justify-content:center}
.eb-drawer-x:hover{background:#F0F5EC;color:#131A16}
.eb-drawer-x svg{width:16px;height:16px;fill:currentColor}
.eb-drawer nav,.eb-drawer-links{display:flex;flex-direction:column;padding:10px 0}
.eb-drawer-links a{display:block;padding:13px 20px;font-size:15.5px;font-weight:700;
  color:#131A16;text-decoration:none;border-left:3px solid transparent}
.eb-drawer-links a:hover{background:#F2F9EC;border-left-color:#2C7449;color:#2C7449}
.eb-drawer-links a.is-cta{margin:12px 18px 6px;padding:13px 18px;text-align:center;
  background:#2C7449;color:#fff;border-radius:999px;border-left:0}
.eb-drawer-links a.is-cta:hover{background:#1E5637;color:#fff}
.eb-drawer-foot{margin-top:auto;padding:16px 20px;border-top:1px solid #DCE6DA;
  font-size:12.5px;color:#7C8C82;line-height:1.5}

body.eb-locked{overflow:hidden}

@media(max-width:860px){
  .eb-burger{display:flex}
  nav .nav-links{display:none !important}
}