/* Fooppers Shell v2.6.1 */

:root{
  --fps-brand:#E30613;
  --fps-ink:#1A1210;
  --fps-muted:#8A7A73;
  --fps-line:rgba(26,18,16,.12);
  --fps-tint:#FDECEB;
  --fps-surface:#FFFFFF;
  --fps-h:104px;          /* header height with search */
  --fps-tab-h:62px;
}

#fps-shell *,#fps-voice *,.fps-tabbar *{box-sizing:border-box;}

/* ------------------------------------------------------------------ *
 * Reset.
 * The theme styles every <button> on the page (yellow fill, its own
 * radius, uppercase). Nothing inside the shell should inherit any of
 * that, so every button is stripped back to nothing first and then
 * restyled below. `all:revert` would also wipe our own rules, so this
 * spells out the properties themes actually touch.
 * ------------------------------------------------------------------ */

#fps-shell button,
#fps-voice button,
.fps-tabbar a,
#fps-results button,
#fps-results a{
  -webkit-appearance:none !important;
  appearance:none !important;
  background:none !important;
  background-color:transparent !important;
  background-image:none !important;
  border:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
  color:inherit !important;
  cursor:pointer;
  font:inherit !important;
  font-family:inherit !important;
  font-size:inherit !important;
  font-weight:400 !important;
  letter-spacing:normal !important;
  line-height:1.3 !important;
  margin:0 !important;
  min-width:0 !important;
  min-height:0 !important;
  max-width:none !important;
  padding:0 !important;
  text-align:left;
  text-decoration:none !important;
  text-shadow:none !important;
  text-transform:none !important;
  transform:none;
  transition:none;
  width:auto !important;
  height:auto !important;
  filter:none !important;
  outline:0;
}

#fps-shell button:hover,#fps-shell button:focus,#fps-shell button:active,
#fps-voice button:hover,#fps-voice button:focus,#fps-voice button:active,
#fps-results button:hover,#fps-results button:focus,
#fps-results a:hover,#fps-results a:focus{
  background:none !important;
  background-color:transparent !important;
  background-image:none !important;
  box-shadow:none !important;
  border:0 !important;
  color:inherit !important;
  transform:none !important;
}

#fps-shell button::before,#fps-shell button::after,
#fps-voice button::before,#fps-voice button::after,
#fps-results button::before,#fps-results button::after{
  content:none !important;display:none !important;
}
/* …except the bubble tails, which are ours */
#fps-voice .fps-bubble::after{content:'' !important;display:block !important;}

#fps-shell svg,#fps-voice svg,.fps-tabbar svg{
  display:block !important;max-width:none !important;vertical-align:middle;
}
#fps-shell img,#fps-voice img,.fps-tabbar img{max-width:100%;height:auto;}

/* ---------------------------------------------------------- header */

.fps-header{
  position:sticky;top:0;z-index:99990;
  background:var(--fps-surface);
  border-bottom:1px solid var(--fps-line);
  padding-top:env(safe-area-inset-top);
}
.fps-header-row{
  display:grid;grid-template-columns:40px minmax(0,1fr) auto;align-items:center;
  gap:10px;padding:10px 14px 6px;max-width:720px;margin:0 auto;
}
.fps-icon-btn{
  position:relative !important;flex:0 0 auto !important;
  width:40px !important;height:40px !important;
  border:0 !important;background:transparent !important;
  display:flex !important;align-items:center !important;justify-content:center !important;
  color:var(--fps-ink) !important;cursor:pointer;padding:0 !important;
  border-radius:10px !important;text-decoration:none !important;
  -webkit-tap-highlight-color:transparent;
}
.fps-icon-btn:hover{background:transparent !important;color:var(--fps-ink) !important;}
.fps-icon-btn:active{background:rgba(26,18,16,.06) !important;}
.fps-icon-btn svg{
  width:24px !important;height:24px !important;
  stroke:currentColor !important;fill:none !important;
}
.fps-icon-btn svg *{stroke:currentColor;}
.fps-dot{
  position:absolute;top:8px;right:8px;width:7px;height:7px;
  border-radius:50%;background:var(--fps-brand);
}

/* ------------------------------------------------------ weather control */
.fps-header-actions{grid-column:3;display:flex;align-items:center;gap:2px;justify-self:end;min-width:0;}
.fps-weather-toggle{position:relative !important;width:40px !important;height:40px !important;padding:0 !important;border:0 !important;background:transparent !important;color:#243641 !important;display:flex !important;align-items:center !important;justify-content:center !important;cursor:pointer !important;border-radius:50% !important;-webkit-tap-highlight-color:transparent !important;}
.fps-weather-toggle__ring{width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:rgba(239,244,246,.96);box-shadow:inset 0 0 0 1px rgba(26,42,50,.06),0 4px 12px rgba(24,39,46,.08);transition:transform .2s ease,box-shadow .2s ease,background .2s ease;}
.fps-weather-toggle:active .fps-weather-toggle__ring{transform:scale(.92);}
.fps-weather-toggle.is-active .fps-weather-toggle__ring{box-shadow:inset 0 0 0 1px rgba(26,42,50,.08),0 5px 15px rgba(24,39,46,.12);}
.fps-weather-toggle__icon{width:24px;height:24px;display:flex;align-items:center;justify-content:center;}
.fps-weather-toggle__icon svg{width:24px !important;height:24px !important;display:block !important;overflow:visible !important;fill:none !important;}
.fps-weather-toggle__icon svg [stroke]{stroke:currentColor !important;}
.fps-weather-toggle__icon svg [fill="currentColor"]{fill:currentColor !important;}
.fps-weather-toggle--rain .fps-weather-toggle__ring{background:#E8F0FD;color:#3267A3;}
.fps-weather-toggle--heat .fps-weather-toggle__ring{background:#FFF0D9;color:#D46B16;}
.fps-weather-toggle--cold .fps-weather-toggle__ring,.fps-weather-toggle--snow .fps-weather-toggle__ring{background:#E8F6FB;color:#267A98;}
.fps-weather-toggle--haze .fps-weather-toggle__ring{background:#EEF3F5;color:#657780;}
.fps-weather-toggle--clear .fps-weather-toggle__ring{background:#FFF4D8;color:#D18A1B;}
.fps-weather-toggle--partly .fps-weather-toggle__ring,.fps-weather-toggle--cloudy .fps-weather-toggle__ring{background:#EEF3F6;color:#496B7C;}
.fps-weather-toggle--offline .fps-weather-toggle__ring{background:#EEF1F3;color:#7A878E;}
.fps-weather-toggle .wx-rays{transform-origin:12px 12px;animation:fps-wx-spin 12s linear infinite;}
.fps-weather-toggle .wx-drop{animation:fps-wx-fall .9s linear infinite;}
.fps-weather-toggle .wx-drop:nth-of-type(2){animation-delay:.3s;}
.fps-weather-toggle .wx-drop:nth-of-type(3){animation-delay:.6s;}
.fps-weather-toggle .wx-bolt{animation:fps-wx-flash 2s ease-in-out infinite;}
@media (prefers-reduced-motion:reduce){.fps-weather-toggle .wx-rays,.fps-weather-toggle .wx-drop,.fps-weather-toggle .wx-bolt{animation:none !important;}}
.fps-logo{display:flex;align-items:center;justify-content:center;min-width:0;text-decoration:none;grid-column:2;}
#fps-shell .fps-logo img{
  height:26px !important;width:auto !important;
  max-width:158px !important;
  object-fit:contain;display:block;
}
.fps-wordmark{font-size:20px;font-weight:700;color:var(--fps-brand);letter-spacing:-.01em;}

/* --------------------------------------------------------- search */

.fps-searchrow{
  padding:0 14px 10px;max-width:720px;margin:0 auto;
  display:flex;align-items:center;gap:8px;
}
.fps-searchbox{
  flex:1 1 auto;min-width:0;
  display:flex;align-items:center;gap:8px;
  background:#F4F1EF;border:1.5px solid transparent;
  border-radius:999px;padding:0 12px;height:44px;
  transition:border-color .16s ease,background .16s ease;
}
.fps-searchbox.is-focus{background:#fff;border-color:var(--fps-brand);}
.fps-search-ico{width:19px;height:19px;color:var(--fps-muted);flex:0 0 auto;}
#fps-search-input{
  flex:1 1 auto;min-width:0;border:0;background:transparent;outline:0;
  font-size:15px;color:var(--fps-ink);height:100%;padding:0;
  -webkit-appearance:none;appearance:none;
}
#fps-search-input::-webkit-search-cancel-button{display:none;}
#fps-search-input::placeholder{color:var(--fps-muted);}
.fps-clear,.fps-mic{
  flex:0 0 auto !important;border:0 !important;background:transparent !important;
  padding:0 !important;cursor:pointer;
  width:30px !important;height:30px !important;
  display:flex !important;align-items:center !important;justify-content:center !important;
  color:var(--fps-muted) !important;border-radius:50% !important;
}
.fps-divider{
  flex:0 0 auto;width:1px;height:20px;background:var(--fps-line);margin:0 2px;
}
.fps-mic{color:var(--fps-brand) !important;}
.fps-mic.is-unsupported{color:#B8A9A3 !important;}
.fps-mic:active{background:var(--fps-tint) !important;}
.fps-clear svg,.fps-mic svg{
  width:19px !important;height:19px !important;
  stroke:currentColor !important;fill:none !important;
}

body.fps-no-search{--fps-h:60px;}

/* -------------------------------------------------- search results */

.fps-header{position:sticky;}

/* The panel hangs off the header, so it always lines up with the search
   bar no matter how many bars the theme stacks above it. */
.fps-results{
  position:absolute;top:100%;left:0;right:0;
  z-index:5;
  background:#fff;
  border-top:1px solid var(--fps-line);
  box-shadow:0 14px 30px rgba(26,18,16,.13);
  max-height:calc(100dvh - var(--fps-h) - var(--fps-tab-h) - 12px);
  overflow-y:auto;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:thin;
}
@supports not (height: 100dvh){
  .fps-results{max-height:calc(100vh - var(--fps-h) - var(--fps-tab-h) - 12px);}
}
.fps-results-inner{max-width:720px;margin:0 auto;padding:0 14px 22px;}
#fps-results .fps-results-head{
  position:sticky;top:0;z-index:2;
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  font-size:13px;color:var(--fps-muted);
  padding:10px 0 9px;margin-bottom:2px;
  background:#fff;
  border-bottom:1px solid rgba(26,18,16,.07);
}
#fps-results .fps-results-inner{padding-top:0;}
#fps-results-heading{
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
#fps-results .fps-results-close{
  flex:0 0 auto;
  width:30px !important;height:30px !important;
  border-radius:50% !important;
  background:transparent !important;color:var(--fps-muted) !important;
  display:flex !important;align-items:center !important;justify-content:center !important;
}
#fps-results .fps-results-close:active{background:rgba(26,18,16,.06) !important;}
#fps-results .fps-results-close svg{width:18px !important;height:18px !important;stroke:currentColor !important;fill:none !important;}
.fps-results-list{display:flex;flex-direction:column;gap:2px;}
#fps-results .fps-ritem{
  display:flex !important;align-items:center !important;gap:12px;
  padding:11px 4px !important;width:auto !important;height:auto !important;
  text-decoration:none !important;color:var(--fps-ink) !important;
  border-bottom:1px solid rgba(26,18,16,.07) !important;
  border-radius:0 !important;
}
#fps-results .fps-ritem:active{background:#FAF8F7;}
#fps-results .fps-ritem-img{
  flex:0 0 auto;width:52px;height:52px;border-radius:10px;overflow:hidden;
  background:var(--fps-tint);
}
#fps-results .fps-ritem-img img{width:100%;height:100%;object-fit:cover;display:block;}
#fps-results .fps-ritem-body{flex:1 1 auto;min-width:0;}
#fps-results .fps-ritem-name{font-size:13.5px;line-height:1.35;color:var(--fps-ink);}
#fps-results .fps-ritem-meta{display:flex;align-items:center;gap:8px;margin-top:3px;}
#fps-results .fps-ritem-price{font-size:13px;font-weight:600;color:var(--fps-brand);}
.fps-ritem-price del{font-weight:400;color:var(--fps-muted);font-size:11.5px;}
.fps-ritem-price ins{text-decoration:none;}
.fps-tag{
  font-size:9.5px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;
  color:#1F7A4D;background:#E6F5EC;border-radius:4px;padding:2px 6px;
}
.fps-tag.is-out{color:#9A6A00;background:#FFF3DA;}
#fps-results .fps-ritem-cta{
  flex:0 0 auto;font-size:12px;font-weight:700;color:var(--fps-brand);
  border:1.4px solid var(--fps-brand);border-radius:999px;padding:7px 15px;
  background:#fff;white-space:nowrap;
}
#fps-results .fps-results-all{
  display:block !important;text-align:center !important;
  margin-top:18px !important;padding:14px !important;width:auto !important;height:auto !important;
  border-radius:14px !important;
  background:var(--fps-tint) !important;color:var(--fps-brand) !important;
  font-size:14px !important;font-weight:700 !important;text-decoration:none !important;
}
.fps-empty{padding:30px 6px;text-align:center;color:var(--fps-muted);font-size:14px;}
.fps-skel{height:72px;border-radius:10px;background:linear-gradient(90deg,#F4F1EF 25%,#EAE5E2 37%,#F4F1EF 63%);background-size:400% 100%;animation:fps-shine 1.2s infinite;margin-bottom:8px;}
@keyframes fps-shine{0%{background-position:100% 0}100%{background-position:-100% 0}}

/* --------------------------------------------------------- drawer */

#fps-scrim.fps-scrim{
  position:fixed;inset:0;z-index:100015;background:rgba(20,12,10,.45);
  opacity:0;transition:opacity .22s ease;backdrop-filter:blur(1px);
}
#fps-vscrim{
  position:fixed;inset:0;z-index:100005;
  background:rgba(20,12,10,.5);opacity:0;
  transition:opacity .22s ease;
}
.fps-scrim.is-open,#fps-vscrim.is-open{opacity:1;}

#fps-drawer.fps-drawer{
  position:fixed !important;
  top:0 !important;left:0 !important;bottom:0 !important;right:auto !important;
  z-index:100020 !important;
  width:88vw !important;max-width:380px !important;height:100% !important;
  margin:0 !important;padding:0 !important;
  background:#fff !important;
  display:flex !important;flex-direction:column !important;
  visibility:visible !important;opacity:1 !important;
  float:none !important;clear:none !important;
  transform:translateX(-102%);
  transition:transform .26s cubic-bezier(.32,.72,0,1);
  box-shadow:0 0 40px rgba(0,0,0,.18);
  overflow:hidden;
}
#fps-drawer.fps-drawer.is-open{transform:translateX(0) !important;}
.fps-dtop{
  flex:0 0 auto;
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:calc(14px + env(safe-area-inset-top)) 14px 14px 20px;
  border-bottom:1px solid rgba(26,18,16,.08);
  background:#fff;
}
.fps-dtop-logo{display:flex;align-items:center;text-decoration:none;min-width:0;}
#fps-drawer .fps-dtop-logo img{
  height:25px !important;width:auto !important;
  max-width:150px !important;
  object-fit:contain;display:block;
}

#fps-drawer .fps-dclose{
  flex:0 0 auto;
  width:38px !important;height:38px !important;
  border-radius:50% !important;
  background:rgba(26,18,16,.06) !important;color:var(--fps-ink) !important;
  display:flex !important;align-items:center !important;justify-content:center !important;
}
#fps-drawer .fps-dclose:active{background:rgba(26,18,16,.13) !important;}
#fps-drawer .fps-dclose svg{width:19px !important;height:19px !important;stroke:currentColor !important;fill:none !important;}

.fps-dbody{
  flex:1 1 auto;min-height:0;
  overflow-y:auto;-webkit-overflow-scrolling:touch;
  overscroll-behavior:contain;
  padding:0 0 26px;
  background:#FBF9F8;
}

/* ---- account card ---- */
.fps-acct{
  display:flex;align-items:center;gap:13px;
  margin:16px 16px 0;padding:15px 16px;
  border-radius:20px;
  background:linear-gradient(135deg,var(--fps-brand) 0%,#B00410 100%);
  box-shadow:0 8px 22px rgba(227,6,19,.22);
  text-decoration:none;
}
.fps-acct:active{transform:scale(.985);}
.fps-acct-avatar{
  flex:0 0 auto;width:44px;height:44px;border-radius:50%;
  background:rgba(255,255,255,.2);color:#fff;
  display:flex;align-items:center;justify-content:center;
  font-size:18px;font-weight:800;
}
.fps-acct-avatar svg{width:22px;height:22px;stroke:currentColor;fill:none;}
.fps-acct-text{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:2px;}
.fps-acct-text strong{
  font-size:15.5px;font-weight:700;color:#fff;line-height:1.25;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.fps-acct-text small{font-size:11.5px;color:rgba(255,255,255,.82);line-height:1.3;}
.fps-acct-go{flex:0 0 auto;color:rgba(255,255,255,.9);}
.fps-acct-go svg{width:17px;height:17px;stroke:currentColor;fill:none;}

/* ---- quick actions ---- */
.fps-quick{display:flex;gap:9px;padding:12px 16px 0;}
.fps-quick-item{
  flex:1 1 0;min-width:0;
  display:flex;flex-direction:column;align-items:center;gap:7px;
  padding:14px 6px;border-radius:16px;
  background:#fff;border:1px solid rgba(26,18,16,.07);
  box-shadow:0 1px 3px rgba(26,18,16,.04);
  text-decoration:none;
  font-size:11.5px;font-weight:600;color:var(--fps-ink);
  text-align:center;
}
.fps-quick-item:active{background:var(--fps-tint);}
.fps-quick-ico{
  width:34px;height:34px;border-radius:50%;
  background:var(--fps-tint);color:var(--fps-brand);
  display:flex;align-items:center;justify-content:center;
}
.fps-quick-ico svg{width:18px;height:18px;}

/* ---- section heads ---- */
.fps-sec{
  display:flex;align-items:center;justify-content:space-between;
  padding:24px 18px 0;
}
.fps-sec-title{
  font-size:11.5px;font-weight:800;letter-spacing:.09em;text-transform:uppercase;
  color:#9A8A83;
}
.fps-sec-link{
  font-size:12px;font-weight:700;color:var(--fps-brand);text-decoration:none;
  background:var(--fps-tint);padding:5px 11px;border-radius:999px;
}

/* ---- category grid ---- */
.fps-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;padding:13px 16px 0;}
.fps-cat{
  display:flex;flex-direction:column;align-items:center;gap:8px;
  padding:12px 6px 13px;border-radius:16px;
  background:#fff;border:1px solid rgba(26,18,16,.07);
  text-decoration:none;
  transition:transform .14s ease,box-shadow .14s ease;
}
.fps-cat:active{transform:scale(.96);box-shadow:0 4px 14px rgba(26,18,16,.1);}
.fps-cat-img{
  width:52px;height:52px;border-radius:50%;overflow:hidden;
  background:var(--fps-tint);display:block;
}
.fps-cat-img img{width:100%;height:100%;object-fit:cover;display:block;}
.fps-cat-name{
  font-size:11px;font-weight:600;color:var(--fps-ink);
  line-height:1.25;text-align:center;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}

/* ---- bestsellers ---- */
.fps-hscroll{
  display:flex;gap:10px;overflow-x:auto;padding:13px 16px 2px;
  scrollbar-width:none;-ms-overflow-style:none;
  scroll-snap-type:x proximity;overscroll-behavior-x:contain;
}
.fps-hscroll::-webkit-scrollbar{display:none;}
.fps-pcard{
  flex:0 0 auto;width:122px;display:flex;flex-direction:column;
  border-radius:16px;overflow:hidden;text-decoration:none;color:inherit;
  background:#fff;border:1px solid rgba(26,18,16,.07);
  scroll-snap-align:start;
}
.fps-pcard:active{transform:scale(.97);}
.fps-pcard-img{display:block;height:84px;background:var(--fps-tint);overflow:hidden;}
.fps-pcard-img img{width:100%;height:100%;object-fit:cover;display:block;}
.fps-pcard-name{
  padding:9px 10px 3px;font-size:11px;line-height:1.35;color:var(--fps-ink);
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
.fps-pcard-price{padding:0 10px 10px;font-size:11.5px;font-weight:700;color:var(--fps-brand);}
.fps-pcard-price del{font-weight:400;color:#9A8A83;font-size:10px;}
.fps-pcard-price ins{text-decoration:none;}

/* ---- banner ---- */
.fps-banner{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  margin:22px 16px 0;padding:17px 18px;
  border-radius:18px;background:var(--fps-ink);text-decoration:none;
}
.fps-banner-text{display:flex;flex-direction:column;gap:4px;min-width:0;}
.fps-banner-kicker{
  font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
  color:#E9A79F;
}
.fps-banner-head{font-size:14.5px;font-weight:700;color:#fff;line-height:1.32;}
.fps-banner-cta{
  flex:0 0 auto;display:flex;align-items:center;gap:4px;
  font-size:11.5px;font-weight:700;color:#fff;
  background:rgba(255,255,255,.15);padding:8px 12px;border-radius:999px;
}
.fps-banner-cta svg{width:12px;height:12px;stroke:currentColor;fill:none;}

/* ---- links ---- */
.fps-links{margin:22px 16px 0;border-radius:18px;background:#fff;border:1px solid rgba(26,18,16,.07);overflow:hidden;}
.fps-links a{
  display:flex;align-items:center;justify-content:space-between;
  padding:15px 16px;font-size:14px;font-weight:500;
  color:var(--fps-ink);text-decoration:none;
  border-bottom:1px solid rgba(26,18,16,.06);
}
.fps-links a:last-child{border-bottom:0;}
.fps-links a:active{background:var(--fps-tint);}
.fps-chev{flex:0 0 auto;color:#B8A9A3;display:flex;}
.fps-chev svg{width:15px;height:15px;stroke:currentColor;fill:none;}

/* ---- socials + note ---- */
.fps-dsocial{display:flex;justify-content:center;gap:12px;padding:26px 16px 0;}
.fps-dsocial a{
  width:38px;height:38px;border-radius:50%;
  background:#fff;border:1px solid rgba(26,18,16,.08);
  color:var(--fps-ink);
  display:flex;align-items:center;justify-content:center;text-decoration:none;
}
.fps-dsocial a:active{background:var(--fps-tint);color:var(--fps-brand);}
.fps-dsocial svg{width:17px;height:17px;fill:currentColor;}
.fps-dnote{
  margin:14px 24px 0;text-align:center;
  font-size:11px;line-height:1.5;color:#A99A94;
}

/* ----------------------------------------------------- voice sheet */

.fps-voice{
  position:fixed;inset:0;z-index:100010;
  display:flex;align-items:flex-end;justify-content:center;
  pointer-events:none;
}
.fps-voice.is-open{pointer-events:auto;}

/* floating close button, sits above the sheet like Blinkit's */
#fps-voice .fps-voice-x{
  position:absolute !important;
  top:14px !important;right:16px !important;left:auto !important;
  width:38px !important;height:38px !important;
  border-radius:50% !important;
  background:rgba(26,18,16,.07) !important;
  color:var(--fps-ink) !important;
  display:flex !important;align-items:center !important;justify-content:center !important;
  z-index:4;
}
#fps-voice .fps-voice-x:active{background:rgba(26,18,16,.14) !important;}
#fps-voice .fps-voice-x svg{width:19px !important;height:19px !important;stroke:currentColor !important;fill:none !important;}

.fps-voice-sheet{
  position:relative;
  overflow:visible;
  width:100%;max-width:720px;
  border-radius:26px 26px 0 0;
  padding:34px 22px calc(20px + var(--fps-tab-h) + env(safe-area-inset-bottom));
  min-height:62vh;
  display:flex;flex-direction:column;
  background:
    radial-gradient(120% 70% at 12% 4%, #FFE9E4 0%, rgba(255,233,228,0) 58%),
    radial-gradient(110% 60% at 92% 8%, #FFF0C9 0%, rgba(255,240,201,0) 62%),
    linear-gradient(180deg,#FFF8F4 0%,#FFFFFF 46%);
  transform:translateY(102%);
  transition:transform .34s cubic-bezier(.32,.72,0,1);
  box-shadow:0 -10px 44px rgba(0,0,0,.2);
}
.fps-voice.is-open .fps-voice-sheet{transform:translateY(0);}

#fps-voice .fps-voice-title{
  font-size:29px;line-height:1.16;font-weight:800;letter-spacing:-.02em;
  color:var(--fps-ink);margin:0;padding:0 46px;text-align:center;
}

/* chat bubbles */
.fps-bubbles{
  display:flex;flex-direction:column;gap:11px;
  margin:26px 0 0;
}
#fps-voice .fps-bubble{
  display:flex !important;align-items:center !important;gap:11px;
  width:auto !important;max-width:86% !important;
  padding:13px 17px !important;
  border-radius:18px !important;
  background:rgba(255,255,255,.94) !important;
  box-shadow:0 2px 12px rgba(90,50,40,.10) !important;
  color:var(--fps-ink) !important;
  position:relative;
  transition:transform .14s ease !important;
}
#fps-voice .fps-bubble.is-left{align-self:flex-start;border-bottom-left-radius:6px !important;}
#fps-voice .fps-bubble.is-right{align-self:flex-end;border-bottom-right-radius:6px !important;}

/* little tail under the bubble */
#fps-voice .fps-bubble::after{
  content:'' !important;display:block !important;
  position:absolute;bottom:-6px;width:14px;height:14px;
  background:inherit;
  clip-path:polygon(0 0,100% 0,0 100%);
}
#fps-voice .fps-bubble.is-left::after{left:12px;}
#fps-voice .fps-bubble.is-right::after{right:12px;clip-path:polygon(0 0,100% 0,100% 100%);}
#fps-voice .fps-bubble:active{transform:scale(.975) !important;}
#fps-voice .fps-bubble-ico{font-size:18px;line-height:1;flex:0 0 auto;}
#fps-voice .fps-bubble-text{
  font-size:14.5px !important;font-weight:500 !important;line-height:1.35 !important;
  color:var(--fps-ink) !important;
}

#fps-voice .fps-transcript{
  margin:24px 6px 0;text-align:center;
  font-size:21px;font-weight:800;line-height:1.32;color:var(--fps-ink);
  letter-spacing:-.015em;
}
#fps-voice .fps-transcript.is-interim{color:#8A7A73;font-weight:600;}

/* footer: status + pill */
.fps-voice-foot{margin-top:auto;padding-top:26px;}
.fps-voice-status{
  display:block;text-align:center;
  font-size:13.5px;font-weight:700;color:var(--fps-ink);
  margin-bottom:13px;
}

.fps-pill{
  display:flex;align-items:center;justify-content:space-between;
  gap:10px;padding:7px;
  border-radius:999px;
  background:linear-gradient(90deg,#FFFFFF 0%,#FFF6F2 50%,#FFF1EC 100%);
  box-shadow:0 4px 22px rgba(90,50,40,.14),inset 0 0 0 1px rgba(26,18,16,.05);
}
#fps-voice .fps-pill-btn.is-disabled{opacity:.45;}
#fps-voice .fps-pill-btn{
  flex:0 0 auto;
  width:60px !important;height:60px !important;
  border-radius:50% !important;
  display:flex !important;align-items:center !important;justify-content:center !important;
}
#fps-voice .fps-pill-btn svg{width:23px !important;height:23px !important;stroke:currentColor !important;fill:none !important;}
#fps-voice .fps-pill-cancel{
  background:#FFFFFF !important;color:var(--fps-ink) !important;
  box-shadow:0 2px 10px rgba(90,50,40,.14) !important;
}
#fps-voice .fps-pill-go{
  background:var(--fps-brand) !important;color:#fff !important;
  box-shadow:0 3px 14px rgba(227,6,19,.34) !important;
}
#fps-voice .fps-pill-go:disabled{
  background:#E8E2DF !important;color:#B0A49F !important;
  box-shadow:none !important;cursor:default;
}
#fps-voice .fps-pill-go:not(:disabled){animation:fps-ready .5s ease;}
@keyframes fps-ready{0%{transform:scale(.86);}60%{transform:scale(1.07);}100%{transform:scale(1);}}

/* waveform lives inside the pill */
.fps-voice-wave{
  flex:1 1 auto;
  display:flex;align-items:center;justify-content:center;gap:3px;
  height:34px;overflow:hidden;
}
#fps-voice .fps-voice-wave i{
  width:3px;border-radius:2px;background:var(--fps-ink);
  height:5px;opacity:.72;transition:height .09s linear;
}

/* ------------------------------------------------------- tab bar */

.fps-tabbar{
  position:fixed;left:0;right:0;bottom:0;z-index:99992;
  display:flex;align-items:stretch;
  background:#fff;border-top:1px solid var(--fps-line);
  padding-bottom:env(safe-area-inset-bottom);
  max-width:720px;margin:0 auto;
}
nav.fps-tabbar a.fps-tab{
  flex:1 1 0;display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:3px;padding:9px 2px;text-decoration:none;color:var(--fps-muted);
  font-size:10.5px;line-height:1.2;text-align:center;
  -webkit-tap-highlight-color:transparent;
}
nav.fps-tabbar .fps-tab svg{width:22px;height:22px;}
nav.fps-tabbar a.fps-tab.is-active{color:var(--fps-brand);font-weight:600;}
.fps-tab-icon{position:relative;display:block;line-height:0;}
.fps-tab-badge{
  position:absolute;top:-5px;right:-8px;min-width:16px;height:16px;padding:0 4px;
  border-radius:9px;background:var(--fps-brand);color:#fff;
  font-size:10px;font-weight:700;display:flex;align-items:center;justify-content:center;
}

body.fps-has-tabbar{padding-bottom:calc(var(--fps-tab-h) + env(safe-area-inset-bottom));}
body.fps-locked{overflow:hidden;overscroll-behavior:none;}
html:has(body.fps-locked){overscroll-behavior:none;}

/* ------------------------------------------------------- desktop */

@media (min-width:900px){
  :root{--fps-h:112px;}
  .fps-header-row{padding:12px 24px 8px;}
  .fps-searchrow{padding:0 24px 12px;}
  .fps-searchbox{height:48px;}
  .fps-tabbar{display:none;}
  body.fps-has-tabbar{padding-bottom:0;}
  #fps-shell .fps-logo img{height:31px !important;max-width:200px !important;}
}

@media (prefers-reduced-motion:reduce){
  .fps-drawer,.fps-voice-sheet,.fps-scrim,.fps-vscrim{transition:none !important;}
  .fps-vbtn-mic.is-live{animation:none;}
  .fps-skel{animation:none;}
}


/* ------------------------------------------------------------------ *
 * Visibility.
 * Deliberately NOT the HTML `hidden` attribute: the !important armour
 * above would override [hidden]{display:none} and leave invisible
 * overlays sitting on top of the page swallowing every tap.
 * The doubled class raises specificity above the single-class rules.
 * ------------------------------------------------------------------ */
.fps-hide.fps-hide{
  display:none !important;
  pointer-events:none !important;
  visibility:hidden !important;
}

/* ------------------------------------------------------------------ *
 * Weather bar + current weather sheet
 * ------------------------------------------------------------------ */
#fps-wx,
#fps-wx .fps-wx-inner,
#fps-wx .fps-wx-ico,
#fps-wx .fps-wx-text,
#fps-wx .fps-wx-text strong,
#fps-wx .fps-wx-text span,
#fps-wx .fps-wx-temp,
#fps-wx .fps-wx-arrow{all:revert !important;box-sizing:border-box !important;}

#fps-wx{display:block !important;position:relative !important;overflow:hidden !important;margin:0 !important;z-index:99991 !important;
  background:linear-gradient(135deg,#F7FAFC 0%,#E7EEF3 100%) !important;color:#20323C !important;font-family:inherit !important;
  cursor:pointer !important;-webkit-tap-highlight-color:transparent !important;
  animation:fps-wx-drop .42s cubic-bezier(.22,1,.36,1) both !important;}
#fps-wx[hidden]{display:none !important;}
#fps-wx::after{content:'' !important;position:absolute !important;left:0;right:0;bottom:0;height:6px;
  background:linear-gradient(90deg,rgba(255,255,255,.18),rgba(255,255,255,.65),rgba(255,255,255,.18)) !important;opacity:.9;}
#fps-wx .fps-wx-inner{max-width:720px !important;margin:0 auto !important;padding:8px 48px 10px 14px !important;
  min-height:58px;display:flex !important;align-items:center !important;gap:10px !important;position:relative !important;}
#fps-wx .fps-wx-ico{width:34px !important;height:34px !important;flex:0 0 34px !important;border-radius:12px !important;
  display:flex !important;align-items:center !important;justify-content:center !important;background:rgba(255,255,255,.65) !important;
  color:#315B7B !important;box-shadow:inset 0 0 0 1px rgba(255,255,255,.75),0 4px 12px rgba(29,53,70,.08) !important;}
#fps-wx .fps-wx-ico svg{display:block !important;width:22px !important;height:22px !important;max-width:none !important;overflow:visible !important;fill:none !important;}
#fps-wx .fps-wx-ico svg [stroke]{stroke:currentColor !important;}
#fps-wx .fps-wx-ico svg [fill="currentColor"]{fill:currentColor !important;}
#fps-wx .fps-wx-text{display:flex !important;flex-direction:column !important;gap:1px !important;min-width:0 !important;flex:1 1 auto !important;}
#fps-wx .fps-wx-text strong{display:block !important;margin:0 !important;font-size:13px !important;line-height:1.2 !important;font-weight:750 !important;letter-spacing:-.01em !important;color:inherit !important;}
#fps-wx .fps-wx-text span{display:block !important;margin:0 !important;font-size:11.5px !important;line-height:1.3 !important;color:inherit !important;opacity:.66 !important;}
#fps-wx .fps-wx-temp{display:block !important;flex:0 0 auto !important;font-size:18px !important;line-height:1 !important;font-weight:750 !important;letter-spacing:-.03em !important;color:inherit !important;}
#fps-wx .fps-wx-arrow{width:18px !important;height:18px !important;display:flex !important;align-items:center !important;justify-content:center !important;flex:0 0 18px !important;opacity:.5 !important;color:inherit !important;}
#fps-wx .fps-wx-arrow svg{width:15px !important;height:15px !important;display:block !important;stroke:currentColor !important;}
#fps-wx button,.fps-wx-sheet button{-webkit-appearance:none !important;appearance:none !important;border:0 !important;margin:0 !important;text-transform:none !important;letter-spacing:normal !important;font:inherit !important;text-shadow:none !important;outline:0 !important;cursor:pointer !important;box-shadow:none !important;}
.fps-wx-sheet__x{width:34px !important;height:34px !important;padding:0 !important;background:#EDF1F3 !important;border-radius:50% !important;color:#61717A !important;display:flex !important;align-items:center !important;justify-content:center !important;}
.fps-wx-sheet__x:hover,.fps-wx-sheet__x:focus{background:#E6ECEF !important;color:#4E626D !important;}
#fps-wx .fps-wx-close{position:absolute !important;right:10px !important;top:50% !important;transform:translateY(-50%) !important;width:32px !important;height:32px !important;border:0 !important;border-radius:50% !important;background:rgba(255,255,255,.72) !important;color:inherit !important;display:flex !important;align-items:center !important;justify-content:center !important;padding:0 !important;cursor:pointer !important;box-shadow:inset 0 0 0 1px rgba(20,40,50,.06) !important;}
#fps-wx .fps-wx-close svg{width:16px !important;height:16px !important;stroke:currentColor !important;display:block !important;}
#fps-wx .fps-wx-close:hover{background:rgba(255,255,255,.9) !important;}

/* Stronger visual language for actual advisories. */
#fps-wx.fps-wx--advisory{box-shadow:inset 0 -1px 0 rgba(255,255,255,.45),0 3px 14px rgba(40,28,20,.08) !important;}
#fps-wx.fps-wx--advisory .fps-wx-inner{min-height:64px;padding-top:9px !important;padding-bottom:11px !important;}
#fps-wx.fps-wx--advisory .fps-wx-ico{width:38px !important;height:38px !important;flex-basis:38px !important;}
#fps-wx.fps-wx--advisory .fps-wx-text strong{font-size:14px !important;}
#fps-wx.fps-wx--rain{background:linear-gradient(135deg,#E9F1FF,#D7E5FA) !important;color:#1B4A8A !important;}
#fps-wx.fps-wx--heat{background:linear-gradient(135deg,#FFF1DF,#FFE0C4) !important;color:#9A4C13 !important;}
#fps-wx.fps-wx--cold{background:linear-gradient(135deg,#E8F6FB,#D5ECF7) !important;color:#12617B !important;}
#fps-wx.fps-wx--haze{background:linear-gradient(135deg,#EDF2F5,#DDE7EC) !important;color:#45606E !important;}
#fps-wx.fps-wx--offline{background:linear-gradient(135deg,#F0F2F4,#E4E8EB) !important;color:#68737B !important;}

#fps-wx .wx-drop{animation:fps-wx-fall 1.4s linear infinite !important;}
#fps-wx .wx-drop:nth-of-type(2){animation-delay:.45s !important;}
#fps-wx .wx-drop:nth-of-type(3){animation-delay:.9s !important;}
@keyframes fps-wx-fall{0%{opacity:0;transform:translateY(-2px)}25%{opacity:1}75%{opacity:1}100%{opacity:0;transform:translateY(5px)}}
#fps-wx .wx-bolt{animation:fps-wx-flash 2.4s ease-in-out infinite !important;}
@keyframes fps-wx-flash{0%,58%,100%{opacity:.35}62%,72%{opacity:1}66%{opacity:.4}}
#fps-wx .wx-rays{transform-origin:12px 12px !important;animation:fps-wx-spin 14s linear infinite !important;}
@keyframes fps-wx-spin{to{transform:rotate(360deg)}}

/* Current-weather sheet. */
body.fps-wx-sheet-open{overflow:hidden !important;overscroll-behavior:none !important;}
.fps-wx-sheet[hidden]{display:none !important;}
.fps-wx-sheet{position:fixed !important;inset:0 !important;z-index:2147483001 !important;display:flex !important;align-items:flex-end !important;justify-content:center !important;font-family:inherit !important;}
.fps-wx-sheet__scrim{position:absolute;inset:0;background:rgba(17,25,31,.52);backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);opacity:0;transition:opacity .28s ease;}
.fps-wx-sheet.is-on .fps-wx-sheet__scrim{opacity:1;}
.fps-wx-sheet__panel{position:relative;width:100%;max-width:560px;height:min(88dvh,720px);background:#F8FAFB;border-radius:30px 30px 0 0;overflow:hidden;display:flex;flex-direction:column;
  box-shadow:0 -24px 70px rgba(12,22,28,.30);transform:translateY(102%);transition:transform .42s cubic-bezier(.22,1,.36,1);padding-bottom:env(safe-area-inset-bottom);}
.fps-wx-sheet.is-on .fps-wx-sheet__panel{transform:translateY(0);}
.fps-wx-sheet__grip{position:absolute;top:9px;left:50%;transform:translateX(-50%);width:40px;height:4px;border-radius:99px;background:rgba(20,34,43,.16);z-index:5;}
.fps-wx-sheet__head{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:24px 20px 16px;position:relative;z-index:3;background:#F8FAFB;}
.fps-wx-sheet__eyebrow{display:block;font-size:10px;letter-spacing:.12em;font-weight:800;color:#8A969D;margin-bottom:5px;}
.fps-wx-sheet__head h2{margin:0;font-size:20px;line-height:1.2;font-weight:780;letter-spacing:-.025em;color:#182832;}
.fps-wx-sheet__x{width:34px;height:34px;border:0;border-radius:50%;display:flex;align-items:center;justify-content:center;background:#EDF1F3;color:#61717A;cursor:pointer;}
.fps-wx-sheet__x svg{width:17px;height:17px;stroke:currentColor;}
.fps-wx-sheet__body{overflow:auto;flex:1;padding:0 20px 30px;}

/* Premium weather story scene. Built from SVG + CSS so it stays crisp, fast and
 * works without external animation files. The visual language intentionally
 * follows the cinematic weather-card feel seen in the reference video:
 * one expressive character, environmental motion, depth and a clear weather
 * story rather than a static icon. */
.fps-wx-scene{height:278px;border-radius:28px;overflow:hidden;position:relative;background:linear-gradient(180deg,#89A9BC 0%,#D8E1E4 62%,#DCE5DF 63%,#6D8D73 64%,#4D7158 100%);margin-bottom:20px;isolation:isolate;box-shadow:inset 0 1px 0 rgba(255,255,255,.55),0 18px 38px rgba(34,52,61,.13);}
.fps-wx-scene::before{content:'';position:absolute;inset:0;background:radial-gradient(circle at 68% 20%,rgba(255,255,255,.36),transparent 27%),linear-gradient(112deg,rgba(255,255,255,.10),transparent 43%,rgba(255,255,255,.13));z-index:0;}
.fps-wx-scene::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,transparent 58%,rgba(18,42,31,.18));pointer-events:none;z-index:9;}
.fps-wx-sky-glow{position:absolute;left:57%;top:22px;width:128px;height:128px;border-radius:50%;background:rgba(255,255,255,.22);filter:blur(4px);z-index:0;animation:fps-wx-glow 4s ease-in-out infinite;}
@keyframes fps-wx-glow{0%,100%{transform:scale(.95);opacity:.62}50%{transform:scale(1.08);opacity:1}}
.fps-wx-orbit{position:absolute;border:1px solid rgba(255,255,255,.22);border-radius:50%;z-index:1;animation:fps-wx-orbit 12s linear infinite;}
.fps-wx-orbit--one{width:190px;height:190px;right:-70px;top:-76px;}
.fps-wx-orbit--two{width:112px;height:112px;right:20px;top:38px;animation-duration:8s;animation-direction:reverse;}
@keyframes fps-wx-orbit{to{transform:rotate(360deg)}}
.fps-wx-ground{position:absolute;left:-8%;right:-8%;bottom:-18px;height:102px;background:linear-gradient(180deg,rgba(83,124,92,.58),rgba(44,77,56,.94));border-radius:50% 50% 0 0/28% 28% 0 0;z-index:2;box-shadow:0 -12px 28px rgba(42,73,54,.14);}
.fps-wx-ground::before{content:'';position:absolute;left:7%;right:5%;top:15px;height:2px;background:rgba(221,240,222,.22);filter:blur(1px);}
.fps-wx-cloud{position:absolute;width:120px;height:34px;border-radius:34px;background:rgba(248,252,253,.32);filter:blur(1px);animation:fps-wx-cloud 18s linear infinite;z-index:1;}
.fps-wx-cloud::before,.fps-wx-cloud::after{content:'';position:absolute;border-radius:50%;background:inherit;}
.fps-wx-cloud::before{width:48px;height:48px;left:18px;bottom:7px;}
.fps-wx-cloud::after{width:62px;height:62px;left:54px;bottom:4px;}
.fps-wx-cloud--one{left:-126px;top:55px;}
.fps-wx-cloud--two{left:-260px;top:105px;transform:scale(.72);animation-name:fps-wx-cloud2;animation-duration:23s;opacity:.65;}
@keyframes fps-wx-cloud{to{transform:translateX(860px)}}
@keyframes fps-wx-cloud2{to{transform:translateX(960px) scale(.72)}}

.fps-wx-girl{position:absolute;z-index:5;left:54%;bottom:38px;width:112px;height:188px;transform:translateX(-50%);animation:fps-wx-walk-in .9s cubic-bezier(.22,1,.36,1) both, fps-wx-breathe 2.8s ease-in-out 1s infinite;filter:drop-shadow(0 12px 10px rgba(23,36,32,.20));}
.fps-wx-girl-svg{position:absolute;left:8px;top:0;width:112px;height:188px;overflow:visible;}
.girl-character{transform-origin:76px 185px;animation:fps-wx-character-sway 1.05s ease-in-out infinite;}
@keyframes fps-wx-walk-in{from{transform:translate(-50%,96px) scale(.94);opacity:0}to{transform:translate(-50%,0) scale(1);opacity:1}}
@keyframes fps-wx-breathe{0%,100%{margin-bottom:0}50%{margin-bottom:3px}}
@keyframes fps-wx-character-sway{0%,100%{transform:rotate(-1.2deg)}50%{transform:rotate(1.2deg)}}
.girl-shadow{animation:fps-wx-shadow 1.05s ease-in-out infinite;}
@keyframes fps-wx-shadow{0%,100%{transform:scaleX(.88);opacity:.42}50%{transform:scaleX(1.05);opacity:.72}}
.girl-arm{transform-origin:top center;}
.girl-arm--a{animation:fps-wx-arm-a 1.05s ease-in-out infinite alternate;}
.girl-arm--b{animation:fps-wx-arm-b 1.05s ease-in-out .08s infinite alternate;}
@keyframes fps-wx-arm-a{to{transform:rotate(-9deg) translateY(-2px)}}
@keyframes fps-wx-arm-b{to{transform:rotate(11deg) translateY(2px)}}
.girl-leg{transform-origin:top center;}
.girl-leg--a{animation:fps-wx-leg-a 1.05s ease-in-out infinite alternate;}
.girl-leg--b{animation:fps-wx-leg-b 1.05s ease-in-out .08s infinite alternate;}
@keyframes fps-wx-leg-a{to{transform:rotate(-12deg) translateY(-2px)}}
@keyframes fps-wx-leg-b{to{transform:rotate(14deg) translateY(1px)}}
.fps-wx-girl::before{content:'';position:absolute;left:8px;top:8px;width:100px;height:178px;border-radius:50%;background:radial-gradient(circle at 54% 28%,rgba(255,255,255,.13),transparent 34%);pointer-events:none;z-index:8;}
.fps-wx-girl::after{content:'';position:absolute;left:-80px;top:-35px;width:270px;height:250px;pointer-events:none;z-index:10;opacity:0;}

.fps-wx-scene--rain{background:linear-gradient(180deg,#637F99 0%,#AFC0CB 60%,#C9D4D4 61%,#57766C 63%,#3F624F 100%);}
.fps-wx-scene--rain .fps-wx-sky-glow{background:rgba(188,222,238,.28);box-shadow:0 0 60px rgba(170,216,240,.28);}
.fps-wx-scene--rain .fps-wx-cloud{background:rgba(223,235,242,.38);}
.fps-wx-scene--rain .fps-wx-ground{background:linear-gradient(180deg,rgba(71,108,91,.58),rgba(35,63,51,.96));}
.fps-wx-scene--rain .fps-wx-girl-svg{filter:drop-shadow(0 3px 2px rgba(255,255,255,.08));}
.fps-wx-scene--rain .fps-wx-girl::after{opacity:1;background:radial-gradient(ellipse at 54% 84%,rgba(210,239,255,.20) 0 12%,transparent 13%),repeating-linear-gradient(105deg,transparent 0 13px,rgba(235,247,255,.52) 14px 15px,transparent 16px 32px);animation:fps-wx-rain 1.1s linear infinite;}
@keyframes fps-wx-rain{to{transform:translateY(44px)}}
.fps-wx-scene--rain .fps-wx-girl::before{background:radial-gradient(circle at 54% 28%,rgba(255,255,255,.18),transparent 34%);}
.fps-wx-scene--rain .fps-wx-ground::after{content:'';position:absolute;left:12%;right:10%;bottom:18px;height:28px;background:repeating-radial-gradient(ellipse at center,rgba(202,239,238,.22) 0 1px,transparent 2px 12px);opacity:.7;animation:fps-wx-puddles 1.5s ease-in-out infinite;}
@keyframes fps-wx-puddles{0%,100%{transform:scaleX(.92);opacity:.45}50%{transform:scaleX(1.06);opacity:.85}}

.fps-wx-scene--heat{background:linear-gradient(180deg,#E79A58 0%,#F5C98B 48%,#EED9B7 62%,#A2A45F 63%,#6C8052 100%);}
.fps-wx-scene--heat .fps-wx-sky-glow{left:58%;top:8px;width:142px;height:142px;background:rgba(255,241,170,.56);box-shadow:0 0 70px rgba(255,205,78,.52);animation:fps-wx-sun-pulse 3s ease-in-out infinite;}
@keyframes fps-wx-sun-pulse{0%,100%{transform:scale(.94);opacity:.74}50%{transform:scale(1.08);opacity:1}}
.fps-wx-scene--heat .fps-wx-orbit{border-color:rgba(255,244,198,.34);}
.fps-wx-scene--heat .fps-wx-ground{background:linear-gradient(180deg,rgba(146,143,79,.55),rgba(89,103,67,.96));}
.fps-wx-scene--heat .fps-wx-girl-svg{filter:drop-shadow(0 13px 9px rgba(96,52,22,.18));}
.fps-wx-scene--heat .fps-wx-girl::after{opacity:1;background:radial-gradient(circle at 20% 35%,rgba(255,255,255,.24) 0 1px,transparent 2px),radial-gradient(circle at 80% 50%,rgba(255,255,255,.20) 0 1px,transparent 2px);background-size:38px 38px,52px 52px;animation:fps-wx-heat-particles 5s linear infinite;}
@keyframes fps-wx-heat-particles{to{transform:translateY(-12px) translateX(7px);opacity:.2}}
.fps-wx-scene--heat .fps-wx-girl-svg .girl-dress{fill:url(#fpsGirlDress);}
.fps-wx-scene--heat .fps-wx-girl-svg .girl-character{animation:fps-wx-heat-sway 1.8s ease-in-out infinite;}
@keyframes fps-wx-heat-sway{0%,100%{transform:rotate(-1deg)}50%{transform:rotate(1deg) translateY(1px)}}
.fps-wx-scene--heat .fps-wx-ground::after{content:'';position:absolute;left:14%;bottom:34px;width:72%;height:18px;border-radius:50%;background:rgba(255,223,150,.16);filter:blur(9px);animation:fps-wx-shimmer 2.8s ease-in-out infinite;}
@keyframes fps-wx-shimmer{0%,100%{transform:scaleX(.9);opacity:.35}50%{transform:scaleX(1.1);opacity:.75}}

.fps-wx-scene--haze{background:linear-gradient(180deg,#90A6B1,#CDD6D8 62%,#DCE2DE 63%,#73887B 64%,#607766 100%);}
.fps-wx-scene--clear{background:linear-gradient(180deg,#65A6CE,#C9E1EA 62%,#DFEBE4 63%,#78A173 64%,#5D815F 100%);}
.fps-wx-scene--snow{background:linear-gradient(180deg,#9DB9CB,#E5EDF0 62%,#F4F7F6 63%,#C9D9D9 64%,#AFC5C2 100%);}

.fps-wx-weather-glyph{position:absolute;right:18px;top:18px;width:62px;height:62px;border-radius:50%;background:rgba(255,255,255,.18);border:1px solid rgba(255,255,255,.32);display:flex;align-items:center;justify-content:center;color:rgba(255,255,255,.96);z-index:11;box-shadow:0 10px 24px rgba(27,43,52,.10);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);}
.fps-wx-weather-glyph::after{content:'';position:absolute;inset:5px;border-radius:50%;border:1px solid rgba(255,255,255,.18);animation:fps-wx-glyph-ring 2.6s ease-in-out infinite;}
@keyframes fps-wx-glyph-ring{0%,100%{transform:scale(.94);opacity:.35}50%{transform:scale(1.03);opacity:.8}}
.fps-wx-weather-glyph svg{width:34px;height:34px;display:block;fill:none;position:relative;z-index:2;}
.fps-wx-scene-caption{position:absolute;left:18px;bottom:15px;padding:7px 11px;border-radius:999px;background:rgba(17,35,39,.26);border:1px solid rgba(255,255,255,.20);color:rgba(255,255,255,.95);font-size:10px;font-weight:800;letter-spacing:.05em;backdrop-filter:blur(7px);z-index:12;box-shadow:0 5px 16px rgba(18,31,34,.08);}

/* Rain umbrella: a translucent canopy and moving shaft make the character
 * read as a weather story at a glance, not just a weather icon. */
.fps-wx-scene--rain .girl-weather-accessory{position:absolute;left:56px;top:63px;width:3px;height:3px;z-index:12;animation:fps-wx-umbrella-sway 1.3s ease-in-out infinite;}
.fps-wx-scene--rain .girl-weather-accessory::before{content:'';position:absolute;left:-28px;top:-74px;width:116px;height:58px;border-radius:116px 116px 10px 10px;background:linear-gradient(160deg,rgba(255,255,255,.82),rgba(105,184,191,.92));border:2px solid rgba(255,255,255,.62);box-shadow:0 7px 16px rgba(26,74,87,.16);transform:rotate(-5deg);transform-origin:50% 100%;}
.fps-wx-scene--rain .girl-weather-accessory::after{content:'';position:absolute;left:29px;top:-31px;width:2px;height:83px;background:rgba(41,67,75,.72);border-radius:2px;transform:rotate(-5deg);transform-origin:top center;}
@keyframes fps-wx-umbrella-sway{0%,100%{transform:rotate(-1deg) translateY(0)}50%{transform:rotate(2deg) translateY(-2px)}}

/* Heat accessory: a soft sunhat silhouette sits above the character and
 * gently bobs with the walking loop. */
.fps-wx-scene--heat .girl-weather-accessory{position:absolute;left:55px;top:26px;width:4px;height:4px;z-index:12;}
.fps-wx-scene--heat .girl-weather-accessory::before{content:'';position:absolute;left:-25px;top:-18px;width:58px;height:24px;border-radius:50%;border:4px solid #FFF2C5;border-bottom:0;transform:rotate(-6deg);box-shadow:0 2px 0 rgba(174,91,29,.18);}
.fps-wx-scene--heat .girl-weather-accessory::after{content:'';position:absolute;left:-10px;top:-9px;width:30px;height:18px;border-radius:50%;background:linear-gradient(135deg,#FFF1C4,#FFD17C);box-shadow:0 3px 8px rgba(173,84,22,.12);transform:rotate(-8deg);animation:fps-wx-hat-bob 1.8s ease-in-out infinite;}
@keyframes fps-wx-hat-bob{0%,100%{transform:rotate(-8deg) translateY(0)}50%{transform:rotate(-4deg) translateY(-2px)}}

.fps-wx-mainstat{display:flex;align-items:center;gap:14px;padding:2px 2px 18px;}
#fps-wx-sheet-temp{font-size:58px;line-height:.95;font-weight:350;letter-spacing:-.06em;color:#172A35;}
.fps-wx-mainstat strong{display:block;font-size:18px;line-height:1.2;color:#1B303B;font-weight:750;}.fps-wx-mainstat span{display:block;color:#70808A;font-size:13px;margin-top:4px;}
.fps-wx-stats{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
.fps-wx-stat{padding:15px;border-radius:17px;background:#EEF2F4;border:1px solid rgba(23,42,53,.06);}
.fps-wx-stat span{display:block;color:#829098;font-size:11px;margin-bottom:5px;text-transform:uppercase;letter-spacing:.08em;font-weight:750;}.fps-wx-stat strong{display:block;color:#263B46;font-size:16px;font-weight:700;}
.fps-wx-note{margin:15px 2px 0;color:#78878F;font-size:12px;line-height:1.5;}

@media (prefers-reduced-motion:reduce){
  #fps-wx,#fps-wx .wx-drop,#fps-wx .wx-bolt,#fps-wx .wx-rays,
  .fps-wx-sheet__panel,.fps-wx-cloud,.fps-wx-girl,.fps-wx-sky-glow,.fps-wx-orbit,.girl-shadow,.fps-wx-scene--rain .fps-wx-girl::after,.fps-wx-scene--snow .fps-wx-girl::after,.fps-wx-scene--rain .fps-wx-ground::after,.fps-wx-scene--rain .girl-weather-accessory,.fps-wx-scene--heat .girl-weather-accessory::after{animation:none !important;transition:none !important;}
}
@media (max-width:420px){
  #fps-wx .fps-wx-inner{padding-left:12px !important;padding-right:12px !important;gap:8px !important;}
  #fps-wx .fps-wx-text span{font-size:11px !important;}
  #fps-wx .fps-wx-temp{font-size:16px !important;}
  .fps-wx-sheet__panel{height:91dvh;}
  .fps-wx-scene{height:238px;}
}
