:root{--red:#38bdf8;--red2:#2563eb;--dark:#f4f7fb;--muted:#a9b4c7;--bg:#080b12;--card:#111827;--line:rgba(255,255,255,.1);--gold:#ffe8b4}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:radial-gradient(circle at 18% 0,rgba(56,189,248,.28) 0,rgba(15,23,42,.94) 310px,rgba(7,10,18,.98) 100%),radial-gradient(circle at 88% 18%,rgba(37,99,235,.18) 0,rgba(7,10,18,0) 260px),linear-gradient(180deg,rgba(6,15,32,.8),rgba(7,10,18,.92)),url('./site-bg.png') center top/cover fixed no-repeat;font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",Arial,sans-serif;color:var(--dark)}#app{max-width:560px;margin:0 auto;padding:14px 12px 98px;background:linear-gradient(180deg,rgba(56,189,248,.06),rgba(255,255,255,.02));min-height:100vh}.header{position:sticky;top:0;z-index:10;display:flex;align-items:center;justify-content:space-between;padding:10px 2px 12px;background:rgba(8,11,18,.84);backdrop-filter:blur(18px);border-bottom:1px solid rgba(255,255,255,.08)}.shop{display:flex;gap:11px;align-items:center}.avatar{width:46px;height:46px;border-radius:16px;background:linear-gradient(135deg,#38bdf8,#2563eb);padding:2px;display:grid;place-items:center;box-shadow:0 0 24px rgba(56,189,248,.42);overflow:hidden}.avatar img{width:100%;height:100%;object-fit:cover;border-radius:14px;display:block}.shop h1{font-size:21px;letter-spacing:.5px;margin:0}.shop p{font-size:12px;color:var(--muted);margin:4px 0 0}.kefu{border:1px solid rgba(255,255,255,.12);border-radius:999px;padding:9px 15px;background:rgba(255,255,255,.08);color:#fff;font-weight:800;box-shadow:0 8px 20px rgba(0,0,0,.18)}.banner{height:172px;border-radius:24px;overflow:hidden;background:#0b1020;margin:4px 0 12px;box-shadow:0 18px 42px rgba(0,0,0,.42),0 0 0 1px rgba(255,255,255,.08);position:relative;border:1px solid rgba(37,99,235,.24)}.banner:after{content:"清风内测 · 蓝色电竞";position:absolute;left:12px;bottom:12px;background:rgba(8,11,18,.72);color:#fff;border-radius:999px;padding:7px 12px;font-size:12px;font-weight:800;backdrop-filter:blur(8px);z-index:2;border:1px solid rgba(37,99,235,.3)}.banner img{width:100%;height:100%;object-fit:cover;object-position:center 22%;display:block}.top-music-control{display:flex;justify-content:center;margin:2px 0 10px}.hero-play{border:0;border-radius:999px;background:rgba(255,255,255,.94);color:#111827;padding:10px 18px;font-size:14px;font-weight:1000;box-shadow:0 10px 26px rgba(23,32,51,.13);backdrop-filter:blur(10px)}.hero-play.playing{background:rgba(56,189,248,.92);color:#fff}.hero-play:active{transform:scale(.96)}.quick{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin:12px 0}.quick div{background:rgba(17,24,39,.82);border:1px solid rgba(255,255,255,.1);border-radius:18px;padding:12px 9px;box-shadow:0 10px 28px rgba(0,0,0,.22);backdrop-filter:blur(10px)}.quick b{display:block;font-size:14px}.quick span{display:block;color:var(--muted);font-size:11px;margin-top:4px}.top-tabs{position:sticky;top:68px;z-index:9;display:flex;gap:10px;overflow:auto;padding:8px 0 9px;background:rgba(8,11,18,.86);backdrop-filter:blur(16px);scrollbar-width:none}.cat-tabs{display:flex;gap:9px;overflow:auto;padding:2px 0 10px;scrollbar-width:none}.top-tabs::-webkit-scrollbar,.cat-tabs::-webkit-scrollbar{display:none}.top-tabs button,.cat-tabs button{white-space:nowrap;border:1px solid rgba(255,255,255,.09);border-radius:999px;background:rgba(17,24,39,.86);color:#cbd5e1;padding:10px 17px;font-weight:800;box-shadow:0 8px 20px rgba(0,0,0,.18)}.top-tabs button.active{background:linear-gradient(135deg,#38bdf8,#2563eb);color:#fff;box-shadow:0 0 20px rgba(56,189,248,.32)}.cat-tabs button{padding:8px 13px;font-size:13px}.cat-tabs button.active{background:rgba(56,189,248,.16);color:#93c5fd;box-shadow:inset 0 0 0 1px rgba(37,99,235,.28)}.section-title{display:flex;justify-content:space-between;align-items:center;margin:12px 3px 10px}.section-title h2{font-size:20px;margin:0}.section-title span{font-size:12px;color:#cbd5e1;background:rgba(17,24,39,.8);border-radius:999px;padding:5px 9px;border:1px solid rgba(255,255,255,.08)}.goods{display:flex;flex-direction:column;gap:12px}.card{background:linear-gradient(180deg,rgba(17,24,39,.94),rgba(13,18,30,.92));border:1px solid rgba(255,255,255,.1);border-radius:22px;padding:11px;display:grid;grid-template-columns:106px 1fr;gap:12px;box-shadow:0 14px 36px rgba(0,0,0,.3),inset 0 1px 0 rgba(255,255,255,.04);position:relative;overflow:hidden;cursor:pointer;transition:transform .16s ease,box-shadow .16s ease;backdrop-filter:blur(8px)}.card:active{transform:scale(.985)}.card:before{content:"";position:absolute;right:-26px;top:-26px;width:72px;height:72px;border-radius:50%;background:rgba(56,189,248,.13);box-shadow:0 0 38px rgba(56,189,248,.12)}.pic{width:106px;height:106px;border-radius:18px;background:#0b1020;overflow:hidden;position:relative;border:1px solid rgba(255,255,255,.08)}.pic img{width:100%;height:100%;object-fit:cover;display:block}.info{min-width:0;display:flex;flex-direction:column}.info h3{font-size:15.5px;line-height:1.36;margin:1px 0 6px;font-weight:900;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.desc{font-size:12.5px;color:#a9b4c7;line-height:1.45;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:36px}.meta{display:flex;gap:6px;align-items:center;margin-top:6px;min-height:18px;flex-wrap:wrap}.tag{background:rgba(37,99,235,.14);color:#bfdbfe;border-radius:999px;padding:3px 7px;font-size:11px;font-weight:700;border:1px solid rgba(37,99,235,.18)}.price-row{display:flex;align-items:flex-end;justify-content:space-between;gap:8px;margin-top:auto;padding-top:7px}.price{color:#ff4d3d;font-size:22px;font-weight:1000;letter-spacing:-.5px;text-shadow:0 0 16px rgba(255,77,61,.3)}.price small{font-size:11px;color:#ff9b8f;font-weight:800;margin-left:2px}.buy{border:0;border-radius:999px;background:linear-gradient(135deg,#ff6b4a,#ff3024);color:#fff;font-weight:900;padding:8px 14px;font-size:13px;box-shadow:0 8px 18px rgba(255,59,48,.28);transition:transform .16s ease,filter .16s ease}.buy:active{transform:scale(.94)}.buy.added{background:linear-gradient(135deg,#22c55e,#16a34a);animation:pop .35s ease}.order-notes{background:rgba(17,24,39,.88);border-radius:22px;padding:16px 16px 14px;margin-top:15px;box-shadow:0 14px 36px rgba(0,0,0,.24);border:1px solid rgba(255,255,255,.1);backdrop-filter:blur(10px)}.order-notes h2{font-size:18px;margin:0 0 9px}.order-notes ul{padding-left:18px;margin:0}.order-notes li{font-size:13px;color:#5e6878;line-height:1.65;margin:6px 0}.bottom-bar{position:fixed;left:50%;bottom:12px;transform:translateX(-50%);max-width:536px;width:calc(100% - 24px);background:linear-gradient(135deg,rgba(8,11,18,.96),rgba(17,24,39,.96));color:#fff;border-radius:22px;padding:12px 13px;display:flex;align-items:center;justify-content:space-between;gap:12px;box-shadow:0 16px 44px rgba(0,0,0,.38),0 0 0 1px rgba(37,99,235,.16);backdrop-filter:blur(16px);border:1px solid rgba(255,255,255,.08)}.bottom-bar.shake{animation:shake .42s ease}.bottom-bar b{display:block;max-width:310px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.bottom-bar p{margin:4px 0 0;color:rgba(255,255,255,.68);font-size:12px}.bottom-bar button{border:0;border-radius:999px;background:linear-gradient(135deg,#ff6b4a,#ff3024);color:#fff;font-weight:900;padding:10px 16px;white-space:nowrap;box-shadow:0 8px 22px rgba(255,59,48,.3)}.contact-mask,.detail-mask,.cart-mask{position:fixed;inset:0;background:rgba(0,0,0,.58);display:none;align-items:center;justify-content:center;z-index:30;padding:22px}.contact-mask.show,.detail-mask.show,.cart-mask.show{display:flex}.cart-card{width:100%;max-width:430px;max-height:86vh;overflow:auto;background:linear-gradient(180deg,#111827,#0b1020);border-radius:26px;padding:22px 16px 16px;position:relative;box-shadow:0 24px 70px rgba(0,0,0,.48);border:1px solid rgba(255,255,255,.1)}.cart-card h2{margin:0 0 13px;font-size:21px}.cart-list{display:flex;flex-direction:column;gap:10px;max-height:360px;overflow:auto}.cart-item{background:rgba(8,11,18,.62);border:1px solid rgba(255,255,255,.08);border-radius:18px;padding:11px;display:flex;justify-content:space-between;gap:10px;align-items:center}.cart-info{min-width:0}.cart-info b{display:block;font-size:13.5px;line-height:1.35;max-width:210px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.cart-info span{display:block;margin-top:5px;color:#a9b4c7;font-size:12px}.cart-ops{display:flex;align-items:center;gap:6px;flex-shrink:0}.cart-ops button{border:0;border-radius:10px;background:rgba(255,255,255,.1);color:#fff;width:30px;height:30px;font-weight:900}.cart-ops .remove{background:rgba(56,189,248,.18);color:#93c5fd;width:36px}.cart-ops em{font-style:normal;min-width:18px;text-align:center;color:#fff;font-weight:900}.cart-total{text-align:right;margin:13px 2px 12px;color:#ff9b8f;font-size:20px;font-weight:1000}.cart-actions{display:grid;grid-template-columns:1fr 2fr;gap:10px}.cart-actions button{border:0;border-radius:999px;padding:12px 12px;font-weight:1000}.cart-clear{background:rgba(255,255,255,.1);color:#dbe5f5}.cart-submit{background:linear-gradient(135deg,#ff6b4a,#ff3024);color:#fff;box-shadow:0 10px 24px rgba(255,59,48,.28)}.cart-empty{text-align:center;color:#a9b4c7;background:rgba(255,255,255,.06);border-radius:16px;padding:20px}.detail-card{width:100%;max-width:430px;max-height:88vh;overflow:auto;background:linear-gradient(180deg,#111827,#0b1020);border-radius:26px;padding:14px 14px 18px;position:relative;box-shadow:0 24px 70px rgba(0,0,0,.48);border:1px solid rgba(255,255,255,.1)}.detail-img{width:100%;height:190px;object-fit:cover;border-radius:20px;background:#0b1020;border:1px solid rgba(255,255,255,.08)}.detail-card h2{font-size:20px;line-height:1.35;margin:13px 4px 8px}.detail-price{margin:0 4px 12px;color:#ff4d3d;font-size:24px;font-weight:1000;text-shadow:0 0 16px rgba(255,77,61,.26)}.detail-content{background:rgba(8,11,18,.62);border-radius:18px;padding:12px 13px;color:#cbd5e1;font-size:13px;line-height:1.68;max-height:260px;overflow:auto;border:1px solid rgba(255,255,255,.08)}.detail-content h3{font-size:15px;margin:0 0 10px;color:#fff}.detail-content p{margin:0 0 8px}.detail-content strong{color:#93c5fd}.detail-content span{color:inherit!important}.detail-add{width:100%;border:0;border-radius:999px;background:linear-gradient(135deg,#ff6b4a,#ff3024);color:#fff;font-weight:1000;padding:13px 18px;margin-top:14px;font-size:15px;box-shadow:0 10px 22px rgba(255,59,48,.3)}.contact-card{width:100%;max-width:334px;background:linear-gradient(180deg,#111827,#0b1020);border-radius:26px;padding:24px 18px 20px;text-align:center;position:relative;box-shadow:0 24px 70px rgba(0,0,0,.48);border:1px solid rgba(255,255,255,.1)}.contact-card h2{margin:0 0 14px;font-size:21px}.contact-card p{margin:13px 0;color:#dbe5f5}.qr{width:220px;height:220px;object-fit:contain;border-radius:18px;background:#f7f8fb;border:1px solid #edf0f6}.close{position:absolute;right:12px;top:10px;border:0;background:rgba(255,255,255,.1);color:#fff;width:32px;height:32px;border-radius:50%;font-size:22px;line-height:30px}.copy{border:0;background:#111;color:#fff;border-radius:999px;padding:11px 20px;font-weight:900}.empty{background:#fff;border-radius:18px;padding:24px;text-align:center;color:#777}.music-btn{position:fixed;right:16px;bottom:92px;z-index:22;width:46px;height:46px;border:0;border-radius:50%;background:linear-gradient(135deg,#111827,#2d3748);color:#fff;font-size:22px;font-weight:900;box-shadow:0 12px 30px rgba(0,0,0,.34);border:1px solid rgba(255,255,255,.1)}.music-btn.playing{animation:musicSpin 2.2s linear infinite;background:linear-gradient(135deg,#38bdf8,#2563eb)}@keyframes musicSpin{from{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes pop{0%{transform:scale(.94)}60%{transform:scale(1.08)}100%{transform:scale(1)}}@keyframes shake{0%,100%{transform:translateX(-50%)}25%{transform:translateX(calc(-50% - 6px))}50%{transform:translateX(calc(-50% + 6px))}75%{transform:translateX(calc(-50% - 3px))}}@media(max-width:390px){#app{padding-left:10px;padding-right:10px}.banner{height:154px}.card{grid-template-columns:96px 1fr;gap:10px}.pic{width:96px;height:96px}.price{font-size:20px}.buy{padding:7px 12px}.bottom-bar b{max-width:220px}}@media(min-width:760px){#app{max-width:760px}.banner{height:220px}.goods{display:grid;grid-template-columns:1fr 1fr}.card{grid-template-columns:106px 1fr}.top-tabs{top:70px}.bottom-bar{max-width:736px}}
.shop-ending{margin:14px 0 6px;padding:16px 14px;border-radius:22px;background:linear-gradient(135deg,rgba(17,24,39,.88),rgba(15,23,42,.82));border:1px solid rgba(56,189,248,.16);box-shadow:0 14px 34px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.04);text-align:center;backdrop-filter:blur(10px)}.shop-ending p{margin:0 0 8px;color:#cbd5e1;font-size:13px}.shop-ending b{display:block;color:#bfdbfe;font-size:15px;line-height:1.55;text-shadow:0 0 16px rgba(56,189,248,.18)}