/* TastyGo-style screens, recoloured to GEMMYS green + teal */
.tgx *{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
.tgx{--orange:#1b9977;--ink:#121614;--muted:#727d78;--cream:#f9fdfb;--peach:#e1f2ea}
html,body{margin:0;width:100%;min-height:100%;background:var(--cream);font-family:'DM Sans',Arial,sans-serif;color:var(--ink)}
body{overflow:hidden}
.tgx.app{position:fixed;inset:0;overflow:hidden;background:linear-gradient(180deg,#f6fbf9 0%,#f9fdfb 53%,#fff 100%)}
.tgx .brand{position:absolute;z-index:5;top:max(22px,env(safe-area-inset-top));left:25px;display:flex;align-items:center;gap:9px;opacity:0;animation:drop .7s .12s ease forwards}
.tgx .logoMark{width:37px;height:37px;border-radius:13px;background:var(--orange);display:grid;place-items:center;box-shadow:0 9px 24px rgba(27,153,119,.22)}
.tgx .logoMark svg{width:21px;height:21px}
.tgx .brandName{font-family:'Manrope',sans-serif;font-weight:800;font-size:19px;letter-spacing:-.7px}
.tgx .brandName b{color:var(--orange)}
.tgx .scene{position:absolute;top:11%;left:0;width:100%;height:49%;overflow:hidden}
.tgx .sun{position:absolute;width:235px;height:235px;border-radius:50%;background:radial-gradient(circle,#d7eee3 0,#e7f5ee 57%,rgba(237,247,242,0) 72%);left:50%;top:40%;transform:translate(-50%,-50%) scale(.7);opacity:0;animation:sunIn 1.1s .25s cubic-bezier(.2,.8,.2,1) forwards}
.tgx .city{position:absolute;left:0;right:0;bottom:24%;height:36%;opacity:.55}
.tgx .road{position:absolute;left:-10%;right:-10%;bottom:6%;height:72px;border-radius:50%;border-top:2px solid #d5eee2;transform:rotate(-3deg)}
.tgx .road:after{content:"";position:absolute;left:9%;right:8%;top:24px;border-top:2px dashed #26d7c5}
.tgx .rider{position:absolute;left:50%;bottom:7%;width:260px;height:215px;transform:translateX(-50%);opacity:0;animation:rideIn 1.15s .42s cubic-bezier(.16,.84,.22,1) forwards}
.tgx .scooter{position:absolute;left:25px;bottom:8px;width:220px;height:105px}
.tgx .wheel{position:absolute;bottom:0;width:54px;height:54px;border:8px solid #212523;border-radius:50%;background:#eee}
.tgx .w1{left:13px}
.tgx .w2{right:8px}
.tgx .bodyBike{position:absolute;left:49px;bottom:27px;width:124px;height:50px;background:var(--orange);border-radius:38px 55px 22px 30px;transform:skewX(-8deg);box-shadow:0 9px 15px rgba(19,40,28,.12)}
.tgx .front{position:absolute;right:31px;bottom:50px;width:15px;height:74px;background:#1ca183;border-radius:12px;transform:rotate(-17deg)}
.tgx .handle{position:absolute;right:17px;bottom:119px;width:48px;height:7px;background:#232725;border-radius:8px;transform:rotate(4deg)}
.tgx .seat{position:absolute;left:83px;bottom:77px;width:65px;height:12px;background:#1f2321;border-radius:10px}
.tgx .avatar{position:absolute;left:104px;bottom:86px;width:69px;height:104px}
.tgx .head{position:absolute;left:23px;top:0;width:43px;height:43px;border-radius:48% 48% 45% 45%;background:#2a5f46;border:4px solid #252927}
.tgx .helmet{position:absolute;left:17px;top:-7px;width:52px;height:28px;background:var(--orange);border-radius:28px 28px 10px 10px;transform:rotate(4deg)}
.tgx .torso{position:absolute;left:8px;top:38px;width:54px;height:57px;background:#1ca081;border-radius:17px 17px 12px 12px;transform:rotate(7deg)}
.tgx .arm{position:absolute;left:47px;top:48px;width:64px;height:15px;background:#1ca081;border-radius:20px;transform:rotate(20deg);transform-origin:left center}
.tgx .leg{position:absolute;left:21px;top:83px;width:71px;height:17px;background:#282625;border-radius:20px;transform:rotate(24deg);transform-origin:left center}
.tgx .box{position:absolute;left:22px;bottom:86px;width:78px;height:72px;background:#1b9c7d;border:4px solid #167e54;border-radius:13px;box-shadow:0 8px 17px rgba(27,153,119,.18)}
.tgx .box:after{content:"TG";position:absolute;inset:0;display:grid;place-items:center;color:#fff;font-family:'Manrope';font-weight:800;font-size:20px}
.tgx .speed{position:absolute;left:0;bottom:61px;width:46px;height:3px;background:#1faf9a;border-radius:8px;box-shadow:-18px 15px 0 #25d4c2,-4px 29px 0 #21bcad;animation:speed 1.2s ease-in-out infinite}
.tgx .copy{position:absolute;z-index:4;left:27px;right:27px;bottom:max(116px,calc(env(safe-area-inset-bottom) + 93px));text-align:center}
.tgx .kicker{font-size:11px;font-weight:700;letter-spacing:2.2px;color:var(--orange);text-transform:uppercase;margin-bottom:10px;opacity:0;animation:up .7s .82s ease forwards}
.tgx h1{font-family:'Manrope',sans-serif;font-size:clamp(30px,8.6vw,42px);line-height:1.07;letter-spacing:-1.8px;margin:0 auto 13px;max-width:390px;font-weight:800;opacity:0;animation:up .75s .92s ease forwards}
.tgx h1 span{color:var(--orange)}
.tgx .desc{max-width:335px;margin:0 auto;color:var(--muted);font-size:14px;line-height:1.58;opacity:0;animation:up .75s 1.03s ease forwards}
.tgx .dots{display:flex;justify-content:center;gap:6px;margin-top:19px;opacity:0;animation:up .6s 1.13s forwards}
.tgx .dot{height:5px;width:6px;background:#d6dcd9;border-radius:8px}
.tgx .dot.on{width:24px;background:var(--orange)}
.tgx .next{position:absolute;z-index:6;left:50%;bottom:max(20px,env(safe-area-inset-bottom));width:68px;height:68px;transform:translateX(-50%) scale(.5);border:0;border-radius:50%;background:var(--orange);color:white;display:grid;place-items:center;box-shadow:0 12px 28px rgba(27,153,119,.32);opacity:0;animation:buttonIn .65s 1.2s cubic-bezier(.17,.9,.27,1.35) forwards;cursor:pointer}
.tgx .next svg{width:24px}
.tgx .next:before{content:"";position:absolute;inset:-7px;border:1px solid rgba(27,153,119,.28);border-radius:50%;animation:pulse 2.1s 1.7s ease-out infinite}
.tgx .next:active{scale:.92}
.tgx.app.leaving .brand,.tgx.app.leaving .scene,.tgx.app.leaving .copy,.tgx.app.leaving .next{transition:.55s cubic-bezier(.4,0,.2,1);opacity:0;transform:translateY(-18px)}
.tgx .toast{position:absolute;z-index:320;left:50%;top:50%;transform:translate(-50%,-50%) scale(.92);padding:13px 17px;background:#141816;color:#fff;border-radius:15px;font-size:12px;font-weight:700;opacity:0;pointer-events:none}
.tgx .toast.show{animation:toast 1.45s ease}
.tgx #hiddenBlogger{display:none!important}
@keyframes drop{from{opacity:0;transform:translateY(-12px)}to{opacity:1;transform:none}}
@keyframes sunIn{to{opacity:1;transform:translate(-50%,-50%) scale(1)}}
@keyframes rideIn{0%{opacity:0;transform:translateX(-80%) translateY(10px) scale(.94)}70%{opacity:1;transform:translateX(-47%) translateY(0) scale(1.01)}100%{opacity:1;transform:translateX(-50%) scale(1)}}
@keyframes speed{50%{transform:translateX(-8px);opacity:.45}}
@keyframes up{from{opacity:0;transform:translateY(15px)}to{opacity:1;transform:none}}
@keyframes buttonIn{to{opacity:1;transform:translateX(-50%) scale(1)}}
@keyframes pulse{0%{transform:scale(.9);opacity:.7}100%{transform:scale(1.42);opacity:0}}
@keyframes toast{0%{opacity:0;transform:translate(-50%,-45%) scale(.92)}20%,75%{opacity:1;transform:translate(-50%,-50%) scale(1)}100%{opacity:0}}
@media(max-height:690px){.tgx .scene{top:8%;height:45%}
.tgx .rider{transform:translateX(-50%) scale(.87);transform-origin:center bottom}
.tgx .copy{bottom:92px}
.tgx h1{font-size:29px}
.tgx .desc{font-size:13px}
.tgx .dots{margin-top:12px}
.tgx .next{width:60px;height:60px;bottom:13px}}
@media(min-width:650px){.tgx.app{left:50%;width:430px;transform:translateX(-50%);box-shadow:0 0 70px rgba(0,0,0,.1)}}
@media(prefers-reduced-motion:reduce){.tgx *,.tgx *:before,.tgx *:after{animation-duration:.01ms!important;animation-iteration-count:1!important}}
.tgx .tgNoticeBtn{width:100%;border:1px solid #daefe5;border-radius:17px;background:#fff;padding:14px 15px;display:flex;align-items:center;gap:12px;text-align:left;margin:12px 0;color:#121f18;font-weight:800}
.tgx .tgNoticeIcon{font-size:22px}
.tgx .tgNoticeMeta{flex:1}
.tgx .tgNoticeMeta small{display:block;font-size:11px;color:#708b7e;margin-top:3px;font-weight:500}
.tgx .tgNoticeCount{background:#1b9977;color:#fff;min-width:22px;height:22px;border-radius:12px;display:grid;place-items:center;font-size:11px;padding:0 5px}
.tgx .tgNoticePanel{position:absolute;inset:0;z-index:230;background:#f9fdfb;display:none;flex-direction:column}
.tgx .tgNoticePanel.show{display:flex}
.tgx .tgNoticeHead{padding:max(22px,env(safe-area-inset-top)) 20px 15px;display:flex;align-items:center;gap:12px;border-bottom:1px solid #dfeee7}
.tgx .tgNoticeHead button{border:0;background:#eff8f4;border-radius:12px;padding:11px;color:#121f18;font-weight:800}
.tgx .tgNoticeHead h2{font:800 20px 'Manrope';margin:0;flex:1}
.tgx .tgNoticeList{overflow-y:auto;padding:16px 18px 45px;flex:1}
.tgx .tgNoticeItem{display:block;width:100%;border:1px solid #deede6;border-radius:17px;background:#fff;text-align:left;padding:15px;margin-bottom:11px;color:#121f18}
.tgx .tgNoticeItem.unread{border-color:#2ddac9;background:#f2faf6}
.tgx .tgNoticeItem b{display:block;font-size:13px}
.tgx .tgNoticeItem span{display:block;color:#5f7369;font-size:12px;line-height:1.5;margin-top:6px}
.tgx .tgNoticeItem small{display:block;color:#8aa095;margin-top:7px}
.tgx #bellBtn.tgBellUnread svg{transform-origin:50% 12%;animation:tgBellShake 1.25s ease-in-out infinite}
.tgx #bellBtn .dotBadge{display:none}
.tgx #bellBtn.tgBellUnread .dotBadge{display:block;animation:tgBellDotPulse 1.6s ease-in-out infinite}
@keyframes tgBellShake{0%,44%,100%{transform:rotate(0)}8%,24%{transform:rotate(16deg)}16%,32%{transform:rotate(-16deg)}38%{transform:rotate(7deg)}}
@keyframes tgBellDotPulse{50%{transform:scale(1.25)}}
@media(prefers-reduced-motion:reduce){.tgx #bellBtn.tgBellUnread svg,.tgx #bellBtn.tgBellUnread .dotBadge{animation:none!important}}
.tgx .step2{position:absolute;inset:0;z-index:12;background:linear-gradient(180deg,#f7fcfa 0%,#fcfefd 100%);opacity:0;visibility:hidden;transform:translateX(28px);transition:.52s cubic-bezier(.22,.8,.2,1);overflow:hidden}
.tgx .step2.active{opacity:1;visibility:visible;transform:none}
.tgx.app.step2open>.brand,.tgx.app.step2open>.scene,.tgx.app.step2open>.copy,.tgx.app.step2open>.next{opacity:0;transform:translateX(-30px);transition:.42s cubic-bezier(.4,0,.2,1);pointer-events:none}
.tgx .s2Top{position:absolute;top:max(27px,env(safe-area-inset-top));left:26px;right:26px;display:flex;align-items:center;justify-content:space-between}
.tgx .s2Num{font-family:'Manrope';font-weight:800;font-size:12px;color:#9caaa3;letter-spacing:1.5px}
.tgx .s2Num b{color:var(--orange)}
.tgx .s2Skip{border:0;background:transparent;color:#808d86;font:600 12px 'DM Sans';padding:8px}
.tgx .mealStage{position:absolute;top:12.5%;left:20px;right:20px;height:48%;display:flex;align-items:center;justify-content:center}
.tgx .mealGlow{position:absolute;width:270px;height:270px;border-radius:50%;background:radial-gradient(circle,#e0f2e9 0,#eff8f4 48%,rgba(247,252,250,0) 72%);transform:scale(.65);opacity:0}
.tgx .step2.active .mealGlow{animation:mealGlow .8s .15s forwards}
.tgx .plate{position:absolute;width:220px;height:220px;border-radius:50%;background:#fff;box-shadow:0 24px 50px rgba(29,78,51,.11),inset 0 0 0 13px #f4faf7;transform:scale(.65) rotate(-9deg);opacity:0}
.tgx .step2.active .plate{animation:plateIn .72s .25s cubic-bezier(.18,.9,.25,1.25) forwards}
.tgx .foodCore{position:absolute;width:145px;height:145px;border-radius:50%;overflow:hidden;transform:scale(.7);opacity:0}
.tgx .step2.active .foodCore{animation:foodIn .55s .52s forwards}
.tgx .rice{position:absolute;inset:0;background:radial-gradient(circle at 28% 24%,#24cbba 0 3px,transparent 4px),radial-gradient(circle at 60% 34%,#20b9aa 0 3px,transparent 4px),radial-gradient(circle at 45% 67%,#1da88e 0 4px,transparent 5px),#21b9aa}
.tgx .chicken{position:absolute;width:74px;height:46px;left:36px;top:51px;background:linear-gradient(135deg,#1d6541,#258b6e);border-radius:55% 45% 48% 52%;transform:rotate(-17deg);box-shadow:inset -7px -7px 0 rgba(18,77,45,.12)}
.tgx .plantain{position:absolute;width:34px;height:18px;background:#238f71;border-radius:50%;right:15px;top:32px;transform:rotate(28deg);box-shadow:-9px 25px 0 #237f5f,-23px 45px 0 #229e83}
.tgx .green{position:absolute;width:18px;height:18px;border-radius:50%;background:#73a94c;left:19px;bottom:27px;box-shadow:20px 10px 0 #5f9b43,12px -18px 0 #83b658}
.tgx .chip{position:absolute;z-index:4;display:flex;align-items:center;gap:7px;background:#fff;padding:10px 13px;border-radius:16px;box-shadow:0 10px 30px rgba(30,64,45,.1);font-size:11px;font-weight:700;opacity:0;transform:translateY(18px) scale(.88)}
.tgx .chip i{width:24px;height:24px;border-radius:9px;display:grid;place-items:center;font-style:normal;background:#eff8f4;color:var(--orange)}
.tgx .c1{left:0;top:20%}
.tgx .c2{right:0;top:30%}
.tgx .c3{left:4%;bottom:16%}
.tgx .c4{right:3%;bottom:8%}
.tgx .step2.active .c1{animation:chipIn .48s .78s forwards}
.tgx .step2.active .c2{animation:chipIn .48s .93s forwards}
.tgx .step2.active .c3{animation:chipIn .48s 1.08s forwards}
.tgx .step2.active .c4{animation:chipIn .48s 1.23s forwards}
.tgx .s2Copy{position:absolute;left:28px;right:28px;bottom:max(113px,calc(env(safe-area-inset-bottom) + 91px));text-align:center}
.tgx .s2Copy h2{font:800 clamp(29px,8vw,39px)/1.08 'Manrope';letter-spacing:-1.6px;margin:0 0 11px;opacity:0;transform:translateY(15px)}
.tgx .s2Copy h2 span{color:var(--orange)}
.tgx .s2Copy p{max-width:330px;margin:0 auto;color:var(--muted);font-size:14px;line-height:1.55;opacity:0;transform:translateY(12px)}
.tgx .step2.active .s2Copy h2{animation:up .6s 1.12s forwards}
.tgx .step2.active .s2Copy p{animation:up .6s 1.22s forwards}
.tgx .orderStrip{max-width:320px;margin:17px auto 0;padding:11px 14px;border:1px solid #e3efe9;border-radius:15px;background:#fff;display:flex;justify-content:space-between;align-items:center;box-shadow:0 8px 24px rgba(24,66,43,.05);opacity:0}
.tgx .orderStrip span{font-size:11px;color:#7d8b84;font-weight:600}
.tgx .orderStrip strong{font:800 15px 'Manrope';color:var(--orange)}
.tgx .step2.active .orderStrip{animation:up .55s 1.34s forwards}
.tgx .s2Dots{display:flex;justify-content:center;gap:6px;margin-top:13px}
.tgx .s2Dots i{width:6px;height:5px;border-radius:8px;background:#d6dcd9}
.tgx .s2Dots .on{width:24px;background:var(--orange)}
.tgx .s2Next{position:absolute;left:50%;bottom:max(20px,env(safe-area-inset-bottom));width:68px;height:68px;transform:translateX(-50%);border:0;border-radius:50%;background:var(--orange);color:#fff;display:grid;place-items:center;box-shadow:0 12px 28px rgba(27,153,119,.3);opacity:0}
.tgx .s2Next svg{width:24px}
.tgx .step2.active .s2Next{animation:upBtn .6s 1.42s forwards}
.tgx .s2Next:before{content:"";position:absolute;inset:-7px;border:1px solid rgba(27,153,119,.25);border-radius:50%;animation:pulse 2.2s 2s ease-out infinite}
@keyframes mealGlow{to{opacity:1;transform:scale(1)}}
@keyframes plateIn{to{opacity:1;transform:scale(1) rotate(0)}}
@keyframes foodIn{to{opacity:1;transform:scale(1)}}
@keyframes chipIn{to{opacity:1;transform:none}}
@keyframes upBtn{from{opacity:0;transform:translate(-50%,15px)}to{opacity:1;transform:translate(-50%,0)}}
@media(max-height:690px){.tgx .mealStage{top:10%;height:43%;transform:scale(.86)}
.tgx .s2Copy{bottom:87px}
.tgx .s2Copy h2{font-size:28px}
.tgx .orderStrip{margin-top:10px}
.tgx .s2Dots{margin-top:8px}
.tgx .s2Next{width:59px;height:59px;bottom:12px}}
.tgx .foodCore.realFood{background:#fff}
.tgx .foodCore.realFood img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  border-radius:50%;
}
.tgx .foodCore.realFood{
  width:178px;
  height:178px;
}
.tgx .step3{position:absolute;inset:0;z-index:16;background:linear-gradient(180deg,#f7fcfa 0%,#fcfefd 100%);opacity:0;visibility:hidden;transform:translateX(30px);transition:.52s cubic-bezier(.22,.8,.2,1);overflow:hidden}
.tgx .step3.active{opacity:1;visibility:visible;transform:none}
.tgx .step2.to3{opacity:0;transform:translateX(-30px);pointer-events:none}
.tgx .s3Top{position:absolute;top:max(27px,env(safe-area-inset-top));left:26px;right:26px;display:flex;justify-content:space-between;align-items:center}
.tgx .s3Num{font:800 12px 'Manrope';color:#9caaa3;letter-spacing:1.5px}
.tgx .s3Num b{color:var(--orange)}
.tgx .trackStage{position:absolute;top:12%;left:24px;right:24px;height:45%}
.tgx .mapBlob{position:absolute;inset:5% 1% 0;border-radius:42px;background:#f1f9f5;overflow:hidden;opacity:0;transform:scale(.94)}
.tgx .step3.active .mapBlob{animation:mapIn .65s .15s forwards}
.tgx .street{position:absolute;height:9px;background:#fff;border-radius:20px;opacity:.95}
.tgx .st1{width:125%;left:-14%;top:40%;transform:rotate(-17deg)}
.tgx .st2{width:95%;left:13%;top:65%;transform:rotate(21deg)}
.tgx .st3{width:70%;left:-5%;top:76%;transform:rotate(-42deg)}
.tgx .route{position:absolute;left:18%;top:25%;width:64%;height:48%;border:3px dashed #21bbac;border-left-color:transparent;border-bottom-color:transparent;border-radius:50%;transform:rotate(12deg)}
.tgx .pin{position:absolute;width:42px;height:42px;border-radius:15px;background:#fff;display:grid;place-items:center;box-shadow:0 8px 22px rgba(24,60,40,.1);font-size:20px;opacity:0}
.tgx .kitchenPin{left:11%;bottom:15%}
.tgx .youPin{right:10%;top:15%}
.tgx .step3.active .kitchenPin{animation:pinIn .45s .55s forwards}
.tgx .step3.active .youPin{animation:pinIn .45s .7s forwards}
.tgx .miniRider{position:absolute;z-index:5;left:22%;bottom:27%;width:47px;height:47px;border-radius:50%;background:var(--orange);display:grid;place-items:center;box-shadow:0 9px 20px rgba(27,153,119,.3);opacity:0}
.tgx .miniRider svg{width:26px;height:26px}
.tgx .step3.active .miniRider{animation:riderRoute 2.5s .9s cubic-bezier(.45,.05,.25,1) forwards}
.tgx .statusCard{position:absolute;left:50%;bottom:1%;transform:translateX(-50%) translateY(15px);width:82%;background:#fff;border-radius:18px;padding:13px 14px;box-shadow:0 12px 32px rgba(25,62,41,.09);opacity:0}
.tgx .step3.active .statusCard{animation:statusIn .5s 1.1s forwards}
.tgx .statusHead{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}
.tgx .statusHead b{font:800 12px 'Manrope'}
.tgx .statusHead span{font-size:10px;color:var(--orange);font-weight:700}
.tgx .steps{display:flex;align-items:center}
.tgx .sNode{width:24px;height:24px;border-radius:50%;background:#e7edea;display:grid;place-items:center;font-size:10px;font-weight:800;color:#aaa;transition:.35s}
.tgx .sLine{height:3px;flex:1;background:#e7edea;transition:.35s}
.tgx .step3.active .n1{animation:nodeOn .25s 1.25s forwards}
.tgx .step3.active .l1{animation:lineOn .3s 1.48s forwards}
.tgx .step3.active .n2{animation:nodeOn .25s 1.78s forwards}
.tgx .step3.active .l2{animation:lineOn .3s 2.05s forwards}
.tgx .step3.active .n3{animation:nodeOn .25s 2.34s forwards}
.tgx .step3.active .l3{animation:lineOn .3s 2.65s forwards}
.tgx .step3.active .n4{animation:nodeOn .25s 2.96s forwards}
.tgx .s3Copy{position:absolute;left:28px;right:28px;bottom:max(115px,calc(env(safe-area-inset-bottom) + 92px));text-align:center}
.tgx .s3Copy h2{font:800 clamp(29px,8vw,39px)/1.08 'Manrope';letter-spacing:-1.6px;margin:0 0 11px;opacity:0}
.tgx .s3Copy h2 span{color:var(--orange)}
.tgx .s3Copy p{max-width:330px;margin:0 auto;color:var(--muted);font-size:14px;line-height:1.55;opacity:0}
.tgx .step3.active .s3Copy h2{animation:up .6s 1.05s forwards}
.tgx .step3.active .s3Copy p{animation:up .6s 1.17s forwards}
.tgx .s3Dots{display:flex;justify-content:center;gap:6px;margin-top:17px}
.tgx .s3Dots i{width:6px;height:5px;border-radius:8px;background:#d6dcd9}
.tgx .s3Dots .on{width:24px;background:var(--orange)}
.tgx .getStarted{position:absolute;left:28px;right:28px;bottom:max(20px,env(safe-area-inset-bottom));height:62px;border:0;border-radius:20px;background:var(--orange);color:#fff;font:800 15px 'Manrope';box-shadow:0 12px 28px rgba(27,153,119,.28);opacity:0;transform:translateY(15px)}
.tgx .step3.active .getStarted{animation:up .55s 1.35s forwards}
.tgx .getStarted:active{transform:scale(.98)}
@keyframes mapIn{to{opacity:1;transform:scale(1)}}
@keyframes pinIn{to{opacity:1;transform:translateY(-4px)}}
@keyframes statusIn{to{opacity:1;transform:translateX(-50%) translateY(0)}}
@keyframes riderRoute{0%{opacity:0;left:20%;bottom:25%;transform:rotate(-15deg)}10%{opacity:1}45%{left:45%;bottom:47%;transform:rotate(-32deg)}75%{left:65%;bottom:58%;transform:rotate(-5deg)}100%{opacity:1;left:76%;bottom:66%;transform:rotate(0)}}
@keyframes nodeOn{to{background:var(--orange);color:#fff}}
@keyframes lineOn{to{background:var(--orange)}}
@media(max-height:690px){.tgx .trackStage{top:9%;height:43%;transform:scale(.9)}
.tgx .s3Copy{bottom:92px}
.tgx .s3Copy h2{font-size:28px}
.tgx .s3Dots{margin-top:9px}
.tgx .getStarted{height:56px;bottom:12px}}
.tgx .auth{position:absolute;inset:0;z-index:25;background:linear-gradient(180deg,#f7fcfa 0%,#fff 54%,#f9fdfb 100%);opacity:0;visibility:hidden;transform:translateY(30px) scale(.985);transition:.58s cubic-bezier(.2,.85,.2,1);overflow:hidden}
.tgx .auth.active{opacity:1;visibility:visible;transform:none}
.tgx .step3.authOut{opacity:0;transform:translateY(-22px) scale(.985);transition:.48s cubic-bezier(.4,0,.2,1);pointer-events:none}
.tgx .authGlow{position:absolute;width:320px;height:320px;left:50%;top:-155px;transform:translateX(-50%);border-radius:50%;background:radial-gradient(circle,#d6eee2 0,#ecf7f2 48%,rgba(255,255,255,0) 72%)}
.tgx .authTop{position:absolute;top:max(24px,env(safe-area-inset-top));left:24px;right:24px;display:flex;align-items:center;justify-content:space-between;opacity:0}
.tgx .auth.active .authTop{animation:up .55s .18s forwards}
.tgx .authBrand{display:flex;align-items:center;gap:9px;font:800 18px 'Manrope'}
.tgx .authBrand i{width:35px;height:35px;border-radius:12px;background:var(--orange);display:grid;place-items:center;font-style:normal;color:#fff;font-size:14px}
.tgx .authBrand b{color:var(--orange)}
.tgx .secure{display:flex;align-items:center;gap:5px;font-size:10px;font-weight:700;color:#8c9a93}
.tgx .secure svg{width:13px}
.tgx .authBody{position:absolute;left:26px;right:26px;top:19%;text-align:center}
.tgx .helloIcon{width:76px;height:76px;margin:0 auto 22px;border-radius:25px;background:#eff8f4;display:grid;place-items:center;box-shadow:0 12px 35px rgba(27,153,119,.09);opacity:0;transform:scale(.7) rotate(-7deg)}
.tgx .helloIcon svg{width:37px;height:37px}
.tgx .auth.active .helloIcon{animation:helloPop .65s .3s cubic-bezier(.16,.9,.24,1.3) forwards}
.tgx .authBody h2{font:800 clamp(30px,8.5vw,40px)/1.08 'Manrope';letter-spacing:-1.7px;margin:0 0 11px;opacity:0;transform:translateY(13px)}
.tgx .authBody h2 span{color:var(--orange)}
.tgx .authBody>p{max-width:330px;margin:0 auto;color:var(--muted);font-size:14px;line-height:1.55;opacity:0;transform:translateY(13px)}
.tgx .auth.active .authBody h2{animation:up .55s .48s forwards}
.tgx .auth.active .authBody>p{animation:up .55s .58s forwards}
.tgx .authActions{position:absolute;left:26px;right:26px;bottom:max(40px,calc(env(safe-area-inset-bottom) + 24px));opacity:0;transform:translateY(20px)}
.tgx .auth.active .authActions{animation:up .6s .72s forwards}
.tgx .authBtn{width:100%;height:62px;border-radius:19px;font:800 14px 'Manrope';display:flex;align-items:center;justify-content:center;gap:10px;cursor:pointer}
.tgx .phoneBtn{border:0;background:var(--orange);color:#fff;box-shadow:0 13px 30px rgba(27,153,119,.25)}
.tgx .emailBtn{margin-top:12px;border:1px solid #dfece6;background:#fff;color:#202723}
.tgx .authBtn svg{width:20px;height:20px}
.tgx .googleBtn{margin-top:12px;border:1px solid #dfece6;background:#fff;color:#202723}
.tgx .googleG{font:800 18px Arial;color:#4285f4}
.tgx .passwordWrap{margin-top:10px}
.tgx .passwordWrap.hide{display:none}
.tgx .authError{min-height:18px;margin-top:9px;color:#217553;font-size:11px;font-weight:700;text-align:center}
.tgx .or{display:flex;align-items:center;gap:12px;margin:17px 0;color:#9daaa3;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:1px}
.tgx .or:before,.tgx .or:after{content:"";height:1px;flex:1;background:#e4ede9}
.tgx .terms{margin-top:18px;text-align:center;font-size:10px;line-height:1.5;color:#9caaa3}
.tgx .terms b{color:#63706a}
.tgx .sheetShade{position:absolute;inset:0;z-index:40;background:rgba(15,27,20,.25);backdrop-filter:blur(3px);opacity:0;visibility:hidden;transition:.3s}
.tgx .sheetShade.show{opacity:1;visibility:visible}
.tgx .entrySheet{position:absolute;z-index:41;left:12px;right:12px;bottom:-100%;background:#fff;border-radius:28px 28px 18px 18px;padding:12px 18px max(22px,calc(env(safe-area-inset-bottom) + 14px));box-shadow:0 -15px 50px rgba(21,41,30,.14);transition:.5s cubic-bezier(.16,.84,.24,1)}
.tgx .entrySheet.show{bottom:12px}
.tgx .handle{width:38px;height:4px;background:#dde3e0;border-radius:5px;margin:0 auto 21px}
.tgx .sheetIcon{width:48px;height:48px;border-radius:16px;background:#eff8f4;display:grid;place-items:center;color:var(--orange);margin-bottom:14px}
.tgx .sheetIcon svg{width:23px}
.tgx .entrySheet h3{font:800 22px 'Manrope';letter-spacing:-.8px;margin:0 0 6px}
.tgx .entrySheet p{font-size:12px;line-height:1.5;color:var(--muted);margin:0 0 18px}
.tgx .inputWrap{height:59px;border:1.5px solid #e0e9e5;border-radius:17px;display:flex;align-items:center;padding:0 15px;background:#fff;transition:.25s}
.tgx .inputWrap:focus-within{border-color:var(--orange);box-shadow:0 0 0 4px rgba(27,153,119,.08)}
.tgx .prefix{padding-right:11px;margin-right:11px;border-right:1px solid #e3ece8;font:700 13px 'Manrope';white-space:nowrap}
.tgx .inputWrap input{border:0;outline:0;width:100%;font:600 15px 'DM Sans';color:#1e2421;background:transparent}
.tgx .inputWrap input::placeholder{color:#acb8b2}
.tgx .sheetContinue{width:100%;height:58px;border:0;border-radius:17px;margin-top:13px;background:var(--orange);color:#fff;font:800 14px 'Manrope';box-shadow:0 10px 24px rgba(27,153,119,.22)}
.tgx .sheetContinue:active,.tgx .authBtn:active{transform:scale(.985)}
.tgx .gxInfoNote{display:flex;align-items:center;gap:7px;margin-top:12px;color:#96a49d;font-size:10px}
.tgx .gxInfoNote i{width:17px;height:17px;border-radius:50%;background:#edf3f0;display:grid;place-items:center;font-style:normal;font-weight:800}
.tgx .verifyToast{position:absolute;z-index:60;top:max(28px,env(safe-area-inset-top));left:50%;transform:translate(-50%,-18px);width:max-content;max-width:88%;background:#191d1b;color:#fff;border-radius:16px;padding:11px 14px;display:flex;align-items:center;gap:9px;font-size:11px;font-weight:700;opacity:0;pointer-events:none}
.tgx .verifyToast i{width:22px;height:22px;border-radius:50%;background:#37a968;display:grid;place-items:center;font-style:normal}
.tgx .verifyToast.show{animation:topToast 2s ease}
@keyframes helloPop{to{opacity:1;transform:scale(1) rotate(0)}}
@keyframes topToast{0%{opacity:0;transform:translate(-50%,-18px)}15%,80%{opacity:1;transform:translate(-50%,0)}100%{opacity:0}}
@media(max-height:690px){.tgx .authBody{top:15%}
.tgx .helloIcon{width:62px;height:62px;margin-bottom:15px}
.tgx .authBody h2{font-size:29px}
.tgx .authActions{bottom:18px}
.tgx .authBtn{height:54px}
.tgx .or{margin:11px 0}
.tgx .terms{margin-top:10px}}
.tgx .loginScreen.active{overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
.tgx .loginScreen .loginCard{padding-bottom:42px}
@media (max-height:820px){.tgx .loginScreen .loginCard{top:90px}}
@media (max-height:650px){.tgx .loginScreen .loginCard{top:75px}
.tgx .loginScreen .loginMark{width:52px;height:52px;margin-bottom:12px}
.tgx .loginScreen .loginCard h2{font-size:29px}
.tgx .loginScreen .loginCard>p{margin-bottom:14px}}
.tgx .verifyScreen{position:absolute;inset:0;z-index:70;background:linear-gradient(180deg,#f7fcfa 0%,#fff 48%,#f9fdfb 100%);opacity:0;visibility:hidden;transform:translateX(32px);transition:.52s cubic-bezier(.2,.85,.2,1);overflow:hidden}
.tgx .verifyScreen.active{opacity:1;visibility:visible;transform:none}
.tgx .auth.verifyOut{opacity:0;transform:translateX(-28px);pointer-events:none}
.tgx .vTop{position:absolute;top:max(24px,env(safe-area-inset-top));left:23px;right:23px;display:flex;align-items:center;justify-content:space-between;opacity:0}
.tgx .verifyScreen.active .vTop{animation:up .5s .15s forwards}
.tgx .backBtn{width:42px;height:42px;border:1px solid #e1ece7;background:#fff;border-radius:14px;display:grid;place-items:center;color:#202723}
.tgx .backBtn svg{width:19px}
.tgx .vStep{font:800 11px 'Manrope';color:#9caaa3;letter-spacing:1.2px}
.tgx .vBody{position:absolute;top:19%;left:24px;right:24px;text-align:center}
.tgx .vIcon{width:76px;height:76px;border-radius:25px;background:#eff8f4;margin:0 auto 22px;display:grid;place-items:center;color:var(--orange);opacity:0;transform:scale(.65)}
.tgx .vIcon svg{width:35px}
.tgx .verifyScreen.active .vIcon{animation:helloPop .6s .25s cubic-bezier(.16,.9,.24,1.3) forwards}
.tgx .vBody h2{font:800 clamp(30px,8.5vw,40px)/1.08 'Manrope';letter-spacing:-1.6px;margin:0 0 10px;opacity:0}
.tgx .vBody>p{margin:0 auto;max-width:330px;color:var(--muted);font-size:13px;line-height:1.55;opacity:0}
.tgx .vBody>p b{color:#29302c}
.tgx .verifyScreen.active .vBody h2{animation:up .55s .4s forwards}
.tgx .verifyScreen.active .vBody>p{animation:up .55s .5s forwards}
.tgx .otpRow{display:flex;justify-content:center;gap:7px;margin:28px auto 0;opacity:0;transform:translateY(14px)}
.tgx .verifyScreen.active .otpRow{animation:up .55s .62s forwards}
.tgx .otp{width:46px;height:57px;border:1.5px solid #dce6e1;border-radius:15px;background:#fff;text-align:center;outline:0;font:800 21px 'Manrope';color:#1d2320;caret-color:var(--orange);transition:.2s;box-shadow:0 5px 16px rgba(27,59,41,.025)}
.tgx .otp:focus{border-color:var(--orange);box-shadow:0 0 0 4px rgba(27,153,119,.08);transform:translateY(-2px)}
.tgx .resend{margin-top:22px;font-size:12px;color:#828f88;opacity:0}
.tgx .verifyScreen.active .resend{animation:up .5s .76s forwards}
.tgx .resend button{border:0;background:transparent;padding:4px;color:var(--orange);font:800 12px 'DM Sans'}
.tgx .resend button:disabled{color:#9daaa3}
.tgx .vHint{margin-top:13px;font-size:10px;color:#a4b1ab;opacity:0}
.tgx .verifyScreen.active .vHint{animation:up .5s .84s forwards}
.tgx .verifyBtn{position:absolute;left:26px;right:26px;bottom:max(25px,calc(env(safe-area-inset-bottom) + 14px));height:61px;border:0;border-radius:19px;background:var(--orange);color:#fff;font:800 14px 'Manrope';box-shadow:0 12px 28px rgba(27,153,119,.25);opacity:0;transform:translateY(15px);transition:.2s}
.tgx .verifyScreen.active .verifyBtn{animation:up .55s .88s forwards}
.tgx .verifyBtn:disabled{background:#32dbca;box-shadow:none}
.tgx .verifyBtn:not(:disabled):active{scale:.985}
.tgx .successLayer{position:absolute;inset:0;z-index:90;background:rgba(255,255,255,.97);display:grid;place-items:center;opacity:0;visibility:hidden;transition:.3s}
.tgx .successLayer.show{opacity:1;visibility:visible}
.tgx .successInner{text-align:center;transform:scale(.7);opacity:0}
.tgx .successLayer.show .successInner{animation:successPop .55s .1s cubic-bezier(.17,.9,.25,1.3) forwards}
.tgx .checkRing{width:92px;height:92px;border-radius:50%;background:#eaf8ef;margin:0 auto 20px;display:grid;place-items:center}
.tgx .checkRing i{width:58px;height:58px;border-radius:50%;background:#35aa68;color:#fff;display:grid;place-items:center;font:800 28px 'Manrope';font-style:normal;box-shadow:0 9px 22px rgba(53,170,104,.22)}
.tgx .successInner h3{font:800 26px 'Manrope';letter-spacing:-1px;margin:0 0 6px}
.tgx .successInner p{margin:0;color:var(--muted);font-size:12px}
@keyframes successPop{to{opacity:1;transform:scale(1)}}
@keyframes shakeOtp{0%,100%{transform:translateX(0)}25%{transform:translateX(-5px)}75%{transform:translateX(5px)}}
@media(max-width:365px){.tgx .otpRow{gap:5px}
.tgx .otp{width:42px;height:54px}}
@media(max-height:690px){.tgx .vBody{top:15%}
.tgx .vIcon{width:62px;height:62px;margin-bottom:15px}
.tgx .vBody h2{font-size:29px}
.tgx .otpRow{margin-top:19px}
.tgx .resend{margin-top:15px}
.tgx .verifyBtn{height:55px;bottom:13px}}
.tgx .flowScreen{position:absolute;inset:0;z-index:100;background:#fff;opacity:0;visibility:hidden;transform:translateX(28px);transition:.5s cubic-bezier(.2,.85,.2,1);overflow:hidden}
.tgx .flowScreen.active{opacity:1;visibility:visible;transform:none}
.tgx .flowTop{position:absolute;top:max(23px,env(safe-area-inset-top));left:22px;right:22px;display:flex;justify-content:space-between;align-items:center}
.tgx .flowBack{width:42px;height:42px;border:1px solid #e3ece8;background:#fff;border-radius:14px;display:grid;place-items:center;font-size:20px}
.tgx .flowStep{font:800 11px 'Manrope';letter-spacing:1.2px;color:#9caaa3}
.tgx .flowBody{position:absolute;left:26px;right:26px;top:18%}
.tgx .flowBody h2{font:800 clamp(30px,8.5vw,40px)/1.08 'Manrope';letter-spacing:-1.6px;margin:0 0 10px}
.tgx .flowBody h2 span{color:var(--orange)}
.tgx .flowBody>p{color:var(--muted);font-size:14px;line-height:1.55;margin:0 0 27px}
.tgx .fieldLabel{display:block;font:700 11px 'DM Sans';color:#66716c;margin:0 0 8px}
.tgx .bigInput{width:100%;height:62px;border:1.5px solid #dee8e3;border-radius:18px;padding:0 17px;outline:0;font:600 15px 'DM Sans';background:#fff;transition:.2s}
.tgx .bigInput:focus{border-color:var(--orange);box-shadow:0 0 0 4px rgba(27,153,119,.08)}
.tgx .flowNext{position:absolute;left:26px;right:26px;bottom:max(24px,calc(env(safe-area-inset-bottom) + 14px));height:61px;border:0;border-radius:19px;background:var(--orange);color:#fff;font:800 14px 'Manrope';box-shadow:0 12px 28px rgba(27,153,119,.24)}
.tgx .flowNext:active{scale:.985}
.tgx .avatarHello{width:70px;height:70px;border-radius:24px;background:#eff8f4;display:grid;place-items:center;font-size:29px;margin-bottom:22px}
.tgx .addressSearch{position:relative}
.tgx .addressSearch svg{position:absolute;left:16px;top:21px;width:19px;color:#909e97}
.tgx .addressSearch .bigInput{padding-left:46px}
.tgx .currentLoc{width:100%;margin-top:12px;border:0;background:#f4faf7;border-radius:17px;padding:15px;display:flex;align-items:center;gap:11px;text-align:left;color:#29302c}
.tgx .currentLoc i{width:36px;height:36px;border-radius:12px;background:var(--orange);display:grid;place-items:center;color:#fff;font-style:normal}
.tgx .currentLoc b{display:block;font:800 12px 'Manrope'}
.tgx .currentLoc small{display:block;color:#828f88;margin-top:2px}
.tgx .labels{display:flex;gap:9px;margin-top:20px}
.tgx .labelChip{flex:1;height:47px;border:1px solid #e0eae5;border-radius:15px;background:#fff;font:700 12px 'DM Sans'}
.tgx .labelChip.on{background:#eff8f4;border-color:#28d9c8;color:var(--orange)}
.tgx .loginTop{border:0;background:transparent;color:var(--orange);font:800 12px 'Manrope';padding:10px 3px}
.tgx .loginScreen{position:absolute;inset:0;z-index:95;background:linear-gradient(180deg,#f7fcfa,#fff 48%);opacity:0;visibility:hidden;transform:translateX(28px);transition:.5s cubic-bezier(.2,.85,.2,1)}
.tgx .loginScreen.active{opacity:1;visibility:visible;transform:none}
.tgx .loginCard{position:absolute;left:25px;right:25px;top:18%}
.tgx .loginMark{width:67px;height:67px;border-radius:22px;background:#eff8f4;color:var(--orange);display:grid;place-items:center;margin-bottom:22px}
.tgx .loginMark svg{width:31px}
.tgx .loginCard h2{font:800 34px/1.08 'Manrope';letter-spacing:-1.5px;margin:0 0 9px}
.tgx .loginCard h2 span{color:var(--orange)}
.tgx .loginCard>p{font-size:13px;color:var(--muted);line-height:1.55;margin:0 0 24px}
.tgx .loginTabs{height:45px;background:#f2f6f4;border-radius:14px;padding:4px;display:flex;margin-bottom:14px}
.tgx .loginTabs button{flex:1;border:0;border-radius:11px;background:transparent;font:700 11px 'DM Sans';color:#808e87}
.tgx .loginTabs button.on{background:#fff;color:#202723;box-shadow:0 3px 10px rgba(22,47,33,.06)}
.tgx .loginField{height:59px;border:1.5px solid #dee8e3;border-radius:17px;display:flex;align-items:center;padding:0 15px;margin-bottom:11px}
.tgx .loginField:focus-within{border-color:var(--orange);box-shadow:0 0 0 4px rgba(27,153,119,.07)}
.tgx .loginField span{font:700 12px 'DM Sans';padding-right:10px;margin-right:10px;border-right:1px solid #e3ece8}
.tgx .loginField input{width:100%;border:0;outline:0;font:600 14px 'DM Sans';background:transparent}
.tgx .loginSubmit{width:100%;height:58px;border:0;border-radius:17px;background:var(--orange);color:#fff;font:800 13px 'Manrope';box-shadow:0 10px 24px rgba(27,153,119,.22)}
.tgx .loginFine{text-align:center;color:#9caaa3;font-size:9px;margin-top:12px}
.tgx{--deep:#0b1c13;--ember:#1da58a;--gold:#1da78d;--leaf:#1c8a55;--line:#e0efe8;--soft:#f2f9f6;--sh:0 18px 38px -12px rgba(24,103,60,.26)}
@media(min-width:561px){html,body{background:#06110b}
.tgx.app{left:50%;right:auto;width:430px;transform:translateX(-50%);box-shadow:0 0 90px rgba(0,0,0,.6)}}
.tgx button{font-family:inherit;cursor:pointer;color:inherit}
.tgx input,.tgx textarea{font-family:inherit}
.tgx .ic{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none;display:block}
.tgx .d{fill:currentColor;fill-opacity:.17;stroke:none}
.tgx .f{fill:currentColor;stroke:none}
.tgx .noScroll{scrollbar-width:none}
.tgx .noScroll::-webkit-scrollbar{display:none}
.tgx .b3d{border:0;color:#fff;font:800 15px 'Manrope',sans-serif;letter-spacing:-.2px;height:58px;border-radius:19px;display:flex;align-items:center;justify-content:center;gap:10px;background:linear-gradient(180deg,#1fb09c 0,#1b9977 55%,#188961 100%);box-shadow:inset 0 2px 0 rgba(255,255,255,.38),inset 0 -2px 0 rgba(0,0,0,.08),0 6px 0 #136d40,0 16px 26px -4px rgba(27,153,119,.45);transition:transform .12s ease,box-shadow .12s ease;position:relative;overflow:hidden}
.tgx .b3d:after{content:"";position:absolute;top:0;bottom:0;left:-60%;width:40%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.35),transparent);transform:skewX(-20deg);animation:shine 3.6s 1.2s infinite}
.tgx .b3d:active{transform:translateY(5px);box-shadow:inset 0 2px 0 rgba(255,255,255,.3),0 1px 0 #136d40,0 6px 12px -2px rgba(27,153,119,.4)}
.tgx .b3d:disabled{filter:grayscale(.5) brightness(1.1);opacity:.6}
.tgx .b3d .ic{width:20px;height:20px;stroke-width:2.2}
.tgx .b3dGhost{border:1.5px solid #d5e7de;background:#fff;color:var(--ink);font:800 14px 'Manrope';height:54px;border-radius:18px;display:flex;align-items:center;justify-content:center;gap:9px;box-shadow:0 4px 0 #d5e7de;transition:transform .12s,box-shadow .12s}
.tgx .b3dGhost:active{transform:translateY(3px);box-shadow:0 1px 0 #d5e7de}
@keyframes shine{0%,60%{left:-60%}100%{left:140%}}
.tgx .roundBtn{width:46px;height:46px;border-radius:16px;border:0;background:linear-gradient(180deg,#fff,#edf8f3);color:var(--ink);display:grid;place-items:center;position:relative;box-shadow:inset 0 1px 0 #fff,0 4px 0 #d7ece2,0 12px 20px -6px rgba(24,103,60,.25);transition:transform .12s,box-shadow .12s}
.tgx .roundBtn:active{transform:translateY(3px);box-shadow:0 1px 0 #d7ece2,0 4px 8px -4px rgba(24,103,60,.2)}
.tgx .dotBadge{position:absolute;right:11px;top:11px;width:8px;height:8px;border-radius:50%;background:var(--orange);border:2px solid #fff}
.tgx .home{position:absolute;inset:0;z-index:130;background:#f7fcfa;opacity:0;visibility:hidden;transform:translateY(24px) scale(.99);transition:opacity .45s ease,transform .6s cubic-bezier(.2,.9,.25,1),visibility 0s .6s;overflow:hidden}
.tgx .home.active{opacity:1;visibility:visible;transform:none;transition-delay:0s}
.tgx .home:before{content:"";position:absolute;right:-90px;top:-110px;width:330px;height:330px;border-radius:50%;background:radial-gradient(circle,rgba(29,165,138,.22),rgba(29,165,138,0) 68%);pointer-events:none}
.tgx .tab{position:absolute;inset:0;overflow-y:auto;padding-bottom:128px;opacity:0;visibility:hidden;transform:translateX(22px);transition:opacity .32s ease,transform .42s cubic-bezier(.2,.9,.25,1),visibility 0s .42s;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.tgx .tab::-webkit-scrollbar{display:none}
.tgx .tab.on{opacity:1;visibility:visible;transform:none;transition-delay:0s}
.tgx .home:not(.active){pointer-events:none}
.tgx .home:not(.active) .tab{visibility:hidden!important}
.tgx .hHead{display:flex;align-items:center;gap:12px;padding:max(22px,env(safe-area-inset-top)) 20px 0;position:relative}
.tgx .avatar3d{width:48px;height:48px;border-radius:17px;border:0;background:linear-gradient(145deg,#21bcad,#1da387);color:#fff;font:800 19px 'Manrope';display:grid;place-items:center;box-shadow:inset 0 2px 0 rgba(255,255,255,.5),0 5px 0 #197a53,0 14px 20px -6px rgba(29,163,135,.55);transition:transform .12s}
.tgx .avatar3d:active{transform:scale(.97)}
.tgx .avatar3d,.tgx .pCard .avatar3d{background:#eef8f3!important;color:#1f8d6c!important;border:1px solid #d8efe4!important;box-shadow:none!important;border-radius:50%!important;transform:none!important}
.tgx .deliver{flex:1;min-width:0;text-align:left;border:0;background:none;padding:0}
.tgx .deliver small{display:block;font-size:11px;font-weight:600;color:var(--muted)}
.tgx .deliver b{display:flex;align-items:center;gap:6px;font:800 14px 'Manrope';letter-spacing:-.3px;color:var(--ink);margin-top:2px}
.tgx .deliver b .ic{width:16px;height:16px;color:var(--orange)}
.tgx .deliver b .chev{width:14px;height:14px;color:#95a59d;margin-left:-1px}
.tgx .deliver b span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:180px}
.tgx .hello{padding:20px 20px 0}
.tgx .hello p{margin:0 0 4px;font-size:13px;color:var(--muted);font-weight:500}
.tgx .hello h2{margin:0;font:800 29px/1.12 'Manrope';letter-spacing:-1.3px;color:var(--ink)}
.tgx .hello h2 em{font-style:normal;background:linear-gradient(90deg,#1b9977,#1ead96);-webkit-background-clip:text;background-clip:text;color:transparent}
.tgx .srchBar{margin:18px 20px 0;height:58px;border-radius:20px;border:0;width:calc(100% - 40px);display:flex;align-items:center;gap:12px;padding:0 9px 0 17px;text-align:left;background:linear-gradient(180deg,#fff,#f9fcfb);color:#8fa298;font:600 14px 'DM Sans';box-shadow:inset 0 1px 0 #fff,0 0 0 1.5px #dff1e8,0 14px 28px -12px rgba(24,103,60,.3);position:relative}
.tgx .srchBar>.ic{color:var(--orange);width:21px;height:21px}
.tgx .srchBar span{flex:1}
.tgx .srchBar i{width:42px;height:42px;border-radius:14px;background:var(--deep);color:#fff;display:grid;place-items:center;box-shadow:0 3px 0 #000}
.tgx .srchBar i .ic{width:18px;height:18px}
.tgx .srchBar:active{transform:scale(.99)}
.tgx .promoWrap{padding:20px 20px 0;overflow:hidden}
.tgx .promoTrack{display:flex;gap:11px;transition:transform .6s cubic-bezier(.2,.8,.2,1)}
.tgx .promoSlide{flex:0 0 100%;height:158px;border-radius:28px;position:relative;overflow:visible;padding:20px 0 0 20px;color:#fff;background:radial-gradient(circle at 85% 20%,#1da58a 0,rgba(29,165,138,0) 45%),linear-gradient(135deg,#0c2819,#104528 70%,#165d36);box-shadow:inset 0 1px 0 rgba(255,255,255,.18),0 18px 30px -12px rgba(16,69,40,.6)}
.tgx .promoSlide:nth-child(2){background:radial-gradient(circle at 85% 20%,#1da78d 0,rgba(29,167,141,0) 45%),linear-gradient(135deg,#0f2a1d,#134a30 75%,#1c6a45)}
.tgx .promoSlide:nth-child(3){background:radial-gradient(circle at 85% 20%,#ff5b8a 0,rgba(255,91,138,0) 45%),linear-gradient(135deg,#2a0f1b,#4a1830 75%,#6a2243)}
.tgx .promoText{width:56%;position:relative;z-index:2}
.tgx .promoText small{display:inline-block;padding:5px 10px;border-radius:30px;background:rgba(255,255,255,.16);font:800 10px 'Manrope';letter-spacing:.3px}
.tgx .promoText h3{margin:10px 0 5px;font:800 19px/1.14 'Manrope';letter-spacing:-.7px}
.tgx .promoText p{margin:0;font-size:12px;opacity:.78;line-height:1.4}
.tgx .promoSlide img{position:absolute;right:-12px;top:-16px;width:158px;height:158px;object-fit:contain;filter:drop-shadow(0 18px 14px rgba(0,0,0,.45));animation:floaty 4.5s ease-in-out infinite}
@keyframes floaty{50%{transform:translateY(-8px) rotate(3deg)}}
.tgx .promoDots{display:flex;justify-content:center;gap:6px;padding-top:13px}
.tgx .promoDots button{width:6px;height:6px;border:0;border-radius:6px;background:#d3e2db;padding:0;transition:.3s}
.tgx .promoDots button.on{width:24px;background:var(--orange)}
.tgx .catRow{display:flex;gap:12px;overflow-x:auto;padding:22px 20px 8px;scrollbar-width:none}
.tgx .catRow::-webkit-scrollbar{display:none}
.tgx .ctile{flex:none;width:68px;border:0;background:none;padding:0;text-align:center;font:700 12px 'Manrope';color:#677a70}
.tgx .ctile u{display:grid;place-items:center;width:68px;height:68px;border-radius:24px;background:linear-gradient(160deg,#fff,#edf8f3);color:var(--orange);margin-bottom:8px;text-decoration:none;box-shadow:inset 0 2px 0 #fff,0 5px 0 #d4ede1,0 14px 20px -8px rgba(24,103,60,.3);transition:transform .15s,box-shadow .15s}
.tgx .ctile u .ic{width:30px;height:30px;stroke-width:1.6}
.tgx .ctile:active u{transform:translateY(4px);box-shadow:0 1px 0 #d4ede1}
.tgx .ctile.on{color:var(--ink)}
.tgx .ctile.on u{background:linear-gradient(160deg,#1fb09c,#188961);color:#fff;box-shadow:inset 0 2px 0 rgba(255,255,255,.4),0 5px 0 #136d40,0 14px 22px -8px rgba(27,153,119,.6)}
.tgx .secT{display:flex;justify-content:space-between;align-items:center;padding:20px 20px 8px}
.tgx .secT h3{margin:0;font:800 19px 'Manrope';letter-spacing:-.7px}
.tgx .secT button{border:0;background:none;color:var(--orange);font:800 12px 'Manrope';padding:6px 0}
.tgx .fgrid{display:grid;grid-template-columns:1fr 1fr;gap:56px 13px;padding:54px 20px 6px}
.tgx .fcard{position:relative;border-radius:28px;padding:86px 14px 14px;background:linear-gradient(165deg,#fff 0,#f0f9f5 100%);box-shadow:inset 0 2px 0 #fff,0 4px 0 #d4ede1,0 22px 30px -14px rgba(24,103,60,.34);transform:perspective(800px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transition:transform .28s cubic-bezier(.2,.8,.2,1);transform-style:preserve-3d;cursor:pointer}
.tgx .fcard .pop{position:absolute;left:50%;top:-42px;width:132px;height:132px;transform:translateX(-50%) translateZ(50px);pointer-events:none}
.tgx .fcard .pop:before{content:"";position:absolute;left:14%;right:14%;bottom:6px;height:16px;border-radius:50%;background:rgba(16,69,40,.22);filter:blur(7px)}
.tgx .fcard .pop img,.tgx .row .rimg img,.tgx .dImg img{filter:drop-shadow(0 12px 10px rgba(16,69,40,.28))}
.tgx .fcard .pop img{position:relative;width:100%;height:100%;object-fit:contain;animation:popFood .7s cubic-bezier(.2,1.4,.3,1) both}
@keyframes popFood{0%{transform:scale(.4) translateY(30px) rotate(-18deg);opacity:0}100%{transform:none;opacity:1}}
.tgx .fcard h4{margin:0;font:800 14.5px/1.2 'Manrope';letter-spacing:-.4px;min-height:34px;color:var(--ink)}
.tgx .fmeta{display:flex;align-items:center;gap:10px;margin:7px 0 11px;font-size:11.5px;color:var(--muted);font-weight:600}
.tgx .fmeta span{display:flex;align-items:center;gap:4px}
.tgx .fmeta .ic{width:13px;height:13px}
.tgx .fmeta .st{color:var(--gold)}
.tgx .fmeta .st .ic{stroke:none;fill:currentColor}
.tgx .fbot{display:flex;align-items:center;justify-content:space-between}
.tgx .fprice{font:800 16px 'Manrope';letter-spacing:-.5px;color:var(--ink)}
.tgx .fprice small{color:var(--orange);font-size:13px;margin-right:1px}
.tgx .add3d{width:40px;height:40px;border:0;border-radius:14px;color:#fff;display:grid;place-items:center;background:linear-gradient(180deg,#1fb09c,#188961);box-shadow:inset 0 2px 0 rgba(255,255,255,.4),0 4px 0 #136d40,0 10px 16px -4px rgba(27,153,119,.5);transition:transform .12s,box-shadow .12s;transform:translateZ(30px)}
.tgx .add3d:active{transform:translateY(3px) translateZ(30px);box-shadow:0 1px 0 #136d40}
.tgx .add3d .ic{width:19px;height:19px;stroke-width:2.4}
.tgx .heartMini{position:absolute;right:12px;top:12px;width:34px;height:34px;border-radius:12px;border:0;background:rgba(255,255,255,.9);color:#b0c5bb;display:grid;place-items:center;box-shadow:0 5px 12px -4px rgba(24,103,60,.3);z-index:3;transform:translateZ(70px);transition:transform .2s}
.tgx .heartMini .ic{width:17px;height:17px}
.tgx .heartMini.on{color:#ff3d57}
.tgx .heartMini.on .ic{fill:#ff3d57}
.tgx .heartMini:active{transform:translateZ(70px) scale(.85)}
.tgx .heartMini.pulse{animation:heartPop .45s}
@keyframes heartPop{40%{transform:translateZ(70px) scale(1.4)}}
.tgx .rows{padding:2px 20px 0;display:grid;gap:12px}
.tgx .row{display:flex;align-items:center;gap:14px;padding:12px 14px 12px 12px;border-radius:26px;background:#fff;box-shadow:inset 0 2px 0 #fff,0 3px 0 #dcf1e7,0 16px 26px -14px rgba(24,103,60,.3);cursor:pointer;position:relative;transition:transform .2s}
.tgx .row:active{transform:scale(.985)}
.tgx .row .rimg{width:92px;height:92px;flex:none;border-radius:24px;background:radial-gradient(circle at 50% 35%,#ecf7f2,#d2ecdf);display:grid;place-items:center;position:relative}
.tgx .row .rimg img{width:104px;height:104px;object-fit:contain;margin:-14px;position:relative}
.tgx .row .rinfo{flex:1;min-width:0}
.tgx .row h4{margin:0;font:800 15px/1.2 'Manrope';letter-spacing:-.4px}
.tgx .row p{margin:4px 0 8px;font-size:11.5px;color:var(--muted);font-weight:600;display:flex;gap:9px;align-items:center}
.tgx .row p .ic{width:13px;height:13px;vertical-align:-2px}
.tgx .row p .st{color:var(--gold);display:flex;align-items:center;gap:3px}
.tgx .row p .st .ic{stroke:none;fill:currentColor}
.tgx .row .fbot{gap:8px}
.tgx .tagHot{display:inline-flex;align-items:center;gap:3px;color:#17845b;font-weight:800}
.tgx .tagHot .ic{width:12px;height:12px;stroke:none;fill:currentColor}
.tgx .pageT{padding:max(24px,env(safe-area-inset-top)) 20px 0}
.tgx .pageT h2{margin:0;font:800 29px 'Manrope';letter-spacing:-1.3px}
.tgx .pageT p{margin:5px 0 0;font-size:13px;color:var(--muted)}
.tgx .fieldS{margin:16px 20px 0;height:52px;border-radius:18px;background:#fff;display:flex;align-items:center;gap:10px;padding:0 15px;box-shadow:0 0 0 1.5px #dcf0e6,0 10px 20px -12px rgba(24,103,60,.3)}
.tgx .fieldS .ic{color:var(--orange)}
.tgx .fieldS input{flex:1;border:0;outline:0;background:none;font:600 14px 'DM Sans';color:var(--ink);min-width:0}
.tgx .chipRow{display:flex;gap:9px;overflow-x:auto;padding:16px 20px 12px;position:sticky;top:0;z-index:5;background:linear-gradient(180deg,#f7fcfa 80%,rgba(247,252,250,0))}
.tgx .chipRow::-webkit-scrollbar{display:none}
.tgx .fchip{flex:none;height:40px;padding:0 16px;border:0;border-radius:15px;background:#fff;color:#5c6f66;font:800 13px 'Manrope';display:flex;align-items:center;gap:7px;box-shadow:0 0 0 1.5px #dcf0e6,0 3px 0 #dcf0e6;transition:.15s}
.tgx .fchip .ic{width:17px;height:17px}
.tgx .fchip.on{background:var(--deep);color:#fff;box-shadow:0 3px 0 #000}
.tgx .fchip:active{transform:translateY(2px)}
.tgx .empty{text-align:center;padding:50px 34px;color:var(--muted);font-size:13.5px;line-height:1.55}
.tgx .empty u{display:grid;place-items:center;width:84px;height:84px;margin:0 auto 18px;border-radius:30px;background:linear-gradient(160deg,#fff,#e7f5ee);color:var(--orange);text-decoration:none;box-shadow:0 5px 0 #d4ede1,0 18px 26px -10px rgba(24,103,60,.3);animation:floaty 4s ease-in-out infinite}
.tgx .empty u .ic{width:38px;height:38px;stroke-width:1.5}
.tgx .empty h3{margin:0 0 6px;color:var(--ink);font:800 19px 'Manrope';letter-spacing:-.6px}
.tgx .pCard{margin:20px;padding:22px;border-radius:30px;color:#fff;background:radial-gradient(circle at 90% 0,rgba(29,165,138,.6),rgba(29,165,138,0) 55%),linear-gradient(145deg,#0c2819,#104528);box-shadow:0 22px 34px -14px rgba(16,69,40,.7);display:flex;align-items:center;gap:15px}
.tgx .pCard .avatar3d{width:62px;height:62px;border-radius:22px;font-size:25px}
.tgx .pCard b{display:block;font:800 21px 'Manrope';letter-spacing:-.7px}
.tgx .pCard span{font-size:12.5px;opacity:.7}
.tgx .pItem{margin:0 20px 12px;padding:15px;border-radius:22px;background:#fff;display:flex;align-items:center;gap:14px;box-shadow:0 3px 0 #dcf1e7,0 14px 22px -14px rgba(24,103,60,.3);width:calc(100% - 40px);border:0;text-align:left}
.tgx .pItem u{width:46px;height:46px;border-radius:16px;background:var(--soft);color:var(--orange);display:grid;place-items:center;text-decoration:none;flex:none}
.tgx .pItem div{flex:1;min-width:0}
.tgx .pItem b{display:block;font:800 14px 'Manrope';letter-spacing:-.3px}
.tgx .pItem small{display:block;color:var(--muted);font-size:12px;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tgx .pItem>.ic{color:#b0c6bb;width:18px;height:18px}
.tgx .oRow{display:flex;justify-content:space-between;align-items:center;margin:0 20px 10px;padding:14px 16px;border-radius:20px;background:#fff;box-shadow:0 0 0 1.5px #e2f3eb}
.tgx .oRow b{font:800 13.5px 'Manrope'}
.tgx .oRow small{display:block;color:var(--muted);font-size:11.5px;margin-top:2px}
.tgx .oRow strong{font:800 14px 'Manrope';color:var(--orange)}
.tgx .subH{margin:24px 20px 12px;font:800 16px 'Manrope';letter-spacing:-.4px}
.tgx .bottomNav{position:absolute;z-index:150;left:14px;right:14px;bottom:0;height:68px;border-radius:26px;background:rgba(11,28,19,.94);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);display:flex;align-items:center;justify-content:space-around;padding:0 8px;box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 22px 36px -10px rgba(11,28,19,.6);transition:transform .5s cubic-bezier(.2,.9,.25,1)}
.tgx .bottomNav.hide{transform:translateY(160%);opacity:0;visibility:hidden;pointer-events:none}
.tgx .navItem{position:relative;width:52px;height:52px;border:0;background:none;color:#91a89c;display:grid;place-items:center;transition:color .2s,transform .2s}
.tgx .navItem .ic{width:23px;height:23px}
.tgx .navItem.on{color:#fff}
.tgx .navItem.on .ic{transform:translateY(-2px)}
.tgx .navItem.on:after{content:"";position:absolute;bottom:5px;left:50%;width:5px;height:5px;margin-left:-2.5px;border-radius:50%;background:var(--orange);box-shadow:0 0 10px var(--orange)}
.tgx .navItem:active{transform:scale(.88)}
.tgx .navItem.navCart{width:62px;height:62px;margin-top:-30px;border-radius:22px;color:#fff;background:linear-gradient(180deg,#1fb09c,#188961);box-shadow:inset 0 2px 0 rgba(255,255,255,.4),0 6px 0 #136d40,0 18px 26px -6px rgba(27,153,119,.65),0 0 0 6px #f7fcfa}
.tgx .navItem.navCart:after{display:none}
.tgx .navItem.navCart .ic{width:26px;height:26px}
.tgx .navItem.navCart:active{transform:translateY(5px);box-shadow:inset 0 2px 0 rgba(255,255,255,.3),0 1px 0 #136d40,0 6px 12px -2px rgba(27,153,119,.5),0 0 0 6px #f7fcfa}
.tgx .badge{position:absolute;right:-5px;top:-6px;min-width:22px;height:22px;padding:0 6px;border-radius:12px;background:var(--deep);color:#fff;font:800 11.5px/22px 'Manrope';text-align:center;border:2px solid #f7fcfa;transform:scale(0);transition:transform .35s cubic-bezier(.2,1.6,.3,1)}
.tgx .badge.show{transform:scale(1)}
.tgx .badge.bump{animation:bump .5s}
@keyframes bump{30%{transform:scale(1.5)}60%{transform:scale(.9)}}
.tgx .snack{position:absolute;z-index:160;left:18px;right:18px;bottom:calc(100px + env(safe-area-inset-bottom));padding:12px 12px 12px 16px;border-radius:20px;background:var(--deep);color:#fff;display:flex;align-items:center;gap:10px;font:600 13px 'DM Sans';box-shadow:0 18px 30px -8px rgba(0,0,0,.5);opacity:0;visibility:hidden;transform:translateY(20px) scale(.96);transition:.4s cubic-bezier(.2,1.2,.3,1)}
.tgx .snack.show{opacity:1;visibility:visible;transform:none}
.tgx .snack .ic{color:#47d58a;width:20px;height:20px;stroke-width:2.4}
.tgx .snack span{flex:1}
.tgx .snack button{border:0;border-radius:12px;background:var(--orange);color:#fff;font:800 12px 'Manrope';padding:9px 13px}
.tgx .flyImg{position:absolute;z-index:400;pointer-events:none;object-fit:contain;filter:drop-shadow(0 10px 10px rgba(0,0,0,.3))}
.tgx .scr{position:absolute;inset:0;background:#f7fcfa;opacity:0;visibility:hidden;transform:translateY(40px) scale(.985);transition:opacity .38s ease,transform .55s cubic-bezier(.2,.9,.25,1),visibility 0s .55s;overflow:hidden;display:flex;flex-direction:column}
.tgx .scr.active{opacity:1;visibility:visible;transform:none;transition-delay:0s}
.tgx .scrTop{display:flex;align-items:center;justify-content:space-between;padding:max(22px,env(safe-area-inset-top)) 20px 10px;flex:none}
.tgx .scrTop h3{margin:0;font:800 18px 'Manrope';letter-spacing:-.5px}
.tgx .scrBody{flex:1;overflow-y:auto;padding:6px 20px 24px;scrollbar-width:none}
.tgx .scrBody::-webkit-scrollbar{display:none}
.tgx .scrFoot{flex:none;padding:12px 20px max(16px,env(safe-area-inset-bottom));background:linear-gradient(180deg,rgba(247,252,250,0),#f7fcfa 30%)}
.tgx #details{z-index:170;background:#f7fcfa}
.tgx .dHero{height:44vh;min-height:330px;max-height:400px;position:relative;flex:none;background:radial-gradient(circle at 50% 55%,#def1e8 0,#cae9da 38%,rgba(202,233,218,0) 70%),linear-gradient(180deg,#edf8f3,#f7fcfa);display:grid;place-items:center;perspective:900px}
.tgx .dHero .dTop{position:absolute;top:0;left:0;right:0;display:flex;justify-content:space-between;align-items:center;padding:max(22px,env(safe-area-inset-top)) 20px 0;z-index:3}
.tgx .dHero .dTop h3{margin:0;font:800 16px 'Manrope'}
.tgx .dRing{position:absolute;width:290px;height:290px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff,#e6f5ee 55%,#cfebdd);box-shadow:inset 0 -14px 24px rgba(27,153,119,.12),0 30px 40px -14px rgba(24,103,60,.35);top:58px;transform:rotateX(14deg)}
.tgx .dRing:after{content:"";position:absolute;inset:26px;border-radius:50%;border:2px dashed rgba(27,153,119,.22);animation:spin 40s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.tgx .dImg{position:relative;z-index:2;width:290px;height:290px;margin-top:26px;transform:perspective(900px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transition:transform .25s}
.tgx .dImg img{width:100%;height:100%;object-fit:contain;animation:dPop .85s cubic-bezier(.2,1.3,.3,1) both,floaty 5s 1s ease-in-out infinite}
@keyframes dPop{0%{transform:scale(.3) rotate(-40deg) translateY(60px);opacity:0}100%{transform:none;opacity:1}}
.tgx .dSheet{margin-top:-28px;position:relative;z-index:4;border-radius:34px 34px 0 0;background:#fff;padding:24px 22px 28px;box-shadow:0 -18px 30px -16px rgba(24,103,60,.25);flex:1;overflow-y:auto;scrollbar-width:none}
.tgx .dSheet::-webkit-scrollbar{display:none}
.tgx .dTitle{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}
.tgx .dTitle h2{margin:0;font:800 25px/1.12 'Manrope';letter-spacing:-1px}
.tgx .dPrice{font:800 23px 'Manrope';letter-spacing:-.8px;color:var(--orange);white-space:nowrap}
.tgx .dTags{display:flex;gap:8px;flex-wrap:wrap;margin:14px 0 4px}
.tgx .dTags span{display:flex;align-items:center;gap:6px;height:34px;padding:0 12px;border-radius:12px;background:var(--soft);font:700 12px 'Manrope';color:#546b60}
.tgx .dTags .ic{width:15px;height:15px;color:var(--orange)}
.tgx .dTags .st .ic{color:var(--gold)}
.tgx .dSheet h4{margin:20px 0 8px;font:800 15px 'Manrope';letter-spacing:-.3px}
.tgx .dSheet>p{margin:0;font-size:13.5px;line-height:1.6;color:#677a70}
.tgx .spice{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}
.tgx .spice button{height:50px;border:0;border-radius:16px;background:#fff;color:#677a70;font:800 12.5px 'Manrope';display:flex;align-items:center;justify-content:center;gap:5px;box-shadow:0 0 0 1.5px #dbeee5,0 3px 0 #dbeee5;transition:.15s}
.tgx .spice button .ic{width:15px;height:15px;stroke:none;fill:currentColor}
.tgx .spice button.on{background:#eff8f4;color:#17845b;box-shadow:0 0 0 2px var(--orange),0 3px 0 #32cabb}
.tgx .spice button:active{transform:translateY(2px)}
.tgx .xtra{display:flex;align-items:center;gap:12px;width:100%;padding:12px 14px;margin-bottom:9px;border:0;border-radius:18px;background:#fff;text-align:left;box-shadow:0 0 0 1.5px #dbeee5}
.tgx .xtra u{width:26px;height:26px;border-radius:9px;border:2px solid #6ba49f;display:grid;place-items:center;color:#fff;text-decoration:none;transition:.2s;flex:none}
.tgx .xtra u .ic{width:15px;height:15px;stroke-width:3;transform:scale(0);transition:.25s cubic-bezier(.2,1.6,.3,1)}
.tgx .xtra b{flex:1;font:700 13.5px 'DM Sans'}
.tgx .xtra em{font:800 13px 'Manrope';font-style:normal;color:var(--muted)}
.tgx .xtra.on{box-shadow:0 0 0 2px var(--orange);background:#f7fbf9}
.tgx .xtra.on u{background:var(--orange);border-color:var(--orange)}
.tgx .xtra.on u .ic{transform:scale(1)}
.tgx .dFoot{display:flex;gap:12px;align-items:center;padding:12px 20px max(16px,env(safe-area-inset-bottom));background:#fff;box-shadow:0 -12px 24px -14px rgba(24,103,60,.25);flex:none;position:relative;z-index:5}
.tgx .qty{display:flex;align-items:center;height:58px;border-radius:19px;background:var(--soft);padding:0 5px;gap:2px}
.tgx .qty button{width:40px;height:44px;border:0;border-radius:14px;background:#fff;display:grid;place-items:center;color:var(--ink);box-shadow:0 3px 0 #d3ece0;transition:.12s}
.tgx .qty button:active{transform:translateY(2px);box-shadow:0 1px 0 #d3ece0}
.tgx .qty button .ic{width:18px;height:18px;stroke-width:2.4}
.tgx .qty b{min-width:34px;text-align:center;font:800 17px 'Manrope'}
.tgx .qty b.tick{animation:tick .3s}
@keyframes tick{40%{transform:scale(1.3)}}
.tgx .dFoot .b3d{flex:1}
.tgx .dFoot .b3d span{opacity:.6;font-weight:600;margin:0 -2px}
.tgx #cartSheet{z-index:210}
.tgx .cItem{display:flex;align-items:center;gap:13px;padding:12px;margin-bottom:12px;border-radius:24px;background:#fff;box-shadow:0 3px 0 #dcf1e7,0 14px 22px -14px rgba(24,103,60,.3);animation:cIn .5s cubic-bezier(.2,1.2,.3,1) both}
@keyframes cIn{from{opacity:0;transform:translateY(16px) scale(.96)}}
.tgx .cItem .cimg{width:76px;height:76px;flex:none;border-radius:20px;background:radial-gradient(circle at 50% 35%,#ecf7f2,#d2ecdf);display:grid;place-items:center}
.tgx .cItem .cimg img{width:86px;height:86px;object-fit:contain;margin:-8px;filter:drop-shadow(0 8px 8px rgba(16,69,40,.3))}
.tgx .cItem .cinfo{flex:1;min-width:0}
.tgx .cItem h4{margin:0;font:800 14.5px/1.2 'Manrope';letter-spacing:-.4px}
.tgx .cItem small{display:block;color:var(--muted);font-size:11.5px;margin:3px 0 7px;line-height:1.35}
.tgx .cItem .cbot{display:flex;align-items:center;justify-content:space-between}
.tgx .cItem .cprice{font:800 15px 'Manrope';color:var(--ink)}
.tgx .miniQ{display:flex;align-items:center;gap:2px;background:var(--soft);border-radius:13px;padding:3px}
.tgx .miniQ button{width:28px;height:28px;border:0;border-radius:10px;background:#fff;display:grid;place-items:center;box-shadow:0 2px 0 #d3ece0}
.tgx .miniQ button .ic{width:14px;height:14px;stroke-width:2.6}
.tgx .miniQ b{min-width:24px;text-align:center;font:800 13px 'Manrope'}
.tgx .cDel{width:34px;height:34px;border:0;border-radius:12px;background:#f3faf7;color:#e5483a;display:grid;place-items:center;align-self:flex-start}
.tgx .cDel .ic{width:17px;height:17px}
.tgx .sumBox{margin-top:8px;padding:18px;border-radius:26px;background:#fff;box-shadow:0 0 0 1.5px #e2f3eb}
.tgx .sumRow{display:flex;justify-content:space-between;align-items:center;padding:6px 0;font-size:13.5px;color:#677a70}
.tgx .sumRow b{font:800 14px 'Manrope';color:var(--ink)}
.tgx .sumRow.total{margin-top:8px;padding-top:14px;border-top:1.5px dashed #d3e8de;font:800 15px 'Manrope';color:var(--ink)}
.tgx .sumRow.total b{font-size:21px;color:var(--orange);letter-spacing:-.7px}
.tgx #checkout{z-index:230}
.tgx .stepper{display:flex;gap:7px;padding:0 20px 8px}
.tgx .stepper i{flex:1;height:5px;border-radius:5px;background:#d3e9de;overflow:hidden;position:relative}
.tgx .stepper i:after{content:"";position:absolute;inset:0;background:var(--orange);transform:scaleX(0);transform-origin:left;transition:transform .6s cubic-bezier(.2,.9,.3,1)}
.tgx .stepper i.on:after{transform:none}
.tgx .pane{display:none}
.tgx .pane.on{display:block;animation:paneIn .5s cubic-bezier(.2,.9,.25,1)}
@keyframes paneIn{from{opacity:0;transform:translateX(26px)}}
.tgx .coH{margin:18px 0 10px;font:800 17px 'Manrope';letter-spacing:-.5px}
.tgx .coH:first-child{margin-top:6px}
.tgx .locCard{border-radius:28px;background:#fff;overflow:hidden;box-shadow:0 0 0 1.5px #e2f3eb,0 18px 28px -16px rgba(24,103,60,.35)}
.tgx .miniMap{height:132px;position:relative;overflow:hidden;background:#ebf4f0}
.tgx .miniMap:before{content:"";position:absolute;inset:-20px;background-image:linear-gradient(#fff 3px,transparent 3px),linear-gradient(90deg,#fff 3px,transparent 3px),linear-gradient(rgba(0,0,0,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(0,0,0,.025) 1px,transparent 1px);background-size:64px 64px,64px 64px,16px 16px,16px 16px;transform:rotate(-8deg)}
.tgx .miniMap:after{content:"";position:absolute;right:-30px;top:-10px;width:90px;height:190px;background:#d9eef0;border-radius:50% 0 0 50%;transform:rotate(8deg)}
.tgx .mmRoute{position:absolute;left:18%;right:22%;top:44%;height:3px;background:repeating-linear-gradient(90deg,var(--orange) 0 9px,transparent 9px 16px);transform:rotate(-8deg);z-index:2;border-radius:3px}
.tgx .mmPin{position:absolute;z-index:3;display:grid;place-items:center;width:38px;height:38px;border-radius:50% 50% 50% 8px;transform:rotate(-45deg);box-shadow:0 10px 14px -4px rgba(0,0,0,.35)}
.tgx .mmPin .ic{transform:rotate(45deg);width:18px;height:18px;color:#fff;stroke-width:2}
.tgx .mmPin.k{left:12%;top:26%;background:var(--deep)}
.tgx .mmPin.u{right:20%;top:38%;background:var(--orange);animation:pinDrop .8s .3s cubic-bezier(.2,1.5,.3,1) both}
@keyframes pinDrop{from{opacity:0;transform:rotate(-45deg) translate(-18px,-50px)}}
.tgx .mmChip{position:absolute;left:12px;bottom:12px;z-index:4;padding:7px 11px;border-radius:12px;background:rgba(255,255,255,.95);font:800 11.5px 'Manrope';display:flex;align-items:center;gap:6px;box-shadow:0 6px 14px -6px rgba(0,0,0,.3)}
.tgx .mmChip .ic{width:14px;height:14px;color:var(--orange)}
.tgx .locInfo{padding:16px 18px 6px}
.tgx .locInfo small{color:var(--muted);font-size:11.5px;font-weight:600}
.tgx .locInfo b{display:block;font:800 16px/1.3 'Manrope';letter-spacing:-.4px;margin-top:3px}
.tgx .askRow{display:grid;grid-template-columns:1fr 1fr;gap:9px;padding:12px 14px 14px}
.tgx .askRow button{height:50px;border:0;border-radius:16px;font:800 13px 'Manrope';display:flex;align-items:center;justify-content:center;gap:7px;background:#fff;color:#546b60;box-shadow:0 0 0 1.5px #d2e9de,0 3px 0 #d2e9de;transition:.15s}
.tgx .askRow button .ic{width:17px;height:17px;stroke-width:2.2}
.tgx .askRow button.on{background:#f1fbf5;color:var(--leaf);box-shadow:0 0 0 2px var(--leaf),0 3px 0 #a5d7bc}
.tgx .askRow button:active{transform:translateY(2px)}
.tgx .feeCard{display:flex;align-items:center;gap:14px;padding:16px;border-radius:24px;background:linear-gradient(135deg,#0c2819,#104528);color:#fff;box-shadow:0 18px 26px -14px rgba(16,69,40,.8)}
.tgx .feeCard u{width:50px;height:50px;border-radius:17px;background:rgba(255,255,255,.12);display:grid;place-items:center;text-decoration:none;color:#24cdbc;flex:none}
.tgx .feeCard u .ic{width:26px;height:26px}
.tgx .feeCard div{flex:1}
.tgx .feeCard small{opacity:.7;font-size:12px;display:block}
.tgx .feeCard b{font:800 22px 'Manrope';letter-spacing:-.8px}
.tgx .feeCard em{font-style:normal;font:800 11.5px 'Manrope';padding:7px 10px;border-radius:11px;background:rgba(255,255,255,.14)}
.tgx .noteBox{display:block;width:100%;min-height:78px;padding:14px 16px;border:0;border-radius:20px;background:#fff;box-shadow:0 0 0 1.5px #dbeee5;font:500 14px/1.5 'DM Sans';color:var(--ink);outline:0;resize:none}
.tgx .noteBox:focus{box-shadow:0 0 0 2px var(--orange)}
.tgx .noteBox::placeholder{color:#9fb3a9}
.tgx .qNotes{display:flex;gap:8px;overflow-x:auto;padding:10px 0 2px;scrollbar-width:none}
.tgx .qNotes::-webkit-scrollbar{display:none}
.tgx .qNotes button{flex:none;height:34px;padding:0 13px;border:0;border-radius:12px;background:var(--soft);color:#254b37;font:700 12px 'DM Sans'}
.tgx .qNotes button:active{background:#dff1e8}
.tgx .pay{display:block;width:100%;text-align:left;border:0;padding:0;margin-bottom:11px;border-radius:24px;background:#fff;box-shadow:0 0 0 1.5px #dbeee5;transition:box-shadow .2s,background .2s;overflow:hidden}
.tgx .payH{display:flex;align-items:center;gap:14px;padding:15px}
.tgx .payH u{width:48px;height:48px;border-radius:16px;background:var(--soft);color:var(--orange);display:grid;place-items:center;text-decoration:none;flex:none}
.tgx .payH u .ic{width:24px;height:24px}
.tgx .payH div{flex:1}
.tgx .payH b{display:block;font:800 14.5px 'Manrope';letter-spacing:-.3px}
.tgx .payH small{color:var(--muted);font-size:12px}
.tgx .radio{width:24px;height:24px;border-radius:50%;border:2px solid #6aa19c;display:grid;place-items:center;transition:.2s}
.tgx .radio:after{content:"";width:12px;height:12px;border-radius:50%;background:var(--orange);transform:scale(0);transition:.25s cubic-bezier(.2,1.6,.3,1)}
.tgx .pay.on{box-shadow:0 0 0 2px var(--orange),0 16px 24px -14px rgba(27,153,119,.55);background:#f9fcfb}
.tgx .pay.on .radio{border-color:var(--orange)}
.tgx .pay.on .radio:after{transform:scale(1)}
.tgx .payX{display:none;padding:0 15px 16px}
.tgx .pay.on .payX{display:block;animation:paneIn .4s}
.tgx .inp{width:100%;height:52px;border:0;border-radius:15px;background:#fff;padding:0 15px;font:600 14.5px 'DM Sans';color:var(--ink);box-shadow:0 0 0 1.5px #d6eae0;outline:0;margin-bottom:9px}
.tgx .inp:focus{box-shadow:0 0 0 2px var(--orange)}
.tgx .inp.err{box-shadow:0 0 0 2px #e5483a;animation:shakeOtp .35s}
.tgx .two{display:grid;grid-template-columns:1fr 1fr;gap:9px}
.tgx .bankBox{padding:14px;border-radius:18px;background:var(--soft);font-size:13px;line-height:1.7;color:#546b60}
.tgx .bankBox b{color:var(--ink);font-family:'Manrope'}
.tgx .copyBtn{display:inline-flex;align-items:center;gap:5px;border:0;background:#fff;border-radius:10px;padding:6px 10px;font:800 11.5px 'Manrope';color:var(--orange);margin-left:6px;box-shadow:0 2px 0 #d3ece0}
.tgx .copyBtn .ic{width:13px;height:13px}
.tgx .secureNote{display:flex;align-items:center;gap:8px;justify-content:center;margin-top:12px;font-size:11.5px;color:var(--muted)}
.tgx .secureNote .ic{width:14px;height:14px;color:var(--leaf)}
.tgx .payLoad{position:absolute;inset:0;z-index:280;background:rgba(247,252,250,.92);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);display:grid;place-items:center;text-align:center;opacity:0;visibility:hidden;transition:.3s}
.tgx .payLoad.show{opacity:1;visibility:visible}
.tgx .spinner{width:74px;height:74px;border-radius:50%;margin:0 auto 20px;border:6px solid #ddf1e7;border-top-color:var(--orange);animation:spin .9s linear infinite}
.tgx .payLoad b{font:800 18px 'Manrope';letter-spacing:-.5px}
.tgx .payLoad p{color:var(--muted);font-size:13px;margin:6px 0 0}
.tgx .orderDone{position:absolute;inset:0;z-index:260;display:flex;flex-direction:column;background:radial-gradient(circle at 50% -5%,#1da58a,rgba(29,165,138,0) 52%),linear-gradient(180deg,#0c2819,#0b1c13);color:#fff;opacity:0;visibility:hidden;transform:scale(1.05);transition:opacity .5s ease,transform .7s cubic-bezier(.2,.9,.25,1),visibility 0s .7s;overflow:hidden}
.tgx .orderDone.show{opacity:1;visibility:visible;transform:none;transition-delay:0s}
.tgx .doneTop{padding:max(44px,env(safe-area-inset-top)) 28px 0;text-align:center;flex:none}
.tgx .doneCheck{width:104px;height:104px;margin:0 auto 20px;border-radius:36px;background:linear-gradient(160deg,#4be08f,#1c8a55);display:grid;place-items:center;box-shadow:inset 0 3px 0 rgba(255,255,255,.4),0 8px 0 #11663c,0 24px 40px -6px rgba(28,138,85,.7);transform:scale(0) rotate(-30deg)}
.tgx .orderDone.show .doneCheck{animation:checkPop .8s .35s cubic-bezier(.2,1.5,.3,1) forwards}
@keyframes checkPop{to{transform:none}}
.tgx .doneCheck .ic{width:54px;height:54px;stroke-width:3.2;stroke-dasharray:40;stroke-dashoffset:40}
.tgx .orderDone.show .doneCheck .ic{animation:draw .6s .85s ease forwards}
@keyframes draw{to{stroke-dashoffset:0}}
.tgx .doneTop h2{margin:0 0 8px;font:800 30px 'Manrope';letter-spacing:-1.2px}
.tgx .doneTop p{margin:0 auto;max-width:300px;font-size:13.5px;line-height:1.55;opacity:.72}
.tgx .doneTop .oid{display:inline-block;margin-top:14px;padding:7px 14px;border-radius:30px;background:rgba(255,255,255,.12);font:800 12.5px 'Manrope';letter-spacing:.4px}
.tgx .doneCard{margin:22px 20px 0;padding:20px;border-radius:30px;background:#fff;color:var(--ink);flex:none;box-shadow:0 30px 50px -16px rgba(0,0,0,.6);opacity:0;transform:translateY(40px)}
.tgx .orderDone.show .doneCard{animation:up .7s .9s cubic-bezier(.2,.9,.25,1) forwards}
.tgx .etaRow{display:flex;justify-content:space-between;align-items:center;padding-bottom:14px;margin-bottom:14px;border-bottom:1.5px dashed #d3e8de}
.tgx .etaRow small{display:block;color:var(--muted);font-size:11.5px;font-weight:600}
.tgx .etaRow b{font:800 18px 'Manrope';letter-spacing:-.5px}
.tgx .etaRow .pill{padding:7px 11px;border-radius:12px;background:#eaf8f0;color:var(--leaf);font:800 11.5px 'Manrope'}
.tgx .tl{display:grid;gap:0}
.tgx .tlS{display:flex;gap:13px;align-items:flex-start;position:relative;padding-bottom:15px;opacity:.38;transition:opacity .5s}
.tgx .tlS:last-child{padding-bottom:0}
.tgx .tlS:not(:last-child):before{content:"";position:absolute;left:15px;top:32px;bottom:2px;width:2px;background:#d3e9de}
.tgx .tlS u{width:32px;height:32px;border-radius:12px;background:#e3f1ea;color:#91a89c;display:grid;place-items:center;text-decoration:none;flex:none;transition:.5s;position:relative;z-index:1}
.tgx .tlS u .ic{width:17px;height:17px}
.tgx .tlS b{display:block;font:800 13.5px 'Manrope';letter-spacing:-.3px}
.tgx .tlS small{color:var(--muted);font-size:11.5px}
.tgx .tlS.done,.tgx .tlS.now{opacity:1}
.tgx .tlS.done u{background:var(--leaf);color:#fff}
.tgx .tlS.done:before{background:var(--leaf)!important}
.tgx .tlS.now u{background:var(--orange);color:#fff;animation:pulseBox 1.6s infinite}
@keyframes pulseBox{0%{box-shadow:0 0 0 0 rgba(27,153,119,.5)}100%{box-shadow:0 0 0 12px rgba(27,153,119,0)}}
.tgx .doneFoot{margin-top:auto;padding:16px 20px max(20px,env(safe-area-inset-bottom));flex:none}
.tgx .doneFoot .b3dGhost{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.2);color:#fff;box-shadow:0 4px 0 rgba(255,255,255,.12)}
.tgx .cf{position:absolute;width:9px;height:13px;border-radius:2px;pointer-events:none;z-index:5}
.tgx #srch{z-index:190}
.tgx .srchTop{display:flex;gap:12px;align-items:center;padding:max(20px,env(safe-area-inset-top)) 20px 8px;flex:none}
.tgx .srchField{flex:1;height:54px;border-radius:19px;background:#fff;display:flex;align-items:center;gap:10px;padding:0 8px 0 15px;box-shadow:0 0 0 2px var(--orange),0 14px 24px -12px rgba(27,153,119,.5)}
.tgx .srchField>.ic{color:var(--orange)}
.tgx .srchField input{flex:1;min-width:0;border:0;outline:0;background:none;font:600 15px 'DM Sans';color:var(--ink)}
.tgx .srchField button{width:36px;height:36px;border:0;border-radius:12px;background:var(--soft);display:none;place-items:center}
.tgx .srchField button.show{display:grid}
.tgx .srchField button .ic{width:15px;height:15px;stroke-width:2.4}
.tgx .tChips{display:flex;flex-wrap:wrap;gap:9px}
.tgx .tChips button{height:40px;padding:0 15px;border:0;border-radius:14px;background:#fff;font:700 13px 'DM Sans';display:flex;align-items:center;gap:7px;box-shadow:0 0 0 1.5px #dbeee5,0 3px 0 #dbeee5}
.tgx .tChips .ic{width:15px;height:15px;color:var(--orange)}
.tgx .locationOverlay{position:absolute;inset:0;z-index:300;background:#f7fcfa;opacity:0;visibility:hidden;transform:translateY(40px);transition:opacity .38s,transform .55s cubic-bezier(.2,.9,.25,1),visibility 0s .55s;display:flex;flex-direction:column;font-family:'DM Sans',sans-serif;overflow:hidden}
.tgx .locationOverlay.active{opacity:1;visibility:visible;transform:none;transition-delay:0s}
.tgx .locHead{padding:max(22px,env(safe-area-inset-top)) 20px 10px;display:flex;align-items:center;justify-content:space-between;flex:none}
.tgx .locHead h3{margin:0;font:800 17px 'Manrope';letter-spacing:-.5px}
.tgx .mapBox{height:42vh;min-height:260px;margin:4px 16px 0;border-radius:30px;overflow:hidden;position:relative;background:#edf3f0;touch-action:none;flex:none;box-shadow:0 0 0 1.5px #dbeee5,0 20px 30px -16px rgba(24,103,60,.4)}
.tgx .mapGrid{position:absolute;inset:-80px;background-color:#edf3f0;background-image:linear-gradient(#fff 4px,transparent 4px),linear-gradient(90deg,#fff 4px,transparent 4px),linear-gradient(rgba(0,0,0,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(0,0,0,.03) 1px,transparent 1px);background-size:96px 96px,96px 96px,24px 24px,24px 24px}
.tgx .mapWater{position:absolute;right:-60px;top:-30px;width:140px;height:130%;background:#d9eef0;border-radius:50% 0 0 50%;transform:rotate(7deg)}
.tgx .mapRoad{position:absolute;left:-20px;right:-20px;top:46%;height:13px;background:#fff;transform:rotate(-6deg);box-shadow:0 0 0 2px #e1eee8}
.tgx .mapRoad.two{top:22%;transform:rotate(4deg)}
.tgx .mapRoad.three{top:72%;transform:rotate(-2deg)}
.tgx .mapLabel{position:absolute;font:700 9.5px 'DM Sans';color:#90a098}
.tgx .ml1{left:24px;top:55px}
.tgx .ml2{right:90px;top:75%}
.tgx .ml3{left:34%;top:62%}
.tgx .kPin{position:absolute;left:27%;top:37%;z-index:3;width:34px;height:34px;border-radius:12px;background:var(--deep);color:#fff;display:grid;place-items:center;box-shadow:0 8px 14px -4px rgba(0,0,0,.4)}
.tgx .kPin .ic{width:17px;height:17px}
.tgx .kPin small{position:absolute;top:38px;left:50%;transform:translateX(-50%);white-space:nowrap;font:800 9.5px 'Manrope';color:var(--deep);background:#fff;padding:3px 7px;border-radius:7px;box-shadow:0 3px 8px rgba(0,0,0,.15)}
.tgx .pinDot{position:absolute;left:50%;top:50%;transform:translate(-50%,4px);width:16px;height:6px;border-radius:50%;background:rgba(0,0,0,.25);filter:blur(2px);z-index:3}
.tgx .pinFixed{position:absolute;left:50%;top:50%;transform:translate(-50%,-100%);z-index:4;animation:pinBob 1.8s ease-in-out infinite}
.tgx .pinFixed svg{width:44px;height:53px;display:block;filter:drop-shadow(0 8px 6px rgba(27,153,119,.35))}
@keyframes pinBob{50%{transform:translate(-50%,-112%)}}
.tgx .mapHint{position:absolute;left:50%;bottom:12px;transform:translateX(-50%);z-index:5;background:rgba(11,28,19,.88);color:#fff;border-radius:30px;padding:8px 14px;font:700 11px 'DM Sans';white-space:nowrap}
.tgx .locEst{position:absolute;left:12px;top:12px;z-index:5;background:#fff;border-radius:15px;padding:9px 12px;box-shadow:0 8px 16px -6px rgba(0,0,0,.28);font:800 12px 'Manrope';display:flex;align-items:center;gap:7px}
.tgx .locEst .ic{width:15px;height:15px;color:var(--orange)}
.tgx .locPanel{padding:18px 20px 12px;flex:1;overflow-y:auto;scrollbar-width:none}
.tgx .locPanel::-webkit-scrollbar{display:none}
.tgx .locPanel h2{font:800 23px 'Manrope';letter-spacing:-.9px;margin:0 0 5px}
.tgx .locPanel>p{color:var(--muted);font-size:13px;line-height:1.5;margin:0 0 15px}
.tgx .locSearch{height:56px;border-radius:18px;background:#fff;display:flex;align-items:center;gap:11px;padding:0 15px;box-shadow:0 0 0 1.5px #dbeee5}
.tgx .locSearch:focus-within{box-shadow:0 0 0 2px var(--orange)}
.tgx .locSearch .ic{color:var(--orange)}
.tgx .locSearch input{flex:1;min-width:0;border:0;outline:0;background:none;font:600 14.5px 'DM Sans';color:var(--ink)}
.tgx .locUse{width:100%;border:0;background:var(--soft);margin-top:10px;border-radius:18px;padding:13px 15px;display:flex;align-items:center;gap:13px;text-align:left}
.tgx .locUse u{width:42px;height:42px;border-radius:14px;background:#fff;color:var(--orange);display:grid;place-items:center;text-decoration:none;box-shadow:0 3px 0 #d3ece0}
.tgx .locUse u .ic{width:21px;height:21px}
.tgx .locUse b{display:block;font:800 13px 'Manrope';letter-spacing:-.2px}
.tgx .locUse small{display:block;color:#788a81;font-size:11.5px;margin-top:2px}
.tgx .locLabels{display:flex;gap:9px;margin:16px 0 4px}
.tgx .locChip{flex:1;height:48px;border:0;border-radius:16px;background:#fff;font:800 12.5px 'Manrope';display:flex;align-items:center;justify-content:center;gap:7px;color:#546b60;box-shadow:0 0 0 1.5px #d6eae0,0 3px 0 #d6eae0;transition:.15s}
.tgx .locChip .ic{width:17px;height:17px}
.tgx .locChip.on{background:#eff8f4;color:#17845b;box-shadow:0 0 0 2px var(--orange),0 3px 0 #32cabb}
.tgx .locChip:active{transform:translateY(2px)}
.tgx .saveLoc{margin:8px 20px max(16px,env(safe-area-inset-bottom));flex:none;width:calc(100% - 40px)}
.tgx .locToast{position:absolute;z-index:330;left:50%;top:max(26px,env(safe-area-inset-top));transform:translate(-50%,-30px);background:var(--deep);color:#fff;padding:12px 18px;border-radius:30px;font:800 13px 'Manrope';display:flex;gap:8px;align-items:center;opacity:0;transition:.4s cubic-bezier(.2,1.3,.3,1)}
.tgx .locToast.show{opacity:1;transform:translate(-50%,0)}
.tgx .locToast .ic{color:#47d58a;width:16px;height:16px;stroke-width:3}
.tgx .gxPayTag{margin-top:10px;text-align:center;font-size:11px;color:#9fb3a9}
@media(prefers-reduced-motion:reduce){.tgx .b3d:after,.tgx .promoSlide img,.tgx .dImg img,.tgx .dRing:after,.tgx .pinFixed{animation:none!important}}
@supports (overflow:clip){.tgx.app,.tgx .home,.tgx .scr,.tgx .promoWrap,.tgx .locationOverlay,.tgx .orderDone{overflow:clip}
.tgx .tab{overflow-x:hidden}}
.tgx .home .tab{overscroll-behavior:contain}
.tgx .resetScreen{position:absolute;inset:0;z-index:3;background:linear-gradient(180deg,#f7fcfa,#fff 48%);padding:26px 24px;opacity:0;visibility:hidden;transform:translateX(24px);transition:opacity .25s,transform .25s,visibility .25s;overflow-y:auto}
.tgx .resetScreen.active{opacity:1;visibility:visible;transform:none}
.tgx .resetCard{max-width:420px;margin:48px auto 0}
.tgx .resetIcon{width:64px;height:64px;border-radius:20px;background:#eef8f3;display:flex;align-items:center;justify-content:center;font-size:29px;margin-bottom:25px}
.tgx .resetCard h2{font:800 30px 'Manrope',sans-serif;letter-spacing:-1.2px;margin:0 0 12px;color:#16201b}
.tgx .resetCard p{font:500 13px 'DM Sans',sans-serif;color:#6e8278;line-height:1.7;margin:0 0 26px}
.tgx .resetLabel{font:800 12px 'Manrope',sans-serif;display:block;margin-bottom:10px;color:#213229}
.tgx .resetBack{border:0;background:transparent;font:800 14px 'Manrope',sans-serif;color:#27392f;padding:8px 0}
.tgx .resetStatus{font:600 12px 'DM Sans',sans-serif;line-height:1.6;min-height:18px;margin:12px 0;color:#217553}
.tgx .resetStatus.ok{color:#257b43}
.tgx #tgStartup{position:fixed;inset:0;z-index:99999;background:#f8fcfa;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;transition:opacity .18s ease;pointer-events:all}
.tgx #tgStartup.done{opacity:0;pointer-events:none}
.tgx #tgStartup .tgStartupMark{width:64px;height:64px;border-radius:21px;background:#1b9c7c;color:white;display:grid;place-items:center;font:800 30px 'Manrope',sans-serif;box-shadow:0 12px 32px #1b9c7c30}
.tgx #tgStartup .tgStartupName{font:800 19px 'Manrope',sans-serif;color:#181f1b}
.tgx #tgStartup .tgStartupName b{color:#1b9c7c}
.tgx #tgStartup .tgStartupSpinner{width:24px;height:24px;border:3px solid #dcf1e7;border-top-color:#1b9c7c;border-radius:50%;animation:tgSpin .75s linear infinite}
@keyframes tgSpin{to{transform:rotate(360deg)}}
.tgx .fcard .pop img.photoFill{object-fit:cover;border-radius:50%;width:132px;height:132px}
.tgx .row .rimg img.photoFill{object-fit:cover;border-radius:22px;width:104px;height:104px}
.tgx .dImg img.photoFill{object-fit:cover;border-radius:50%;width:100%;height:100%}
.tgx .orderDetails{position:absolute;inset:0;z-index:190;background:#f9fdfb;visibility:hidden;opacity:0;pointer-events:none;transition:opacity .22s;display:flex;flex-direction:column}
.tgx .orderDetails.active{visibility:visible;opacity:1;pointer-events:auto}
.tgx .odHead{display:flex;align-items:center;gap:13px;padding:max(22px,env(safe-area-inset-top)) 20px 16px;background:#fff;border-bottom:1px solid #dfede6}
.tgx .odHead button{border:1px solid #dfede6;border-radius:13px;width:42px;height:42px;background:#fff;font-size:23px}
.tgx .odHead h2{font:800 19px 'Manrope';margin:0}
.tgx .odHead small{font-size:11px;color:#758a80}
.tgx .odBody{overflow:auto;flex:1;padding:18px 20px max(30px,env(safe-area-inset-bottom))}
.tgx .odCard{background:#fff;border:1px solid #e1efe8;border-radius:20px;padding:17px;margin-bottom:13px;box-shadow:0 6px 20px rgba(21,88,51,.035)}
.tgx .odCard h3{font:800 15px 'Manrope';margin:0 0 13px}
.tgx .odStatus{display:inline-block;border-radius:30px;background:#eef8f3;color:#1c805b;padding:8px 12px;font:800 12px 'Manrope'}
.tgx .odStep{display:flex;gap:12px;align-items:flex-start;position:relative;padding:0 0 19px}
.tgx .odStep:last-child{padding-bottom:0}
.tgx .odStep:not(:last-child):before{content:'';position:absolute;left:12px;top:25px;bottom:0;width:2px;background:#deece5}
.tgx .odDot{width:26px;height:26px;border-radius:50%;background:#e6f0eb;color:#aaa;display:grid;place-items:center;font-size:12px;font-weight:800;flex:none;z-index:1}
.tgx .odStep.done .odDot{background:#2b9b62;color:#fff}
.tgx .odStep.current .odDot{background:#1b9977;color:#fff}
.tgx .odStep b{display:block;font-size:13px}
.tgx .odStep small{display:block;color:#758a80;font-size:11px;margin-top:3px}
.tgx .odLine{display:flex;justify-content:space-between;gap:12px;padding:9px 0;border-bottom:1px solid #ebf5f0;font-size:12px}
.tgx .odLine:last-child{border:0}
.tgx .odLine strong{text-align:right}
.tgx .odMuted{color:#758a80}
.tgx .odItemName{font-weight:800}
.tgx .oRow[data-order-id]{cursor:pointer;text-align:left;width:calc(100% - 40px);border:0}
.tgx .oRow[data-order-id]:active{transform:scale(.99)}
.tgx .loginScreen.active{overflow-y:auto!important;overflow-x:hidden!important;overscroll-behavior:contain}
.tgx .loginScreen .loginCard{position:relative!important;top:auto!important;left:auto!important;right:auto!important;width:auto!important;margin:0 25px;padding-top:clamp(24px,9vh,90px)!important;padding-bottom:90px!important;box-sizing:border-box}
.tgx .loginScreen.active .loginSubmit{display:block!important;visibility:visible!important;min-height:58px!important}
@media(max-height:650px){.tgx .loginScreen .loginCard{padding-top:24px!important}}
.tgx .loginScreen{height:100%;height:100dvh;min-height:0}
.tgx .loginScreen.active{overflow-y:auto!important;overflow-x:hidden!important;-webkit-overflow-scrolling:touch;touch-action:pan-y;padding-bottom:env(safe-area-inset-bottom,0px)}
.tgx .loginScreen .loginCard{position:relative!important;z-index:1;top:auto!important;left:auto!important;right:auto!important;margin:0 24px!important;padding-top:max(82px,calc(env(safe-area-inset-top,0px) + 62px))!important;padding-bottom:calc(110px + env(safe-area-inset-bottom,0px))!important}
.tgx .loginScreen .flowTop{z-index:4}
.tgx .loginScreen .resetScreen{pointer-events:none!important;z-index:5;box-sizing:border-box;padding-top:calc(22px + env(safe-area-inset-top,0px));padding-bottom:calc(28px + env(safe-area-inset-bottom,0px))}
.tgx .loginScreen .resetScreen.active{pointer-events:auto!important}
.tgx .loginScreen .loginField input,.tgx .loginScreen .resetScreen input{font-size:16px!important;min-width:0}
.tgx .loginScreen .loginSubmit{display:block!important;min-height:58px!important;position:relative;z-index:2;touch-action:manipulation}
.tgx #forgotPasswordBtn{display:inline-flex;align-items:center;justify-content:flex-end;min-height:44px;touch-action:manipulation}
.tgx .loginScreen button{-webkit-tap-highlight-color:transparent}
@media(max-height:700px){.tgx .loginScreen .loginCard{padding-top:max(65px,calc(env(safe-area-inset-top,0px) + 50px))!important}
.tgx .loginScreen .loginMark{width:52px;height:52px;margin-bottom:12px}
.tgx .loginScreen .loginCard h2{font-size:29px}
.tgx .loginScreen .loginCard>p{margin-bottom:14px}}
@media(display-mode:standalone){.tgx.app{height:100%;height:100dvh}
.tgx .loginScreen.active{overscroll-behavior-y:contain}}
.tgx #tgPinLock{display:none;position:fixed;inset:0;z-index:2147483646;background:#f7fbf9;align-items:center;justify-content:center;padding:24px;overflow:auto}
.tgx #tgPinLock.visible{display:flex}
.tgx .tgPinLocked{overflow:hidden!important}
.tgx #tgPinLock .tgPinCard{width:min(350px,100%);text-align:center;padding:20px 8px}
.tgx #tgPinLock .tgPinLogo{width:70px;height:70px;background:#1b9977;border-radius:23px;color:white;font:800 34px Manrope,sans-serif;display:grid;place-items:center;margin:0 auto 26px;box-shadow:0 12px 30px #1b997733}
.tgx #tgPinLock h2{font:800 27px Manrope,sans-serif;color:#16211b;margin:0 0 9px}
.tgx #tgPinLock p{color:#6c8176;font:500 14px 'DM Sans',sans-serif;margin:0 0 25px}
.tgx #tgPinLock .tgPinDots{display:flex;justify-content:center;gap:17px;margin:12px 0 18px}
.tgx #tgPinLock .tgPinDots i{display:block;width:17px;height:17px;border-radius:50%;border:2px solid #b4c9be;background:white}
.tgx #tgPinLock .tgPinDots i.filled{background:#1b9977;border-color:#1b9977}
.tgx #tgPinInput{display:block!important;opacity:.02!important;width:170px!important;height:42px!important;margin:0 auto!important;position:relative!important;border:0!important;color:transparent!important;background:transparent!important;font-size:16px!important;outline:none!important;caret-color:transparent!important}
.tgx #tgPinError{min-height:32px!important;color:#bf382b!important;font-size:13px!important;margin:0 0 14px!important}
.tgx #tgPinReset{border:0;background:none;color:#1b9977;font:700 13px 'DM Sans',sans-serif;padding:12px;cursor:pointer}
.tgx #tgPinLock .tgPinDots{cursor:text;min-height:48px;align-items:center;touch-action:manipulation}
.tgx #tgPinLock .tgPinDots:focus-visible{outline:2px solid #1b9977;outline-offset:4px;border-radius:12px}
.tgx #tgPinLock .tgPinEntryLabel{display:block!important;color:#3f5d4e!important;font:700 13px 'DM Sans',sans-serif!important;margin:4px auto 7px!important;cursor:text!important}
.tgx #tgPinInput{display:block!important;opacity:1!important;width:192px!important;height:48px!important;box-sizing:border-box!important;margin:0 auto 12px!important;padding:8px 14px!important;border:2px solid #5aaba3!important;border-radius:12px!important;background:#fff!important;color:#1c2f24!important;-webkit-text-security:disc!important;font-size:22px!important;letter-spacing:14px!important;text-align:center!important;caret-color:#1b9977!important;outline:none!important;touch-action:manipulation!important}
.tgx #tgPinInput:focus{border-color:#1b9977!important;box-shadow:0 0 0 3px #1b997722!important}
.tgx .entrySheet.show{pointer-events:auto;isolation:isolate}
.tgx .entrySheet input{position:relative;z-index:2;pointer-events:auto;touch-action:manipulation}
.tgx .loginScreen:not(.active){pointer-events:none!important}
.tgx .loginScreen:not(.active) *{visibility:hidden!important;pointer-events:none!important}
.tgx .verifyScreen .otpRow{display:none!important}
.tgx .verifyScreen:not(.active){pointer-events:none}
.tgx .verifyScreen .vHint{font-size:12px;line-height:1.5;max-width:300px;margin-left:auto;margin-right:auto}
.tgx .verifyScreen .vHint.err{color:#217553;font-weight:700}
.tgx .odHead{background:linear-gradient(180deg,#fff,#f9fdfb)}
.tgx .odBody{background:radial-gradient(circle at 100% 0,rgba(29,165,138,.10),rgba(29,165,138,0) 45%),#f9fdfb}
.tgx .odHero{position:relative;overflow:hidden;border-radius:26px;padding:20px;margin-bottom:14px;color:#fff;background:radial-gradient(circle at 92% 0,rgba(29,165,138,.65),rgba(29,165,138,0) 55%),linear-gradient(145deg,#0c2819,#104528);box-shadow:0 22px 34px -16px rgba(16,69,40,.65)}
.tgx .odHero.done{background:radial-gradient(circle at 92% 0,rgba(63,205,130,.55),rgba(63,205,130,0) 55%),linear-gradient(145deg,#10261b,#1d4630)}
.tgx .odHero.cancelled{background:linear-gradient(145deg,#3a1510,#6b2318);display:flex;gap:15px;align-items:center}
.tgx .odHeroTop{display:flex;align-items:center;gap:15px}
.tgx .odHeroIcon{position:relative;width:64px;height:64px;border-radius:22px;flex:none;display:grid;place-items:center;background:linear-gradient(145deg,#1da58a,#1a9370);box-shadow:0 10px 22px rgba(27,153,119,.45)}
.tgx .odHero.done .odHeroIcon{background:linear-gradient(145deg,#3fcd82,#1f9b5d);box-shadow:0 10px 22px rgba(47,190,115,.4)}
.tgx .odHero.cancelled .odHeroIcon{background:#268265;box-shadow:none}
.tgx .odHeroIcon .ic{width:30px;height:30px;stroke:#fff;fill:none;stroke-width:1.9;position:relative;z-index:1}
.tgx .odHero.live .odHeroIcon .ic{animation:odBob 1.8s ease-in-out infinite}
.tgx .odHeroRing{display:none}
.tgx .odHero.live .odHeroRing{display:block;position:absolute;inset:0;border-radius:22px;border:2px solid #1da58a;animation:odRing 1.8s ease-out infinite}
.tgx .odHeroTxt small{display:flex;align-items:center;gap:7px;font:800 10.5px 'Manrope';letter-spacing:1.4px;opacity:.8}
.tgx .odHeroTxt h2{font:800 21px/1.15 'Manrope';letter-spacing:-.6px;margin:5px 0 4px}
.tgx .odHeroTxt p{margin:0;font-size:12px;opacity:.72}
.tgx .odLiveDot{width:8px;height:8px;border-radius:50%;background:#ff5b4a;box-shadow:0 0 0 0 rgba(255,91,74,.7);animation:odBlink 1.2s ease-in-out infinite}
.tgx .odBar{height:7px;border-radius:9px;background:rgba(255,255,255,.16);margin-top:18px;overflow:hidden}
.tgx .odBar span{display:block;height:100%;border-radius:9px;background:linear-gradient(90deg,#1da58a,#24cdbc,#1da58a);background-size:200% 100%;animation:odShimmer 1.8s linear infinite;transition:width .8s cubic-bezier(.2,.8,.2,1)}
.tgx .odHero.done .odBar span{background:linear-gradient(90deg,#3fcd82,#8cf0b8,#3fcd82);background-size:200% 100%}
.tgx .odBarLbl{display:flex;justify-content:space-between;font-size:10px;opacity:.6;margin-top:7px;font-weight:700}
.tgx .odCard{border-radius:24px;padding:18px;box-shadow:0 3px 0 #dcf1e7,0 16px 26px -18px rgba(24,103,60,.35);border:0}
.tgx .odH{display:flex;align-items:center;gap:10px;font:800 15px 'Manrope';letter-spacing:-.3px;margin:0 0 15px}
.tgx .odH u{width:32px;height:32px;border-radius:11px;background:#eef8f3;color:#1b9977;display:grid;place-items:center;text-decoration:none}
.tgx .odH .ic{width:17px;height:17px}
.tgx .odTrack{padding-top:2px}
.tgx .odTrack .odStep{display:flex;gap:15px;align-items:flex-start;position:relative;padding:0 0 26px}
.tgx .odTrack .odStep:last-child{padding-bottom:0}
.tgx .odTrack .odStep:not(:last-child):before{display:none}
.tgx .odTrack .odStep:not(:last-child):after{content:'';position:absolute;left:21px;top:46px;bottom:2px;width:3px;border-radius:3px;background:#e0ede7}
.tgx .odTrack .odStep.done:not(:last-child):after{background:linear-gradient(180deg,#2fbf73,#2b9b62)}
.tgx .odTrack .odStep.current:not(:last-child):after{background:linear-gradient(180deg,#1b9977 0,#34dbcb 50%,#1b9977 100%);background-size:100% 220%;animation:odFlow 1.3s linear infinite}
.tgx .odNode{position:relative;width:44px;height:44px;border-radius:50%;flex:none;display:grid;place-items:center;background:#eaf3ee;color:#a3b9ae;z-index:1}
.tgx .odNode .ic{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:1.9;position:relative;z-index:1}
.tgx .odRipple{display:none;position:absolute;inset:0;border-radius:50%}
.tgx .odStep.done .odNode{background:linear-gradient(145deg,#3fcd82,#1f9b5d);color:#fff;box-shadow:0 8px 16px -6px rgba(47,190,115,.6)}
.tgx .odStep.current .odNode{background:linear-gradient(145deg,#1da58a,#1a9370);color:#fff;box-shadow:0 10px 20px -6px rgba(27,153,119,.7)}
.tgx .odStep.current .odNode .ic{animation:odBob 1.6s ease-in-out infinite}
.tgx .odStep.current .odRipple{display:block;border:2px solid #1da58a;animation:odRing 1.8s ease-out infinite}
.tgx .odStep.current .odRipple.r2{animation-delay:.9s}
.tgx .odStep.soon .odNode{background:#f2f9f6;color:#20b5a4;box-shadow:inset 0 0 0 2px #d0ecde;animation:odNext 1.4s ease-in-out infinite}
.tgx .odStepTxt{padding-top:5px}
.tgx .odStepTxt b{display:flex;align-items:center;gap:8px;font:800 14px 'Manrope';letter-spacing:-.3px;color:#13281c}
.tgx .odStep:not(.done):not(.current):not(.next) .odStepTxt b{color:#92a99e}
.tgx .odStepTxt small{display:block;color:#758a80;font-size:11.5px;margin-top:3px}
.tgx .odLiveTag{font-style:normal;font:800 9px 'Manrope';letter-spacing:1px;color:#fff;background:#ff4d3a;border-radius:20px;padding:3px 7px;animation:odBlink 1.2s ease-in-out infinite}
.tgx .odTrack.enter .odNode{animation:odPop .6s cubic-bezier(.2,1.5,.4,1) both;animation-delay:calc(var(--i)*.14s)}
.tgx .odTrack.enter .odStepTxt{animation:odFade .5s ease both;animation-delay:calc(var(--i)*.14s + .15s)}
.tgx .odLine{padding:11px 0;font-size:12.5px;border-bottom:1px dashed #deeee6}
.tgx .odItemName{font:800 13px 'Manrope'}
.tgx .odTotal{font:800 15px 'Manrope';color:#1b9977;border-bottom:1px dashed #deeee6}
.tgx .odTotal strong{font-size:17px}
.tgx .odPay{display:inline-block;border-radius:20px;padding:4px 10px;font:800 11px 'Manrope';background:#eef8f3;color:#1c805b}
.tgx .odPay.ok{background:#e4f7ec;color:#1f9b5d}
@keyframes odPop{0%{transform:scale(0);opacity:0}100%{transform:scale(1);opacity:1}}
@keyframes odFade{from{opacity:0;transform:translateX(-8px)}to{opacity:1;transform:none}}
@keyframes odRing{0%{transform:scale(1);opacity:.7}100%{transform:scale(1.7);opacity:0}}
@keyframes odBlink{0%,100%{opacity:1}50%{opacity:.35}}
@keyframes odNext{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.45;transform:scale(.94)}}
@keyframes odBob{0%,100%{transform:translateY(0)}50%{transform:translateY(-2.5px)}}
@keyframes odFlow{from{background-position:0 0}to{background-position:0 -220%}}
@keyframes odShimmer{from{background-position:0 0}to{background-position:-200% 0}}
@media (prefers-reduced-motion:reduce){.tgx .odHero *,.tgx .odTrack *,.tgx .odBar span{animation:none!important}}
.tgx .tgNoticeBtn{margin:0 20px 12px!important;width:calc(100% - 40px)!important;padding:15px!important;border:0!important;border-radius:22px!important;background:#fff!important;display:flex;align-items:center;gap:14px!important;box-shadow:0 3px 0 #dcf1e7,0 14px 22px -14px rgba(24,103,60,.3);text-align:left;position:relative;overflow:hidden}
.tgx .tgNoticeBtn:active{transform:scale(.99)}
.tgx .tgNIcon{width:46px;height:46px;border-radius:16px;background:var(--soft);color:var(--orange);display:grid;place-items:center;text-decoration:none;flex:none}
.tgx .tgNoticeBtn .tgNoticeMeta{flex:1;min-width:0;font:800 14px 'Manrope';letter-spacing:-.3px;color:#121f18}
.tgx .tgNoticeBtn .tgNoticeMeta small{font:500 12px 'DM Sans';color:var(--muted);margin-top:2px}
.tgx .tgNoticeCount{background:linear-gradient(145deg,#1da58a,#1a9370)!important;box-shadow:0 6px 12px -4px rgba(27,153,119,.6);min-width:24px;height:24px;border-radius:13px;font:800 11px 'Manrope'!important;animation:odBlink 1.6s ease-in-out infinite}
.tgx .tgNArrow{color:#b0c6bb;width:18px;height:18px}
.tgx .tgNoticeBtn:has(.tgNoticeCount[style*="grid"]) .tgNIcon{background:linear-gradient(145deg,#1da58a,#1a9370);color:#fff}
.tgx .tgNoticeBtn:has(.tgNoticeCount[style*="grid"]) .tgNIcon .ic{animation:tgWiggle 2.4s ease-in-out infinite;transform-origin:50% 10%}
@keyframes tgWiggle{0%,60%,100%{transform:rotate(0)}66%{transform:rotate(14deg)}72%{transform:rotate(-12deg)}78%{transform:rotate(9deg)}84%{transform:rotate(-6deg)}90%{transform:rotate(0)}}
.tgx .odH5{position:relative;display:flex;padding:6px 0 4px}
.tgx .odRail{position:absolute;left:10%;right:10%;top:32px;height:5px;border-radius:5px;background:#e0ede7}
.tgx .odRailFill{position:absolute;left:0;top:0;bottom:0;border-radius:5px;background:linear-gradient(90deg,#2fbf73,#1f9b5d);transition:width .8s cubic-bezier(.2,.8,.2,1)}
.tgx .odRailFlow{position:absolute;top:0;bottom:0;width:25%;border-radius:5px;overflow:hidden;background:#dff1e8}
.tgx .odRailFlow i{position:absolute;top:-1px;bottom:-1px;width:42%;border-radius:5px;background:linear-gradient(90deg,rgba(27,153,119,0),#1b9977,rgba(27,153,119,0));animation:odTravel 1.5s ease-in-out infinite}
@keyframes odTravel{0%{left:-45%}100%{left:105%}}
.tgx .odCol{position:relative;z-index:1;flex:1;display:flex;flex-direction:column;align-items:center;text-align:center;gap:9px;min-width:0}
.tgx .odCol .odNode{width:54px;height:54px;margin-top:0}
.tgx .odCol:not(.current) .odNode{width:42px;height:42px;margin-top:6px}
.tgx .odCol b{font:800 11px 'Manrope';letter-spacing:-.2px;color:#92a99e}
.tgx .odCol.done b,.tgx .odCol.current b{color:#13281c}
.tgx .odCol.current b{color:#1b9977;font-size:12px}
.tgx .odCol.current .odNode{animation:odGlow 1.4s ease-in-out infinite}
.tgx .odCol.current .odNode .ic{width:24px;height:24px}
@keyframes odGlow{0%,100%{box-shadow:0 10px 20px -6px rgba(27,153,119,.7),0 0 0 0 rgba(27,153,119,.45)}50%{box-shadow:0 10px 24px -4px rgba(27,153,119,.9),0 0 0 9px rgba(27,153,119,0)}}
.tgx .odCol.soon .odNode{background:#f2f9f6;color:#20b5a4;box-shadow:inset 0 0 0 2px #d0ecde;animation:odNext 1.4s ease-in-out infinite}
.tgx .odCol.done .odNode{background:linear-gradient(145deg,#3fcd82,#1f9b5d);color:#fff;box-shadow:0 8px 16px -6px rgba(47,190,115,.6)}
.tgx .odCol.current .odNode{background:linear-gradient(145deg,#1da58a,#1a9370);color:#fff}
.tgx .odCol .odNode{background:#eaf3ee;color:#a3b9ae}
.tgx .odCol.current .odRipple{display:block;border:2px solid #1da58a;animation:odRing 1.8s ease-out infinite}
.tgx .odCol.current .odRipple.r2{animation-delay:.9s}
.tgx .odH5.enter .odNode{animation:odPop .6s cubic-bezier(.2,1.5,.4,1) both;animation-delay:calc(var(--i)*.14s)}
.tgx .odH5.enter .odCol.current .odNode{animation:odPop .6s cubic-bezier(.2,1.5,.4,1) both,odGlow 1.4s ease-in-out .9s infinite;animation-delay:calc(var(--i)*.14s),0s}
.tgx .odNow{display:flex;gap:13px;align-items:center;margin-top:20px;padding:14px;border-radius:18px;background:linear-gradient(135deg,#f0f9f5,#f8fcfa);border:1.5px solid #dcf0e6}
.tgx .odNow.done{background:linear-gradient(135deg,#e8f8ef,#f6fcf9);border-color:#cdeedc}
.tgx .odNowIcon{width:44px;height:44px;border-radius:15px;flex:none;display:grid;place-items:center;background:linear-gradient(145deg,#1da58a,#1a9370);color:#fff}
.tgx .odNow.done .odNowIcon{background:linear-gradient(145deg,#3fcd82,#1f9b5d)}
.tgx .odNowIcon .ic{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:1.9}
.tgx .odNow:not(.done) .odNowIcon .ic{animation:odBob 1.6s ease-in-out infinite}
.tgx .odNow small{font:800 9.5px 'Manrope';letter-spacing:1.3px;color:#1b9977}
.tgx .odNow.done small{color:#1f9b5d}
.tgx .odNow b{display:block;font:800 15px 'Manrope';letter-spacing:-.3px;margin:3px 0 2px}
.tgx .odNow p{margin:0;font-size:12px;color:#687d72}
.tgx .odNext{margin-top:10px;text-align:center;font-size:11.5px;color:#839a8e}
.tgx .odNext b{color:#13281c}
.tgx .tgPushCard{position:relative;overflow:hidden;margin:14px 18px 4px;padding:16px;border-radius:22px;display:flex;align-items:center;gap:13px;color:#fff;background:linear-gradient(145deg,#0c2819,#104528);box-shadow:0 18px 28px -16px rgba(16,69,40,.7)}
.tgx .tgPushGlow{position:absolute;right:-50px;top:-60px;width:170px;height:170px;border-radius:50%;background:radial-gradient(circle,rgba(29,165,138,.55),rgba(29,165,138,0) 70%);pointer-events:none}
.tgx .tgPushIcon{position:relative;width:46px;height:46px;border-radius:16px;flex:none;display:grid;place-items:center;text-decoration:none;background:linear-gradient(145deg,#1da58a,#1a9370);box-shadow:0 8px 16px -6px rgba(27,153,119,.7)}
.tgx .tgPushIcon .ic{width:22px;height:22px;stroke:#fff;fill:none;stroke-width:1.9}
.tgx .tgPushMeta{position:relative;flex:1;min-width:0}
.tgx .tgPushMeta b{display:block;font:800 14px 'Manrope';letter-spacing:-.3px}
.tgx .tgPushMeta p{margin:3px 0 0;font-size:11.5px;line-height:1.4;opacity:.72}
.tgx #tgEnablePush{position:relative;flex:none;border:0;border-radius:30px;padding:11px 18px;background:#fff;color:#0c2819;font:800 12.5px 'Manrope';display:inline-flex;align-items:center;gap:6px;box-shadow:0 8px 16px -8px rgba(0,0,0,.5);touch-action:manipulation}
.tgx #tgEnablePush:active{transform:scale(.96)}
.tgx .tgPushCard.on #tgEnablePush{background:rgba(63,205,130,.18);color:#6ff0ab;box-shadow:none}
.tgx .tgPushCard.on .tgPushIcon{background:linear-gradient(145deg,#3fcd82,#1f9b5d);box-shadow:0 8px 16px -6px rgba(47,190,115,.6)}
.tgx .pushScreen{background:radial-gradient(circle at 50% 0,#dff2e9 0,rgba(255,255,255,0) 55%),#fff;display:flex;flex-direction:column}
.tgx .pushBody{flex:1;overflow:auto;text-align:center;padding:max(34px,env(safe-area-inset-top)) 28px 10px}
.tgx .pushStage{position:relative;height:268px;margin:0 auto 6px;max-width:340px}
.tgx .pushBell{position:absolute;left:50%;top:104px;width:92px;height:92px;margin-left:-46px;border-radius:30px;display:grid;place-items:center;background:linear-gradient(145deg,#1da58a,#1a9370);box-shadow:0 18px 34px -10px rgba(27,153,119,.7);animation:pushPop .8s cubic-bezier(.2,1.4,.4,1) both}
.tgx .pushBell .ic{width:44px;height:44px;stroke:#fff;fill:none;stroke-width:1.8;transform-origin:50% 8%;animation:tgWiggle 2.4s ease-in-out 1s infinite}
.tgx .pushBadge{position:absolute;right:-6px;top:-6px;min-width:26px;height:26px;border-radius:13px;background:#fff;color:#1a9370;font:800 13px/26px 'Manrope';font-style:normal;box-shadow:0 6px 12px rgba(0,0,0,.18);animation:odBlink 1.4s ease-in-out infinite}
.tgx .pushRing{position:absolute;left:50%;top:150px;width:92px;height:92px;margin:-46px 0 0 -46px;border-radius:30px;border:2px solid #1da58a;opacity:0;animation:pushRing 2.8s ease-out infinite}
.tgx .pushRing.r2{animation-delay:.9s}
.tgx .pushRing.r3{animation-delay:1.8s}
@keyframes pushRing{0%{transform:scale(1);opacity:.55}100%{transform:scale(2.6);opacity:0}}
@keyframes pushPop{0%{transform:scale(0) rotate(-20deg)}100%{transform:none}}
.tgx .pushNote{position:absolute;display:flex;align-items:center;gap:9px;padding:9px 13px 9px 9px;border-radius:16px;background:#fff;text-align:left;box-shadow:0 14px 26px -12px rgba(21,88,51,.35),0 0 0 1px #e2f3eb;opacity:0;animation:pushNoteIn .7s cubic-bezier(.2,1.2,.4,1) forwards}
.tgx .pushNote u{width:30px;height:30px;border-radius:10px;background:#eef8f3;color:#1b9977;display:grid;place-items:center;text-decoration:none;font-size:15px;font-weight:800}
.tgx .pushNote b{display:block;font:800 12px 'Manrope'}
.tgx .pushNote small{display:block;font-size:10.5px;color:#758a80;margin-top:1px}
.tgx .pushNote.n1{left:0;top:2px}
.tgx .pushNote.n2{right:0;top:50px}
.tgx .pushNote.n3{left:14px;top:214px}
.tgx .pushNote{animation-name:pushNoteIn,pushFloat;animation-duration:.7s,4s;animation-delay:inherit;animation-iteration-count:1,infinite;animation-fill-mode:forwards,none}
.tgx .pushNote.n1{animation-delay:.7s,1.4s}
.tgx .pushNote.n2{animation-delay:1.2s,2s}
.tgx .pushNote.n3{animation-delay:1.7s,2.6s}
@keyframes pushNoteIn{0%{opacity:0;transform:translateY(16px) scale(.85)}100%{opacity:1;transform:none}}
@keyframes pushFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}
.tgx .pushBody h2{font:800 clamp(28px,8vw,34px)/1.1 'Manrope';letter-spacing:-1.4px;margin:6px 0 10px}
.tgx .pushBody h2 span{color:var(--orange)}
.tgx .pushBody>p{max-width:320px;margin:0 auto;color:var(--muted);font-size:13.5px;line-height:1.55}
.tgx .pushPerks{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-top:16px}
.tgx .pushPerks span{padding:8px 12px;border-radius:30px;background:#eef8f3;color:#1f7f5c;font:800 11px 'Manrope'}
.tgx .pushMsg{min-height:18px;margin:12px auto 0;max-width:320px;color:#217553;font-size:12px;font-weight:700;line-height:1.45}
.tgx .pushActions{padding:10px 26px max(28px,calc(env(safe-area-inset-bottom) + 16px));text-align:center}
.tgx .pushEnable{width:100%;height:58px;border:0;border-radius:19px;background:linear-gradient(145deg,#1da58a,#1a9370);color:#fff;font:800 15px 'Manrope';box-shadow:0 14px 26px -10px rgba(27,153,119,.65);touch-action:manipulation}
.tgx .pushEnable:active{transform:scale(.985)}
.tgx .pushEnable:disabled{opacity:.8}
.tgx .pushSkip{width:100%;height:48px;margin-top:8px;border:0;background:transparent;color:#758a80;font:800 13.5px 'Manrope';touch-action:manipulation}
.tgx .pushActions small{display:block;font-size:11px;color:#a4b1ab;margin-top:2px}
@media(max-height:700px){.tgx .pushStage{height:210px;transform:scale(.88);transform-origin:top center;margin-bottom:-22px}}
@media (prefers-reduced-motion:reduce){.tgx .pushNote,.tgx .pushRing,.tgx .pushBell,.tgx .pushBell .ic,.tgx .pushBadge{animation:none!important;opacity:1}
.tgx .pushRing{display:none}}
/* GEMMYS onboarding */
html,body{margin:0;padding:0;width:100%;min-height:100%;background:#edf1ec}
body{font-family:Arial,Helvetica,sans-serif}
#gmo *{box-sizing:border-box}
#gmo #br{display:none!important}
#gmo .gm{--g:#173e27;--gold:#1d7f5b;--ink:#0b2817;width:100%;height:100vh;height:100dvh;min-height:650px;position:relative;overflow:hidden;background:#fff;color:var(--ink)}
#gmo .gm input{position:absolute;opacity:0;pointer-events:none}
#gmo .slides,#gmo .slide{position:absolute;inset:0}
#gmo .slide{padding:12px 18px 116px;display:flex;flex-direction:column;opacity:0;visibility:hidden;transform:translateX(55px);transition:opacity .48s ease,transform .68s cubic-bezier(.2,.8,.2,1),visibility .48s;background:#fff}
#gmo #p1:checked~.slides .s1,#gmo #p2:checked~.slides .s2,#gmo #p3:checked~.slides .s3{opacity:1;visibility:visible;transform:none;z-index:2}
#gmo .top{height:70px;display:flex;align-items:center;justify-content:space-between;z-index:5}
#gmo .logo{width:108px;height:66px;object-fit:contain}
#gmo .skip{font-size:13px;font-weight:700;color:#222;cursor:pointer;padding:12px}
#gmo button.skip{border:0;background:transparent;font-family:inherit;font-size:12.5px;touch-action:manipulation}
#gmo .goLogin b{color:#1d7f5b;font-weight:900}
#gmo .loginLink{display:block;width:100%;margin-top:10px;padding:10px 0 2px;border:0;background:transparent;font:700 13px Arial,Helvetica,sans-serif;color:#667168;text-align:center;cursor:pointer;touch-action:manipulation}
#gmo .art{position:relative;flex:1;min-height:410px;display:flex;align-items:flex-end;justify-content:center;margin:-12px -28px -8px}
#gmo .shape{position:absolute;inset:4% -15% 6%;background:linear-gradient(145deg,#edf3ed,#dce8df);border-radius:45% 55% 42% 58%;transform:rotate(-5deg);animation:morph 5s ease-in-out infinite}
#gmo .person{position:relative;z-index:2;width:136%;height:119%;object-fit:contain;object-position:center bottom;filter:drop-shadow(0 24px 22px rgba(18,48,29,.14));animation:float 4s ease-in-out infinite}
#gmo .s1 .person{width:140%;height:121%;margin-bottom:-6%}
#gmo .s2 .person{width:132%;height:116%;margin-bottom:-4%}
#gmo .s3 .person{width:146%;height:125%;margin-bottom:-8%}
#gmo .badge{position:absolute;z-index:4;background:var(--g);color:#fff;border-radius:16px;padding:10px 13px;font-size:10px;font-weight:900;line-height:1.35;letter-spacing:.05em;box-shadow:0 12px 26px rgba(23,62,39,.18);animation:bob 3s ease-in-out infinite}
#gmo .b1{left:0;top:16%}
#gmo .b2{right:0;top:28%;background:var(--gold);animation-delay:.7s}
#gmo .s1 .b2{background:#fff;color:var(--g);border:1px solid #dbe5dd}
#gmo .s3 .b1{left:18px;top:17%}
#gmo .s3 .b2{right:18px;top:31%;max-width:94px;text-align:center}
#gmo .doodle{position:absolute;z-index:4;color:var(--gold);font-size:30px;font-weight:900;animation:twinkle 2s ease-in-out infinite}
#gmo .d1{right:8%;top:10%}
#gmo .d2{left:7%;bottom:10%;animation-delay:.5s}
#gmo .copy{position:relative;z-index:7;margin-top:-3px}
#gmo .copy h1{font:900 43px/.91 Arial,Helvetica,sans-serif;letter-spacing:-2.6px;margin:0;color:#092817;max-width:360px}
#gmo .stroke{width:190px;height:8px;border-bottom:5px solid var(--gold);border-radius:50%;transform:rotate(-2deg);margin:0 0 9px 3px}
#gmo .copy p{margin:0;color:#26372c;font-size:13px;line-height:1.45;max-width:330px}
#gmo .controls{position:absolute;z-index:20;left:0;right:0;bottom:0;padding:18px 20px max(20px,env(safe-area-inset-bottom));display:grid;grid-template-columns:1fr auto;align-items:center;background:linear-gradient(180deg,rgba(255,255,255,0),#fff 35%)}
#gmo .dots{display:flex;gap:9px;align-items:center}
#gmo .dots i{display:block;width:9px;height:9px;border-radius:50%;background:#cfd6d0;transition:.3s}
#gmo #p1:checked~.controls .q1,#gmo #p2:checked~.controls .q2,#gmo #p3:checked~.controls .q3{background:var(--g);transform:scale(1.15)}
#gmo .next{width:62px;height:62px;border-radius:50%;background:var(--g);color:#fff;display:grid;place-items:center;font-size:27px;font-weight:700;cursor:pointer;box-shadow:0 13px 28px rgba(23,62,39,.24);animation:pulse 2.4s ease-in-out infinite}
#gmo .get{width:148px;height:54px;padding:0 18px;border-radius:27px;font-size:14px;white-space:nowrap;place-items:center}
#gmo .n2,#gmo .n3{display:none}
#gmo #p2:checked~.controls .n1,#gmo #p3:checked~.controls .n1{display:none}
#gmo #p2:checked~.controls .n2,#gmo #p3:checked~.controls .n3{display:grid}
#gmo #p3:checked~.controls{grid-template-columns:auto 1fr;column-gap:18px}
#gmo #p3:checked~.controls .n2{display:none}
#gmo #p3:checked~.controls .n3{justify-self:end}
@keyframes float{50%{transform:translateY(-10px) rotate(.35deg)}}
@keyframes morph{50%{transform:rotate(4deg) scale(1.04);border-radius:55% 45% 52% 48%}}
@keyframes bob{50%{transform:translateY(-8px) rotate(-1deg)}}
@keyframes twinkle{0%,100%{opacity:.35;transform:scale(.75) rotate(8deg)}50%{opacity:1;transform:scale(1.18) rotate(18deg)}}
@keyframes pulse{50%{box-shadow:0 13px 28px rgba(23,62,39,.24),0 0 0 9px rgba(23,62,39,.08)}}
@media(max-width:360px){#gmo .s3 .b1{left:24px;top:18%}
#gmo .s3 .b2{right:24px;top:32%;font-size:9px;padding:9px 10px}
#gmo .s2 .person{width:128%;height:113%}}
@media(min-width:600px){#gmo .gm{max-width:430px;height:min(900px,calc(100vh - 32px));min-height:720px;margin:16px auto;border-radius:34px;box-shadow:0 28px 80px rgba(0,0,0,.16)}}
@media(max-height:720px){#gmo .top{height:58px}
#gmo .art{min-height:335px;margin:-12px -30px -10px}
#gmo .copy h1{font-size:37px}
#gmo .slide{padding-bottom:102px}
#gmo .next:not(.get){width:54px;height:54px}
#gmo .get{width:142px;height:50px}}
#gmo .s1 .b1{left:30px;top:18%;max-width:92px;text-align:center}
#gmo .s1 .b2{right:30px;top:29%;max-width:92px;text-align:center}
#gmo .s2 .b1{left:30px;top:15%;max-width:92px;text-align:center}
#gmo .s2 .b2{right:30px;top:29%;max-width:88px;text-align:center}
#gmo .s3 .b1{left:30px;top:18%;max-width:92px;text-align:center}
#gmo .s3 .b2{right:30px;top:31%;width:104px;max-width:none;text-align:center;white-space:nowrap}
@media(max-width:360px){#gmo .s1 .b1,#gmo .s2 .b1,#gmo .s3 .b1{left:34px}
#gmo .s1 .b2,#gmo .s2 .b2{right:34px}
#gmo .s3 .b2{right:34px;width:98px;font-size:9px;padding:9px 8px}}
#gmo .setup{position:absolute;inset:0;z-index:40;background:#fff;opacity:0;visibility:hidden;pointer-events:none;transform:translateY(28px);transition:.5s ease;overflow:hidden}
#gmo #nameStep:target,#gmo #locationStep:target,#gmo #interestStep:target,#gmo #wardrobeCall:target,#gmo #wardrobeReady:target{opacity:1;visibility:visible;pointer-events:auto;transform:none}
#gmo .setupTop{height:82px;padding:14px 20px;display:flex;align-items:center}
#gmo .setupTop .logo{width:105px}
#gmo .profileStage{height:calc(100% - 82px);position:relative;display:flex;flex-direction:column;justify-content:flex-end;overflow:hidden}
#gmo .profileGlow{position:absolute;width:390px;height:390px;border-radius:50%;background:#e5eee6;left:50%;bottom:20%;transform:translateX(-50%)}
#gmo .profilePerson{position:absolute;z-index:1;width:min(122%,520px);height:70%;object-fit:contain;object-position:center bottom;left:50%;bottom:0;transform:translateX(-50%);filter:drop-shadow(0 20px 24px rgba(17,55,31,.14));animation:riseIn .7s cubic-bezier(.2,.8,.2,1) both}
#gmo .talk{position:relative;z-index:3;margin:0 20px 24px;background:#fff;border:1px solid #e0e7e1;border-radius:26px;padding:20px;box-shadow:0 18px 48px rgba(17,45,28,.15);animation:talkUp .65s .15s both}
#gmo .talk:after{content:"";position:absolute;bottom:-11px;left:42px;width:22px;height:22px;background:#fff;border-right:1px solid #e0e7e1;border-bottom:1px solid #e0e7e1;transform:rotate(45deg)}
#gmo .stepTag{font-size:10px;font-weight:900;letter-spacing:.12em;color:#718078;margin-bottom:7px}
#gmo .talk h2{font-size:28px;line-height:1;margin:0 0 8px;color:#123b25;letter-spacing:-1px}
#gmo .talk p{font-size:12px;color:#667168;margin:0 0 14px}
#gmo .field{width:100%;height:52px;border:1.5px solid #cad6cd;border-radius:16px;padding:0 15px;font-size:16px;outline:none;background:#fafcf9;color:#16251b}
#gmo .field:focus{border-color:#173e27}
#gmo .setupNext{margin-top:12px;width:100%;height:50px;border:0;border-radius:16px;background:#173e27;color:#fff;font-size:14px;font-weight:800;display:flex;align-items:center;justify-content:center;text-decoration:none}
#gmo .interests{padding:14px 20px 24px;height:calc(100% - 82px);overflow:auto;background:linear-gradient(180deg,#fff,#f4f7f3)}
#gmo .interests h2{font-size:34px;line-height:.95;letter-spacing:-1.7px;color:#123b25;margin:18px 0 8px}
#gmo .interests>p{font-size:13px;color:#69756d;margin:0 0 22px}
#gmo .chips{display:grid;grid-template-columns:1fr 1fr;gap:11px}
#gmo .chip input{position:absolute;opacity:0}
#gmo .chip span{height:62px;border:1.5px solid #d8e0da;border-radius:18px;background:#fff;display:flex;align-items:center;padding:0 15px;font-size:14px;font-weight:800;color:#26362b;transition:.2s;box-shadow:0 5px 14px rgba(20,50,30,.04)}
#gmo .chip input:checked+span{background:#173e27;color:#fff;border-color:#173e27;transform:translateY(-2px)}
#gmo .interestNext{margin:22px 0 10px;height:54px;border-radius:18px;background:#173e27;color:#fff;font-size:15px;font-weight:900;display:flex;align-items:center;justify-content:center;text-decoration:none}
@keyframes riseIn{from{opacity:0;transform:translate(-50%,80px)}to{opacity:1;transform:translate(-50%,0)}}
@keyframes talkUp{from{opacity:0;transform:translateY(35px)}to{opacity:1;transform:none}}
#gmo #nameStep .profileStage,#gmo #locationStep .profileStage{justify-content:flex-start;padding-top:8px}
#gmo #nameStep .talk,#gmo #locationStep .talk{order:1;margin:0 20px;z-index:5;flex:0 0 auto}
#gmo #nameStep .talk:after,#gmo #locationStep .talk:after{bottom:-10px;left:54px}
#gmo #nameStep .profileGlow,#gmo #locationStep .profileGlow{width:360px;height:360px;bottom:-5%}
#gmo #nameStep .profilePerson,#gmo #locationStep .profilePerson{
 width:min(116%,500px);height:58%;left:50%;bottom:0;z-index:2;
 object-fit:contain;object-position:center bottom
}
@media(max-height:720px){#gmo #nameStep .talk,#gmo #locationStep .talk{padding:15px 17px}
#gmo #nameStep .talk h2,#gmo #locationStep .talk h2{font-size:24px}
#gmo #nameStep .profilePerson,#gmo #locationStep .profilePerson{height:53%}}
body:has(.setup:target) .viewport{visibility:hidden}
body:has(.setup:target) .setup{transition:none}
#gmo #nameStep:target,#gmo #locationStep:target,#gmo #interestStep:target,#gmo #wardrobeCall:target,#gmo #wardrobeReady:target{
 opacity:1;visibility:visible;pointer-events:auto;transform:none
}
#gmo .get,#gmo .get:link,#gmo .get:visited,#gmo .get:hover,#gmo .get:active{text-decoration:none!important}
#gmo #interestStep .setupTop{display:none}
#gmo .interestHeading{display:flex;align-items:flex-start;gap:13px;margin-top:14px}
#gmo .interestHeading .interestLogo{width:82px;height:auto;object-fit:contain;flex:0 0 auto;margin-top:2px}
#gmo .interestHeading .interestTitle{min-width:0}
#gmo .interestHeading .interestTitle h2{margin:0 0 8px}
#gmo .fashionFloat{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:0}
#gmo .fashionFloat i{position:absolute;font-style:normal;color:#173e27;opacity:.075;filter:grayscale(1);animation:fashionDrift 8s ease-in-out infinite}
#gmo .fashionFloat .fi1{left:5%;top:15%;font-size:34px;animation-delay:-1s}
#gmo .fashionFloat .fi2{right:7%;top:24%;font-size:31px;animation-delay:-3s}
#gmo .fashionFloat .fi3{left:9%;top:54%;font-size:29px;animation-delay:-5s}
#gmo .fashionFloat .fi4{right:8%;top:62%;font-size:35px;animation-delay:-2s}
#gmo .fashionFloat .fi5{left:48%;top:9%;font-size:25px;animation-delay:-6s}
#gmo .fashionFloat .fi6{left:45%;bottom:8%;font-size:28px;animation-delay:-4s}
@keyframes fashionDrift{
 0%,100%{transform:translate3d(0,0,0) rotate(-5deg)}
 50%{transform:translate3d(8px,-16px,0) rotate(7deg)}
}
#gmo #nameStep .setupTop,#gmo #locationStep .setupTop,#gmo #nameStep .profileStage,#gmo #locationStep .profileStage,#gmo #interestStep .interests{position:relative;z-index:2}
#gmo #interestStep{position:absolute}
#gmo #interestStep .fashionFloat{z-index:1}
#gmo #interestStep .interests{padding-bottom:42px;overflow-y:auto}
#gmo .interestHeading{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-top:14px}
#gmo .interestHeading .interestTitle{order:1;flex:1}
#gmo .interestHeading .interestLogo{order:2;width:78px;margin:0 0 0 auto}
#gmo .interestNext{position:relative;z-index:8;margin-bottom:22px;box-shadow:0 10px 22px rgba(23,62,39,.12)}
#gmo .fashionFloat i{font-size:0!important;opacity:.14!important;width:34px;height:34px;filter:none!important}
#gmo .fashionFloat i:before,#gmo .fashionFloat i:after{content:"";position:absolute;box-sizing:border-box;border:2px solid #173e27}
#gmo .fashionFloat .shirt:before{width:30px;height:25px;left:2px;top:7px;border-radius:5px 5px 7px 7px;border-top-width:2px}
#gmo .fashionFloat .shirt:after{width:13px;height:9px;left:10px;top:4px;border-radius:0 0 8px 8px;border-top:0}
#gmo .fashionFloat .hanger:before{width:31px;height:16px;left:1px;top:15px;border-radius:2px;transform:rotate(0deg);clip-path:polygon(50% 0,100% 100%,0 100%);background:transparent}
#gmo .fashionFloat .hanger:after{width:10px;height:10px;left:12px;top:5px;border-radius:50%;border-bottom-color:transparent;border-left-color:transparent;transform:rotate(-25deg)}
#gmo .fashionFloat .cart:before{width:25px;height:16px;left:5px;top:7px;border-radius:3px;transform:skew(-8deg)}
#gmo .fashionFloat .cart:after{width:5px;height:5px;left:9px;top:27px;border-radius:50%;box-shadow:15px 0 0 -1px #173e27;background:#173e27;border:0}
#gmo .fashionFloat .bag:before{width:25px;height:25px;left:5px;top:8px;border-radius:4px}
#gmo .fashionFloat .bag:after{width:12px;height:9px;left:11px;top:2px;border-radius:8px 8px 0 0;border-bottom:0}
#gmo #interestStep .interestHeading{display:block;margin-top:14px}
#gmo #interestStep .interestLogo{display:none!important}
#gmo #interestStep .interests{
 height:calc(100% - 0px);
 box-sizing:border-box;
 padding:22px 20px calc(110px + env(safe-area-inset-bottom));
 overflow-y:auto;
 -webkit-overflow-scrolling:touch;
}
#gmo #interestStep .interestNext{
 position:relative;
 z-index:10;
 width:100%;
 box-sizing:border-box;
 margin:22px 0 0;
 min-height:54px;
 flex-shrink:0;
}
#gmo #interestStep:target{
 overflow:hidden;
 padding-bottom:env(safe-area-inset-bottom);
}
#gmo #wardrobeCall{background:linear-gradient(160deg,#0c2c1b 0%,#17482d 52%,#0d2d1c 100%);color:#fff}
#gmo #wardrobeCall:target{opacity:1;visibility:visible;pointer-events:auto;transform:none}
#gmo .callScreen{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;text-align:center;padding:74px 26px calc(34px + env(safe-area-inset-bottom));overflow:hidden}
#gmo .callGlow{position:absolute;width:420px;height:420px;border-radius:50%;background:rgba(255,255,255,.045);top:20%;left:50%;transform:translateX(-50%)}
#gmo .callEyebrow{position:relative;z-index:3;font-size:11px;letter-spacing:.18em;font-weight:800;opacity:.65;margin-bottom:12px}
#gmo .callTitle{position:relative;z-index:3;font-size:39px;line-height:.98;letter-spacing:-1.8px;margin:0;color:#fff}
#gmo .callSub{position:relative;z-index:3;margin:11px 0 0;font-size:13px;opacity:.68}
#gmo .phonePulse{position:relative;z-index:3;width:132px;height:132px;margin-top:72px;border-radius:50%;display:grid;place-items:center;background:#fff;box-shadow:0 15px 42px rgba(0,0,0,.2);animation:ringWiggle 1.1s ease-in-out infinite}
#gmo .phonePulse:before,#gmo .phonePulse:after{content:"";position:absolute;inset:-18px;border:2px solid rgba(255,255,255,.28);border-radius:50%;animation:callPulse 1.8s ease-out infinite}
#gmo .phonePulse:after{animation-delay:.65s}
#gmo .phoneIcon{width:49px;height:49px;position:relative;transform:rotate(-32deg)}
#gmo .phoneIcon:before{content:"";position:absolute;width:18px;height:45px;left:15px;top:2px;border:9px solid #173e27;border-top-width:10px;border-bottom-width:10px;border-radius:17px;transform:skewY(-13deg)}
#gmo .swipeArea{position:relative;z-index:4;margin-top:auto;width:100%;max-width:340px}
#gmo .swipeText{font-size:14px;font-weight:800;letter-spacing:.04em;margin-bottom:15px;animation:swipeFade 1.25s ease-in-out infinite}
#gmo .swipeTrack{height:68px;border-radius:35px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.16);position:relative;overflow:hidden;box-shadow:inset 0 1px rgba(255,255,255,.08)}
#gmo .swipeTrack:after{content:"›  ›  ›";position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding-left:50px;font-size:28px;letter-spacing:7px;color:rgba(255,255,255,.38)}
#gmo .swipePick{position:absolute;z-index:3;left:6px;top:6px;width:56px;height:56px;border-radius:50%;background:#fff;display:grid;place-items:center;text-decoration:none;animation:swipePick 2.4s ease-in-out infinite}
#gmo .swipePick .miniPhone{width:23px;height:23px;position:relative;transform:rotate(-30deg)}
#gmo .swipePick .miniPhone:before{content:"";position:absolute;width:9px;height:21px;left:7px;top:1px;border:5px solid #173e27;border-radius:9px}
@keyframes callPulse{0%{transform:scale(.78);opacity:.65}100%{transform:scale(1.48);opacity:0}}
@keyframes ringWiggle{0%,100%{transform:rotate(0)}15%{transform:rotate(-3deg)}30%{transform:rotate(3deg)}45%{transform:rotate(-2deg)}60%{transform:rotate(2deg)}75%{transform:rotate(0)}}
@keyframes swipeFade{0%,100%{opacity:.55}50%{opacity:1}}
@keyframes swipePick{0%,55%{transform:translateX(0)}82%{transform:translateX(255px)}100%{transform:translateX(0)}}
@media(max-width:360px){#gmo .callTitle{font-size:34px}
#gmo .phonePulse{margin-top:58px}
#gmo .swipePick{animation-name:swipePickSmall}
@keyframes swipePickSmall{0%,55%{transform:translateX(0)}82%{transform:translateX(220px)}100%{transform:translateX(0)}}}
#gmo .phoneIcon,#gmo .miniPhone{display:none!important}
#gmo .realPhoneIcon{width:54px;height:54px;fill:#173e27;transform:rotate(-8deg)}
#gmo .realMiniPhone{width:27px;height:27px;fill:#173e27;transform:rotate(-8deg)}
#gmo .swipeArea{margin-top:auto}
#gmo .swipeText{display:none}
#gmo .swipeTrack{
 height:70px;border-radius:36px;position:relative;overflow:hidden;
 background:rgba(255,255,255,.13);border:1px solid rgba(255,255,255,.22);
 touch-action:none;user-select:none;-webkit-user-select:none
}
#gmo .swipeTrack:after{content:none!important}
#gmo .swipeTrack:before{
 content:"Swipe to pick";
 position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
 padding-left:48px;color:rgba(255,255,255,.82);font-size:14px;font-weight:800;
 letter-spacing:.035em;animation:swipeFade 1.25s ease-in-out infinite
}
#gmo .swipePick{
 position:absolute;left:7px;top:7px;width:56px;height:56px;border-radius:50%;
 background:#fff;display:grid;place-items:center;text-decoration:none;
 animation:none!important;transition:transform .12s ease-out;touch-action:none
}
#gmo .swipePick.dragging{transition:none}
#gmo .swipePick.accepted{transition:transform .2s ease-out}
html.gemmysStandalone,html.gemmysStandalone body{background:#fff;overscroll-behavior:none}
html.gemmysStandalone body{min-height:100%;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}
html,body{margin:0;min-height:100%;background:#f7f8f3}
body{padding:0!important}
#gmo .gemmysStandalone body{min-height:100%;background:#f7f8f3}
#gmo .gemmysStandalone .setup{padding-top:env(safe-area-inset-top);padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right)}
@supports(padding:max(0px)){#gmo .gemmysStandalone .setup{padding-left:max(env(safe-area-inset-left),0px);padding-right:max(env(safe-area-inset-right),0px)}}
::selection{background:#9fe3cf;color:#0b2817}
@media(prefers-reduced-motion:reduce){#gmo .gm *{animation:none!important;transition:none!important}}
/* ================= GEMMYS x food-app merge layer ================= */
.tgx{--orange:#1b9977;--ember:#1fb09c;--deep:#173e27;--gold:#1fb09c;--leaf:#1f8a5b;--ink:#0b2817;--muted:#6c7c73;--cream:#f7fcfa;--peach:#dff3ea;--soft:#eaf7f1;--line:#dcefe6;font-family:'DM Sans',Arial,sans-serif;color:var(--ink)}
#gmo{font-family:Arial,Helvetica,sans-serif}
#gmo .gm{--gold:#1fa58c}
html,body{background:#f2f8f5}
body:not(.gxOnbMode):not(.gxAppMode) #app{visibility:hidden}
body.gxOnbMode #app{display:none!important}
body.gxAppMode #gmo{display:none!important}
body.gxAppMode,body.gxOnbMode{overflow:hidden}
@media(min-width:561px){
 html,body{background:#0c2418}
 #gmo .gm{position:fixed;top:0;bottom:0;left:50%;width:430px;max-width:none;height:100%;min-height:0;margin:0;border-radius:0;transform:translateX(-50%);box-shadow:0 0 90px rgba(0,0,0,.55)}
 #gmo .setup{position:fixed;left:50%;right:auto;width:430px;margin-left:-215px}
}
@media(max-width:560px){#gmo .setup{position:fixed}}

/* errors stay red */
.tgx .authError,.tgx .resetStatus,.tgx .vHint.err{color:#d23b2b}
.tgx .resetStatus.ok{color:#17805e}

/* gradient headline accent: GEMMYS green into teal */
.tgx .hello h2 em,.tgx .authBody h2 span,.tgx .loginCard h2 span,.tgx .flowBody h2 span{background:linear-gradient(90deg,#173e27,#1b9977 55%,#22b8a2);-webkit-background-clip:text;background-clip:text;color:transparent}
.tgx .hello{position:relative}
.tgx .hello h2{padding-right:92px}

/* auth brand */
.tgx .authBrand{display:flex;align-items:center}
.tgx .gxAuthLogo{height:40px;width:auto;display:block}
.tgx .handle{position:static!important;transform:none!important;right:auto;bottom:auto}

/* location step (food style) inside GEMMYS onboarding */
#gmo .gxLocWrap{position:absolute;inset:0;background:#fff}
#gmo #locationStep .flowScreen{transition:none}
#gmo #locationStep .flowBack{text-decoration:none;color:#0b2817}
#gmo #locationStep .flowNext{cursor:pointer}

/* ---- delivery step: 3D icons + motion ---- */
#gmo #locationStep .flowBody{top:max(66px,9.5%)}
#gmo #locationStep .locHero{position:relative;width:74px;height:84px;margin:0 0 6px;display:grid;place-items:center}
#gmo #locationStep .pin3d{width:62px;height:70px;position:relative;z-index:2;filter:drop-shadow(0 10px 10px rgba(11,40,23,.22));animation:gmFloat 3s ease-in-out infinite}
#gmo #locationStep .pin3d .pinShadow{transform-origin:32px 65px;animation:gmShadow 3s ease-in-out infinite}
#gmo #locationStep .locHero .ring{position:absolute;left:50%;bottom:6px;width:46px;height:14px;margin-left:-23px;border:2px solid rgba(31,176,156,.55);border-radius:50%;animation:gmRing 2.6s ease-out infinite}
#gmo #locationStep .locHero .r2{animation-delay:1.3s}
@keyframes gmFloat{0%,100%{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(-8px) rotate(2deg)}}
@keyframes gmShadow{0%,100%{transform:scale(1);opacity:.28}50%{transform:scale(.7);opacity:.14}}
@keyframes gmRing{0%{transform:scale(.4);opacity:.9}100%{transform:scale(2.3);opacity:0}}
@keyframes gmRise{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}
#gmo #locationStep:target .flowBody>*{animation:gmRise .6s cubic-bezier(.2,.8,.2,1) backwards}
#gmo #locationStep:target .flowBody>:nth-child(2){animation-delay:.06s}
#gmo #locationStep:target .flowBody>:nth-child(3){animation-delay:.12s}
#gmo #locationStep:target .flowBody>:nth-child(4){animation-delay:.18s}
#gmo #locationStep:target .flowBody>:nth-child(5){animation-delay:.24s}
#gmo #locationStep:target .flowBody>:nth-child(6){animation-delay:.3s}
#gmo #locationStep:target .flowBody>:nth-child(7){animation-delay:.36s}
#gmo #locationStep:target .flowBody>.locHero{animation:none}
#gmo #locationStep .flowBody h2{font-size:clamp(26px,7.6vw,34px);margin-bottom:8px}
#gmo #locationStep .flowBody>p{font-size:13px;margin-bottom:16px}
#gmo #locationStep .addressSearch svg{color:#1b9977;top:20px}
#gmo #locationStep .bigInput{height:58px;box-shadow:0 6px 16px -8px rgba(23,62,39,.25)}
#gmo #locationStep .currentLoc{background:linear-gradient(160deg,#fff,#eaf7f1);border:1px solid #d6ebe1;box-shadow:0 4px 0 #cfe9dc,0 14px 22px -12px rgba(23,62,39,.35);transition:transform .15s,box-shadow .15s}
#gmo #locationStep .currentLoc:active{transform:translateY(3px);box-shadow:0 1px 0 #cfe9dc,0 6px 10px -8px rgba(23,62,39,.35)}
#gmo #locationStep .currentLoc i{width:42px;height:46px;border-radius:0;background:none;box-shadow:none;overflow:visible}
#gmo #locationStep .currentLoc .pin3d.mini{width:34px;height:38px;filter:drop-shadow(0 5px 4px rgba(11,40,23,.25));animation:gmFloat 2.4s ease-in-out infinite}
#gmo #locationStep .labels{margin-top:16px;gap:10px}
#gmo #locationStep .labelChip{height:82px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;border:1px solid #e0eae5;border-radius:20px;background:linear-gradient(170deg,#fff,#f1f7f4);box-shadow:0 5px 0 #dbe7e0,0 12px 18px -10px rgba(23,62,39,.3);color:#3a4a41;transition:transform .18s,box-shadow .18s,border-color .18s}
#gmo #locationStep .labelChip b{font:800 12px 'Manrope',Arial,sans-serif}
#gmo #locationStep .labelChip .ico3d{width:38px;height:38px;filter:drop-shadow(0 4px 3px rgba(11,40,23,.18))}
#gmo #locationStep .labelChip:active{transform:translateY(4px);box-shadow:0 1px 0 #dbe7e0,0 4px 8px -6px rgba(23,62,39,.3)}
#gmo #locationStep .labelChip.on{background:linear-gradient(170deg,#f2fffa,#d9f5ea);border-color:#1fb09c;color:#0f6b4c;box-shadow:0 5px 0 #8fd9c4,0 14px 20px -10px rgba(31,176,156,.55);transform:translateY(-3px)}
#gmo #locationStep .labelChip.on .ico3d{animation:gmPop .55s cubic-bezier(.3,1.6,.5,1)}
@keyframes gmPop{0%{transform:scale(.7) rotate(-8deg)}60%{transform:scale(1.18) rotate(4deg)}100%{transform:scale(1) rotate(0)}}
#gmo #locationStep .flowNext{overflow:hidden;background:linear-gradient(160deg,#22b8a2,#1b9977 55%,#137a5a);box-shadow:0 5px 0 #0e5e43,0 16px 26px -8px rgba(27,153,119,.55)}
#gmo #locationStep .flowNext:after{content:"";position:absolute;top:0;bottom:0;width:60px;left:-80px;background:linear-gradient(100deg,transparent,rgba(255,255,255,.35),transparent);transform:skewX(-18deg);animation:gmSheen 3.4s ease-in-out infinite}
@keyframes gmSheen{0%,55%{left:-80px}100%{left:120%}}
@media(max-height:700px){#gmo #locationStep .locHero{height:64px;width:56px}#gmo #locationStep .pin3d{width:46px;height:52px}#gmo #locationStep .flowBody>p{display:none}#gmo #locationStep .labelChip{height:70px}#gmo #locationStep .flowBody{top:62px}}
@media(prefers-reduced-motion:reduce){#gmo #locationStep *{animation:none!important}}

/* ---- Make GEMMYS yours: move down from the top edge ---- */
#gmo #interestStep .interests{padding-top:calc(64px + env(safe-area-inset-top))!important;padding-bottom:calc(64px + env(safe-area-inset-bottom))!important}

/* ---- name field: keep the caret inside the box ---- */
#gmo .talk{animation:talkUp .65s .15s backwards}
#gmo .field{-webkit-appearance:none;appearance:none;line-height:normal;display:block;margin:0}

/* shake feedback */
.gxShake{animation:gxShake .42s ease}
@keyframes gxShake{0%,100%{transform:translateX(0)}20%{transform:translateX(-6px)}40%{transform:translateX(6px)}60%{transform:translateX(-4px)}80%{transform:translateX(4px)}}
#gmo .field.gxShake{border-color:#d23b2b}

/* verification: code entry is visible */
.tgx .gxCodeCard{display:none;margin:16px auto 0;width:100%;max-width:300px;border:0;border-radius:20px;padding:12px 14px;background:linear-gradient(160deg,#ffffff,#eaf7f1);box-shadow:inset 0 2px 0 #fff,0 4px 0 #cfe9dc,0 14px 22px -10px rgba(23,62,39,.3);align-items:center;gap:12px;text-align:left;color:#0b2817;cursor:pointer}
.tgx .gxCodeCard.show{display:flex;animation:paneIn .4s}
.tgx .gxCodeCard i{width:40px;height:40px;border-radius:14px;background:linear-gradient(160deg,#1fb09c,#178a66);color:#fff;display:grid;place-items:center;flex:none}
.tgx .gxCodeCard i .ic{width:20px;height:20px}
.tgx .gxCodeCard span{flex:1;display:flex;flex-direction:column}
.tgx .gxCodeCard small{font:800 9.5px 'Manrope',sans-serif;letter-spacing:.14em;color:#5f7a6c}
.tgx .gxCodeCard b{font:800 22px 'Manrope',sans-serif;letter-spacing:3px;color:#173e27}
.tgx .gxCodeCard em{font-style:normal;font:800 11px 'Manrope',sans-serif;color:#1b9977}
.tgx .verifyBtn:disabled{opacity:.55}

/* reset password extra fields */
.tgx .gxResetMore{display:none}
.tgx .gxResetMore.show{display:block;animation:paneIn .35s}

/* currency chip on home */
.tgx .gxCurChip{position:absolute;right:20px;top:22px;height:38px;padding:0 10px 0 9px;border:0;border-radius:14px;background:linear-gradient(180deg,#fff,#eef8f3);color:#173e27;display:flex;align-items:center;gap:5px;font:800 12px 'Manrope',sans-serif;box-shadow:inset 0 1px 0 #fff,0 3px 0 #d3eadf,0 10px 16px -8px rgba(23,62,39,.35)}
.tgx .gxCurChip .ic{width:17px;height:17px;color:#1b9977}
.tgx .gxCurChip .chev{width:13px;height:13px;color:#8aa597}
.tgx .gxCurChip:active{transform:translateY(2px);box-shadow:0 1px 0 #d3eadf}

/* bottom sheet (currency) */
.tgx .gxSheetShade{position:absolute;inset:0;z-index:330;background:rgba(8,30,19,.32);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);opacity:0;visibility:hidden;transition:.3s}
.tgx .gxSheetShade.show{opacity:1;visibility:visible}
.tgx .gxSheet{position:absolute;z-index:331;left:12px;right:12px;bottom:-110%;background:#fff;border-radius:28px 28px 20px 20px;padding:12px 16px max(18px,calc(env(safe-area-inset-bottom) + 12px));box-shadow:0 -15px 50px rgba(11,40,23,.18);transition:bottom .5s cubic-bezier(.16,.84,.24,1)}
.tgx .gxSheet.show{bottom:12px}
.tgx .gxSheet .handle{width:38px;height:4px;background:#dbe7e1;border-radius:5px;margin:0 auto 18px}
.tgx .gxSheet h3{font:800 21px 'Manrope',sans-serif;letter-spacing:-.7px;margin:0 0 5px;color:#0b2817}
.tgx .gxSheet>p{font-size:12px;color:var(--muted);margin:0 0 14px;line-height:1.5}
.tgx .gxCurList{display:grid;gap:9px}
.tgx .gxCurOpt{display:flex;align-items:center;gap:12px;width:100%;border:0;border-radius:20px;background:#fff;padding:11px 13px;text-align:left;box-shadow:0 0 0 1.5px #dcefe6,0 3px 0 #dcefe6;transition:.15s}
.tgx .gxCurOpt u{width:44px;height:44px;border-radius:15px;background:linear-gradient(160deg,#fff,#e6f5ee);display:grid;place-items:center;font-size:23px;text-decoration:none;box-shadow:inset 0 1px 0 #fff,0 3px 0 #d3eadf}
.tgx .gxCurOpt span{flex:1;display:flex;flex-direction:column}
.tgx .gxCurOpt b{font:800 14px 'Manrope',sans-serif;color:#0b2817}
.tgx .gxCurOpt small{font-size:11.5px;color:var(--muted)}
.tgx .gxCurOpt em{font-style:normal;font:800 15px 'Manrope',sans-serif;color:#1b9977;margin-right:4px}
.tgx .gxCurOpt.on{background:#f3fbf7;box-shadow:0 0 0 2px #1b9977,0 12px 22px -14px rgba(27,153,119,.6)}
.tgx .gxCurOpt.on .radio{border-color:#1b9977}
.tgx .gxCurOpt.on .radio:after{transform:scale(1)}
.tgx .gxCurOpt:active{transform:translateY(2px)}

/* size picker uses the 3D spice buttons */
.tgx .gxSizes{grid-template-columns:repeat(auto-fill,minmax(54px,1fr))}
.tgx .gxSizes button{height:46px;font-size:13.5px}
.tgx .spice button.on{background:#eaf7f1;color:#136d40}
.tgx .dPrice .gxOld{display:block;font:700 12px 'DM Sans',sans-serif;color:#9aa9a1;text-align:right;letter-spacing:0}
.tgx .tagHot.gxSale{color:#1b9977}
.tgx .gxHeartRow{position:static!important;transform:none!important;width:40px;height:40px;background:#eef8f3!important}
.tgx #detailHeart.gxFavOn{color:#ff3d57}
.tgx #detailHeart.gxFavOn .ic{fill:#ff3d57}
.tgx .gxMuted{color:#7f9187;font-size:13px}
.tgx .gxNoNotice{text-align:center;color:#7f9187;padding:40px 12px}
.tgx .gxOpt{color:#9fb0a7;font-weight:600;font-size:13px}
.tgx .catRow .ctile{white-space:nowrap}

/* promo code + gift card */
.tgx .gxCode{display:flex;align-items:center;gap:10px;height:60px;padding:0 7px 0 8px;border-radius:20px;background:#fff;box-shadow:0 0 0 1.5px #dcefe6,0 3px 0 #dcefe6}
.tgx .gxCode:focus-within{box-shadow:0 0 0 2px #1b9977,0 3px 0 #c5e6d6}
.tgx .gxCode.hide{display:none}
.tgx .gxCode u{width:44px;height:44px;border-radius:15px;background:var(--soft);color:#1b9977;display:grid;place-items:center;text-decoration:none;flex:none}
.tgx .gxCode u .ic{width:22px;height:22px}
.tgx .gxCode input{flex:1;min-width:0;border:0;outline:0;background:transparent;font:700 14px 'Manrope',sans-serif;letter-spacing:.06em;color:#0b2817;text-transform:uppercase}
.tgx .gxCode input::placeholder{text-transform:none;letter-spacing:0;font-weight:600;color:#a5b5ad}
.tgx .gxCode button{height:44px;padding:0 16px;border:0;border-radius:15px;color:#fff;font:800 13px 'Manrope',sans-serif;background:linear-gradient(180deg,#1fb09c,#178a66);box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 4px 0 #136d40;transition:transform .12s,box-shadow .12s}
.tgx .gxCode button:active{transform:translateY(3px);box-shadow:0 1px 0 #136d40}
.tgx .gxCodeMsg{min-height:0;font:700 12px 'DM Sans',sans-serif;color:#d23b2b;margin:7px 4px 0}
.tgx .gxCodeMsg:empty{display:none}
.tgx .gxCodeMsg.ok{color:#17805e}
.tgx .gxApplied:empty{display:none}
.tgx .gxChip{display:flex;align-items:center;gap:10px;padding:10px 10px 10px 14px;border-radius:20px;background:linear-gradient(160deg,#f3fbf7,#e3f4ec);box-shadow:0 0 0 1.5px #bfe3d2;animation:paneIn .35s}
.tgx .gxChip>.ic{width:22px;height:22px;color:#1b9977}
.tgx .gxChip b{font:800 14px 'Manrope',sans-serif;color:#173e27;letter-spacing:.04em}
.tgx .gxChip small{flex:1;font-size:12px;color:#557064}
.tgx .gxChip button{width:32px;height:32px;border:0;border-radius:11px;background:#fff;color:#557064;display:grid;place-items:center;box-shadow:0 2px 0 #cfe6da}
.tgx .gxChip button .ic{width:16px;height:16px}
.tgx .sumRow.gxDisc b{color:#17805e}
.tgx .gxCurNote{font-size:11.5px;color:#557064;margin:10px 4px 0;line-height:1.5}
.tgx .gxCurNote:empty{display:none}
.tgx .gxGiftCover{display:none;align-items:center;gap:14px;padding:15px;border-radius:24px;background:#f3fbf7;box-shadow:0 0 0 2px #1b9977}
.tgx .gxGiftCover u{width:48px;height:48px;border-radius:16px;background:var(--soft);color:#1b9977;display:grid;place-items:center;text-decoration:none;flex:none}
.tgx .gxGiftCover u .ic{width:24px;height:24px}
.tgx .gxGiftCover b{display:block;font:800 14.5px 'Manrope',sans-serif}
.tgx .gxGiftCover small{color:var(--muted);font-size:12px}
.tgx #pane2.gxCovered .pay{display:none}
.tgx #pane2.gxCovered .gxGiftCover{display:flex}

/* GEMMYS order video greeting (from the GEMMYS app) */
.tgx .gxOrderVideo{position:absolute;inset:0;z-index:300;background:#fff;overflow:hidden;opacity:0;visibility:hidden;transition:opacity .35s ease,visibility 0s .35s}
.tgx .gxOrderVideo.active{opacity:1;visibility:visible;transition-delay:0s}
.tgx .orderVideoScreen{position:absolute;inset:0;background:#fff;display:flex;align-items:center;justify-content:center;overflow:hidden}
.tgx #orderSuccessVideo,.tgx #deliveryVideo{width:100%;height:100%;object-fit:cover;background:#fff}
.tgx .orderVideoFallback{position:absolute;inset:0;display:none;flex-direction:column;align-items:center;justify-content:center;text-align:center;background:#fff;color:#173e27;padding:30px}
.tgx .orderVideoFallback h2{font:800 27px 'Manrope',sans-serif;letter-spacing:-.8px;margin:0}
.tgx .orderVideoFallback p{margin:8px 0 0;color:#557064;font-size:13px}
.tgx .orderCheck{width:72px;height:72px;border-radius:50%;background:linear-gradient(160deg,#1fb09c,#173e27);color:#fff;display:grid;place-items:center;font-size:36px;margin-bottom:18px;animation:gxPulseSolid 1.4s ease-in-out infinite;box-shadow:0 14px 30px rgba(23,62,39,.25)}
@keyframes gxPulseSolid{0%,100%{transform:scale(1)}50%{transform:scale(1.08)}}
.tgx .orderFinish{position:absolute;z-index:5;left:20px;right:20px;bottom:calc(24px + env(safe-area-inset-bottom));display:grid;gap:10px;opacity:0;visibility:hidden;transform:translateY(18px);transition:.45s ease;pointer-events:none}
.tgx .orderFinish.show{opacity:1;visibility:visible;transform:none;pointer-events:auto}
.tgx .orderFinish button{width:100%;height:54px;border:0;border-radius:27px;background:#173e27;color:#fff;font:800 14px 'Manrope',sans-serif;box-shadow:0 10px 28px rgba(23,62,39,.18);touch-action:manipulation}
.tgx .orderFinish .gxTrackBtn{background:linear-gradient(180deg,#1fb09c,#178a66);box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 5px 0 #136d40,0 14px 24px -6px rgba(27,153,119,.5)}
.tgx .gxSkipVideo{position:absolute;z-index:6;right:16px;top:max(16px,env(safe-area-inset-top));height:36px;padding:0 14px;border:0;border-radius:18px;background:rgba(11,40,23,.55);color:#fff;font:800 12px 'Manrope',sans-serif;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.tgx .flyImg{position:absolute;z-index:400;pointer-events:none}
@media(prefers-reduced-motion:reduce){.tgx .orderCheck{animation:none}}
.tgx .promoSlide:nth-child(3){background:radial-gradient(circle at 85% 20%,#3cd0b6 0,rgba(60,208,182,0) 45%),linear-gradient(135deg,#06302a,#0b4d44 75%,#11695c)}
.tgx #verifyHint.err{color:#d23b2b!important;opacity:1}
.tgx .orderFinish.show~.gxSkipVideo,.tgx .gxSkipVideo.gxHide{display:none}

/* ===== Square product display (replaces the round "plate" look) ===== */
.tgx .fgrid{gap:14px 13px;padding:18px 20px 6px}
.tgx .fcard{padding:0 0 14px;overflow:hidden}
.tgx .fcard .pop{position:relative;left:auto;top:auto;width:100%;height:auto;aspect-ratio:1/1;transform:none;margin:0 0 12px;border-radius:28px 28px 16px 16px;overflow:hidden;background:linear-gradient(160deg,#f1faf6,#d9efe5);box-shadow:inset 0 -1px 0 rgba(23,62,39,.06)}
.tgx .fcard .pop img,.tgx .fcard .pop img.photoFill{position:absolute;inset:0;width:100%;height:100%;border-radius:0;object-fit:cover;filter:none}
.tgx .fcard .pop img:not(.photoFill){object-fit:contain;padding:12%;filter:drop-shadow(0 10px 10px rgba(11,40,23,.22))}
.tgx .fcard>h4,.tgx .fcard>.fmeta,.tgx .fcard>.fbot{margin-left:13px;margin-right:13px}
.tgx .fcard>.heartMini{top:10px;right:10px;transform:none}
.tgx .row .rimg{width:92px;height:92px;border-radius:20px;overflow:hidden;background:linear-gradient(160deg,#f1faf6,#d9efe5)}
.tgx .row .rimg img,.tgx .row .rimg img.photoFill{width:100%;height:100%;margin:0;border-radius:0;object-fit:cover;filter:none}
.tgx .row .rimg img:not(.photoFill){object-fit:contain;padding:10%;filter:drop-shadow(0 6px 6px rgba(11,40,23,.2))}
.tgx .cItem .cimg{overflow:hidden;border-radius:18px;background:linear-gradient(160deg,#f1faf6,#d9efe5)}
.tgx .cItem .cimg img{width:100%;height:100%;margin:0;object-fit:cover;filter:none}
.tgx .cItem .cimg img:not(.photoFill){object-fit:contain;padding:10%}
.tgx .dRing{display:none}
.tgx .dImg{width:min(250px,62vw);height:auto;aspect-ratio:1/1;margin-top:64px;border-radius:30px;overflow:hidden;background:linear-gradient(160deg,#f6fcf9,#d9efe5);box-shadow:0 0 0 6px #fff,0 30px 40px -16px rgba(11,40,23,.35)}
.tgx .dImg img,.tgx .dImg img.photoFill{width:100%;height:100%;border-radius:0;object-fit:cover}
.tgx .dImg img:not(.photoFill){object-fit:contain;padding:10%}
/* bigger product image on the details page */
.tgx .dHero{height:auto;min-height:0;max-height:none;padding:78px 18px 40px;display:flex;justify-content:center;align-items:flex-start}
.tgx .dImg{width:min(100%,52vh);margin-top:0;border-radius:28px}
.tgx .dTop{z-index:5}

.tgx .pushScreen{z-index:120}
.tgx .pushScreen h2 span{background:linear-gradient(90deg,#173e27,#1b9977 55%,#22b8a2);-webkit-background-clip:text;background-clip:text;color:transparent}


/* v3: boot splash, smaller details image, balance */
#gxBoot{position:fixed;inset:0;z-index:2147483000;background:#fff;display:none;flex-direction:column;align-items:center;justify-content:center;gap:22px}
body.gxBooting #gxBoot{display:flex}
body.gxBooting #gmo,body.gxBooting #app{visibility:hidden}
#gxBoot img{width:132px;height:auto}
#gxBoot i{width:30px;height:30px;border-radius:50%;border:3px solid #d9efe5;border-top-color:#1b9977;animation:gxSpin .8s linear infinite}
@keyframes gxSpin{to{transform:rotate(360deg)}}
.tgx .dImg{width:min(80%,42vh)}
.tgx .gxBalCard{position:relative;overflow:hidden;border-radius:26px;padding:20px;color:#fff;background:radial-gradient(circle at 88% 12%,rgba(60,208,182,.55) 0,rgba(60,208,182,0) 48%),linear-gradient(140deg,#0c2c1b,#173e27 55%,#1b9977);box-shadow:0 18px 30px -14px rgba(11,40,23,.55)}
.tgx .gxBalCard small{display:block;font:800 10.5px 'Manrope',sans-serif;letter-spacing:.16em;color:#bfe9da}
.tgx .gxBalCard b{display:block;font:800 32px 'Manrope',sans-serif;letter-spacing:-1px;margin:6px 0 4px}
.tgx .gxBalCard span{font-size:12px;color:#d4efe5}
.tgx .gxWalletList{margin-top:14px;max-height:30vh;overflow:auto}
.tgx .gxTx{display:flex;justify-content:space-between;gap:10px;padding:11px 4px;border-bottom:1px dashed #dcefe6;font-size:12.5px;color:#557064}
.tgx .gxTx b{color:#0b2817;font:800 13px 'Manrope',sans-serif}
.tgx .gxTx b.plus{color:#17805e}
.tgx #walletSheet .gxCode{margin-top:14px}
.tgx .gxUseBal{display:flex;align-items:center;gap:14px;width:100%;border:0;text-align:left;padding:15px;border-radius:24px;background:#fff;box-shadow:0 0 0 1.5px #dcefe6,0 3px 0 #dcefe6;transition:.2s}
.tgx .gxUseBal u{width:48px;height:48px;border-radius:16px;background:var(--soft);color:#1b9977;display:grid;place-items:center;text-decoration:none;flex:none}
.tgx .gxUseBal u .ic{width:24px;height:24px}
.tgx .gxUseBal div{flex:1}
.tgx .gxUseBal b{display:block;font:800 14.5px 'Manrope',sans-serif;color:#0b2817}
.tgx .gxUseBal small{color:var(--muted);font-size:12px}
.tgx .gxSwitch{width:48px;height:28px;border-radius:20px;background:#dbe7e1;position:relative;flex:none;transition:.2s}
.tgx .gxSwitch:after{content:"";position:absolute;left:3px;top:3px;width:22px;height:22px;border-radius:50%;background:#fff;box-shadow:0 2px 5px rgba(0,0,0,.18);transition:.22s cubic-bezier(.2,1.4,.3,1)}
.tgx .gxUseBal.on{box-shadow:0 0 0 2px #1b9977,0 12px 22px -14px rgba(27,153,119,.6);background:#f3fbf7}
.tgx .gxUseBal.on .gxSwitch{background:#1b9977}
.tgx .gxUseBal.on .gxSwitch:after{left:23px}
.tgx .gxUseBal:disabled{opacity:.6}
.tgx .gxAddGift{margin-top:9px;border:0;background:none;color:#1b9977;font:800 12.5px 'Manrope',sans-serif;padding:4px}
.tgx .gxOrderVideo:not(.active) *{pointer-events:none!important;visibility:hidden!important}

/* v4: wider product image (same height) */
.tgx .dImg{width:calc(100% - 8px);max-width:560px;height:min(64vw,42vh);aspect-ratio:auto;position:relative;isolation:isolate}
.tgx .dImg:before{content:"";position:absolute;inset:-20px;z-index:-1;background:var(--gxbg) center/cover no-repeat;filter:blur(22px) saturate(1.1);opacity:.45;transform:scale(1.1)}
.tgx .dImg img,.tgx .dImg img.photoFill{object-fit:contain;padding:0}
.tgx .dImg img:not(.photoFill){padding:6%}
/* v4: 3D edit-name sheet */
.tgx .gxEditName{display:flex;width:max-content;align-items:center;gap:6px;margin-top:9px;height:32px;padding:0 12px;border:0;border-radius:11px;background:rgba(255,255,255,.16);color:#fff;font:800 12px 'Manrope',sans-serif;box-shadow:inset 0 1px 0 rgba(255,255,255,.25),0 3px 0 rgba(0,0,0,.18);transition:transform .12s,box-shadow .12s}
.tgx .gxEditName .ic{width:14px;height:14px}
.tgx .gxEditName:active{transform:translateY(2px);box-shadow:0 1px 0 rgba(0,0,0,.18)}
.tgx .gxNameSheet{text-align:center;padding-top:12px}
.tgx .gxNameHero{position:relative;width:96px;height:96px;margin:4px auto 16px}
.tgx .gxNameAvatar{width:96px;height:96px;border-radius:32px;display:grid;place-items:center;color:#fff;font:800 40px 'Manrope',sans-serif;background:linear-gradient(160deg,#22b8a2,#1b9977 45%,#136d40);box-shadow:inset 0 3px 0 rgba(255,255,255,.35),inset 0 -4px 0 rgba(0,0,0,.12),0 7px 0 #0f5a3a,0 22px 30px -10px rgba(23,62,39,.55);transform:perspective(500px) rotateX(8deg)}
.tgx .gxNameAvatar span.gxPop,.tgx .gxNameAvatar .gxPop{animation:gxNamePop .35s cubic-bezier(.2,1.6,.3,1)}
.tgx #nameAvatar.gxPop{display:inline-block;animation:gxNamePop .35s cubic-bezier(.2,1.6,.3,1)}
@keyframes gxNamePop{0%{transform:scale(.6)}100%{transform:scale(1)}}
.tgx .gxNameBadge{position:absolute;right:-8px;bottom:-6px;width:34px;height:34px;border-radius:12px;background:#fff;color:#1b9977;display:grid;place-items:center;box-shadow:0 3px 0 #cfe6da,0 10px 16px -6px rgba(23,62,39,.4);transform:scale(0);transition:transform .35s cubic-bezier(.2,1.6,.3,1)}
.tgx .gxNameBadge .ic{width:18px;height:18px;stroke-width:2.6}
.tgx .gxNameSheet.gxSaved .gxNameBadge{transform:scale(1)}
.tgx .gxNameSheet h3{margin:0 0 5px}
.tgx .gxNameSheet>p{margin:0 auto 16px;max-width:300px}
.tgx .gxNameField{display:flex;align-items:center;gap:10px;height:60px;padding:0 14px;border-radius:20px;background:#fff;box-shadow:0 0 0 1.5px #dcefe6,0 4px 0 #dcefe6;text-align:left;transition:box-shadow .2s}
.tgx .gxNameField:focus-within{box-shadow:0 0 0 2px #1b9977,0 4px 0 #bfe3d2}
.tgx .gxNameField .ic{width:20px;height:20px;color:#1b9977}
.tgx .gxNameField input{flex:1;min-width:0;border:0;outline:0;background:transparent;font:700 16px 'Manrope',sans-serif;color:#0b2817}
.tgx .gxNameCount{font:700 11px 'DM Sans',sans-serif;color:#9fb0a7}
.tgx .gxNameBtns{display:grid;grid-template-columns:1fr 1.6fr;gap:10px;margin-top:18px}
.tgx .gxNameBtns .b3d,.tgx .gxNameBtns .b3dGhost{height:54px;width:100%}

/* v5: store pickup + schedule */
.tgx .gxFulfil{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.tgx .gxFulfil button{display:flex;flex-direction:column;align-items:flex-start;gap:3px;padding:14px;border:0;border-radius:22px;background:#fff;text-align:left;box-shadow:0 0 0 1.5px #dcefe6,0 4px 0 #dcefe6;transition:transform .12s,box-shadow .2s}
.tgx .gxFulfil button u{width:42px;height:42px;border-radius:14px;background:var(--soft);color:#1b9977;display:grid;place-items:center;text-decoration:none;margin-bottom:6px}
.tgx .gxFulfil button u .ic{width:22px;height:22px}
.tgx .gxFulfil button b{font:800 14.5px 'Manrope',sans-serif;color:#0b2817}
.tgx .gxFulfil button small{font-size:11.5px;color:var(--muted)}
.tgx .gxFulfil button.on{background:#f3fbf7;box-shadow:0 0 0 2px #1b9977,0 4px 0 #136d40,0 14px 22px -14px rgba(27,153,119,.6)}
.tgx .gxFulfil button.on u{background:linear-gradient(160deg,#1fb09c,#178a66);color:#fff;box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 3px 0 #136d40}
.tgx .gxFulfil button:active{transform:translateY(3px)}
.tgx .gxPickNote{display:flex;align-items:center;gap:10px;margin:14px 0 2px;padding:12px 14px;border-radius:16px;background:#e6f6ee;color:#136d40;font-size:12.5px;line-height:1.45}
.tgx .gxPickNote .ic{width:18px;height:18px;flex:none}
.tgx .gxPickNote b{color:#0b2817}
.tgx .payX .gxPickNote{margin:0 0 10px}
.tgx .payX .gxSchedBtn{margin-top:10px}
.tgx .gxStoreCard{display:flex;align-items:center;gap:14px;padding:15px;border-radius:22px;background:#fff;box-shadow:0 0 0 1.5px #dcefe6,0 4px 0 #dcefe6}
.tgx .gxStoreCard u{width:48px;height:48px;border-radius:16px;background:linear-gradient(160deg,#22b8a2,#136d40);color:#fff;display:grid;place-items:center;text-decoration:none;flex:none;box-shadow:inset 0 2px 0 rgba(255,255,255,.3),0 4px 0 #0f5a3a}
.tgx .gxStoreCard u .ic{width:24px;height:24px}
.tgx .gxStoreCard div{display:flex;flex-direction:column;gap:2px;min-width:0}
.tgx .gxStoreCard small{font:800 10px 'Manrope',sans-serif;letter-spacing:.14em;color:#5f7a6c}
.tgx .gxStoreCard b{font:800 14.5px 'Manrope',sans-serif;color:#0b2817}
.tgx .gxStoreCard span{font-size:12px;color:var(--muted)}
.tgx .gxSchedBtn{display:flex;align-items:center;gap:14px;width:100%;padding:14px;border:0;border-radius:22px;text-align:left;color:#fff;background:linear-gradient(160deg,#1fb09c,#178a66 60%,#136d40);box-shadow:inset 0 2px 0 rgba(255,255,255,.3),0 5px 0 #0f5a3a,0 16px 24px -10px rgba(27,153,119,.55);transition:transform .12s,box-shadow .12s}
.tgx .gxSchedBtn u{width:44px;height:44px;border-radius:15px;background:rgba(255,255,255,.18);display:grid;place-items:center;text-decoration:none;flex:none}
.tgx .gxSchedBtn u .ic{width:22px;height:22px}
.tgx .gxSchedBtn div{flex:1;display:flex;flex-direction:column}
.tgx .gxSchedBtn b{font:800 15px 'Manrope',sans-serif}
.tgx .gxSchedBtn small{font-size:12px;opacity:.85}
.tgx .gxSchedBtn .gxSchedArrow{width:18px;height:18px}
.tgx .gxSchedBtn:active{transform:translateY(4px);box-shadow:0 1px 0 #0f5a3a}
.tgx .gxSchedBtn.set{background:#fff;color:#0b2817;box-shadow:0 0 0 2px #1b9977,0 5px 0 #136d40}
.tgx .gxSchedBtn.set u{background:var(--soft);color:#1b9977}
.tgx .gxPickSheet{max-height:90%;overflow-y:auto}
.tgx .gxCalHead{display:flex;align-items:center;justify-content:space-between;margin:4px 0 10px}
.tgx .gxCalHead b{font:800 16px 'Manrope',sans-serif;color:#0b2817}
.tgx .gxCalHead button{width:40px;height:40px;border:0;border-radius:14px;background:linear-gradient(180deg,#fff,#eef8f3);color:#173e27;display:grid;place-items:center;box-shadow:inset 0 1px 0 #fff,0 3px 0 #d3eadf}
.tgx .gxCalHead button:disabled{opacity:.35}
.tgx .gxCalHead .gxCalNext .ic{transform:rotate(180deg)}
.tgx .gxCalWeek,.tgx .gxCalGrid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px}
.tgx .gxCalWeek span{text-align:center;font:800 10.5px 'Manrope',sans-serif;letter-spacing:.06em;color:#7f9187;padding-bottom:4px}
.tgx .gxDay{height:42px;border:0;border-radius:14px;background:#fff;color:#0b2817;font:800 14px 'Manrope',sans-serif;box-shadow:0 0 0 1.5px #dcefe6,0 3px 0 #dcefe6;transition:transform .1s}
.tgx .gxDay:disabled{background:transparent;color:#c3d0c9;box-shadow:none}
.tgx .gxDay.today:not(.on){color:#1b9977;box-shadow:0 0 0 1.5px #1b9977,0 3px 0 #bfe3d2}
.tgx .gxDay.on{color:#fff;background:linear-gradient(160deg,#1fb09c,#136d40);box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 3px 0 #0f5a3a}
.tgx .gxDay:not(:disabled):active{transform:translateY(2px)}
.tgx .gxTimeHead{margin:16px 0 10px;font:800 15px 'Manrope',sans-serif;color:#0b2817}
.tgx .gxTimeHead small{font:700 12px 'DM Sans',sans-serif;color:#1b9977;margin-left:6px}
.tgx .gxTimes{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-bottom:16px}
.tgx .gxTime{height:42px;border:0;border-radius:14px;background:#fff;color:#173e27;font:800 12.5px 'Manrope',sans-serif;box-shadow:0 0 0 1.5px #dcefe6,0 3px 0 #dcefe6}
.tgx .gxTime.on{color:#fff;background:linear-gradient(160deg,#1fb09c,#136d40);box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 3px 0 #0f5a3a}
.tgx .gxNoTimes{grid-column:1/-1;margin:0;color:#7f9187;font-size:12.5px}
.tgx #pickConfirm{width:100%}

/* v6: store contact buttons */
.tgx .gxContact{display:grid;grid-template-columns:minmax(0,1fr) 44px;gap:8px;margin-top:10px}
.tgx .gxContact a{display:flex;align-items:center;gap:10px;min-width:0;height:56px;padding:0 12px 0 8px;border-radius:18px;text-decoration:none;color:#0b2817;background:#fff;box-shadow:0 0 0 1.5px #dcefe6,0 4px 0 #dcefe6;transition:transform .12s,box-shadow .12s}
.tgx .gxContact a:active,.tgx .gxCopy:active{transform:translateY(3px);box-shadow:0 0 0 1.5px #dcefe6,0 1px 0 #dcefe6}
.tgx .gxContact a u{width:40px;height:40px;border-radius:13px;display:grid;place-items:center;text-decoration:none;flex:none;color:#fff}
.tgx .gxContact .gxCall u{background:linear-gradient(160deg,#1fb09c,#136d40);box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 3px 0 #0f5a3a}
.tgx .gxContact .gxCall u .ic{width:20px;height:20px;fill:currentColor;stroke:none}
.tgx .gxContact .gxWa u{background:linear-gradient(160deg,#3ddc76,#1fa855);box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 3px 0 #15803d}
.tgx .gxWaLogo{width:24px;height:24px}
.tgx .gxContact span{display:flex;flex-direction:column;min-width:0}
.tgx .gxContact small{font:800 10px 'Manrope',sans-serif;letter-spacing:.1em;text-transform:uppercase;color:#5f7a6c}
.tgx .gxContact b{font:800 14px 'Manrope',sans-serif;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tgx .gxCopy{width:44px;height:56px;border:0;border-radius:16px;background:linear-gradient(180deg,#fff,#eef8f3);color:#173e27;display:grid;place-items:center;box-shadow:0 0 0 1.5px #dcefe6,0 4px 0 #dcefe6;transition:transform .12s,box-shadow .12s}
.tgx .gxCopy .ic{width:18px;height:18px}
.tgx .gxCopy.ok{color:#fff;background:linear-gradient(160deg,#1fb09c,#136d40)}
.tgx .payX .gxContact{margin-top:10px}

/* ===== image zoom viewer + waybill ===== */
.tgx #waybill{z-index:215;background:#f7fcfa}
.tgx #dImg{cursor:zoom-in}
.tgx .gxZoomHint{position:absolute;right:10px;bottom:10px;z-index:5;width:36px;height:36px;border-radius:50%;background:rgba(255,255,255,.94);display:grid;place-items:center;box-shadow:0 4px 12px rgba(0,0,0,.22);color:#0d5a43;pointer-events:none}
.tgx .gxZoomHint .ic{width:20px;height:20px}
.tgx .gxZoom{position:absolute;inset:0;z-index:700;background:#06120d;display:flex;flex-direction:column;opacity:0;visibility:hidden;transition:opacity .25s ease,visibility 0s .25s}
.tgx .gxZoom.show{opacity:1;visibility:visible;transition-delay:0s}
.tgx .gxZoomStage{flex:1;min-height:0;display:flex;align-items:center;justify-content:center;overflow:hidden;touch-action:none;user-select:none;-webkit-user-select:none;cursor:zoom-in}
.tgx .gxZoomStage.zoomed{cursor:grab}
.tgx .gxZoomStage img{max-width:100%;max-height:100%;object-fit:contain;transform-origin:center center;will-change:transform;-webkit-user-drag:none;user-select:none;transition:transform .18s ease;filter:none!important;animation:none!important}
.tgx .gxZoomStage.moving img{transition:none}
.tgx .gxZoomX{position:absolute;top:max(16px,env(safe-area-inset-top));right:16px;z-index:3;width:46px;height:46px;border-radius:50%;border:0;background:#fff;color:#0b2817;display:grid;place-items:center;box-shadow:0 6px 18px rgba(0,0,0,.35);cursor:pointer}
.tgx .gxZoomX .ic{width:22px;height:22px}
.tgx .gxZoomNav{position:absolute;top:50%;z-index:3;width:42px;height:42px;margin-top:-21px;border-radius:50%;border:0;background:rgba(255,255,255,.18);color:#fff;font:400 28px/1 sans-serif;cursor:pointer;display:none}
.tgx .gxZoomNav.prev{left:10px}.tgx .gxZoomNav.next{right:10px}
.tgx .gxZoom.multi .gxZoomNav{display:block}
.tgx .gxZoomBar{position:absolute;bottom:max(22px,env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);z-index:3;display:flex;align-items:center;gap:4px;padding:6px;border-radius:999px;background:rgba(255,255,255,.16);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:#fff;font:700 13px 'Manrope',sans-serif}
.tgx .gxZoomBar button{border:0;background:rgba(255,255,255,.2);color:#fff;min-width:38px;height:38px;border-radius:999px;font:700 18px/1 'Manrope',sans-serif;padding:0 12px;cursor:pointer}
.tgx .gxZoomBar button#gxZoomReset{font-size:13px}
.tgx .gxZoomBar span{min-width:50px;text-align:center}
.tgx .wbCard{background:#fff;border-radius:22px;padding:16px;margin-bottom:14px;box-shadow:0 3px 0 #dcf1e7,0 14px 22px -14px rgba(24,103,60,.3)}
.tgx .wbCard h4{margin:0 0 10px;font:800 16px 'Manrope',sans-serif;letter-spacing:-.3px}
.tgx .wbImgs{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-bottom:14px}
.tgx .wbImgs.one{grid-template-columns:1fr}
.tgx .wbImgs img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:16px;background:#eef7f2;cursor:zoom-in;display:block}
.tgx .wbText{white-space:pre-wrap;word-break:break-word;font:500 14px/1.65 'Manrope',sans-serif;color:#1b3a2b}
.tgx .wbEmpty{text-align:center;color:#6d8175;font:600 14px/1.6 'Manrope',sans-serif;padding:40px 10px}

/* ===== delivery quote + address picker ===== */
.tgx .gxMap{position:absolute;inset:0;z-index:1;display:none;background:#e8f1ed}
.tgx .mapBox{isolation:isolate}
.tgx .mapBox.live .gxMap{display:block}
.tgx .mapBox.live .mapGrid{display:none}
.tgx .mapBox .leaflet-control-attribution{font-size:9px;opacity:.8}
.tgx .mapBox .leaflet-bottom.leaflet-right{margin-bottom:34px}
.tgx .mapBox .leaflet-control-zoom a{width:34px;height:34px;line-height:34px;color:#0d5a43}
.tgx .locSugg{margin-top:8px;border-radius:18px;background:#fff;box-shadow:0 0 0 1.5px #dbeee5;overflow:hidden;display:none}
.tgx .locSugg.show{display:block}
.tgx .locSugg button{display:flex;gap:11px;align-items:flex-start;width:100%;border:0;background:#fff;padding:12px 14px;text-align:left;border-bottom:1px solid #edf6f1;color:var(--ink)}
.tgx .locSugg button:last-child{border-bottom:0}
.tgx .locSugg button:active{background:#f1fbf5}
.tgx .locSugg .ic{width:18px;height:18px;color:var(--orange);flex:none;margin-top:2px}
.tgx .locSugg b{display:block;font:800 13px 'Manrope'}
.tgx .locSugg small{display:block;color:#788a81;font-size:11.5px;margin-top:2px;line-height:1.35}
.tgx .locSugg .gxSuggMsg{padding:13px 14px;color:#788a81;font-size:12.5px}
.tgx .locDetail{width:100%;height:50px;margin-top:10px;border:0;border-radius:16px;background:#fff;box-shadow:0 0 0 1.5px #dbeee5;padding:0 15px;font:600 14px 'DM Sans';color:var(--ink);outline:0}
.tgx .locDetail:focus{box-shadow:0 0 0 2px var(--orange)}
.tgx .locSub{margin:16px 0 8px;font:800 14px 'Manrope';letter-spacing:-.3px}
.tgx .savedRow{display:flex;align-items:center;gap:12px;padding:11px 12px;margin-bottom:8px;border-radius:16px;background:#fff;box-shadow:0 0 0 1.5px #e2f3eb;cursor:pointer}
.tgx .savedRow u{width:38px;height:38px;border-radius:13px;background:var(--soft);color:var(--orange);display:grid;place-items:center;text-decoration:none;flex:none}
.tgx .savedRow u .ic{width:19px;height:19px}
.tgx .savedRow div{flex:1;min-width:0}
.tgx .savedRow b{display:block;font:800 13px 'Manrope'}
.tgx .savedRow small{display:block;color:#788a81;font-size:11.5px;margin-top:1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tgx .savedRow button{border:0;background:#f3f8f5;width:32px;height:32px;border-radius:50%;display:grid;place-items:center;color:#788a81;flex:none}
.tgx .savedRow button .ic{width:15px;height:15px}
.tgx .gxQ{display:flex;gap:11px;margin-top:12px;padding:13px 14px;border-radius:18px;background:#f1fbf5;box-shadow:0 0 0 1.5px #cfe9dc;color:#1b3a2b}
.tgx .gxQ.warn{background:#fff8ec;box-shadow:0 0 0 1.5px #f3dcae;color:#5c3d08}
.tgx .gxQ>.ic{width:20px;height:20px;flex:none;margin-top:1px}
.tgx .gxQ p{margin:0 0 9px;font:600 13px/1.45 'DM Sans'}
.tgx .gxQBtns{display:flex;gap:8px;flex-wrap:wrap}
.tgx .gxQBtns a,.tgx .gxQBtns button{border:0;text-decoration:none;background:#fff;color:#0d5a43;font:800 12.5px 'Manrope';padding:9px 14px;border-radius:12px;box-shadow:0 0 0 1.5px #cfe9dc}
.tgx .gxDots{display:inline-flex;gap:5px;align-items:center;height:22px}
.tgx .gxDots i{width:7px;height:7px;border-radius:50%;background:currentColor;opacity:.35;animation:gxDot 1s infinite}
.tgx .gxDots i:nth-child(2){animation-delay:.15s}.tgx .gxDots i:nth-child(3){animation-delay:.3s}
@keyframes gxDot{50%{opacity:1;transform:translateY(-3px)}}
.tgx .sumRow.gxAddrRow{align-items:flex-start;gap:14px}
.tgx .sumRow.gxAddrRow b{text-align:right;font-weight:700;font-size:12.5px;line-height:1.4;max-width:62%}

.tgx .orderVideoFallback .gxFinishSub{margin:12px auto 0;max-width:300px;color:#173e27;font:700 16px/1.4 'Manrope',sans-serif}
.tgx .orderVideoFallback{padding-bottom:170px}