/* =========================================================================
   Rankesh Rank — category landing + entity box.
   Scoped under .rk-rank. Colour driven by the theme vars (--jkd-*), so it
   auto-matches brand + light/dark. RTL-first. Reduced-motion aware.
   ========================================================================= */

/* Real PeydaWeb display weights (theme maps every weight to Regular). */
@font-face { font-family:"rkdisplay"; font-weight:400; font-display:swap; src:url("/fonts/woff2/PeydaWeb-Regular.woff2") format("woff2"),url("/fonts/woff/PeydaWeb-Regular.woff") format("woff"); }
@font-face { font-family:"rkdisplay"; font-weight:500; font-display:swap; src:url("/fonts/woff2/PeydaWeb-Medium.woff2") format("woff2"),url("/fonts/woff/PeydaWeb-Medium.woff") format("woff"); }
@font-face { font-family:"rkdisplay"; font-weight:600; font-display:swap; src:url("/fonts/woff2/PeydaWeb-SemiBold.woff2") format("woff2"),url("/fonts/woff/PeydaWeb-SemiBold.woff") format("woff"); }
@font-face { font-family:"rkdisplay"; font-weight:700; font-display:swap; src:url("/fonts/woff2/PeydaWeb-Bold.woff2") format("woff2"),url("/fonts/woff/PeydaWeb-Bold.woff") format("woff"); }
@font-face { font-family:"rkdisplay"; font-weight:800; font-display:swap; src:url("/fonts/woff2/PeydaWeb-ExtraBold.woff2") format("woff2"),url("/fonts/woff/PeydaWeb-ExtraBold.woff") format("woff"); }
@font-face { font-family:"rkdisplay"; font-weight:900; font-display:swap; src:url("/fonts/woff2/PeydaWeb-Black.woff2") format("woff2"),url("/fonts/woff/PeydaWeb-Black.woff") format("woff"); }

.rk-rank {
  --rk-display:"rkdisplay","PeydaWeb",Tahoma,system-ui,sans-serif;
  --rk-brand:var(--jkd-pr-col,#81d742);
  --rk-1:var(--jkd-pr-col,#81d742); --rk-2:#1fc77d; --rk-3:#10b4c9; --rk-4:#6a5cff; --rk-5:#ffb020;
  --rk-ink:var(--jkd-h-col,#0b0d10); --rk-text:var(--jkd-txt-col,#4a4a4a);
  --rk-bg:var(--jkd-bg-col,#fff); --rk-bg-2:var(--jkd-bg-col-sec,#f4f3f3);
  --rk-surface:rgba(255,255,255,.72); --rk-hair:rgba(16,22,26,.10); --rk-hair-2:rgba(16,22,26,.16);
  --rk-shadow:0 10px 40px -12px rgba(16,22,26,.22); --rk-shadow-lg:0 30px 80px -28px rgba(16,22,26,.35);
  --rk-r-sm:12px; --rk-r:18px; --rk-r-lg:26px; --rk-r-xl:34px;
  --rk-maxw:1140px; --rk-pad:clamp(16px,5vw,56px);
  --rk-ease:cubic-bezier(.16,1,.3,1);
  position:relative; overflow-x:clip;
}
[data-cs="dark"] .rk-rank {
  --rk-surface:rgba(40,43,48,.62); --rk-hair:rgba(255,255,255,.10); --rk-hair-2:rgba(255,255,255,.18);
  --rk-shadow:0 14px 44px -16px rgba(0,0,0,.6); --rk-shadow-lg:0 36px 90px -30px rgba(0,0,0,.72);
}
.rk-rank * { box-sizing:border-box; }
.rk-rank h1,.rk-rank h2,.rk-rank h3,.rk-rank h4,.rk-rank .rk-eyebrow,.rk-rank .rk-btn,.rk-rank b,.rk-rank strong,
.rk-rank .rke-ring__v,.rk-rank .rkx-champ__name,.rk-rank .rkx-rank__name,.rk-rank .rkx-rank__n,.rk-rank .rkx-badge,
.rk-rank .rkx-mini__score,.rk-rank .rkx-mini__name,.rk-rank .rke-bar__v,.rk-rank .rke-stars b { font-family:var(--rk-display); }

.rk-container { width:100%; max-width:var(--rk-maxw); margin-inline:auto; padding-inline:var(--rk-pad); }

/* Shared primitives ----------------------------------------------------- */
.rk-rank .rk-eyebrow { display:inline-flex; align-items:center; gap:9px; font-size:13px; font-weight:700; color:var(--rk-brand);
  padding:7px 14px; border-radius:999px; background:color-mix(in srgb,var(--rk-brand) 12%,transparent); border:1px solid color-mix(in srgb,var(--rk-brand) 32%,transparent); }
.rk-rank .rk-dot { width:7px; height:7px; border-radius:50%; background:var(--rk-brand); }
.rk-rank .rk-h2 { font-size:clamp(24px,3.8vw,42px); line-height:1.2; font-weight:800; letter-spacing:-.01em; color:var(--rk-ink); margin:14px 0 0; }
.rk-rank .rk-grad-text { background:linear-gradient(110deg,var(--rk-1),var(--rk-3) 70%,var(--rk-4)); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; color:transparent; }
.rk-rank .rk-btn { display:inline-flex; align-items:center; justify-content:center; gap:9px; font-size:15px; font-weight:700; padding:13px 22px; border-radius:999px; text-decoration:none; border:1px solid transparent; cursor:pointer; transition:transform .35s var(--rk-ease),box-shadow .35s var(--rk-ease),background .3s; }
.rk-rank .rk-btn svg { width:18px; height:18px; }
.rk-rank .rk-btn--sm { padding:9px 16px; font-size:13.5px; }
.rk-rank .rk-btn--primary { color:#06210d; background:linear-gradient(120deg,var(--rk-1),var(--rk-2) 70%,var(--rk-3)); box-shadow:0 12px 32px -12px color-mix(in srgb,var(--rk-brand) 70%,transparent); }
.rk-rank .rk-btn--primary:hover { transform:translateY(-2px); box-shadow:0 20px 46px -14px color-mix(in srgb,var(--rk-brand) 80%,transparent); }
.rk-rank .rk-btn--ghost { color:var(--rk-ink); background:var(--rk-surface); border-color:var(--rk-hair-2); backdrop-filter:blur(10px); }
.rk-rank .rk-btn--ghost:hover { transform:translateY(-2px); border-color:color-mix(in srgb,var(--rk-brand) 55%,transparent); }
.rk-rank .rk-reveal { opacity:0; transform:translateY(24px); }
.rk-rank .rk-reveal.is-in { opacity:1; transform:none; transition:opacity .7s var(--rk-ease),transform .7s var(--rk-ease); }

/* Breadcrumb ------------------------------------------------------------ */
.rkx-crumb { display:flex; flex-wrap:wrap; align-items:center; gap:8px; font-size:13px; color:var(--rk-text); margin-bottom:18px; }
.rkx-crumb a { color:var(--rk-text); text-decoration:none; }
.rkx-crumb a:hover { color:var(--rk-brand); }
.rkx-crumb .sep { opacity:.5; }
.rkx-crumb .cur { color:var(--rk-ink); font-weight:600; }

/* HERO ------------------------------------------------------------------ */
.rkx-hero { position:relative; padding-block:clamp(34px,6vw,72px) clamp(28px,4vw,52px); overflow:clip; isolation:isolate; }
.rkx-hero__bg { position:absolute; inset:-20% -10% auto -10%; height:120%; z-index:-1; filter:blur(10px) saturate(120%); opacity:.5; pointer-events:none; }
[data-cs="dark"] .rkx-hero__bg { opacity:.66; }
.rk-blob { position:absolute; border-radius:50%; filter:blur(46px); mix-blend-mode:screen; }
[data-cs="light"] .rk-blob { mix-blend-mode:multiply; opacity:.7; }
.rk-blob--1 { width:40vw; height:40vw; inset-inline-start:-6vw; top:-10vw; background:radial-gradient(circle at 30% 30%,var(--rk-1),transparent 62%); animation:rkfl 20s ease-in-out infinite; }
.rk-blob--2 { width:34vw; height:34vw; inset-inline-end:-4vw; top:-6vw; background:radial-gradient(circle at 60% 40%,var(--rk-3),transparent 62%); animation:rkfl 26s ease-in-out infinite reverse; }
@keyframes rkfl { 50% { transform:translate3d(4vw,3vw,0) scale(1.1); } }
.rkx-title { font-family:var(--rk-display); font-weight:900; font-size:clamp(30px,5.6vw,60px); line-height:1.12; letter-spacing:-.02em; color:var(--rk-ink); margin:18px 0 0; }
.rkx-intro { font-size:clamp(15px,2vw,18.5px); line-height:1.95; color:var(--rk-text); max-width:62ch; margin:16px 0 0; }
.rkx-criteria { display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin-top:22px; }
.rkx-criteria__t { font-size:13px; font-weight:700; color:var(--rk-ink); }
.rkx-chip { font-size:13px; font-weight:600; color:var(--rk-ink); padding:6px 14px; border-radius:999px; background:var(--rk-bg-2); border:1px solid var(--rk-hair); }
.rkx-meta { display:flex; flex-wrap:wrap; align-items:center; gap:10px; margin-top:20px; font-size:13.5px; color:var(--rk-text); }
.rkx-meta b { color:var(--rk-ink); }
.rkx-meta .dot { opacity:.4; }

/* SECTION HEAD ---------------------------------------------------------- */
.rkx-shead { margin-bottom:clamp(22px,3vw,36px); }
.rkx-board,.rkx-article,.rkx-all,.rkx-faq,.rkx-empty { padding-block:clamp(28px,4vw,52px); }

/* CHAMPION (#1) --------------------------------------------------------- */
.rkx-champ { position:relative; display:grid; grid-template-columns:auto 1fr auto; gap:clamp(18px,3vw,34px); align-items:center;
  padding:clamp(22px,3vw,38px); border-radius:var(--rk-r-xl);
  background:radial-gradient(120% 130% at 100% 0%,color-mix(in srgb,var(--rk-brand) 16%,transparent),transparent 55%),var(--rk-surface);
  border:1px solid var(--rk-hair-2); box-shadow:var(--rk-shadow-lg); backdrop-filter:blur(16px); overflow:hidden; }
.rkx-champ__rank { display:flex; flex-direction:column; align-items:center; gap:6px; color:var(--rk-5); }
.rkx-champ__rank svg { width:40px; height:40px; }
.rkx-champ__rank b { font-size:24px; font-weight:900; color:var(--rk-ink); }
.rkx-champ__id { display:flex; gap:16px; align-items:center; }
.rkx-logo { width:74px; height:74px; border-radius:18px; object-fit:contain; background:var(--rk-bg); border:1px solid var(--rk-hair); padding:8px; flex:0 0 auto; }
.rkx-logo--ph { display:grid; place-items:center; color:var(--rk-brand); background:color-mix(in srgb,var(--rk-brand) 12%,transparent); }
.rkx-logo--ph svg { width:38px; height:38px; }
.rkx-badge { display:inline-flex; align-items:center; gap:6px; font-size:12px; font-weight:800; color:#06210d; padding:5px 11px; border-radius:999px; background:linear-gradient(120deg,var(--rk-5),#ff8a3c); }
.rkx-badge svg { width:14px; height:14px; }
.rkx-champ__name { font-size:clamp(20px,2.6vw,28px); font-weight:800; margin:8px 0 0; line-height:1.3; }
.rkx-champ__name a { color:var(--rk-ink); text-decoration:none; }
.rkx-champ__tag { font-size:14px; color:var(--rk-text); margin:6px 0 0; }
.rkx-champ__pros { list-style:none; margin:16px 0 0; padding:0; display:flex; flex-wrap:wrap; gap:8px 18px; }
.rkx-champ__pros li { display:flex; align-items:center; gap:7px; font-size:13.5px; color:var(--rk-ink); }
.rkx-champ__pros svg { width:16px; height:16px; color:var(--rk-2); }
.rkx-champ__cta { display:flex; flex-wrap:wrap; gap:10px; margin-top:20px; }
.rkx-champ__score { align-self:start; }

/* RANK ROWS (#2..) ------------------------------------------------------ */
.rkx-ranks { list-style:none; margin:18px 0 0; padding:0; display:grid; gap:12px; }
.rkx-rank { display:grid; grid-template-columns:auto auto 1fr auto auto; gap:16px; align-items:center; padding:16px 20px;
  border-radius:var(--rk-r-lg); background:var(--rk-surface); border:1px solid var(--rk-hair); transition:transform .35s var(--rk-ease),box-shadow .35s var(--rk-ease),border-color .35s; }
.rkx-rank:hover { transform:translateX(-5px); box-shadow:var(--rk-shadow); border-color:color-mix(in srgb,var(--rk-brand) 40%,transparent); }
.rkx-rank__n { width:34px; text-align:center; font-size:22px; font-weight:900; color:var(--rk-text); }
.rkx-rank__logo { width:50px; height:50px; border-radius:13px; object-fit:contain; background:var(--rk-bg); border:1px solid var(--rk-hair); padding:6px; }
.rkx-rank__body { min-width:0; }
.rkx-rank__name { display:inline-flex; align-items:center; gap:8px; font-size:16.5px; font-weight:800; color:var(--rk-ink); text-decoration:none; }
.rkx-rank__name:hover { color:var(--rk-brand); }
.rkx-tag,.rkx-rank__tag { font-size:12px; font-weight:600; }
.rkx-tag { color:var(--rk-brand); background:color-mix(in srgb,var(--rk-brand) 12%,transparent); padding:2px 9px; border-radius:999px; }
.rkx-rank__tag { display:block; color:var(--rk-text); margin-top:3px; }
.rkx-rank__go { display:flex; align-items:center; gap:8px; }
.rkx-rank__ext { display:grid; place-items:center; width:36px; height:36px; border-radius:50%; color:var(--rk-text); border:1px solid var(--rk-hair); }
.rkx-rank__ext:hover { color:var(--rk-brand); border-color:var(--rk-brand); }
.rkx-rank__ext svg { width:16px; height:16px; }

/* SCORE RING ------------------------------------------------------------ */
.rke-ring { --p:0; position:relative; border-radius:50%; display:grid; place-items:center; flex:0 0 auto;
  background:radial-gradient(closest-side,var(--rk-bg) 72%,transparent 73%),conic-gradient(var(--rk-brand) calc(var(--p)*1%),color-mix(in srgb,var(--rk-text) 20%,transparent) 0); }
[data-cs="dark"] .rke-ring { background:radial-gradient(closest-side,var(--rk-bg-2) 72%,transparent 73%),conic-gradient(var(--rk-brand) calc(var(--p)*1%),color-mix(in srgb,var(--rk-text) 28%,transparent) 0); }
.rke-ring--xl { width:104px; height:104px; } .rke-ring--xl .rke-ring__v { font-size:26px; }
.rke-ring--lg { width:88px; height:88px; } .rke-ring--lg .rke-ring__v { font-size:22px; }
.rke-ring--sm { width:60px; height:60px; } .rke-ring--sm .rke-ring__v { font-size:16px; }
.rke-ring__v { font-weight:900; color:var(--rk-ink); line-height:1; }
.rke-ring__v small { font-size:.5em; color:var(--rk-text); font-weight:600; }

/* STARS ----------------------------------------------------------------- */
.rke-stars { display:inline-flex; align-items:center; gap:3px; margin-top:10px; }
.rke-star { position:relative; width:16px; height:16px; color:color-mix(in srgb,var(--rk-text) 28%,transparent); }
.rke-star svg { width:16px; height:16px; position:absolute; inset:0; }
.rke-star__f { position:absolute; inset:0; overflow:hidden; color:var(--rk-5); z-index:1; }
.rke-stars b { margin-inline-start:6px; font-size:13px; color:var(--rk-ink); }

/* SUB-RATING BARS ------------------------------------------------------- */
.rke-bars { display:grid; gap:12px; margin-top:18px; }
.rke-bar { display:grid; grid-template-columns:minmax(110px,34%) minmax(0,1fr) auto; align-items:center; gap:8px 14px; }
.rke-bar__l { min-width:0; font-size:13px; line-height:1.45; color:var(--rk-text); overflow-wrap:anywhere; }
.rke-bar__t { height:9px; border-radius:999px; background:color-mix(in srgb,var(--rk-text) 14%,transparent); overflow:hidden; }
.rke-bar__f { display:block; height:100%; width:0; border-radius:999px; background:linear-gradient(90deg,var(--rk-3),var(--rk-2) 55%,var(--rk-1)); transition:width 1.1s var(--rk-ease); }
.rke-bar__v { font-size:13px; font-weight:800; color:var(--rk-ink); font-variant-numeric:tabular-nums; }

/* EDITORIAL + TOC ------------------------------------------------------- */
.rkx-article { display:grid; grid-template-columns:260px 1fr; gap:clamp(24px,4vw,48px); align-items:start; }
.rkx-toc { position:sticky; top:90px; }
.rkx-toc__in { padding:20px; border-radius:var(--rk-r-lg); background:var(--rk-surface); border:1px solid var(--rk-hair); }
.rkx-toc__h { display:flex; align-items:center; gap:8px; font-size:14px; font-weight:800; color:var(--rk-ink); margin-bottom:12px; }
.rkx-toc__h svg { width:18px; height:18px; color:var(--rk-brand); }
.rkx-toc__nav a { display:block; font-size:13.5px; line-height:1.5; color:var(--rk-text); text-decoration:none; padding:6px 12px; border-inline-start:2px solid var(--rk-hair); transition:color .25s,border-color .25s; }
.rkx-toc__nav a.lvl-3 { padding-inline-start:24px; font-size:12.5px; }
.rkx-toc__nav a:hover,.rkx-toc__nav a.active { color:var(--rk-brand); border-inline-start-color:var(--rk-brand); }
.rkx-content { font-size:16.5px; line-height:2.05; color:var(--rk-text); min-width:0; }
.rkx-content h2 { font-family:var(--rk-display); font-size:clamp(21px,2.6vw,28px); font-weight:800; color:var(--rk-ink); margin:38px 0 14px; line-height:1.35; scroll-margin-top:100px; }
.rkx-content h3 { font-family:var(--rk-display); font-size:clamp(18px,2.2vw,22px); font-weight:700; color:var(--rk-ink); margin:28px 0 12px; scroll-margin-top:100px; }
.rkx-content p { margin:0 0 18px; }
.rkx-content a { color:var(--rk-brand); text-decoration:underline; text-underline-offset:3px; }
.rkx-content ul,.rkx-content ol { margin:0 0 18px; padding-inline-start:22px; }
.rkx-content li { margin-bottom:8px; }
.rkx-content img { max-width:100%; height:auto; border-radius:var(--rk-r); }
.rkx-content blockquote { margin:20px 0; padding:14px 20px; border-inline-start:3px solid var(--rk-brand); background:var(--rk-bg-2); border-radius:var(--rk-r-sm); }

/* OTHER OPTIONS (mini grid) --------------------------------------------- */
.rkx-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(200px,1fr)); gap:12px; }
.rkx-mini { display:flex; align-items:center; gap:12px; padding:14px 16px; border-radius:var(--rk-r); background:var(--rk-surface); border:1px solid var(--rk-hair); text-decoration:none; transition:transform .3s var(--rk-ease),border-color .3s; }
.rkx-mini:hover { transform:translateY(-4px); border-color:color-mix(in srgb,var(--rk-brand) 40%,transparent); }
.rkx-mini__logo { width:40px; height:40px; border-radius:11px; object-fit:contain; background:var(--rk-bg); border:1px solid var(--rk-hair); padding:5px; }
.rkx-mini__name { flex:1; font-size:14.5px; font-weight:700; color:var(--rk-ink); }
.rkx-mini__score { font-size:15px; font-weight:900; color:var(--rk-brand); }

/* EMPTY STATE ----------------------------------------------------------- */
.rkx-empty__in { text-align:center; max-width:520px; margin-inline:auto; padding:48px 24px; border-radius:var(--rk-r-lg); background:var(--rk-surface); border:1px dashed var(--rk-hair-2); }
.rkx-empty__in svg { width:46px; height:46px; color:var(--rk-brand); }
.rkx-empty__in h2 { font-size:24px; font-weight:800; color:var(--rk-ink); margin:14px 0 8px; }
.rkx-empty__in p { font-size:14.5px; line-height:1.9; color:var(--rk-text); }

/* FAQ ------------------------------------------------------------------- */
.rkx-faq__list { display:grid; gap:12px; max-width:820px; }
.rkx-q { border-radius:var(--rk-r); background:var(--rk-surface); border:1px solid var(--rk-hair); overflow:hidden; }
.rkx-q summary { display:flex; align-items:center; justify-content:space-between; gap:14px; padding:18px 22px; font-size:16px; font-weight:700; color:var(--rk-ink); cursor:pointer; list-style:none; }
.rkx-q summary::-webkit-details-marker { display:none; }
.rkx-q__i { position:relative; width:18px; height:18px; flex:0 0 auto; }
.rkx-q__i::before,.rkx-q__i::after { content:""; position:absolute; inset-block:0; inset-inline-start:8px; width:2px; background:var(--rk-brand); border-radius:2px; transition:transform .3s; }
.rkx-q__i::after { transform:rotate(90deg); }
.rkx-q[open] .rkx-q__i::after { transform:rotate(0); opacity:0; }
.rkx-q__a { padding:0 22px 20px; font-size:14.5px; line-height:1.95; color:var(--rk-text); }

/* =========================================================================
   ENTITY SINGLE BOX — in-post review summary.
   Deliberately STABLE: a solid editorial card, no reveal/tilt/count-up, so
   it reads as trustworthy content rather than a moving marketing widget.
   (The category landing keeps its animated treatment.)
   ========================================================================= */
.rk-entity { margin-bottom:34px; }

/* Kill every motion primitive inside the post card. ----------------------- */
.rk-entity .rk-reveal { opacity:1; transform:none; transition:none; }
.rk-entity .rke-bar__f { transition:none; }

.rke-card { position:relative; padding:clamp(22px,3.4vw,38px); border-radius:var(--rk-r-lg);
  background:var(--rk-bg);
  border:1px solid var(--rk-hair-2);
  box-shadow:var(--rk-shadow); overflow:hidden; }
[data-cs="dark"] .rke-card { background:color-mix(in srgb,var(--rk-bg-2) 70%,var(--rk-bg)); }
/* Eye-catching, *static* top accent ribbon. */
.rke-card__bar { position:absolute; inset-block-start:0; inset-inline:0; height:5px;
  background:linear-gradient(90deg,var(--rk-1),var(--rk-2) 40%,var(--rk-3) 75%,var(--rk-4)); }

/* Header: identity ↔ score, split by a hairline. ------------------------- */
.rke-card__head { display:flex; align-items:center; justify-content:space-between; gap:clamp(16px,3vw,32px); flex-wrap:wrap;
  padding-bottom:clamp(18px,2.6vw,26px); border-bottom:1px solid var(--rk-hair); }
.rke-card__id { display:flex; gap:18px; align-items:center; flex:1 1 280px; min-width:0; }
.rke-logo { width:88px; height:88px; border-radius:20px; object-fit:contain; background:var(--rk-bg); border:1px solid var(--rk-hair); padding:10px; flex:0 0 auto; box-shadow:0 6px 18px -10px rgba(16,22,26,.35); }
.rke-logo.rkx-logo--ph svg { width:42px; height:42px; }
.rke-card__intro { min-width:0; }
.rke-card__tags { display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin-bottom:10px; }
.rke-cat { display:inline-flex; align-items:center; gap:6px; font-size:12.5px; font-weight:700; color:var(--rk-brand); text-decoration:none;
  padding:5px 12px; border-radius:999px; background:color-mix(in srgb,var(--rk-brand) 11%,transparent); border:1px solid color-mix(in srgb,var(--rk-brand) 26%,transparent); }
.rke-cat:hover { background:color-mix(in srgb,var(--rk-brand) 18%,transparent); }
.rke-cat svg { width:15px; height:15px; }
.rke-tag { font-size:clamp(16px,2vw,19px); font-weight:700; line-height:1.55; color:var(--rk-ink); margin:0; }
.rke-card__intro .rke-stars { margin-top:12px; }

/* Score lockup: big static ring + caption. ------------------------------- */
.rke-score { display:flex; flex-direction:column; align-items:center; gap:8px; flex:0 0 auto; align-self:stretch; justify-content:center;
  padding:14px 22px; border-radius:var(--rk-r); background:var(--rk-bg-2); border:1px solid var(--rk-hair); }
.rke-score__cap { font-size:12px; font-weight:700; color:var(--rk-text); }

/* Criteria section. ------------------------------------------------------- */
.rke-section { margin-top:clamp(20px,2.6vw,28px); }
.rke-section__t { display:flex; align-items:center; gap:8px; font-size:14px; font-weight:800; color:var(--rk-ink); margin:0 0 16px; }
.rke-section__t svg { width:17px; height:17px; color:var(--rk-brand); }

/* Pros / cons. ----------------------------------------------------------- */
.rke-pc { display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-top:clamp(20px,2.6vw,28px); }
.rke-pc__col { padding:18px 20px; border-radius:var(--rk-r); border:1px solid var(--rk-hair); }
.rke-pc__pros { background:color-mix(in srgb,var(--rk-2) 8%,transparent); border-color:color-mix(in srgb,var(--rk-2) 22%,transparent); }
.rke-pc__cons { background:color-mix(in srgb,#e2574a 7%,transparent); border-color:color-mix(in srgb,#e2574a 20%,transparent); }
.rke-pc__col h4 { display:flex; align-items:center; gap:8px; font-size:15px; font-weight:800; color:var(--rk-ink); margin:0 0 12px; }
.rke-pc__col h4 svg { width:18px; height:18px; }
.rke-pc__pros h4 svg { color:var(--rk-2); } .rke-pc__cons h4 svg { color:#e2574a; }
.rke-pc__col ul { list-style:none; margin:0; padding:0; display:grid; gap:9px; }
.rke-pc__col li { position:relative; padding-inline-start:18px; font-size:14px; line-height:1.7; color:var(--rk-text); }
.rke-pc__col li::before { content:""; position:absolute; inset-inline-start:0; top:9px; width:7px; height:7px; border-radius:50%; }
.rke-pc__pros li::before { background:var(--rk-2); } .rke-pc__cons li::before { background:#e2574a; }

/* Verdict callout. ------------------------------------------------------- */
.rke-verdict { display:flex; gap:14px; align-items:flex-start; margin-top:clamp(20px,2.6vw,28px); padding:18px 22px; border-radius:var(--rk-r);
  background:color-mix(in srgb,var(--rk-brand) 8%,var(--rk-bg-2)); border:1px solid color-mix(in srgb,var(--rk-brand) 24%,transparent);
  border-inline-start:4px solid var(--rk-brand); }
.rke-verdict__ic { display:grid; place-items:center; width:34px; height:34px; flex:0 0 auto; border-radius:50%; color:#06210d;
  background:linear-gradient(120deg,var(--rk-1),var(--rk-2)); }
.rke-verdict__ic svg { width:18px; height:18px; }
.rke-verdict b { display:block; font-size:14px; color:var(--rk-ink); margin-bottom:4px; }
.rke-verdict p { margin:0; font-size:14.5px; line-height:1.9; color:var(--rk-text); }
.rke-cta { margin-top:clamp(20px,2.6vw,26px); }

/* RESPONSIVE ------------------------------------------------------------ */
@media (max-width:920px) {
  .rkx-article { grid-template-columns:1fr; }
  .rkx-toc { position:static; }
  .rkx-champ { grid-template-columns:1fr; text-align:start; }
  .rkx-champ__rank { flex-direction:row; align-self:start; }
  .rkx-champ__score { justify-self:start; }
}
@media (max-width:640px) {
  .rkx-rank { grid-template-columns:auto auto 1fr auto; gap:12px; }
  .rkx-rank__go { grid-column:1 / -1; justify-content:flex-end; }
  .rke-card__head { gap:18px; }
  .rke-score { flex-direction:row; justify-content:center; width:100%; padding:12px 18px; }
  .rke-pc { grid-template-columns:1fr; }
  .rke-bar { grid-template-columns:minmax(86px,44%) minmax(0,1fr) auto; gap:6px 10px; }
  .rkx-champ__id { flex-direction:column; align-items:flex-start; }
}

@media (prefers-reduced-motion:reduce) {
  .rk-rank *,.rk-rank *::before,.rk-rank *::after { animation-duration:.001ms!important; animation-iteration-count:1!important; transition-duration:.001ms!important; }
  .rk-rank .rk-reveal { opacity:1!important; transform:none!important; }
  .rk-blob { display:none; }
}