:root{--bg: #0f0f1a;--card-bg: rgba(255, 255, 255, .04);--card-border: rgba(255, 255, 255, .08);--card-hover-bg: rgba(255, 255, 255, .08);--text: #e8e8f0;--text-secondary: #9898b0;--accent: #7c5cfc;--accent-glow: rgba(124, 92, 252, .3);--red: #ff5e7a;--cyan: #00e5ff;--green: #00e676;--orange: #ff9100;--gold: #f5a623}*{box-sizing:border-box;margin:0;padding:0}body{font-family:SF Pro Display,PingFang SC,Noto Sans SC,Microsoft YaHei,Hiragino Sans GB,WenQuanYi Micro Hei,sans-serif;background:var(--bg);color:var(--text);min-height:100vh;display:flex;flex-direction:column;align-items:center;padding:40px 20px 60px;position:relative;overflow-x:hidden;-webkit-tap-highlight-color:transparent;-webkit-font-smoothing:antialiased}body:before{content:"";position:fixed;inset:0;z-index:0;pointer-events:none;background-image:radial-gradient(ellipse at 20% 20%,rgba(124,92,252,.08) 0%,transparent 50%),radial-gradient(ellipse at 80% 60%,rgba(0,229,255,.05) 0%,transparent 50%),radial-gradient(ellipse at 50% 90%,rgba(255,94,122,.05) 0%,transparent 50%)}body:after{content:"";position:fixed;inset:0;z-index:0;pointer-events:none;background-image:linear-gradient(rgba(255,255,255,.015) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.015) 1px,transparent 1px);background-size:60px 60px;mask-image:radial-gradient(ellipse at center,black 30%,transparent 70%)}.aurora{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden;filter:blur(80px);opacity:.5}.aurora-blob{position:absolute;border-radius:50%;will-change:transform}.aurora-blob-1{width:60vw;height:40vw;background:radial-gradient(ellipse,rgba(0,229,255,.4) 0%,transparent 70%);top:-10%;left:5%;animation:auroraA 18s ease-in-out infinite}.aurora-blob-2{width:50vw;height:35vw;background:radial-gradient(ellipse,rgba(124,92,252,.4) 0%,transparent 70%);top:20%;right:-5%;animation:auroraB 22s ease-in-out infinite}.aurora-blob-3{width:55vw;height:38vw;background:radial-gradient(ellipse,rgba(0,230,118,.2) 0%,transparent 70%);bottom:-15%;left:25%;animation:auroraC 25s ease-in-out infinite}@keyframes auroraA{0%,to{transform:translate(0) scale(1)}25%{transform:translate(8vw,5vh) scale(1.15)}50%{transform:translate(-3vw,12vh) scale(.9)}75%{transform:translate(-6vw,-3vh) scale(1.1)}}@keyframes auroraB{0%,to{transform:translate(0) scale(1)}33%{transform:translate(-10vw,-6vh) scale(1.2)}66%{transform:translate(5vw,8vh) scale(.85)}}@keyframes auroraC{0%,to{transform:translate(0) scale(1)}30%{transform:translate(6vw,-10vh) scale(1.1)}60%{transform:translate(-8vw,4vh) scale(.95)}85%{transform:translate(2vw,7vh) scale(1.05)}}.starfield{position:fixed;inset:0;z-index:0;pointer-events:none}.starfield:before{content:"";position:fixed;inset:0;z-index:1;pointer-events:none;background:radial-gradient(ellipse at 30% 50%,rgba(124,92,252,.03) 0%,transparent 60%),radial-gradient(ellipse at 70% 20%,rgba(0,229,255,.02) 0%,transparent 50%),linear-gradient(180deg,rgba(15,15,26,.35) 0%,transparent 25%,transparent 75%,rgba(15,15,26,.35) 100%);backdrop-filter:blur(.5px);-webkit-backdrop-filter:blur(.5px)}.stars-wrap-b{animation:driftB 35s linear infinite}.stars-wrap-c{animation:driftC 40s linear infinite}.starfield:not(.stars-wrap-b):not(.stars-wrap-c){animation:driftA 30s linear infinite}.stars-inner{position:absolute;left:0;top:0;background:transparent;pointer-events:none}.stars-a{width:2px;height:2px;animation:twinkleA 3.5s ease-in-out infinite;box-shadow:56px 45px #fff,134px 89px #fffffff2,210px 22px #fff,345px 156px #dce6ffe6,478px 67px #fff,512px 234px #ffffffd9,623px 112px #d2e1fff2,789px 45px #fff,856px 198px #ffffffe6,934px 78px #dcebfff2,1023px 167px #fff,1156px 34px #ffffffd9,1234px 256px #e6f0ffe6,1345px 89px #fff,1456px 145px #dce6ffd9,1567px 23px #ffffffe6,1678px 189px #fff,1789px 78px #d2dcfff2,1823px 234px #ffffffd9,1900px 12px #fff,89px 312px #ffffffe6,267px 345px #fff,398px 278px #dcebfff2,534px 389px #ffffffd9,678px 312px #fff,723px 456px #e6f0ffe6,890px 367px #ffffffd9,956px 423px #fff,1089px 334px #dce1fff2,1178px 456px #ffffffe6,1290px 378px #fff,1367px 489px #d2dcffd9,1434px 300 #fffffff2,1578px 412px #fff,1645px 345px #e6f0ffe6,1756px 467px #ffffffd9,1867px 323px #fff,45px 534px #dcebfff2,178px 623px #fff,312px 567px #ffffffd9,456px 634px #e6f0ffe6,589px 512px #fff,667px 678px #dce1fff2,789px 589px #ffffffd9,912px 645px #fff,1034px 523px #d2dcfff2,1156px 678px #ffffffe6,1289px 567px #fff,1378px 634px #e6f0ffd9,1456px 589px #fffffff2,1545px 698px #fff,1667px 545px #dce1ffe6,1734px 667px #ffffffd9,1856px 612px #e6f0fff2,112px 756px #fff,234px 823px #ffffffe6,389px 745px #dcebfff2,467px 856px #ffffffd9,578px 789px #fff,689px 867px #e6f0ffe6,798px 734px #ffffffd9,867px 890px #fff,945px 767px #dce1fff2,1045px 845px #ffffffe6,1178px 789px #d2dcffd9,1267px 867px #fff,1389px 756px #fffffff2,1478px 834px #e6f0ffe6,1545px 778px #fff,1678px 867px #dce1ffd9,1756px 789px #fffffff2,1834px 845px #e6f0ffe6,28px 156px #ffffffe6,167px 67px #fff,298px 198px #dcebfff2,423px 12px #fff,567px 89px #ffffffd9,645px 178px #e6f0ffe6,734px 23px #fff,823px 256px #dce1fff2,912px 134px #ffffffd9,1078px 78px #fff,1123px 312px #e6f0ffe6,1198px 189px #ffffffd9,1256px 23px #fff,1323px 356px #dcebfff2,1412px 167px #ffffffe6,1498px 78px #e6f0ffd9,1512px 289px #fff,1623px 134px #dce1fff2,1712px 45px #ffffffe6,1767px 312px #fff,1845px 189px #e6f0ffd9,34px 423px #fff,145px 567px #dcebfff2,223px 412px #ffffffd9,345px 534px #e6f0ffe6,478px 623px #ffffffd9,567px 567px #fff,634px 734px #dce1fff2,745px 645px #ffffffe6,823px 723px #e6f0ffd9,934px 678px #fff,1056px 756px #dcebfff2,1145px 678px #ffffffd9,1234px 723px #e6f0ffe6,1323px 812px #ffffffd9,1412px 756px #fff,1523px 834px #dce1fff2,1634px 723px #ffffffe6,1712px 856px #e6f0ffd9,1789px 756px #fff}.stars-b{width:2px;height:2px;box-shadow:123px 67px 0 1px #aabeffe6,278px 34px 0 1px #8c6effd9,389px 145px 0 1px #bed2ffcc,456px 78px 0 1px #96aaffe6,534px 198px 0 1px #8c6effd9,678px 45px 0 1px #aac8ffe6,745px 234px 0 1px #96a0ffcc,856px 112px 0 1px #8c6effd9,967px 67px 0 1px #bed2ffe6,1023px 189px 0 1px #a0b4ffd9,1156px 23px 0 1px #8c6effcc,1267px 178px 0 1px #aac8ffe6,1345px 89px 0 1px #96aaffd9,1478px 145px 0 1px #8c6effcc,1534px 78px 0 1px #bed2ffe6,1656px 212px 0 1px #a0b4ffd9,1723px 34px 0 1px #8c6effe6,1845px 167px 0 1px #aabeffcc,67px 234px 0 1px #96aaffe6,189px 378px 0 1px #8c6effd9,312px 289px 0 1px #bed2ffcc,445px 423px 0 1px #a0b4ffe6,523px 312px 0 1px #8c6effd9,623px 478px 0 1px #aac8ffe6,734px 345px 0 1px #96a0ffcc,845px 467px 0 1px #8c6effd9,978px 356px 0 1px #bed2ffe6,1067px 489px 0 1px #a0b4ffcc,1123px 323px 0 1px #8c6effe6,1278px 456px 0 1px #aac8ffd9,1356px 334px 0 1px #96aaffcc,1489px 478px 0 1px #8c6effe6,1545px 389px 0 1px #bed2ffd9,1678px 423px 0 1px #a0b4ffcc,1789px 312px 0 1px #8c6effe6,1823px 489px 0 1px #aabeffd9,45px 578px 0 1px #96a0ffcc,167px 689px 0 1px #8c6effe6,289px 623px 0 1px #bed2ffd9,378px 734px 0 1px #a0b4ffcc,467px 645px 0 1px #8c6effe6,589px 789px 0 1px #aac8ffd9,678px 712px 0 1px #96aaffcc,789px 845px 0 1px #8c6effe6,867px 767px 0 1px #bed2ffd9,978px 867px 0 1px #a0b4ffcc,1089px 723px 0 1px #8c6effe6,1178px 856px 0 1px #aabeffd9,1267px 778px 0 1px #96a0ffcc,1389px 845px 0 1px #8c6effe6,1434px 734px 0 1px #bed2ffd9,1567px 867px 0 1px #a0b4ffcc,1689px 756px 0 1px #8c6effe6,1756px 834px 0 1px #aac8ffd9,1890px 712px 0 1px #96aaffcc,34px 89px 0 1px #aabeffd9,198px 123px 0 1px #8c6effcc,345px 34px 0 1px #bed2ffe6,512px 112px 0 1px #a0b4ffd9,689px 167px 0 1px #96aaffcc,823px 23px 0 1px #8c6effe6,945px 289px 0 1px #bed2ffd9,1034px 134px 0 1px #aac8ffcc,1189px 45px 0 1px #a0b4ffe6,1245px 389px 0 1px #8c6effd9,1334px 212px 0 1px #bed2ffcc,1456px 23px 0 1px #96aaffe6,1512px 312px 0 1px #8c6effd9,1623px 256px 0 1px #aac8ffcc,1734px 134px 0 1px #bed2ffe6,1856px 256px 0 1px #a0b4ffd9,78px 412px 0 1px #96aaffcc,234px 534px 0 1px #8c6effe6,345px 478px 0 1px #bed2ffd9,512px 567px 0 1px #aabeffcc,645px 645px 0 1px #a0b4ffe6,734px 534px 0 1px #8c6effd9,856px 823px 0 1px #bed2ffcc,923px 712px 0 1px #96aaffe6,1045px 812px 0 1px #8c6effd9,1123px 734px 0 1px #aac8ffcc,1234px 867px 0 1px #bed2ffe6,1345px 756px 0 1px #a0b4ffd9,1412px 856px 0 1px #96aaffcc,1534px 734px 0 1px #8c6effe6,1645px 845px 0 1px #bed2ffd9,1756px 723px 0 1px #aac8ffcc;animation:twinkleB 4.5s ease-in-out infinite}.stars-c{width:2px;height:2px;animation:twinkleC 5.5s ease-in-out infinite;box-shadow:200px 120px 1px 2px #beaaffe6,520px 60px 1px 1px #aa8cffd9,800px 200px 1px 2px #bea0ffe6,1100px 80px 1px 1px #a082ffcc,1400px 160px 1px 2px #b496fff2,1700px 50px 1px 1px #aa8cffcc,350px 350px 1px 2px #beaaffd9,700px 500px 1px 1px #a082ffcc,1000px 400px 1px 2px #b496fff2,1300px 550px 1px 1px #aa8cffcc,1600px 350px 1px 2px #bea0ffd9,250px 700px 1px 1px #a082ffcc,600px 800px 1px 2px #b496ffe6,950px 750px 1px 1px #aa8cffcc,1250px 850px 1px 2px #beaafff2,1550px 700px 1px 1px #a082ffcc,1800px 800px 1px 2px #b496ffd9,80px 200px 1px 2px #b496ffd9,420px 250px 1px 1px #aa8cffcc,650px 80px 1px 2px #bea0ffe6,900px 320px 1px 1px #a082ffcc,1050px 150px 1px 2px #b496fff2,1500px 100px 1px 1px #aa8cffd9,1850px 300px 1px 2px #beaaffcc,150px 450px 1px 1px #a082ffd9,500px 600px 1px 2px #b496ffe6,850px 650px 1px 1px #aa8cffcc,1150px 700px 1px 2px #bea0fff2,1450px 750px 1px 1px #a082ffd9,1750px 650px 1px 2px #b496ffcc}@keyframes twinkleA{0%,to{opacity:.7}25%{opacity:1}50%{opacity:.5}75%{opacity:.9}}@keyframes twinkleB{0%,to{opacity:.75}30%{opacity:.45}60%{opacity:1}85%{opacity:.55}}@keyframes twinkleC{0%,to{opacity:.6}20%{opacity:.95}50%{opacity:.35}70%{opacity:.9}}@keyframes driftA{0%{transform:translate(0)}25%{transform:translate(40px,-25px)}50%{transform:translate(15px,-50px)}75%{transform:translate(-35px,-20px)}to{transform:translate(0)}}@keyframes driftB{0%{transform:translate(0)}25%{transform:translate(-30px,20px)}50%{transform:translate(-55px,-10px)}75%{transform:translate(-20px,35px)}to{transform:translate(0)}}@keyframes driftC{0%{transform:translate(0)}33%{transform:translate(25px,30px)}66%{transform:translate(-25px,-15px)}to{transform:translate(0)}}.hero{position:relative;z-index:1;text-align:center;margin-bottom:16px}.hero .logo-wrap{position:relative;display:inline-block;margin-bottom:20px}.hero .logo-wrap:after{content:"";position:absolute;inset:-6px;border-radius:22px;border:1.5px solid rgba(124,92,252,.3);animation:logoGlow 3s ease-in-out infinite;pointer-events:none}.hero .logo{position:relative;display:inline-flex;width:64px;height:64px;border-radius:18px;background:linear-gradient(135deg,var(--cyan),var(--accent),#a78bfa);align-items:center;justify-content:center;font-size:30px;box-shadow:0 0 40px #00e5ff33,0 0 80px #7c5cfc26,0 12px 32px #0000004d;overflow:hidden}.hero .logo:before{content:"";position:absolute;z-index:2;top:-50%;left:-150%;width:50%;height:200%;background:linear-gradient(105deg,transparent 30%,rgba(255,255,255,.3) 46%,rgba(255,255,255,.7) 50%,rgba(255,255,255,.3) 54%,transparent 70%);transform:skew(-20deg);animation:logoShine 3s ease-in-out infinite;pointer-events:none}@keyframes logoShine{0%{left:-150%}40%{left:120%}to{left:120%}}@keyframes logoGlow{0%,to{border-color:#00e5ff4d;box-shadow:0 0 20px #00e5ff1a}50%{border-color:#7c5cfc99;box-shadow:0 0 40px #7c5cfc33}}.hero h1{font-family:Orbitron,PingFang SC,Microsoft YaHei,sans-serif;font-size:34px;font-weight:700;letter-spacing:2px;background:linear-gradient(90deg,#8898c0,#a0aed8,#c8d0f0 40%,#e8ecff,#c8d0f0 60%,#a0aed8,#8898c0);background-size:200% 100%;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:10px;filter:drop-shadow(0 2px 12px rgba(124,92,252,.3));animation:shimmer 3s ease-in-out infinite alternate}@keyframes shimmer{0%{background-position:100% 0}to{background-position:0% 0}}.hero .divider{display:block;width:60px;height:1.5px;margin:0 auto 10px;background:linear-gradient(90deg,transparent,var(--cyan),var(--accent),transparent);border-radius:2px}.hero p{font-family:Orbitron,sans-serif;font-weight:500;font-size:12px;color:#9898b0b3;letter-spacing:4px;text-transform:uppercase}.action-btns{position:relative;z-index:1;display:flex;gap:14px;margin-bottom:36px;flex-wrap:wrap;justify-content:center}.btn-coffee,.btn-contact{display:inline-flex;align-items:center;gap:7px;padding:10px 20px;border-radius:50px;font-family:Orbitron,PingFang SC,Microsoft YaHei,sans-serif;font-size:13px;font-weight:500;cursor:pointer;text-decoration:none;letter-spacing:1px;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);transition:all .3s ease;user-select:none;border:1px solid}.btn-coffee:active,.btn-contact:active{transform:scale(.96)}.btn-coffee{background:#f5a62314;border-color:#f5a62340;color:var(--gold)}.btn-coffee .cup{font-size:18px;transition:transform .3s ease}@media(hover:hover){.btn-coffee:hover{background:#f5a62329;border-color:#f5a62380;box-shadow:0 4px 24px #f5a62326;transform:translateY(-1px)}.btn-coffee:hover .cup{transform:rotate(-12deg) scale(1.15)}}.btn-contact{background:#00e5ff0f;border-color:#00e5ff33;color:var(--cyan)}@media(hover:hover){.btn-contact:hover{background:#00e5ff24;border-color:#00e5ff73;box-shadow:0 4px 24px #00e5ff1f;transform:translateY(-1px)}}.modal-overlay{position:fixed;inset:0;z-index:999;background:#000000a6;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);display:flex;align-items:center;justify-content:center;opacity:0;pointer-events:none;transition:opacity .3s ease}.modal-overlay.active{opacity:1;pointer-events:auto}.modal{background:#1e1e32f2;border:1px solid rgba(255,255,255,.1);border-radius:24px;padding:36px 32px 28px;text-align:center;max-width:460px;width:92%;backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);box-shadow:0 24px 80px #0009;transform:translateY(20px);transition:transform .35s cubic-bezier(.4,0,.2,1)}.modal-overlay.active .modal{transform:translateY(0)}.modal h3{font-family:Orbitron,PingFang SC,Microsoft YaHei,sans-serif;font-size:18px;font-weight:700;margin-bottom:4px;color:var(--text);letter-spacing:.5px}.modal .sub{font-size:13px;color:var(--text-secondary);margin-bottom:24px}.modal .qr-img{width:100%;max-width:386px;height:auto;aspect-ratio:386 / 207;border-radius:12px;border:1px solid rgba(255,255,255,.08);object-fit:contain;background:#fff;margin-bottom:20px}.modal .close-btn{display:inline-block;padding:10px 36px;border-radius:50px;border:1px solid rgba(255,255,255,.15);background:#ffffff0f;color:var(--text-secondary);font-family:Orbitron,PingFang SC,Microsoft YaHei,sans-serif;font-size:13px;font-weight:500;cursor:pointer;letter-spacing:1px;transition:all .25s ease}@media(hover:hover){.modal .close-btn:hover{background:#ffffff1f;color:#fff}}.grid{position:relative;z-index:1;display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:20px;width:100%;max-width:960px}.item{position:relative;background:#ffffff08;border:1px solid rgba(255,255,255,.06);border-radius:20px;padding:28px 20px 24px;text-align:center;text-decoration:none;color:var(--text);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);transition:all .4s cubic-bezier(.4,0,.2,1);cursor:pointer;overflow:hidden}.item:before{content:"";position:absolute;top:0;left:25%;right:25%;height:1.5px;background:linear-gradient(90deg,transparent,rgba(0,229,255,.3),rgba(124,92,252,.3),transparent);transition:all .4s ease}.item:after{content:"";position:absolute;inset:-1px;border-radius:20px;z-index:-1;opacity:0;transition:opacity .4s ease;background:linear-gradient(135deg,#00e5ff1f,#7c5cfc26,#00c8b414)}@media(hover:hover){.item:hover{transform:translateY(-8px);border-color:#00e5ff40;background:#ffffff0f;box-shadow:0 24px 56px #00000080,0 0 40px #00e5ff0f,0 0 0 1px #7c5cfc14 inset}.item:hover:after{opacity:1}.item:hover:before{left:8%;right:8%;background:linear-gradient(90deg,transparent,rgba(0,229,255,.6),rgba(124,92,252,.5),transparent)}}.item .icon{width:52px;height:52px;border-radius:14px;margin:0 auto 14px;display:flex;align-items:center;justify-content:center;font-size:26px;transition:all .4s cubic-bezier(.4,0,.2,1);box-shadow:0 4px 16px #0003}@media(hover:hover){.item:hover .icon{transform:scale(1.08);box-shadow:0 8px 24px #0000004d}}.item h2{font-family:Orbitron,PingFang SC,Microsoft YaHei,sans-serif;font-size:14px;font-weight:700;margin-bottom:4px;letter-spacing:.5px;transition:all .3s ease}@media(hover:hover){.item:hover h2{background:linear-gradient(135deg,#c0e8ff,#d0c8ff);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}}.item .desc{font-size:12px;color:var(--text-secondary);line-height:1.5;transition:color .3s ease}.item .badge{display:inline-block;font-family:Orbitron,sans-serif;font-size:10px;padding:4px 12px;border-radius:20px;margin-top:10px;font-weight:700;letter-spacing:.6px;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.badge-hot{background:#ff5e7a1f;color:#ff8a9e;border:1px solid rgba(255,94,122,.2)}.badge-new{background:#00e5761a;color:#5effa0;border:1px solid rgba(0,229,118,.18)}.footer{position:relative;z-index:1;margin-top:56px;text-align:center;font-family:Orbitron,sans-serif;font-weight:500;font-size:11px;color:#9898b080;letter-spacing:1.5px}.footer .dot{display:inline-block;width:4px;height:4px;border-radius:50%;background:var(--accent);margin:0 8px;vertical-align:middle;animation:pulse 2s ease-in-out infinite}@keyframes pulse{0%,to{opacity:.3;transform:scale(1)}50%{opacity:1;transform:scale(1.8)}}@media(max-width:640px){body{padding:28px 14px 48px}.hero{margin-bottom:8px}.hero .logo{width:48px;height:48px;border-radius:14px;font-size:24px}.hero .logo-wrap:after{inset:-4px;border-radius:17px}.hero h1{font-size:22px;letter-spacing:1px}.hero .divider{width:48px}.action-btns{margin-bottom:28px;gap:10px}.grid{grid-template-columns:repeat(2,1fr);gap:14px}.item{padding:22px 14px 20px;border-radius:16px}.item .icon{width:42px;height:42px;border-radius:12px;font-size:22px;margin-bottom:10px}.item h2{font-size:14px}.item .desc{font-size:11px}.modal{padding:28px 20px 24px}.modal .qr-img{max-width:100%}}@media(max-width:380px){.grid{grid-template-columns:1fr 1fr;gap:10px}.item{padding:18px 10px 16px}}
