:root{font-family:"PingFang SC","Microsoft YaHei",sans-serif;color:#fff;background:#080808;font-synthesis:none}
*{box-sizing:border-box}body{margin:0;background:#080808;color:#fff;min-width:320px}button,a{font:inherit}button{border:0;cursor:pointer}a{color:inherit;text-decoration:none}
main{width:100%;max-width:760px;margin:0 auto;background:#080808;min-height:100vh;box-shadow:0 0 70px #000}
.site-header{height:68px;padding:12px 16px;display:flex;align-items:center;justify-content:space-between;background:linear-gradient(180deg,#1c1400,#100d00);border-bottom:1px solid rgba(212,175,55,.25);box-shadow:0 2px 20px rgba(212,175,55,.08);position:sticky;top:0;z-index:5}
.brand{display:flex;align-items:center;gap:12px}.brand-mark,.footer-mark{display:grid;place-items:center;font-weight:900;color:#0d0d0d;background:linear-gradient(135deg,#f5e070,#d4af37 50%,#8b6914);box-shadow:0 3px 12px #d4af3740}.brand-mark{width:40px;height:40px;border-radius:12px;font-size:14px}.brand-title,.brand-subtitle{font-size:15px;font-weight:700;letter-spacing:.04em;color:#fff}.brand-subtitle{margin-top:2px}.share-button{color:#1b1400;background:#d4af37;border-radius:999px;padding:8px 14px;font-size:12px;font-weight:700;transition:transform .15s}.share-button:active{transform:scale(.95)}
.brand-mark img,.footer-mark img{display:block;width:100%;height:100%;object-fit:cover;border-radius:inherit}
.countdown{position:relative;overflow:hidden;background:#17100a;border-bottom:1px solid #39260b}.countdown-glow{position:absolute;inset:0;background:radial-gradient(circle at 30% 20%,#c18a251c,transparent 50%)}.countdown-inner{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 24px;align-items:center;gap:10px;min-height:38px;padding:5px 12px;font-size:11px}.countdown-left,.countdown-right{display:flex;align-items:center;gap:7px;white-space:nowrap}.countdown-left{min-width:0}.countdown-left strong,.countdown-left b,.countdown-left em,.countdown-remaining,.timer span{background:linear-gradient(90deg,#ffbd49,#fff0a6,#ff8f32,#ffe08a);background-size:220% 100%;background-clip:text;-webkit-background-clip:text;color:transparent;animation:countdown-shine 3.2s linear infinite}.countdown-left strong{font-size:11px}.countdown-left b{font-size:14px}.countdown-left em{font-style:normal;font-weight:700;font-size:11px}.countdown-right{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);justify-content:center;gap:7px}.countdown-remaining{font-size:10px;font-weight:700}.timer{display:flex;align-items:center;gap:3px;font-variant-numeric:tabular-nums;font-weight:900;letter-spacing:0}.timer span{display:grid;place-items:center;min-width:28px;height:24px;padding:0 5px;border:1px solid #9c4f1e;border-radius:4px;background-color:#4c1d0c;font-size:13px;line-height:1}.timer i{font-style:normal;color:#ffb64a}.countdown-close{grid-column:2;grid-row:1;display:grid;place-items:center;width:20px;height:20px;padding:0;border-radius:50%;background:#392116;color:#b5825e;font-size:15px;line-height:1}.countdown-close:hover{background:#63331b;color:#ffe0a1}@keyframes countdown-shine{to{background-position:220% 0}}@keyframes badge-shake{0%,82%,100%{transform:translateX(0) rotate(0)}84%{transform:translateX(-1px) rotate(-3deg)}87%{transform:translateX(1px) rotate(3deg)}90%{transform:translateX(-1px) rotate(-2deg)}93%{transform:translateX(1px) rotate(2deg)}96%{transform:translateX(0) rotate(0)}}
.badge{font-size:9px;font-weight:900;background:linear-gradient(110deg,#9d4014,#c95b1f);color:#fff;padding:4px 6px;border-radius:3px;flex:none;animation:badge-shake 3s ease-in-out infinite;transform-origin:center}.badge{background-image:linear-gradient(110deg,#9d4014,#c95b1f),linear-gradient(90deg,#ffbd49,#fff0a6,#ff8f32);background-clip:padding-box,border-box}.countdown-left{color:#ffc864}
.hero-banner{display:block;background:#130e04;touch-action:pan-y;cursor:grab}.hero-banner.is-dragging{cursor:grabbing}.hero-banner img{display:block;width:100%;height:124px;object-fit:cover;border-radius:14px;user-select:none;-webkit-user-drag:none}
.announcement{height:36px;display:flex;align-items:center;gap:8px;overflow:hidden;border-bottom:1px solid #1d1d1d;background:#0d0d0d;padding:0 12px}.announcement-label{background:#d4af37;color:#0d0d0d;font-weight:900;font-size:9px;padding:3px 6px;border-radius:3px;flex:none}.announcement-viewport{flex:1;min-width:0;overflow:hidden;white-space:nowrap;color:#e4bd3f;font-size:11px}.announcement-track{display:inline-block;width:max-content;animation:marquee 28s linear infinite;will-change:transform}.announcement:hover .announcement-track{animation-play-state:paused}@keyframes marquee{from{transform:translateX(100%)}to{transform:translateX(-100%)}}
.tabs{display:grid;grid-template-columns:repeat(var(--category-columns,4),minmax(0,1fr));gap:8px;padding:10px 12px;border-bottom:1px solid #1a1a1a;background:#0d0d0d;overflow:auto}.tab{--tab-cutout:#151515;min-width:0;min-height:64px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;padding:8px;border:1px solid #242424;border-radius:12px;color:#817967;background:#151515;font-size:11px;font-weight:700;white-space:nowrap;transition:all .2s}.tab.active{--tab-cutout:#d4af37;color:#0d0d00;background:linear-gradient(135deg,#f5e070,#d4af37,#8b6914);border-color:#d4af37;box-shadow:0 5px 18px #d4af3730}.tab-icon{display:grid;place-items:center;width:20px;height:20px;font-size:16px}.tab-icon svg{display:block;width:18px;height:18px;fill:currentColor;stroke:none;flex:none}.tab-icon-cutout{fill:var(--tab-cutout)}.tab>span:last-child{line-height:1.15}
.content{padding:14px 12px 28px}.section-heading{position:relative;display:flex;align-items:center;justify-content:space-between;min-height:34px;margin:0 0 12px;padding:0 12px;border:1px solid #282828;border-radius:12px;background:#111;color:#9b968c}.section-heading.is-hidden{display:none}.section-trust{display:flex;align-items:center;gap:7px;font-size:11px}.section-trust-dot{width:7px;height:7px;border-radius:50%;background:#31bd59;box-shadow:0 0 8px #31bd5966}.section-heading strong{font-size:11px;color:#f1c52d;font-weight:800}.section-heading h1{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}.platform-grid{display:grid;grid-template-columns:repeat(var(--category-columns,4),minmax(0,1fr));gap:10px}.card{display:flex;flex-direction:column;overflow:hidden;border-radius:14px;background:linear-gradient(180deg,#1a1a1a,#101010);border:1px solid #242424;transition:transform .2s,border-color .2s;animation:cardin .35s ease both}.card:hover{transform:translateY(-2px);border-color:#6d5721}.card:active{transform:scale(.97)}.card-main{padding:10px 10px 8px;position:relative}.card-icon{width:100%;aspect-ratio:1;border-radius:10px;object-fit:cover;background:#222;display:block;margin-bottom:8px}.card-fallback{display:grid;place-items:center;color:#8d7851;font-size:26px;font-weight:900}.card-name{font-size:12px;font-weight:800;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.online{display:flex;justify-content:center;align-items:center;gap:5px;color:#7d766a;font-size:10px;margin-top:4px}.dot{width:6px;height:6px;border-radius:50%;background:#52d36f;box-shadow:0 0 8px #52d36f;animation:online 1.8s ease-in-out infinite}.card-link{display:block;width:100%;padding:8px;text-align:center;color:#100d00;background:linear-gradient(90deg,#c9a228,#e8c84a,#c9a228);background-size:200% auto;font-size:11px;font-weight:900}.card-link:hover{animation:shimmer 1s linear infinite}@keyframes shimmer{to{background-position:200% center}}@keyframes cardin{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}@keyframes online{50%{opacity:.5;transform:scale(1.35)}}
footer{text-align:center;padding:0 20px 28px;color:#393939;font-size:10px}footer p{margin:7px 0}.footer-brand{display:flex;align-items:center;justify-content:center;gap:8px;margin-bottom:12px;color:#d4af37;font-weight:700;font-size:13px}.footer-mark{width:28px;height:28px;border-radius:8px;font-size:10px}
.chat-button{position:fixed;right:max(16px,calc((100vw - 760px)/2 + 16px));bottom:24px;width:52px;height:52px;display:grid;place-items:center;z-index:8}.headset{position:relative;width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:#d4af37;color:#0d0d0d;font-size:20px;box-shadow:0 5px 20px #d4af3766}.headset svg{display:block;width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.chat-button small{position:absolute;top:56px;white-space:nowrap;background:#201809;color:#e7c75b;border-radius:999px;padding:3px 8px;font-size:10px;font-weight:700}.pulse{position:absolute;inset:0;border-radius:50%;background:#d4af3740;animation:pulse 2.2s ease-out infinite}.pulse.delay{animation-delay:.7s}@keyframes pulse{70%{transform:scale(1.7);opacity:0}to{opacity:0}}
.toast{position:fixed;left:50%;bottom:84px;transform:translate(-50%,10px);padding:9px 16px;border-radius:999px;background:#d4af37;color:#100d00;font-size:12px;font-weight:800;opacity:0;pointer-events:none;transition:.25s;z-index:10}.toast.show{opacity:1;transform:translate(-50%,0)}
.share-modal[hidden]{display:none}.share-modal{position:fixed;inset:0;z-index:50;display:grid;place-items:center;padding:20px}.share-backdrop{position:absolute;inset:0;width:100%;height:100%;background:rgba(0,0,0,.76);backdrop-filter:blur(5px)}.share-dialog{position:relative;width:min(360px,100%);padding:28px 24px 22px;border:1px solid rgba(212,175,55,.3);border-radius:18px;background:linear-gradient(150deg,#1d170d,#100f0d 70%);box-shadow:0 24px 80px rgba(0,0,0,.7),0 0 34px rgba(212,175,55,.1);text-align:center}.share-close{position:absolute;top:12px;right:12px;width:30px;height:30px;border:1px solid #40341e;border-radius:50%;background:#211a0e;color:#d7c28d;font-size:19px;line-height:1}.share-kicker{color:#c9a84e;font-size:9px;font-weight:800;letter-spacing:.16em}.share-dialog h2{margin:7px 0 4px;color:#fff;font-size:20px}.share-dialog p{margin:0 0 17px;color:#a69a7e;font-size:12px}.share-qr-frame{display:grid;place-items:center;width:232px;height:232px;margin:0 auto 16px;border:1px solid #534324;border-radius:13px;background:#fff;box-shadow:0 8px 25px #0005}.share-qr-frame canvas,.share-qr-frame img{display:block;width:208px!important;height:208px!important;image-rendering:pixelated}.share-copy{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;min-height:44px;border-radius:10px;background:linear-gradient(110deg,#d8b744,#f1d66c);color:#1b1400;font-size:13px;font-weight:900}.share-copy svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.share-url{display:block;max-width:100%;margin:10px auto 0;overflow:hidden;color:#867957;font-size:10px;text-overflow:ellipsis;white-space:nowrap}.share-open{overflow:hidden}
@media(max-width:520px){.hero-banner img{height:105px}.platform-grid{gap:8px}.countdown-inner{grid-template-columns:minmax(0,1fr) 20px;grid-template-rows:24px 20px;gap:2px 5px;padding:4px 8px 5px}.countdown-left{grid-column:1;grid-row:2;gap:5px}.countdown-left strong{display:none}.countdown-right{position:static;grid-column:1 / -1;grid-row:1;transform:none;justify-self:center;gap:4px}.countdown-remaining{font-size:9px}.timer{gap:2px}.timer span{min-width:23px;height:22px;padding-inline:3px;font-size:12px}.countdown-close{grid-column:2;grid-row:2;width:18px;height:18px}.tab{min-width:0;min-height:58px;padding-inline:4px;font-size:10px}}

/* Keep category navigation available while browsing long card lists. */
.tabs{position:relative;z-index:1}

/* At the end of the page, keep the key header controls visible and simplify the category bar. */
body.bottom-docked{--bottom-countdown-height:38px;--bottom-header-height:68px}
body.bottom-docked .countdown{position:fixed;inset:0 0 auto;z-index:60}
body.bottom-docked .site-header{position:fixed;top:var(--bottom-countdown-height);left:0;right:0;z-index:59}
body.bottom-docked .tabs{position:fixed;top:calc(var(--bottom-countdown-height) + var(--bottom-header-height));left:0;right:0;z-index:58;gap:8px;padding:4px 12px;border-top:1px solid rgba(212,175,55,.2);box-shadow:0 8px 18px rgba(0,0,0,.38)}
body.bottom-docked .tab{min-height:34px;padding:6px 8px;gap:0}
body.bottom-docked .tab-icon{display:none}
@media(max-width:520px){body.bottom-docked{--bottom-header-height:60px}body.bottom-docked .tabs{padding-inline:7px;gap:5px}body.bottom-docked .tab{min-height:32px;padding-inline:5px;font-size:10px}}
@media(min-width:760px){body{background:#020202}.hero-banner img{height:150px}}

/* Responsive layout across desktop, tablet and compact phones. */
@media(min-width:761px){
  main{max-width:1180px}
  .site-header{height:76px;padding-inline:clamp(20px,3vw,40px)}
  .countdown-inner{padding:10px clamp(20px,3vw,40px);font-size:13px}
  .hero-banner img{height:clamp(180px,24vw,300px)}
  .announcement{height:42px;padding-inline:clamp(20px,3vw,40px)}
  .tabs{gap:12px;padding:14px clamp(20px,3vw,40px)}
  .tab{min-height:72px;font-size:13px}
  .content{padding:22px clamp(20px,3vw,40px) 40px}
  .platform-grid{grid-template-columns:repeat(var(--category-columns,4),minmax(0,1fr));gap:14px}
  .card-main{padding:13px 13px 10px}
  .card-name{font-size:14px}
  .online{font-size:11px}
  .card-link{padding:10px;font-size:12px}
  footer{padding-bottom:36px}
  .chat-button{right:max(20px,calc((100vw - 1180px)/2 + 22px));bottom:30px}
}
@media(min-width:1440px){main{max-width:1320px}.platform-grid{grid-template-columns:repeat(var(--category-columns,4),minmax(0,1fr))}}
.card-price-label{position:absolute;top:7px;right:7px;z-index:1;max-width:calc(100% - 14px);overflow:hidden;padding:4px 7px;border:1px solid rgba(255,230,142,.38);border-radius:4px;background:linear-gradient(110deg,rgba(168,120,24,.46),rgba(225,188,76,.46));box-shadow:0 2px 8px rgba(0,0,0,.5);color:#241800;font-size:10px;font-weight:900;line-height:1.2;text-overflow:ellipsis;white-space:nowrap;backdrop-filter:blur(2px)}
.online-count{font-variant-numeric:tabular-nums;font-weight:700;transition:color .25s ease}.online-count::after{display:inline-block;margin-left:3px;font-size:8px;vertical-align:1px}.online-count.is-up{color:#37d878}.online-count.is-up::after{content:"▲"}.online-count.is-down{color:#ff5b61}.online-count.is-down::after{content:"▼"}
@media(max-width:380px){
  .site-header{height:60px;padding-inline:11px}
  .brand{gap:8px}.brand-mark{width:34px;height:34px;border-radius:10px}
  .share-button{padding:7px 10px}
  .countdown-inner{gap:2px 4px;padding-inline:6px;font-size:10px}
  .countdown-left,.countdown-right{gap:3px}.countdown-left b{font-size:12px}.badge{font-size:8px;padding:3px 4px}.timer{letter-spacing:0}.timer span{min-width:20px;height:21px;font-size:11px}.countdown-remaining{font-size:8px}
  .tabs{gap:5px;padding-inline:7px}.tab{font-size:9px;border-radius:9px}
  .content{padding-inline:8px}.platform-grid{gap:6px}.card-main{padding:7px 7px 6px}.card-name{font-size:11px}.card-link{padding:7px 4px;font-size:10px}
}

/* Keep the mobile offer message and remaining time on one compact line. */
@media(max-width:520px){
  .countdown-inner{
    grid-template-columns:minmax(0,1fr) auto 20px;
    grid-template-rows:1fr;
    gap:2px 4px;
    min-height:38px;
    padding:5px 8px;
  }
  .countdown-left{
    grid-column:1;
    grid-row:1;
    min-width:0;
    gap:3px;
    overflow:visible;
  }
  .countdown-left strong{display:inline;font-size:9px}
  .countdown-left b{font-size:11px}
  .countdown-left em{font-size:9px}
  .badge{font-size:8px;padding:3px 4px}
  .countdown-right{
    position:static;
    grid-column:2;
    grid-row:1;
    transform:none;
    justify-self:end;
    gap:3px;
  }
  .countdown-remaining{font-size:8px}
  .timer{gap:2px}
  .timer span{min-width:19px;height:21px;padding-inline:2px;font-size:10px}
  .countdown-close{grid-column:3;grid-row:1;width:18px;height:18px}
}

@media(max-width:380px){
  .countdown-left{gap:2px}
  .countdown-left strong{font-size:8px}
  .countdown-left b{font-size:10px}
  .countdown-left em{font-size:8px}
  .badge{font-size:7px;padding:3px}
  .countdown-right{gap:2px}
  .countdown-remaining{font-size:7px}
  .timer{gap:1px}
  .timer span{min-width:17px;height:20px;padding-inline:1px;font-size:9px}
}