@charset "UTF-8";
/* youtogame — shared front/member styles */
:root{
  --orange:#FF5A1F;--orange-dark:#E8420C;--orange-soft:#FFF3EC;--orange-tint:#FFE9DC;
  --ink:#1A1410;--ink-2:#52473F;--ink-3:#8A7E74;--line:#EFE7E0;--cream:#FBF7F3;--white:#FFFFFF;
  --green:#16A34A;--red:#DC2626;
  --shadow-sm:0 2px 8px rgba(232,66,12,.06);--shadow:0 12px 40px rgba(70,40,20,.10);--shadow-lg:0 24px 70px rgba(70,40,20,.16);--r:18px;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:"Noto Sans SC","Sora",sans-serif;color:var(--ink);background:var(--white);line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
.num{font-family:"Sora",sans-serif;font-feature-settings:"tnum"}
a{text-decoration:none;color:inherit}
img{max-width:100%}
.wrap{max-width:1240px;margin:0 auto;padding:0 28px}
.wm{font-family:"Sora";font-weight:800;letter-spacing:-.6px;font-size:21px}.wm .o{color:var(--orange)}
.muted{color:var(--ink-3)}.cgreen{color:var(--green)}.cor{color:var(--orange)}
.bg-cream{background:var(--cream)}

/* topbar */
.topbar{background:linear-gradient(90deg,#2A1C12,#3A2415);color:#FFE3D2;font-size:13px;padding:9px 0}
.topbar .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px}
.dot{width:7px;height:7px;border-radius:50%;background:var(--orange);box-shadow:0 0 0 4px rgba(255,90,31,.25);flex:none}
.topbar .marq{display:flex;align-items:center;gap:10px;color:#FFD2B8;overflow:hidden}
.topbar .links{display:flex;gap:22px;color:#C9B8AC}.topbar .links a:hover{color:#fff}

/* header */
header.site{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.88);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.nav{display:flex;align-items:center;gap:38px;height:74px}
.logo{display:flex;align-items:center;gap:11px;font-size:22px}.logo svg{width:38px;height:38px;flex:none}
.menu{display:flex;gap:30px;font-weight:500;font-size:15.5px}
.menu a{position:relative;padding:6px 0;color:var(--ink-2);transition:.2s;white-space:nowrap}
.menu a:hover,.menu a.active{color:var(--orange)}
.menu a.active::after{content:"";position:absolute;left:0;right:0;bottom:-2px;height:3px;border-radius:3px;background:var(--orange)}
.nav-right{margin-left:auto;display:flex;align-items:center;gap:14px}
/* 非中文导航:标签更长 → 收紧间距+缩小字号(中文导航不受影响) */
.nav-intl{gap:22px}
.nav-intl .menu{gap:18px;font-size:14px}
.nav-intl .nav-right{gap:10px}
.nav-intl .nav-right .btn{padding:9px 15px;font-size:13.5px}
.av{width:38px;height:38px;border-radius:50%;background:linear-gradient(135deg,var(--orange),#FF8A4C);display:grid;place-items:center;color:#fff;font-weight:800;font-family:"Sora"}

/* buttons */
.btn{display:inline-flex;align-items:center;gap:8px;font-weight:600;font-size:15px;padding:11px 22px;border-radius:12px;cursor:pointer;transition:.22s;border:none;font-family:inherit;text-align:center;justify-content:center}
.btn-ghost{color:var(--ink-2);background:transparent}.btn-ghost:hover{background:var(--orange-soft);color:var(--orange)}
.btn-primary{background:var(--orange);color:#fff;box-shadow:0 8px 20px rgba(255,90,31,.32)}
.btn-primary:hover{background:var(--orange-dark);transform:translateY(-1px)}
.btn-line{background:var(--cream);color:var(--ink-2);border:1px solid var(--line)}.btn-line:hover{border-color:var(--orange-tint);color:var(--orange)}
.btn-block{width:100%}
.btn-sm{padding:8px 15px;font-size:13.5px;border-radius:10px}

/* forms */
.input{width:100%;border:1.5px solid var(--line);border-radius:13px;padding:13px 16px;font-size:15px;font-family:inherit;outline:none;transition:.18s;background:var(--cream)}
.input:focus{border-color:var(--orange);background:#fff;box-shadow:0 0 0 4px rgba(255,90,31,.1)}
.input::placeholder{color:var(--ink-3)}
label.fl{font-size:13.5px;font-weight:700;display:block;margin-bottom:8px}
select.input{appearance:none}

/* flash / alert */
.alert{padding:13px 16px;border-radius:12px;font-size:14px;margin-bottom:16px;font-weight:500}
.alert-ok{background:#EAF8EF;color:#0f7a37;border:1px solid #CDEBD7}
.alert-err{background:#FCEBEB;color:#b51d1d;border:1px solid #F3CFCF}

/* hero */
.hero{position:relative;padding:62px 0 50px;overflow:hidden}
.hero::before{content:"";position:absolute;top:-180px;right:-160px;width:620px;height:620px;border-radius:50%;background:radial-gradient(circle at 50% 50%,rgba(255,138,76,.22),transparent 62%);pointer-events:none}
.hero .wrap{display:grid;grid-template-columns:1.05fr .95fr;gap:54px;align-items:center;position:relative;z-index:2}
.tag{display:inline-flex;align-items:center;gap:9px;background:var(--orange-soft);color:var(--orange-dark);font-weight:700;font-size:13.5px;padding:8px 15px;border-radius:30px;border:1px solid var(--orange-tint)}
h1.hero-h{font-size:50px;line-height:1.1;font-weight:900;letter-spacing:-1.2px;margin:20px 0 18px}
h1.hero-h .hl{color:var(--orange);position:relative;white-space:nowrap}
h1.hero-h .hl::after{content:"";position:absolute;left:-2px;right:-2px;bottom:6px;height:14px;background:var(--orange-tint);z-index:-1;border-radius:4px}
.lead{font-size:18px;color:var(--ink-2);max-width:490px;margin-bottom:24px}
.searchbar{background:#fff;border:1px solid var(--line);border-radius:16px;padding:9px 9px 9px 20px;display:flex;align-items:center;gap:12px;box-shadow:var(--shadow);max-width:520px}
.searchbar svg{width:20px;height:20px;color:var(--ink-3);flex:none}
.searchbar input{border:none;outline:none;flex:1;min-width:0;font-size:16px;font-family:inherit;background:transparent}
.searchbar>.btn,.searchbar button{flex:none;white-space:nowrap}
.pay-strip{display:flex;align-items:center;gap:12px;margin-top:20px;flex-wrap:wrap}
.pay-strip .lbl{font-size:13.5px;color:var(--ink-3);font-weight:600}
.pay-pill{display:inline-flex;align-items:center;gap:7px;background:#fff;border:1px solid var(--line);border-radius:30px;padding:6px 13px 6px 7px;font-size:13px;font-weight:700;box-shadow:var(--shadow-sm)}
.pay-pill .c{width:22px;height:22px;border-radius:50%;display:grid;place-items:center;color:#fff;font-size:12px;font-family:"Sora"}
.pay-pill.hot{border-color:var(--orange-tint);background:var(--orange-soft);color:var(--orange-dark)}
.hero-card{background:#fff;border:1px solid var(--line);border-radius:24px;box-shadow:var(--shadow-lg);padding:24px}
.hc-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
.hc-head .t{font-weight:800;font-size:16px}
.hc-live{display:flex;align-items:center;gap:7px;font-size:12.5px;color:var(--green);font-weight:700;background:#EAF8EF;padding:5px 11px;border-radius:20px}
.order-row{display:flex;align-items:center;gap:13px;padding:12px 0;border-bottom:1px dashed var(--line)}
.order-row:last-child{border-bottom:none}
.order-row .ic{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;font-size:20px;flex:none;background:var(--orange-soft)}
.order-row .info{flex:1;min-width:0}.order-row .info .nm{font-weight:600;font-size:14.5px}
.order-row .info .sub{font-size:12.5px;color:var(--ink-3)}
.order-row .price{font-family:"Sora";font-weight:700;color:var(--orange);font-size:15px;text-align:right}
.order-row .ok{font-size:11.5px;color:var(--green);font-weight:700;text-align:right}

/* crypto band */
.crypto{margin:18px 0 8px;background:linear-gradient(120deg,#16110B,#2A1C10 55%,#3A2412);border-radius:28px;padding:46px 48px;position:relative;overflow:hidden}
.crypto::before{content:"";position:absolute;top:-120px;right:8%;width:380px;height:380px;border-radius:50%;background:radial-gradient(circle,rgba(255,90,31,.32),transparent 64%)}
.crypto .wrap2{position:relative;z-index:2;display:grid;grid-template-columns:1.1fr 1fr;gap:44px;align-items:center}
.crypto .kk{display:inline-flex;align-items:center;gap:8px;color:#FFB489;font-weight:700;font-size:13px;letter-spacing:1px;text-transform:uppercase}
.crypto h2{color:#fff;font-size:32px;font-weight:900;letter-spacing:-.8px;margin:12px 0}
.crypto h2 b{color:#FF8A4C}.crypto p{color:#CDBBAD;font-size:15px;max-width:440px}
.crypto .feats{display:flex;gap:14px;margin-top:22px;flex-wrap:wrap}
.crypto .feat{display:flex;align-items:center;gap:8px;color:#EADFD5;font-size:14px;font-weight:600}
.coins{display:grid;gap:13px}
.coin-card{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);border-radius:16px;padding:15px 18px;display:flex;align-items:center;gap:14px}
.coin-card .cc{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;font-family:"Sora";font-weight:800;font-size:21px;color:#fff;flex:none}
.coin-card .cx{flex:1}.coin-card .cx .nm{color:#fff;font-weight:700;font-size:15px}.coin-card .cx .sub{color:#A99B8E;font-size:12.5px}
.coin-card .arrive{font-size:11.5px;color:#22C55E;font-weight:700;background:rgba(34,197,94,.14);padding:4px 10px;border-radius:20px}

/* category strip */
.cats{padding:40px 0 8px}
.cat-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:16px}
.cat{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:24px 16px;text-align:center;transition:.25s;cursor:pointer}
.cat:hover{border-color:var(--orange-tint);box-shadow:var(--shadow);transform:translateY(-4px)}
.cat .ci{width:54px;height:54px;border-radius:15px;margin:0 auto 12px;display:grid;place-items:center;font-size:27px;background:var(--orange-soft)}
.cat .cn{font-weight:700;font-size:15px}.cat .cd{font-size:12px;color:var(--ink-3);margin-top:3px}

/* section heads */
.shead{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:26px}
.shead .l .k{color:var(--orange);font-weight:700;font-size:13.5px;letter-spacing:1px;text-transform:uppercase}
.shead .l h2{font-size:30px;font-weight:900;letter-spacing:-.8px;margin-top:4px}
.shead .more{color:var(--ink-2);font-weight:600;font-size:14.5px}.shead .more:hover{color:var(--orange)}

/* stats */
.stats{margin:54px 0;background:linear-gradient(120deg,#221710,#3a2516);border-radius:26px;padding:46px 40px;position:relative;overflow:hidden}
.stats::before{content:"";position:absolute;top:-100px;right:-60px;width:380px;height:380px;border-radius:50%;background:radial-gradient(circle,rgba(255,90,31,.28),transparent 65%)}
.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:30px;position:relative;z-index:2}
.stat{text-align:center;color:#fff}
.stat .v{font-family:"Sora";font-weight:800;font-size:40px;color:#FF8A4C;line-height:1;letter-spacing:-1px}.stat .v span{font-size:22px}
.stat .l{color:#C9B5A8;font-size:14.5px;margin-top:9px}

/* product grid */
.prod-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.card{background:#fff;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;transition:.28s;cursor:pointer;position:relative;display:block}
.card:hover{box-shadow:var(--shadow-lg);transform:translateY(-6px);border-color:transparent}
.card .top{height:140px;display:grid;place-items:center;position:relative;overflow:hidden;background:linear-gradient(135deg,#FFE3D2,#FFD0B5)}
.card .top .emoji{font-size:54px;position:relative;z-index:2;filter:drop-shadow(0 6px 10px rgba(0,0,0,.12))}
.badge-corner{position:absolute;top:12px;left:12px;z-index:3;background:var(--orange);color:#fff;font-size:11.5px;font-weight:700;padding:4px 10px;border-radius:20px;box-shadow:0 4px 10px rgba(255,90,31,.4)}
.card .body{padding:16px 17px 18px}
.card .body .nm{font-weight:700;font-size:16px}
.card .body .meta{display:flex;align-items:center;gap:8px;margin:7px 0 12px;flex-wrap:wrap}
.chip{font-size:11.5px;color:var(--ink-2);background:var(--cream);border:1px solid var(--line);padding:3px 9px;border-radius:6px;font-weight:500}
.chip.auto{color:var(--green);background:#EAF8EF;border-color:#CDEBD7}
.chip.crypto{color:var(--orange-dark);background:var(--orange-soft);border-color:var(--orange-tint)}
.card .body .pr{display:flex;align-items:baseline;justify-content:space-between}
.card .body .pr .p{font-family:"Sora";font-weight:800;color:var(--orange);font-size:22px}.card .body .pr .p small{font-size:13px;font-weight:600}
.card .body .pr .o{font-size:12.5px;color:var(--ink-3);text-decoration:line-through}
.card .body .buy{margin-top:13px;width:100%;justify-content:center;background:var(--orange-soft);color:var(--orange-dark);font-weight:700;border-radius:12px;padding:10px}
.card:hover .buy{background:var(--orange);color:#fff}

/* generic panel/card */
.panel{background:#fff;border:1px solid var(--line);border-radius:20px;overflow:hidden}
.panel .ph{display:flex;align-items:center;justify-content:space-between;padding:18px 24px;border-bottom:1px solid var(--line)}
.panel .ph h3{font-size:17px;font-weight:800}
.panel-pad{padding:24px}

/* breadcrumb */
.crumb{padding:22px 0;font-size:13.5px;color:var(--ink-3)}.crumb a:hover{color:var(--orange)}.crumb span{color:var(--ink)}

/* how / trust grids */
.how-grid,.trust-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:10px}
.step,.tcard{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:26px 22px;position:relative}
.step .no{font-family:"Sora";font-weight:800;font-size:44px;color:var(--orange-tint);position:absolute;top:16px;right:18px}
.step .si,.tcard .ti{width:50px;height:50px;border-radius:14px;background:var(--orange-soft);display:grid;place-items:center;color:var(--orange);margin-bottom:14px;font-size:22px}
.step h3,.tcard h3{font-size:17px;font-weight:800;margin-bottom:6px}.step p,.tcard p{font-size:13.5px;color:var(--ink-2)}
.how{padding:54px 0;background:var(--cream);border-radius:30px;margin:54px 0}

/* footer */
footer.site{background:#1A120C;color:#C9B8AC;padding:54px 0 28px;margin-top:40px}
.foot-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:40px;padding-bottom:36px;border-bottom:1px solid rgba(255,255,255,.08)}
.foot-brand .logo{color:#fff;margin-bottom:14px}.foot-brand p{font-size:13.5px;line-height:1.8;max-width:300px}
.pay-methods{display:flex;gap:10px;margin-top:18px;flex-wrap:wrap}
.pay-methods span{padding:7px 12px;background:rgba(255,255,255,.06);border-radius:8px;font-size:12.5px;font-weight:600;color:#E6D6C9}
.fcol h4{color:#fff;font-size:15px;font-weight:700;margin-bottom:16px}
.fcol a{display:block;font-size:13.5px;margin-bottom:11px;color:#A99B8E}.fcol a:hover{color:var(--orange)}
.foot-bottom{padding-top:22px;display:flex;justify-content:space-between;align-items:center;font-size:12.5px;color:#7E7065;flex-wrap:wrap;gap:10px}
.foot-bottom .safe{display:flex;gap:18px}.foot-bottom .safe span{display:flex;align-items:center;gap:6px}

/* badges/status */
.st{font-size:12px;font-weight:700;padding:4px 11px;border-radius:20px;display:inline-flex;align-items:center;gap:5px;white-space:nowrap}
.st-ok{background:#EAF8EF;color:var(--green)}.st-ing{background:var(--orange-soft);color:var(--orange-dark)}
.st-fail{background:#FCEBEB;color:var(--red)}.st-pending{background:#F1EEEA;color:var(--ink-2)}

/* tables */
.tbl{width:100%;border-collapse:collapse}
.tbl th{text-align:left;font-size:12px;color:var(--ink-3);font-weight:700;padding:12px 24px;background:var(--cream);text-transform:uppercase;letter-spacing:.4px}
.tbl td{padding:14px 24px;border-bottom:1px solid var(--line);font-size:14px;vertical-align:middle}
.tbl tr:last-child td{border-bottom:none}
.opd{display:flex;align-items:center;gap:11px}
.opd .em{width:38px;height:38px;border-radius:10px;background:var(--orange-soft);display:grid;place-items:center;font-size:18px;flex:none}
.amt{font-family:"Sora";font-weight:700}
.paytag{font-size:11px;font-weight:700;padding:2px 8px;border-radius:6px}
.pt-usdt{background:#E7F5F0;color:#0E8A66}.pt-btc{background:#FFF1DF;color:#C97A12}.pt-wx{background:#E9F8E9;color:#188C16}.pt-eth{background:#EBEEFC;color:#3D54C9}.pt-alipay{background:#E8F1FE;color:#1568D6}.pt-balance{background:var(--orange-soft);color:var(--orange-dark)}

/* member shell */
.shell{display:grid;grid-template-columns:248px 1fr;gap:26px;padding:28px 0 60px}
.side{background:#fff;border:1px solid var(--line);border-radius:20px;padding:10px;height:fit-content;position:sticky;top:92px}
.side .uc{padding:18px 14px;text-align:center;border-bottom:1px solid var(--line);margin-bottom:8px}
.side .uc .bigav{width:64px;height:64px;border-radius:50%;background:linear-gradient(135deg,var(--orange),#FF8A4C);display:grid;place-items:center;color:#fff;font-weight:800;font-size:26px;font-family:"Sora";margin:0 auto 10px;position:relative}
.side .uc .bigav .vipdot{position:absolute;bottom:-2px;right:-8px;background:linear-gradient(135deg,#F2B65A,#E8A33D);color:#5A3A0A;font-size:10px;font-weight:800;padding:2px 7px;border-radius:20px;border:2px solid #fff}
.side .uc .un{font-weight:800;font-size:16px}.side .uc .uid{font-size:12px;color:var(--ink-3);font-family:"Sora"}
.side nav a{display:flex;align-items:center;gap:12px;padding:11px 14px;border-radius:12px;font-size:14.5px;color:var(--ink-2);font-weight:500;transition:.16s;margin-bottom:2px}
.side nav a:hover{background:var(--orange-soft);color:var(--orange-dark)}
.side nav a.on{background:var(--orange);color:#fff;font-weight:700}
.side nav a .badge{margin-left:auto;font-size:11px;background:var(--orange-soft);color:var(--orange-dark);font-weight:700;padding:1px 8px;border-radius:20px}
.side nav a.on .badge{background:rgba(255,255,255,.25);color:#fff}
.side .hr{height:1px;background:var(--line);margin:8px 12px}
.main{display:flex;flex-direction:column;gap:22px}
.vip{background:linear-gradient(120deg,#1E1409,#3A2516 60%,#4A2D16);border-radius:24px;padding:30px 34px;position:relative;overflow:hidden;color:#fff}
.vip::before{content:"";position:absolute;top:-90px;right:40px;width:300px;height:300px;border-radius:50%;background:radial-gradient(circle,rgba(255,90,31,.34),transparent 64%)}
.vip .top{display:flex;align-items:center;gap:16px;position:relative;z-index:2}
.vip .crown{width:58px;height:58px;border-radius:16px;background:linear-gradient(135deg,#F2B65A,#E8A33D);display:grid;place-items:center;font-size:28px}
.vip .lv .lvl{font-size:22px;font-weight:900}.vip .lv .lvl .tier{color:#F2C078}.vip .lv .sub{font-size:13px;color:#C9B5A8}
.vip .top .right{margin-left:auto;text-align:right}.vip .top .right .since{font-size:12px;color:#B8A595}.vip .top .right .pts{font-family:"Sora";font-weight:800;font-size:24px;color:#FF8A4C}
.growth{margin-top:20px;position:relative;z-index:2}
.growth .gl{display:flex;justify-content:space-between;font-size:12.5px;color:#CDBBAD;margin-bottom:8px}.growth .gl b{color:#F2C078;font-family:"Sora"}
.bar{height:9px;border-radius:10px;background:rgba(255,255,255,.12);overflow:hidden}.bar i{display:block;height:100%;border-radius:10px;background:linear-gradient(90deg,#FF8A4C,#F2B65A)}
.wallets{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.wcard{background:#fff;border:1px solid var(--line);border-radius:18px;padding:20px;transition:.22s}.wcard:hover{box-shadow:var(--shadow);border-color:var(--orange-tint)}
.wcard .wi{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;font-size:20px;margin-bottom:13px;background:var(--orange-soft)}
.wcard .wl{font-size:13px;color:var(--ink-3)}.wcard .wv{font-family:"Sora";font-weight:800;font-size:24px;margin-top:2px}.wcard .wv small{font-size:14px;color:var(--ink-3)}
.wcard .wact{margin-top:12px;font-size:12.5px;font-weight:700;color:var(--orange);display:inline-block}
.cols{display:grid;grid-template-columns:1.55fr 1fr;gap:22px;align-items:start}

/* auth pages */
.auth-wrap{min-height:calc(100vh - 74px);display:grid;place-items:center;padding:40px 20px;background:var(--cream)}
.auth-card{background:#fff;border:1px solid var(--line);border-radius:24px;box-shadow:var(--shadow);width:100%;max-width:420px;padding:38px 36px}
.auth-card .lg{display:flex;align-items:center;gap:10px;justify-content:center;margin-bottom:8px}
.auth-card .lg svg{width:40px;height:40px}
.auth-card h2{font-size:24px;font-weight:900;text-align:center;margin-bottom:4px}
.auth-card .sub{text-align:center;color:var(--ink-3);font-size:14px;margin-bottom:24px}
.auth-card .field{margin-bottom:16px}
.auth-card .foot{text-align:center;font-size:13.5px;color:var(--ink-3);margin-top:18px}
.auth-card .foot a{color:var(--orange);font-weight:700}

@media(max-width:1080px){
  .nav-intl{gap:14px}.nav-intl .menu{gap:12px;font-size:13px}.nav-intl .nav-right .btn{padding:8px 12px;font-size:13px}
  .hero .wrap{grid-template-columns:1fr}.hero-card{max-width:480px;margin:10px auto 0}
  .crypto .wrap2{grid-template-columns:1fr;gap:28px}
  .cat-grid{grid-template-columns:repeat(3,1fr)}.prod-grid,.trust-grid,.how-grid,.stats-grid,.wallets{grid-template-columns:repeat(2,1fr)}
  .shell{grid-template-columns:1fr}.side{position:static}.cols{grid-template-columns:1fr}
}
@media(max-width:680px){
  .menu,.topbar .links{display:none}h1.hero-h{font-size:36px}.crypto{padding:30px 24px}.crypto h2{font-size:25px}
  .cat-grid,.prod-grid,.trust-grid,.how-grid,.stats-grid,.wallets{grid-template-columns:1fr}
  .foot-grid{grid-template-columns:1fr 1fr}
}

/* ===================== §3.194 手机版导航框架 ===================== */
/* 汉堡按钮(仅手机显示) */
.nav-burger{display:none;flex-direction:column;justify-content:center;align-items:center;gap:4.5px;width:40px;height:40px;padding:0;border:1px solid var(--line);border-radius:11px;background:#fff;cursor:pointer}
.nav-burger span{display:block;width:18px;height:2px;background:var(--ink);border-radius:2px;transition:.25s}
.nav-burger[aria-expanded="true"] span:nth-child(1){transform:translateY(6.5px) rotate(45deg)}
.nav-burger[aria-expanded="true"] span:nth-child(2){opacity:0}
.nav-burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-6.5px) rotate(-45deg)}

/* 侧滑抽屉(默认隐藏,手机端汉堡/Tab 唤起) */
.mdrawer{position:fixed;inset:0;z-index:200}
.mdrawer[hidden]{display:none}
.mdrawer-mask{position:absolute;inset:0;background:rgba(20,12,8,.46);opacity:0;transition:opacity .28s}
.mdrawer.open .mdrawer-mask{opacity:1}
.mdrawer-panel{position:absolute;top:0;left:0;bottom:0;width:82%;max-width:330px;background:#fff;box-shadow:0 0 60px rgba(40,25,12,.32);transform:translateX(-100%);transition:transform .3s cubic-bezier(.22,1,.36,1);display:flex;flex-direction:column;overflow-y:auto}
.mdrawer.open .mdrawer-panel{transform:none}
.mdrawer-hd{display:flex;align-items:center;justify-content:space-between;padding:18px 18px 14px;border-bottom:1px solid var(--line)}
.mdrawer-hd .logo{font-size:18px;gap:9px}
.mdrawer-x{width:34px;height:34px;border:0;background:var(--cream);border-radius:50%;font-size:15px;color:var(--ink-2);cursor:pointer;flex:none}
.mdrawer-nav{padding:4px 0;flex:1 0 auto}
.mdrawer-nav a{display:flex;align-items:center;padding:14px 22px;font-size:15.5px;font-weight:500;color:var(--ink);border-bottom:1px solid var(--line)}
.mdrawer-nav a.active{color:var(--orange)}
.mdrawer-nav a::after{content:"\203A";margin-left:auto;color:var(--ink-3);font-size:18px;font-weight:400}
.mdrawer-foot{padding:16px 18px 26px;display:flex;flex-direction:column;gap:11px}
.mdrawer-order{display:inline-flex;align-items:center;gap:7px;justify-content:center;background:var(--orange-soft);color:var(--orange-dark);font-weight:700;padding:12px;border-radius:12px}
.mdrawer-loc{display:flex;gap:10px}
.mdrawer-loc select{flex:1;appearance:none;border:1px solid var(--line);background:var(--cream);color:var(--ink);font-size:13px;font-family:inherit;border-radius:10px;padding:10px 12px;cursor:pointer;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%238A7E74' stroke-width='1.5' fill='none'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 11px center}

/* 底部 Tab 栏(默认隐藏) */
.mtabbar{display:none;position:fixed;left:0;right:0;bottom:0;z-index:120;background:rgba(255,255,255,.97);backdrop-filter:blur(12px);border-top:1px solid var(--line);padding:7px 4px calc(7px + env(safe-area-inset-bottom,0px))}
.mtab{flex:1;display:flex;flex-direction:column;align-items:center;gap:3px;color:var(--ink-3);font-size:11px;font-weight:500;background:none;border:0;font-family:inherit;cursor:pointer;text-decoration:none}
.mtab .ic{width:23px;height:23px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.mtab.on{color:var(--orange)}

@media(max-width:680px){
  .nav{gap:12px;height:60px}
  .logo{font-size:18px}.logo svg{width:32px;height:32px}
  .nav-burger{display:flex}
  .nav-right{gap:10px}
  .nav-right .btn-ghost{display:none}
  .mtabbar{display:flex}
  body.has-tabbar{padding-bottom:62px}
  .prod-grid{grid-template-columns:repeat(2,1fr);gap:12px}
  .cat-grid{grid-template-columns:repeat(2,1fr);gap:10px}
}

/* ===================== §3.197 详情页手机端:吸底购买条 + 紧凑布局 ===================== */
/* 用高特异性 .gcdetail .order ... 压过各页内联的 .gcdetail ...(0-2-0) */
@media(max-width:680px){
  .gcdetail .main .order{padding:20px 16px}
  .gcdetail .main .pvisual{padding:16px}
  .gcdetail .main .pvisual .art{height:168px}
  /* 吸底购买条:复用表单内现成的 .checkout(合计 #*Total 实时更新 + 立即购买按钮 + 其 JS) */
  .gcdetail .order .checkout{
    position:fixed;left:0;right:0;bottom:0;z-index:130;margin:0;border-radius:0;
    padding:9px 14px calc(9px + env(safe-area-inset-bottom,0px));
    border-top:1px solid var(--line);background:rgba(255,255,255,.98);backdrop-filter:blur(10px);
    box-shadow:0 -6px 24px rgba(40,25,12,.13);
    display:flex;flex-direction:row;align-items:center;gap:13px;flex-wrap:nowrap
  }
  .gcdetail .order .checkout .total{flex:0 0 auto;text-align:left}
  .gcdetail .order .checkout .total .l{font-size:11px}
  .gcdetail .order .checkout .total .v{font-size:23px}
  .gcdetail .order .checkout .act{flex:1;min-width:0;display:flex;gap:8px}
  .gcdetail .order .checkout .btn-buy{flex:1;min-width:0;width:auto;white-space:nowrap;justify-content:center;padding:14px 16px;font-size:16px}
  .gcdetail{padding-bottom:84px}
}

/* ===================== §3.198 会员中心 / 经销商后台 手机版 ===================== */
@media(max-width:680px){
  .wrap:has(.shell){padding:0 14px}
  .shell{padding:14px 0 40px;gap:14px}
  .main{gap:14px}
  /* 侧栏 → 身份卡 + 功能宫格 */
  .side{background:none;border:0;border-radius:0;padding:0}
  .side .uc{display:flex;align-items:center;gap:13px;text-align:left;border:0;margin:0 0 14px;padding:18px;border-radius:18px;color:#fff;background:linear-gradient(125deg,#FF8A3D,#FF5A12 60%,#E0440A);position:relative;overflow:hidden}
  .side .uc::after{content:"";position:absolute;right:-40px;top:-50px;width:160px;height:160px;border-radius:50%;background:rgba(255,255,255,.10)}
  .side .uc .bigav{margin:0;width:54px;height:54px;flex:none;background:rgba(255,255,255,.22);border:2px solid rgba(255,255,255,.5);position:relative;z-index:1}
  .side .uc .uc-tx{flex:1;min-width:0;position:relative;z-index:1}
  .side .uc .un{color:#fff;font-size:18px}
  .side .uc .uid{color:rgba(255,255,255,.85)}
  .side .uc .bigav .vipdot{background:rgba(255,255,255,.92);color:var(--orange-dark)}
  .side-rs .uc{background:linear-gradient(125deg,#2A2018,#3A2A1C 55%,#241a12)}
  .side-rs .uc .bigav{border-radius:15px}
  .side nav{display:grid;grid-template-columns:repeat(4,1fr);gap:2px;background:#fff;border:1px solid var(--line);border-radius:16px;padding:8px 4px}
  .side nav a{flex-direction:column;align-items:center;gap:7px;margin:0;padding:11px 2px;font-size:12px;font-weight:500;color:var(--ink-2);position:relative;border-radius:14px}
  .side nav a span:first-child{width:46px;height:46px;border-radius:14px;background:var(--cream);display:grid;place-items:center;font-size:22px}
  .side nav a:hover{background:none}
  .side nav a.on{background:none;color:var(--orange);font-weight:700}
  .side nav a.on span:first-child{background:var(--orange-soft)}
  .side nav a .badge{position:absolute;top:5px;left:50%;transform:translateX(8px);margin:0;background:var(--red);color:#fff;font-size:10px;min-width:16px;height:16px;padding:0 4px;border-radius:99px;display:grid;place-items:center;font-family:'Sora'}
  .side nav a.on .badge{background:var(--red);color:#fff}
  .side .hr{display:none}
  /* VIP 成长卡 */
  .vip{padding:18px;border-radius:18px}
  .vip .top{gap:12px}.vip .crown{width:46px;height:46px;font-size:22px}
  .vip .lv .lvl{font-size:18px}.vip .top .right .pts{font-size:20px}
  /* 钱包卡(紧凑三列) */
  .wallets{grid-template-columns:repeat(3,1fr);gap:9px}
  .wcard{padding:13px 8px;text-align:center;border-radius:14px}
  .wcard .wi{display:none}
  .wcard .wl{font-size:11px}
  .wcard .wv{font-size:17px}
  .wcard .wact{display:none}
  /* 面板紧凑 */
  .panel .ph{padding:14px 16px}.panel .ph h3{font-size:15.5px}
  .panel-pad{padding:16px}
  /* 订单表 → 卡片行 */
  .main .tbl thead{display:none}
  .main .tbl,.main .tbl tbody{display:block}
  .main .tbl tr{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;padding:12px 16px;border-bottom:1px solid var(--line)}
  .main .tbl td{display:block;padding:0;border:0;font-size:12.5px}
  .main .tbl td:nth-child(1){flex:1 1 100%}
  .main .tbl td.amt{font-size:15px}
  .main .tbl td .opd .em{width:40px;height:40px}
  /* 双列 → 单列 */
  .cols{grid-template-columns:1fr}
}


/* §3.198b 会员子页补充(共享类) */
@media(max-width:680px){
  .grid2{grid-template-columns:1fr!important}
  .seg{overflow-x:auto;flex-wrap:nowrap;-webkit-overflow-scrolling:touch}
  .seg::-webkit-scrollbar{display:none}
  .seg>*{flex:0 0 auto;white-space:nowrap}
}

/* §3.200 经销商报表表格(店铺订单 / 对账)→ 手机端卡片 */
@media(max-width:680px){
  .mcard{min-width:0!important;display:block}
  .mcard thead{display:none}
  .mcard tbody{display:block}
  .mcard tr{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:14px;padding:11px 14px;margin-bottom:10px;border-top:1px solid var(--line)!important}
  .mcard td{display:flex;justify-content:space-between;gap:14px;align-items:baseline;padding:4px 0!important;border:0!important;font-size:13px;text-align:right}
  .mcard td::before{content:attr(data-l);color:var(--ink-3);font-size:11.5px;font-weight:600;flex:none;text-align:left}
  .mcard td.tit{order:-2;display:block;text-align:left;font-weight:700;font-size:14px;padding:0 0 8px 0!important;margin-bottom:6px;border-bottom:1px solid var(--line)!important}
  .mcard td.tit::before{display:none}
  .mcard td.meta{order:-1;display:block;text-align:left;padding:0 0 6px 0!important;font-size:11.5px}
  .mcard td.meta::before{display:none}
  .mcard td.acct{word-break:break-all!important}
  .mcard td.act{display:block;text-align:left;padding-top:8px!important;margin-top:6px;border-top:1px solid var(--line)!important}
  .mcard td.act::before{display:none}
  .mcard td[colspan]{display:block;text-align:center;padding:24px 0!important}
  .mcard td[colspan]::before{display:none}
}

/* §3.201 顶栏登录/注册按钮不换行 + 窄屏适配 */
.nav-right .btn{white-space:nowrap}
@media(max-width:680px){
  .nav{gap:9px}
  .nav-right .btn-primary{padding:8px 13px;font-size:13.5px}
  .nav .logo .wm{font-size:17px}
}

/* §3.202 选品定价表 → 手机端卡片(当前屏可看,无需横滑)*/
@media(max-width:680px){
  .rcard{min-width:0!important;display:block;width:100%}
  .rcard thead{display:none}
  .rcard tbody{display:block;padding:10px 12px}
  .rcard tr{display:block;border:1px solid var(--line);border-radius:14px;padding:8px 14px 10px;margin-bottom:10px;background:#fff;border-top:1px solid var(--line)!important}
  .rcard td{display:grid;grid-template-columns:62px minmax(0,1fr);align-items:center;gap:4px 10px;padding:7px 0!important;border:0!important;border-bottom:1px solid var(--cream)!important;font-size:13.5px;white-space:normal!important;overflow:hidden}
  .rcard td:last-child{border-bottom:0!important}
  .rcard td>*{min-width:0;max-width:100%;justify-self:start}
  .rcard td .btn,.rcard td .pmo,.rcard td a{white-space:normal;max-width:100%}
  .rcard td::before{color:var(--ink-3);font-size:12px;font-weight:600}
  .rcard td .input{max-width:100%}
  .rcard td[colspan]{display:block;text-align:center;padding:22px 0!important}
  .rcard td[colspan]::before{content:none!important}
  .rcard .rt-name{display:block!important;text-align:left;font-weight:700;font-size:14.5px;padding:0 0 8px 0!important;margin-bottom:4px;border-bottom:1px solid var(--line)!important}
  .rt-nat td:nth-child(2)::before{content:"上架"}
  .rt-nat td:nth-child(3)::before{content:"加价%"}
  .rt-nat td:nth-child(4)::before{content:"商品"}
  .rt-nat td:nth-child(5)::before{content:"推广"}
  .rt-game td:nth-child(1)::before{content:"上架"}
  .rt-game td:nth-child(2)::before{content:"⭐推荐"}
  .rt-game td:nth-child(4)::before{content:"进货价"}
  .rt-game td:nth-child(5)::before{content:"售价"}
  .rt-game td:nth-child(6)::before{content:"推广"}
  .rt-gc1 td:nth-child(1)::before{content:"上架"}
  .rt-gc1 td:nth-child(2)::before{content:"⭐推荐"}
  .rt-gc1 td:nth-child(4)::before{content:"覆盖"}
  .rt-gc1 td:nth-child(5)::before{content:"推广"}
  .rt-ks td:nth-child(1)::before{content:"上架"}
  .rt-ks td:nth-child(2)::before{content:"⭐推荐"}
  .rt-ks td:nth-child(4)::before{content:"售价"}
  .rt-ks td:nth-child(5)::before{content:"推广"}
}

/* §3.203 平板(≤1024)顶栏改用汉堡抽屉,避免桌面横排菜单溢出/登录按钮被截断 */
@media(max-width:1024px){
  .nav-burger{display:flex}
  .nav .menu{display:none}
  .nav-right .btn-ghost{display:none}
  .nav{gap:12px}
  body{overflow-x:hidden}
}

/* 行内订单商品小图 */
.oem{width:24px;height:24px;border-radius:6px;object-fit:cover;vertical-align:-6px;margin-right:6px;display:inline-block;background:var(--orange-soft)}
.opd .em img{border-radius:inherit}

/* PWA 安装引导条(底部浮卡,避让 .mtabbar) */
.ytg-pwa-bar{position:fixed;left:12px;right:12px;bottom:20px;z-index:125;max-width:440px;margin:0 auto;display:flex;align-items:center;gap:12px;padding:12px 12px 12px 14px;background:#231a13;color:#FFE3D2;border:1px solid rgba(255,255,255,.12);border-radius:16px;box-shadow:0 14px 44px rgba(0,0,0,.45);transform:translateY(160%);opacity:0;transition:transform .32s cubic-bezier(.22,1,.36,1),opacity .32s}
.ytg-pwa-bar.show{transform:translateY(0);opacity:1}
body.has-tabbar .ytg-pwa-bar{bottom:calc(62px + env(safe-area-inset-bottom,0px) + 12px)}
.ytg-pwa-ic{flex:0 0 auto;width:46px;height:46px;border-radius:12px;overflow:hidden;background:rgba(255,255,255,.08);display:flex;align-items:center;justify-content:center}
.ytg-pwa-ic img{width:100%;height:100%;object-fit:cover}
.ytg-pwa-tx{flex:1 1 auto;min-width:0}
.ytg-pwa-h{font-size:14px;font-weight:800;line-height:1.2}
.ytg-pwa-p{font-size:12px;opacity:.78;line-height:1.45;margin-top:3px}
.ytg-pwa-act{flex:0 0 auto}
.ytg-pwa-go{appearance:none;border:0;background:var(--orange,#FF5A1F);color:#fff;font-size:13.5px;font-weight:700;padding:9px 16px;border-radius:10px;cursor:pointer;font-family:inherit;white-space:nowrap}
.ytg-pwa-go:active{opacity:.85}
.ytg-pwa-x{appearance:none;border:0;background:transparent;color:#FFE3D2;opacity:.5;font-size:15px;line-height:1;cursor:pointer;padding:4px 6px;align-self:flex-start}
.ytg-pwa-x:hover{opacity:.9}

/* PWA iOS 安装引导:卡片 + 指向底部分享按钮的弹跳箭头 */
.ytg-ios-wrap{position:fixed;left:0;right:0;bottom:0;z-index:126;pointer-events:none;display:flex;flex-direction:column;align-items:center;opacity:0;transition:opacity .3s}
.ytg-ios-wrap.show{opacity:1}
.ytg-ios-card{pointer-events:auto;display:flex;align-items:center;gap:11px;max-width:330px;margin:0 14px;padding:12px 12px 12px 14px;background:#231a13;color:#FFE3D2;border:1px solid rgba(255,255,255,.12);border-radius:16px;box-shadow:0 14px 44px rgba(0,0,0,.45)}
.ytg-ios-share{flex:0 0 auto;width:30px;height:30px;color:var(--orange,#FF5A1F)}
.ytg-ios-share svg{width:100%;height:100%;display:block}
.ytg-ios-tx{flex:1 1 auto;font-size:12.5px;line-height:1.5;font-weight:600}
.ytg-ios-arrow{width:34px;height:34px;color:var(--orange,#FF5A1F);margin:6px 0 calc(6px + env(safe-area-inset-bottom,0px));animation:ytgBounce 1.15s ease-in-out infinite}
.ytg-ios-arrow svg{width:100%;height:100%;display:block;filter:drop-shadow(0 3px 8px rgba(0,0,0,.45))}
@keyframes ytgBounce{0%,100%{transform:translateY(0)}50%{transform:translateY(8px)}}

/* PWA 桌面常驻安装按钮:默认隐藏(JS 在可安装时显示);移动端由 .nav-right .btn-ghost 规则自动隐藏 */
.ytg-install-btn[hidden]{display:none!important}
.ytg-install-btn{align-items:center}