:root{
 --bg:#07090d;--panel:#0e1219;--panel2:#121821;--text:#f5f7fb;--muted:#9ca7b6;
 --line:#252d3a;--green:#6fffc3;--violet:#9a83ff;--cyan:#6ed7ff;--orange:#ffb76e;--max:1180px
}
*{box-sizing:border-box} html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;line-height:1.6}
a{text-decoration:none;color:inherit}.wrap{width:min(var(--max),calc(100% - 36px));margin:auto}
.topbar{position:sticky;top:0;z-index:50;background:rgba(7,9,13,.88);backdrop-filter:blur(18px);border-bottom:1px solid var(--line)}
.nav{height:72px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.logo{display:flex;align-items:center;gap:10px;font-weight:900;letter-spacing:.06em}
.logo-mark{width:34px;height:34px;display:grid;place-items:center;border-radius:10px;background:linear-gradient(135deg,var(--green),var(--cyan));color:#06100d;box-shadow:0 0 32px rgba(111,255,195,.22)}
.nav nav{display:flex;gap:24px;font-size:14px;color:var(--muted)}.nav nav a:hover{color:#fff}
.icon-btn{width:40px;height:40px;border-radius:10px;background:#0d1117;border:1px solid var(--line);color:#fff;font-size:23px;cursor:pointer}
.search-panel{display:none;padding:12px 0;border-top:1px solid var(--line);background:#0b0f15}.search-panel.open{display:block}
.search-panel input{width:100%;background:#090d13;border:1px solid var(--line);border-radius:12px;padding:14px;color:white;font-size:16px}

.hero{position:relative;overflow:hidden;padding:90px 0 76px;background:
radial-gradient(circle at 75% 35%,rgba(154,131,255,.18),transparent 28%),
radial-gradient(circle at 15% 20%,rgba(111,255,195,.08),transparent 24%),
linear-gradient(180deg,#0b0f16,#07090d)}
.hero:after{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);background-size:38px 38px;mask-image:linear-gradient(to bottom,black,transparent)}
.hero-grid{position:relative;z-index:2;display:grid;grid-template-columns:1.08fr .92fr;align-items:center;gap:72px}
.eyebrow,.kicker{font-size:11px;font-weight:900;letter-spacing:.18em;color:var(--green)}
.hero h1{font-size:clamp(50px,7.5vw,88px);line-height:.93;letter-spacing:-.06em;margin:16px 0 26px}.hero h1 span{color:var(--green)}
.hero p{font-size:19px;color:var(--muted);max-width:650px}
.hero-cta{display:flex;gap:12px;margin:32px 0}.btn{display:inline-flex;align-items:center;justify-content:center;border-radius:12px;padding:13px 18px;font-weight:800;border:1px solid transparent}
.btn.primary{background:var(--green);color:#05100c}.btn.secondary{border-color:var(--line);background:#0d1118}
.trust-row{display:flex;gap:18px;flex-wrap:wrap;color:var(--muted);font-size:12px}
.hero-visual{position:relative;min-height:390px}.screen-card{position:absolute;inset:30px 0 20px 30px;border:1px solid #303949;background:linear-gradient(145deg,#151b26,#0b0f15);border-radius:24px;transform:perspective(1100px) rotateY(-8deg) rotateX(3deg);box-shadow:0 40px 100px rgba(0,0,0,.48)}
.screen-top{height:42px;border-bottom:1px solid var(--line);display:flex;gap:7px;align-items:center;padding:0 14px}.screen-top span{width:8px;height:8px;border-radius:50%;background:#333c49}
.screen-body{position:relative;height:calc(100% - 42px);overflow:hidden}.score{position:absolute;right:22px;top:20px;font-size:50px;font-weight:900;color:var(--green)}
.screen-lines{position:absolute;left:24px;top:35px;width:45%;display:grid;gap:12px}.screen-lines i{height:9px;border-radius:8px;background:#283140}.screen-lines i:nth-child(2){width:80%}.screen-lines i:nth-child(3){width:60%}
.fake-product{position:absolute;left:12%;right:12%;bottom:16px;height:185px}.monitor{position:absolute;right:20px;top:0;width:210px;height:120px;border:10px solid #222a35;border-radius:8px;background:linear-gradient(135deg,#231c48,#12342f);box-shadow:0 16px 30px rgba(0,0,0,.3)}.monitor:after{content:"";position:absolute;width:8px;height:55px;background:#2a3441;bottom:-55px;left:50%}
.wheel{position:absolute;left:24px;bottom:18px;width:118px;height:118px;border:14px solid #2b3441;border-radius:50%;display:grid;place-items:center;font-size:58px;color:#49586a}
.float-chip{position:absolute;padding:9px 12px;border:1px solid var(--line);background:rgba(12,16,22,.94);border-radius:999px;font-size:12px;font-weight:800;box-shadow:0 14px 30px rgba(0,0,0,.35)}.chip-a{right:-8px;top:20px}.chip-b{left:0;bottom:55px}.chip-c{right:4px;bottom:10px;color:var(--green)}
.ticker{border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:#0b0e14}.ticker .wrap{min-height:56px;display:flex;align-items:center;gap:22px;overflow:auto;white-space:nowrap;color:var(--muted);font-size:13px}.ticker strong{color:#fff}.ticker a:hover{color:var(--green)}

.section{padding:78px 0}.dark-section{background:#0b0e14;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.section-title{display:flex;justify-content:space-between;align-items:end;gap:30px;margin-bottom:28px}.section-title h2{font-size:38px;line-height:1.05;margin:6px 0 0;letter-spacing:-.035em}.section-title p{max-width:520px;color:var(--muted);font-size:14px;margin:0}
.feature-grid,.card-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.feature-card,.content-card{position:relative;overflow:hidden;border:1px solid var(--line);background:linear-gradient(180deg,#121821,#0d1118);border-radius:18px;padding:24px;transition:.2s}.feature-card:hover,.content-card:hover{transform:translateY(-4px);border-color:#3a4657}
.feature-card:before{content:"";position:absolute;width:180px;height:180px;border-radius:50%;right:-70px;top:-90px;filter:blur(10px);opacity:.22}.neon-a:before{background:var(--green)}.neon-b:before{background:var(--violet)}.neon-c:before{background:var(--cyan)}
.pill{display:inline-block;border:1px solid rgba(111,255,195,.25);color:var(--green);border-radius:999px;padding:5px 8px;font-size:10px;font-weight:900;letter-spacing:.12em}.feature-icon{font-size:46px;margin:30px 0 12px}.feature-card h3,.content-card h3{font-size:22px;line-height:1.18;margin:8px 0}.feature-card p,.content-card p{color:var(--muted);font-size:14px}.more{color:var(--green);font-size:13px;font-weight:800}
.content-card{padding:0}.card-art{height:160px;padding:18px;display:flex;align-items:flex-end;background:linear-gradient(135deg,#1a2030,#101722)}.card-art.sim{background:linear-gradient(135deg,#231b39,#101722)}.card-art.game{background:linear-gradient(135deg,#162f28,#121623)}.card-body{padding:20px}.card-meta{display:flex;justify-content:space-between;color:var(--muted);font-size:10px;letter-spacing:.08em}.rating{color:var(--green);font-weight:900}
.split-panel{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:55px;border:1px solid var(--line);border-radius:22px;padding:44px;background:linear-gradient(135deg,#111722,#0b0f15)}.split-panel h2{font-size:40px;margin:8px 0 14px}.split-panel p{color:var(--muted);margin-bottom:26px}
.rig-diagram{height:290px;position:relative}.rig-monitor{position:absolute;right:20px;top:0;width:260px;height:95px;border:8px solid #252e3a;border-radius:10px;background:#141c27;display:grid;place-items:center;color:#657286;font-size:12px;letter-spacing:.14em}.rig-wheel{position:absolute;left:65px;top:80px;width:112px;height:112px;border:12px solid #303a48;border-radius:50%;display:grid;place-items:center;font-size:46px}.rig-seat{position:absolute;right:50px;bottom:10px;width:150px;height:115px;border:12px solid #242c37;border-radius:60px 60px 20px 20px}.rig-base{position:absolute;left:20px;right:0;height:14px;background:#252e3a;bottom:20px;transform:skewX(-12deg)}
.affiliate-note{padding:36px;border:1px solid var(--line);border-radius:18px;background:linear-gradient(90deg,rgba(111,255,195,.06),rgba(110,215,255,.04))}.affiliate-note h2{font-size:32px;margin:6px 0}.affiliate-note p{color:var(--muted);max-width:780px}
.footer{padding:34px 0;display:flex;justify-content:space-between;align-items:center;gap:20px;color:var(--muted);font-size:12px}.footer-links{display:flex;gap:18px}

.article-hero{padding:65px 0 40px;border-bottom:1px solid var(--line);background:linear-gradient(180deg,#111722,#07090d)}.narrow{max-width:900px}.breadcrumbs{display:flex;gap:8px;color:var(--muted);font-size:12px;margin-bottom:24px}.article-hero h1{font-size:clamp(42px,6vw,68px);line-height:1;letter-spacing:-.045em;margin:16px 0}.deck{font-size:19px;color:var(--muted);max-width:760px}.article-meta{display:flex;gap:8px;color:var(--muted);font-size:12px}
.article-layout{display:grid;grid-template-columns:210px minmax(0,760px);gap:58px;justify-content:center;padding:54px 0 90px}.toc{position:sticky;top:95px;height:max-content;display:flex;flex-direction:column;gap:9px;font-size:12px}.toc strong{font-size:10px;letter-spacing:.14em;color:var(--muted);margin-bottom:4px}.toc a{color:#b6c0cc}
.article-content h2{font-size:31px;line-height:1.15;margin-top:46px;scroll-margin-top:100px}.article-content h3{font-size:21px}.article-content p,.article-content li{color:#c0c8d2}.callout,.product-box{border:1px solid var(--line);border-radius:15px;background:var(--panel);padding:20px}.callout{border-left:3px solid var(--green)}.callout p{margin-bottom:0}.ad-slot{height:105px;border:1px dashed #3a4658;border-radius:12px;display:grid;place-items:center;margin:34px 0;color:#667386;font-size:11px;letter-spacing:.13em}.product-box{display:grid;grid-template-columns:180px 1fr;gap:20px;align-items:center}.product-thumb{height:140px;border-radius:11px;background:linear-gradient(135deg,#182232,#10151d);display:grid;place-items:center;color:#667386;font-size:11px;letter-spacing:.14em}.buy-row{display:flex;align-items:center;gap:12px}.buy-row small{color:var(--muted)}details{border-top:1px solid var(--line);padding:15px 0}summary{cursor:pointer;font-weight:800}

.hidden{display:none!important}
@media(max-width:900px){
 .nav nav{display:none}.hero-grid,.split-panel,.article-layout{grid-template-columns:1fr}.hero-visual{min-height:330px}.feature-grid,.card-grid{grid-template-columns:1fr 1fr}.toc{position:static}.section-title{align-items:flex-start;flex-direction:column}.footer{align-items:flex-start;flex-direction:column}
}
@media(max-width:620px){
 .hero{padding:58px 0}.hero-visual{display:none}.feature-grid,.card-grid{grid-template-columns:1fr}.hero-cta{flex-direction:column}.section{padding:58px 0}.split-panel{padding:28px}.rig-diagram{display:none}.product-box{grid-template-columns:1fr}
}

/* Image-ready content system */
.card-art{position:relative;overflow:hidden}
.card-image{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.card-art:after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(6,8,12,.72),rgba(6,8,12,.03) 60%)}
.card-pill{position:relative;z-index:2}
.article-hero-image{display:block;width:100%;max-height:480px;object-fit:cover;border:1px solid var(--line);border-radius:18px;margin-top:28px;background:var(--panel)}
.product-thumb{overflow:hidden}
.product-thumb img{width:100%;height:100%;object-fit:cover;display:block}

.product-thumb img{background:#fff;object-fit:contain;padding:10px}
.reader-note{margin:32px 0;padding:18px 20px;border:1px solid var(--line);border-radius:14px;background:rgba(255,255,255,.025)}
.reader-note strong{display:block;margin-bottom:6px}
.reader-note p{margin:0;color:var(--muted)}

/* Product/image presentation */
.card-art{background:#0b1016}
.card-image{width:100%;height:100%;object-fit:cover}
.article-hero-image{width:100%;object-fit:contain;background:#fff;padding:18px}

/* Distinct product photography */
.card-image-pair{position:absolute;inset:0;display:grid;grid-template-columns:1fr 1fr;background:#fff}
.card-image-pair img{width:100%;height:100%;object-fit:contain;padding:8px;min-width:0}
.article-hero-gallery{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:28px}
.article-hero-gallery[data-count="1"]{grid-template-columns:1fr}
.article-hero-gallery[data-count="3"]{grid-template-columns:repeat(3,minmax(0,1fr))}
.article-product-shot{margin:0;min-height:260px;background:#fff;border:1px solid var(--line);border-radius:18px;overflow:hidden;display:flex;align-items:center;justify-content:center}
.article-product-shot img{width:100%;height:100%;max-height:430px;object-fit:contain;padding:16px}
@media(max-width:760px){
  .article-hero-gallery,.article-hero-gallery[data-count="3"]{grid-template-columns:1fr}
  .article-product-shot{min-height:210px}
}

.related-section{margin-top:42px}
.related-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.related-card{display:block;border:1px solid var(--line);border-radius:16px;overflow:hidden;background:var(--panel);text-decoration:none;color:inherit}
.related-thumb{height:150px;background:#fff}
.related-thumb img{width:100%;height:100%;object-fit:contain;padding:10px}
.related-card>div:last-child{padding:14px}
.related-card h3{font-size:1rem;line-height:1.25;margin:10px 0 12px}
@media(max-width:820px){.related-grid{grid-template-columns:1fr}}

.sources-section,.methodology-section{margin-top:42px;padding-top:8px}
.source-intro{color:var(--muted);max-width:760px}
.sources-list{margin:14px 0 0;padding-left:20px}
.sources-list li{margin:9px 0}
.sources-list a{text-decoration:underline;text-underline-offset:3px}
.methodology-section{padding:22px;border:1px solid var(--line);border-radius:16px;background:rgba(255,255,255,.025)}
.methodology-section h2{margin-top:6px}
.methodology-section p{margin-bottom:0;color:var(--muted)}


/* Custom hero art */
.hero.hero--image{
  background:
    linear-gradient(90deg, rgba(5,8,14,.88) 0%, rgba(5,8,14,.78) 34%, rgba(5,8,14,.48) 58%, rgba(5,8,14,.60) 100%),
    radial-gradient(circle at 62% 50%, rgba(0,240,255,.10), transparent 24%),
    var(--hero-bg) center/cover no-repeat;
  min-height:560px;
}
.hero.hero--image .hero-visual{display:none}
.hero.hero--image .hero-copy{max-width:660px}
.hero.hero--image .hero-copy p{max-width:58ch}
.hero.hero--image .hero-grid{grid-template-columns:1fr}

/* Image-backed section headers */
.section--image{
  position:relative;
  overflow:hidden;
  border:1px solid var(--line);
  border-radius:24px;
  margin-top:28px;
  padding:28px 24px 18px;
  background:
    linear-gradient(90deg, rgba(5,8,14,.92) 0%, rgba(5,8,14,.80) 38%, rgba(5,8,14,.58) 62%, rgba(5,8,14,.72) 100%),
    var(--section-bg) center/cover no-repeat;
}
.section--image .section-title,
.section--image .card-grid{position:relative;z-index:2}
.section--image .section-title{margin-bottom:18px}
.section--image .section-title p{max-width:56ch}
.section--image .content-card{background:rgba(9,14,21,.78);backdrop-filter:blur(4px)}

/* Sim niche block with custom image */
.section--sim-image{
  position:relative;
  overflow:hidden;
  background:
    linear-gradient(90deg, rgba(5,8,14,.92) 0%, rgba(5,8,14,.80) 36%, rgba(5,8,14,.55) 58%, rgba(5,8,14,.66) 100%),
    var(--sim-bg) center/cover no-repeat;
}
.section--sim-image .wrap.section{position:relative;z-index:2}
.section--sim-image .split-panel{
  border:none;
  background:transparent;
  padding:12px 0;
}
.section--sim-image .split-panel > div:first-child{
  max-width:54ch;
}
.section--sim-image .rig-diagram{display:none}
.section--sim-image .btn.primary{
  box-shadow:0 10px 30px rgba(0,0,0,.24);
}

@media (max-width:860px){
  .hero.hero--image{
    min-height:500px;
    background:
      linear-gradient(180deg, rgba(5,8,14,.86) 0%, rgba(5,8,14,.74) 46%, rgba(5,8,14,.66) 100%),
      var(--hero-bg) center/cover no-repeat;
  }
  .section--image{
    padding:22px 16px 16px;
    border-radius:20px;
  }
  .section--sim-image{
    background:
      linear-gradient(180deg, rgba(5,8,14,.88) 0%, rgba(5,8,14,.76) 46%, rgba(5,8,14,.68) 100%),
      var(--sim-bg) center/cover no-repeat;
  }
}