@font-face {
  font-family: "Source Serif 4";
  src: url("./fonts/source-serif-4/SourceSerif4-Variable.woff2") format("woff2");
  font-style: normal;
  font-weight: 200 900;
  font-display: swap;
}
@font-face {
  font-family: "Source Serif 4";
  src: url("./fonts/source-serif-4/SourceSerif4-Italic-Variable.woff2") format("woff2");
  font-style: italic;
  font-weight: 200 900;
  font-display: swap;
}
@font-face {
  font-family: "Hanken Grotesk";
  src: url("./fonts/hanken-grotesk/HankenGrotesk-Variable.woff2") format("woff2");
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
}
@font-face {
  font-family: "Hanken Grotesk";
  src: url("./fonts/hanken-grotesk/HankenGrotesk-Italic-Variable.woff2") format("woff2");
  font-style: italic;
  font-weight: 100 900;
  font-display: swap;
}

:root{
  --paper:#faf9f7;--paper-2:#f4f3f1;--paper-3:#efeeec;--ink:#1a1c1b;
  --muted:#444748;--faint:#c4c7c7;--rule:rgba(26, 28, 27, 0.14);--rule-strong:rgba(26, 28, 27, 0.28);
  --brand-green:#154534;--brand-green-soft:rgba(21, 69, 52, .14);--brand-green-muted:rgba(21, 69, 52, .38);
  --accent:var(--brand-green);--warn:#6c5725;
  --signal-dark:#1d211f;--signal-light:#f0efeb;
  --radius-editorial:0;--radius-control:2px;
  --max:1200px;--reading:760px;--gutter:32px;
  --serif:"Source Serif 4","Noto Serif","DejaVu Serif","Times New Roman",serif;
  --sans:"Hanken Grotesk","Noto Sans","DejaVu Sans",Arial,sans-serif;
  --motion-fast:120ms;--motion-ui:180ms;--motion-slow:240ms;
  --ease-standard:cubic-bezier(.2, 0, 0, 1);--ease-exit:cubic-bezier(.4, 0, 1, 1);
  --header-offset:68px;
}


/* Concept Index */
.concept-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    border-top: 1px solid var(--rule);
}
.concept-item {
    display: grid;
    grid-template-columns: 24px 1fr;
    gap: 20px;
    padding: 32px 0;
    border-bottom: 1px solid var(--rule);
    align-items: baseline;
    position: relative;
}
.concept-item:nth-child(odd) {
    padding-right: 48px;
    border-right: 1px solid var(--rule);
}
.concept-item:nth-child(even) {
    padding-left: 48px;
}
.concept-num {
    font-family: var(--sans);
    font-size: 13px;
    letter-spacing: 0.1em;
    color: var(--muted);
}
.concept-title {
    font-family: var(--serif);
    font-size: 22px;
    line-height: 1.2;
    margin: 0 0 8px 0;
}
.concept-title a {
    text-decoration: none;
    color: var(--ink);
    transition: color var(--motion-fast) var(--ease-standard);
}
.concept-item:hover .concept-title a, .concept-title a:focus-visible { color: var(--brand-green); }
.concept-title a::after {
    content: "";
    position: absolute;
    inset: 0;
}
.concept-title a:focus-visible::after {
    outline: 2px solid var(--brand-green);
    outline-offset: 4px;
}
.concept-desc {
    font-size: 15px;
    color: var(--muted);
    margin: 0;
    line-height: 1.5;
}

/* De-Bento Utilities */
.rule-top { border-top: 1px solid var(--rule); }
.rule-bottom { border-bottom: 1px solid var(--rule); }
.rule-left { border-left: 1px solid var(--rule); }
.editorial-row { padding: 24px 0; border-bottom: 1px solid var(--rule); }
.editorial-section { padding: 54px 0; border-top: 1px solid var(--rule); }
.editorial-marginalia { border-left: 1px solid var(--rule); padding-left: 20px; }
.editorial-contrast-block { background: var(--signal-dark); color: #fff; padding: 32px; border-radius: var(--radius-editorial); }

*{box-sizing:border-box}
html{background:var(--paper)}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:16px;line-height:1.5;font-synthesis:none}
a{color:inherit;text-decoration:none}
a:hover{text-decoration-thickness:1px;text-underline-offset:4px}
button,input{font:inherit}
button{color:inherit}
img,svg{display:block;max-width:100%}
::selection{background:#d7e2dc;color:#111}
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.skip-link{position:fixed;left:16px;top:-60px;z-index:1000;background:var(--ink);color:#fff;padding:10px 14px}
.skip-link:focus{top:10px}
.reading-progress{position:fixed;top:0;left:0;width:0;height:2px;background:var(--accent);z-index:120;pointer-events:none}
.site-header{position:sticky;top:0;z-index:100;background:var(--paper);border-bottom:1px solid var(--rule);transition:transform var(--motion-ui) var(--ease-standard)}
.site-header__inner{height:68px;max-width:1440px;margin:auto;padding:0 32px;display:flex;align-items:center;justify-content:space-between}
.wordmark{font-family:var(--serif);font-size:24px;font-weight:600;letter-spacing:-.02em}
.wordmark-logo{height:24px;width:auto;display:block;margin-bottom:2px}
.wordmark small{display:block;font-family:var(--sans);font-size:10px;letter-spacing:.13em;font-weight:600;margin-top:-2px;color:var(--muted)}
.desktop-nav{display:flex;align-items:center;gap:30px}
.nav-link,.language-link,.utility-link{font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);transition:color var(--motion-fast) var(--ease-standard)}
.nav-link:hover,.nav-link:focus-visible,.utility-link:hover,.utility-link:focus-visible{color:var(--brand-green)}
.nav-link[aria-current="page"]{color:var(--ink);border-bottom:2px solid var(--brand-green);padding-bottom:3px}
/* Series dropdown — accessibility-first */
.nav-series-menu{position:relative}
.nav-series-trigger{
  font-family:var(--sans);font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);
  border:0;background:transparent;padding:0;cursor:pointer;
  display:inline-flex;align-items:center;gap:8px;
}
.nav-series-trigger:hover,.nav-series-trigger:focus-visible{color:var(--ink)}
.nav-series-trigger svg{width:11px;height:11px;transition:transform var(--motion-ui) var(--ease-standard);flex-shrink:0}
/* Hover bridge — extends hit area so menu doesn't close between trigger and panel */
.nav-series-menu::after{content:"";position:absolute;left:0;right:0;top:100%;height:10px;pointer-events:auto}
/* Panel — starts at top:100% with no gap; internal padding creates breathing room */
.nav-series-dropdown{
  position:absolute;top:100%;left:0;
  min-width:220px;
  opacity:0;visibility:hidden;pointer-events:none;transform:translateY(-4px);
  transition:opacity var(--motion-ui) var(--ease-standard),visibility var(--motion-ui) var(--ease-standard),transform var(--motion-ui) var(--ease-standard);
  z-index:300;
}
.nav-series-dropdown__inner{
  border-top:2px solid var(--ink);
  border-bottom:1px solid var(--rule);
  background:var(--paper);
  padding:6px 0;
}
/* Open states: hover, focus-within, or JS data-open */
.nav-series-menu:hover .nav-series-dropdown,
.nav-series-menu:focus-within .nav-series-dropdown,
.nav-series-menu[data-open="true"] .nav-series-dropdown{
  opacity:1;visibility:visible;pointer-events:auto;transform:translateY(0);
}
/* Rotate chevron when open */
.nav-series-menu:hover .nav-series-trigger svg,
.nav-series-menu:focus-within .nav-series-trigger svg,
.nav-series-menu[data-open="true"] .nav-series-trigger svg{transform:rotate(180deg)}
.nav-series-item{
  display:block;padding:10px 20px;
  font-family:var(--serif);font-size:17px;
  color:var(--ink);text-decoration:none;white-space:nowrap;
}
.nav-series-item:hover{background:rgba(0,0,0,.04)}
.header-tools{display:flex;align-items:center;gap:18px}
.icon-button{width:40px;height:40px;border:0;background:transparent;display:grid;place-items:center;cursor:pointer;color:var(--ink);transition:color var(--motion-fast) var(--ease-standard)}
.icon-button:hover,.icon-button:focus-visible{color:var(--brand-green)}
.icon-button svg{width:20px;height:20px}
.preview-strip{background:var(--ink);color:#fff;padding:7px 20px;text-align:center;font-size:11px;letter-spacing:.1em;text-transform:uppercase}
.page{min-height:70vh}
.shell{max-width:var(--max);margin:0 auto;padding:0 var(--gutter)}
.label{font-size:12px;line-height:1.25;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.serif{font-family:var(--serif)}
.display{font-family:var(--serif);font-size:clamp(36px,4.5vw,56px);line-height:1.02;letter-spacing:-.035em;font-weight:600}
.display-md{font-family:var(--serif);font-size:clamp(28px,3.5vw,44px);line-height:1.08;letter-spacing:-.025em;font-weight:600}
.headline{font-family:var(--serif);font-size:clamp(24px,2.5vw,32px);line-height:1.14;font-weight:500}
.lede{font-family:var(--serif);font-size:clamp(18px,1.5vw,22px);line-height:1.45;color:#353837}
.body-reading{font-family:var(--serif);font-size:19px;line-height:1.62}
.muted{color:var(--muted)}
.rule{height:1px;background:var(--rule);border:0}
.hero-front{padding:92px 0 112px}
.hero-front__grid{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(260px,.7fr);gap:64px;align-items:end}
.hero-front__title{max-width:860px;margin:24px 0 30px}
.hero-front__aside{border-left:1px solid var(--rule);padding-left:28px}
.meta-stack{display:grid;gap:18px}
.meta-pair dt{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);font-weight:700}
.meta-pair dd{margin:5px 0 0;font-family:var(--serif);font-size:19px;display:flex;align-items:center;gap:6px}
.meta-pair svg{width:0.95rem;height:0.95rem}
.text-link{display:inline-flex;align-items:center;gap:12px;margin-top:32px;font-size:12px;letter-spacing:.1em;font-weight:700;text-transform:uppercase;color:var(--ink);text-decoration:none}
.text-link::after{content:"→";font-size:18px;font-weight:400;color:var(--brand-green);transition:transform var(--motion-fast) var(--ease-standard)}
.text-link:hover::after{transform:translateX(4px)}
.section-cta{white-space:nowrap}
.section{padding:92px 0;border-top:1px solid var(--rule)}
.section-header{display:flex;align-items:end;justify-content:space-between;gap:32px;margin-bottom:54px}
.section-header .label, .hero-front__grid .label { color: var(--brand-green); }
.section-header p{max-width:620px;margin:10px 0 0}
.series-pair{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--rule)}
.series-card{padding:42px 0 48px;border-bottom:1px solid var(--rule)}
.series-card:nth-child(odd){padding-right:48px;border-right:1px solid var(--rule)}
.series-card:nth-child(even){padding-left:48px}
.series-card__number{font-family:var(--serif);font-size:40px;color:var(--brand-green-muted)}
.series-card h3{font-family:var(--serif);font-size:32px;line-height:1.15;margin:18px 0}
.series-card p{color:var(--muted);max-width:520px}
.article-list{border-top:1px solid var(--rule)}
.article-row{display:grid;grid-template-columns:90px minmax(0,1.5fr) minmax(220px,.6fr);gap:32px;padding:32px 0;border-bottom:1px solid var(--rule);align-items:start}
.article-row__num{font-family:var(--serif);font-size:24px;color:rgba(26,28,27,.28)}
.article-row h3{font-family:var(--serif);font-size:25px;line-height:1.25;margin:0 0 10px}
.article-row p{margin:0;color:var(--muted)}
.article-row__meta{font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);display:grid;gap:8px}




.site-footer{border-top:1px solid var(--rule);padding:56px 0 32px;margin-top:64px}
.footer-grid{display:grid;grid-template-columns:5fr 4fr 3fr;gap:40px}
.footer-heading{font-family:var(--sans);font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin:0 0 20px}
.footer-links{list-style:none;padding:0;margin:0}
.footer-links li{margin-bottom:12px}
.footer-links a{font-size:15px;line-height:1.4;color:var(--ink);text-decoration:none;transition:color var(--motion-fast) var(--ease-standard)}
.footer-links a:hover{color:var(--brand-green)}
.footer-links a:focus{opacity:0.6}
.footer-note{font-size:13px;line-height:1.6;color:var(--muted);max-width:400px;margin-top:16px}
.footer-legal-wrap{border-top:1px solid var(--rule);margin-top:48px;padding-top:24px}
.footer-legal{font-size:12px;line-height:1.6;color:var(--muted);max-width:960px;margin:0}
.bottom-nav{display:none}
.index-masthead{padding:100px 0 86px;max-width:860px}
.index-masthead p{max-width:660px}
.index-track{padding-bottom:70px}
.index-entry{display:grid;grid-template-columns:3.5fr 8.5fr;gap:clamp(3rem,6vw,5rem);padding:64px 0;border-top:1px solid var(--rule);align-items:start}
.index-series-meta{display:flex;flex-direction:column;gap:12px}
.index-series-meta .index-entry__num{font-family:var(--sans);font-size:44px;color:var(--faint);line-height:1}
.index-series-meta h2{font-family:var(--serif);font-size:clamp(30px,3vw,42px);line-height:1.1;margin:0}
.index-series-meta h2 a{text-decoration:none}
.index-series-meta h2 a:hover{text-decoration:underline}
.index-series-meta .lede{margin:12px 0 0;font-size:18px}
.index-series-count{font-family:var(--sans);font-size:13px;letter-spacing:.05em;color:var(--faint);text-transform:uppercase;margin-top:24px}
.index-article-list{display:flex;flex-direction:column}
.index-article-row{display:grid;grid-template-columns:40px 1fr max-content;gap:24px;padding:24px 0;border-bottom:1px solid var(--rule);align-items:baseline}
.index-article-row:last-child{border-bottom:0}
.index-article-row__num{font-family:var(--sans);font-size:20px;color:var(--faint)}
.index-article-row__title{font-family:var(--serif);font-size:22px;line-height:1.3}
.index-article-row__title a{text-decoration:none}
.index-article-row__title a:hover{text-decoration:underline}
.index-article-row__meta{font-size:13px;color:var(--muted)}

/* Compact Series Directory */
.compact-series-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:40px;border-top:1px solid var(--rule)}
.compact-series-card{display:flex;gap:24px;align-items:baseline;padding-top:40px}
.compact-series-num{font-family:var(--sans);font-size:32px;color:var(--faint);line-height:1}
.compact-series-content h3{font-family:var(--serif);font-size:24px;line-height:1.2;margin:0 0 12px}
.compact-series-content h3 a{text-decoration:none}
.compact-series-content h3 a:hover{text-decoration:underline}
.compact-series-content p{color:var(--muted);margin:0 0 16px;line-height:1.5}
.compact-series-meta{font-size:12px;text-transform:uppercase;letter-spacing:.1em;color:var(--faint);font-weight:700}
.series-hero{padding:64px 0 32px}
.series-hero__grid{display:grid;grid-template-columns:1fr 330px;gap:64px;align-items:end}
.series-figure{margin:0 0 72px}
.series-figure img{width:100%;height:auto;border-radius:2px}
.figure-caption{font-size:12px;color:var(--muted);margin-top:12px;line-height:1.5}
.series-layout{display:grid;grid-template-columns:minmax(0,820px) 270px;gap:64px;align-items:start}
.timeline{padding-bottom:40px}
.timeline-item{display:grid;grid-template-columns:42px minmax(0,1fr);gap:28px;padding:32px 0;border-bottom:1px solid var(--rule);align-items:start}
.timeline-item h2{font-family:var(--serif);font-size:28px;line-height:1.22;margin:0 0 12px}
.timeline-item p{margin:0;color:var(--muted)}
.timeline-item__meta{display:flex;gap:14px;margin-bottom:10px;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.series-aside{position:sticky;top:105px;border-top:1px solid var(--ink);padding-top:20px}
.series-aside dl{display:grid;gap:18px}
.series-aside dt{font-size:11px;text-transform:uppercase;letter-spacing:.1em;color:var(--muted)}
.series-aside dd{margin:3px 0 0;font-family:var(--serif);font-size:17px}
.article-masthead{padding:82px 0 80px}
.article-masthead__inner{max-width:1040px}
.article-masthead h1{max-width:980px;margin:22px 0 28px}
.article-masthead .lede{max-width:840px}
.article-meta{display:flex;flex-wrap:wrap;gap:12px 24px;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);padding:18px 0;margin-top:38px;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.article-layout{max-width:1120px;margin:0 auto;padding:0 32px 100px;display:grid;grid-template-columns:minmax(0,var(--reading)) 260px;gap:64px;align-items:start}
.article-body{font-family:var(--serif);font-size:clamp(17px, 1.2vw + 15px, 19px);line-height:1.65;min-width:0;counter-reset:article-section}
.article-body > p, .article-body > ul, .article-body > ol, .article-body > blockquote, .article-body > h2, .article-body > h3 { max-width: 66ch; }
.article-body > p{margin:0 0 24px}
.article-body > h2{font-family:var(--serif);font-size:32px;line-height:1.16;font-weight:500;margin:2.8rem 0 20px;scroll-margin-top:calc(var(--header-offset) + 32px);border-top:1px solid var(--rule);padding-top:1.5rem;counter-increment:article-section}
.article-body > h2::before{content:counter(article-section, decimal-leading-zero) ". ";font-family:var(--sans);color:var(--brand-green);font-size:0.6em;margin-right:0.6em;font-weight:normal;letter-spacing:.05em}
.article-body > h3{font-family:var(--serif);font-size:24px;line-height:1.22;font-weight:500;margin:38px 0 16px;scroll-margin-top:calc(var(--header-offset) + 32px)}
.article-body ul{padding-left:1.2em;margin:0 0 30px}
.article-body li{margin-bottom:12px}
.article-body a{color:var(--ink);text-decoration:underline;text-underline-offset:3px;transition:color var(--motion-fast) var(--ease-standard), text-decoration-color var(--motion-fast) var(--ease-standard)}
.article-body a:hover,.article-body a:focus-visible{color:var(--brand-green);text-decoration-color:var(--brand-green)}
.article-body > blockquote { border-left: 2px solid var(--brand-green); padding-left: 20px; margin: 24px 0; color: var(--ink); font-style: italic; }
.takeaways{border-top:1px solid var(--rule-strong);margin:48px 0 64px;padding-top:24px;list-style:none;padding-left:0}
.takeaways h2{font-family:var(--sans);font-size:12px;line-height:1.2;letter-spacing:.1em;text-transform:uppercase;margin:0 0 24px}
.takeaways ol{list-style:none;padding:0;margin:0}
.takeaways li{display:grid;grid-template-columns:48px 1fr;gap:16px;border-bottom:1px solid var(--rule);padding:24px 0;align-items:baseline}
.takeaways li:last-child{border-bottom:0}
.takeaways .n{font-family:var(--sans);font-size:24px;font-weight:300;color:var(--faint)}
.takeaways p{margin:0}
.editorial-box{font-family:var(--sans);font-size:15px;line-height:1.6;margin:42px 0;padding:20px 0 20px 24px;border-left:2px solid var(--accent)}
.editorial-box h4{font-size:11px;letter-spacing:.1em;text-transform:uppercase;margin:0 0 8px;color:var(--ink)}
.editorial-box p{margin:0}
.editorial-box.evidence{border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);border-left:0;padding:20px 0;background:transparent}
.editorial-box.caution{border-left:0;background:var(--signal-light);padding:24px;border-radius:var(--radius-editorial);color:var(--ink)}
.editorial-box.caution h4{color:var(--warn)}
.article-aside{display:grid;gap:36px;font-size:13px;color:var(--muted);align-self:start}
@media (min-width: 1200px) and (min-height: 760px) {
  .article-aside { position: sticky; top: 102px; }
}
.aside-section{border-top:1px solid var(--rule);padding-top:16px}
.aside-section h2{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink);margin:0 0 14px}
.aside-section dl{display:grid;gap:14px}
.aside-section dt{font-size:11px;letter-spacing:.08em;text-transform:uppercase}
.aside-section dd{margin:3px 0 0;color:var(--ink);font-family:var(--serif);font-size:15px}
.toc-list{list-style:none;margin:0;padding:0;display:grid;gap:9px}
.toc-list a{display:block;border-left:1px solid transparent;padding-left:10px;line-height:1.35}
.toc-list a.active{border-left-color:var(--accent);color:var(--ink)}
.mobile-toc{display:none}
.article-end{max-width:1120px;margin:0 auto;padding:0 32px}
.scope-disclosure{border-top:1px solid var(--rule);padding:28px 0;font-size:13px;line-height:1.65;color:var(--muted)}
.sequence-nav{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--rule)}
.sequence-link{padding:32px 0;display:flex;flex-direction:column;gap:8px}
.sequence-link+ .sequence-link{border-left:1px solid var(--rule);padding-left:32px;text-align:right}
.sequence-link:last-child{text-align:right}
.sequence-link span{display:block;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-bottom:10px}
.sequence-link strong{font-family:var(--serif);font-size:24px;line-height:1.25;font-weight:500}
.related-list{display:flex;flex-direction:column}
.related-card{display:grid;grid-template-columns:180px 1fr;gap:24px;padding:24px 0;border-bottom:1px solid var(--rule);align-items:start}
.related-card h3{font-family:var(--serif);font-size:22px;line-height:1.25;margin:10px 0}
.related-card p{font-size:14px;color:var(--muted)}
.explore{min-height:80vh;padding:88px 0}
.search-box{display:flex;align-items:center;gap:18px;border-bottom:2px solid var(--ink);padding-bottom:12px;margin-bottom:60px}
.search-box input{border:0;background:transparent;width:100%;font-size:32px;font-family:var(--serif);outline:none}
.search-box svg{width:28px}
.explore-grid{display:grid;grid-template-columns:minmax(0, 8fr) minmax(240px, 3fr);gap:clamp(3rem, 6vw, 5rem);margin-top:70px}
.results{display:grid}
.search-result{padding:26px 0;border-top:1px solid var(--rule)}
.search-result h3{font-family:var(--serif);font-size:24px;margin:7px 0}
.search-result p{color:var(--muted);margin:0}
.concept-links{display:grid}
.concept-link{padding:18px 0;border-top:1px solid var(--rule);font-family:var(--serif);font-size:21px}
.saved-page{padding:90px 0}
.method-hero{padding:100px 0 72px;max-width:900px}
.method-layout{display:grid;grid-template-columns:minmax(0,760px) 280px;gap:64px;align-items:start}
.method-body{font-family:var(--serif);font-size:19px;line-height:1.62}
.method-body h2{font-size:34px;line-height:1.2;margin:70px 0 22px}
.method-body h3{font-family:var(--sans);font-size:12px;letter-spacing:.1em;text-transform:uppercase;margin:34px 0 8px}
.method-rail{border-top:1px solid var(--ink);padding-top:18px;align-self:start}
@media (min-height: 760px) {
  .method-rail { position: sticky; top: 100px; }
}
.method-rail ol{list-style:upper-roman;padding-left:1.4em;color:var(--muted)}
.method-rail li{margin-bottom:16px}
.illustration-plate{margin:42px 0}
.illustration-plate img{width:100%;height:auto;border-radius:2px}
.internal{max-width:1120px;margin:auto;padding:60px 30px 100px}
.internal-grid{display:grid;grid-template-columns:1fr 1fr;gap:30px}
.internal-panel{border:1px solid var(--rule);padding:24px;background:#fff}
.internal label{display:block;font-size:11px;letter-spacing:.08em;text-transform:uppercase;margin:12px 0 6px}
.internal input,.internal textarea,.internal select{width:100%;border:1px solid var(--faint);background:#fff;padding:10px}
.internal textarea{min-height:180px}
.internal button{border:1px solid var(--ink);background:var(--ink);color:#fff;padding:10px 14px;cursor:pointer}
.internal table{border-collapse:collapse;width:100%;font-size:13px}
.internal th,.internal td{border-bottom:1px solid var(--rule);text-align:left;padding:10px 6px}
.noindex-note{font-size:12px;color:#7a2f24;border-left:2px solid #7a2f24;padding-left:12px}
@media(max-width:1200px){
  .article-layout{display:flex;flex-direction:column;max-width:824px;gap:48px}
  .article-aside{order:-1;position:static;width:100%;padding-top:0}
  .article-aside .aside-section:last-child{display:none}
  .mobile-toc{display:block;margin:0 0 42px;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);padding:14px 0}
  .mobile-toc summary{font-size:12px;letter-spacing:.1em;text-transform:uppercase;cursor:pointer}
  .mobile-toc .toc-list{margin-top:16px}
}
@media(max-width:1000px){
  .hero-front__grid,.series-hero__grid,.series-layout,.method-layout{grid-template-columns:1fr}
  .hero-front__aside,.series-aside,.method-rail{position:static}
  .footer-grid{grid-template-columns:1fr 1fr;gap:48px}
  .footer-brand{grid-column:1/-1}
}
@media(max-width:760px){

  .concept-grid { grid-template-columns: 1fr; }
  .concept-item:nth-child(odd) { padding-right: 0; border-right: 0; }
  .concept-item:nth-child(even) { padding-left: 0; }

  body{padding-bottom:70px}
  .site-header__inner{height:64px;padding:0 20px}
  .desktop-nav{display:none}
  .wordmark{font-size:21px}
  .wordmark-logo{height:21px}
  .header-tools .utility-link, .header-tools .header-saved {display:none}
  .shell{padding:0 20px}
  .bottom-nav{position:fixed;display:grid;grid-template-columns:repeat(3,1fr);bottom:0;left:0;right:0;min-height:66px;background:rgba(250,249,247,.97);border-top:1px solid var(--rule);z-index:110;padding-bottom:env(safe-area-inset-bottom)}
  .bottom-nav a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;min-height:48px;font-size:11px;letter-spacing:.08em;font-weight:600;text-transform:uppercase;color:var(--muted);border-top:2px solid transparent;padding:8px 0}
  .bottom-nav a svg{width:20px;height:20px;stroke-width:1.5px}
  .bottom-nav a[aria-current="page"]{background:transparent;border-top:2px solid var(--brand-green);color:var(--brand-green);font-weight:700}
  .hero-front{padding:56px 0 72px}
  .hero-front__grid{gap:50px}
  .display{font-size:36px}
  .display-md{font-size:28px}
  .lede{font-size:18px}
  .hero-front__aside{border-left:0;border-top:1px solid var(--rule);padding:22px 0 0}
  .section{padding:68px 0}
  .section-header{display:block;margin-bottom:36px}
  .series-pair{display:block}
  .series-card,.series-card:nth-child(odd),.series-card:nth-child(even){padding:34px 0;border-right:0}
  .article-row{grid-template-columns:44px 1fr;gap:16px;padding:24px 0}
  .article-row__meta{grid-column:2}
  
  
  .footer-grid{grid-template-columns:1fr;gap:40px}
  .site-footer{padding-bottom:80px}
  .index-masthead{padding:58px 0}

  .series-hero{padding:54px 0 32px}
  .series-hero__grid{gap:28px}
  .series-figure{margin-bottom:48px}
    .timeline-item{grid-template-columns:28px 1fr;gap:16px;padding-bottom:42px}
    .timeline-item h2{font-size:25px}
  .article-masthead{padding:52px 0 44px}
  .article-masthead h1{font-size:39px}
  .compact-series-grid{grid-template-columns:1fr}
  .article-meta{gap:10px 16px}
  .article-layout,.article-end{padding-left:20px;padding-right:20px}
  .article-body > h2{font-size:28px;margin-top:2.5rem;padding-top:1rem}
  .article-body > h3{font-size:22px}
  .takeaways li{display:grid;grid-template-columns:48px 1fr;gap:16px;border-bottom:1px solid var(--rule);padding:24px 0;align-items:baseline}
  .takeaways .n{font-family:var(--sans);font-size:24px;font-weight:300;color:var(--faint)}
  .sequence-nav{display:grid;grid-template-columns:1fr;border-top:1px solid var(--rule)}
  .sequence-link{padding:24px 0}
  .sequence-link,.sequence-link+ .sequence-link{border-left:0;border-top:1px solid var(--rule);padding-left:0;text-align:left}
  .sequence-link:first-child{border-top:0}
  .related-list{display:flex;flex-direction:column}
  .related-card,  .explore{padding:52px 0}
  .search-box input{border:0;background:transparent;width:100%;font-size:32px;font-family:var(--serif);outline:none}
  .explore-grid{grid-template-columns:1fr;gap:52px}
  .method-hero{padding:60px 0 40px}
  .method-body{font-size:18px}
  .internal-grid{grid-template-columns:1fr}
}

@keyframes save-pulse {
  0% { transform: scale(1); }
  50% { transform: scale(1.10); }
  100% { transform: scale(1); }
}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto}
  .nav-series-dropdown{transition:none!important;transform:none!important}
  .save-btn[aria-pressed="true"] .lucide-bookmark-check{animation:none!important}
  .site-header{transition:none!important;transform:none!important}
}
.timeline-num{font-family:var(--sans);font-size:22px;color:var(--faint)}
.timeline-item.current .timeline-num{color:var(--brand-green);font-weight:700}
.search-box input:focus-visible{outline:2px solid var(--brand-green);outline-offset:8px;border-radius:var(--radius-control)}
.method-body { counter-reset: h2; }
.method-body h2 { counter-increment: h2; border-top: 1px solid var(--rule); padding-top: 24px; margin-top: 48px; }
.method-body h2::before { content: counter(h2, upper-roman) ". "; color: var(--brand-green); margin-right: 8px; }
.article-row__meta button { border: 0; background: transparent; cursor: pointer; padding: 0; margin-top: 8px; }

/* Print Utilities */
.print-only { display: none; }
@media print {
  .print-only { display: block; }
  .site-header, .bottom-nav, .search-box, .reading-progress, .article-actions, .mobile-toc, .sequence-nav, .concept-links, .related-list { display: none !important; }
  
  a.print-url::after {
    content: " (" attr(href) ")";
    overflow-wrap: anywhere;
    font-size: 8pt;
  }
  
  @page { margin: 18mm 16mm 20mm; }
  
  body, .page, .article-body, .editorial-box {
    background: white !important;
    color: black !important;
  }
  
  .editorial-box, .series-figure, .takeaways, figure {
    break-inside: avoid;
  }
  
  .print-header {
    margin-bottom: 2rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid black;
    font-size: 10.5pt;
    line-height: 1.5;
  }
  .print-header h1 { font-size: 16pt; margin-bottom: 0.5rem; }
  .print-preview-warning { font-weight: bold; margin-top: 1rem; }
}

/* Reading Progress */
.reading-progress {
  position: fixed;
  top: 0; left: 0; right: 0;
  height: 2px;
  z-index: 100;
  background: transparent;
}
.reading-progress__bar {
  display: block;
  height: 100%;
  background: var(--foreground);
  width: 0%;
  transition: width 0.1s ease-out;
}
@media (prefers-reduced-motion: reduce) {
  .reading-progress__bar { transition: none; }
}

/* Lightbox */
.js-only { display: none; }
html.js .js-only { display: inline-flex; }

.expand-btn {
  background: transparent;
  border: 1px solid var(--border);
  padding: 0.25rem 0.5rem;
  margin-left: auto;
  cursor: pointer;
  align-items: center;
  gap: 0.25rem;
  font-size: 0.8rem;
}
.expand-btn svg { width: 1em; height: 1em; }

dialog.image-lightbox {
  padding: 0;
  border: none;
  background: var(--background);
  width: 100vw; height: 100vh;
  max-width: none; max-height: none;
  margin: 0;
}
dialog.image-lightbox:not([open]) { display: none; }
dialog.image-lightbox::backdrop { background: rgba(0,0,0,0.9); }

.lightbox-content {
  display: flex; flex-direction: column;
  height: 100%; align-items: center; justify-content: center;
  position: relative;
}
.lightbox-img { max-width: 90vw; max-height: 80vh; object-fit: contain; }
.lightbox-caption { padding: 1rem; text-align: center; }
.lightbox-close {
  position: absolute; top: 1rem; right: 1rem;
  background: var(--background); border: 1px solid var(--border);
  padding: 0.5rem; cursor: pointer;
}

/* Drop Cap Experiment */
.has-drop-cap > p:first-of-type::first-letter {
  float: left;
  font-size: 3.5em;
  line-height: 0.8;
  padding-right: 0.1em;
}

/* Icon Alignment */
.icon-button { display: inline-flex; align-items: center; gap: 0.25rem; }
.icon-button svg { width: 1.25em; height: 1.25em; }
.nav-link-icon { display: inline-flex; align-items: center; gap: 0.25rem; }
.nav-link-icon svg { width: 1em; height: 1em; }

/* Inline Icons & Metadata */
.article-meta, .article-row__meta, .timeline-item__meta {
  display: flex; flex-wrap: wrap; align-items: center; gap: 0.75rem; row-gap: 0.5rem;
}
.meta-item {
  display: inline-flex; align-items: center; gap: 0.3rem; white-space: nowrap;
}
.article-meta .meta-item:not(:last-child)::after, .timeline-item__meta .meta-item:not(:last-child)::after {
  content: "·"; margin-left: 0.75rem; color: var(--border);
}
@media (max-width: 390px) {
  .article-meta .meta-item:not(:last-child)::after, .timeline-item__meta .meta-item:not(:last-child)::after { display: none; }
  .article-meta, .timeline-item__meta { column-gap: 1.25rem; }
}

.heading-icon {
  display: inline-flex; align-items: center; margin-right: 0.5rem; vertical-align: text-bottom;
}
.heading-icon svg { width: 1em; height: 1em; }
.inline-icon {
  display: inline-flex; align-items: center; margin-left: 0.2rem; vertical-align: middle;
}
.inline-icon svg { width: 1em; height: 1em; }

.meta-item svg { width: 0.9rem; height: 0.9rem; flex: 0 0 auto; stroke-width: 1.5; }
.draft-text { text-transform: uppercase; font-size: 0.85em; font-weight: 500; letter-spacing: 0.05em; }

.save-btn[aria-pressed="false"] .lucide-bookmark-check { display: none; }
.save-btn[aria-pressed="true"] .lucide-bookmark { display: none; }
.save-btn[aria-pressed="true"] { color: var(--brand-green); }
.save-btn.is-just-saved .lucide-bookmark-check { animation: save-pulse var(--motion-ui) var(--ease-standard); }

.article-actions { display: flex; gap: 1rem; margin-left: auto; align-items: center; }

.article-actions .icon-button { width: auto; height: auto; padding: 0.25rem 0.5rem; }

@media (max-width: 360px) { .wordmark small { display: none; } }

html { scroll-padding-top: var(--header-offset); }
@media(max-width: 760px) { html { scroll-padding-top: var(--header-offset); } }

@media (max-width: 760px) {
  :root { --header-offset: 64px; }
  .article-meta { padding-bottom: 0; }
  .article-actions {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    border-top: 1px solid var(--rule);
    margin-top: 16px;
    gap: 0;
  }
  .article-actions .icon-button {
    min-height: 48px;
    justify-content: center;
    border-radius: 0;
    padding: 0;
  }
  .article-actions .icon-button:nth-child(2) {
    border-left: 1px solid var(--rule);
  }
}

@media (max-width: 600px) {
  .article-meta .meta-item::after,
  .timeline-item__meta .meta-item::after,
  .article-row__meta .meta-item::after {
    display: none !important;
  }
  .article-meta {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px 16px;
  }
  .article-meta .meta-item:nth-child(3),
  .article-meta .meta-item.draft-text {
    grid-column: 1 / -1;
  }
}

@media (max-width: 760px) {
  .article-masthead h1 { margin-bottom: 24px; }
  .article-meta { margin-top: 28px; padding-top: 18px; }
}

@media (max-height: 500px) and (orientation: landscape) {
  .bottom-nav {
    min-height: 52px;
  }
  .bottom-nav a {
    flex-direction: row;
    gap: 8px;
    min-height: 40px;
    padding: 4px 0;
  }
  .bottom-nav a svg {
    width: 18px;
    height: 18px;
  }
}

/* Editorial Image Rhythm */
.illustration-hero, .illustration-series-plate, .illustration-interlude, .illustration-article-figure {
  margin: 0;
  break-inside: avoid;
}

.illustration-hero img, 
.illustration-series-plate img, 
.illustration-interlude img, 
.illustration-article-figure img {
  width: 100%;
  height: auto;
  aspect-ratio: 21 / 9;
  object-fit: cover;
  border-radius: 0;
  box-shadow: none;
}

/* Grayscale + High contrast for AI images to look like archival documentation */
.illustration-hero img,
.illustration-series-plate img,
.illustration-article-figure img {
  filter: grayscale(100%) contrast(1.1);
}

.visual-interlude {
  margin: 64px 0;
  border-top: 1px solid var(--rule);
  border-bottom: 1px solid var(--rule);
  padding: 48px 0;
}

/* Home overrides */
.hero-front__image {
  margin-top: 48px;
}
.hero-front__image figure {
  margin: 0;
}
.hero-front__image img {
  aspect-ratio: 21 / 9;
  max-height: 460px;
  width: 100%;
  object-fit: cover;
  border-radius: 2px;
}

.series-rail-image {
  margin-top: 60px;
}



@media (max-width: 900px) {
  .explore-grid{grid-template-columns:1fr;gap:52px}
  .illustration-hero img, 
  .illustration-series-plate img, 
  .illustration-interlude img {
    height: auto;
  }
  .hero-front__image img {
    aspect-ratio: 4 / 3;
    max-height: 400px;
  }
  .illustration-series-plate img, 
  .illustration-interlude img, 
  .illustration-article-figure img {
    aspect-ratio: auto;
  }
  .visual-interlude {
    margin: 42px 0;
    padding: 32px 0;
  }
  .index-entry {
    grid-template-columns: 1fr;
    gap: 32px;
  }
  .index-article-row {
    grid-template-columns: 32px 1fr;
  }
  .index-article-row__meta {
    grid-column: 2;
    padding-top: 4px;
  }
}
