/* Native Writing pages extend the portfolio's existing night-mode design system. */
.writing-page .site-header nav [aria-current]{color:var(--accent)}
.writing-hero{padding-block:70px 42px;max-width:1040px}
.writing-back{display:inline-flex;align-items:center;gap:10px;color:var(--muted);font-size:14px;min-height:44px;margin-bottom:24px}
.writing-back:hover{color:var(--accent)}
.writing-hero h1{font-size:clamp(2.6rem,5.8vw,5.1rem);font-weight:790;line-height:1.03;letter-spacing:-.035em;max-width:18ch}
.writing-deck{font-size:clamp(1.1rem,2vw,1.3rem);line-height:1.7;max-width:66ch;color:var(--muted);margin-top:25px}
.writing-meta{display:flex;flex-wrap:wrap;gap:10px 22px;font-size:13px;color:var(--muted);margin-top:26px}
.writing-meta a{color:var(--ink)}
.writing-cover{margin:0 auto 48px;width:100%;aspect-ratio:16/9;overflow:hidden;background:var(--bg-raise);border:1px solid var(--line);border-radius:12px}
.writing-cover img{width:100%;height:100%;object-fit:cover}
.cover-credit{font-size:12px;color:var(--muted);margin-top:-36px;margin-bottom:40px}
.article-grid{display:grid;grid-template-columns:185px minmax(0,1fr);gap:64px;align-items:start;padding-bottom:100px}
.article-toc{position:sticky;top:104px;font-size:13px;line-height:1.5;max-height:calc(100svh - 130px);overflow:auto}
.article-toc p{color:var(--ink);font-weight:650;margin-bottom:12px}
.article-toc a{display:block;color:var(--muted);padding:7px 0;transition:color .2s}
.article-toc a:hover{color:var(--accent)}
.article-body{min-width:0;max-width:940px}
.article-body>section{padding-block:42px 22px;border-top:1px solid var(--line);scroll-margin-top:96px}
.article-body>section:first-child{padding-top:0;border-top:0}
.article-body h2{font-size:clamp(1.9rem,3.1vw,2.7rem);line-height:1.12;margin:0 0 25px;max-width:28ch;letter-spacing:-.025em}
.article-body h3{font-size:1.25rem;line-height:1.35;margin:30px 0 12px;font-weight:700}
.prose p,.prose ul,.prose ol{max-width:71ch;margin:0 0 20px;line-height:1.9}
.prose ul,.prose ol{padding-left:23px}.prose li{padding-left:5px;margin:9px 0}
.prose a,.chart-source a,.table-scroll a{color:var(--accent);text-decoration:underline;text-decoration-color:color-mix(in srgb,var(--accent) 38%,transparent);text-underline-offset:4px;overflow-wrap:anywhere}
.prose strong{color:var(--white);font-weight:650}
.article-note{color:var(--muted);font-size:14px;line-height:1.8;margin:16px 0 30px;max-width:78ch}
.data-figure{margin:34px 0 38px;background:var(--surface);border:1px solid var(--line-strong);border-radius:12px;padding:24px 24px 16px;min-width:0}
.data-figure figcaption{font-size:17px;font-family:var(--display);font-weight:650;line-height:1.45;color:var(--white);margin-bottom:16px;max-width:65ch}
.chart-scroll{overflow-x:auto;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;scrollbar-color:var(--dim) transparent}
.chart-scroll svg{display:block;width:100%;min-width:540px;height:auto;overflow:visible;font-family:var(--text)}
.chart-grid{stroke:var(--line-strong);stroke-width:1}.chart-tick{fill:var(--muted);font-size:14px}.chart-label{fill:var(--ink);font-size:14px}.chart-axis{stroke:var(--dim);stroke-width:1}
.chart-legend{display:flex;flex-wrap:wrap;gap:8px 20px;margin-top:12px;font-size:12px;color:var(--muted)}
.chart-legend span{display:flex;align-items:center;gap:7px}.chart-legend i{height:3px;width:17px;background:var(--series);display:inline-block;border-radius:2px}
.chart-source{border-top:1px solid var(--line);margin-top:20px;padding-top:10px;font-size:13px;color:var(--muted)}
.chart-source summary{cursor:pointer;min-height:36px;line-height:36px;color:var(--ink);width:fit-content}
.chart-source p{margin:12px 0;line-height:1.75}.chart-source ul{padding-left:20px}.chart-source li{margin:7px 0}.chart-source .table-scroll{max-height:420px;margin-top:15px}
.table-scroll{overflow:auto;border:1px solid var(--line-strong);border-radius:10px;margin:22px 0 30px;max-width:100%;scrollbar-color:var(--dim) transparent}
table{border-collapse:collapse;min-width:100%;font-size:13px;font-variant-numeric:tabular-nums}
caption{text-align:left;padding:16px 18px;color:var(--muted);line-height:1.6;max-width:900px}
th,td{padding:14px 16px;text-align:left;vertical-align:top;border-top:1px solid var(--line);line-height:1.65}
th{background:var(--bg-raise);font-weight:600;color:var(--ink);white-space:nowrap}td{color:var(--muted)}td:first-child{color:var(--ink);min-width:160px}td.num,th.num{text-align:right;white-space:nowrap}td.note{min-width:230px;max-width:420px}
tr[hidden]{display:none}tbody tr:hover{background:var(--surface-hover)}
.table-controls{display:flex;align-items:end;flex-wrap:wrap;gap:18px;margin-top:26px}.field-label{font-size:13px;color:var(--muted);display:flex;flex-direction:column;gap:7px;min-width:160px}
.writing-page select,.writing-page input[type=search],.writing-page input[type=number]{font:inherit;color:var(--ink);background:var(--bg-raise);border:1px solid var(--line-strong);border-radius:8px;padding:10px 12px;min-height:44px;min-width:0;max-width:100%}
.table-count{color:var(--muted);font-size:13px;margin-left:auto;align-self:center}
.calculator{border-block:1px solid var(--line-strong);padding-block:28px;margin-block:30px}.calculator h3{margin-top:0}.calculator-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 24px}.calculator-grid .field-label{min-width:0}.calc-outputs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin:32px 0 20px}.calc-outputs dt{font-size:12px;color:var(--muted);margin-bottom:5px}.calc-outputs dd{font-family:var(--display);font-size:clamp(1.5rem,3vw,2rem);font-weight:720;margin:0;line-height:1.3;color:var(--white)}.calc-breakdown{font-size:13px;color:var(--muted);line-height:1.9;margin:15px 0 20px}.calculator .button{font-size:13px;min-height:44px}
.milestones{padding:0;list-style:none;margin:28px 0}.milestones li{padding:22px 0;border-top:1px solid var(--line)}.milestones h3{font-size:17px;margin:0 0 8px}.milestones p{font-size:14px;line-height:1.8;color:var(--muted);margin:8px 0}.milestones .milestone-state{color:var(--accent);font-size:12px}
.writing-index{padding-bottom:100px;min-height:65svh}.writing-index .writing-hero{padding-bottom:55px}.writing-list{border-top:1px solid var(--line-strong);list-style:none;margin:0;padding:0}.writing-entry{padding:38px 0;border-bottom:1px solid var(--line)}.writing-entry a{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.12fr);align-items:center;gap:48px}.writing-entry img{aspect-ratio:16/9;object-fit:cover;width:100%;border-radius:10px;border:1px solid var(--line)}.writing-entry h2{font-size:clamp(1.8rem,3vw,2.7rem);line-height:1.12;letter-spacing:-.025em;margin-top:14px}.writing-entry p{font-size:15px;color:var(--muted);margin-top:18px;max-width:57ch}.writing-entry time{font-size:13px;color:var(--muted)}.writing-entry .entry-topic{font-size:12px;color:var(--accent)}.writing-entry .entry-read{display:inline-flex;align-items:center;gap:12px;font-size:14px;color:var(--ink);margin-top:24px}.writing-entry a:hover .entry-read{color:var(--accent)}.writing-entry a:hover img{border-color:var(--accent)}
.writing-page footer{border-top:1px solid var(--line);margin-top:0}
@media(max-width:1000px){.article-grid{grid-template-columns:150px minmax(0,1fr);gap:35px}.data-figure{padding:18px 16px 12px}.writing-entry a{gap:30px}}
@media(max-width:760px){.writing-hero{padding-block:35px 30px}.writing-hero h1{font-size:clamp(2.35rem,8vw,3.4rem);max-width:19ch}.writing-deck{font-size:17px}.article-grid{display:block}.article-toc{position:static;max-height:none;display:flex;gap:20px;overflow:auto;white-space:nowrap;border-block:1px solid var(--line);padding:12px 0;margin-bottom:32px}.article-toc p{display:none}.article-toc a{padding:4px 0}.writing-cover{margin-bottom:38px;border-radius:8px}.cover-credit{margin-top:-26px;margin-bottom:30px}.article-body>section{padding-top:32px}.article-body h2{font-size:1.9rem}.data-figure{margin-inline:0}.chart-scroll svg{min-width:520px}.writing-entry a{grid-template-columns:1fr;gap:24px}.writing-entry{padding:28px 0}.writing-entry h2{margin-top:12px}.calc-outputs{gap:12px}.calc-outputs dd{font-size:1.5rem}.calculator-grid{gap:16px}.writing-index .writing-hero{padding-bottom:32px}}
@media(max-width:420px){.calculator-grid{grid-template-columns:1fr}.calc-outputs{grid-template-columns:1fr 1fr}.calc-outputs>div:last-child{grid-column:1/-1}.writing-page .site-header nav{gap:16px}.table-count{margin-left:0}}
@media(prefers-reduced-motion:reduce){.writing-page *{scroll-behavior:auto!important;transition:none!important;animation:none!important}}

.writing-entry a:not(:has(img)){grid-template-columns:minmax(0,1fr);max-width:780px}
@media(max-width:800px){.writing-page .site-header nav a[href="/#experience"],.writing-page .site-header nav a[href="/#about"]{display:none}}
@media(max-width:520px){.writing-page .site-header nav a[href="/#work"],.writing-page .site-header .nav-icon{display:none}.writing-page .header-inner{gap:12px}.writing-page .site-header nav{gap:14px}}

.article-generic{max-width:800px;margin-inline:auto;padding-bottom:100px}
.writing-entry img{height:auto}

/* Keep the core argument readable; retain the complete research below it. */
.chart-panel-title{fill:var(--ink);font-size:17px;font-weight:650}
.chart-reading strong{color:var(--ink)}
#replacement-frontier svg{min-width:800px}
.research-details{margin-top:38px;border-top:1px solid var(--line-strong);padding-top:28px}
.research-details>summary{font-family:var(--display);font-size:clamp(1.5rem,3vw,2rem);color:var(--ink);cursor:pointer;line-height:1.4;padding-block:8px}
.research-details>section{padding-block:42px 22px;border-top:1px solid var(--line);scroll-margin-top:96px}
.article-body h2,.article-body h3,.writing-hero h1{text-wrap:balance}
.prose p{text-wrap:pretty}

#replacement-frontier .feasibility-mobile{display:none}
@media(max-width:600px){#replacement-frontier .feasibility-desktop{display:none}#replacement-frontier .feasibility-mobile{display:block;min-width:0;width:100%}}
/* Argument trend strip: five small multiples, one per cost curve. */
.trend-strip{list-style:none;padding:0;margin:26px 0 38px;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,160px),1fr));gap:12px}
.trend-card{--tone:var(--accent);display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--line-strong);border-radius:12px;padding:18px 15px 16px;min-width:0}
.trend-card[data-tone=up]{--tone:#e5b573}
.trend-card[data-tone=flat]{--tone:#abbcd0}
.trend-card[data-tone=human]{--tone:#edafb9}
.trend-label{font-size:12px;color:var(--muted);margin:0 0 6px}
.trend-big{font-family:var(--display);font-size:clamp(1.45rem,2.6vw,1.8rem);font-weight:720;line-height:1.15;color:var(--tone);margin:0 0 16px}
.trend-bars{list-style:none;padding:0;margin:0 0 14px;display:flex;align-items:flex-end;gap:6px;height:118px}
.trend-bars li{flex:1;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;height:100%;min-width:0;gap:4px}
.trend-bar{display:block;width:100%;max-width:34px;height:calc(var(--h) * .62);background:var(--tone);border-radius:3px 3px 0 0;opacity:.85}
.trend-bars li:last-child .trend-bar{opacity:1}
.trend-value{font-size:11px;color:var(--ink);font-variant-numeric:tabular-nums;white-space:nowrap}
.trend-key{font-size:10.5px;line-height:1.25;color:var(--muted);text-align:center;overflow-wrap:normal;min-height:2.5em}
.trend-note{font-size:12.5px;line-height:1.6;color:var(--muted);margin:auto 0 0;padding-top:12px;border-top:1px solid var(--line)}
/* Human-seconds chart: lines draw in once the figure scrolls into view. */
.chart-sub{font-size:13.5px;line-height:1.7;color:var(--muted);margin:-6px 0 14px;max-width:72ch}
.blink-band{fill:#edafb9;opacity:.09}
.blink-label{fill:#edafb9;font-size:13px;opacity:.85}
.drop-line{stroke:var(--muted);stroke-width:1.5;stroke-dasharray:4 5}
.drop-label{fill:var(--white);font-size:15px;font-weight:650}
.seconds-chart.armed .draw{stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 1.4s var(--ease) var(--d,0s)}
.seconds-chart.armed .pop,.seconds-chart.armed .drop-line,.seconds-chart.armed .drop-label{opacity:0;transition:opacity .5s ease var(--d,1.2s)}
.seconds-chart.armed.in-view .draw{stroke-dashoffset:0}
.seconds-chart.armed.in-view .pop,.seconds-chart.armed.in-view .drop-line,.seconds-chart.armed.in-view .drop-label{opacity:1}