/* ============ FINZO WALLET — compact public landing + shared public footer ============ */
.main.landing-main{padding:0;min-height:100vh;min-height:100dvh;overflow:hidden}
.main.auth-main{padding-bottom:0}
.landing-page{position:relative;min-height:100vh;min-height:100dvh;overflow:hidden;color:var(--text);isolation:isolate}
.landing-ambient{position:absolute;inset:0 0 auto;height:620px;z-index:-1;pointer-events:none;overflow:hidden;background:linear-gradient(180deg,color-mix(in srgb,var(--primary) 7%,var(--bg)),transparent 82%)}
.landing-ambient span{position:absolute;border-radius:50%;filter:blur(2px);opacity:.72;background:linear-gradient(145deg,color-mix(in srgb,var(--primary) 38%,#fff),color-mix(in srgb,var(--primary-dark) 26%,transparent));animation:landingDrift 8s ease-in-out infinite alternate}
.landing-ambient span:nth-child(1){width:230px;height:230px;top:-105px;right:-90px;opacity:.18}
.landing-ambient span:nth-child(2){width:170px;height:170px;top:260px;left:-120px;opacity:.13;animation-delay:-2.4s}
.landing-ambient span:nth-child(3){width:12px;height:12px;top:112px;left:17%;opacity:.45;box-shadow:120px 60px 0 4px color-mix(in srgb,var(--primary) 18%,transparent),260px 175px 0 2px color-mix(in srgb,var(--primary) 25%,transparent);animation-duration:5.5s}
@keyframes landingDrift{to{transform:translate3d(18px,24px,0) scale(1.06)}}
.landing-nav{position:relative;z-index:5;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:18px 18px 8px}
.landing-brand{display:flex;align-items:center;gap:9px;min-width:0}.landing-brand img{width:38px;height:38px;border-radius:12px;box-shadow:0 10px 26px -15px var(--primary)}.landing-brand b{font-size:.88rem;letter-spacing:-.02em;white-space:nowrap}
.landing-support{min-height:38px;padding:0 13px;border-radius:12px;display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1px solid var(--border);background:color-mix(in srgb,var(--surface) 92%,transparent);color:var(--primary);box-shadow:var(--shadow-sm);font-size:.69rem;font-weight:850;white-space:nowrap}.landing-support i{font-size:.82rem}
.landing-hero{display:grid;grid-template-columns:minmax(0,1fr);gap:30px;padding:46px 18px 28px;align-items:center}
.landing-copy{position:relative;z-index:2;text-align:center}.landing-copy h1{max-width:560px;margin:0 auto;font-size:clamp(2rem,8.7vw,3.65rem);line-height:1.04;letter-spacing:-.055em;font-weight:900}.landing-copy h1 span{display:block;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}.landing-copy>p{max-width:520px;margin:15px auto 0;color:var(--text-muted);font-size:.82rem;line-height:1.75;font-weight:550}
.landing-cta-row{width:min(100%,520px);margin:22px auto 0}.landing-primary-cta{width:100%;min-height:50px;border-radius:15px;padding:0 18px;display:inline-flex;align-items:center;justify-content:center;gap:9px;background:var(--grad);color:#fff;font-size:.74rem;font-weight:900;box-shadow:0 16px 32px -18px var(--primary),inset 0 1px 0 rgba(255,255,255,.32);transition:transform .18s var(--ease),box-shadow .18s}.landing-primary-cta:active{transform:translateY(2px);box-shadow:0 9px 20px -16px var(--primary)}.landing-primary-cta i{font-size:.61rem}
.landing-visual{position:relative;width:min(100%,420px);height:250px;margin:0 auto}.landing-glow{position:absolute;left:50%;top:48%;width:250px;height:180px;border-radius:50%;background:color-mix(in srgb,var(--primary) 23%,transparent);filter:blur(46px);transform:translate(-50%,-50%);opacity:.58}
.landing-wallet-card{position:absolute;left:50%;top:50%;width:min(86%,330px);min-height:184px;padding:20px;border-radius:27px;overflow:hidden;transform:translate(-50%,-50%) rotate(-2deg);background:var(--grad);color:#fff;box-shadow:0 30px 62px -30px var(--primary);animation:landingCardFloat 4.8s ease-in-out infinite}.landing-wallet-card:after{content:"";position:absolute;width:150px;height:150px;border-radius:50%;right:-58px;top:-65px;background:rgba(255,255,255,.12)}
.landing-wallet-top{position:relative;z-index:2;display:flex;align-items:center;justify-content:space-between;font-size:.67rem;font-weight:850}.landing-wallet-brand{display:flex;align-items:center;gap:8px}.landing-wallet-brand img{width:25px;height:25px;border-radius:8px;object-fit:cover;background:#fff;box-shadow:0 7px 16px -10px rgba(0,0,0,.6)}.landing-wallet-brand b{font-size:.66rem;letter-spacing:-.01em}.landing-wallet-card>small{position:relative;z-index:2;display:block;margin-top:19px;font-size:.5rem;letter-spacing:.13em;color:rgba(255,255,255,.72);font-weight:850}
.landing-wallet-core{position:relative;z-index:2;display:flex;align-items:center;gap:7px;margin-top:7px;flex-wrap:wrap}.landing-wallet-core span{display:inline-flex;align-items:center;gap:5px;font-size:.74rem;font-weight:900;letter-spacing:-.02em}.landing-wallet-core span+span:before{content:"";width:3px;height:3px;border-radius:50%;margin-right:1px;background:rgba(255,255,255,.5)}.landing-wallet-core i{font-size:.61rem;color:rgba(255,255,255,.9)}
.landing-wallet-actions{position:relative;z-index:2;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;margin-top:18px}.landing-wallet-actions span{min-height:38px;border-radius:11px;display:flex;align-items:center;justify-content:center;gap:6px;background:rgba(255,255,255,.14);font-size:.54rem;font-weight:850;backdrop-filter:blur(8px);text-align:center}.landing-wallet-actions i{font-size:.58rem}
@keyframes landingCardFloat{50%{transform:translate(-50%,-54%) rotate(1deg)}}
.landing-float-card{position:absolute;z-index:3;display:flex;align-items:center;gap:8px;padding:9px 11px;border-radius:15px;background:color-mix(in srgb,var(--surface) 94%,transparent);border:1px solid color-mix(in srgb,var(--primary) 13%,var(--border));box-shadow:0 15px 35px -25px rgba(0,0,0,.65);backdrop-filter:blur(12px);animation:landingMiniFloat 4.2s ease-in-out infinite alternate}.landing-float-card>span{width:32px;height:32px;border-radius:10px;display:grid;place-items:center;background:var(--primary-soft);color:var(--primary)}.landing-float-card div{display:flex;flex-direction:column}.landing-float-card small{font-size:.48rem;color:var(--text-muted);font-weight:700}.landing-float-card b{font-size:.62rem}.landing-float-one{left:1%;top:18px}.landing-float-two{right:0;bottom:12px;animation-delay:-1.6s}@keyframes landingMiniFloat{to{transform:translateY(-9px)}}
.landing-feature-story{padding:3px 18px 34px;max-width:760px;margin:0 auto}.landing-feature-intro{text-align:center;max-width:570px;margin:0 auto 17px}.landing-feature-intro>span{font-size:.49rem;letter-spacing:.12em;font-weight:900;color:var(--primary)}.landing-feature-intro h2{margin:5px 0 0;font-size:1.18rem;line-height:1.25;letter-spacing:-.035em;font-weight:900}.landing-feature-intro p{margin:7px auto 0;max-width:520px;color:var(--text-muted);font-size:.64rem;line-height:1.65;font-weight:550}
.landing-feature-list{display:grid;grid-template-columns:1fr;gap:0}.landing-feature-list article{display:grid;grid-template-columns:36px minmax(0,1fr);gap:11px;align-items:flex-start;padding:13px 2px;border-bottom:1px solid color-mix(in srgb,var(--border) 75%,transparent)}.landing-feature-list article:last-child{border-bottom:0}.landing-feature-list article>span{width:36px;height:36px;border-radius:11px;display:grid;place-items:center;background:var(--primary-soft);color:var(--primary);font-size:.74rem}.landing-feature-list article>div{min-width:0}.landing-feature-list b{display:block;font-size:.71rem;line-height:1.35}.landing-feature-list p{margin:4px 0 0;color:var(--text-muted);font-size:.57rem;line-height:1.62;font-weight:550}

/* Bottom access row: a clear final action before the public footer. */
.landing-bottom-actions{width:min(calc(100% - 36px),724px);margin:2px auto 22px;padding-top:5px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px}.landing-bottom-btn{min-height:48px;border-radius:14px;display:inline-flex;align-items:center;justify-content:center;gap:8px;font-size:.67rem;font-weight:900;transition:transform .18s var(--ease),box-shadow .18s var(--ease)}.landing-bottom-btn:active{transform:translateY(1px) scale(.985)}.landing-bottom-login{border:1px solid color-mix(in srgb,var(--primary) 26%,var(--border));background:var(--surface);color:var(--primary);box-shadow:var(--shadow-sm)}.landing-bottom-download{background:var(--grad);color:#fff;box-shadow:0 15px 30px -18px var(--primary)}.landing-bottom-download>i{font-size:1rem;line-height:1;flex:none}

/* Shared public footer: compact support-first layout. */
.public-site-footer{position:relative;margin:18px -18px 0;overflow:hidden;background:linear-gradient(145deg,#18152a 0%,#21183b 52%,#171929 100%);border-top:1px solid rgba(255,255,255,.08);color:#fff}.landing-page>.public-site-footer{margin:0}.public-site-footer:before{content:"";position:absolute;width:220px;height:220px;border-radius:50%;right:-105px;top:-120px;background:rgba(124,92,255,.15);pointer-events:none}.public-footer-accent{height:4px;background:linear-gradient(90deg,#7c5cff,#a071ff,#6b7cff)}.public-footer-inner{position:relative;z-index:1;padding:20px 18px calc(22px + var(--safe-b));max-width:620px;margin:0 auto}.public-footer-top{display:flex;align-items:center;justify-content:space-between;gap:12px}.public-footer-brand{display:flex;align-items:center;gap:10px;min-width:0}.public-footer-brand img{width:40px;height:40px;border-radius:12px;background:#fff;box-shadow:0 12px 28px -17px rgba(124,92,255,.9)}.public-footer-brand>div{display:flex;min-width:0;flex-direction:column;gap:2px}.public-footer-brand b{font-size:.8rem;letter-spacing:-.02em;color:#fff}.public-footer-brand span{font-size:.5rem;color:rgba(255,255,255,.6);line-height:1.4}.public-footer-web{flex:none;display:inline-flex;align-items:center;gap:7px;min-height:32px;padding:0 10px;border-radius:10px;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.055);color:#fff;font-size:.53rem;font-weight:800}.public-footer-web i{color:#b6a8ff}
.public-footer-contact-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:7px;margin-top:14px;padding:8px;border:1px solid rgba(255,255,255,.08);border-radius:16px;background:rgba(255,255,255,.035)}.public-footer-contact{width:100%;min-width:0;min-height:44px;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:8px;padding:7px 8px;border-radius:11px;background:rgba(255,255,255,.045);color:#fff;text-align:left}.public-footer-contact-email{grid-column:1/-1}.public-footer-contact-icon{width:30px;height:30px;border-radius:9px;display:grid;place-items:center;background:rgba(124,92,255,.16);color:#c6baff;font-size:.66rem}.public-footer-contact>span:nth-child(2){display:flex;min-width:0;flex-direction:column;gap:1px}.public-footer-contact small{font-size:.39rem;color:rgba(255,255,255,.46);letter-spacing:.07em;font-weight:900}.public-footer-contact b{font-size:.54rem;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.public-footer-contact>i{font-size:.48rem;color:#b8a9ff}.public-footer-support{font:inherit;cursor:pointer}.public-footer-contact:active{background:rgba(255,255,255,.075)}.public-footer-legal{display:flex;align-items:center;justify-content:center;gap:7px;flex-wrap:wrap;margin-top:13px;padding-top:11px;border-top:1px solid rgba(255,255,255,.08)}.public-footer-legal button{color:rgba(255,255,255,.68);font-size:.5rem;font-weight:750}.public-footer-legal span{color:rgba(255,255,255,.22);font-size:.53rem}.public-footer-note{text-align:center;margin-top:9px;color:rgba(255,255,255,.42);font-size:.44rem;font-weight:650;line-height:1.5}

@media(min-width:560px){.landing-hero{grid-template-columns:minmax(0,1.1fr) minmax(280px,.9fr);padding:60px 26px 34px}.landing-copy{text-align:left}.landing-copy h1,.landing-copy>p{margin-left:0;margin-right:0}.landing-cta-row{margin-left:0;margin-right:0}.landing-feature-story{padding-left:26px;padding-right:26px}.landing-feature-intro{text-align:left;margin-left:0}.landing-feature-list{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:26px}.landing-feature-list article:nth-last-child(-n+2){border-bottom:0}.landing-feature-list article:last-child{grid-column:1/-1;max-width:calc(50% - 13px)}.landing-nav{padding-left:26px;padding-right:26px}.public-footer-contact-grid{grid-template-columns:minmax(0,1.25fr) minmax(0,.8fr) minmax(0,.8fr)}.public-footer-contact-email{grid-column:auto}.landing-page>.public-site-footer .public-footer-inner{max-width:820px}}
@media(max-width:339px){.landing-bottom-actions{width:calc(100% - 30px);gap:8px}.landing-bottom-btn{font-size:.61rem}.landing-brand b{font-size:.77rem}.landing-hero{padding-top:38px}.landing-visual{height:230px}.landing-wallet-card{width:90%;padding:18px}.landing-wallet-actions span{font-size:.5rem}.landing-float-one{left:-3px}.landing-float-two{right:-3px}.public-footer-inner{padding-left:15px;padding-right:15px}.public-footer-top{align-items:flex-start;flex-direction:column}.public-footer-web{min-height:30px}.public-footer-contact-grid{grid-template-columns:1fr}.public-footer-contact-email{grid-column:auto}}

@media(prefers-reduced-motion:reduce){.landing-ambient span,.landing-wallet-card,.landing-float-card{animation:none!important}}


/* ================= RESPONSIVE LANDING SAFETY ================= */
.landing-main,.landing-main>*{min-width:0}
@media(max-width:339px){
  .landing-hero,.landing-feature-story,.landing-company,.public-footer-inner{padding-left:14px;padding-right:14px}
  .landing-cta-row{gap:8px}
}

/* ================= v2026.09.13.47 · PUBLIC PAGE READABILITY ================= */
.landing-wallet-card>small,.landing-wallet-actions span,.landing-float-card small,.landing-feature-intro>span,.landing-feature-intro p,.landing-feature-list p,.public-footer-brand span,.public-footer-web,.public-footer-contact small,.public-footer-contact b,.public-footer-legal button,.public-footer-legal span,.public-footer-note,.landing-bottom-btn{font-size:.7rem}
.landing-float-card b{font-size:.74rem}

/* ========================================================================== 
   FINZO WALLET — selective old-theme polish
   Keeps the original stable UI/interaction model. Only ports the requested
   tactile icon depth, public footer treatment, and bottom-nav OUTER tray.
   ========================================================================== */

:root{
  --finzo-icon-depth:
    0 10px 18px -12px color-mix(in srgb,var(--primary) 58%,rgba(20,28,58,.42)),
    0 3px 8px -6px rgba(20,28,58,.22),
    inset 0 1px 0 rgba(255,255,255,.90),
    inset 0 -1px 0 color-mix(in srgb,var(--primary) 12%,transparent),
    inset 0 0 0 1px color-mix(in srgb,var(--primary) 11%,var(--border));
  --finzo-icon-depth-soft:
    0 8px 15px -11px color-mix(in srgb,var(--primary) 50%,rgba(20,28,58,.36)),
    0 2px 6px -5px rgba(20,28,58,.18),
    inset 0 1px 0 rgba(255,255,255,.88),
    inset 0 0 0 1px color-mix(in srgb,var(--primary) 10%,var(--border));
}
[data-theme="dark"]{
  --finzo-icon-depth:
    0 11px 20px -12px color-mix(in srgb,var(--primary) 42%,rgba(0,0,0,.76)),
    0 3px 9px -5px rgba(0,0,0,.55),
    inset 0 1px 0 rgba(255,255,255,.075),
    inset 0 -1px 0 rgba(0,0,0,.14),
    inset 0 0 0 1px color-mix(in srgb,var(--primary) 12%,var(--border));
  --finzo-icon-depth-soft:
    0 9px 17px -11px color-mix(in srgb,var(--primary) 36%,rgba(0,0,0,.68)),
    0 2px 7px -5px rgba(0,0,0,.48),
    inset 0 1px 0 rgba(255,255,255,.065),
    inset 0 0 0 1px color-mix(in srgb,var(--primary) 10%,var(--border));
}

/* ---------- Deep tactile icon boxes, without changing their behaviour ---------- */
.icon-btn,
.set-row .sic,
.home-action .ha-icon,
.home-tile .ht-icon,
.service .sic,
.home-layout-10 .home-pro-link-icon,
.earn-tile-icon,
.milestone-history-icon,
.video-task-guide-toggle-icon,
.timewall-guide-icon,
.af-method-icon,
.af-hero-icon,
.af-upload-icon,
.af-review-icon,
.af-history-title>i,
.af-history-ic,
.wd-icon,
.wd-preview-icon,
.wd-method-icon,
.wd-review-method-icon,
.fm-icon,
.fm-tx-detail-icon,
.wm-request-icon,
.wm-approve-proof-icon,
.tgpm-heading-icon,
.tgpm-hero-icon,
.tgpm-time-icon,
.ytsf-heading-icon,
.ytsf-control-icon,
.ytsf-search-btn-icon,
.ytsf-generate-icon,
.ytsf-video-task-icon,
.claim-all-number-icon,
.claim-all-warn-icon,
.cas-toggle-icon,
.claim-all-batch-panel-icon,
.cah-icon,
.profile-name-gate-icon,
.nt-intro-icon,
.nt-collection-icon,
.lfd-hero-icon,
.lfd-toggle-icon,
.lf-history-link-icon,
.two-step-hero-icon,
.tg-alert-avatar,
.tg-alert-connect-icon,
.tg-alert-mini-icon,
.gateway-api-hero-icon,
.notification-icon,
.notification-empty-icon,
.legal-support-icon,
.network-offline-icon,
.login-2fa-icon,
.scheduled-maintenance-icon,
.sidebar-download-icon,
.support-contact-icon,
.maintenance-eta-icon,
.free-lf-type-icon{
  box-shadow:var(--finzo-icon-depth)!important;
}

/* Generic primary icon boxes get the same subtle raised face used by the
   app-look theme. Semantic success/warning/danger/crypto boxes keep their
   original colours and only receive the depth treatment above. */
.icon-btn,
.set-row .sic:not([style*="danger-soft"]),
.home-action:not(.is-accent) .ha-icon,
.home-tile:not(.is-primary) .ht-icon,
.service .sic,
.earn-tile:not(.earn-tile-more) .earn-tile-icon,
.home-layout-10 .home-pro-link-icon,
.nt-intro-icon,
.nt-collection-icon,
.claim-all-number-icon,
.lf-history-link-icon,
.profile-name-gate-icon,
.tgpm-heading-icon,
.tgpm-time-icon,
.ytsf-heading-icon,
.ytsf-control-icon{
  background:linear-gradient(145deg,
    color-mix(in srgb,var(--primary) 14%,var(--surface)),
    color-mix(in srgb,var(--primary) 5%,var(--surface-2)))!important;
  color:var(--primary)!important;
}

/* Keep white/accent icon faces readable when their parent is already a
   gradient/accent card. */
.home-action.is-accent .ha-icon,
.home-tile.is-primary .ht-icon{
  box-shadow:0 10px 18px -12px rgba(0,0,0,.36),inset 0 1px 0 rgba(255,255,255,.24),inset 0 0 0 1px rgba(255,255,255,.14)!important;
}

/* Small icon surfaces should feel raised too, but stay visually lighter. */
.public-footer-contact-icon,
.af-history-arrow{
  box-shadow:var(--finzo-icon-depth-soft)!important;
}

/* ---------- Bottom navbar: new-theme OUTER tray only ----------
   Intentionally no .nav-item / .nav-earn / .earn-orb overrides here. */
.bottomnav{
  width:min(calc(var(--app-w) - 24px),calc(100vw - 24px))!important;
  background:linear-gradient(155deg,
    color-mix(in srgb,var(--surface) 97%,transparent),
    color-mix(in srgb,var(--surface-2) 94%,transparent))!important;
  border:1px solid color-mix(in srgb,var(--primary) 10%,var(--border))!important;
  border-radius:25px!important;
  box-shadow:
    0 20px 38px -22px rgba(13,22,52,.55),
    0 5px 13px -8px rgba(13,22,52,.28),
    inset 0 1px 0 rgba(255,255,255,.92)!important;
  backdrop-filter:blur(20px) saturate(1.22);
  -webkit-backdrop-filter:blur(20px) saturate(1.22);
}
[data-theme="dark"] .bottomnav{
  box-shadow:
    0 22px 42px -22px rgba(0,0,0,.82),
    0 5px 14px -8px rgba(0,0,0,.62),
    inset 0 1px 0 rgba(255,255,255,.07)!important;
}

/* ---------- Public footer: port the app-look footer, no top accent strip ---------- */
.public-footer-accent{display:none!important;height:0!important}
.public-site-footer{
  background:linear-gradient(145deg,
    #171827 0%,
    color-mix(in srgb,var(--primary) 18%,#1c1b31) 52%,
    #151824 100%)!important;
  color:#fff!important;
  border:1px solid rgba(255,255,255,.09)!important;
  border-bottom:0!important;
  border-top:0!important;
  border-radius:26px 26px 0 0!important;
  box-shadow:0 -18px 42px -32px rgba(15,20,40,.56),inset 0 1px 0 rgba(255,255,255,.07)!important;
}
.public-site-footer .public-footer-brand img{
  box-shadow:0 12px 24px -14px color-mix(in srgb,var(--primary) 68%,#000 32%),inset 0 0 0 1px rgba(255,255,255,.34)!important;
}
.public-site-footer .public-footer-contact-grid{
  border-color:rgba(255,255,255,.09)!important;
  background:rgba(255,255,255,.035)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025)!important;
}
.public-site-footer .public-footer-contact-grid>a,
.public-site-footer .public-footer-contact-grid>button,
.public-site-footer .public-footer-web{
  background:rgba(255,255,255,.055)!important;
  color:#fff!important;
  border-color:rgba(255,255,255,.10)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04),0 7px 16px -15px rgba(0,0,0,.75)!important;
}
.public-site-footer .public-footer-contact-grid>a:active,
.public-site-footer .public-footer-contact-grid>button:active{
  background:rgba(255,255,255,.09)!important;
}
.public-site-footer .public-footer-contact-icon{
  background:color-mix(in srgb,var(--primary) 24%,rgba(255,255,255,.06))!important;
  color:color-mix(in srgb,var(--primary) 36%,#fff)!important;
  box-shadow:0 8px 15px -10px color-mix(in srgb,var(--primary) 72%,#000 28%),inset 0 1px 0 rgba(255,255,255,.12),inset 0 0 0 1px rgba(255,255,255,.06)!important;
}
.public-site-footer .public-footer-brand b,
.public-site-footer .public-footer-contact b{color:#fff!important}
.public-site-footer .public-footer-legal{
  border-top-color:rgba(255,255,255,.09)!important;
}

@media(max-width:480px){
  .public-site-footer .public-footer-top{align-items:flex-start;flex-direction:column}
  .public-site-footer .public-footer-web{width:100%;justify-content:center}
  .public-site-footer .public-footer-contact-grid{grid-template-columns:1fr}
  .public-site-footer .public-footer-contact-email{grid-column:auto}
}


/* ========================================================================== 
   FINZO WALLET — requested selective polish v2026.09.15.62
   Old stable theme remains intact; only requested visual refinements live here.
   ========================================================================== */

:root{
  --finzo-raised-face:linear-gradient(145deg,var(--surface),var(--surface-2));
  --finzo-raised-border:color-mix(in srgb,var(--primary) 11%,var(--border));
  --finzo-raised-shadow:
    0 10px 20px -14px rgba(21,31,64,.38),
    0 3px 8px -6px rgba(21,31,64,.18),
    inset 0 1px 0 rgba(255,255,255,.92),
    inset 0 -1px 0 color-mix(in srgb,var(--primary) 7%,transparent);
  --finzo-pressed-shadow:inset 0 2px 5px rgba(34,45,80,.10),inset 0 -1px 0 rgba(255,255,255,.72);
}
[data-theme="dark"]{
  --finzo-raised-shadow:
    0 11px 21px -13px rgba(0,0,0,.72),
    0 3px 9px -6px rgba(0,0,0,.52),
    inset 0 1px 0 rgba(255,255,255,.075),
    inset 0 -1px 0 rgba(0,0,0,.16);
  --finzo-pressed-shadow:inset 0 2px 6px rgba(0,0,0,.34),inset 0 1px 0 rgba(255,255,255,.025);
}

/* Settings list icons: force a true square footprint at every phone width. */
.settings-group .set-row .sic{
  width:42px!important;
  height:42px!important;
  min-width:42px!important;
  min-height:42px!important;
  flex:0 0 42px!important;
  aspect-ratio:1/1!important;
  border-radius:13px!important;
}
@media(max-width:339px){
  .settings-group .set-row .sic{
    width:40px!important;height:40px!important;min-width:40px!important;min-height:40px!important;flex-basis:40px!important;
  }
}

/* Restore the real service tint from the stable old Home theme. */
.service-grid.services-soft .sic{
  background:var(--grad-soft)!important;
  border-color:transparent!important;
  color:var(--primary)!important;
}

/* Brand colours for the two creator-tool heading icons. */
.ytsf-heading-icon{
  background:linear-gradient(145deg,#ff3131,#d90000)!important;
  color:#fff!important;
  border-color:rgba(255,255,255,.34)!important;
  box-shadow:0 12px 22px -15px rgba(229,0,0,.72),inset 0 1px 0 rgba(255,255,255,.30),inset 0 -1px 0 rgba(100,0,0,.16)!important;
}
.tgpm-heading-icon{
  background:linear-gradient(145deg,#2aabee,#168dcc)!important;
  color:#fff!important;
  border-color:rgba(255,255,255,.34)!important;
  box-shadow:0 12px 22px -15px rgba(34,158,217,.78),inset 0 1px 0 rgba(255,255,255,.30),inset 0 -1px 0 rgba(0,80,120,.16)!important;
}

/* Login mobile field: a little taller without changing auth logic. */
#li-mobile{
  min-height:54px!important;
  height:54px!important;
  border-radius:15px!important;
  font-size:.94rem;
}

/* Tactile button language from the app-look experiment, limited to actual
   action buttons so tabs, payout-method switches and dynamic controls keep
   the stable old-theme behaviour. */
.btn,
.auth-btn,
.landing-support,
.landing-primary-cta,
.landing-bottom-btn,
.support-label-btn,
.claim-all-save-btn,
.claim-all-refresh,
.tgpm-continue,
.tgpm-create-btn,
.tgpm-post-btn,
.ytsf-search-btn,
.ytsf-generate-btn,
.wm-save-range,
.maintenance-refresh{
  border-radius:16px!important;
  font-weight:850;
  transition:transform .14s ease,box-shadow .14s ease,filter .18s ease,background .18s ease!important;
}

.btn-primary,
.landing-primary-cta,
.landing-bottom-download,
.claim-all-save-btn,
.tgpm-continue,
.tgpm-create-btn,
.tgpm-post-btn,
.ytsf-search-btn,
.wm-save-range{
  background:var(--grad)!important;
  color:#fff!important;
  border:1px solid rgba(255,255,255,.18)!important;
  box-shadow:
    0 12px 22px -14px color-mix(in srgb,var(--primary) 84%,#111 16%),
    inset 0 1px 0 rgba(255,255,255,.32),
    inset 0 -2px 0 rgba(0,0,0,.10)!important;
}
.btn-primary:active,
.landing-primary-cta:active,
.landing-bottom-download:active,
.claim-all-save-btn:active,
.tgpm-continue:active,
.tgpm-create-btn:active,
.tgpm-post-btn:active,
.ytsf-search-btn:active,
.wm-save-range:active{
  transform:translateY(2px) scale(.985)!important;
  box-shadow:0 6px 14px -11px color-mix(in srgb,var(--primary) 82%,#111 18%),inset 0 2px 4px rgba(0,0,0,.13)!important;
}

.btn-soft,
.btn-ghost,
.auth-btn,
.landing-support,
.landing-bottom-login,
.support-label-btn,
.claim-all-refresh,
.maintenance-refresh{
  background:var(--finzo-raised-face)!important;
  border:1px solid var(--finzo-raised-border)!important;
  box-shadow:var(--finzo-raised-shadow)!important;
}
.btn-soft:active,
.btn-ghost:active,
.auth-btn:active,
.landing-support:active,
.landing-bottom-login:active,
.support-label-btn:active,
.claim-all-refresh:active,
.maintenance-refresh:active{
  transform:translateY(2px) scale(.985)!important;
  box-shadow:var(--finzo-pressed-shadow)!important;
}

/* Add Fund + Withdraw quick amount tiles: raised/inset tactile surfaces only.
   No layout or selection logic is changed. */
.af-amt-tile,
.af-tile-skel{
  border-radius:15px!important;
  background:var(--finzo-raised-face)!important;
  border:1px solid var(--finzo-raised-border)!important;
  box-shadow:var(--finzo-raised-shadow)!important;
}
.af-amt-tile.active{
  background:linear-gradient(145deg,color-mix(in srgb,var(--primary) 12%,var(--surface)),color-mix(in srgb,var(--primary) 6%,var(--surface-2)))!important;
  border-color:color-mix(in srgb,var(--primary) 45%,var(--border))!important;
  color:var(--primary-dark)!important;
}
.af-amt-tile:active{
  transform:translateY(2px) scale(.98)!important;
  box-shadow:var(--finzo-pressed-shadow)!important;
}

/* Landing should always occupy the full mobile viewport. A browser Back from
   Login may restore the Landing fragment inside the same document, so :has()
   is also a defensive CSS fallback in addition to the router shell sync. */
@media(max-width:719px){
  body.route-landing,
  body:has(#view>.landing-page){--app-w:100vw}

  body.route-landing>.app,
  body:has(#view>.landing-page)>.app{
    width:100%!important;
    max-width:100vw!important;
    border-left:0!important;
    border-right:0!important;
  }
}
body:has(#view>.landing-page) #view{
  padding:0!important;
  min-height:100vh!important;
  min-height:100dvh!important;
  overflow:hidden!important;
}

/* ========================================================================== 
   FINZO WALLET — selective app-surface depth v2026.09.15.63
   Visual-only layer on top of the stable old theme. No dynamic layout,
   transform, show/hide, router or state-control behaviour is overridden.
   ========================================================================== */

:root{
  --finzo-app-card-face:linear-gradient(145deg,
    color-mix(in srgb,var(--surface) 98%,#fff 2%),
    color-mix(in srgb,var(--surface-2) 93%,var(--primary) 7%));
  --finzo-app-card-border:color-mix(in srgb,var(--primary) 13%,var(--border));
  --finzo-app-card-shadow:
    0 16px 30px -24px rgba(24,31,62,.46),
    0 5px 12px -9px rgba(24,31,62,.20),
    inset 0 1px 0 rgba(255,255,255,.96),
    inset 0 -1px 0 color-mix(in srgb,var(--primary) 7%,transparent);
  --finzo-app-card-shadow-soft:
    0 12px 24px -22px rgba(24,31,62,.38),
    0 3px 8px -7px rgba(24,31,62,.16),
    inset 0 1px 0 rgba(255,255,255,.90);
  --finzo-app-hero-shadow:
    0 24px 44px -28px color-mix(in srgb,var(--primary) 82%,#111 18%),
    0 8px 18px -14px rgba(23,28,57,.34),
    inset 0 1px 0 rgba(255,255,255,.28),
    inset 0 -2px 0 rgba(0,0,0,.10);
}
[data-theme="dark"]{
  --finzo-app-card-face:linear-gradient(145deg,
    color-mix(in srgb,var(--surface) 96%,var(--primary) 4%),
    color-mix(in srgb,var(--surface-2) 97%,#000 3%));
  --finzo-app-card-border:color-mix(in srgb,var(--primary) 15%,var(--border));
  --finzo-app-card-shadow:
    0 16px 30px -20px rgba(0,0,0,.78),
    0 5px 13px -8px rgba(0,0,0,.55),
    inset 0 1px 0 rgba(255,255,255,.075),
    inset 0 -1px 0 rgba(0,0,0,.20);
  --finzo-app-card-shadow-soft:
    0 12px 24px -18px rgba(0,0,0,.70),
    0 3px 9px -7px rgba(0,0,0,.48),
    inset 0 1px 0 rgba(255,255,255,.055);
  --finzo-app-hero-shadow:
    0 25px 48px -27px rgba(0,0,0,.76),
    0 8px 20px -14px rgba(0,0,0,.58),
    inset 0 1px 0 rgba(255,255,255,.20),
    inset 0 -2px 0 rgba(0,0,0,.18);
}

/* Settings: profile surface + every options row now shares the same raised,
   app-like material while retaining all original click targets and spacing. */
.settings-group>.card,
.settings-group .set-row{
  background:var(--finzo-app-card-face)!important;
  border-color:var(--finzo-app-card-border)!important;
  box-shadow:var(--finzo-app-card-shadow)!important;
}
.settings-group>.card{border-radius:21px!important}
.settings-group .set-row{border-radius:18px!important;margin-bottom:11px}
.settings-group>.card .acct-card .av{
  box-shadow:0 12px 22px -16px rgba(19,27,57,.42),inset 0 0 0 1px rgba(255,255,255,.22)!important;
}

/* Home action tiles such as Add Fund / Create Lifafa / Pay User and equivalent
   tiles used by the selectable home layouts. Accent cards keep their colours. */
.home-tile:not(.is-primary),
.home-action:not(.is-accent),
.qa:not(.accent),
.home-profile-surface,
.home-earn-history,
.home-history-banner,
.home-shortcut-pills button{
  background:var(--finzo-app-card-face)!important;
  border-color:var(--finzo-app-card-border)!important;
  box-shadow:var(--finzo-app-card-shadow)!important;
}
.home-tile.is-primary,
.home-action.is-accent,
.qa.accent{
  box-shadow:var(--finzo-app-hero-shadow)!important;
}

/* Create Lifafa type tiles get depth too. Selection colour remains controlled
   by the original Lifafa CSS; only the physical card feel is enhanced. */
.type-card{
  box-shadow:var(--finzo-app-card-shadow-soft)!important;
  border-color:var(--finzo-app-card-border)!important;
}
.type-card.sel{
  border-color:var(--primary)!important;
  box-shadow:0 12px 24px -20px color-mix(in srgb,var(--primary) 55%,transparent),inset 0 1px 0 rgba(255,255,255,.24)!important;
}

/* Toggle rows are intentionally independent mini-cards. No transform,
   transition, height or overflow override is used here, so expanding fields
   continue to use the stable old-theme behaviour. */
.toggle-row{
  gap:12px!important;
  padding:13px 14px!important;
  margin:8px 0!important;
  border:1px solid var(--finzo-app-card-border)!important;
  border-radius:16px!important;
  background:var(--finzo-app-card-face)!important;
  box-shadow:var(--finzo-app-card-shadow-soft)!important;
}
.toggle-row:last-child{border-bottom:1px solid var(--finzo-app-card-border)!important}
.toggle-row>div:first-child{min-width:0;padding-right:6px}

/* History/list cards: same app surface without changing expandable/detail
   mechanics. Lifafa History is the primary target; common neutral history
   cards get matching depth for visual consistency across the app. */
.lifafa-item,
.pay-history-card,
.bulk-history-card,
.claim-all-history-card,
.free-lf-card,
.notification-item{
  background:var(--finzo-app-card-face)!important;
  border-color:var(--finzo-app-card-border)!important;
  box-shadow:var(--finzo-app-card-shadow)!important;
}
.lifafa-item{border-radius:21px!important}

/* Add Fund / Earn record shells and payout/history containers retain their
   internal expand animations; only the outer shell is visually raised. */
.af-history-shell.card,
.wd-payout-card,
.earn-record-shell.card{
  border-color:var(--finzo-app-card-border)!important;
  box-shadow:var(--finzo-app-card-shadow)!important;
}

/* Primary balance/profile cards: deeper layered hero shadow and a thin top
   highlight create the app-card depth while all original gradients remain. */
.home-earn-hero,
.profile-card,
.wallet-hero,
.coin-wallet-card{
  border:1px solid rgba(255,255,255,.16)!important;
  box-shadow:var(--finzo-app-hero-shadow)!important;
}

/* Inner glass controls inside gradient hero cards get a little physical depth
   but keep their translucent background and existing text colours. */
.wallet-sub .ws,
.wallet-act,
.heh-orb,
.heh-withdraw,
.coin-rate-pill,
.coin-wallet-symbol,
.coin-withdraw-btn{
  box-shadow:0 10px 18px -15px rgba(0,0,0,.46),inset 0 1px 0 rgba(255,255,255,.20)!important;
}

/* Earn activity tiles follow the same raised app-card language. */
.earn-tile{
  background:var(--finzo-app-card-face)!important;
  border-color:var(--finzo-app-card-border)!important;
  box-shadow:var(--finzo-app-card-shadow-soft)!important;
}

/* Small-screen tuning: retain depth but keep the compact old-theme geometry. */
@media(max-width:339px){
  .settings-group .set-row{border-radius:16px!important}
  .toggle-row{padding:12px!important;border-radius:15px!important}
  .lifafa-item{border-radius:18px!important}
}

/* Neutral page cards keep their existing structure but receive the same edge
   and depth. Inline/semantic backgrounds are deliberately not overwritten. */
.card{
  border-color:var(--finzo-app-card-border);
  box-shadow:var(--finzo-app-card-shadow-soft);
}
[data-testid="create-lifafa-view"]>.card,
[data-testid="pay-view"]>.card,
#pay-single>.card,
#pay-bulk>.card,
.nt-builder-card,
.fm-card,
#tx-list.card{
  background:var(--finzo-app-card-face);
  border-color:var(--finzo-app-card-border);
  box-shadow:var(--finzo-app-card-shadow);
}


/* ========================================================================== 
   FINZO WALLET — interaction polish v2026.09.15.64
   Keeps the stable old-theme mechanics while finishing the app-depth layer.
   ========================================================================== */

/* Create Lifafa expandable panels: keep a permanent block-formatting context.
   The existing reveal animation temporarily uses overflow:hidden. Without a
   stable BFC, the first child's .mt-12 margin can start/stop collapsing when
   overflow is cleared, producing a small end-of-animation spacing snap. */
[data-testid="create-lifafa-view"] #refer-fields:not(.hidden),
[data-testid="create-lifafa-view"] #access-fields:not(.hidden),
[data-testid="create-lifafa-view"] #special-fields:not(.hidden),
[data-testid="create-lifafa-view"] #youtube-summary:not(.hidden){
  display:flow-root;
}

/* Universal drag-down BottomSheet: visual depth only. Drag mechanics, height,
   transforms and scrolling remain owned by the original UI controller. */
.sheet{
  border:1px solid var(--finzo-app-card-border)!important;
  border-bottom:0!important;
  border-radius:30px 30px 0 0!important;
  background:linear-gradient(165deg,
    color-mix(in srgb,var(--surface) 98%,var(--primary) 2%),
    color-mix(in srgb,var(--surface-2) 96%,var(--primary) 4%))!important;
  box-shadow:
    0 -30px 58px -30px rgba(8,15,38,.58),
    0 -10px 24px -20px rgba(8,15,38,.34),
    inset 0 1px 0 rgba(255,255,255,.92)!important;
}
[data-theme="dark"] .sheet{
  box-shadow:
    0 -30px 60px -28px rgba(0,0,0,.78),
    0 -10px 24px -17px rgba(0,0,0,.55),
    inset 0 1px 0 rgba(255,255,255,.075)!important;
}
.sheet .handle{
  width:48px!important;
  height:5px!important;
  border-radius:999px!important;
  background:linear-gradient(90deg,
    var(--border),
    color-mix(in srgb,var(--primary) 30%,var(--border)),
    var(--border))!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.48),0 2px 6px -4px rgba(0,0,0,.38)!important;
}
.sheet .sheet-head h3{font-weight:900!important;letter-spacing:-.02em}
.sheet .sheet-close,
.alert-close{
  border:1px solid var(--finzo-app-card-border)!important;
  background:linear-gradient(145deg,var(--surface),var(--surface-2))!important;
  box-shadow:var(--finzo-app-card-shadow-soft)!important;
}
.sheet .sheet-close:active,
.alert-close:active{
  box-shadow:inset 0 2px 5px rgba(20,27,55,.13)!important;
}

/* Universal center popup / confirmation alert. Existing scale animation and
   alert-specific content layouts are preserved; only the physical surface is
   upgraded to the same raised app material. */
.alert-card{
  background:linear-gradient(155deg,
    color-mix(in srgb,var(--surface) 98%,var(--primary) 2%),
    color-mix(in srgb,var(--surface-2) 95%,var(--primary) 5%))!important;
  border:1px solid var(--finzo-app-card-border)!important;
  border-radius:25px!important;
  box-shadow:
    0 28px 58px -31px rgba(8,15,38,.62),
    0 11px 25px -19px rgba(8,15,38,.30),
    inset 0 1px 0 rgba(255,255,255,.94),
    inset 0 -1px 0 color-mix(in srgb,var(--primary) 7%,transparent)!important;
}
[data-theme="dark"] .alert-card{
  box-shadow:
    0 30px 62px -28px rgba(0,0,0,.82),
    0 11px 28px -18px rgba(0,0,0,.58),
    inset 0 1px 0 rgba(255,255,255,.07),
    inset 0 -1px 0 rgba(0,0,0,.20)!important;
}
.alert-card .a-ic{
  border:1px solid color-mix(in srgb,currentColor 14%,transparent);
  box-shadow:0 13px 22px -15px currentColor,inset 0 1px 0 rgba(255,255,255,.38)!important;
}

@media(max-width:339px){
  .sheet{border-radius:27px 27px 0 0!important}
  .alert-card{border-radius:23px!important}
}

/* Inline Login validation feedback; the toast stays intentionally generic. */
#li-mobile[aria-invalid="true"]{
  border-color:var(--danger)!important;
  box-shadow:0 0 0 3px var(--danger-soft)!important;
}


/* ========================================================================== 
   FINZO WALLET — safe visual completion v2026.09.15.65
   Visual-only finishing layer for the stable old theme. It deliberately avoids
   changing component heights, dynamic visibility, router transforms or payout
   switching mechanics.
   ========================================================================== */

/* Form controls: subtle inset app-depth in both themes, with a clearer focus
   state. Page-specific controls using their own !important styling remain in
   charge, so specialised widgets are not disturbed. */
.input,
.textarea,
.field select{
  border-color:color-mix(in srgb,var(--primary) 10%,var(--border));
  background:linear-gradient(180deg,
    color-mix(in srgb,var(--surface) 98%,var(--primary) 2%),
    color-mix(in srgb,var(--surface-2) 96%,var(--primary) 4%));
  box-shadow:
    inset 0 1px 2px rgba(18,27,58,.055),
    inset 0 1px 0 rgba(255,255,255,.72),
    0 8px 18px -20px rgba(18,27,58,.46);
}
[data-theme="dark"] .input,
[data-theme="dark"] .textarea,
[data-theme="dark"] .field select{
  box-shadow:
    inset 0 1px 3px rgba(0,0,0,.30),
    inset 0 1px 0 rgba(255,255,255,.035),
    0 8px 18px -18px rgba(0,0,0,.70);
}
.input:focus,
.textarea:focus,
.field select:focus{
  border-color:color-mix(in srgb,var(--primary) 72%,var(--border));
  background:var(--surface);
  box-shadow:
    inset 0 1px 2px rgba(18,27,58,.04),
    0 0 0 3px var(--primary-soft),
    0 12px 24px -21px color-mix(in srgb,var(--primary) 55%,transparent);
}
.input[aria-invalid="true"],
.textarea[aria-invalid="true"]{
  border-color:color-mix(in srgb,var(--danger) 72%,var(--border));
  box-shadow:0 0 0 3px var(--danger-soft);
}

/* Section titles get a compact app-style accent marker without changing their
   existing spacing or page layout. */
.section-title h2{
  display:inline-flex;
  align-items:center;
  gap:8px;
}
.section-title h2::before{
  content:"";
  width:4px;
  height:16px;
  flex:0 0 4px;
  border-radius:999px;
  background:var(--grad);
  box-shadow:0 6px 12px -7px var(--primary),inset 0 1px 0 rgba(255,255,255,.35);
}

/* Toasts and blocking loaders use the same tactile material as cards. Motion
   is left untouched. */
.toast{
  background:var(--finzo-app-card-face)!important;
  border-color:var(--finzo-app-card-border)!important;
  box-shadow:
    0 20px 38px -25px rgba(8,15,38,.46),
    0 7px 18px -15px rgba(8,15,38,.24),
    inset 0 1px 0 rgba(255,255,255,.86)!important;
}
[data-theme="dark"] .toast{
  box-shadow:
    0 22px 42px -22px rgba(0,0,0,.76),
    0 8px 18px -13px rgba(0,0,0,.52),
    inset 0 1px 0 rgba(255,255,255,.055)!important;
}
.toast .t-ic{
  box-shadow:0 10px 18px -13px currentColor,inset 0 1px 0 rgba(255,255,255,.28);
}
.toast .t-progress{height:3px;box-shadow:0 -2px 8px -4px var(--primary)}
.ui-busy-card{
  background:var(--finzo-app-card-face)!important;
  border-color:var(--finzo-app-card-border)!important;
  box-shadow:var(--finzo-app-card-shadow)!important;
}
.ui-busy-spin{
  box-shadow:0 6px 12px -8px var(--primary);
}

/* Empty/result states: richer icon depth and a quieter surface so empty pages
   feel intentional rather than blank. */
.empty .ic,
.notification-empty-icon,
.tx-state-empty>span,
.free-lf-empty>div{
  border:1px solid color-mix(in srgb,var(--primary) 16%,var(--border));
  box-shadow:
    0 12px 22px -17px color-mix(in srgb,var(--primary) 42%,transparent),
    inset 0 1px 0 rgba(255,255,255,.38);
}
.tx-state-empty,
.free-lf-empty{
  border-color:var(--finzo-app-card-border)!important;
  background:linear-gradient(145deg,
    color-mix(in srgb,var(--surface) 98%,var(--primary) 2%),
    color-mix(in srgb,var(--surface-2) 97%,var(--primary) 3%))!important;
  box-shadow:var(--finzo-app-card-shadow-soft)!important;
}
.notification-empty{
  border:1px dashed color-mix(in srgb,var(--primary) 14%,var(--border));
  border-radius:20px;
  background:color-mix(in srgb,var(--surface-2) 48%,transparent);
}

/* Upload / proof pickers: tactile drop areas only; file input behaviour and
   preview geometry are unchanged. */
.af-upload-zone,
.fm-proof-pick{
  border-color:color-mix(in srgb,var(--primary) 30%,var(--border))!important;
  background:linear-gradient(145deg,
    color-mix(in srgb,var(--surface-2) 95%,var(--primary) 5%),
    color-mix(in srgb,var(--surface) 98%,var(--primary) 2%))!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.62),
    0 12px 24px -22px rgba(15,23,55,.42);
}
[data-theme="dark"] .af-upload-zone,
[data-theme="dark"] .fm-proof-pick{
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.035),
    0 12px 24px -18px rgba(0,0,0,.68);
}
.af-upload-icon{
  border:1px solid color-mix(in srgb,var(--primary) 18%,var(--border));
  box-shadow:0 10px 18px -14px color-mix(in srgb,var(--primary) 48%,transparent),inset 0 1px 0 rgba(255,255,255,.35);
}

/* Chips/status pills keep their semantic colours while gaining a physical
   edge. No status colour is overwritten. */
.badge,
.chip,
.free-lf-claimed-badge,
.af-order-chip,
.wd-review-secure,
.af-status-pill{
  border:1px solid color-mix(in srgb,currentColor 12%,var(--border));
  box-shadow:0 7px 14px -13px currentColor,inset 0 1px 0 rgba(255,255,255,.28);
}

/* Dense histories use a deliberately lighter shadow than hero cards to avoid
   a heavy stacked-card look on long lists. */
:root{
  --finzo-list-shadow:
    0 9px 20px -19px rgba(20,29,62,.38),
    inset 0 1px 0 rgba(255,255,255,.68);
}
[data-theme="dark"]{
  --finzo-list-shadow:
    0 10px 22px -17px rgba(0,0,0,.64),
    inset 0 1px 0 rgba(255,255,255,.035);
}
.lifafa-item,
.pay-history-card,
.bulk-history-card,
.claim-all-history-card,
.notification-item,
.af-history-item,
.earn-record-shell.card{
  box-shadow:var(--finzo-list-shadow)!important;
}

/* Confirmation/success presentation: only surfaces/icons are enhanced. */
.af-review-icon,
.wd-review-method-icon,
.win-burst{
  filter:drop-shadow(0 10px 14px color-mix(in srgb,var(--primary) 18%,transparent));
}
.af-review-stage,
.wd-review-ticket,
.lf-created-links{
  position:relative;
}
.wd-review-ticket,
.af-review-time,
.lf-share-link-row{
  box-shadow:var(--finzo-app-card-shadow-soft);
}

/* Create Lifafa expandable panels. The root is data-testid, not an id. Using
   flow-root on the real element prevents first-child .mt-12 margin collapse
   when the animation releases overflow, so there is no post-animation gap
   snap in either direction. */
[data-testid="create-lifafa-view"] #refer-fields:not(.hidden),
[data-testid="create-lifafa-view"] #access-fields:not(.hidden),
[data-testid="create-lifafa-view"] #special-fields:not(.hidden),
[data-testid="create-lifafa-view"] #youtube-summary:not(.hidden){
  display:flow-root!important;
}

/* YouTube link checker: disabled/loading state must retain a solid tactile
   face and a visible themed spinner instead of fading into the sheet. */
#yt-check.yt-check-loading,
#yt-check.yt-check-loading:disabled{
  opacity:1!important;
  background:var(--finzo-raised-face)!important;
  border:1px solid color-mix(in srgb,var(--primary) 24%,var(--border))!important;
  color:var(--primary)!important;
  box-shadow:var(--finzo-raised-shadow)!important;
}
#yt-check.yt-check-loading .ld{
  width:17px;
  height:17px;
  border:2px solid color-mix(in srgb,var(--primary) 24%,transparent)!important;
  border-top-color:var(--primary)!important;
}

@media(max-width:339px){
  .section-title h2{gap:7px}
  .section-title h2::before{height:15px}
}


/* ==========================================================================
   FINZO WALLET — interaction polish v2026.09.15.66
   ========================================================================== */

/* Create Lifafa toggle-stack: use one-sided vertical margins. With two-sided
   margins, the still-present zero-height animated panel temporarily separated
   two sibling margins; display:none then allowed them to collapse, producing a
   last-frame spacing jump on OFF. One-sided spacing is identical before,
   during and after the panel is removed. */
[data-testid="create-lifafa-view"] > .card .toggle-row{
  margin:0 0 8px!important;
}
/* Inputs should read as interactive controls, not plain recessed text boxes.
   Generic single-line controls become slightly taller with a clearer physical
   edge. More-specific compact widgets keep their own declared heights. */
.input{
  height:52px;
  border-width:1.5px;
  border-color:color-mix(in srgb,var(--primary) 17%,var(--border));
  border-bottom-color:color-mix(in srgb,var(--primary) 25%,var(--border));
  background:linear-gradient(180deg,
    color-mix(in srgb,var(--surface) 99%,var(--primary) 1%) 0%,
    color-mix(in srgb,var(--surface-2) 96%,var(--primary) 4%) 100%);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.78),
    inset 0 -1px 1px color-mix(in srgb,var(--primary) 5%,transparent),
    0 3px 0 color-mix(in srgb,var(--primary) 7%,var(--border)),
    0 9px 18px -18px rgba(18,27,58,.42);
  cursor:text;
}
.textarea{
  border-width:1.5px;
  border-color:color-mix(in srgb,var(--primary) 17%,var(--border));
  border-bottom-color:color-mix(in srgb,var(--primary) 25%,var(--border));
  background:linear-gradient(180deg,
    color-mix(in srgb,var(--surface) 99%,var(--primary) 1%),
    color-mix(in srgb,var(--surface-2) 96%,var(--primary) 4%));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.78),
    0 3px 0 color-mix(in srgb,var(--primary) 7%,var(--border)),
    0 9px 18px -18px rgba(18,27,58,.42);
  cursor:text;
}
.field select:not([multiple]){
  min-height:52px;
  border-width:1.5px;
  border-color:color-mix(in srgb,var(--primary) 17%,var(--border));
  border-bottom-color:color-mix(in srgb,var(--primary) 25%,var(--border));
  background-color:var(--surface);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.78),
    0 3px 0 color-mix(in srgb,var(--primary) 7%,var(--border)),
    0 9px 18px -18px rgba(18,27,58,.42);
  cursor:pointer;
}
.input::placeholder,.textarea::placeholder{
  color:color-mix(in srgb,var(--text-muted) 84%,transparent);
  opacity:1;
}
.input:hover,.textarea:hover,.field select:hover{
  border-color:color-mix(in srgb,var(--primary) 34%,var(--border));
}
.input:focus,.textarea:focus,.field select:focus{
  border-color:color-mix(in srgb,var(--primary) 78%,var(--border));
  border-bottom-color:var(--primary);
  background:var(--surface);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.76),
    0 2px 0 color-mix(in srgb,var(--primary) 18%,var(--border)),
    0 0 0 3px var(--primary-soft),
    0 12px 24px -21px color-mix(in srgb,var(--primary) 55%,transparent);
}
[data-theme="dark"] .input,
[data-theme="dark"] .textarea,
[data-theme="dark"] .field select:not([multiple]){
  border-color:color-mix(in srgb,var(--primary) 20%,var(--border));
  border-bottom-color:color-mix(in srgb,var(--primary) 32%,var(--border));
  background:linear-gradient(180deg,
    color-mix(in srgb,var(--surface) 96%,#fff 4%),
    color-mix(in srgb,var(--surface-2) 97%,var(--primary) 3%));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.055),
    inset 0 -1px 1px rgba(0,0,0,.22),
    0 3px 0 color-mix(in srgb,var(--primary) 10%,rgba(0,0,0,.62)),
    0 10px 20px -18px rgba(0,0,0,.78);
}
[data-theme="dark"] .input:focus,
[data-theme="dark"] .textarea:focus,
[data-theme="dark"] .field select:focus{
  background:color-mix(in srgb,var(--surface) 97%,#fff 3%);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.06),
    0 2px 0 color-mix(in srgb,var(--primary) 25%,rgba(0,0,0,.55)),
    0 0 0 3px var(--primary-soft),
    0 12px 24px -20px rgba(0,0,0,.72);
}

/* Brand-colour icons inside the universal Tools sheet. These selectors are
   intentionally more specific than the generic .set-row .sic app-depth rule. */
.tools-sheet-group [data-testid="tool-youtube-filter"] .sic{
  background:linear-gradient(145deg,#ff3131,#d60000)!important;
  color:#fff!important;
  border-color:rgba(255,255,255,.30)!important;
  box-shadow:0 11px 20px -14px rgba(224,0,0,.82),inset 0 1px 0 rgba(255,255,255,.30),inset 0 -1px 0 rgba(100,0,0,.18)!important;
}
.tools-sheet-group [data-testid="tool-tg-post-maker"] .sic{
  background:linear-gradient(145deg,#2aabee,#168dcc)!important;
  color:#fff!important;
  border-color:rgba(255,255,255,.30)!important;
  box-shadow:0 11px 20px -14px rgba(34,158,217,.84),inset 0 1px 0 rgba(255,255,255,.30),inset 0 -1px 0 rgba(0,80,120,.17)!important;
}


/* ========================================================================== 
   FINZO WALLET — focused interaction + manager polish v2026.09.15.67
   ========================================================================== */

/* Create Lifafa: these gaps live INSIDE the dynamic content, so the measured
   height animator includes them during both open and close. This keeps the
   Special Users panel separated from Telegram Channel Join without bringing
   back the margin-collapse snap fixed in v65/v66. */
/* Keep the visible separation as real inner content, not padding on the
   animated panel. Padding survives a CSS height:0 collapse and caused the
   final 10px to disappear only when .hidden was applied. This spacer is fully
   clipped by the parent's overflow:hidden during closing, so there is no snap. */
[data-testid="create-lifafa-view"] #special-fields{
  padding-bottom:0!important;
}
[data-testid="create-lifafa-view"] #special-fields .lf-special-bottom-gap{
  display:block;
  height:10px;
  min-height:10px;
  pointer-events:none;
}
[data-testid="create-lifafa-view"] #tg-info{
  margin-bottom:10px!important;
  padding:0 2px;
}

/* Manager setting actions must stay visibly actionable in both themes. These
   are explicit solid save actions rather than translucent/ghost controls. */
[data-testid="withdrawal-manager-view"] .wm-receive-card .wm-save-range,
[data-testid="fund-manager-view"] .fm-save-upi{
  min-height:47px;
  background:var(--grad)!important;
  color:#fff!important;
  border:1px solid rgba(255,255,255,.20)!important;
  box-shadow:
    0 12px 22px -14px color-mix(in srgb,var(--primary) 84%,#111 16%),
    inset 0 1px 0 rgba(255,255,255,.32),
    inset 0 -2px 0 rgba(0,0,0,.10)!important;
  opacity:1;
}
[data-testid="withdrawal-manager-view"] .wm-receive-card .wm-save-range:disabled,
[data-testid="fund-manager-view"] .fm-save-upi:disabled{
  opacity:.78!important;
  color:#fff!important;
  filter:saturate(.82);
}
[data-testid="withdrawal-manager-view"] .wm-receive-card .wm-save-range .ld,
[data-testid="fund-manager-view"] .fm-save-upi .ld{
  border-color:rgba(255,255,255,.42)!important;
  border-top-color:#fff!important;
}

/* ========================================================================== 
   FINZO WALLET — A-PIN keypad polish v2026.09.15.68
   Visual-only: retains the original keypad logic and universal sheet gestures.
   ========================================================================== */

/* Account PIN keypad — port only the tactile key treatment from the app-look
   experiment. No grid/height/JS behavior changes. */
.keypad .key{
  background:var(--finzo-app-card-face)!important;
  border:1px solid var(--finzo-app-card-border)!important;
  box-shadow:
    0 10px 18px -14px rgba(20,27,55,.48),
    0 4px 9px -7px rgba(20,27,55,.26),
    inset 0 1px 0 rgba(255,255,255,.94),
    inset 0 -1px 0 color-mix(in srgb,var(--primary) 7%,transparent)!important;
  color:var(--text)!important;
  font-weight:800!important;
  -webkit-tap-highlight-color:transparent;
}
.keypad .key.del{color:var(--danger)!important}
.keypad .key:active{
  transform:translateY(2px) scale(.96)!important;
  background:color-mix(in srgb,var(--surface-2) 92%,var(--primary) 8%)!important;
  box-shadow:
    inset 0 3px 7px rgba(20,27,55,.14),
    inset 0 1px 2px rgba(20,27,55,.10)!important;
}
@media(hover:hover) and (pointer:fine){
  .keypad .key:hover{
    border-color:color-mix(in srgb,var(--primary) 25%,var(--border))!important;
  }
}
[data-theme="dark"] .keypad .key{
  box-shadow:
    0 11px 20px -13px rgba(0,0,0,.72),
    0 4px 9px -6px rgba(0,0,0,.46),
    inset 0 1px 0 rgba(255,255,255,.075),
    inset 0 -1px 0 rgba(0,0,0,.22)!important;
}
[data-theme="dark"] .keypad .key:active{
  box-shadow:
    inset 0 3px 8px rgba(0,0,0,.48),
    inset 0 1px 2px rgba(0,0,0,.34)!important;
}

/* Universal BottomSheet drag affordance — keep it neutral like the original
   stable theme. The handle must not inherit the user's primary/theme colour. */
.sheet .sheet-drag-handle .handle,
.sheet .handle{
  width:44px!important;
  height:5px!important;
  border-radius:5px!important;
  background:var(--border)!important;
  box-shadow:none!important;
}


/* ========================================================================== 
   FINZO WALLET — security + manager transfer + scratch polish v2026.09.15.69
   ========================================================================== */

/* Scratch winning chance: retain the discrete 20/40/60/80/100 choices and add
   a theme-matched tactile range control. */
.lifafa-chance-buttons{flex-wrap:wrap;margin-bottom:12px}
.lifafa-chance-slider{
  padding:12px 12px 9px;
  border:1px solid color-mix(in srgb,var(--primary) 18%,var(--border));
  border-radius:16px;
  background:linear-gradient(145deg,color-mix(in srgb,var(--surface) 97%,var(--primary) 3%),var(--surface-2));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.72),0 7px 15px -13px rgba(20,27,55,.5);
}
.lifafa-chance-slider input[type="range"]{
  width:100%;height:24px;margin:0;appearance:none;-webkit-appearance:none;background:transparent;cursor:pointer;
}
.lifafa-chance-slider input[type="range"]::-webkit-slider-runnable-track{
  height:7px;border-radius:999px;background:linear-gradient(90deg,var(--primary),color-mix(in srgb,var(--primary) 58%,var(--border)));
  box-shadow:inset 0 1px 2px rgba(20,27,55,.18);
}
.lifafa-chance-slider input[type="range"]::-webkit-slider-thumb{
  appearance:none;-webkit-appearance:none;width:23px;height:23px;margin-top:-8px;border-radius:50%;
  border:3px solid var(--surface);background:var(--primary);
  box-shadow:0 5px 12px -5px color-mix(in srgb,var(--primary) 72%,#000 28%),0 0 0 1px color-mix(in srgb,var(--primary) 48%,var(--border));
}
.lifafa-chance-slider input[type="range"]::-moz-range-track{height:7px;border-radius:999px;background:color-mix(in srgb,var(--primary) 58%,var(--border));box-shadow:inset 0 1px 2px rgba(20,27,55,.18)}
.lifafa-chance-slider input[type="range"]::-moz-range-progress{height:7px;border-radius:999px;background:var(--primary)}
.lifafa-chance-slider input[type="range"]::-moz-range-thumb{width:18px;height:18px;border-radius:50%;border:3px solid var(--surface);background:var(--primary);box-shadow:0 5px 12px -5px color-mix(in srgb,var(--primary) 72%,#000 28%)}
.lifafa-chance-scale{display:flex;justify-content:space-between;gap:4px;margin-top:3px;color:var(--muted);font-size:10px;font-weight:800}
[data-theme="dark"] .lifafa-chance-slider{box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 8px 16px -13px rgba(0,0,0,.9)}

/* Add Fund Manager: instant main-wallet transfer sits beside the existing UPI
   funding path and uses the same configured commission preview. */
.fm-main-wallet-strip{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  margin:10px 0 12px;padding:11px 13px;border-radius:14px;
  border:1px solid var(--border);background:var(--surface-2);
  box-shadow:inset 0 1px 2px rgba(20,27,55,.06);
}
.fm-main-wallet-strip span{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:12px;font-weight:700}
.fm-main-wallet-strip span i{color:var(--primary)}
.fm-main-wallet-strip b{font-size:13px;color:var(--text)}
.fm-funding-actions{display:grid;grid-template-columns:1fr 1fr;gap:9px}
.fm-funding-actions .btn{min-height:48px;height:auto;white-space:normal;line-height:1.15;padding:10px 9px}
.fm-wallet-transfer{
  border-color:color-mix(in srgb,var(--primary) 26%,var(--border))!important;
  color:var(--primary)!important;
  background:linear-gradient(145deg,color-mix(in srgb,var(--surface) 96%,var(--primary) 4%),var(--surface-2))!important;
  box-shadow:0 9px 16px -13px color-mix(in srgb,var(--primary) 56%,#111 44%),inset 0 1px 0 rgba(255,255,255,.75)!important;
}
[data-theme="dark"] .fm-wallet-transfer{box-shadow:0 9px 16px -13px rgba(0,0,0,.9),inset 0 1px 0 rgba(255,255,255,.07)!important}
@media(max-width:390px){.fm-funding-actions{grid-template-columns:1fr}.fm-funding-actions .btn{min-height:46px}}

/* ========================================================================== 
   FINZO WALLET — Create Lifafa performance + slider-only polish v2026.09.15.70
   ========================================================================== */

/* Current Scratch UI is slider-only. The hidden legacy selector rule also
   protects against stale cached markup briefly surviving an SPA swap. */
[data-testid="create-lifafa-view"] .lifafa-chance-buttons{display:none!important}
[data-testid="create-lifafa-view"] .lifafa-chance-slider input[type="range"]{
  --chance-pos:100%;
}
[data-testid="create-lifafa-view"] .lifafa-chance-slider input[type="range"]::-webkit-slider-runnable-track{
  background:linear-gradient(90deg,
    var(--primary) 0 var(--chance-pos),
    color-mix(in srgb,var(--primary) 18%,var(--border)) var(--chance-pos) 100%);
}

/* Create is one of the tallest interactive views. The full app-depth stack was
   visually correct but forced several large multi-layer shadows to repaint on
   every height-animation frame in Android WebView. Keep the same tactile look
   here with a lighter two-layer shadow budget. No layout/interaction geometry
   is changed. */
[data-testid="create-lifafa-view"]>.card{
  box-shadow:0 10px 22px -19px rgba(18,27,58,.42),inset 0 1px 0 rgba(255,255,255,.58)!important;
}
[data-testid="create-lifafa-view"] .type-card,
[data-testid="create-lifafa-view"] .toggle-row{
  box-shadow:0 7px 16px -14px rgba(18,27,58,.38),inset 0 1px 0 rgba(255,255,255,.52)!important;
}
[data-testid="create-lifafa-view"] .input,
[data-testid="create-lifafa-view"] .textarea{
  box-shadow:inset 0 1px 1px rgba(16,24,54,.06),0 2px 0 color-mix(in srgb,var(--primary) 7%,var(--border))!important;
}
[data-theme="dark"] [data-testid="create-lifafa-view"]>.card{
  box-shadow:0 10px 22px -18px rgba(0,0,0,.68),inset 0 1px 0 rgba(255,255,255,.05)!important;
}
[data-theme="dark"] [data-testid="create-lifafa-view"] .type-card,
[data-theme="dark"] [data-testid="create-lifafa-view"] .toggle-row{
  box-shadow:0 7px 16px -13px rgba(0,0,0,.62),inset 0 1px 0 rgba(255,255,255,.045)!important;
}

/* The animator owns max-height only while this class exists. Avoid opacity and
   child transitions so the browser only lays out the changing block once per
   frame instead of repainting all controls inside it. */
[data-testid="create-lifafa-view"] .lf-panel-animating{
  will-change:max-height;
}
[data-testid="create-lifafa-view"] .lf-panel-animating .input,
[data-testid="create-lifafa-view"] .lf-panel-animating .textarea,
[data-testid="create-lifafa-view"] .lf-panel-animating .mobile-preview{
  transition:none!important;
}


/* ========================================================================== 
   FINZO WALLET — Login clarity + compact public footer v2026.09.15.76
   ========================================================================== */

/* Secondary auth-method copy should explain the option without competing with
   the primary label. The button itself intentionally stays tactile/raised. */
.auth-btn .auth-method-note{
  margin-top:2px;
  color:var(--text-muted)!important;
  font-weight:500!important;
  line-height:1.35;
  letter-spacing:0;
}

/* Passcode-login explanation shown inside the universal login sheet. */
.auth-passcode-note{
  display:flex;
  align-items:flex-start;
  gap:9px;
  margin:12px 0 0;
  padding:11px 12px;
  border:1px solid color-mix(in srgb,var(--primary) 14%,var(--border));
  border-radius:13px;
  background:color-mix(in srgb,var(--primary) 5%,var(--surface-2));
  color:var(--text-muted);
  font-size:.68rem;
  font-weight:550;
  line-height:1.55;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.52);
}
.auth-passcode-note i{
  flex:none;
  margin-top:2px;
  color:var(--primary);
  font-size:.74rem;
}
[data-theme="dark"] .auth-passcode-note{
  background:color-mix(in srgb,var(--primary) 7%,var(--surface-2));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.045);
}

/* Keep the premium footer treatment but remove unnecessary vertical bulk.
   Mobile uses one full-width email row + two compact half-width actions. */
.public-site-footer .public-footer-inner{
  padding-top:14px!important;
  padding-bottom:calc(14px + var(--safe-b))!important;
}
.public-site-footer .public-footer-top{
  flex-direction:row!important;
  align-items:center!important;
  gap:9px!important;
}
.public-site-footer .public-footer-brand{gap:8px!important}
.public-site-footer .public-footer-brand img{
  width:34px!important;
  height:34px!important;
  border-radius:10px!important;
}
.public-site-footer .public-footer-brand>div{gap:1px!important}
.public-site-footer .public-footer-brand b{font-size:.74rem!important}
.public-site-footer .public-footer-brand span{
  font-size:.54rem!important;
  line-height:1.25!important;
}
.public-site-footer .public-footer-web{
  min-height:29px!important;
  padding:0 9px!important;
  border-radius:9px!important;
  font-size:.56rem!important;
}
.public-site-footer .public-footer-contact-grid{
  grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
  gap:6px!important;
  margin-top:10px!important;
  padding:6px!important;
  border-radius:13px!important;
}
.public-site-footer .public-footer-contact-email{grid-column:1/-1!important}
.public-site-footer .public-footer-contact{
  min-height:39px!important;
  gap:7px!important;
  padding:5px 7px!important;
  border-radius:9px!important;
}
.public-site-footer .public-footer-contact-icon{
  width:27px!important;
  height:27px!important;
  border-radius:8px!important;
  font-size:.62rem!important;
}
.public-site-footer .public-footer-contact small{
  font-size:.46rem!important;
  line-height:1.15!important;
  letter-spacing:.055em!important;
}
.public-site-footer .public-footer-contact b{
  font-size:.59rem!important;
  line-height:1.25!important;
}
.public-site-footer .public-footer-contact>i{font-size:.46rem!important}
.public-site-footer .public-footer-legal{
  gap:6px!important;
  margin-top:9px!important;
  padding-top:8px!important;
}
.public-site-footer .public-footer-legal button,
.public-site-footer .public-footer-legal span{font-size:.53rem!important}
.public-site-footer .public-footer-note{
  margin-top:6px!important;
  font-size:.48rem!important;
  line-height:1.35!important;
}

@media(max-width:339px){
  .public-site-footer .public-footer-top{
    flex-direction:column!important;
    align-items:flex-start!important;
  }
  .public-site-footer .public-footer-web{width:100%!important;justify-content:center!important}
  .public-site-footer .public-footer-contact-grid{grid-template-columns:1fr!important}
  .public-site-footer .public-footer-contact-email{grid-column:auto!important}
}

/* ========================================================================== 
   FINZO WALLET — public footer + company controls v2026.09.15.77
   ========================================================================== */

/* Give the landing access buttons a little more breathing room before the
   dark footer starts. */
.landing-page .landing-bottom-actions{
  margin-bottom:34px!important;
}

/* Flat footer edge with a dedicated theme-gradient top rule. */
.public-site-footer{
  border:0!important;
  border-radius:0!important;
  box-shadow:0 -18px 42px -34px rgba(15,20,40,.52),inset 0 1px 0 rgba(255,255,255,.035)!important;
}
.public-footer-accent{
  display:block!important;
  height:4px!important;
  min-height:4px!important;
  background:var(--grad)!important;
  box-shadow:0 2px 10px -5px color-mix(in srgb,var(--primary) 80%,transparent)!important;
}

/* Prevent the brand/title and domain chip from ever painting over each other. */
.public-site-footer .public-footer-top{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto!important;
  align-items:center!important;
  column-gap:10px!important;
  min-width:0!important;
}
.public-site-footer .public-footer-brand{
  min-width:0!important;
  max-width:100%!important;
}
.public-site-footer .public-footer-brand>div{
  min-width:0!important;
  overflow:hidden!important;
}
.public-site-footer .public-footer-brand b,
.public-site-footer .public-footer-brand span{
  display:block!important;
  max-width:100%!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
.public-site-footer .public-footer-web{
  min-width:0!important;
  max-width:44vw!important;
  overflow:hidden!important;
}
.public-site-footer .public-footer-web span{
  min-width:0!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}

/* Optional company block controlled from Admin Settings. */
.public-footer-company{
  margin-top:9px;
  padding:10px 11px;
  border:1px solid rgba(255,255,255,.085);
  border-radius:12px;
  background:rgba(255,255,255,.038);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025);
}
.public-footer-company-head{
  display:flex;
  align-items:center;
  gap:7px;
  color:rgba(255,255,255,.72);
  font-size:.52rem;
  font-weight:850;
  letter-spacing:.02em;
}
.public-footer-company-head i{color:color-mix(in srgb,var(--primary) 38%,#fff)}
.public-footer-company>strong{
  display:block;
  margin-top:6px;
  color:#fff;
  font-size:.66rem;
  line-height:1.35;
}
.public-footer-company>p{
  margin:4px 0 0;
  color:rgba(255,255,255,.58);
  font-size:.54rem;
  line-height:1.55;
}
.public-footer-company-meta{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:6px;
  margin-top:8px;
}
.public-footer-company-meta>span,
.public-footer-company-meta>a{
  min-width:0;
  padding:7px 8px;
  border-radius:9px;
  background:rgba(255,255,255,.042);
  color:#fff;
  display:flex;
  flex-direction:column;
  gap:2px;
}
.public-footer-company-meta small{
  color:rgba(255,255,255,.42);
  font-size:.39rem;
  font-weight:850;
  letter-spacing:.055em;
}
.public-footer-company-meta b{
  color:#fff;
  font-size:.51rem;
  font-weight:750;
  line-height:1.35;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

/* Login gets the same shared footer only when enabled by Admin. */
.auth-main>.public-site-footer,
.auth-main .public-site-footer{
  margin-top:24px;
}

@media(max-width:339px){
  .public-site-footer .public-footer-top{
    grid-template-columns:1fr!important;
    row-gap:8px!important;
  }
  .public-site-footer .public-footer-web{
    width:100%!important;
    max-width:none!important;
    justify-content:center!important;
  }
  .public-footer-company-meta{grid-template-columns:1fr}
}

/* ========================================================================== 
   FINZO WALLET — Login footer full-width shell fix v2026.09.15.78
   ========================================================================== */
/* The login view lives inside .main, which keeps horizontal page padding for
   the auth form. The shared footer must escape that content padding and span
   the complete FINZO app shell, just like the Landing footer. Override the
   global .main > * max-width guard only for this footer. */
.auth-main > .public-site-footer{
  width:calc(100% + var(--page-pad) + var(--page-pad))!important;
  max-width:none!important;
  margin-top:24px!important;
  margin-right:calc(0px - var(--page-pad))!important;
  margin-bottom:0!important;
  margin-left:calc(0px - var(--page-pad))!important;
  align-self:stretch!important;
}

/* Home Services: SOON tiles stay visually secondary, but remain clearly readable.
   This final-loaded override wins consistently in browser and native WebView. */
.service-grid.services-soft .service.is-soon{
  opacity:.84!important;
  filter:saturate(.68)!important;
}
[data-theme="dark"] .service-grid.services-soft .service.is-soon{
  opacity:.80!important;
  filter:saturate(.58)!important;
}