.review-page { background: #f3f4ef; }
.reading-progress { position: fixed; z-index: 80; top: 0; left: 0; right: 0; height: 3px; background: rgba(255,255,255,.12); }
.reading-progress i { display: block; width: 0; height: 100%; background: var(--acid); }
.review-header { position: absolute; z-index: 20; top: 0; left: 0; right: 0; height: 74px; padding: 0 max(24px, calc((100% - var(--page)) / 2)); display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; color: #fff; border-bottom: 1px solid rgba(255,255,255,.22); }
.review-header nav { display: flex; gap: 30px; font-size: 12px; font-weight: 700; }
.review-header nav a, .review-back { transition: color .2s ease; }
.review-header nav a:hover, .review-back:hover { color: var(--acid); }
.review-back { justify-self: end; display: inline-flex; align-items: center; gap: 8px; font-size: 11px; font-weight: 800; }
.review-back svg { width: 16px; }

.review-hero { position: relative; min-height: 720px; height: 88vh; max-height: 900px; overflow: hidden; color: #fff; background: #080b09; }
.review-hero > img, .review-hero-shade, .review-grid-overlay { position: absolute; inset: 0; width: 100%; height: 100%; }
.review-hero > img { object-fit: cover; object-position: center; filter: contrast(1.06) brightness(.68) saturate(.82); }
.review-hero-shade { background: linear-gradient(90deg, rgba(5,8,6,.97) 0%, rgba(5,8,6,.82) 47%, rgba(5,8,6,.16) 78%), linear-gradient(0deg, rgba(5,8,6,.72), transparent 45%); }
.review-grid-overlay { opacity: .18; background-image: linear-gradient(rgba(255,255,255,.15) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.15) 1px, transparent 1px); background-size: 72px 72px; mask-image: linear-gradient(to right, black, transparent 80%); }
.review-hero-inner { position: relative; z-index: 2; width: min(calc(100% - 48px), var(--page)); height: 100%; margin: auto; padding-top: 148px; display: flex; flex-direction: column; justify-content: center; }
.review-breadcrumb { position: absolute; top: 108px; display: flex; align-items: center; gap: 8px; color: #929a94; font-size: 9px; font-weight: 700; }
.review-breadcrumb svg { width: 12px; }
.review-breadcrumb a:hover { color: #fff; }
.review-signal { display: flex; align-items: center; gap: 11px; margin: 0 0 26px; color: var(--acid); font-size: 10px; font-weight: 900; }
.review-signal i { width: 8px; height: 8px; background: var(--acid); box-shadow: 0 0 0 5px rgba(200,255,46,.15); }
.review-hero h1 { max-width: 920px; margin: 0; font-size: 66px; line-height: 1.1; font-weight: 900; }
.review-deck { max-width: 740px; margin: 24px 0 28px; color: #c1c8c2; font-size: 16px; line-height: 1.8; }
.review-meta { display: flex; align-items: center; gap: 0; color: #8e9690; font-size: 9px; font-weight: 700; }
.review-meta > span, .review-meta > time { padding: 0 15px; border-right: 1px solid #4c534e; }
.review-meta > span:first-child { padding-left: 0; }
.review-meta button { display: inline-flex; align-items: center; gap: 7px; margin-left: 15px; padding: 0; color: #fff; border: 0; background: transparent; cursor: pointer; font-size: 9px; font-weight: 800; }
.review-meta button:hover { color: var(--acid); }
.review-meta button svg { width: 14px; }
.review-score-block { position: absolute; right: 0; bottom: 54px; width: 210px; padding: 19px 0; border-top: 1px solid rgba(255,255,255,.42); border-bottom: 1px solid rgba(255,255,255,.42); }
.review-score-block > span { display: block; margin-bottom: 8px; color: var(--acid); font-size: 9px; font-weight: 900; }
.review-score-block strong { font-size: 68px; line-height: 1; }
.review-score-block small { color: #8e9690; font-size: 10px; }
.review-score-block > i { display: block; height: 3px; margin-top: 14px; background: rgba(255,255,255,.18); }
.review-score-block > i b { display: block; width: 0; height: 100%; background: var(--acid); transition: width .8s ease; }

.review-telemetry { width: min(100%, 1440px); min-height: 104px; margin: auto; display: grid; grid-template-columns: repeat(4, 1fr); color: #fff; background: #0b0e0c; border-bottom: 1px solid #343a35; }
.review-telemetry > div { position: relative; padding: 24px 28px; border-right: 1px solid #343a35; }
.review-telemetry > div:last-child { border-right: 0; }
.review-telemetry span { display: block; margin-bottom: 9px; color: #69716b; font-size: 8px; font-weight: 800; }
.review-telemetry strong { color: var(--cyan); font-size: 17px; }
.review-telemetry small { display: block; margin-top: 5px; color: #a9b0aa; font-size: 9px; }
.review-telemetry em { position: absolute; right: 11px; top: 10px; color: #444b46; font-size: 8px; font-style: normal; }

.review-layout { width: min(calc(100% - 48px), var(--page)); margin: 0 auto; display: grid; grid-template-columns: 190px minmax(0, 720px) 210px; justify-content: space-between; gap: 48px; padding: 92px 0 110px; }
.review-toc, .review-rail { position: sticky; top: 32px; align-self: start; }
.review-toc > p, .review-rail > p { margin: 0 0 20px; color: var(--muted); font-size: 8px; font-weight: 900; }
.review-toc nav { border-top: 1px solid var(--ink); }
.review-toc nav a { display: grid; grid-template-columns: 24px 1fr; gap: 8px; padding: 12px 0; color: #757b76; border-bottom: 1px solid var(--line); font-size: 10px; line-height: 1.4; }
.review-toc nav a span { color: #a2a7a3; font-size: 8px; }
.review-toc nav a.active, .review-toc nav a:hover { color: var(--ink); font-weight: 800; }
.review-toc nav a.active span { color: var(--orange); }
.review-toc > div { margin-top: 32px; padding: 16px; color: #9ba29c; background: var(--ink); border-left: 3px solid var(--cyan); }
.review-toc > div span, .review-toc > div b { display: block; }
.review-toc > div span { margin-bottom: 11px; color: var(--cyan); font-size: 8px; }
.review-toc > div b { margin-top: 7px; color: #c9cec9; font-size: 9px; }

.review-article { min-width: 0; }
.review-loading { padding: 60px 0; color: var(--muted); font-size: 11px; font-weight: 800; }
.review-lead { margin: 0 0 64px; padding: 0 0 30px; font-size: 22px; line-height: 1.72; font-weight: 650; border-bottom: 1px solid var(--ink); }
.review-lead::first-letter { float: left; margin: 8px 10px 0 0; color: var(--orange); font-size: 66px; line-height: .72; font-weight: 900; }
.review-section { scroll-margin-top: 24px; margin-bottom: 74px; }
.review-section-head { display: grid; grid-template-columns: 56px 1fr; align-items: start; padding-top: 14px; border-top: 1px solid var(--ink); }
.review-section-head span { color: var(--orange); font-size: 9px; font-weight: 900; }
.review-section-head p { margin: 0 0 8px; color: var(--muted); font-size: 8px; font-weight: 800; }
.review-section h2 { margin: 0 0 28px; font-size: 34px; line-height: 1.25; }
.review-section > p { margin: 0 0 22px; color: #343935; font-size: 16px; line-height: 1.95; }
.review-facts { display: grid; grid-template-columns: repeat(2, 1fr); margin: 32px 0; border-top: 1px solid var(--ink); border-left: 1px solid var(--ink); }
.review-facts > div { min-height: 118px; padding: 20px; border-right: 1px solid var(--ink); border-bottom: 1px solid var(--ink); background: #fff; }
.review-facts span { display: block; color: var(--muted); font-size: 8px; font-weight: 800; }
.review-facts strong { display: block; margin: 13px 0 7px; font-size: 23px; }
.review-facts small { color: var(--muted); font-size: 9px; line-height: 1.5; }
.review-quote { margin: 34px 0; padding: 26px 28px; color: #fff; background: var(--ink); border-left: 5px solid var(--acid); }
.review-quote p { margin: 0; font-size: 20px; line-height: 1.55; font-weight: 750; }
.review-quote span { display: block; margin-top: 14px; color: #777f79; font-size: 8px; }
.review-source { padding: 22px 24px; color: #aeb5af; background: #181c19; border-left: 3px solid var(--cyan); font-size: 10px; line-height: 1.75; }
.review-source b { color: var(--cyan); }

.review-rail > div { border-top: 1px solid var(--ink); }
.review-rating { padding: 14px 0; border-bottom: 1px solid var(--line); }
.review-rating > div { display: flex; align-items: baseline; justify-content: space-between; }
.review-rating span { font-size: 10px; }
.review-rating strong { font-size: 19px; }
.review-rating i { display: block; height: 3px; margin-top: 9px; background: #d5d8d2; }
.review-rating i b { display: block; height: 100%; background: var(--cyan); }
.review-rating:nth-child(even) i b { background: var(--acid); border: 1px solid #93b82f; }
.review-rail > a { display: flex; justify-content: space-between; align-items: center; margin-top: 22px; font-size: 9px; font-weight: 800; }
.review-rail > a svg { width: 15px; }

.review-verdict { padding: 90px 24px; color: #fff; background-color: #0b0e0c; background-image: linear-gradient(rgba(36,199,217,.055) 1px, transparent 1px), linear-gradient(90deg, rgba(36,199,217,.055) 1px, transparent 1px); background-size: 48px 48px; }
.review-verdict-inner { width: min(100%, var(--page)); margin: auto; display: grid; grid-template-columns: 1.25fr .75fr .75fr; border: 1px solid #3a403b; }
.review-verdict-inner > div { min-height: 300px; padding: 38px; border-right: 1px solid #3a403b; }
.review-verdict-inner > div:last-child { border-right: 0; }
.review-verdict p { margin: 0 0 30px; color: var(--acid); font-size: 9px; font-weight: 900; }
.review-verdict h2 { max-width: 560px; margin: 0 0 24px; font-size: 38px; line-height: 1.2; }
.review-verdict span { display: block; max-width: 600px; color: #aeb5af; font-size: 12px; line-height: 1.8; }
.review-verdict ul { margin: 0; padding: 0; list-style: none; }
.review-verdict li { position: relative; padding: 14px 0 14px 22px; color: #c9cfca; border-top: 1px solid #343a35; font-size: 11px; line-height: 1.55; }
.review-verdict li::before { content: "+"; position: absolute; left: 0; color: var(--acid); font-weight: 900; }
.review-cons li::before { content: "−"; color: var(--orange); }
.review-cons p { color: var(--orange); }

.review-next { width: min(calc(100% - 48px), var(--page)); margin: auto; padding: 88px 0 100px; }
.review-next > p { margin: 0 0 20px; color: var(--muted); font-size: 9px; font-weight: 900; }
.review-next > div { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--ink); border-left: 1px solid var(--ink); }
.review-next a { min-height: 190px; padding: 24px; display: flex; flex-direction: column; border-right: 1px solid var(--ink); border-bottom: 1px solid var(--ink); background: #fff; }
.review-next a:hover { background: var(--acid); }
.review-next a span { color: var(--muted); font-size: 8px; font-weight: 800; }
.review-next a strong { margin: 34px 0 20px; font-size: 18px; line-height: 1.4; }
.review-next a i { margin-top: auto; align-self: flex-end; }
.review-next a svg { width: 18px; }
.review-footer { min-height: 110px; padding: 28px max(24px, calc((100% - var(--page)) / 2)); display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; color: #abb2ac; background: var(--ink); font-size: 9px; }
.review-footer .brand { color: #fff; }
.review-footer > div { justify-self: end; display: flex; gap: 20px; }

@media (max-width: 1050px) {
  .review-layout { grid-template-columns: 160px minmax(0, 1fr); }
  .review-rail { display: none; }
  .review-verdict-inner { grid-template-columns: 1fr 1fr; }
  .review-verdict-inner > div:first-child { grid-column: 1 / -1; border-right: 0; border-bottom: 1px solid #3a403b; }
}

@media (max-width: 760px) {
  .review-header { height: 64px; padding: 0 18px; grid-template-columns: 1fr auto; }
  .review-header nav { display: none; }
  .review-back span { display: none; }
  .review-hero { min-height: 700px; height: 92vh; max-height: 820px; }
  .review-hero > img { object-position: 68% center; }
  .review-hero-shade { background: linear-gradient(90deg, rgba(5,8,6,.94), rgba(5,8,6,.5)), linear-gradient(0deg, rgba(5,8,6,.9), transparent 55%); }
  .review-hero-inner { width: calc(100% - 36px); padding-top: 112px; justify-content: flex-start; }
  .review-breadcrumb { top: 82px; }
  .review-signal { margin-top: 90px; }
  .review-hero h1 { font-size: 40px; line-height: 1.14; }
  .review-deck { margin: 20px 0 24px; font-size: 14px; line-height: 1.72; }
  .review-meta { flex-wrap: wrap; row-gap: 14px; }
  .review-meta > span, .review-meta > time { padding: 0 8px; }
  .review-meta > span:first-child { padding-left: 0; }
  .review-meta button { width: 100%; margin: 0; }
  .review-score-block { left: 0; right: auto; bottom: 30px; width: 150px; }
  .review-score-block strong { font-size: 50px; }
  .review-telemetry { grid-template-columns: repeat(2, 1fr); }
  .review-telemetry > div { min-height: 95px; padding: 18px; border-bottom: 1px solid #343a35; }
  .review-telemetry strong { font-size: 14px; }
  .review-layout { width: calc(100% - 36px); grid-template-columns: 1fr; gap: 0; padding: 58px 0 72px; }
  .review-toc { position: static; margin-bottom: 50px; }
  .review-toc nav { display: grid; grid-template-columns: repeat(2, 1fr); border-left: 1px solid var(--line); }
  .review-toc nav a { padding: 12px; border-right: 1px solid var(--line); }
  .review-toc > div { display: none; }
  .review-lead { margin-bottom: 50px; font-size: 19px; }
  .review-section { margin-bottom: 58px; }
  .review-section h2 { font-size: 28px; }
  .review-section > p { font-size: 15px; line-height: 1.85; }
  .review-facts { grid-template-columns: 1fr; }
  .review-facts > div { min-height: 102px; }
  .review-quote p { font-size: 17px; }
  .review-verdict { padding: 60px 18px; }
  .review-verdict-inner { grid-template-columns: 1fr; }
  .review-verdict-inner > div { min-height: 0; padding: 28px 24px; border-right: 0; border-bottom: 1px solid #3a403b; }
  .review-verdict-inner > div:last-child { border-bottom: 0; }
  .review-verdict h2 { font-size: 30px; }
  .review-next { width: calc(100% - 36px); padding: 62px 0 70px; }
  .review-next > div { grid-template-columns: 1fr; }
  .review-next a { min-height: 150px; }
  .review-footer { grid-template-columns: 1fr auto; gap: 20px; padding: 28px 18px; }
  .review-footer > span { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  .reading-progress i, .review-score-block > i b { transition: none; }
}
