/* Article-scoped, local styling. No fonts, images or styles are fetched remotely. */
.ph2-source-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 20rem), 1fr));
  gap: 1rem;
  margin-block: 1.6rem 2rem;
}
.ph2-source-card {
  --ph2-accent: #4169a1;
  --ph2-ink: #172b42;
  --ph2-muted: #4c6176;
  --ph2-paper: #ffffff;
  --ph2-tint: #edf3f8;
  --ph2-border: #ccd7e1;
  box-sizing: border-box;
  min-width: 0;
  padding: 1.25rem;
  color: var(--ph2-ink);
  background: var(--ph2-paper);
  border: 1px solid var(--ph2-border);
  border-top: 4px solid var(--ph2-accent);
  border-radius: .8rem;
  box-shadow: 0 5px 18px rgb(20 40 60 / 5%);
  overflow-wrap: anywhere;
}
.ph2-source-card[data-provider="facebook"] { --ph2-accent: #2864c7; }
.ph2-source-card[data-provider="reddit"] { --ph2-accent: #bb430e; }
.ph2-source-card[data-provider="google"] { --ph2-accent: #3567ae; }
.ph2-source-card[data-provider="aws"] { --ph2-accent: #a6650c; }
.ph2-source-card[data-provider="cloudflare"] { --ph2-accent: #b95015; }
.ph2-source-card[data-provider="news"] { --ph2-accent: #6c4b98; }
.ph2-source-card[data-provider="node"] { --ph2-accent: #34733a; }
.ph2-source-card[data-provider="youtube"] { --ph2-accent: #b72c33; }
.ph2-video-poster {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1rem;
  aspect-ratio: 16 / 6;
  margin: -.1rem -.1rem 1.15rem;
  border-radius: .45rem;
  background: linear-gradient(120deg, #16232e, #38202c);
  color: #ffffff;
  font: 650 .9rem/1.4 system-ui, sans-serif;
}
.ph2-video-poster span:first-child {
  display: grid;
  place-items: center;
  width: 3rem;
  height: 2.3rem;
  border-radius: .6rem;
  background: #bb2634;
  font-size: 1.1rem;
}
.ph2-source-card .ph2-source-kicker {
  margin: 0 0 .8rem;
  color: var(--ph2-muted);
  font: 650 .73rem/1.4 system-ui, sans-serif;
  letter-spacing: .065em;
  text-transform: uppercase;
}
.ph2-source-card .ph2-source-title {
  margin: 0 0 .75rem;
  color: var(--ph2-ink);
  font: 700 1.12rem/1.4 system-ui, sans-serif;
  letter-spacing: -.015em;
}
.ph2-source-card .ph2-source-title a {
  color: inherit;
  text-decoration: none;
}
.ph2-source-card .ph2-source-title a:hover { text-decoration: underline; }
.ph2-source-card .ph2-source-summary {
  margin: 0 0 1rem;
  color: var(--ph2-muted);
  font: 400 .94rem/1.6 system-ui, sans-serif;
}
.ph2-source-card .ph2-source-link,
.ph2-source-card .ph2-source-credit {
  color: var(--ph2-accent);
  font: 650 .88rem/1.5 system-ui, sans-serif;
  text-underline-offset: .18em;
}
.ph2-source-card .ph2-source-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: .5rem 1rem;
  border-top: 1px solid var(--ph2-border);
  margin-top: 1rem;
  padding-top: .85rem;
}
.ph2-source-card .ph2-source-kind {
  color: var(--ph2-muted);
  font: 500 .76rem/1.5 system-ui, sans-serif;
}
.ph2-source-card .ph2-live-controls {
  display: flex;
  flex-wrap: wrap;
  gap: .6rem;
  margin-top: 1rem;
}
.ph2-source-card .ph2-live-button {
  cursor: pointer;
  border: 1px solid var(--ph2-border);
  border-radius: .4rem;
  padding: .65rem .85rem;
  background: var(--ph2-tint);
  color: var(--ph2-ink);
  font: 600 .82rem/1.4 system-ui, sans-serif;
}
.ph2-source-card a:focus-visible,
.ph2-source-card button:focus-visible {
  outline: 3px solid var(--ph2-accent);
  outline-offset: 4px;
}
.ph2-source-card [hidden] { display: none !important; }
.ph2-source-card .ph2-live-note {
  margin: .65rem 0 0;
  color: var(--ph2-muted);
  font: 400 .76rem/1.55 system-ui, sans-serif;
}
.ph2-source-card .ph2-live-host {
  margin-top: 1rem;
  max-width: 100%;
  overflow-x: auto;
  overscroll-behavior-inline: contain;
}
.ph2-source-card .ph2-live-host iframe {
  display: block;
  border: 0;
  max-width: none;
  background: #fff;
}
.ph2-source-card .ph2-live-host blockquote {
  margin: 0;
  padding: .75rem;
  border-left: 3px solid var(--ph2-accent);
  font: 400 .95rem/1.6 system-ui, sans-serif;
}
.ph2-source-card[data-provider="youtube"] .ph2-live-host iframe {
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
}
.ph2-figure { margin: 1.6rem auto 2rem; }
.ph2-figure img { display: block; max-width: 100%; height: auto; margin-inline: auto; }
.ph2-figure--meme img { width: min(100%, 26rem); }
.ph2-figure figcaption {
  margin: .75rem auto 0;
  max-width: 65ch;
  font-size: .85em;
  line-height: 1.6;
  opacity: .85;
}
.ph2-citation { font-size: .75em; vertical-align: super; white-space: nowrap; }
.ph2-source-list { padding-left: 1.3rem; overflow-wrap: anywhere; }
.ph2-source-list li { margin-block: .7rem; }
.ph2-source-list li:target { outline: 2px solid currentColor; outline-offset: .3rem; }
/* Match the site's explicit light/dark theme, including manual overrides. */
.ph2-source-card{--ph2-ink:var(--text);--ph2-muted:var(--muted);--ph2-paper:var(--surface);--ph2-tint:var(--soft);--ph2-border:var(--border)}
:root[data-theme="dark"] .ph2-source-card .ph2-source-link,:root[data-theme="dark"] .ph2-source-card .ph2-source-credit{color:#dcb6fa}
.ph2-source-card{font-family:inherit}.ph2-source-card :is(p,h3,a,button,blockquote),.ph2-video-poster{font-family:inherit}
.ph2-live-note,.ph2-source-summary{line-height:1.7}
/* The receiving site may map these variables to its explicit theme toggle. */
@media print {
  .ph2-source-card { box-shadow: none; break-inside: avoid; }
  .ph2-live-controls, .ph2-live-note, .ph2-live-host { display: none !important; }
}

/* Plain-language runtime diagram; reading order is identical on small screens. */
.prose .ph2-memory-diagram{margin:2rem 0;padding:clamp(18px,3vw,28px);border:1px solid var(--border);border-radius:18px;background:var(--surface)}
.prose .ph2-memory-diagram h3{margin:0 0 22px;font-size:23px;line-height:1.35}
.prose .ph2-memory-flow{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;list-style:none;padding:0;margin:0}
.prose .ph2-memory-flow li{position:relative;margin:0;padding:16px;border:1px solid var(--border);border-radius:12px;background:var(--soft);text-align:start}
.ph2-memory-flow li+li::before{content:"→";position:absolute;left:-20px;top:42%;color:var(--accent);font-size:23px;font-weight:700}
.ph2-memory-step{display:block;margin-bottom:10px;color:var(--accent);font-size:12px;font-weight:750;letter-spacing:.04em}
.ph2-memory-diagram strong{display:block;font-size:17px;line-height:1.4}
.prose .ph2-memory-diagram p{margin:10px 0 0;font-size:15px;line-height:1.65;text-align:start;hyphens:none}
.ph2-memory-outcomes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:24px;padding-top:20px;border-top:1px dashed var(--accent)}
.ph2-memory-outcomes>div{padding:16px;border-left:3px solid var(--accent);background:var(--soft);border-radius:0 10px 10px 0}
.ph2-memory-outcomes span{display:block;color:var(--accent);font-size:22px;line-height:1;margin-bottom:8px}
.prose .ph2-memory-diagram figcaption{margin-top:22px;font-size:13px;line-height:1.65;text-align:start}
@media(max-width:640px){.prose .ph2-memory-flow{grid-template-columns:1fr;gap:26px}.ph2-memory-flow li+li::before{content:"↓";left:calc(50% - 7px);top:-28px}.ph2-memory-outcomes{grid-template-columns:1fr}}

/* Locally served video thumbnails preserve click-to-load player privacy. */
a.ph2-video-poster{position:relative;display:block;aspect-ratio:16/9;overflow:hidden;text-decoration:none}
.prose a.ph2-video-poster img{display:block;width:100%;height:100%;max-height:none;object-fit:cover;margin:0;border-radius:0}
a.ph2-video-poster .ph2-video-play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:grid;place-items:center;width:56px;height:40px;border-radius:10px;background:#b91c32;color:white;font-size:20px;box-shadow:0 2px 12px #0006}
a.ph2-video-poster:hover .ph2-video-play{background:#e11d48}
a.ph2-video-poster:focus-visible{outline:3px solid var(--accent);outline-offset:4px}