/* Field Notes 002 production candidate. Paper / ink / brass identity (editorial-studio DESIGN-SYSTEM.md tokens). Local fonts only. */
:root{--paper:#f5f1e8;--ink:#20241f;--brass:#9a772e;--brass-d:#735719;--muted:#56604f;--rule:#c5bda9;--panel:#ebe4d6;--deep:#20241f;--serif:Georgia,"Times New Roman",serif;--sans:"Helvetica Neue",Helvetica,Arial,sans-serif}
*{box-sizing:border-box}
html{background:#d9d3c5}
body{margin:0;color:var(--ink);font:18px/1.6 var(--serif);-webkit-font-smoothing:antialiased}
a{color:inherit;text-underline-offset:3px}
a:focus-visible,button:focus-visible{outline:3px solid var(--brass);outline-offset:3px}
img{display:block;max-width:100%;height:auto}
.skip{position:absolute;left:-9999px;top:8px;background:var(--paper);padding:12px 16px;z-index:20;font:600 14px var(--sans)}
.skip:focus{left:8px}
.topbar{position:sticky;top:0;z-index:10;background:var(--ink);color:var(--paper);font:600 12px/1.4 var(--sans);letter-spacing:.06em}
.topbar .in{max-width:1040px;margin:auto;display:flex;flex-wrap:wrap;gap:6px 18px;align-items:center;padding:9px 20px}
.topbar .flag{color:#e7cf8f;text-transform:uppercase}
.topbar nav{display:flex;flex-wrap:wrap;gap:4px 14px;margin-left:auto}
.topbar nav a{text-decoration:none;font-weight:500;letter-spacing:.02em}
.topbar nav a:hover{text-decoration:underline}
main{max-width:1040px;margin:0 auto}
.page{position:relative;background:var(--paper);margin:0 auto 22px;box-shadow:0 1px 3px rgba(0,0,0,.18)}
.pad{padding:44px 64px 64px}
.pfoot{display:flex;justify-content:space-between;gap:12px;border-top:1px solid var(--brass);margin:0 64px;padding:8px 0 18px;font:600 11px/1.4 var(--sans);letter-spacing:.06em;color:var(--muted);text-transform:uppercase}
.kicker{font:700 12px/1.4 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--brass-d);margin:0 0 10px}
h1,h2,h3{font-family:var(--serif);font-weight:normal;letter-spacing:-.02em;margin:0}
h2.sec{font-size:40px;line-height:1.08;margin:0 0 20px;max-width:14em}
h2.sec .n{display:block;font:700 13px/1 var(--sans);letter-spacing:.16em;color:var(--brass-d);margin-bottom:12px}
p{margin:0 0 .8em}
.cols{column-count:2;column-gap:40px}
.cols .passage p:last-child{margin-bottom:.8em}
figure{margin:0}
figcaption{font:13px/1.45 var(--sans);color:var(--muted);margin-top:8px}
figcaption b{color:var(--ink);font-weight:700;letter-spacing:.04em}
.bleed img{width:100%}
.passage{position:relative}
[id]{scroll-margin-top:64px}
.hold{break-after:avoid;page-break-after:avoid}
.cols .passage{break-inside:avoid-column}
.passage.held{border-left:2px dotted var(--brass);padding-left:12px;margin-left:-14px}
.hold{display:block;width:max-content;max-width:100%;font:700 10px/1.6 var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--brass-d);text-decoration:none;margin-bottom:2px}
.hold:hover{text-decoration:underline}
.lede p{font-size:22px;line-height:1.45}
.pull{font:italic 30px/1.25 var(--serif);color:var(--ink);border-top:2px solid var(--brass);border-bottom:1px solid var(--rule);padding:14px 0;margin:6px 0 22px;break-inside:avoid}
.box{background:var(--panel);border-top:3px solid var(--brass);padding:18px 22px 10px;break-inside:avoid;margin:0 0 20px}
.box h3{font:700 12px/1.4 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--brass-d);margin:0 0 6px}
.box h4{font:normal 23px/1.2 var(--serif);margin:0 0 10px}
.box p{font-size:.94em}
.inset{break-inside:avoid;margin:4px 0 18px}
table{border-collapse:collapse;width:100%;font:14px/1.45 var(--sans)}
th{background:var(--ink);color:var(--paper);text-align:left;font-weight:600;letter-spacing:.03em}
td,th{padding:8px 10px;border-bottom:1px solid var(--rule);vertical-align:top}
td:first-child{font-weight:700}
/* cover */
.cover{aspect-ratio:8.5/11;overflow:hidden;color:var(--paper)}
.cover>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.cover .band{position:absolute;top:0;left:0;right:0;background:rgba(32,36,31,.92);color:#e7cf8f;font:700 12px/1.4 var(--sans);letter-spacing:.16em;text-transform:uppercase;padding:9px 6%;display:flex;justify-content:space-between;gap:12px}
.cover .mast{position:absolute;top:5.2%;left:0;right:0;padding:2.4% 6%;background:rgba(245,241,232,.93);color:var(--ink);display:flex;justify-content:space-between;align-items:flex-end;gap:12px}
.cover .wordmark{font:bold 92px/0.9 var(--serif);letter-spacing:-.055em}
.cover .wordmark span{color:var(--brass)}
.cover .issue{font:700 13px/1.5 var(--sans);letter-spacing:.12em;text-transform:uppercase;text-align:right}
.cover .issue b{display:block;font:normal 44px/1 var(--serif);letter-spacing:-.02em}
.cover .foot{position:absolute;left:0;right:0;bottom:0;background:linear-gradient(to bottom,rgba(32,36,31,0),rgba(32,36,31,.9) 22%,rgba(32,36,31,.96));padding:9% 6% 3.2%}
.cover h1{font-size:76px;line-height:.98;letter-spacing:-.04em;margin:0 0 14px}
.cover .line{font:italic 25px/1.3 var(--serif);color:#efe6d2;margin:0 0 18px;max-width:22em}
.cover .cap{font:12px/1.45 var(--sans);color:#cfc7b5;border-top:1px solid rgba(231,207,143,.5);padding-top:8px;display:flex;justify-content:space-between;gap:16px}
.cover .cap .c{max-width:72%;color:#ddd5c4;margin:0}
.cover .cap b{color:#e7cf8f}
/* opening */
.opening{aspect-ratio:8.5/11;overflow:hidden}
.opening>figure{position:absolute;inset:0 0 auto 0;height:94%;display:flex;flex-direction:column}
.opening>figure img{width:100%;flex:1 1 auto;min-height:0;object-fit:cover}
.opening .title{position:absolute;top:0;left:0;width:60%;background:rgba(245,241,232,.95);padding:5.5% 5% 4% 7.5%}
.opening .title h1{font-size:58px;line-height:1;letter-spacing:-.04em;margin:6px 0 12px}
.opening .title .sub{font:21px/1.35 var(--serif);color:var(--muted);margin:0}
.opening figcaption{flex:none;margin:0;background:var(--paper);padding:8px 64px 0}
.opening .pfoot{position:absolute;left:0;right:0;bottom:0;background:var(--paper)}
/* contents */
.contents{display:grid;grid-template-columns:1.25fr 1fr;gap:40px;align-items:start;margin-bottom:26px;border-bottom:1px solid var(--rule);padding-bottom:22px}
.toc{list-style:none;margin:0;padding:0;font:15px/1.4 var(--sans)}
.toc li{display:flex;justify-content:space-between;gap:10px;border-bottom:1px dotted var(--rule);padding:6px 0}
.toc a{text-decoration:none}
.toc a:hover{text-decoration:underline}
.toc .pg{color:var(--brass-d);font-weight:700}
.notice{font:13px/1.5 var(--sans);background:var(--panel);border-left:3px solid var(--brass);padding:10px 14px;margin-top:14px}
/* section openers */
.opener img{width:100%}
.opener figcaption{padding:0 64px}
.pair{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.pair img{width:100%}
.pair+figcaption{padding:0 64px}
.myco{display:grid;grid-template-columns:1.15fr 1fr;gap:26px;align-items:start}
.cols2{column-count:2;column-gap:28px}
.cols3{column-count:3;column-gap:24px}
.chron td:first-child{white-space:nowrap}
.srcgrid{margin-top:14px}
.chron2{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.chronnote{font:12px/1.4 var(--sans);color:var(--muted);margin-top:6px}
.chron td:nth-child(2){min-width:9em}
/* plates */
.plate{break-inside:avoid;margin:6px 0 20px}
.plate .ptitle{font:700 12px/1.4 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--brass-d);margin:0 0 8px}
.lineage{display:flex;align-items:stretch;gap:0;font:13px/1.35 var(--sans)}
.lineage .node{flex:1;border:1px solid var(--ink);background:#fbf8f1;padding:9px 10px}
.lineage .node b{display:block;font:normal 19px/1.15 var(--serif);margin:2px 0 4px}
.lineage .node small{display:block;font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--brass-d);font-weight:700}
.lineage .arr{display:flex;align-items:center;padding:0 5px;color:var(--brass);font-size:20px}
.tally{display:flex;gap:4px;flex-wrap:wrap;margin:6px 0 10px}
.tally i{width:22px;height:30px;border:1.5px solid var(--ink);display:block}
.tally .r{background:var(--ink)}.tally .w{background:var(--brass)}.tally .c{background:#8b9a7f}.tally .h{background:repeating-linear-gradient(45deg,#fff 0 3px,var(--ink) 3px 4.5px)}.tally .m{background:var(--rule)}.tally .a{background:#fff}
.legend{display:flex;flex-wrap:wrap;gap:4px 16px;font:12px/1.4 var(--sans);margin-bottom:10px}
.legend span{display:flex;align-items:center;gap:6px}
.legend i{width:11px;height:14px;border:1px solid var(--ink);display:inline-block}
/* close */
.close .passage p{font-size:23px;line-height:1.45}
/* sources */
.small p{font-size:15px;line-height:1.55}
.chron td,.chron th{font-size:12.5px;padding:5px 8px}
.credits-line{font:13px/1.5 var(--sans);color:var(--muted)}
.srcgrid{display:grid;grid-template-columns:1fr 1.15fr;gap:28px;align-items:start;margin-top:8px}
.nw{white-space:nowrap}
/* commerce */
.shop{background:var(--ink);color:var(--paper);padding:30px 34px 26px;margin-top:6px}
.shop h2{font-size:44px;line-height:1.05;margin:0 0 12px}
.shop .intro p{font-size:19px;line-height:1.5;color:#efe6d2}
.shop .passage.held{border-left-color:#e7cf8f}
.shop .hold{color:#e7cf8f}
.offers{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:20px 0 18px}
.offer{background:var(--paper);color:var(--ink);padding:18px 18px 16px;border-top:6px solid var(--brass);display:flex;flex-direction:column}
.offer .price{font:normal 46px/1 var(--serif);letter-spacing:-.03em;margin:4px 0 10px}
.offer h3{font:700 16px/1.3 var(--sans);margin:0 0 10px}
.offer p{font:14px/1.5 var(--sans);margin:0 0 8px}
.offer .files{margin-top:auto;font:700 11px/1.4 var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--brass-d);border-top:1px solid var(--rule);padding-top:8px}
.buy{display:flex;flex-wrap:wrap;gap:12px 20px;align-items:center;font:13px/1.5 var(--sans);color:#cfc7b5}
.buy button{font:700 14px var(--sans);letter-spacing:.06em;padding:12px 18px;background:#5a5a50;color:#d8d2c2;border:0;cursor:not-allowed}
.colophon{font:13px/1.55 var(--sans);color:var(--muted);margin-top:24px}
/* appendix */
.appx table td,.appx table th{font-size:12px;padding:5px 7px}
.appx td:first-child a{text-decoration:none}
.appx h3{font:700 12px/1.4 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--brass-d);margin:18px 0 6px}
.appx p{font:14px/1.5 var(--sans)}
.download{display:inline-block;background:var(--brass);color:#fff;font:700 13px var(--sans);letter-spacing:.06em;padding:10px 14px;text-decoration:none}
@media screen and (max-width:860px){
 .pad{padding:30px 26px 40px}.pfoot{margin:0 26px}
 .cols,.cols2,.cols3{column-count:1}
 h2.sec{font-size:32px}
 .contents{grid-template-columns:1fr;gap:18px}
 .opener figcaption,.pair+figcaption{padding:0 26px}
 .offers{grid-template-columns:1fr}
 .myco{grid-template-columns:1fr}
 .lineage{flex-direction:column}.lineage .arr{justify-content:center;transform:rotate(90deg);padding:2px}
 .colophon{columns:1}
 .chron2{grid-template-columns:1fr}
 .srcgrid{grid-template-columns:1fr}
}
@media screen and (max-width:700px){
 body{font-size:17px}
 [id]{scroll-margin-top:120px}
 .cover,.opening{aspect-ratio:auto;overflow:visible}
 .cover{display:flex;flex-direction:column}
 .cover .band{order:0}.cover .mast{order:1}.cover>img{order:2;position:static;height:auto}.cover .foot{order:3}
 .cover .band,.cover .mast,.cover .foot{position:static}
 .cover .foot{background:var(--ink);padding:20px 22px}
 .cover .wordmark{font-size:56px}.cover .issue b{font-size:30px}
 .cover h1{font-size:44px}.cover .line{font-size:20px}
 .cover .cap{flex-direction:column}.cover .cap .c{max-width:none}
 .opening>figure{position:static;height:auto}.opening>figure img{height:auto}
 .opening .title{position:static;width:auto;padding:24px 22px}
 .opening .title h1{font-size:40px}
 .opening figcaption{padding:8px 22px 0}
 .opening .pfoot{position:static}
 .lede p{font-size:19px}.pull{font-size:24px}
 .close .passage p{font-size:19px}
 .shop{padding:22px 18px}.shop h2{font-size:34px}
 .pair{grid-template-columns:1fr}
 table{font-size:13px}
 .appx table,.appx tbody,.appx tr,.appx td{display:block;width:100%}
 .appx thead{display:none}
 .appx tr{border-bottom:1px solid var(--rule);padding:6px 0}
 .appx td{border:0;padding:2px 0}
 .appx td[data-label]::before{content:attr(data-label) ": ";font-weight:700;color:var(--muted)}
 .chron table,.chron tbody,.chron tr,.chron td{display:block;width:100%}
 .chron thead{display:none}.chron tr{border-bottom:1px solid var(--rule);padding:4px 0}.chron td{border:0;padding:1px 0}
 .topbar nav{margin-left:0}
}
/* PRINT: one .page = one Letter sheet. Folios are printed inside each page and checked against physical PDF pages. */
@page{size:8.5in 11in;margin:0}
@media print{
 html,body{background:var(--paper)}
 body{font:10.2pt/1.47 var(--serif);-webkit-print-color-adjust:exact;print-color-adjust:exact}
 .topbar,.skip,.screen-only{display:none!important}
 main{max-width:none}
 .page{width:8.5in;height:11in;margin:0;box-shadow:none;overflow:hidden;break-after:page;page-break-after:always}
 .page:last-child{break-after:auto}
 .pad{padding:.48in .6in 0}
 .pfoot{position:absolute;left:.6in;right:.6in;bottom:.28in;margin:0;padding:4pt 0 0;font-size:6.8pt;background:transparent}
 .kicker{font-size:7.5pt;margin-bottom:5pt}
 h2.sec{font-size:25pt;margin-bottom:11pt}
 h2.sec .n{font-size:7.5pt;margin-bottom:6pt}
 .cols{column-gap:.28in}
 figcaption{font-size:7.6pt;margin-top:4pt}
 .hold{font-size:5.8pt}
 .passage.held{padding-left:6pt;margin-left:-7.5pt;border-left-width:1.2pt}
 .lede p{font-size:13.2pt;line-height:1.42}
 .pull{font-size:17pt;padding:7pt 0;margin:2pt 0 11pt}
 .box{padding:9pt 11pt 4pt;margin-bottom:10pt}
 .box h3{font-size:7pt}.box h4{font-size:13pt;margin-bottom:5pt}
 table{font-size:8pt}td,th{padding:4pt 6pt}
 .cover .band{font-size:7.2pt;padding:6pt .55in}
 .cover .mast{top:.33in;padding:.16in .55in .14in}
 .cover .wordmark{font-size:64pt}
 .cover .issue{font-size:7.5pt}.cover .issue b{font-size:28pt}
 .cover .foot{padding:.9in .55in .3in}
 .cover h1{font-size:50pt;margin-bottom:8pt}
 .cover .line{font-size:15pt;margin-bottom:10pt}
 .cover .cap{font-size:7.6pt}
 .opening>figure{height:10.4in}
 .opener.tall img{height:5.9in;object-fit:cover;object-position:62% 50%}
 .opening .title{padding:.5in .4in .32in .6in}
 .opening .title h1{font-size:38pt;margin:4pt 0 7pt}
 .opening .title .sub{font-size:12.5pt}
 .opening figcaption{padding:5pt .6in 0;height:.4in;font-size:7.6pt}
 .opening .pfoot{position:absolute;left:.6in;right:.6in;bottom:.28in;background:transparent}
 .contents{gap:.3in;margin-bottom:12pt;padding-bottom:10pt}
 .toc{font-size:8.6pt}.toc li{padding:2.6pt 0}
 .notice{font-size:7.4pt;padding:5pt 8pt;margin-top:7pt}
 .opener figcaption,.pair+figcaption{padding:0 .6in}
 .plate{margin:2pt 0 10pt}
 .plate .ptitle{font-size:7pt;margin-bottom:4pt}
 .lineage{font-size:7.2pt}.lineage .node{padding:5pt 6pt}.lineage .node b{font-size:11pt}.lineage .node small{font-size:5.6pt}.lineage .arr{font-size:12pt;padding:0 3pt}
 .tally i{width:.19in;height:.26in}
 .legend{font-size:7pt}
 .close .passage p{font-size:12.6pt;line-height:1.4}
 .cols2 p,.cols3 p{font-size:8.9pt}
 .plate.big table{font-size:10.5pt}.plate.big td,.plate.big th{padding:10pt 9pt}.plate.big th{font-size:8pt;letter-spacing:.08em;text-transform:uppercase}
 .bigpull{font-size:22pt;padding:14pt 0}
 .tally i{width:.16in;height:.22in}
 .small p{font-size:8.8pt;line-height:1.48}
 .chron td,.chron th{font-size:7pt;padding:2pt 4pt}
 .chronnote{font-size:6.8pt}
 .chron2{gap:.18in}
 .credits-line{font-size:7.4pt}
 .srcgrid{gap:.25in}
 .shop{padding:.3in .34in .24in}
 .shop h2{font-size:30pt;margin-bottom:7pt}
 .shop .intro p{font-size:11.5pt}
 .offers{gap:.15in;margin:.18in 0 .16in}
 .offer{padding:.14in .15in .12in;min-height:3.3in}
 .offer .price{font-size:30pt}
 .offer h3{font-size:10pt}.offer p{font-size:8.6pt}
 .offer .files{font-size:6.6pt}
 .buy{font-size:8pt}.buy button{font-size:8.5pt;padding:7pt 11pt}
 .colophon{font-size:7.6pt;margin-top:.2in}
 .appx table td,.appx table th{font-size:6.9pt;padding:2.2pt 4pt}
 .appx h3{font-size:7pt;margin:9pt 0 4pt}
 .appx p{font-size:8pt}
 a{text-decoration:none}
 /* page-fit overrides (measured with review/measure.py) */
 .offer{min-height:3.7in}
 .offer p{font-size:10pt;line-height:1.5}
 .offer h3{font-size:12pt}
 .offer .price{font-size:38pt}
 .colophon{font-size:8.4pt;margin-top:.3in}
 .shop{padding:.46in .42in .36in}
 .shop h2{font-size:36pt}
 .shop .intro p{font-size:12.5pt}
 .plate.big td,.plate.big th{padding:13pt 10pt}
 .plate.big table{font-size:11pt}
 .bigpull{font-size:24pt;padding:16pt 0;margin-top:20pt!important}
 #p7 .myco{grid-template-columns:1.35fr 1fr}
}

@media print { #p7 .myco { grid-template-columns: 1fr 1.35fr; } #p13 .pad { padding-top: .35in; } #p13 table td, #p13 table th { padding-top: 1.6pt; padding-bottom: 1.6pt; } }

/* Verified purchase links (commerce verification 2026-10-06) */
.offer .go{margin:14px 0 0}
.offer .go a{display:block;white-space:nowrap;text-align:center;background:var(--brass-d);color:#fff;text-decoration:none;font:700 15px/1.2 var(--sans);letter-spacing:.02em;padding:15px 14px;border-radius:6px;box-shadow:0 2px 0 rgba(0,0,0,.25);transition:transform .08s,background .15s}
.offer .go a:hover,.offer .go a:focus-visible{background:var(--ink,#1e261f);outline:2px solid var(--brass-d);outline-offset:2px;transform:translateY(-1px)}
.offer .price s{font-size:.42em;color:var(--brass-d);margin-left:.35em;letter-spacing:0;vertical-align:.5em}
.offer{position:relative}
.offer.featured{outline:3px solid var(--brass-d);outline-offset:-3px}
.offer .badge{position:absolute;top:-14px;left:18px;background:var(--brass-d);color:#fff;font:700 11px/1 var(--sans);letter-spacing:.12em;text-transform:uppercase;padding:6px 10px;border-radius:3px}
@media print{.offer .go a{background:var(--brass-d);color:#fff;padding:7px 10px;box-shadow:none;-webkit-print-color-adjust:exact;print-color-adjust:exact}.offer .badge{top:-.1in;-webkit-print-color-adjust:exact;print-color-adjust:exact}}