/* ScanVeer — "open in browser" hint (js/store-fallback.js).
   Shown only inside a TikTok-family webview, only after a store tap failed to leave the page.
   Self-contained colours: this file is loaded by both the landing page and /get, which do
   not share a token set. */
.sf-sheet{
  position:fixed;left:12px;right:12px;bottom:calc(12px + env(safe-area-inset-bottom, 0px));z-index:2147483000;
  max-width:460px;margin:0 auto;padding:20px 18px 18px;
  background:#16211A;color:#F7FBF6;border-radius:20px;
  box-shadow:0 24px 60px -18px rgba(14,77,6,.55), 0 0 0 1px rgba(255,255,255,.06);
  font-family:"Inter", system-ui, -apple-system, sans-serif;text-align:left;
  transform:translateY(calc(100% + 40px));opacity:0;pointer-events:none;
  transition:transform .45s cubic-bezier(.16,1,.3,1), opacity .3s ease;
}
.sf-sheet.on{transform:translateY(0);opacity:1;pointer-events:auto}
.sf-title{display:block;padding-right:36px;font-family:"Poppins", "Plus Jakarta Sans", system-ui, sans-serif;font-weight:600;font-size:17px;line-height:1.3;letter-spacing:-.01em}
.sf-body{margin:8px 0 0;font-size:15px;line-height:1.55;color:rgba(247,251,246,.82)}
.sf-key{display:inline-block;padding:1px 8px;border-radius:7px;background:rgba(255,255,255,.12);color:#fff;font-weight:600;white-space:nowrap}
.sf-row{display:flex;gap:8px;margin-top:14px}
.sf-link{
  flex:1 1 auto;min-width:0;height:46px;padding:0 12px;border-radius:12px;
  border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.06);color:#F7FBF6;
  font:500 15px/1 "Inter", system-ui, sans-serif;
}
.sf-copy{
  flex:0 0 auto;min-height:46px;padding:0 16px;border:0;border-radius:12px;cursor:pointer;
  background:#2E9E14;color:#fff;font:600 15px/1.2 "Inter", system-ui, sans-serif;
}
.sf-copy:active{background:#156C08}
.sf-close{
  position:absolute;top:8px;right:8px;width:44px;height:44px;border:0;background:transparent;cursor:pointer;
  color:rgba(247,251,246,.7);font-size:26px;line-height:1;border-radius:12px;
}
.sf-copy:focus-visible,.sf-close:focus-visible,.sf-link:focus-visible{outline:3px solid #7bd65f;outline-offset:2px}
@media (max-width:360px){
  .sf-row{flex-direction:column}
  .sf-copy{width:100%}
}
@media (prefers-reduced-motion:reduce){
  .sf-sheet{transition:opacity .2s ease;transform:none}
}