:root{--bg:#070714;--panel:#111126;--panel2:#171730;--ink:#f6f4ff;--muted:#a8a4bd;--violet:#9d6cff;--cyan:#38d8ff;--line:#2b2950;--max:1180px}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:radial-gradient(circle at 85% 0,#24134b 0,transparent 28%),var(--bg);color:var(--ink);font:16px/1.72 system-ui,-apple-system,"Microsoft YaHei",sans-serif}a{color:inherit;text-decoration:none}img{display:block;width:100%;object-fit:cover}header{position:sticky;top:0;z-index:20;background:#070714eF;border-bottom:1px solid var(--line);backdrop-filter:blur(14px)}.nav{max-width:var(--max);margin:auto;min-height:70px;display:flex;align-items:center;gap:26px;padding:0 20px}.logo{font-weight:900;font-size:22px;letter-spacing:.08em;margin-right:auto}.logo b{color:var(--cyan)}nav{display:flex;gap:20px;flex-wrap:wrap}nav a{font-size:14px;color:#d7d3e5}nav a:hover{color:var(--cyan)}.container{max-width:var(--max);margin:auto;padding:0 20px}.hero{display:grid;grid-template-columns:1.08fr .92fr;gap:30px;align-items:center;padding:56px 0 36px}.eyebrow,.tag{color:var(--cyan);font-weight:800;font-size:13px;letter-spacing:.08em}.hero h1{font-size:clamp(38px,6vw,72px);line-height:1.05;margin:12px 0 18px}.hero p{font-size:18px;color:#c6c2d3;max-width:680px}.hero-media{position:relative;border:1px solid var(--line);border-radius:24px;overflow:hidden;box-shadow:0 24px 90px #0008}.hero-media img{height:480px}.badge{position:absolute;left:18px;top:18px;background:#0a0a18dc;border:1px solid #ffffff2b;border-radius:999px;padding:7px 12px;font-size:12px}.actions{display:flex;gap:12px;margin-top:24px}.btn{display:inline-block;padding:12px 18px;border-radius:10px;background:linear-gradient(90deg,var(--violet),#6755ff);font-weight:800}.btn.ghost{background:transparent;border:1px solid var(--line)}.metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:10px 0 52px}.metric{background:var(--panel);border:1px solid var(--line);padding:20px;border-radius:14px}.metric strong{display:block;font-size:26px}.section{padding:34px 0}.section-head{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:18px}.section h2{font-size:30px;margin:0}.section-head p,.muted{color:var(--muted)}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.card{background:linear-gradient(160deg,var(--panel2),var(--panel));border:1px solid var(--line);border-radius:15px;overflow:hidden;transition:.2s}.card:hover{transform:translateY(-4px);border-color:#5f58a0}.thumb{position:relative}.thumb img{height:205px}.play{position:absolute;inset:0;display:grid;place-items:center}.play i{width:52px;height:52px;border-radius:50%;background:#0a0a18cf;border:1px solid #fff6;display:grid;place-items:center;font-style:normal;font-size:20px}.duration{position:absolute;right:10px;bottom:10px;background:#000c;padding:3px 7px;border-radius:5px;font-size:12px}.card-body{padding:16px}.card h3{margin:5px 0 6px;font-size:19px}.card p{margin:0;color:var(--muted);font-size:14px}.feature{display:grid;grid-template-columns:1fr 1fr;gap:26px;background:var(--panel);border:1px solid var(--line);padding:24px;border-radius:18px}.feature img{height:340px;border-radius:12px}.feature h2{font-size:34px}.chips{display:flex;flex-wrap:wrap;gap:8px}.chip{padding:7px 11px;border-radius:999px;background:#1e1d3e;color:#cec9ff;font-size:13px}.timeline{display:grid;gap:0}.time-row{display:grid;grid-template-columns:100px 1fr;gap:18px;border-top:1px solid var(--line);padding:18px 0}.time-row strong{color:var(--cyan)}.category-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.category{background:linear-gradient(145deg,#191833,#0e0e21);border:1px solid var(--line);padding:22px;border-radius:14px}.category b{display:block;font-size:30px;margin-bottom:8px}.category strong{font-size:18px}.category p{color:var(--muted);font-size:14px;margin-bottom:0}.rank-list{counter-reset:rank;display:grid;gap:0}.rank-item{counter-increment:rank;display:grid;grid-template-columns:48px 1fr auto;gap:14px;align-items:center;border-top:1px solid var(--line);padding:16px 0}.rank-item:before{content:counter(rank,decimal-leading-zero);font-weight:900;color:var(--violet);font-size:22px}.rank-item small{color:var(--muted)}.essay{columns:2;column-gap:36px;color:#cbc7d7}.essay p:first-child{margin-top:0}.guide-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}.guide-step{background:var(--panel);border:1px solid var(--line);padding:18px;border-radius:13px}.guide-step b{color:var(--cyan);font-size:22px}.faq{display:grid;grid-template-columns:1fr 1fr;gap:14px}.faq details{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:16px 18px}.faq summary{cursor:pointer;font-weight:800}.faq p{color:var(--muted)}.article{max-width:860px;margin:auto;padding:54px 20px}.article h1{font-size:46px;line-height:1.15}.article h2{font-size:28px;margin-top:38px}.article p,.article li{color:#c9c6d4}.article .lead{font-size:20px}.article figure{margin:25px 0}.article figure img{height:440px;border-radius:18px}.notice{border-left:3px solid var(--cyan);background:#101126;padding:16px 20px;color:#cfccdb;margin:28px 0}.two-col{display:grid;grid-template-columns:1fr 1fr;gap:22px}.panel{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:22px}.panel h3{margin-top:0}.breadcrumb{color:var(--muted);font-size:13px;margin-top:26px}footer{border-top:1px solid var(--line);margin-top:60px;background:#05050d}.footer{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:30px;padding:45px 20px}.footer a{display:block;color:#aaa6bc;margin:5px 0}.legal{border-top:1px solid var(--line);padding:20px;color:#8d899e;font-size:13px}.skip{position:absolute;left:-9999px}.skip:focus{left:10px;top:10px;z-index:99;background:white;color:black;padding:8px}@media(max-width:850px){.hero,.feature,.two-col{grid-template-columns:1fr}.hero-media img{height:330px}.grid,.faq{grid-template-columns:repeat(2,1fr)}.category-grid{grid-template-columns:repeat(2,1fr)}.guide-grid{grid-template-columns:repeat(2,1fr)}nav{display:none}.metrics{grid-template-columns:repeat(2,1fr)}.footer{grid-template-columns:1fr}.article h1{font-size:36px}.essay{columns:1}}@media(max-width:520px){.grid,.faq,.category-grid,.guide-grid{grid-template-columns:1fr}.thumb img{height:220px}.article figure img{height:260px}.time-row{grid-template-columns:70px 1fr}.rank-item{grid-template-columns:40px 1fr}.rank-item small{grid-column:2}}