:root{
  --blue:#00eaff;
  --pink:#ff2ecf;
  --orange:#ff7a00;
  --yellow:#ffe500;
  --green:#78ff00;
  --black:#080814;
  --white:#ffffff;
  --muted:#c9d4ff;
  --glass:rgba(255,255,255,.09);
  --line:rgba(255,255,255,.19);
  --shadow:0 24px 70px rgba(0,0,0,.32);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:#080814;color:var(--white);font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI","Microsoft YaHei",sans-serif;line-height:1.7;overflow-x:hidden}
a{color:inherit;text-decoration:none}
img,video{max-width:100%;display:block;border-radius:24px}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.site-header{position:relative;z-index:10;padding:18px clamp(16px,4vw,64px) 10px;background:linear-gradient(90deg,#080814 0%,#1a0c2e 38%,#0a2342 100%);border-bottom:1px solid var(--line);box-shadow:0 12px 38px rgba(0,0,0,.28)}
.site-header:before,.hero:before,.section:before{content:"";position:absolute;inset:auto -12% -30px -12%;height:120px;background:radial-gradient(circle at 20% 30%,rgba(255,46,207,.55),transparent 26%),radial-gradient(circle at 74% 52%,rgba(0,234,255,.45),transparent 28%),radial-gradient(circle at 50% 90%,rgba(120,255,0,.32),transparent 28%);filter:blur(22px);pointer-events:none}
.logo-row{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap}
.brand-logo{display:inline-flex;align-items:center;gap:10px;font-weight:1000;letter-spacing:.04em;text-transform:uppercase}
.logo-mark{display:grid;place-items:center;width:44px;height:44px;border-radius:16px;color:#070713;background:linear-gradient(135deg,var(--yellow),var(--green),var(--blue));box-shadow:0 0 22px rgba(0,234,255,.65),0 0 40px rgba(255,46,207,.35);transform:rotate(-8deg)}
.logo-text{font-size:clamp(26px,4vw,42px);text-shadow:3px 3px 0 var(--pink),-2px -2px 0 var(--blue)}
.logo-spark{font-size:12px;padding:5px 9px;border-radius:999px;background:var(--pink);color:#fff;box-shadow:0 0 20px var(--pink)}
.domain-pill{margin:0;padding:9px 14px;border:1px solid var(--line);border-radius:999px;background:rgba(0,0,0,.25);color:var(--muted)}
.top-nav{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}
.top-nav a{padding:10px 14px;border:1px solid var(--line);border-radius:999px;background:rgba(255,255,255,.06);font-weight:800;transition:.24s ease}
.top-nav a:hover{transform:translateY(-3px) rotate(-1deg);background:linear-gradient(135deg,var(--blue),var(--pink));color:#fff;box-shadow:0 0 24px rgba(255,46,207,.48)}
.fake-search{display:grid;grid-template-columns:1fr auto;gap:8px;margin:16px 0 8px;padding:8px;border-radius:22px;background:rgba(255,255,255,.08);border:1px solid var(--line)}
.fake-search input{width:100%;border:0;outline:0;border-radius:16px;background:#fff;color:#101018;padding:14px 16px;font-size:16px;font-weight:700}
.fake-search button,.btn{border:0;border-radius:16px;padding:14px 20px;font-weight:1000;cursor:pointer;color:#101018;background:linear-gradient(135deg,var(--yellow),var(--green));box-shadow:0 0 22px rgba(120,255,0,.34);transition:.22s ease}
.fake-search button:hover,.btn:hover{transform:translateY(-3px) scale(1.02);box-shadow:0 0 30px rgba(0,234,255,.55),0 0 40px rgba(255,46,207,.38)}
.fake-search-output{grid-column:1/-1;color:var(--yellow);min-height:22px;padding-left:6px;font-weight:800}
main{position:relative;z-index:1}.hero{position:relative;min-height:680px;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(300px,.95fr);gap:32px;align-items:center;padding:clamp(32px,6vw,86px) clamp(16px,4vw,64px);overflow:hidden;background:linear-gradient(135deg,#09091b,#251044 45%,#081a38)}
.hero:after{content:"红桃视频 · 视频 · AI · 潮流";position:absolute;right:-80px;top:90px;font-weight:1000;font-size:clamp(54px,10vw,145px);letter-spacing:.04em;color:rgba(255,255,255,.04);transform:rotate(9deg);white-space:nowrap}
.eyebrow{display:inline-flex;gap:8px;align-items:center;border:1px solid var(--line);background:rgba(255,255,255,.08);border-radius:999px;padding:8px 12px;color:var(--green);font-weight:1000;text-transform:uppercase}.eyebrow:before{content:"";width:9px;height:9px;border-radius:50%;background:var(--green);box-shadow:0 0 16px var(--green)}
h1{font-size:clamp(42px,7vw,90px);line-height:1.02;margin:18px 0 18px;font-weight:1000;letter-spacing:-.05em;text-shadow:5px 5px 0 var(--pink),-4px -3px 0 var(--blue)}
h2{font-size:clamp(30px,4.4vw,58px);line-height:1.08;margin:0 0 16px;font-weight:1000;letter-spacing:-.035em;text-shadow:3px 3px 0 rgba(255,46,207,.65)}
h3{font-size:22px;margin:0 0 10px}.hero p,.section-lead{font-size:clamp(17px,2vw,22px);color:#e5e9ff;max-width:760px}.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin:26px 0}.btn.secondary{background:linear-gradient(135deg,var(--pink),var(--blue));color:#fff}.stat-row{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:24px}.stat{padding:14px;border:1px solid var(--line);border-radius:20px;background:rgba(255,255,255,.08)}.stat strong{display:block;font-size:28px;color:var(--yellow)}
.hero-media{position:relative}.hero-media figure{margin:0}.hero-media img{box-shadow:0 0 0 6px rgba(255,255,255,.1),0 0 70px rgba(0,234,255,.36),0 0 120px rgba(255,46,207,.28);transform:rotate(2deg)}.image-desc{margin-top:12px;color:#e8ecff;background:rgba(0,0,0,.3);border:1px solid var(--line);border-radius:18px;padding:10px 12px}.floating-card{position:absolute;left:-14px;bottom:48px;max-width:300px;padding:16px;border-radius:24px;background:rgba(8,8,20,.76);border:1px solid rgba(255,255,255,.26);backdrop-filter:blur(16px);box-shadow:var(--shadow);animation:floaty 5s ease-in-out infinite}.floating-card strong{color:var(--yellow)}
@keyframes floaty{0%,100%{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(-16px) rotate(2deg)}}
.section{position:relative;padding:clamp(44px,7vw,96px) clamp(16px,4vw,64px);overflow:hidden}.section.alt{background:linear-gradient(135deg,rgba(255,46,207,.12),rgba(0,234,255,.12))}.section-head{display:flex;align-items:end;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-bottom:26px}.tag-cloud{display:flex;gap:8px;flex-wrap:wrap}.tag{display:inline-flex;padding:7px 11px;border-radius:999px;background:rgba(255,255,255,.09);border:1px solid var(--line);color:#eaf0ff;font-weight:800;font-size:14px}.tag.hot{background:linear-gradient(135deg,var(--pink),var(--orange));color:#fff}.grid{display:grid;gap:18px}.cards-4{grid-template-columns:repeat(4,minmax(0,1fr))}.cards-3{grid-template-columns:repeat(3,minmax(0,1fr))}.cards-2{grid-template-columns:repeat(2,minmax(0,1fr))}.card,.video-card,.topic-card,.faq-card,.review-card{position:relative;border:1px solid var(--line);border-radius:28px;background:linear-gradient(160deg,rgba(255,255,255,.11),rgba(255,255,255,.045));box-shadow:var(--shadow);overflow:hidden}.card,.topic-card,.faq-card,.review-card{padding:22px}.card:after,.topic-card:after,.faq-card:after,.review-card:after{content:"";position:absolute;inset:auto -12% -50px 12%;height:100px;background:radial-gradient(circle,rgba(255,46,207,.32),transparent 68%);filter:blur(14px)}
.video-card{transition:.22s ease;background:#101020}.video-card:hover{transform:translateY(-9px) rotate(-1deg);box-shadow:0 0 0 3px rgba(255,255,255,.1),0 0 38px rgba(0,234,255,.48),0 0 78px rgba(255,46,207,.42);animation:huePop .75s ease both}.video-card video,.video-card img{width:100%;aspect-ratio:16/10;object-fit:cover;border-radius:28px 28px 0 0}.video-body{padding:18px}.play-button{position:absolute;top:28%;left:50%;translate:-50% -50%;width:74px;height:74px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.88);color:#09091a;font-weight:1000;font-size:26px;opacity:0;transform:scale(.78);transition:.2s ease;box-shadow:0 0 34px rgba(255,255,255,.9)}.video-card:hover .play-button{opacity:1;transform:scale(1)}@keyframes huePop{0%{filter:hue-rotate(0)}50%{filter:hue-rotate(70deg) saturate(1.35)}100%{filter:hue-rotate(0) saturate(1.1)}}.metrics{display:flex;gap:10px;flex-wrap:wrap;margin:12px 0;color:#e9edff}.metrics span{padding:5px 9px;border-radius:999px;background:rgba(0,0,0,.23);border:1px solid rgba(255,255,255,.13)}
.topic-card:nth-child(2n){background:linear-gradient(160deg,rgba(0,234,255,.18),rgba(255,255,255,.05))}.topic-card:nth-child(3n){background:linear-gradient(160deg,rgba(120,255,0,.16),rgba(255,46,207,.08))}.creator-card img{width:100%;aspect-ratio:4/3;object-fit:cover}.creator-card .card{padding:0}.creator-card .creator-info{padding:18px}.partner-wall{display:grid;grid-template-columns:repeat(6,1fr);gap:12px;margin-top:20px}.partner-logo{min-height:90px;display:grid;place-items:center;border-radius:22px;border:1px solid var(--line);background:linear-gradient(135deg,rgba(0,234,255,.16),rgba(255,46,207,.16));font-weight:1000;text-align:center}.steps{counter-reset:step;display:grid;gap:12px}.steps li{list-style:none;counter-increment:step;padding:16px;border-radius:20px;background:rgba(255,255,255,.08);border:1px solid var(--line)}.steps li:before{content:counter(step);display:inline-grid;place-items:center;margin-right:10px;width:30px;height:30px;border-radius:50%;background:var(--yellow);color:#101018;font-weight:1000}.contact-panel{display:grid;grid-template-columns:1.1fr .9fr;gap:20px}.info-list{display:grid;gap:10px}.info-list p{margin:0;padding:14px;border-radius:18px;background:rgba(255,255,255,.08);border:1px solid var(--line)}
.breadcrumb{padding:16px clamp(16px,4vw,64px);background:rgba(255,255,255,.05);border-top:1px solid var(--line);border-bottom:1px solid var(--line);color:#e8ecff}.breadcrumb a{color:var(--blue);font-weight:900}.article{padding:clamp(36px,6vw,84px) clamp(16px,4vw,64px);max-width:1120px;margin:auto}.article p{font-size:18px;color:#e8ecff}.article-hero{display:grid;grid-template-columns:1fr .8fr;gap:22px;align-items:center}.site-footer{padding:38px clamp(16px,4vw,64px);background:#04040b;border-top:1px solid var(--line)}.footer-grid{display:grid;grid-template-columns:1.2fr .9fr .7fr;gap:22px;align-items:start}.qr-box{display:flex;gap:14px;flex-wrap:wrap}.qr-box figure{margin:0}.qr-box img{border-radius:14px;background:#fff}.share-box{display:flex;gap:8px;flex-wrap:wrap}.share-box a{padding:8px 12px;border-radius:999px;border:1px solid var(--line);background:rgba(255,255,255,.08);font-weight:800}.reveal{opacity:0;transform:translateY(16px);transition:.5s ease}.reveal.is-visible{opacity:1;transform:translateY(0)}
@media (max-width:1080px){.hero,.article-hero,.contact-panel{grid-template-columns:1fr}.cards-4{grid-template-columns:repeat(2,minmax(0,1fr))}.cards-3{grid-template-columns:repeat(2,minmax(0,1fr))}.partner-wall{grid-template-columns:repeat(3,1fr)}.footer-grid{grid-template-columns:1fr}}
@media (max-width:680px){.site-header{padding-inline:14px}.hero,.section,.article{padding-inline:14px}.fake-search{grid-template-columns:1fr}.stat-row,.cards-4,.cards-3,.cards-2{grid-template-columns:1fr}.partner-wall{grid-template-columns:repeat(2,1fr)}h1{text-shadow:3px 3px 0 var(--pink),-2px -2px 0 var(--blue)}.floating-card{position:relative;left:auto;bottom:auto;margin-top:14px}.top-nav a{font-size:14px;padding:8px 10px}}