/* =====================================================================
   PAEDZ V2 0.16.0 — shared editorial system (Module A)
   One set of tokens used by every template; each content type keeps its
   own identity on top of it:
     news      → concise reporting, category tiles      (sections.css)
     articles  → long-form frame, wide headline          (article.css)
     reviews   → cinematic art, score stamp, verdict     (review.css)
     tutorials → steps, notes, practical navigation      (sections.css)
   Loaded after the 0.8 stylesheets; only adds tokens and shared pieces.
   ===================================================================== */
:root {
  /* containers & media */
  --c-shell: 1180px;          /* page shell for article / review / tutorial heads */
  --c-read: 44rem;            /* reading column */
  --c-media-max: 520px;       /* tallest editorial hero on desktop */
  --c-media-max-m: 320px;     /* tallest editorial hero on phones */
  /* frames */
  --fr-bg: #0b0d0e;           /* frame surface: one step above the page black */
  --fr-line: #1f2325;         /* hairline, never a heavy outline */
  --fr-pad: clamp(18px, 3.4vw, 40px);
  --fr-radius: 6px;
  /* platform families (official brand hues, used as accents only) */
  --pf-xbox: #107c10;
  --pf-ps: #006fcd;
  --pf-nin: #e60012;
  --pf-pc: #5b6166;
  /* focus */
  --focus: #ff5b4d;
}

/* ---------- platform chips: compact, text label kept, colour = family ---------- */
.plat[data-pf], .rv2-tested-l li[data-pf] { position: relative; padding-inline-start: 16px; }
.plat[data-pf]::before, .rv2-tested-l li[data-pf]::before {
  content: ""; position: absolute; inset-inline-start: 6px; top: 50%; width: 5px; height: 5px; margin-top: -2.5px; border-radius: 1px; background: var(--pf, var(--pf-pc));
}
[data-pf="xbox"] { --pf: var(--pf-xbox); }
[data-pf="playstation"] { --pf: var(--pf-ps); }
[data-pf="nintendo"] { --pf: var(--pf-nin); }
[data-pf="pc"] { --pf: #8d949a; }
.plat[data-pf] { border-color: color-mix(in srgb, var(--pf) 55%, var(--line-2)); background: color-mix(in srgb, var(--pf) 16%, transparent); color: var(--fg); }
.rv2-tested-l li[data-pf] { padding-inline-start: 20px; border-color: color-mix(in srgb, var(--pf) 60%, var(--line-2)); background: color-mix(in srgb, var(--pf) 18%, transparent); }
.rv2-tested-l li[data-pf]::before { inset-inline-start: 8px; width: 6px; height: 6px; margin-top: -3px; }
.paper .plat[data-pf] { background: color-mix(in srgb, var(--pf) 10%, #fff); color: var(--paper-ink); border-color: color-mix(in srgb, var(--pf) 45%, var(--paper-line)); }
/* PAEDZ Core chips (class added by the theme's visitor-HTML pass) */
.paedz-game-platform-chip[data-pf] { border-color: color-mix(in srgb, var(--pf) 55%, #363b3e) !important; background: color-mix(in srgb, var(--pf) 16%, transparent) !important; }
.paedz-entity-game-platforms span[data-pf] { box-shadow: inset 3px 0 0 var(--pf); }
html[dir="rtl"] .paedz-entity-game-platforms span[data-pf] { box-shadow: inset -3px 0 0 var(--pf); }
@supports not (background: color-mix(in srgb, red 10%, transparent)) {
  .plat[data-pf], .rv2-tested-l li[data-pf] { border-color: var(--pf); background: transparent; }
}

/* ---------- shared focus state (keyboard only) ---------- */
:where(a, button, [tabindex], summary, input, select, textarea):focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }

/* ---------- shared editorial frame (articles, tutorials) ---------- */
.ed-frame { background: var(--fr-bg); border: 1px solid var(--fr-line); border-radius: var(--fr-radius); padding: var(--fr-pad); }
.ed-frame > :first-child { margin-top: 0; }
.ed-frame > :last-child { margin-bottom: 0; }
@media (max-width: 640px) { .ed-frame { padding: 18px 14px; border-radius: 4px; } }

/* ---------- shared image-aware hero media ----------
   A box sized from the image's own ratio, capped in height; wide art fills it, other shapes are shown whole over a
   blurred copy of themselves. Used by articles and tutorials (reviews have their own composition). */
.ed-media { position: relative; overflow: hidden; background: #070809; border-radius: var(--fr-radius); aspect-ratio: var(--ar, 1.7778); width: min(100%, calc(var(--c-media-max) * var(--ar, 1.7778))); }
.ed-media.is-tall { aspect-ratio: 4 / 3; width: min(100%, calc(var(--c-media-max) * 1.3333)); }
.ed-media img { position: relative; z-index: 1; width: 100%; height: 100%; object-fit: contain; }
.ed-media.is-wide img { object-fit: cover; }
.ed-media-bg { position: absolute; inset: -30px; background-size: cover; background-position: center; filter: blur(28px) brightness(.45); }
@media (max-width: 759px) { .ed-media { width: min(100%, calc(var(--c-media-max-m) * var(--ar, 1.7778))); border-radius: 4px; } .ed-media.is-tall { width: 100%; aspect-ratio: auto; height: var(--c-media-max-m); } }

@media (prefers-reduced-motion: reduce) {
  .plat, .paedz-game-platform-chip { transition: none !important; }
}

/* ---------- 0.16.0 (Module F): compact X fallback — same two actions, consent behaviour unchanged ---------- */
.prose .paedz-x-embed, .paedz-x-embed { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; max-width: 550px; margin: 1.2em auto; padding: 10px 12px; border-radius: 6px; text-align: start; }
.paedz-x-embed > p { flex: 1 1 auto; margin: 0 !important; font-family: var(--f-head); font-weight: 800; font-size: var(--t-14); line-height: 1.5; color: var(--fg-2); }
.paedz-x-embed .paedz-x-embed__actions { flex: 0 1 auto; gap: 8px; justify-content: flex-start; }
.paedz-x-embed button { min-height: 36px; padding: 4px 12px; border-radius: 6px; font-size: var(--t-14); }
.paedz-x-embed a { padding: 6px 4px; font-size: var(--t-14); }
.paedz-x-embed .paedz-x-embed__mount { flex: 1 0 100%; }
.paedz-x-embed .paedz-x-embed__mount:empty { display: none; }
.paedz-x-embed.is-loaded { display: block; padding: 8px; }
.paedz-x-embed.is-loaded > p { display: none; }

/* ---------- 0.16.0: connected game card without artwork — text-only, no empty cover box ---------- */
.af-card.af-game.no-thumb { border-inline-start: 3px solid var(--line-2); padding-inline-start: 14px; }
.af-card.af-game .plats { margin-top: 4px; }
