:root{
  --paper:#f3f1ea;
  --ink:#171715;
  --muted:#68645d;
  --rule:#c9c5bb;
  --accent:#8f251e;
  --serif:"Iowan Old Style",Baskerville,Georgia,serif;
  --display:"Times New Roman",Times,serif;
  --mono:Monaco,"SFMono-Regular",Consolas,"Liberation Mono",monospace;
}
*{box-sizing:border-box}
html{background:var(--paper);color:var(--ink)}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--serif);-webkit-font-smoothing:none;text-rendering:geometricPrecision;cursor:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29' viewBox='0 0 29 29'%3E%3Cpath d='M14.5 1v27M1 14.5h27' stroke='%23171715' stroke-width='1.2'/%3E%3Ccircle cx='14.5' cy='14.5' r='2.2' fill='%238f251e'/%3E%3C/svg%3E") 14 14, crosshair}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none;cursor:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='29' viewBox='0 0 29 29'%3E%3Cpath d='M14.5 1v27M1 14.5h27' stroke='%23171715' stroke-width='1.2'/%3E%3Ccircle cx='14.5' cy='14.5' r='2.2' fill='%238f251e'/%3E%3C/svg%3E") 14 14, crosshair}
::selection{background:var(--ink);color:var(--paper)}
.skip{position:absolute;left:-9999px;top:8px}
.skip:focus{left:8px;z-index:99;background:var(--paper);border:1px solid var(--ink);padding:8px 10px}
a:focus-visible{outline:1px dotted var(--ink);outline-offset:4px}
.shell{width:min(1440px,calc(100% - 56px));margin:0 auto;min-height:100svh;display:flex;flex-direction:column}
.site-head{display:grid;grid-template-columns:1fr auto;gap:24px;align-items:start;padding:22px 0 16px;border-bottom:1px solid var(--rule)}
.brand{font-family:var(--display);font-size:17px;line-height:1}
.brand small{font-family:var(--mono);display:block;margin-top:5px;font-size:11px;line-height:1.4;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.nav{display:flex;gap:20px;font-family:var(--mono);font-size:12px;line-height:1.4;letter-spacing:.055em;text-transform:uppercase}
.nav a{padding:0 0 3px}
.nav a:hover{color:var(--accent)}
.nav a[aria-current="page"]{color:var(--accent);border-bottom:1px solid currentColor}
.meta,.caption,.index-row,.footer,.eyebrow{font-family:var(--mono);font-size:12px;line-height:1.45;letter-spacing:.045em;text-transform:uppercase}
.meta,.caption,.eyebrow{color:var(--muted)}
.section{padding:84px 0 100px;flex:1}
.section-head{display:grid;grid-template-columns:1fr auto;gap:32px;align-items:end;margin-bottom:48px}
.section-title{font-family:var(--display);margin:0;font-size:clamp(36px,4.1vw,62px);line-height:.98;letter-spacing:-.035em;font-weight:400}
.section-note{max-width:340px;text-align:right;color:var(--muted);font-size:15px;line-height:1.35}
.section-note p{margin:0}
.work-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:58px 18px}
.work-grid figure{margin:0;min-width:0}
.work-grid figure:nth-child(1){grid-column:1/span 7}
.work-grid figure:nth-child(2){grid-column:9/span 4;margin-top:8vh}
.work-grid figure:nth-child(3){grid-column:3/span 6;margin-top:1vh}
.work-grid img{width:100%;height:auto}
.caption{display:flex;justify-content:space-between;gap:14px;margin-top:8px}
.caption strong{font-weight:400;color:var(--ink)}
.archive-list{border-top:1px solid var(--rule)}
.index-row{display:grid;grid-template-columns:54px 1.65fr 1fr .55fr;gap:18px;padding:13px 0 11px;border-bottom:1px solid var(--rule)}
.index-row:hover .title{text-decoration:underline;text-underline-offset:3px}
.index-row .muted{color:var(--muted)}
.info-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:64px}
.info-copy{max-width:680px;font-size:clamp(24px,2.7vw,40px);line-height:1.04;letter-spacing:-.025em}
.info-copy p{margin:0}
.info-copy p+p{margin-top:20px}
.info-small{display:grid;grid-template-columns:1fr 1fr;gap:32px;font-size:14px;line-height:1.45}
.info-small p{margin:0}
.info-links{display:grid;gap:8px}
.info-links a{padding:8px 0;border-bottom:1px solid var(--rule);font-family:var(--mono);font-size:11px;letter-spacing:.045em;text-transform:uppercase}
.info-links a:hover{border-color:var(--ink)}
.footer{border-top:1px solid var(--rule);padding:14px 0 22px;color:var(--muted);display:flex;justify-content:space-between;gap:20px}
.back{display:inline-block;margin-top:38px;font-family:var(--mono);font-size:11px;letter-spacing:.045em;text-transform:uppercase;border-bottom:1px solid var(--rule)}

/* COLE CALFEE — 1994 */
body.landing{
  width:100%;
  min-height:100svh;
  overflow:hidden;
  background:#b9b9b4;
  color:#111;
  font-family:var(--mono);
}
.landing-frame{
  width:100%;
  min-height:100svh;
  display:grid;
  place-items:center;
  padding:24px;
}
.seven{
  display:flex;
  align-items:center;
  justify-content:center;
  flex-wrap:wrap;
  gap:0;
  max-width:100%;
  font-size:13px;
  line-height:1;
  letter-spacing:.02em;
  text-transform:uppercase;
  white-space:normal;
  text-align:center;
}
.seven > *{
  display:inline-block;
}
.seven > * + *::before{
  content:" / ";
  white-space:pre;
  color:#111;
}
.seven .name{
  font-weight:700;
}
.seven a{
  text-decoration:none;
}
.seven a:hover,
.seven a:focus-visible{
  background:#111;
  color:#b9b9b4;
  outline:none;
}

@media(max-width:850px){
  .shell{width:calc(100% - 28px)}
  .site-head{grid-template-columns:1fr;padding-top:17px}
  .nav{gap:14px;flex-wrap:wrap}
  .section{padding:64px 0 80px}
  .section-head{grid-template-columns:1fr;gap:18px;margin-bottom:34px}
  .section-note{text-align:left}
  .work-grid{display:block}
  .work-grid figure,.work-grid figure:nth-child(n){width:100%;margin:0 0 72px}
  .work-grid figure:nth-child(2n){width:82%;margin-left:auto}
  .index-row{grid-template-columns:40px 1fr}
  .index-row .type,.index-row .year{display:none}
  .info-grid{grid-template-columns:1fr;gap:48px}
  .info-small{grid-template-columns:1fr}
}
@media(max-width:560px){
  .landing-frame{padding:28px 22px}
  .seven{
    width:min(260px,100%);
    font-size:13px;
    line-height:2.15;
  }
}

/* Visitor paper tones */
html[data-tone="tan"]{--paper:#d7c4a4;--ink:#3a2b21;--muted:#6d5848;--rule:#b49c7d;--accent:#7f2f25}
html[data-tone="brown"]{--paper:#725847;--ink:#f3eadf;--muted:#d2c1b0;--rule:#967765;--accent:#f0c6a8}
html[data-tone="white"]{--paper:#f7f7f3;--ink:#171715;--muted:#6e6e67;--rule:#d7d7d0;--accent:#8f251e}
html[data-tone="gray"]{--paper:#b9b9b4;--ink:#11110f;--muted:#595a55;--rule:#9e9f99;--accent:#8f251e}
html[data-tone="purple"]{--paper:#75687f;--ink:#f2ede8;--muted:#d4cbd7;--rule:#988ca0;--accent:#f0c4a0}
html[data-tone="sienna"]{--paper:#a65336;--ink:#f7efe7;--muted:#e0c6b8;--rule:#c07a5f;--accent:#f2cfb7}
html[data-tone="umber"]{--paper:#68493a;--ink:#f4ede7;--muted:#d7c6ba;--rule:#8b6a59;--accent:#efc6a9}
html[data-tone="mustard"]{--paper:#d9b23f;--ink:#2e2615;--muted:#695b2f;--rule:#b88f2f;--accent:#7f2f25}
html[data-tone="marigold"]{--paper:#e2a52f;--ink:#302313;--muted:#6f5528;--rule:#bf8326;--accent:#7f2f25}
html[data-tone="pulp-orange"]{--paper:#d97833;--ink:#2f1d16;--muted:#6d4534;--rule:#b35e29;--accent:#f4e2c8}
html[data-tone="peach"]{--paper:#e8b07b;--ink:#3c261b;--muted:#765240;--rule:#c58b5f;--accent:#8f251e}
html[data-tone="acid-yellow"]{--paper:#ded34f;--ink:#292714;--muted:#666126;--rule:#b8ad3f;--accent:#7f2f25}
html[data-tone] body.landing{background:var(--paper);color:var(--ink)}
.seven > * + *::before{color:inherit}
html[data-tone] .seven a:hover,html[data-tone] .seven a:focus-visible{background:var(--ink);color:var(--paper)}
.paper-control{margin-top:32px;font:11px/1.5 var(--mono);text-transform:uppercase;letter-spacing:.045em}
.paper-control button{appearance:none;cursor:inherit;border:0;padding:6px 0;background:transparent;color:inherit;font:inherit;cursor:pointer}
.paper-control button[aria-pressed="true"]{text-decoration:underline;text-underline-offset:4px}
.paper-control button:focus-visible{outline:1px dotted currentColor;outline-offset:4px}

.landing-paper{position:fixed;right:max(24px,env(safe-area-inset-right));bottom:max(20px,env(safe-area-inset-bottom));margin:0;font-size:10px;color:inherit}
.landing-paper button{min-height:32px;padding:8px 4px}

/* Quiet paper swatches */
.landing-paper{left:50%;right:auto;transform:translateX(-50%);display:flex;gap:10px;align-items:center}
.landing-paper button{position:relative;width:14px;height:14px;min-height:0;padding:0;border:1px solid rgba(32,33,30,.4);text-decoration:none}
.landing-paper button::before{content:"";position:absolute;inset:-8px}
.landing-paper button[data-paper-tone="tan"]{background:#d7c4a4}
.landing-paper button[data-paper-tone="brown"]{background:#725847}
.landing-paper button[data-paper-tone="white"]{background:#f7f7f3}
.landing-paper button[data-paper-tone="gray"]{background:#b9b9b4}
.landing-paper button[data-paper-tone="purple"]{background:#75687f}
.landing-paper button[data-paper-tone="sienna"]{background:#a65336}
.landing-paper button[data-paper-tone="umber"]{background:#68493a}
.landing-paper button[data-paper-tone="mustard"]{background:#d9b23f}
.landing-paper button[data-paper-tone="marigold"]{background:#e2a52f}
.landing-paper button[data-paper-tone="pulp-orange"]{background:#d97833}
.landing-paper button[data-paper-tone="peach"]{background:#e8b07b}
.landing-paper button[data-paper-tone="acid-yellow"]{background:#ded34f}
.landing-paper button[aria-pressed="true"]{outline:1px solid currentColor;outline-offset:3px}

/* Understated, slightly raised swatches */
.landing-paper{bottom:max(48px,env(safe-area-inset-bottom));gap:8px}
.landing-paper button{width:14px;height:14px;border:1px solid rgba(32,33,30,.25);outline:none}
.landing-paper button[aria-pressed="true"]{outline:none}
.landing-paper button:focus-visible{outline:1px dotted currentColor;outline-offset:3px}

/* Internal pages use the homepage's restrained system typography. */
body:not(.landing){font-family:var(--mono);font-size:13px;line-height:1.5}
body:not(.landing) .brand{font-family:var(--mono);font-size:13px;line-height:1.4;letter-spacing:.02em;text-transform:uppercase}
body:not(.landing) .section-title{font-family:var(--mono);font-size:13px;line-height:1.4;letter-spacing:.02em;font-weight:400;text-transform:uppercase}
body:not(.landing) .section-title em{font-style:normal}
body:not(.landing) .section-note,
body:not(.landing) .info-copy,
body:not(.landing) .info-small{font-family:var(--mono);font-size:13px;line-height:1.5;letter-spacing:normal}


/* 2026-10 — shared proportions with the Freeman editorial system.
   A related visual language, not a duplicate identity. */
:root{--site-gutter:30px;--site-type:14px}
body{-webkit-font-smoothing:antialiased}
.shell{width:calc(100% - 2 * var(--site-gutter));max-width:1600px}
.site-head{padding:24px 0 18px;align-items:baseline}
body:not(.landing) .brand,
body:not(.landing) .section-title,
.nav{font-size:var(--site-type);line-height:1.45;letter-spacing:-.025em}
.nav{gap:18px}
.section{padding:88px 0 110px}
.section-head{margin-bottom:52px}
.archive-list{margin-top:8px}
.index-row{padding:16px 0 14px}
.footer{padding:18px 0 24px}
/* The entry is a quiet instrument: one fixed center, no decorative chrome. */
.landing-frame{min-height:100dvh;padding:30px}
.seven{font-size:14px;line-height:1;letter-spacing:-.025em;white-space:nowrap;flex-wrap:nowrap}
.seven > * + *::before{content:"/";display:inline-block;white-space:normal;margin:0 13px;font-weight:400;opacity:.65}
.seven .name{font-weight:700}
.landing-paper{bottom:max(48px,env(safe-area-inset-bottom))}
@media(max-width:850px){
  :root{--site-gutter:18px}
  .site-head{padding-top:20px}
  .section{padding:60px 0 80px}
}
@media(max-width:720px){
  .landing-frame{padding:24px 18px}
  .seven{width:calc(100vw - 36px);max-width:100%;font-size:12px;line-height:1.8;flex-wrap:wrap;white-space:normal;row-gap:4px}
  .seven > * + *::before{margin:0 8px}
}
@media(max-width:390px){
  .seven{font-size:11px}
  .seven > * + *::before{margin:0 6px}
}


/* Exact Freeman entrance nav metrics (desktop + mobile). */
body.landing{font-family:Monaco,"Courier New",monospace}
.seven{align-items:baseline;justify-content:center;font-family:inherit;font-size:14px;line-height:1;letter-spacing:-.025em}
.seven > * + *::before{margin:0 13px;opacity:1}
@media(max-width:720px){
  .seven{font-size:12px;line-height:1;row-gap:10px}
}
@media(max-width:390px){
  .seven{font-size:12px}
  .seven > * + *::before{margin:0 8px}
}

/* Personal entrance / Freeman companion. 2026-10-12 */
:root{--paper:#f7f6f2;--ink:#282624;--muted:#77736d;--rule:#d8d5cf;--accent:#f04b25}
body.landing{background:var(--paper);color:var(--ink)}
.seven{font-weight:400;font-size:16px;letter-spacing:-.03em;gap:0}
.seven .name{font-weight:400;color:var(--accent)}
.seven > * + *::before{content:"/";color:#99958f;margin:0 18px;font-weight:400}
.seven > .name + *::before{content:"";margin:0 16px}
.seven a:hover,.seven a:focus-visible{background:transparent;color:var(--accent);text-decoration:underline;text-underline-offset:4px}
.entry-corner{position:fixed;bottom:26px;z-index:1;font:10px/1.35 var(--mono);letter-spacing:.01em;text-transform:uppercase;color:#77736d;pointer-events:none}
.entry-left{left:32px;text-align:left}
.entry-right{right:32px;text-align:right}
.landing-paper{bottom:27px;gap:9px}
.landing-paper button{width:18px;height:18px;border:1px solid #bdbab4}
.landing-paper button[data-paper-tone="white"]{background:#f7f6f2}
.landing-paper button[data-paper-tone="tan"]{background:#d7c4a4}
.landing-paper button[data-paper-tone="brown"]{background:#494039}
html[data-tone="white"]{--paper:#f7f6f2;--ink:#282624;--muted:#77736d;--rule:#d8d5cf;--accent:#f04b25}
html[data-tone="tan"]{--paper:#d7c4a4;--ink:#302a25;--muted:#6d5848;--rule:#b49c7d;--accent:#d74724}
html[data-tone="brown"]{--paper:#494039;--ink:#f7f6f2;--muted:#d2c1b0;--rule:#967765;--accent:#ff6b43}
html[data-tone] .seven a:hover,html[data-tone] .seven a:focus-visible{background:transparent;color:var(--accent)}
body:not(.landing) .section-title{font-size:14px;letter-spacing:-.025em}
body:not(.landing) .brand{font-size:14px}
body:not(.landing) .brand small{font-size:10px}
body:not(.landing) .site-head{border-color:var(--rule)}
body:not(.landing) .nav{font-size:14px}
body:not(.landing) .index-row{font-size:13px;letter-spacing:-.015em}
@media(max-width:720px){
 .seven{font-size:13px;line-height:1.8;row-gap:6px}
 .seven > * + *::before{margin:0 9px}
 .seven > .name + *::before{margin:0 9px}
 .entry-corner{font-size:9px;bottom:22px}
 .entry-left{left:18px}.entry-right{right:18px}
 .landing-paper{bottom:62px}
}

/* Cole Calfee / independent color identity — 2026-10-13.
   Three complementary print palettes, intentionally distinct from Freeman. */
:root,html[data-tone="field-notes"]{
  --paper:#e9d5af;--ink:#452d56;--muted:#69516b;--rule:#b8a18b;--accent:#a43f33;
}
html[data-tone="violet-hour"]{
  --paper:#c8b8dd;--ink:#412a4c;--muted:#664c71;--rule:#a18eae;--accent:#804b37;
}
html[data-tone="red-earth"]{
  --paper:#a94735;--ink:#f8e7c1;--muted:#f0d0af;--rule:#ce8670;--accent:#ffe29d;
}
body.landing{background:var(--paper);color:var(--ink)}
.seven .name{color:var(--accent)}
.seven > * + *::before{color:var(--muted)}
.entry-corner{color:var(--muted)}
.landing-paper button[data-paper-tone="field-notes"]{background:#e9d5af}
.landing-paper button[data-paper-tone="violet-hour"]{background:#c8b8dd}
.landing-paper button[data-paper-tone="red-earth"]{background:#a94735}
.landing-paper button{border-color:var(--muted)}
.landing-paper button[aria-pressed="true"]{outline:1px solid var(--ink);outline-offset:3px}
html[data-tone] .seven a:hover,html[data-tone] .seven a:focus-visible{color:var(--accent);background:transparent}

/* Accessibility and generous invisible targets, without changing the print-like squares. */
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible{
 outline:2px solid var(--accent);outline-offset:3px;
}
.landing-paper{gap:2px}
.landing-paper button{width:44px;height:44px;min-height:44px;border:0;background:transparent!important;position:relative;outline:0}
.landing-paper button::before{display:none}
.landing-paper button::after{content:"";position:absolute;width:18px;height:18px;top:13px;left:13px;border:1px solid var(--muted)}
.landing-paper button[data-paper-tone="field-notes"]::after{background:#e9d5af}
.landing-paper button[data-paper-tone="violet-hour"]::after{background:#c8b8dd}
.landing-paper button[data-paper-tone="red-earth"]::after{background:#a94735}
.landing-paper button[aria-pressed="true"]{outline:0}
.landing-paper button[aria-pressed="true"]::after{outline:1px solid var(--ink);outline-offset:3px}
.landing-paper button:focus-visible{outline:2px dashed var(--accent);outline-offset:-2px}