/* Approved fourth-screen directory, shared by the homepage and comparison. */
.home-editorial-module {
  --editorial-body: #bac1d1;
  --editorial-border: color-mix(in srgb, var(--cyan) 24%, var(--line));
  scroll-margin-top: 100px;
}
.home-editorial-module { position: relative; padding-block: 44px 72px; }
.home-editorial-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; padding-bottom: 32px; }
.home-editorial-heading > div { min-width: 0; }
.home-editorial-heading .section-kicker { margin: 0; color: var(--muted); font-size: 11px; letter-spacing: .16em; }
.home-editorial-heading h2 { margin: 14px 0 0; font-size: clamp(42px, 4.3vw, 60px); line-height: 1.12; }
.home-editorial-all { display: inline-flex; align-items: center; justify-content: space-between; gap: 28px; min-height: 48px; min-width: 144px; padding-block: 12px; border-bottom: 1px solid var(--editorial-border); flex-shrink: 0; font-size: 15px; transition: color 180ms ease, border-color 180ms ease; }
.home-editorial-all .ui-icon { color: var(--cyan); }
.home-editorial-all:hover, .home-editorial-all:focus-visible { color: var(--cyan); border-color: var(--cyan); }
.home-editorial-list { border-top: 1px solid var(--editorial-border); }
.home-editorial-entry { --entry-accent: var(--blue); position: relative; border-bottom: 1px solid var(--line); }
.home-editorial-entry--agents { --entry-accent: var(--cyan); }
.home-editorial-entry--games { --entry-accent: var(--pink); }
.home-editorial-entry--stories { --entry-accent: var(--purple); }
.home-editorial-link { position: relative; isolation: isolate; display: grid; grid-template-columns: 104px minmax(0, 1fr) 112px 44px; gap: 28px; align-items: center; min-height: 160px; padding: 30px 20px; transition: background-color 200ms ease; }
.home-editorial-link > * { min-width: 0; }
.home-editorial-link::before { content: ""; position: absolute; inset: 22px auto 22px 0; width: 2px; background: var(--entry-accent); opacity: .42; transition: opacity 200ms ease; }
.home-editorial-link::after { content: ""; position: absolute; pointer-events: none; height: 1px; bottom: -1px; left: 0; width: 100%; background: linear-gradient(90deg, transparent, var(--cyan), transparent); transform: scaleX(.08); transform-origin: left; opacity: 0; }
.home-editorial-category span { display: block; color: var(--paper); font-size: 14px; line-height: 1.5; }
.home-editorial-category small { display: block; margin-top: 9px; color: var(--muted); font: 400 10px/1.5 var(--mono-font); letter-spacing: .09em; }
.home-editorial-title { margin: 0; font: 400 clamp(26px, 2.6vw, 36px)/1.3 var(--headline-font); color: var(--paper); text-wrap: balance; overflow-wrap: anywhere; }
.home-editorial-summary { margin: 12px 0 0; color: var(--editorial-body); font-size: 16px; line-height: 1.8; }
.home-editorial-date { color: var(--muted); font: 400 12px/1.5 var(--mono-font); text-align: right; }
.home-editorial-date time { display: block; white-space: nowrap; }
.home-editorial-date small { display: block; font: 400 11px/1.5 var(--body-font); margin-top: 8px; }
.home-editorial-action { display: grid; place-items: center; width: 44px; height: 44px; border: 1px solid var(--line); color: var(--muted); transition: color 180ms ease, border-color 180ms ease; }
.home-editorial-action .ui-icon { transition: transform 200ms ease; }
.home-editorial-link:is(:hover, :focus-visible) { background: color-mix(in srgb, var(--entry-accent) 4%, var(--ink)); }
.home-editorial-link:is(:hover, :focus-visible)::before { opacity: 1; }
.home-editorial-link:is(:hover, :focus-visible)::after { animation: home-editorial-row-scan 600ms ease-out both; }
.home-editorial-link:is(:hover, :focus-visible) .home-editorial-action { border-color: var(--cyan); color: var(--cyan); }
.home-editorial-link:is(:hover, :focus-visible) .home-editorial-action .ui-icon { transform: translate(2px, -2px); }
.home-editorial-footnote { display: flex; align-items: center; gap: 20px; margin-top: 24px; color: var(--muted); font: 400 10px/1.5 var(--mono-font); letter-spacing: .12em; }
.home-editorial-footnote i { height: 1px; flex: 1; background: var(--line); }
.home-editorial-module a { scroll-margin-top: 112px; }
.home-editorial-module a:focus-visible { outline: 2px solid var(--cyan); outline-offset: 4px; }
.home-editorial-module--homepage { z-index: 1; padding-block: 80px 104px; border-top: 1px solid color-mix(in srgb, var(--cyan) 11%, transparent); }
.home-editorial-module--homepage:focus { outline: none; }
.home-editorial-staging-note { margin: 0 0 24px; color: var(--muted); font-size: 12px; line-height: 1.7; }
@keyframes home-editorial-row-scan { 0% { transform: scaleX(.08); opacity: 0; } 25% { opacity: .9; } 100% { transform: scaleX(1); opacity: .32; } }
@media (max-width: 1024px) {
  .home-editorial-link { grid-template-columns: 90px minmax(0, 1fr) 100px 44px; gap: 20px; padding-inline: 16px; }
  .home-editorial-title { font-size: 30px; }
}
@media (max-width: 680px) {
  .home-editorial-module { padding-block: 32px 48px; scroll-margin-top: 84px; }
  .home-editorial-heading { align-items: flex-start; gap: 12px; padding-bottom: 24px; }
  .home-editorial-heading h2 { font-size: 40px; }
  .home-editorial-heading .section-kicker { font-size: 9px; letter-spacing: .1em; }
  .home-editorial-all { min-width: 96px; gap: 10px; font-size: 13px; min-height: 44px; margin-top: 26px; }
  .home-editorial-link { grid-template-columns: minmax(0, 1fr) 44px; gap: 16px 12px; padding: 24px 12px 26px; min-height: 0; }
  .home-editorial-category { grid-column: 1; grid-row: 1; align-self: start; }
  .home-editorial-category span { font-size: 13px; }
  .home-editorial-category small { font-size: 9px; margin-top: 4px; }
  .home-editorial-date { grid-column: 1 / -1; grid-row: 1; justify-self: end; font-size: 11px; }
  .home-editorial-date small { font-size: 10px; margin-top: 4px; }
  .home-editorial-copy { grid-column: 1; grid-row: 2; }
  .home-editorial-title { font-size: 28px; line-height: 1.35; }
  .home-editorial-summary { margin-top: 10px; line-height: 1.8; }
  .home-editorial-action { grid-column: 2; grid-row: 2; align-self: start; }
  .home-editorial-link::before { inset-block: 24px; }
  .home-editorial-footnote { gap: 12px; font-size: 8px; letter-spacing: .04em; }
  .home-editorial-footnote span:last-child { display: none; }
  .home-editorial-module--homepage { padding-block: 48px 64px; }
}
@media (prefers-reduced-motion: reduce) {
  .home-editorial-module *, .home-editorial-module *::before, .home-editorial-module *::after { animation: none !important; transition: none !important; }
  .home-editorial-action .ui-icon { transform: none !important; }
}