/* TOFY PAY HOME V400 — card-first neon home */
:root{
 --tf-bg:#020817;--tf-bg2:#071129;--tf-card:#08142d;--tf-line:#274c8d;--tf-text:#f6f8ff;--tf-muted:#a8b4d2;
 --tf-blue:#0f77ff;--tf-cyan:#00d9ff;--tf-purple:#8f2cff;--tf-pink:#ff2dbd;--tf-gold:#ffbf3f;
}
body[data-page="home"]{background:radial-gradient(circle at 50% -10%,#122760 0,#061126 34%,#020817 72%,#010511 100%) fixed!important;color:var(--tf-text)}
body[data-page="home"] .page-main{max-width:none!important;padding:0!important;overflow:visible!important}
.tf400{width:min(1480px,100%);margin:0 auto;padding:24px 22px 90px;position:relative;isolation:isolate}
.tf400 *{box-sizing:border-box}
.tf400 a{text-decoration:none;color:inherit}
.tf400-mobile-header{display:none}
.tf400-dashboard{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:18px;margin-bottom:20px}
.tf400-wallet-card,.tf400-promo,.tf400-search,.tf400-category,.tf400-gaming-banner,.tf400-trust{border:1px solid rgba(61,130,255,.55);background:linear-gradient(145deg,rgba(8,20,47,.96),rgba(4,10,29,.96));box-shadow:0 22px 60px rgba(0,0,0,.25),inset 0 0 45px rgba(34,88,255,.05)}
.tf400-wallet-card{position:relative;overflow:hidden;border-radius:28px;padding:24px;min-height:260px;border-color:rgba(255,192,72,.72);box-shadow:0 0 28px rgba(255,180,43,.10),inset 0 0 45px rgba(255,194,80,.04)}
.tf400-wallet-card:before{content:"";position:absolute;inset:-40% auto auto -30%;width:70%;height:120%;background:radial-gradient(circle,rgba(31,116,255,.26),transparent 67%);pointer-events:none}
.tf400-wallet-head{display:flex;align-items:center;gap:15px;position:relative;z-index:2}
.tf400-wallet-icon{width:64px;height:64px;border-radius:18px;display:grid;place-items:center;font-size:30px;color:var(--tf-gold);border:1px solid #3f5f98;background:linear-gradient(145deg,#142750,#0a1532)}
.tf400-wallet-head div{display:grid;gap:2px}.tf400-wallet-head small{font-size:16px;color:#e8ecfb}.tf400-wallet-head strong{font-size:38px;line-height:1.05;letter-spacing:.01em;color:#fff}
.tf400-eye{margin-inline-start:auto;width:48px;height:48px;border-radius:50%;border:1px solid #3d5f99;background:#0b1938;color:#b8c5e7;font-size:19px;cursor:pointer}
.tf400-plus{position:absolute;inset-inline-end:28px;top:105px;width:48px;height:48px;border-radius:50%;display:grid;place-items:center;font-weight:900;font-size:30px;background:linear-gradient(145deg,#ffd66d,#d98b05);color:#171006;border:2px solid #ffe196;box-shadow:0 0 22px rgba(255,180,28,.7)}
.tf400-quick-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:42px;position:relative;z-index:2}
.tf400-quick-grid a{display:grid;justify-items:center;gap:9px;color:#eef2ff;font-size:13px;font-weight:800}
.tf400-quick-grid i{width:48px;height:48px;border-radius:15px;display:grid;place-items:center;font-style:normal;font-size:23px;border:1px solid #35558e;background:linear-gradient(145deg,#13264e,#09142f);box-shadow:inset 0 0 20px rgba(58,101,255,.08)}
.tf400-quick-grid a:first-child i{background:linear-gradient(145deg,#9c3dff,#5f20db);border-color:#c66bff;color:#fff}
.tf400-promo{position:relative;display:block;overflow:hidden;border-radius:28px;min-height:260px;background:#150535}
.tf400-promo img{width:100%;height:100%;position:absolute;inset:0;object-fit:cover;object-position:center}
.tf400-promo-overlay{position:absolute;inset:0;background:linear-gradient(90deg,rgba(20,5,58,.35),rgba(14,4,50,.04) 50%,rgba(4,5,22,.12))}
.tf400-promo-copy{position:absolute;inset:24px auto auto 24px;display:grid;gap:4px;max-width:48%;direction:rtl;text-align:right;text-shadow:0 2px 18px rgba(0,0,0,.55)}
[dir="rtl"] .tf400-promo-copy{inset:24px auto auto 24px}
.tf400-promo-copy strong{font-size:30px;color:#f0a9ff}.tf400-promo-copy b{font-size:24px}.tf400-promo-copy small{font-size:14px;color:#e6e4ff}.tf400-promo-copy em{margin-top:34px;width:max-content;padding:11px 24px;border-radius:24px;background:linear-gradient(90deg,#6a14ff,#c01bff);border:1px solid #d873ff;font-style:normal;font-weight:900}
.tf400-search{display:grid;grid-template-columns:62px 1fr 62px;align-items:center;border-radius:23px;padding:0 8px;margin:18px 0 22px;height:70px;background:linear-gradient(90deg,rgba(8,20,47,.96),rgba(6,13,36,.96));box-shadow:0 0 24px rgba(33,104,255,.08)}
.tf400-search input{width:100%;height:100%;border:0;outline:0;background:transparent;color:#fff;font:inherit;font-size:18px;padding:0 12px;text-align:start}.tf400-search input::placeholder{color:#8d9abc}
.tf400-search button{border:0;background:transparent;color:#eaf3ff;font-size:34px;cursor:pointer}.tf400-search .tf400-filter{height:48px;border-radius:14px;border:1px solid #345a95;background:#0e1e40;font-size:25px}
.tf400-category-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin:0 0 24px}
.tf400-category{position:relative;overflow:hidden;border-radius:25px;aspect-ratio:217/265;background:linear-gradient(145deg,#08265d,#17072e);transition:.23s ease;box-shadow:0 16px 38px rgba(0,0,0,.28),0 0 0 1px rgba(59,128,255,.18) inset}
.tf400-category:hover{transform:translateY(-4px) scale(1.01);border-color:#6fa3ff;box-shadow:0 20px 55px rgba(25,73,255,.22),0 0 26px rgba(113,45,255,.16)}
.tf400-category img{width:100%;height:100%;object-fit:cover;display:block}.tf400-category-shine{position:absolute;inset:-120% 70% auto -60%;height:250%;width:25%;transform:rotate(24deg);background:linear-gradient(90deg,transparent,rgba(255,255,255,.20),transparent);transition:.5s}.tf400-category:hover .tf400-category-shine{inset-inline-start:140%}
.tf400-gaming-banner{position:relative;display:block;overflow:hidden;border-radius:30px;min-height:255px;margin:0 0 22px;background:#051a48}
.tf400-gaming-banner img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.tf400-banner-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(2,10,27,.05) 40%,rgba(2,8,28,.87) 76%,rgba(2,7,25,.96))}
.tf400-banner-copy{position:absolute;inset:50% 45px auto auto;transform:translateY(-50%);display:grid;gap:7px;max-width:430px;text-align:right;direction:rtl}.tf400-banner-copy strong{font-size:38px}.tf400-banner-copy small{font-size:20px}.tf400-banner-copy b{margin-top:16px;width:max-content;padding:12px 28px;border-radius:24px;background:linear-gradient(145deg,#ffd668,#d79511);color:#171006;box-shadow:0 0 22px rgba(255,190,47,.38)}
.tf400-trust{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;border-radius:24px;padding:18px 20px;margin-bottom:18px}.tf400-trust article{display:flex;align-items:center;gap:12px;justify-content:center;padding:9px 10px;border-inline-end:1px solid rgba(98,128,191,.18)}.tf400-trust article:last-child{border-inline-end:0}.tf400-trust i{width:48px;height:48px;display:grid;place-items:center;border-radius:50%;font-style:normal;font-size:21px;background:#101a34}.tf400-trust .gold{color:#ffbd36;box-shadow:inset 0 0 0 1px #795719}.tf400-trust .purple{color:#d56aff;box-shadow:inset 0 0 0 1px #673086}.tf400-trust .cyan{color:#22e1ff;box-shadow:inset 0 0 0 1px #126072}.tf400-trust div{display:grid;gap:3px}.tf400-trust b{font-size:15px}.tf400-trust small{font-size:12px;color:#a9b7d8}
.tf400-bottom-nav{display:none}
.tf400-menu-panel{display:none}

@media(max-width:850px){
 body[data-page="home"]>header.topbar{display:none!important}
 body[data-page="home"] .layout.layout-global-side{display:block!important;width:100%!important;margin:0!important;padding:0!important}
 body[data-page="home"] .layout.layout-global-side>.side,body[data-page="home"] aside.side{display:none!important}
 body[data-page="home"] .page-main{width:100%!important;max-width:none!important;margin:0!important;padding:0!important}
 body[data-page="home"] footer{padding-bottom:118px}
 .tf400{width:100%;padding:16px 16px 112px;overflow:hidden;background:radial-gradient(circle at 45% -5%,rgba(21,62,133,.20),transparent 31%)}
 .tf400-mobile-header{display:grid;grid-template-columns:58px minmax(130px,1fr) auto;align-items:center;gap:10px;min-height:72px;margin-bottom:18px;position:relative;z-index:110}
 .tf400-menu-btn{width:54px;height:54px;border-radius:17px;border:1px solid #2d65aa;background:linear-gradient(145deg,#112a56,#071530);display:grid;place-content:center;gap:6px;box-shadow:0 0 21px rgba(0,114,255,.15)}
 .tf400-menu-btn span{width:25px;height:3px;border-radius:3px;background:#e9f2ff}
 .tf400-brand{display:flex;align-items:center;justify-content:center;min-width:0}.tf400-brand img{display:block;max-width:205px;width:100%;height:56px;object-fit:contain;object-position:center}
 .tf400-head-actions{display:flex;align-items:center;gap:7px}.tf400-currency-wrap,.tf400-lang-wrap{position:relative}
 .tf400-currency-btn,.tf400-lang-btn,.tf400-bell{min-height:48px;border:1px solid #3a5d9b;background:linear-gradient(145deg,#111e43,#08132e);color:#fff;border-radius:16px;padding:0 10px;display:flex;align-items:center;gap:5px;font-size:12px;white-space:nowrap}.tf400-currency-btn{border-color:#6f35bb}.tf400-currency-btn i{font-style:normal}.tf400-bell{width:46px;justify-content:center;font-size:20px;position:relative}.tf400-bell span{position:absolute;width:8px;height:8px;border-radius:50%;background:#ff466f;right:7px;top:7px;box-shadow:0 0 10px #ff466f}
 .tf400-lang-btn{display:none}
 .tf400-currency-menu,.tf400-lang-menu{position:absolute;top:56px;inset-inline-end:0;width:220px;border:1px solid #3f4ea2;background:rgba(3,9,28,.98);padding:8px;border-radius:16px;z-index:130;box-shadow:0 20px 50px rgba(0,0,0,.55);backdrop-filter:blur(14px)}
 .tf400-currency-menu button,.tf400-lang-menu a{width:100%;display:flex;align-items:center;justify-content:space-between;gap:8px;padding:11px 12px;border:0;border-bottom:1px solid rgba(255,255,255,.07);background:transparent;color:#fff;font:inherit;font-size:13px;text-align:start}.tf400-currency-menu button:last-child,.tf400-lang-menu a:last-child{border-bottom:0}.tf400-currency-menu button.on{color:#e1bcff;background:rgba(126,54,220,.18);border-radius:10px}
 .tf400-dashboard{grid-template-columns:1fr 1.03fr;gap:10px;margin-bottom:14px}
 .tf400-wallet-card,.tf400-promo{border-radius:19px;min-height:198px}
 .tf400-wallet-card{padding:15px}.tf400-wallet-icon{width:48px;height:48px;border-radius:14px;font-size:23px}.tf400-wallet-head{gap:10px}.tf400-wallet-head small{font-size:12px}.tf400-wallet-head strong{font-size:26px}.tf400-eye{width:38px;height:38px}.tf400-plus{top:80px;inset-inline-end:18px;width:38px;height:38px;font-size:23px}.tf400-quick-grid{margin-top:30px;gap:6px}.tf400-quick-grid i{width:37px;height:37px;border-radius:11px;font-size:17px}.tf400-quick-grid span{font-size:9px;text-align:center}.tf400-promo-copy{display:none}
 .tf400-search{height:58px;grid-template-columns:45px 1fr 48px;border-radius:18px;margin:13px 0 18px}.tf400-search input{font-size:15px;padding:0 6px}.tf400-search button{font-size:28px}.tf400-search .tf400-filter{height:42px;font-size:20px}
 .tf400-category-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:11px;margin-bottom:16px}.tf400-category{border-radius:18px}
 .tf400-gaming-banner{min-height:190px;border-radius:20px;margin-bottom:16px}.tf400-banner-copy{inset:50% auto auto 18px;max-width:52%;text-align:right}.tf400-banner-copy strong{font-size:24px}.tf400-banner-copy small{font-size:14px}.tf400-banner-copy b{font-size:13px;padding:9px 18px;margin-top:7px}
 .tf400-trust{grid-template-columns:repeat(4,1fr);border-radius:18px;padding:12px 7px;gap:0}.tf400-trust article{display:grid;justify-items:center;text-align:center;padding:6px 4px;border-inline-end:1px solid rgba(98,128,191,.18)}.tf400-trust i{width:38px;height:38px;font-size:17px}.tf400-trust b{font-size:10px}.tf400-trust small{font-size:8px;line-height:1.35}
 .tf400-bottom-nav{position:fixed;z-index:1000;left:14px;right:14px;bottom:10px;height:82px;border-radius:28px;border:1px solid #3880e7;background:linear-gradient(180deg,rgba(7,19,49,.97),rgba(3,10,30,.98));box-shadow:0 0 28px rgba(0,114,255,.42),0 20px 55px rgba(0,0,0,.55);display:grid;grid-template-columns:repeat(5,1fr);align-items:center;padding:7px 8px 8px;backdrop-filter:blur(18px)}
 .tf400-bottom-nav>a{position:relative;display:grid;justify-items:center;gap:4px;color:#cbd7f2;font-size:10px;min-width:0}.tf400-bottom-nav i{font-style:normal;font-size:22px;line-height:1}.tf400-bottom-nav em{position:absolute;top:-4px;right:13px;min-width:17px;height:17px;padding:0 4px;border-radius:10px;background:#6c43ff;color:#fff;font-style:normal;font-size:9px;display:grid;place-items:center}.tf400-home-orb{transform:translateY(-17px)}.tf400-home-orb>span{width:68px;height:68px;border-radius:50%;display:grid;place-items:center;border:2px solid #13b3ff;background:radial-gradient(circle at 50% 35%,#183d7e,#07142f 70%);box-shadow:0 0 24px #1f78ff,0 0 32px rgba(145,39,255,.45)}.tf400-home-orb img{width:48px;height:48px;object-fit:contain}.tf400-home-orb b{font-size:10px;color:#fff}
 .tf400-menu-panel{position:fixed;display:block;inset:0;z-index:1300;background:rgba(0,4,17,.76);backdrop-filter:blur(8px)}.tf400-menu-card{position:absolute;inset:0 0 0 auto;width:min(82vw,330px);padding:22px;background:linear-gradient(180deg,#091934,#030a1c);border-inline-start:1px solid #2e5ea6;box-shadow:-20px 0 55px rgba(0,0,0,.5)}[dir="ltr"] .tf400-menu-card{inset:0 auto 0 0;border-inline-start:0;border-inline-end:1px solid #2e5ea6}.tf400-menu-top{display:grid;grid-template-columns:46px 1fr 40px;align-items:center;gap:10px;padding-bottom:18px;border-bottom:1px solid rgba(255,255,255,.08)}.tf400-menu-top img{width:42px;height:42px}.tf400-menu-top button{width:38px;height:38px;border-radius:12px;border:1px solid #385b94;background:#0c1a36;color:#fff;font-size:24px}.tf400-menu-card nav{display:grid;gap:8px;margin-top:18px}.tf400-menu-card nav a{display:flex;align-items:center;gap:12px;padding:13px 14px;border:1px solid rgba(83,117,187,.25);border-radius:14px;background:rgba(15,31,64,.65);color:#eaf1ff;font-weight:800}
}
@media(max-width:560px){
 .tf400{padding-inline:12px}.tf400-mobile-header{grid-template-columns:48px 1fr auto;gap:6px}.tf400-menu-btn{width:46px;height:46px;border-radius:14px}.tf400-menu-btn span{width:22px}.tf400-brand img{max-width:145px;height:48px}.tf400-bell{display:none}.tf400-currency-btn{min-height:43px;padding:0 8px;font-size:11px}.tf400-dashboard{grid-template-columns:1fr 1fr}.tf400-wallet-card,.tf400-promo{min-height:174px}.tf400-wallet-head strong{font-size:22px}.tf400-wallet-head small{font-size:10px}.tf400-wallet-icon{width:40px;height:40px}.tf400-eye{display:none}.tf400-plus{top:66px;width:34px;height:34px}.tf400-quick-grid{margin-top:25px}.tf400-quick-grid i{width:31px;height:31px;font-size:14px}.tf400-quick-grid span{font-size:7.5px}.tf400-gaming-banner{min-height:150px}.tf400-banner-copy strong{font-size:18px}.tf400-banner-copy small{font-size:11px}.tf400-banner-copy b{padding:7px 12px;font-size:11px}.tf400-trust small{display:none}.tf400-trust b{font-size:8px}.tf400-trust i{width:33px;height:33px}
}

/* =========================================================
   TF400 MOBILE DRAWER FIX V2
   ========================================================= */

/*
 * Critical:
 * Respect HTML hidden attribute.
 * Old mobile CSS forced display:block and prevented closing.
 */
.tf400-menu-panel[hidden]{
  display:none!important;
}

@media(max-width:850px){

  .tf400-menu-panel:not([hidden]){
    display:block!important;
  }

  .tf400-menu-card{
    overflow-y:auto;
    overflow-x:hidden;
    overscroll-behavior:contain;
    -webkit-overflow-scrolling:touch;
    padding-bottom:120px;
  }

  .tf400-menu-top button[data-home-menu-close]{
    cursor:pointer;
    touch-action:manipulation;
    position:relative;
    z-index:10;
  }

  /* Currency inside drawer */
  .tf400-drawer-currency{
    position:relative;
    margin:16px 0 8px;
  }

  .tf400-drawer-currency-btn{
    width:100%;
    min-height:56px;
    display:grid;
    grid-template-columns:1fr auto auto;
    align-items:center;
    gap:10px;

    padding:0 15px;

    border:1px solid rgba(135,70,255,.58);
    border-radius:16px;

    background:
      linear-gradient(
        135deg,
        rgba(82,42,170,.32),
        rgba(10,29,65,.88)
      );

    color:#fff;
    font:inherit;
    font-weight:800;
    cursor:pointer;

    box-shadow:
      inset 0 0 22px rgba(115,67,255,.08),
      0 8px 25px rgba(0,0,0,.18);
  }

  .tf400-drawer-currency-btn>span{
    text-align:start;
  }

  .tf400-drawer-currency-btn>strong{
    padding:6px 10px;
    border-radius:10px;
    background:rgba(120,65,255,.20);
    color:#e9ddff;
    font-size:13px;
  }

  .tf400-drawer-currency-btn>i{
    font-style:normal;
    color:#aebfe9;
  }

  .tf400-drawer-currency-menu{
    margin-top:8px;
    padding:7px;

    border:1px solid rgba(80,111,196,.45);
    border-radius:15px;

    background:#06122d;

    box-shadow:
      0 14px 35px rgba(0,0,0,.35);
  }

  .tf400-drawer-currency-menu[hidden]{
    display:none!important;
  }

  .tf400-drawer-currency-menu button{
    width:100%;
    min-height:47px;

    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;

    padding:8px 12px;

    border:0;
    border-bottom:1px solid rgba(255,255,255,.06);

    background:transparent;
    color:#eaf2ff;

    font:inherit;
    font-size:13px;
    cursor:pointer;
  }

  .tf400-drawer-currency-menu button:last-child{
    border-bottom:0;
  }

  .tf400-drawer-currency-menu button.on{
    border-radius:10px;
    background:rgba(119,62,255,.18);
    color:#ddbfff;
  }

  .tf400-drawer-currency-menu button b{
    font-size:12px;
    color:#8fb8ff;
  }
}


/* =========================================================
   TF400_MOBILE_GAMING_BANNER_CLEAN_V1
   Keep original 904x227 artwork without crop or duplicate text.
   ========================================================= */

@media(max-width:850px){

  .tf400-gaming-banner{
    position:relative!important;
    width:100%!important;

    min-height:0!important;
    height:auto!important;

    aspect-ratio:904 / 227!important;

    overflow:hidden!important;
    border-radius:20px!important;
    margin-bottom:16px!important;

    background:#051a48!important;
  }

  .tf400-gaming-banner>img{
    position:absolute!important;
    inset:0!important;

    width:100%!important;
    height:100%!important;

    object-fit:cover!important;
    object-position:center!important;

    display:block!important;
  }

  /*
   * Text + CTA already exist inside gaming-banner.webp.
   * Prevent duplicate text over the artwork.
   */
  .tf400-gaming-banner .tf400-banner-shade,
  .tf400-gaming-banner .tf400-banner-copy{
    display:none!important;
  }
}

@media(max-width:560px){

  .tf400-gaming-banner{
    border-radius:18px!important;
  }
}


/* =========================================================
   TF400 MOBILE FOOTER RESTORE V1
   ========================================================= */

@media(max-width:850px){

  body[data-page="home"] footer,
  body[data-page="home"] .pro-footer,
  body[data-page="home"] .pro-footer-v16{
    display:block!important;
    visibility:visible!important;
    opacity:1!important;
  }

  body[data-page="home"] .pro-footer-v16{
    position:relative!important;
    z-index:2!important;
    width:calc(100% - 16px)!important;
    max-width:100%!important;
    margin:24px 8px 0!important;
    padding:0 0 118px!important;
  }

  body[data-page="home"] .footer-shell{
    width:100%!important;
    max-width:100%!important;
    margin:0 auto!important;
    border-radius:22px!important;
    overflow:hidden!important;
  }

  body[data-page="home"] .footer-top-v16{
    display:grid!important;
  }

  body[data-page="home"] .footer-brand-v16{
    display:block!important;
  }

  body[data-page="home"] .footer-top-v16 > section{
    visibility:visible!important;
    opacity:1!important;
  }

  body[data-page="home"] .footer-top-v16 a{
    display:block!important;
  }
}

