:root{--paper:#fff;--ink:#111;--olive:#444;--muted:#555;--line:#999;color:var(--ink);background:var(--paper);font-family:Arial,Helvetica,sans-serif}
body{background:linear-gradient(90deg,#fff1,transparent 45%,#00000008),var(--paper)}
.variant-nav{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:12px 40px;background:var(--ink);color:var(--paper);font:11px 'Courier New',monospace;letter-spacing:.045em}.variant-nav div{display:flex;gap:20px}.variant-nav a{color:inherit;text-underline-offset:4px}
.notes-nav{border-color:var(--ink);background:transparent;color:var(--ink)}
header{margin:0 40px;height:70px;border-bottom:3px solid var(--ink)}.brand{letter-spacing:.07em;font-weight:800}.header-note{font:10px 'Courier New',monospace;letter-spacing:.08em}.brand-mark{font-size:28px}
main{max-width:1600px;padding:0 40px 30px}.intro{padding:36px 0 26px;align-items:flex-end;gap:32px}.intro h1{font-family:Impact,'Arial Narrow',Arial,sans-serif;font-size:clamp(60px,7.8vw,120px);font-weight:900;line-height:.87;letter-spacing:-.045em;margin:16px 0 24px}.intro p:last-child{max-width:680px;font-size:15px;line-height:1.6;color:var(--ink)}.intro p:last-child a{display:block;margin-top:8px;font:12px 'Courier New',monospace}.eyebrow{font:11px 'Courier New',monospace;letter-spacing:.12em;color:var(--ink)}
.view-switch{padding:0;border:1px solid var(--ink);border-radius:0;flex-direction:column;min-width:195px;align-self:flex-end}.view-switch button{border-radius:0;padding:15px 20px;text-align:left;font:11px 'Courier New',monospace;text-transform:uppercase}.view-switch button+button{border-top:1px solid var(--ink)}.view-switch button[aria-pressed=true]{background:var(--ink);color:var(--paper)}
.label-sequence{display:grid;grid-template-columns:repeat(3,1fr);border-top:8px solid var(--ink);border-bottom:2px solid var(--ink);font:12px 'Courier New',monospace;letter-spacing:.025em}.label-sequence span{padding:17px 18px}.label-sequence span+span{border-left:1px solid var(--ink)}.label-sequence b{display:inline-block;margin-right:12px;font-weight:400;border:1px solid var(--ink);padding:3px 5px}.project-context{max-width:850px;font-size:14px;line-height:1.6;margin:22px 0;color:var(--muted)}
.surface-label{border-top:1px solid var(--ink);font:11px 'Courier New',monospace;padding:16px 0;color:var(--ink)}
.grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}.card,.tile{border:1px solid var(--ink);padding:9px;background:#fff;position:relative}.picture{aspect-ratio:1.6;border:1px solid var(--ink)}.picture canvas{object-fit:contain;background:#eee;transition:transform .4s}.card-number{color:var(--ink);mix-blend-mode:normal;background:var(--paper);padding:4px 6px;border:1px solid var(--ink);left:8px;top:8px}.enter{opacity:1;background:var(--ink);color:var(--paper);border-radius:0;font-size:18px}
.person-caption{padding:13px 5px 7px;margin:0;align-items:center;gap:14px}.person-caption>span{display:flex;flex-direction:column;flex:1}.person-caption .card-subtitle{order:-1;font-family:Impact,'Arial Narrow',Arial,sans-serif;font-size:24px;font-weight:700;line-height:1.05;color:var(--ink);margin:0 0 8px;letter-spacing:-.025em}.person-caption .card-caption{font:12px 'Courier New',monospace;display:block;padding-top:8px;border-top:1px solid var(--line)}
.portrait{width:58px;height:70px;object-fit:cover;border:1px solid var(--ink);filter:grayscale(1) contrast(1.08);mix-blend-mode:multiply}.portrait-large{width:142px;height:170px}.portrait-figure{gap:18px}.portrait-figure figcaption{font:11px/1.5 'Courier New',monospace}
.quiet,.unmix-open,.unmix-actions>button,.dialog-head button,.nav button,.sheet-tools button{border-radius:0;border:1px solid var(--ink);font:12px 'Courier New',monospace}.quiet:hover{background:#e5e5e5}.unmix-open,.unmix-actions>button:first-child{background:var(--ink);color:var(--paper)}
dialog{background:var(--paper);color:var(--ink);border:3px solid var(--ink);padding:22px;box-shadow:8px 8px 0 #00000044}dialog::backdrop{background:#000000bb;backdrop-filter:blur(3px)}.dialog-bar,.dialog-head{padding-bottom:14px;border-bottom:6px solid var(--ink)}.detail-layout{gap:28px}.detail-layout h2,.detail-grid h2{font-family:Impact,'Arial Narrow',Arial,sans-serif;font-size:42px;font-weight:800;letter-spacing:-.03em;line-height:1}.art-side canvas,.detail-grid canvas{border:1px solid var(--ink)}.unmix-steps{border-top:1px solid var(--ink);border-bottom:3px solid var(--ink);margin:22px 0;gap:0}.unmix-steps button{flex:1;border:0;font:11px 'Courier New',monospace;padding:14px 8px}.unmix-steps button+button{border-left:1px solid var(--ink)}.unmix-steps button[aria-pressed=true]{background:var(--ink);color:var(--paper)}.unmix-kicker{font-size:22px;font-weight:700}.unmix-content p{line-height:1.65}.facts{border-top:5px solid var(--ink)}.facts>div{padding-bottom:16px;border-bottom:1px solid var(--line)}.source-links a,.trail-link{text-underline-offset:4px}.dialog-bottom{border-top:3px solid var(--ink)}
.world-scroll{background-color:#eee;border-color:var(--ink)}.node{background:var(--paper);border-color:var(--ink);border-radius:0;box-shadow:3px 3px 0 #00000022}.node-person .portrait{height:38px;width:32px}.evidence{background:#fff;border-color:var(--ink)}.evidence .type{border-bottom:3px solid var(--ink);padding-bottom:10px}.evidence h3{color:var(--ink)}
footer{border-top:6px solid var(--ink);font:11px/1.6 'Courier New',monospace;color:var(--ink);flex-wrap:wrap}.project-colophon{width:100%}.tile canvas{border-color:var(--ink)}.tile-label{font-size:19px;font-weight:800;padding:0 6px}.tile-family{border-top:1px solid var(--line);padding:10px 6px 4px;margin-top:10px;line-height:1.4}.filters{border-top:6px solid var(--ink);border-bottom:1px solid var(--ink);gap:8px}.filters button{border:1px solid var(--line);border-radius:0;font:11px 'Courier New',monospace}.filters button[aria-pressed=true]{background:var(--ink);color:var(--paper)}
button:focus-visible,a:focus-visible{outline:3px solid #000;outline-offset:4px}
@media(min-width:1600px){.grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:1000px){.grid{grid-template-columns:repeat(2,minmax(0,1fr))}.intro{flex-direction:column;align-items:start}.view-switch{flex-direction:row;align-self:stretch;min-width:0}.view-switch button{flex:1}.view-switch button+button{border-top:0;border-left:1px solid var(--ink)}.label-sequence span{padding:14px 10px;font-size:10px}.label-sequence b{margin-right:4px}.header-note{display:none}}
@media(max-width:600px){.variant-nav{padding:11px 18px;align-items:start;font-size:10px}.variant-nav>span{max-width:100px;line-height:1.4}.variant-nav div{flex-direction:column;gap:6px;align-items:end}header{margin:0 18px;height:65px}.brand{font-size:11px;gap:5px}main{padding:0 18px 24px}.intro{padding:28px 0 22px;gap:18px}.intro h1{font-size:68px}.label-sequence{grid-template-columns:1fr}.label-sequence span{padding:9px 8px;font-size:10px}.label-sequence span+span{border-left:0;border-top:1px solid var(--line)}.label-sequence b{margin-right:10px}.surface-label{gap:12px;font-size:9px;line-height:1.5}.surface-label span:last-child{text-align:right}.grid{gap:16px;grid-template-columns:1fr}.picture{aspect-ratio:1.55}.person-caption .card-subtitle{font-size:25px}.portrait{width:55px;height:66px}.portrait-large{width:120px;height:145px}dialog{padding:14px;width:calc(100vw - 16px);max-height:94dvh}.detail-layout{grid-template-columns:1fr;gap:16px}.detail-layout h2{font-size:36px}.art-side canvas{max-height:38dvh;object-fit:contain;background:#eee}.unmix-steps button{font-size:10px}.tile canvas{max-height:240px;object-fit:contain}.view-switch button{padding:12px 9px}.project-context{font-size:13px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}
@media(max-width:600px){body[data-page=techniques] .intro h1{font-size:clamp(44px,17vw,68px)}}

/* Monochrome edition; the original artwork controllers remain shared. */
.notes-nav a,.notes-nav .notes-home,.notes-nav a[aria-current=page],.project-colophon .return-to-notes{color:var(--ink)}
.project-colophon{color:var(--muted);border-color:var(--line)}
.picture{background:#eee}canvas{filter:grayscale(1)}#threads line{stroke:#888}
.trail-link.with-face{display:flex;align-items:center;gap:12px}.trail-link .portrait{width:42px;height:50px;flex-shrink:0}
.evidence h3.with-faces{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.connection-person{display:flex;align-items:center;gap:10px}.connection-person .portrait{width:46px;height:56px}
