/* A self-contained, original editorial illustration, scoped to the Stein article. */
.post .legacy-content .pencil-journey {
    --pj-ink: #254b38; --pj-muted: #63705b; --pj-paper: #f5f2e7; --pj-line: #d9ddcc;
    margin: 64px 0 56px;
    padding: 34px 30px 24px;
    color: var(--pj-ink);
    background: var(--pj-paper);
    border: 1px solid #daddce;
    border-radius: 12px;
    overflow: hidden;
    isolation: isolate;
    scroll-margin-top: 120px;
    font-family: var(--font-main);
}
.pencil-journey *, .pencil-journey *::before, .pencil-journey *::after { box-sizing: border-box; }
.pencil-journey [hidden] { display: none !important; }
.post .legacy-content .pencil-journey .pj-header { display:flex; align-items:flex-end; justify-content:space-between; gap:20px; margin:0 0 24px; padding:0; }
.pencil-journey .pj-eyebrow { display:block; color:var(--pj-muted); font-size:10px; font-weight:600; letter-spacing:.12em; text-transform:uppercase; }
.post .legacy-content .pencil-journey h2 { color:var(--pj-ink); font-size:clamp(34px,4vw,51px); line-height:1.08; letter-spacing:-.035em; margin:12px 0 0; padding:0; border:0; max-width:none; }
.post .legacy-content .pencil-journey .pj-header p { color:var(--pj-muted); font-size:12px; line-height:1.7; margin:0 0 3px; text-align:right; }
.pencil-journey .pj-workbench { background:#efeee2; border:1px solid var(--pj-line); border-radius:6px; overflow:hidden; }
.pencil-journey .pj-plate-head { display:flex; justify-content:space-between; padding:17px 20px 0; color:var(--pj-muted); font:500 10px/1.4 var(--font-main); letter-spacing:.09em; text-transform:uppercase; }
.pencil-journey .pj-plate-head [data-pj-count] { font-variant-numeric:tabular-nums; }
.pencil-journey .pj-illustration { display:block; width:100%; height:auto; max-height:400px; margin:0; overflow:visible; }
.pencil-journey .pj-scene { display:none; }
.pencil-journey .pj-scene[data-active="true"] { display:inline; animation:pj-appear .45s ease-out both; }
.pencil-journey .pj-outline { fill:none; stroke:#50654c; stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round; }
.pencil-journey .pj-machine { fill:none; stroke:#7d9073; stroke-width:9; stroke-linecap:round; stroke-linejoin:round; }
.pencil-journey .pj-flow { fill:none; stroke:#8a9c76; stroke-width:1.6; stroke-dasharray:4 7; stroke-linecap:round; }
.pencil-journey .pj-callout { fill:none; stroke:#929e82; stroke-width:1; }
.pencil-journey .pj-svg-label { fill:#68745b; font:500 11px var(--font-main); letter-spacing:1.2px; }
.pencil-journey .pj-stage-caption { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:4px 20px 16px; font-size:10px; line-height:1.5; color:var(--pj-muted); }
.pencil-journey .pj-chapter { font-weight:600; letter-spacing:.08em; text-transform:uppercase; }
.pencil-journey .pj-material { font-family:var(--font-display); font-size:14px; font-style:italic; }
.pencil-journey .pj-timeline { height:3px; background:#e0e3d3; overflow:hidden; }
.pencil-journey .pj-timeline-fill { display:block; height:100%; width:100%; transform:scaleX(0); transform-origin:left; background:#65825b; }
.pencil-journey[data-playing="true"] .pj-timeline-fill { animation:pj-time 6.5s linear both; }
.post .legacy-content .pencil-journey .pj-story { display:grid; grid-template-columns:1.6fr 1fr; gap:27px; margin:25px 0 22px; min-height:165px; }
.post .legacy-content .pencil-journey h3 { margin:0 0 10px; padding:0; color:var(--pj-ink); font-size:29px; line-height:1.12; font-weight:400; letter-spacing:-.02em; }
.post .legacy-content .pencil-journey .pj-story p { margin:0; color:#495741; font-size:14px; line-height:1.8; }
.pencil-journey .pj-note { border-left:1px solid #d4d9c6; padding:3px 0 0 21px; align-self:start; }
.pencil-journey .pj-note > span { display:block; font-size:10px; letter-spacing:.06em; font-weight:650; text-transform:uppercase; margin-bottom:9px; color:var(--pj-muted); }
.post .legacy-content .pencil-journey .pj-note p { font-size:12px; line-height:1.8; color:var(--pj-muted); }
.pencil-journey button { cursor:pointer; appearance:none; font-family:var(--font-main); font-weight:500; letter-spacing:0; text-transform:none; transition:background .18s,color .18s,border-color .18s; box-shadow:none; }
.pencil-journey button:disabled { opacity:.35; cursor:default; }
.pencil-journey button:focus-visible, .pencil-journey input:focus-visible, .pencil-journey summary:focus-visible { outline:2px solid #8b6c3b; outline-offset:4px; }
.pencil-journey .pj-playback { display:flex; align-items:center; justify-content:space-between; gap:12px; margin:0 0 22px; }
.pencil-journey .pj-play { display:inline-flex; align-items:center; gap:12px; min-height:44px; padding:10px 19px; border:1px solid var(--pj-ink); border-radius:3px; background:var(--pj-ink); color:#fffdf3; font-size:12px; }
.pencil-journey .pj-play:hover { background:#3b6048; }
.pencil-journey [data-pj-play-icon] { width:13px; font-size:12px; line-height:1; }
.pencil-journey .pj-arrows { display:flex; gap:8px; }
.pencil-journey .pj-arrows button { width:44px; height:44px; background:transparent; color:var(--pj-ink); border:1px solid #b7c1aa; border-radius:50%; font-size:20px; padding:0; }
.pencil-journey .pj-arrows button:hover:not(:disabled) { background:#e4e8d7; }
.post .legacy-content .pencil-journey .pj-steps { display:grid; grid-template-columns:repeat(9,minmax(0,1fr)); list-style:none; padding:0; margin:0; gap:3px; border-top:1px solid #d0d7c1; }
.post .legacy-content .pencil-journey .pj-steps li { list-style:none; margin:0; padding:0; }
.pencil-journey .pj-steps button { position:relative; display:flex; flex-direction:column; align-items:center; gap:6px; width:100%; min-height:74px; padding:14px 2px 11px; background:transparent; color:#67725d; border:0; border-radius:0 0 3px 3px; font-size:10px; line-height:1.4; }
.pencil-journey .pj-steps button::before { content:""; position:absolute; height:3px; top:-2px; left:0; right:0; background:transparent; }
.pencil-journey .pj-steps button span { font-size:11px; font-variant-numeric:tabular-nums; }
.pencil-journey .pj-steps button:hover { background:#e9ebdc; color:var(--pj-ink); }
.pencil-journey .pj-steps button[aria-current="step"] { background:#e2e7d5; color:#244d34; font-weight:650; }
.pencil-journey .pj-steps button[aria-current="step"]::before { background:#426e48; }
.pencil-journey .pj-scrub { display:flex; align-items:center; gap:20px; margin-top:16px; color:var(--pj-muted); font-size:10px; }
.pencil-journey .pj-scrub span { flex:0 0 auto; }
.pencil-journey .pj-scrub input { width:100%; min-width:0; height:24px; margin:0; padding:0; accent-color:#426e48; cursor:ew-resize; background:transparent; }
.post .legacy-content .pencil-journey .pj-footnote { margin:20px 0 0; font-size:10px; line-height:1.8; color:#70765f; }
.post .legacy-content .pencil-journey a { color:#4d6a45; text-decoration:underline; text-underline-offset:3px; border:0; }
.pencil-journey .pj-transcript { margin-top:12px; color:var(--pj-muted); font-size:11px; }
.pencil-journey .pj-transcript summary { cursor:pointer; width:fit-content; }
.post .legacy-content .pencil-journey .pj-transcript ol { margin:18px 0 0; padding-left:22px; }
.post .legacy-content .pencil-journey .pj-transcript li { margin:0 0 16px; padding:0 0 0 5px; }
.post .legacy-content .pencil-journey .pj-transcript p { font-size:12px; line-height:1.7; margin:5px 0 0; color:#58634e; }
.pencil-journey .pj-layer-control { margin:-5px 0 22px; }
.pencil-journey .pj-small-button { background:transparent; padding:8px 0; color:#3c6041; border:0; border-bottom:1px solid #819675; border-radius:0; font-size:12px; min-height:40px; }
.pencil-journey .pj-small-button:hover { color:#1d3b28; border-color:#1d3b28; }
.pencil-journey .pj-small-button span { margin-left:15px; }
.pencil-journey .pj-sandwich-top, .pencil-journey .pj-sandwich-leads { transition:transform .7s cubic-bezier(.22,.7,.25,1); }
.pencil-journey[data-assembled="true"] .pj-sandwich-top { transform:translateY(144px); }
.pencil-journey[data-assembled="true"] .pj-sandwich-leads { transform:translateY(51px); }
.pencil-journey .pj-growing-tree { transform-origin:475px 330px; }
.pencil-journey .pj-coating { transform-origin:424px 230px; }
.pencil-journey .pj-heat { stroke:#b1a078; stroke-width:2; fill:none; }
.pencil-journey[data-playing="true"] .pj-growing-tree { animation:pj-grow 5s ease-out both; }
.pencil-journey[data-playing="true"] .pj-flow { animation:pj-flow 1s linear infinite; }
.pencil-journey[data-playing="true"] .pj-spinning { animation:pj-spin 4s linear infinite; }
.pencil-journey[data-playing="true"] .pj-spin-reverse { animation-direction:reverse; }
.pencil-journey[data-playing="true"] .pj-slat-feed { animation:pj-feed 3s ease-in-out infinite alternate; }
.pencil-journey[data-playing="true"] .pj-shavings { animation:pj-shavings 1.4s ease-in-out infinite; }
.pencil-journey[data-playing="true"] .pj-mixer { animation:pj-spin 2s linear infinite; }
.pencil-journey[data-playing="true"] .pj-extruding { stroke-dasharray:200; animation:pj-extrude 4s ease-out both; }
.pencil-journey[data-playing="true"] .pj-heat { animation:pj-warm 2s ease-in-out infinite; }
.pencil-journey[data-playing="true"] .pj-sandwich-top { animation:pj-close 6.5s ease-in-out both; }
.pencil-journey[data-playing="true"] .pj-sandwich-leads { animation:pj-insert 6.5s ease-in-out both; }
.pencil-journey[data-playing="true"] .pj-shaped-pencils { animation:pj-feed 3s ease-in-out infinite alternate; }
.pencil-journey[data-playing="true"] .pj-coating { animation:pj-coat 5s ease-in-out both; }
.pencil-journey[data-playing="true"] .pj-coat-dot { animation:pj-dot .5s ease-out both; animation-delay:calc(var(--dot) * .5s); }
.pencil-journey[data-playing="true"] .pj-stamp { animation:pj-stamp 3s ease-in-out infinite; }
.pencil-journey[data-playing="true"] .pj-sharpener { animation:pj-spin 3s linear infinite; }
.pencil-journey[data-playing="true"] .pj-scanning { animation:pj-scan 3s ease-in-out infinite alternate; }
@keyframes pj-appear { from { opacity:0; } to { opacity:1; } }
@keyframes pj-time { from { transform:scaleX(0); } to { transform:scaleX(1); } }
@keyframes pj-grow { 0% {transform:scale(.18);opacity:.4;} 70%,100% {transform:scale(1);opacity:1;} }
@keyframes pj-flow { to { stroke-dashoffset:-22; } }
@keyframes pj-spin { to { transform:rotate(360deg); } }
@keyframes pj-feed { from { transform:translateX(-12px); } to { transform:translateX(12px); } }
@keyframes pj-shavings { from { transform:translate(0,-8px);opacity:0; } 25% {opacity:1;} to {transform:translate(10px,12px);opacity:0;} }
@keyframes pj-extrude { from { stroke-dashoffset:200; } to { stroke-dashoffset:0; } }
@keyframes pj-warm { 0%,100% {transform:translateY(3px);opacity:.4;} 50% {transform:translateY(-4px);opacity:1;} }
@keyframes pj-close { 0%,27% {transform:translateY(0);} 65%,100% {transform:translateY(144px);} }
@keyframes pj-insert { 0%,8% {transform:translateY(0);} 35%,100% {transform:translateY(51px);} }
@keyframes pj-coat { 0% {transform:scaleX(0);} 65%,100% {transform:scaleX(1);} }
@keyframes pj-dot { from {opacity:.15;} to {opacity:1;} }
@keyframes pj-stamp { 0%,15%,85%,100% {transform:translateY(0);} 35%,60% {transform:translateY(37px);} }
@keyframes pj-scan { from {transform:translateX(0);opacity:.25;} to {transform:translateX(139px);opacity:.8;} }
body.is-reading-invert .post .legacy-content .pencil-journey h2,
body.is-reading-invert .post .legacy-content .pencil-journey h3 { color:#254b38; }
body.is-reading-invert .post .legacy-content .pencil-journey p { color:#58634e; }
body.is-reading-invert .post .legacy-content .pencil-journey a { color:#4d6a45; }
@media (max-width:640px) {
    .post .legacy-content .pencil-journey { padding:24px 16px 20px; margin:42px -8px 38px; border-radius:7px; }
    .post .legacy-content .pencil-journey .pj-header { display:block; margin-bottom:20px; }
    .pencil-journey .pj-eyebrow { font-size:8px; letter-spacing:.09em; }
    .post .legacy-content .pencil-journey .pj-header p { margin:12px 0 0; text-align:left; font-size:12px; }
    .post .legacy-content .pencil-journey .pj-header br { display:none; }
    .pencil-journey .pj-plate-head { padding:13px 12px 2px; font-size:8px; }
    .pencil-journey .pj-illustration { min-height:170px; }
    .pencil-journey .pj-svg-label { display:none; }
    .pencil-journey .pj-stage-caption { padding:0 12px 12px; font-size:8px; }
    .pencil-journey .pj-material { font-size:12px; }
    .post .legacy-content .pencil-journey .pj-story { grid-template-columns:1fr; gap:16px; margin:23px 0; min-height:0; }
    .post .legacy-content .pencil-journey h3 { font-size:27px; }
    .post .legacy-content .pencil-journey .pj-story-main p { font-size:13px; line-height:1.8; }
    .pencil-journey .pj-note { border-left:2px solid #c4ceb7; padding:0 0 0 14px; }
    .post .legacy-content .pencil-journey .pj-note p { font-size:11px; }
    .pencil-journey .pj-note > span { font-size:9px; margin-bottom:5px; }
    .post .legacy-content .pencil-journey .pj-steps { grid-template-columns:repeat(3,minmax(0,1fr)); gap:4px; border:0; }
    .pencil-journey .pj-steps button { flex-direction:row; justify-content:flex-start; min-height:44px; padding:10px; font-size:10px; border:1px solid #d5dcc7; border-radius:3px; gap:8px; }
    .pencil-journey .pj-steps button::before { display:none; }
    .pencil-journey .pj-steps button span { font-size:9px; opacity:.65; }
    .pencil-journey .pj-play { font-size:11px; padding:10px 12px; gap:9px; }
    .pencil-journey .pj-arrows { gap:6px; }
    .pencil-journey .pj-playback { margin-bottom:17px; }
    .pencil-journey .pj-scrub { gap:12px; font-size:9px; }
    .post .legacy-content .pencil-journey .pj-footnote { font-size:9px; }
}
@media (prefers-reduced-motion:reduce) {
    .pencil-journey *, .pencil-journey *::before, .pencil-journey *::after { animation:none !important; transition:none !important; }
}
@media print {
    .post .legacy-content .pencil-journey { padding:18px; break-inside:avoid; border:1px solid #ccc; color:#222; }
    .pencil-journey .pj-controls, .pencil-journey .pj-layer-control, .pencil-journey .pj-timeline { display:none !important; }
    .pencil-journey * { animation:none !important; }
    .pencil-journey .pj-transcript { display:block; }
}
