/* Graphic Design 06. Shared visual treatment; content and discovery stay data-driven. */
:root{--paper:#fafaf8;--ink:#101113;--rule:#c7c8c4;--motif:repeating-conic-gradient(var(--ink) 0% 25%,transparent 0% 50%) 0 0/12px 12px}
.masthead-inner{min-height:78px}.masthead nav{text-transform:none;font-size:13px}.wordmark{letter-spacing:-.055em}
.site-footer{background:var(--ink);color:var(--paper);border:0;position:relative;padding-block:32px}.site-footer a:focus-visible{outline-color:#fff}
h1{text-transform:none;letter-spacing:-.065em;line-height:1.08}
.category{position:relative;padding:9px 26px 9px 12px;background:linear-gradient(225deg,transparent 13px,var(--accent) 13px);font-weight:500}
/* A bracketed paired-square signature marks entrances without obscuring headings. */
.essay-header{position:relative;border-bottom:2px solid var(--ink);padding-block:58px 32px}
.essay-header::before{content:'';position:absolute;width:86px;height:12px;left:0;bottom:-7px;background:var(--motif)}
.essay-header::after{content:'';position:absolute;right:0;top:62px;width:66px;height:66px;background:linear-gradient(var(--ink),var(--ink)) 19px 19px/14px 14px no-repeat,linear-gradient(var(--ink),var(--ink)) 33px 33px/14px 14px no-repeat,linear-gradient(var(--accent),var(--accent));box-shadow:5px -5px 0 var(--paper),6px -6px 0 var(--ink)}
.essay-header>.eyebrow{padding-right:90px;min-height:42px}.essay-header h1{max-width:1100px;font-size:clamp(36px,5.7vw,80px);margin-top:28px}.essay-header .subtitle{max-width:900px}
.prose h2{border:0;padding-top:0;text-transform:none;font-size:clamp(22px,2.15vw,29px);line-height:1.35}.prose h2::before{display:none}
.contents{padding-right:22px;border-right:1px solid var(--rule)}.contents summary{text-transform:none;border:0;padding-bottom:10px}.contents a[aria-current="location"]{background:transparent;color:var(--ink)}.contents a:hover{background:#eeefea}
.article-end{max-width:none;position:relative;border-top:2px solid var(--ink);padding-top:24px}.article-end::before,.serial-end::before{content:'';position:absolute;right:0;top:-7px;width:100px;height:12px;background:repeating-linear-gradient(135deg,var(--accent) 0 6px,var(--paper) 6px 10px);border-inline:8px solid var(--paper)}
.end-mark{background:transparent;padding:0}.article-end a{ text-decoration-color:var(--accent);text-decoration-thickness:2px}
/* Home: original vector composition, with category-derived row graphics. */
.home-intro{position:relative;display:grid;grid-template-columns:minmax(0,1.65fr) minmax(0,1fr);gap:20px;padding-block:50px 32px;border:0;align-items:center}
.home-intro-copy{min-width:0;position:relative;z-index:1}.home-intro h1{font-size:clamp(42px,6.5vw,90px);line-height:1.04;margin:26px 0;letter-spacing:-.065em}.home-marker{background:transparent;padding:0;font-size:11px}.home-intro .eyebrow::after{content:'';height:1px;background:var(--ink);flex:1;min-width:24px}
.home-intro-bottom{display:block}.home-intro-bottom .subtitle{font-size:clamp(19px,1.7vw,23px);max-width:620px}.home-link{display:inline-block;margin-top:20px}.home-hero-graphic{display:block;width:100%;height:auto;align-self:center}
.home-sections{gap:24px;padding-block:24px 38px}.home-sections>a{position:relative;display:grid;grid-template-columns:1fr auto;gap:6px 12px;border:0;padding:20px 24px;background:linear-gradient(225deg,transparent 23px,var(--accent) 23px);color:var(--ink)}
.home-sections>a>span:first-child{grid-column:1/-1;font-size:19px;line-height:1.2}.home-sections strong{font-size:clamp(15px,1.6vw,22px);line-height:1.4}.home-sections>a>span:last-child{font-size:28px;line-height:1.1;align-self:center}.home-sections>a:focus-visible{outline-offset:5px}
.home-section-title{position:relative;border:0;padding-block:0 22px;align-items:center}.home-section-title::before{content:'';width:84px;height:12px;background:var(--motif);flex:none}.home-section-title h2{margin-right:auto}.home-section-title h2,.home-connections h2{font-size:clamp(22px,2.3vw,30px)}
.home-recent{padding-top:10px}.home-recent .archive-list li{grid-template-columns:90px 110px minmax(0,1fr) 145px;align-items:center;gap:22px;padding-block:24px}.home-recent .archive-list li:first-child{border-top:0}
.category-graphic{display:block;width:90px;aspect-ratio:1;background:var(--motif);border:1px solid var(--rule)}
[data-section="software"]>.category-graphic{background:var(--paper) url('../graphics/category-software.svg') center/cover no-repeat}
[data-section="stories-craft"]>.category-graphic{background:var(--paper) url('../graphics/category-stories.svg') center/cover no-repeat}
[data-section="culture-society"]>.category-graphic{background:var(--paper) url('../graphics/category-culture.svg') center/cover no-repeat}
.home-connections{border-top:1px solid var(--rule);gap:60px}.home-connections>div+div{border-left:1px solid var(--rule);padding-left:40px}.home-connections .eyebrow::before{content:'';width:20px;height:9px;background:linear-gradient(to right,var(--ink) 0 9px,transparent 9px 11px,var(--ink) 11px)}
/* Archive retains its form, list order, format labels, and data hooks. */
.archive-header{position:relative;border-bottom:2px solid var(--ink);padding-right:140px}.archive-header h1{text-transform:uppercase;font-size:clamp(50px,9.8vw,136px);line-height:1;margin-top:26px}.archive-header::after{content:'';position:absolute;right:20px;top:70px;width:102px;height:26px;background:linear-gradient(to right,#b5ff00 0 30px,transparent 30px 36px,#ff00a8 36px 66px,transparent 66px 72px,#00e5ff 72px);border-bottom:1px solid var(--ink)}
.archive-header::before{content:'';position:absolute;right:0;top:0;bottom:24px;width:8px;background:repeating-linear-gradient(135deg,var(--ink) 0 6px,transparent 6px 12px)}
.archive-controls{padding-block:28px;border-bottom:4px solid var(--ink);gap:24px}.archive-controls label{font-weight:500}.archive-controls input,.archive-controls select{background:var(--paper);padding:12px}.archive-controls label:first-child{min-width:240px}.archive-controls input{width:100%}
.archive-count{margin-block:18px 28px}.archive>section[data-archive-group]{counter-increment:archive-group}.archive{counter-reset:archive-group}
.archive-group-title{display:flex;align-items:center;gap:0;margin-top:36px;font-size:14px;letter-spacing:0;line-height:1.5}.archive-group-title::before{content:counter(archive-group,decimal-leading-zero);font:500 13px/1.5 var(--mono);padding:10px 12px;background:var(--ink);color:var(--paper);border-right:1px solid var(--paper)}
.archive-group-title>span{padding:10px 28px 10px 16px;background:linear-gradient(45deg,var(--ink) calc(100% - 17px),transparent calc(100% - 17px));color:var(--paper)}.archive-group-title::after{content:'';height:1px;background:var(--ink);flex:1;margin-left:18px}
.archive-list li{grid-template-columns:116px minmax(0,1fr) 165px;gap:24px;padding-block:26px}.archive-list time{color:var(--muted)}.archive-title{font:700 clamp(23px,2.5vw,33px)/1.25 var(--body);letter-spacing:-.025em}.archive-list p{font-size:17px}.archive-category{border:0;background:var(--accent);color:var(--ink);padding:4px 8px;font:500 10px/1.5 var(--mono);text-transform:uppercase;justify-self:end;max-width:100%}.archive-list .archive-format{font-size:11px;text-transform:none}
.archive section[data-archive-group]>.archive-list{border-bottom:1px solid var(--ink);padding-bottom:8px}
/* Related formats reuse the same signature; custom artwork remains uncropped. */
.serial-header{border-bottom:2px solid var(--ink)}.serial-end{position:relative;border-top:2px solid var(--ink)}.serial-marker{background:linear-gradient(225deg,transparent 6px,var(--accent) 6px);padding-inline:8px 13px}.serial-playlist{background:#f0f1ed}.review-object{border-top-width:4px}.review-object h2{overflow-wrap:anywhere}.work-parts a:hover{background:var(--accent)}
@media(min-width:1500px){.home-intro h1{font-size:90px}.essay-header h1{font-size:84px}}
@media(max-width:1100px){.home-recent .archive-list li{grid-template-columns:76px 95px minmax(0,1fr);gap:18px}.home-recent .category-graphic{width:76px;grid-row:1/3}.home-recent .archive-category{grid-column:3;justify-self:start}.home-recent .archive-list time{grid-column:2}.archive-list li{grid-template-columns:105px minmax(0,1fr)}.archive-category{grid-column:2;justify-self:start}.home-intro{grid-template-columns:minmax(0,1.65fr) minmax(0,1fr)}.home-sections{gap:16px}.home-sections>a{padding:18px}}
@media(max-width:760px){.masthead-inner{padding-block:20px}.masthead nav{font-size:12px}.home-intro{display:block;padding-top:32px}.home-intro h1{font-size:clamp(40px,9vw,66px)}.home-hero-graphic{width:170px;max-width:42%;margin:0 0 0 auto}.home-intro-bottom .subtitle{font-size:20px}.home-sections{grid-template-columns:1fr;gap:14px;padding-top:12px}.home-sections>a{grid-template-columns:32px minmax(0,1fr) auto;align-items:center;padding:18px 24px 18px 18px}.home-sections>a>span:first-child{grid-column:auto;font-size:16px}.home-sections strong{font-size:18px}.home-section-title{gap:16px}.home-section-title::before{width:40px}.home-section-title h2{font-size:22px}.home-section-title>a{flex-basis:100%}.home-recent .archive-list li{grid-template-columns:58px minmax(0,1fr);gap:8px 16px}.home-recent .category-graphic{width:58px;grid-column:1;grid-row:1/4}.home-recent .archive-list time,.home-recent .archive-list li>div,.home-recent .archive-category{grid-column:2}.archive-title{font-size:25px}.home-connections{gap:28px}.home-connections>div+div{border-left:0;border-top:1px solid var(--rule);padding-left:0;padding-top:24px}.archive-header{padding-right:24px}.archive-header h1{font-size:clamp(43px,11vw,78px)}.archive-header::after{display:none}.archive-header::before{width:5px}.archive-controls{gap:18px}.archive-controls label:first-child{min-width:0}.archive-group-title{font-size:11px}.archive-group-title>span{padding:11px 23px 11px 12px}.archive-group-title::after{margin-left:10px}.archive-list li{grid-template-columns:1fr;gap:10px}.archive-category{grid-column:1}.essay-header{padding-block:32px 28px}.essay-header::after{width:42px;height:42px;top:36px;background:linear-gradient(var(--ink),var(--ink)) 9px 9px/12px 12px no-repeat,linear-gradient(var(--ink),var(--ink)) 21px 21px/12px 12px no-repeat,var(--accent)}.essay-header>.eyebrow{padding-right:58px}.essay-header h1{font-size:clamp(32px,7.6vw,55px)}.contents{border-right:0;padding-right:0;border-bottom:1px solid var(--rule)}.article-end{font-size:11px}.article-end::before{width:70px}.prose h2{font-size:23px}}
@media print{.home-hero-graphic,.category-graphic,.essay-header::before,.essay-header::after,.archive-header::before,.archive-header::after,.home-section-title::before{display:none}.home-intro{display:block}.home-recent .archive-list li{display:block}.home-sections>a{background:none;border:1px solid #000}.archive-category{background:none}.archive-controls{display:none}h1,.essay-header h1,.home-intro h1{font-size:32pt}.prose h2{font-size:17pt}.archive-header h1{font-size:36pt}}
