/* Monster Labs — shared styles. Fonts: SIL Open Font License (see /fonts/LICENSE-*.txt) */
@font-face{font-family:'IM Fell English';font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/im-fell-english-latin-400-normal.woff2') format('woff2')}
@font-face{font-family:'IM Fell English';font-style:italic;font-weight:400;font-display:swap;src:url('../fonts/im-fell-english-latin-400-italic.woff2') format('woff2')}
@font-face{font-family:'Crimson Pro';font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/crimson-pro-latin-400-normal.woff2') format('woff2')}
@font-face{font-family:'Crimson Pro';font-style:italic;font-weight:400;font-display:swap;src:url('../fonts/crimson-pro-latin-400-italic.woff2') format('woff2')}
@font-face{font-family:'Crimson Pro';font-style:normal;font-weight:600;font-display:swap;src:url('../fonts/crimson-pro-latin-600-normal.woff2') format('woff2')}
@font-face{font-family:'Courier Prime';font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/courier-prime-latin-400-normal.woff2') format('woff2')}
@font-face{font-family:'Courier Prime';font-style:normal;font-weight:700;font-display:swap;src:url('../fonts/courier-prime-latin-700-normal.woff2') format('woff2')}
body{margin:0;background:#E8DFC6}
a{color:#7E3418}a:hover{color:#5A2410}
html{-webkit-text-size-adjust:100%}
img{max-width:100%}

/* ---- Components for project pages (added 2026-11-01) ---- */
body{color:#23251E;font-family:'Crimson Pro',Georgia,serif;font-size:19px;line-height:1.55}
.site-header{border-bottom:2px solid #23251E}
.bar{max-width:1180px;margin:0 auto;padding:18px 32px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px}
.brand{text-decoration:none;color:#23251E;display:flex;align-items:center;gap:12px}
.brand span{font-family:'IM Fell English',serif;font-size:28px;letter-spacing:.02em}
.nav{display:flex;flex-wrap:wrap;gap:6px 26px;font-family:'Courier Prime',monospace;font-size:15px;text-transform:uppercase;letter-spacing:.08em}
.nav a{color:#23251E;text-decoration:none;padding:12px 0}
.nav a[aria-current="page"]{text-decoration:underline;text-underline-offset:6px;text-decoration-thickness:1.5px}
.wrap{max-width:1180px;margin:0 auto;padding:0 32px}
.narrow{max-width:760px}
.section{padding:72px 0}
.wrap.section{padding:72px 32px}
.kicker{margin:0 0 12px;font-family:'Courier Prime',monospace;font-size:15px;letter-spacing:.14em;text-transform:uppercase;color:#7E3418}
.display{margin:0;font-family:'IM Fell English',serif;font-weight:400;font-size:clamp(56px,9vw,92px);line-height:.95}
.h2{margin:0 0 12px;font-family:'IM Fell English',serif;font-weight:400;font-size:clamp(38px,5vw,54px);line-height:1.05}
.h3{margin:0;font-family:'IM Fell English',serif;font-weight:400;font-size:32px;line-height:1.1}
.lede{margin:24px 0 0;font-size:23px;font-style:italic;max-width:34ch}
.muted{color:#5B5646}
.hero{display:flex;flex-wrap:wrap;gap:48px;align-items:center;padding:72px 0 56px}
.hero>div{flex:1 1 420px;min-width:0}
.hero>figure{flex:1.3 1 460px;min-width:0}
.btns{display:flex;flex-wrap:wrap;gap:14px;margin-top:32px}
.btn{display:inline-flex;align-items:center;gap:10px;min-height:48px;padding:0 26px;background:#23251E;color:#E8DFC6;text-decoration:none;font-family:'Courier Prime',monospace;font-size:15px;letter-spacing:.1em;text-transform:uppercase}
.btn:hover{background:#3A3D33;color:#E8DFC6}
.btn.outline{background:transparent;border:2px solid #23251E;color:#23251E}
.btn.outline:hover{background:#23251E;color:#E8DFC6}
.dark{background:#23251E;color:#E8DFC6}
.dark .muted,.dark figcaption{color:#CFC6AE}
.dark a{color:#E8DFC6}
.dark .btn{background:#E8DFC6;color:#23251E}
.paper2{background:#F1EAD6;border-top:2px solid #23251E;border-bottom:2px solid #23251E}
figure{margin:0}
.plate .frame{display:block;border:2px solid #23251E;padding:8px;background:#F1EAD6}
.dark .plate .frame{border-color:#8F8A74;background:#2F322A}
.plate img,.plate video{display:block;width:100%;height:auto}
.engraving img{filter:grayscale(1) contrast(1.15);mix-blend-mode:multiply}
figcaption{margin-top:8px;font-family:'Courier Prime',monospace;font-size:14px;line-height:1.45;color:#5B5646}
.prose .tools{margin-top:20px;padding-top:14px;border-top:1px solid #8F8A74;font-size:17px;color:#4A4638}
.prose .tools ul{margin:0;padding-left:20px}
.prose .tools li{margin:4px 0}
.prose .help{margin-top:20px;padding-top:14px;border-top:1px solid #8F8A74;font-size:17px;color:#4A4638}
.help-label{display:block;margin-bottom:4px;font-family:'Courier Prime',monospace;font-size:13px;letter-spacing:.12em;text-transform:uppercase;color:#7E3418}
.thanks{list-style:none;margin:28px auto 0;padding:0;max-width:760px;text-align:left;border-top:2px solid #23251E}
.thanks li{padding:14px 0;border-bottom:1.5px solid #8F8A74}
.thanks b{font-family:'IM Fell English',serif;font-weight:400;font-size:24px;margin-right:10px}
.credit{display:block;margin-top:2px;font-size:12px;letter-spacing:.02em}
.credit a{color:inherit}
.dark .credit a{color:#E8DFC6}
.masonry{columns:3 300px;column-gap:24px}
.masonry figure{break-inside:avoid;margin:0 0 24px}
.steps{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,280px),1fr));gap:28px 24px;align-items:start}
.steps .frame img,.steps .frame video{aspect-ratio:1/1;object-fit:contain;background:#E8DFC6}
.lead{margin-bottom:24px}
.area{padding:56px 0;border-top:1.5px solid #8F8A74}
.area:first-of-type{border-top:2px solid #23251E}
.area-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:8px 32px;margin-bottom:28px}
.area-head p{margin:0;max-width:56ch}
.num{font-family:'Courier Prime',monospace;font-size:16px;color:#5B5646;margin-right:12px}
.prose p{margin:0 0 16px;max-width:68ch}
.two{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,360px),1fr));gap:32px}
.toc{display:flex;flex-wrap:wrap;gap:4px 24px;margin:28px 0 0;padding:16px 0 0;border-top:1.5px solid #8F8A74;list-style:none;font-family:'Courier Prime',monospace;font-size:15px}
.toc a{display:inline-block;padding:10px 0}
.checklist{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));gap:0 40px;border-top:2px solid #23251E}
.checklist li{display:flex;gap:16px;justify-content:space-between;align-items:baseline;padding:14px 0;border-bottom:1.5px solid #8F8A74}
.checklist b{display:block;font-family:'IM Fell English',serif;font-weight:400;font-size:24px;line-height:1.15}
.checklist small{display:block;font-size:16px;color:#5B5646}
.checklist .count{font-family:'Courier Prime',monospace;font-size:15px;white-space:nowrap;color:#7E3418}
.story p{margin:0 0 14px;color:#CFC6AE;max-width:62ch}
.story .turn{margin:24px 0;padding:14px 0;border-top:1px solid #8F8A74;border-bottom:1px solid #8F8A74;font-family:'IM Fell English',serif;font-size:30px;color:#E8DFC6}
.story em{color:#E8DFC6}
.links-list{border-top:2px solid #23251E}
.links-list a{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px 32px;padding:24px 0;border-bottom:1.5px solid #23251E;color:#23251E;text-decoration:none}
.links-list .y{flex:0 0 110px;font-family:'Courier Prime',monospace;font-size:15px;color:#7E3418}
.links-list .t{flex:1 1 320px;min-width:0;font-family:'IM Fell English',serif;font-size:32px;line-height:1.1}
.links-list .d{flex:1 1 260px;min-width:0;font-size:17px;color:#4A4638}
.links-list a:hover .t{text-decoration:underline}
.site-footer{background:#23251E;color:#CFC6AE;font-family:'Courier Prime',monospace;font-size:15px}
.site-footer .bar{padding:32px}
.site-footer a{color:#E8DFC6}
.legal{display:flex;flex-wrap:wrap;gap:4px 24px}
.legal a{padding:10px 0}
/* External links: open in a new tab, marked with an arrow */
a.ext::after{content:"";display:inline-block;width:.62em;height:.62em;margin-left:.18em;vertical-align:.02em;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' fill='none' stroke='black' stroke-width='1.6'%3E%3Cpath d='M4.5 1.5h6v6M10.5 1.5 3 9M8 10.5H1.5V4'/%3E%3C/svg%3E") no-repeat center/contain;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' fill='none' stroke='black' stroke-width='1.6'%3E%3Cpath d='M4.5 1.5h6v6M10.5 1.5 3 9M8 10.5H1.5V4'/%3E%3C/svg%3E") no-repeat center/contain}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media (max-width:600px){.wrap,.bar{padding-left:20px;padding-right:20px}.section{padding:56px 0}.wrap.section{padding:56px 20px}}
