/* sou-art.jp — artist archive. Paper, ink, quiet green-grey; reading rhythm of an artist's catalogue. */
:root{color-scheme:light;--paper:#F5F2EB;--ink:#212520;--quiet:#53594F;--line:#CCC7BC;--tint:#ECE8DF;--accent:#7A5A2E;
--serif:"Yu Mincho","YuMincho","Hiragino Mincho ProN","Noto Serif JP","Noto Serif TC","Songti TC",Georgia,serif;
--sans:system-ui,-apple-system,"Segoe UI","Hiragino Sans","Yu Gothic UI","Noto Sans JP","Noto Sans TC",sans-serif;
--s1:8px;--s2:16px;--s3:24px;--s4:40px;--s5:64px;--s6:96px;--max:1440px;--gutter:clamp(20px,5vw,72px)}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font:17px/1.8 var(--sans)}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-underline-offset:.22em;text-decoration-thickness:1px}
a:hover{text-decoration-thickness:2px}
a:focus-visible,.zoom-close:focus-visible{outline:2px solid var(--accent);outline-offset:4px}
h1,h2,h3{font-family:var(--serif);font-weight:400;line-height:1.3;margin:0}
p{margin:0 0 var(--s2)}
ul,ol{margin:0;padding:0}
.skip{position:absolute;left:-9999px;top:0}
.skip:focus{left:var(--s2);top:var(--s2);background:#fff;padding:var(--s1) var(--s2);z-index:20}
/* header */
.site-header,main,.site-footer{max-width:var(--max);margin:0 auto;padding-inline:var(--gutter)}
.site-header{padding-top:var(--s3)}
.bar{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:var(--s2) var(--s3)}
.brand{text-decoration:none;display:flex;align-items:baseline;gap:var(--s2);flex-wrap:wrap}
.brand-name{font-family:var(--serif);font-size:clamp(28px,3.6vw,44px);letter-spacing:.06em;line-height:1.1}
.brand-label{font-size:13px;color:var(--quiet);letter-spacing:.12em}
.util{display:flex;align-items:center;gap:var(--s3);font-size:14px}
.langs ul{list-style:none;display:flex;gap:var(--s2)}
.langs a{text-decoration:none;color:var(--quiet)}
.langs a[aria-current]{color:var(--ink);text-decoration:underline}
.util-contact{text-decoration:none;border-bottom:1px solid var(--ink)}
.main-nav{margin-top:var(--s3);border-top:1px solid var(--ink);border-bottom:1px solid var(--line)}
.main-nav ul{list-style:none;display:flex;flex-wrap:wrap;gap:0 var(--s4);padding:12px 0}
.main-nav a{text-decoration:none;font-size:15px;letter-spacing:.04em}
.main-nav a[aria-current]{text-decoration:underline;text-underline-offset:.5em}
.crumbs ol{list-style:none;display:flex;flex-wrap:wrap;gap:var(--s1);font-size:13px;color:var(--quiet);padding-top:var(--s3)}
.crumbs li+li::before{content:"/";margin-right:var(--s1)}
.crumbs a{text-decoration:none}
/* home */
.home-hero{padding-top:var(--s4)}
.hero-figure{margin:0}
.hero-figure img{width:100%}
figcaption{font-size:13px;color:var(--quiet);padding-top:var(--s1)}
.home-intro{max-width:760px;margin:var(--s5) auto var(--s4)}
.intro{font-family:var(--serif);font-size:clamp(20px,2.3vw,27px);line-height:1.75}
.block{border-top:1px solid var(--line);padding:var(--s4) 0 var(--s5)}
.block>h2{font-size:clamp(24px,2.6vw,34px);margin-bottom:var(--s3)}
.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:var(--s3) var(--s5)}
.split>h2{margin:0}
.split p{max-width:66ch}
.more{font-size:15px;margin-top:var(--s3)}
.more a{margin-right:var(--s3);white-space:nowrap}
.subject-tiles{list-style:none;display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:var(--s3)}
.subject-tiles a{display:flex;flex-direction:column;gap:var(--s1);text-decoration:none}
.tile-name{font-family:var(--serif);font-size:18px}
.tile-count{font-size:13px;color:var(--quiet)}
.frame{display:block;position:relative;aspect-ratio:4/3;background:var(--tint)}
.frame img{position:absolute;inset:0;margin:auto;max-width:calc(100% - 16px);max-height:calc(100% - 16px);width:auto;height:auto}
.vh{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.record-list{list-style:none;display:grid;gap:0}
.record-list li{border-bottom:1px solid var(--line)}
.record-list a{display:grid;grid-template-columns:minmax(150px,1fr) 3fr;gap:var(--s3);padding:var(--s2) 0;text-decoration:none}
.record-list a:hover .item-title{text-decoration:underline}
.link-list{list-style:none;display:flex;flex-wrap:wrap;gap:var(--s2) var(--s4)}
.link-list a{border-bottom:1px solid var(--line);text-decoration:none;padding-bottom:2px}
/* page heads */
.page-head{padding:var(--s5) 0 var(--s4);max-width:920px}
.page-head h1{font-size:clamp(34px,5vw,64px);letter-spacing:.02em}
.kicker{font-size:13px;letter-spacing:.14em;color:var(--quiet);margin-bottom:var(--s2)}
.lead{font-size:clamp(17px,1.8vw,20px);max-width:66ch;margin-top:var(--s3)}
.count{font-family:var(--sans);font-size:14px;color:var(--quiet)}
/* works */
.subject-nav ul{list-style:none;display:flex;flex-wrap:wrap;gap:var(--s1) var(--s3);margin-top:var(--s3);font-size:15px}
.subject{border-top:1px solid var(--line);padding:var(--s4) 0;scroll-margin-top:var(--s2)}
.subject-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:var(--s3);margin-bottom:var(--s3)}
.subject-head h2{font-size:28px}
.cards{list-style:none;display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:var(--s4) var(--s3)}
.card a{display:flex;flex-direction:column;gap:var(--s1);text-decoration:none}
.card.wide{grid-column:span 2}
.card.wide .frame{aspect-ratio:8/3}
.card-title{font-size:15px;line-height:1.5}
.card a:hover .card-title{text-decoration:underline}
.artist-words{background:var(--tint);padding:var(--s3) var(--s4);margin:0 0 var(--s4);max-width:920px}
.artist-words h2{font-size:15px;font-family:var(--sans);letter-spacing:.1em;color:var(--quiet);margin-bottom:var(--s2)}
.words-lead{font-family:var(--serif);font-size:21px}
.pager ul{list-style:none;display:flex;flex-wrap:wrap;gap:var(--s2);margin-top:var(--s4)}
.pager a{display:inline-block;min-width:44px;padding:var(--s1) 12px;border:1px solid var(--line);text-align:center;text-decoration:none}
.pager a[aria-current]{background:var(--ink);color:var(--paper);border-color:var(--ink)}
/* work detail */
.work .page-head{padding-bottom:var(--s3)}
.work-images{display:grid;gap:var(--s5);margin-bottom:var(--s4)}
.work-images figure{margin:0}
.work-images img{margin:0 auto;max-height:84vh;width:auto;background:var(--tint)}
.work-images figcaption{text-align:center}
.facts{display:grid;gap:var(--s1);max-width:700px;margin:0 0 var(--s3);font-size:15px}
.facts div{display:grid;grid-template-columns:9em 1fr;gap:var(--s2);border-bottom:1px solid var(--line);padding:var(--s1) 0}
.facts dt{color:var(--quiet)}
.facts dd{margin:0}
.work-intro{max-width:66ch}
.note{font-size:14px;color:var(--quiet)}
.work-pager ul{list-style:none;display:flex;flex-wrap:wrap;justify-content:space-between;gap:var(--s2);border-top:1px solid var(--ink);padding:var(--s2) 0;margin:var(--s4) 0 var(--s5);font-size:15px}
.zoom{display:none}
.zoom:target{display:flex;position:fixed;inset:0;z-index:30;background:rgba(20,22,19,.96);align-items:center;justify-content:center;padding:56px var(--s2) var(--s2)}
.zoom img{max-width:100%;max-height:100%;width:auto;object-fit:contain}
.zoom-close{position:absolute;top:var(--s2);right:var(--s2);color:#fff;background:transparent;border:1px solid #fff;padding:6px 14px;text-decoration:none;font-size:15px}
/* archive & lists */
.entries{list-style:none;max-width:980px}
.entries li{border-top:1px solid var(--line);padding:var(--s3) 0;display:grid;gap:4px}
.entries .item-title{font-family:var(--serif);font-size:21px}
.entries p{margin:0;color:var(--quiet);font-size:15px;max-width:70ch}
.date{font-size:14px;color:var(--quiet)}
.tag{display:inline-block;font-size:12px;letter-spacing:.06em;border:1px solid var(--line);padding:0 8px;margin-left:var(--s1);color:var(--quiet);width:max-content}
.archive,.record,article.film{max-width:880px;padding-bottom:var(--s5)}
.archive .page-head h1,.record .page-head h1,article.film .page-head h1{font-size:clamp(28px,3.8vw,46px)}
.byline{font-family:var(--serif);font-size:19px;margin-top:var(--s2)}
.meta{font-size:14px;color:var(--quiet)}
.summary{font-family:var(--serif);font-size:19px;line-height:1.85;max-width:66ch;border-left:2px solid var(--line);padding-left:var(--s3)}
.archive-body h2{font-size:24px;margin:var(--s4) 0 var(--s2)}
.archive-body p{max-width:68ch}
.archive-figure{margin:var(--s3) 0}
.archive-gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:var(--s2);margin:var(--s3) 0}
.archive-gallery figure{margin:0}
.related{padding-left:1.2em}
.source-note{border-top:1px solid var(--line);padding-top:var(--s2);margin-top:var(--s5);font-size:14px;color:var(--quiet)}
.see-also{margin-top:var(--s4)}
.see-also h2{font-size:20px;margin-bottom:var(--s1)}
.see-also ul{padding-left:1.2em}
.player{aspect-ratio:16/9;background:#111;margin-bottom:var(--s2)}
.player iframe{width:100%;height:100%;border:0;display:block}
.film-list{list-style:none;display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:0 var(--s4)}
.film-list li{border-top:1px solid var(--line);padding:var(--s2) 0 var(--s3)}
.film-list a{display:flex;gap:var(--s2);text-decoration:none}
.film-list .num{font-family:var(--serif);color:var(--quiet);min-width:2em}
.film-list .item-title{font-family:var(--serif);font-size:18px}
.film-list a:hover .item-title{text-decoration:underline}
.film-list p{margin:var(--s1) 0 0 calc(2em + var(--s2));font-size:14px;color:var(--quiet)}
.contact-box{background:var(--tint);padding:var(--s4);margin-bottom:var(--s5);max-width:880px}
.contact-box h2{font-size:26px;margin-bottom:var(--s2)}
.button{display:inline-block;background:var(--ink);color:var(--paper);text-decoration:none;padding:12px 24px;margin-top:var(--s1)}
.button:hover{background:#000}
.steps{padding-left:1.4em;max-width:70ch}
.steps li{margin-bottom:var(--s1)}
/* footer */
.site-footer{border-top:1px solid var(--ink);margin-top:var(--s5);padding-block:var(--s3) var(--s5);display:flex;flex-wrap:wrap;justify-content:space-between;gap:var(--s2) var(--s4);font-size:14px}
.foot-name{font-family:var(--serif);font-size:18px;margin:0}
.site-footer ul{list-style:none;display:flex;flex-wrap:wrap;gap:var(--s1) var(--s3)}
.not-found{padding:var(--s6) var(--gutter);display:grid;gap:var(--s4);max-width:900px;margin:0 auto}
.not-found h1{font-size:30px}
@media (max-width:1100px){.subject-tiles{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media (max-width:760px){
 body{font-size:16px}
 .split,.subject-head{grid-template-columns:1fr}
 .subject-tiles{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s2)}
 .cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s3) var(--s2)}
 .card.wide{grid-column:span 2}
 .record-list a{grid-template-columns:1fr;gap:2px}
 .main-nav ul{gap:0 var(--s3)}
 .facts div{grid-template-columns:7em 1fr}
 .contact-box{padding:var(--s3)}
 .home-intro{margin:var(--s4) 0 var(--s3)}
}
@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
/* Rev.5: quieter frames, editorial introduction, contact strip */
.cards .frame{background:transparent}
.cards .frame img{max-width:100%;max-height:100%}
.subject-tiles .frame{background:transparent}
.series-intro{max-width:760px;margin:0 0 var(--s4);border-left:2px solid var(--accent);padding-left:var(--s3)}
.series-intro h2{font-family:var(--sans);font-size:13px;letter-spacing:.14em;color:var(--accent);margin-bottom:var(--s1)}
.series-intro p{font-family:var(--serif);font-size:19px;line-height:1.9}
.summary-label{font-size:13px;letter-spacing:.1em;color:var(--quiet);margin-bottom:var(--s1)}
.contact-strip .button{margin-top:0}
.hero-figure figcaption{letter-spacing:.06em}
.page-head h1{font-size:clamp(32px,4.6vw,68px)}
@media (max-width:760px){.page-head h1{font-size:clamp(30px,8vw,38px)}.page-head{padding:var(--s4) 0 var(--s3)}.block{padding:var(--s3) 0 var(--s4)}.home-intro{margin:var(--s3) 0}}
/* Rev.5 audit: work enquiry, prints */
.work-actions{border-top:1px solid var(--line);padding-top:var(--s3);margin-top:var(--s3);max-width:700px}
.work-actions .button{margin-top:0}
.prints>div p{max-width:66ch}
