/* article-styles/examined.css — split from public-article.css (2026-07-20).
 * Loaded per-article via a server-rendered <link> when
 * src/lib/blog/article-style-chunks.ts resolves the "examined" chunk.
 * Served raw from /public (no build step) — this file IS the source of
 * truth. Cascade: loads AFTER public-core.css + public-article.css in
 * document order. Source order preserves the original monolith order —
 * do not re-sort. New rules for this collection belong here. */


/* ════════════════════════════════════════════════════════════════
   The Examined Life — bespoke enhanced-article scope (.examined-life).
   "How to Find Meaning in Life: A Research-Backed Field Guide."
   Source design ported verbatim, every rule re-scoped under
   .examined-life so it survives sanitize (no <style>/<link>). The
   Newsreader display face is stripped with the <link>, so --serif
   falls back to Georgia. Components: lede/beat, pull quote, cards +
   disclaimer, checklist, pillars, the dark SPARK engine, good/bad
   script rows, ingredients table, red-flag list, toolkit, litany +
   coda, evidence tags, and the references section.
   ════════════════════════════════════════════════════════════════ */
.examined-life{
  --serif:'Newsreader',Georgia,serif;
  --mono:'IBM Plex Mono',ui-monospace,monospace;
  --bg:#faf8f4;
  --paper:#ffffff;
  --ink:#1c1a17;
  --ink-soft:#3a352e;
  --ink-faint:#8a8378;
  --line:#e4ded3;
  --accent:#7a5c2e;
  --accent-soft:#b89b6a;
  --wash:#f2ede3;
  --good:#3c6e47;
  --warn:#9a4b2e;
  --maxw:720px;
}
.examined-life *{box-sizing:border-box}
.examined-life{
  margin:0;background:var(--bg);color:var(--ink);
  font-family:var(--serif);font-size:1.18rem;line-height:1.72;
  font-weight:380;-webkit-font-smoothing:antialiased;
}
.examined-life .progress{position:fixed;top:0;left:0;height:3px;width:0;background:var(--accent);z-index:60;transition:width .12s linear}

/* topbar */
.examined-life .topbar{
  position:sticky;top:0;z-index:50;display:flex;align-items:center;gap:.9rem;
  justify-content:space-between;padding:.75rem clamp(1rem,4vw,2.4rem);
  background:rgba(250,248,244,.86);backdrop-filter:blur(10px);
  border-bottom:1px solid transparent;font-family:var(--mono);
  font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-faint);
  transition:border-color .2s, box-shadow .2s;
}
.examined-life .topbar.scrolled{border-color:var(--line);box-shadow:0 6px 24px -18px rgba(0,0,0,.4)}
.examined-life .tb-title{color:var(--ink);font-weight:500;letter-spacing:.08em;flex:1;text-align:center;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.examined-life .dot{display:inline-block;width:5px;height:5px;border-radius:50%;background:var(--accent-soft);vertical-align:middle;margin:0 .15rem}

/* hero */
.examined-life .hero{padding:clamp(3.5rem,9vw,7rem) clamp(1rem,5vw,2rem) clamp(2rem,5vw,3.5rem)}
.examined-life .hero-inner{max-width:var(--maxw);margin:0 auto}
.examined-life .eyebrow{font-family:var(--mono);font-size:.74rem;letter-spacing:.22em;text-transform:uppercase;
  color:var(--accent);margin:0 0 1.4rem}
.examined-life .hero h1{font-size:clamp(2.6rem,7.5vw,4.6rem);line-height:1.02;font-weight:480;
  letter-spacing:-.02em;margin:0 0 1.6rem}
.examined-life .hero h1 em{font-style:italic;color:var(--accent)}
.examined-life .dek{font-size:clamp(1.25rem,2.6vw,1.5rem);line-height:1.5;color:var(--ink-soft);
  font-weight:360;max-width:38ch;margin:0 0 2rem}
.examined-life .dek em{font-style:italic;color:var(--ink)}
.examined-life .byline{display:flex;flex-wrap:wrap;align-items:center;gap:.7rem;font-family:var(--mono);
  font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-faint)}
.examined-life .byline strong{color:var(--ink);font-weight:500}
.examined-life .byline .sep{width:4px;height:4px;border-radius:50%;background:var(--accent-soft)}

.examined-life article{padding-bottom:4rem}
.examined-life .wrap{max-width:var(--maxw);margin:0 auto;padding:0 clamp(1rem,5vw,2rem)}
.examined-life .section{padding:clamp(1.35rem,3vw,2.05rem) clamp(1rem,5vw,2rem)}
.examined-life .col p{margin:0 0 1.15rem}
.examined-life .lede p:first-child{font-size:1.35rem;line-height:1.55}
.examined-life .beat{font-size:1.3rem;line-height:1.45;color:var(--ink);margin:1.5rem 0!important;font-weight:420}
.examined-life .beat em{font-style:italic;color:var(--accent)}

.examined-life h2{font-size:clamp(1.7rem,4vw,2.4rem);line-height:1.12;letter-spacing:-.015em;
  font-weight:470;margin:0 0 1.4rem;position:relative}
.examined-life .h-index{display:block;font-family:var(--mono);font-size:.7rem;letter-spacing:.18em;
  text-transform:uppercase;color:var(--accent);margin-bottom:.7rem;font-weight:500}
.examined-life h3{font-size:1.28rem;font-weight:500;margin:0 0 .5rem;letter-spacing:-.01em}
.examined-life h4{font-size:1.05rem;font-weight:500;margin:0;letter-spacing:-.01em}

.examined-life .rule,
.public-shell .ps-article-prose.examined-life .ps-article-body .examined-life-body hr{
  border:0;border-top:1px solid var(--line);max-width:var(--maxw);margin:clamp(1rem,2vw,1.45rem) auto
}
.public-shell .ps-article-prose.examined-life .ps-article-body .examined-life-body h2::before{
  content:none
}
.public-shell .ps-article-prose.examined-life .ps-article-body .examined-life-body p:first-of-type::first-letter{
  float:none;font-size:inherit;line-height:inherit;font-weight:inherit;padding:0;margin:0;color:inherit
}

/* cite */
.examined-life .cite{font-family:var(--mono);font-size:.62em;vertical-align:super;color:var(--accent);
  text-decoration:none;font-weight:500;padding:0 .08em;line-height:0}
.examined-life .cite:hover{text-decoration:underline}

/* pull quote */
.examined-life .pull{max-width:var(--maxw);margin:2.6rem auto;padding:0 clamp(1rem,5vw,2rem);position:relative}
.examined-life .pull blockquote{margin:0;font-size:clamp(1.6rem,4vw,2.2rem);line-height:1.28;font-weight:420;
  letter-spacing:-.015em;color:var(--ink);font-style:italic}
.examined-life .pull blockquote em{color:var(--accent)}
.examined-life .q-mark{position:absolute;left:clamp(.2rem,2vw,.6rem);top:-1.4rem;font-size:5rem;
  color:var(--accent-soft);opacity:.35;font-family:var(--serif);line-height:1}

/* cards */
.examined-life .card{background:var(--paper);border:1px solid var(--line);border-radius:14px;
  padding:clamp(1.3rem,3vw,1.9rem);margin:1.8rem 0;
  box-shadow:0 14px 40px -34px rgba(0,0,0,.5)}
.examined-life .card-label{display:flex;align-items:center;gap:.55rem;font-family:var(--mono);
  font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);
  margin-bottom:1rem;font-weight:500}
.examined-life .tick{width:8px;height:8px;border-radius:2px;background:var(--accent);transform:rotate(45deg);display:inline-block}
.examined-life .disclaimer{background:var(--wash);border-style:dashed}
.examined-life .disclaimer p{margin:0;font-size:1.02rem;line-height:1.6;color:var(--ink-soft)}
.examined-life .disclaimer strong{color:var(--ink)}

.examined-life .checklist{list-style:none;margin:0;padding:0;display:grid;gap:.6rem}
.examined-life .checklist li{display:flex;gap:.7rem;align-items:flex-start;font-size:1.05rem;line-height:1.45}
.examined-life .checklist li::before{content:"";flex:0 0 auto;width:18px;height:18px;margin-top:.25rem;
  border:1.5px solid var(--accent-soft);border-radius:5px}

.examined-life .mini{margin:.6rem 0 0;padding-left:1.1rem}
.examined-life .mini li{margin:.25rem 0;font-size:1.02rem;line-height:1.4}

/* pillars */
.examined-life .pillars{display:grid;gap:1.1rem;margin:2rem 0}
.examined-life .pillar{background:var(--paper);border:1px solid var(--line);border-radius:14px;
  padding:clamp(1.3rem,3vw,1.8rem);display:grid;grid-template-columns:auto 1fr;gap:1.3rem;
  box-shadow:0 14px 40px -34px rgba(0,0,0,.5)}
.examined-life .pillar .num{font-family:var(--mono);font-size:1.9rem;font-weight:500;color:var(--accent-soft);
  line-height:1;display:flex;flex-direction:column;gap:.5rem;min-width:3.4rem}
.examined-life .pillar .num small{font-size:.58rem;letter-spacing:.16em;color:var(--accent);
  writing-mode:initial;font-weight:500}
.examined-life .pillar p{margin:0 0 .7rem;font-size:1.04rem;line-height:1.55}
.examined-life .pillar p:last-child{margin-bottom:0}
.examined-life .pillar strong{color:var(--ink)}

/* framework block */
.examined-life .engine{background:#211d18;color:#f3ede1;border-radius:18px;
  padding:clamp(1.6rem,4vw,2.6rem);margin:2.2rem 0;
  box-shadow:0 30px 60px -40px rgba(0,0,0,.8)}
.examined-life .engine .card-label{color:var(--accent-soft)}
.examined-life .engine h3{color:#fff}
.examined-life .engine p{color:#d8d0c2;font-size:1.06rem;line-height:1.6}
.examined-life .engine .step{display:grid;grid-template-columns:auto 1fr;gap:1.1rem;
  padding:1.1rem 0;border-top:1px solid rgba(255,255,255,.1)}
.examined-life .engine .step:first-of-type{border-top:0}
.examined-life .engine .step .letter{font-family:var(--mono);font-size:1.5rem;font-weight:500;
  color:var(--accent-soft);line-height:1.1}
.examined-life .engine .step h4{color:#fff;margin-bottom:.35rem}
.examined-life .engine .step p{margin:0;color:#c9c0b1;font-size:1rem}

/* script (good/bad) */
.examined-life .script{max-width:var(--maxw);margin:1.6rem auto;display:grid;gap:.8rem}
.examined-life .row{border-radius:12px;padding:1.1rem 1.3rem;border:1px solid var(--line)}
.examined-life .row .tag{font-family:var(--mono);font-size:.64rem;letter-spacing:.14em;text-transform:uppercase;
  display:block;margin-bottom:.5rem}
.examined-life .row .say{margin:0;font-size:1.1rem;line-height:1.45}
.examined-life .row.bad{background:#fbf1ec}.examined-life .row.bad .tag{color:var(--warn)}
.examined-life .row.good{background:#eef4ee}.examined-life .row.good .tag{color:var(--good)}

/* table */
.examined-life .tbl{width:100%;border-collapse:collapse;margin:1.6rem 0;font-size:1rem}
.examined-life .tbl th,.examined-life .tbl td{text-align:left;padding:.8rem .7rem;border-bottom:1px solid var(--line);vertical-align:top}
.examined-life .tbl th{font-family:var(--mono);font-size:.66rem;letter-spacing:.1em;text-transform:uppercase;
  color:var(--accent);font-weight:500}
.examined-life .tbl td:first-child{font-weight:500;color:var(--ink)}

/* flags */
.examined-life .flags{background:#fbf1ec;border:1px solid #e8d3c8;border-radius:14px;
  padding:clamp(1.3rem,3vw,1.9rem);margin:1.8rem 0}
.examined-life .flags .card-label{color:var(--warn)}
.examined-life .flags .tick{background:var(--warn)}
.examined-life .flags ul{list-style:none;margin:0;padding:0;display:grid;gap:.7rem}
.examined-life .flags li{display:flex;gap:.7rem;font-size:1.04rem;line-height:1.45}
.examined-life .flags li::before{content:"!";flex:0 0 auto;width:20px;height:20px;border-radius:50%;
  background:var(--warn);color:#fff;font-family:var(--mono);font-size:.75rem;
  display:flex;align-items:center;justify-content:center;font-weight:600;margin-top:.15rem}

/* toolkit */
.examined-life .toolkit{display:grid;gap:1.1rem;margin:2rem 0}
.examined-life .tool{background:var(--paper);border:1px solid var(--line);border-radius:14px;
  padding:clamp(1.2rem,3vw,1.7rem);box-shadow:0 14px 40px -34px rgba(0,0,0,.5)}
.examined-life .tool-head{display:flex;align-items:center;gap:.8rem;margin-bottom:.7rem}
.examined-life .tn{font-family:var(--mono);font-size:1.1rem;font-weight:500;color:var(--accent-soft)}
.examined-life .tool p{margin:0 0 .6rem;font-size:1.02rem;line-height:1.5}
.examined-life .tool ul{margin:0;padding-left:1.1rem}
.examined-life .tool li{margin:.25rem 0;font-size:1rem;line-height:1.4}
.examined-life .tool .lines li{list-style:none;padding-left:0;border-bottom:1px dashed var(--line);padding-bottom:.4rem}
.examined-life .tool .lines{padding-left:0}

/* litany / coda */
.examined-life .litany{max-width:var(--maxw);margin:2.4rem auto;padding:1.6rem clamp(1rem,5vw,2rem);
  border-left:3px solid var(--accent-soft)}
.examined-life .litany p{margin:.2rem 0;font-size:1.15rem;font-style:italic;color:var(--ink-soft)}
.examined-life .coda{max-width:var(--maxw);margin:2.6rem auto 0;padding:0 clamp(1rem,5vw,2rem)}
.examined-life .coda p{margin:0 0 1.1rem;font-size:1.18rem;line-height:1.6}
.examined-life .final{font-size:clamp(1.5rem,3.6vw,2rem)!important;line-height:1.25!important;
  font-weight:440;letter-spacing:-.015em;color:var(--ink)}

.examined-life .wishes{margin:1rem 0;padding-left:1.2rem}
.examined-life .wishes li{margin:.5rem 0;line-height:1.5}
.examined-life .wishes b{color:var(--ink);font-weight:560}

/* tags */
.examined-life .etag{font-family:var(--mono);font-size:.6rem;letter-spacing:.1em;text-transform:uppercase;
  padding:.18rem .5rem;border-radius:5px;font-weight:500;white-space:nowrap;display:inline-block}
.examined-life .est{background:#e7f0e8;color:var(--good)}
.examined-life .sug{background:#f3ecdb;color:var(--accent)}
.examined-life .emerg{background:#f7e3da;color:var(--warn)}

/* references */
.examined-life .refs-section{background:var(--wash);padding:clamp(2.5rem,6vw,4rem) clamp(1rem,5vw,2rem);
  border-top:1px solid var(--line)}
.examined-life .refs-head{max-width:var(--maxw);margin:0 auto 1.8rem}
.examined-life .refs-head h2{margin:.4rem 0 0}
.examined-life .refs{max-width:var(--maxw);margin:0 auto;display:grid;gap:.9rem}
.examined-life .ref{display:grid;grid-template-columns:auto 1fr;gap:.9rem;font-size:.92rem;line-height:1.5;
  color:var(--ink-soft);scroll-margin-top:80px}
.examined-life .ref .n{font-family:var(--mono);font-size:.78rem;color:var(--accent);font-weight:500}
.examined-life .ref em{font-style:italic}
.examined-life .ref .doi{font-family:var(--mono);font-size:.78rem;color:var(--ink-faint)}
.examined-life .ref:target{background:#fff;border-radius:8px;padding:.6rem .8rem;margin:-.6rem -.8rem;
  box-shadow:0 0 0 1px var(--accent-soft)}

.examined-life .foot{text-align:center;padding:2.5rem 1.5rem 3.5rem;font-family:var(--mono);
  font-size:.66rem;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-faint);line-height:2}

@media(min-width:680px){
  .examined-life .pillars{grid-template-columns:1fr}
  .examined-life .tool .grid{columns:2;column-gap:1.5rem}
}

/* Embedded in the modern public article reader, the original Meaning guide
   should keep its useful cards and diagrams but lose the old mini-site inset.
   Align every content block to the same 760px article column used elsewhere. */
.public-shell .ps-article-prose.examined-life {
  --maxw: 760px;
  background: transparent;
}
.public-shell .ps-article-prose.examined-life .examined-life-body {
  max-width: 100%;
}
.public-shell .ps-article-prose.examined-life .examined-life-body article {
  padding-bottom: 0;
}
.public-shell .ps-article-prose.examined-life .examined-life-body :is(.wrap, .pull, .script, .litany, .coda, .refs-head, .refs) {
  max-width: 100%;
  padding-left: 0;
  padding-right: 0;
}
.public-shell .ps-article-prose.examined-life .examined-life-body .wrap {
  margin: 30px 0;
}
.public-shell .ps-article-prose.examined-life .examined-life-body .wrap:first-child {
  margin-top: 0;
}
.public-shell .ps-article-prose.examined-life .examined-life-body .section {
  padding: 0;
}
.public-shell .ps-article-prose.examined-life .examined-life-body :is(.pull, .litany, .coda) {
  margin: 34px 0;
}
.public-shell .ps-article-prose.examined-life .examined-life-body .pull blockquote {
  font-size: clamp(23px, 3vw, 31px);
  /* The .pull renders its own faint .q-mark, so neutralise the generic
     .ps-article-body blockquote CARD + circular ::before quote badge (an
     accent-coloured 48px circle) that would otherwise stack a white box and
     an orange circle over the first word of the quote. */
  background: none;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  padding: 0;
  margin: 0;
}
.public-shell .ps-article-prose.examined-life .examined-life-body .pull blockquote::before {
  content: none;
  display: none;
}
.public-shell .ps-article-prose.examined-life .examined-life-body :is(.card, .pillar, .engine, .row, .flags, .tool, .refs-section) {
  border-radius: 8px;
}
.public-shell .ps-article-prose.examined-life .examined-life-body .refs-section {
  margin: 46px 0 0;
  padding: 32px;
  border: 1px solid var(--line);
}
@media (max-width: 680px) {
  .public-shell .ps-article-prose.examined-life .examined-life-body .refs-section {
    padding: 24px 18px;
  }
}