* { box-sizing: border-box; }
html { background: var(--sea-blue); }
body.public-page { min-width: 0; margin: 0; background: var(--archive-paper); color: var(--archive-ink); font: 1rem/1.75 var(--font-body); }
a { color: var(--cyanotype-layer); text-decoration-thickness: 1px; text-underline-offset: .2em; }
a:hover { color: var(--sea-blue); }
.site-shell { display: flex; min-height: 100vh; flex-direction: column; }
.site-header { background: var(--sea-blue); color: var(--archive-paper); border-bottom: 1px solid rgb(143 201 208 / 40%); }
.site-nav, .site-main, .site-footer { width: min(100% - 2rem, 1120px); margin-inline: auto; }
.site-nav { display: grid; grid-template-columns: 1fr auto auto; gap: var(--space-5); align-items: center; min-height: 5.5rem; }
.brand { display: grid; width: fit-content; color: var(--archive-paper); text-decoration: none; }
.brand:hover { color: var(--archive-paper); text-decoration: none; }
.brand-name { font: 700 1.35rem/1.1 var(--font-display); letter-spacing: .04em; }
.brand-mark, .utility-label, .eyebrow { font: 600 .72rem/1.45 var(--font-utility); letter-spacing: .12em; }
.brand-mark { margin-top: .25rem; color: var(--measurement-cyan); }
.measurement-reticle { width: 2.4rem; aspect-ratio: 1; background: var(--reticle); }
.nav-links { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-3); font: 600 .86rem var(--font-ui); }
.nav-links a { color: var(--archive-paper); }
.nav-links a:hover { color: var(--developer-gold); }
.site-main { flex: 1; padding: var(--space-7) 0 var(--space-8); }
.cyanotype-hero, .article-blueprint-cover, .about-blueprint, .error-blueprint { position: relative; overflow: hidden; background-color: var(--sea-blue); background-image: var(--blueprint-grid); background-size: 2rem 2rem; color: var(--archive-paper); }
.cyanotype-hero { padding: clamp(2rem, 7vw, 5rem); border: 1px solid var(--cyanotype-layer); box-shadow: var(--paper-shadow); }
.cyanotype-hero::after, .article-blueprint-cover::after, .about-blueprint::after { position: absolute; inset: auto var(--space-5) var(--space-5) auto; width: 4rem; aspect-ratio: 1; content: ""; background: var(--reticle); opacity: .9; }
.eyebrow { margin: 0 0 var(--space-2); color: var(--cyanotype-layer); }
.cyanotype-hero .eyebrow, .article-blueprint-cover .eyebrow, .about-blueprint .eyebrow, .error-blueprint .eyebrow { color: var(--measurement-cyan); }
h1, h2, h3, h4, h5, h6 { margin: 0; color: var(--sea-blue); font-family: var(--font-display); line-height: 1.2; overflow-wrap: anywhere; }
.cyanotype-hero h1 { color: var(--archive-paper); font-size: clamp(2.6rem, 8vw, 5.5rem); letter-spacing: -.04em; }
.cyanotype-hero > p:last-child { max-width: 40rem; margin: var(--space-3) 0 0; color: var(--measurement-cyan); font-size: 1.1rem; }
.latest-field-note { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(15rem, .7fr); gap: var(--space-6); margin-top: var(--space-6); padding: clamp(1.5rem, 5vw, 3rem); border: 1px solid var(--line-strong); background: #fffdf7; box-shadow: var(--paper-shadow); }
.latest-note-copy { align-self: center; }
.latest-field-note h2 { font-size: clamp(2rem, 5vw, 3.8rem); letter-spacing: -.035em; }
.latest-cover { width: 100%; height: 100%; min-height: 16rem; object-fit: cover; }
.latest-blueprint-plate { min-height: 16rem; background-color: var(--sea-blue); background-image: var(--blueprint-grid); background-size: 1.5rem 1.5rem; }
.post-meta { margin: 0 0 var(--space-2); color: color-mix(in srgb, var(--archive-ink) 65%, transparent); font: .78rem/1.5 var(--font-utility); }
.post-taxonomy { display: flex; flex-wrap: wrap; gap: var(--space-2); margin: 0 0 var(--space-2); font: 600 .8rem var(--font-ui); }
.post-taxonomy a { color: var(--cyanotype-layer); }
.post-summary { margin: var(--space-3) 0 0; color: color-mix(in srgb, var(--archive-ink) 78%, transparent); }
.lead { font-size: 1.13rem; }
.read-more { display: inline-flex; gap: var(--space-2); margin-top: var(--space-4); color: var(--sea-blue); font: 700 .9rem var(--font-ui); }
.recent-note-index, .engineering-index { margin-top: var(--space-7); }
.section-heading { display: flex; justify-content: space-between; gap: var(--space-4); align-items: end; margin-bottom: var(--space-4); border-bottom: 2px solid var(--sea-blue); padding-bottom: var(--space-3); }
.section-heading .eyebrow { margin: 0; }
.section-heading h2 { font-size: clamp(1.6rem, 3vw, 2.2rem); }
.post-list, .archive-list { display: grid; gap: var(--space-4); }
.archive-index-card { display: grid; grid-template-columns: auto minmax(0, 1fr) minmax(9rem, .35fr); gap: var(--space-4); align-items: start; padding: var(--space-5); border: 1px solid var(--line); background: #fffdf7; transition: transform var(--motion-fast), box-shadow var(--motion-fast); }
.archive-index-card:hover { transform: translateY(-2px); box-shadow: var(--paper-shadow); }
.post-card-index { width: .75rem; min-height: 100%; background: var(--cyanotype-layer); }
.archive-index-card h2 { font-size: clamp(1.3rem, 3vw, 1.8rem); }
.post-card-cover { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.unexposed-plate, .empty-card { padding: clamp(1.5rem, 5vw, 3rem); border: 1px dashed var(--line-strong); background: color-mix(in srgb, var(--archive-paper) 80%, white); }
.unexposed-plate h2, .empty-card h2 { font-size: 1.7rem; }
.pagination { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-3); margin-top: var(--space-6); padding-top: var(--space-4); border-top: 1px solid var(--line-strong); color: color-mix(in srgb, var(--archive-ink) 75%, transparent); font: .9rem var(--font-ui); }
.pagination .utility-label { color: var(--cyanotype-layer); }
.pagination-links { display: flex; gap: var(--space-4); }
.disabled { color: color-mix(in srgb, var(--archive-ink) 40%, transparent); }
.compact-hero { padding: clamp(1.5rem, 4vw, 3rem); }
.compact-hero h1 { font-size: clamp(2.2rem, 6vw, 4rem); }
.compact-hero p:last-child { margin-bottom: 0; }
.search-form { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: var(--space-2); align-items: center; margin-top: var(--space-5); color: var(--archive-paper); font-family: var(--font-ui); }
.search-form input, .search-form button { min-height: 2.75rem; border: 1px solid var(--measurement-cyan); border-radius: 0; font: inherit; }
.search-form input { padding: 0 var(--space-3); background: var(--archive-paper); color: var(--archive-ink); }
.search-form button { padding: 0 var(--space-4); background: var(--developer-gold); color: var(--sea-blue); cursor: pointer; font-weight: 700; }
.archive-month { padding: var(--space-5); border-left: 5px solid var(--cyanotype-layer); background: #fffdf7; }
.archive-month h2 { font-size: 1.7rem; }
.archive-month ol { display: grid; gap: var(--space-3); margin: var(--space-4) 0 0; padding-left: 1.25rem; }
.archive-month li { padding-left: var(--space-2); }
.taxonomy-card { padding: var(--space-5); border: 1px solid var(--line); background: #fffdf7; }
.taxonomy-card h2 { font-size: 1.7rem; }
.field-note-detail { margin-inline: calc((min(100vw - 2rem, 1120px) - 100vw) / 2); }
.article-blueprint-cover { padding: clamp(2rem, 7vw, 6rem) max(1rem, calc((100vw - min(100% - 2rem, 1120px)) / 2)); }
.article-blueprint-cover .cover-inner { width: min(100%, 760px); margin-inline: auto; }
.article-blueprint-cover h1 { color: var(--archive-paper); font-size: clamp(2.5rem, 7vw, 5rem); letter-spacing: -.045em; }
.article-blueprint-cover .post-meta, .article-blueprint-cover .post-taxonomy a { color: var(--measurement-cyan); }
.article-blueprint-cover .post-summary { color: var(--archive-paper); }
.post-cover { display: block; max-width: 100%; margin-top: var(--space-5); border: 1px solid var(--measurement-cyan); }
.archive-paper-body { width: min(100%, 1280px); margin: 0 auto; padding: clamp(2rem, 7vw, 5rem); background: var(--archive-paper); }
.article-reading-column { width: min(100%, 720px); margin-inline: auto; }
.toc { width: min(100%, 720px); margin: 0 auto var(--space-5); padding: var(--space-4); border-left: 2px solid var(--cyanotype-layer); font: .87rem/1.55 var(--font-ui); }
@media (min-width: 1160px) { .archive-paper-body { display: grid; grid-template-columns: 12rem minmax(0, 720px); justify-content: center; align-items: start; column-gap: clamp(2rem, 5vw, 6rem); }.article-reading-column { grid-column: 2; width: 720px; margin: 0; }.toc { grid-column: 1; grid-row: 1; position: sticky; top: var(--space-4); width: auto; margin: 0; } }
.toc h2 { margin-bottom: var(--space-2); font: 700 .8rem var(--font-utility); letter-spacing: .08em; }
.toc ol { display: grid; gap: var(--space-2); margin: 0; padding-left: 1rem; }.toc-level-3 { margin-left: .75rem; }
.markdown-body { min-width: 0; font-size: 1.06rem; overflow-wrap: anywhere; }.markdown-body > *:first-child { margin-top: 0; }.markdown-body h1, .markdown-body h2, .markdown-body h3, .markdown-body h4, .markdown-body h5, .markdown-body h6 { margin-top: 2.1em; margin-bottom: .65em; }.markdown-body p, .markdown-body ul, .markdown-body ol, .markdown-body blockquote, .markdown-body pre, .markdown-body table { margin: 0 0 1.25rem; }.markdown-body img { max-width: 100%; height: auto; }.markdown-body blockquote { margin-left: 0; padding-left: var(--space-4); border-left: 4px solid var(--developer-gold); color: color-mix(in srgb, var(--archive-ink) 75%, transparent); }.markdown-body table { display: block; max-width: 100%; overflow-x: auto; border-collapse: collapse; }.markdown-body th, .markdown-body td { border: 1px solid var(--line-strong); padding: .5rem .75rem; text-align: left; }.markdown-body a { text-decoration: underline; }
.post-navigation { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-4); margin-top: var(--space-7); padding-top: var(--space-5); border-top: 1px solid var(--line-strong); font-family: var(--font-ui); }.post-navigation > div:last-child { text-align: right; }.post-navigation a { display: block; font-weight: 700; }
.about-page { max-width: 100%; }.about-blueprint { padding: clamp(2rem, 7vw, 5rem); }.about-blueprint > div, .about-page .archive-paper-body { width: min(100%, 720px); margin-inline: auto; }.about-blueprint h1 { color: var(--archive-paper); font-size: clamp(2.4rem, 6vw, 4.5rem); }.about-blueprint p { color: var(--measurement-cyan); }
.site-footer { display: flex; justify-content: space-between; gap: var(--space-4); padding: var(--space-5) 0; border-top: 1px solid rgb(143 201 208 / 35%); color: var(--measurement-cyan); font: .86rem var(--font-ui); }.site-footer strong { color: var(--archive-paper); }.site-footer p { margin: var(--space-1) 0 0; }.site-footer a { color: var(--developer-gold); }
.error-page { min-height: 100vh; background: var(--sea-blue); color: var(--archive-paper); }.error-blueprint { display: grid; place-content: center; min-height: 100vh; padding: var(--space-6); text-align: center; }.error-reticle { width: 6rem; aspect-ratio: 1; margin: 0 auto var(--space-5); background: var(--reticle); }.error-code { margin: 0; color: var(--developer-gold); font: 700 1rem var(--font-utility); }.error-blueprint h1 { color: var(--archive-paper); font-size: clamp(2.5rem, 8vw, 5rem); }.error-blueprint a { color: var(--developer-gold); font-family: var(--font-ui); }
@keyframes cyanotype-reveal { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }.cyanotype-hero, .latest-field-note { animation: cyanotype-reveal var(--motion-slow) ease-out both; }
@media (max-width: 760px) { .site-nav { grid-template-columns: 1fr auto; padding: var(--space-4) 0; }.navigation-reticle { justify-self: end; }.nav-links { grid-column: 1 / -1; padding-top: var(--space-3); border-top: 1px solid rgb(143 201 208 / 35%); }.latest-field-note, .archive-paper-body { grid-template-columns: 1fr; }.latest-cover { max-height: 20rem; }.toc { position: static; order: -1; }.post-navigation { grid-template-columns: 1fr; }.post-navigation > div:last-child { text-align: left; }.field-note-detail { margin-inline: -1rem; }.article-blueprint-cover { padding-inline: var(--space-5); }.archive-index-card { grid-template-columns: .5rem minmax(0, 1fr); }.post-card-cover { grid-column: 2; max-width: 18rem; }.site-footer { flex-direction: column; }.search-form { grid-template-columns: 1fr; }.search-form label { font-weight: 700; } }