/* Development notebooks share the studio's paper, ink and type. */
.devlog-page{max-width:1120px;margin:0 auto;padding:64px 32px 100px}
.devlog-page h1{font-size:clamp(2.4rem,5.5vw,4.6rem);line-height:1.08;max-width:900px;font-weight:500;margin:24px 0}
.devlog-page .lead{font-size:1.3rem;max-width:760px;line-height:1.6}
.devlog-meta,.devlog-page figcaption{font-size:.85rem;color:#655d53;line-height:1.6}
.devlog-page figure{margin:36px 0 48px}
.devlog-page figure img{display:block;width:100%;height:auto;border-radius:3px}
.devlog-page figcaption{margin-top:12px;max-width:800px}
.devlog-copy{max-width:720px;margin:auto;font-size:1.1rem;line-height:1.8}
.devlog-copy section{margin:40px 0}
.devlog-copy h2{font-size:1.65rem;font-weight:500;line-height:1.25;margin-bottom:14px}
.devlog-copy .lesson{padding:26px 30px;border-left:3px solid #8f342b;background:#e6d7c0}
.devlog-copy details{font-size:.9rem;margin:40px 0;color:#655d53;overflow-wrap:anywhere}
.devlog-copy summary{cursor:pointer;color:#342c25}
.devlog-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:42px 30px;margin-top:48px}
.devlog-cards article{min-width:0}
.devlog-cards img{display:block;width:100%;aspect-ratio:16/10;object-fit:cover;margin-bottom:18px}
.devlog-cards h2{font-weight:500;font-size:1.55rem;line-height:1.25;margin:12px 0}
.devlog-cards p{line-height:1.6}
.devlog-cards a{color:inherit;text-underline-offset:4px}
.devlog-back{display:inline-block;margin-top:35px;text-underline-offset:4px}
.studio-devlogs{display:flex;justify-content:space-between;gap:28px;align-items:end;margin:70px 0 0;padding-top:30px;border-top:1px solid #c7b49a}
.studio-devlogs h2{font-size:2rem;font-weight:500;margin:0 0 10px}
.studio-devlogs p{max-width:540px;line-height:1.6}
.project-journal-link{display:inline-block;margin-top:12px;color:inherit;font-size:.9rem;text-underline-offset:4px}
@media(max-width:600px){.devlog-page{padding:36px 20px 64px}.devlog-cards{grid-template-columns:1fr;gap:38px}.devlog-copy{font-size:1rem}.devlog-copy .lesson{padding:22px}.studio-devlogs{display:block}.devlog-page .lead{font-size:1.1rem}}
@media(max-width:760px){.studio .site-header nav{flex-wrap:wrap;justify-content:flex-end;gap:8px 12px}.studio .site-header nav a[href="/devlogs/"]{display:inline-block}}
.preview-trigger{display:flex;align-items:center;gap:10px;margin-top:18px;padding:10px 0;border:0;background:none;color:var(--accent);font:500 15px Jost,sans-serif;cursor:pointer;text-align:left}
.preview-trigger:hover{text-decoration:underline;text-underline-offset:5px}.preview-duration{font-size:12px;color:var(--muted);font-variant-numeric:tabular-nums}
.studio-feature-image,.bonsai-image{position:relative}
.preview-badge{position:absolute;left:18px;bottom:18px;border:1px solid #fff5;background:#211d18db;color:#fff6e8;border-radius:3px;padding:8px 12px;font:500 12px Jost,sans-serif;letter-spacing:.025em}
.project-preview{margin:0;background:#211d18;color:#f3e7d5}
.project-preview video,.devlog-video video{display:block;width:100%;height:auto;max-height:65vh;background:#111;object-fit:contain}
.studio .project-preview figcaption{padding:20px 28px;font-size:14px;line-height:1.65;color:#e3d3bc}
.project-preview figcaption strong{font-size:12px;letter-spacing:.025em;color:#f5e7d1;font-weight:500}
.project-preview figcaption p{margin:7px 0 10px}.project-preview figcaption a{color:inherit;text-underline-offset:4px}
.studio .project-preview figcaption p{color:#e3d3bc}
.studio .dialog-body{padding-top:26px}.studio .dialog-close{z-index:3;background:#efe2ce;color:#211d18;border:1px solid #211d1840}
.devlog-video{margin:48px 0}.devlog-video h2{font-size:1.8rem;font-weight:500}.devlog-video figcaption{margin-top:12px}
@media(max-width:600px){.studio .project-preview figcaption{padding:18px 20px}.preview-badge{left:12px;bottom:12px}.preview-trigger{min-height:44px}.project-preview video,.devlog-video video{max-height:58vh}}