@font-face{font-family:LocalSans;src:local('Helvetica Neue');font-display:swap}
:root{--paper:#efeee8;--ink:#24251f;--muted:#68695e;--line:#c9c9bc;--accent:#ba3e25;--green:#dee1ca;--violet:#dfdcf0;--serif:Georgia,'Songti SC','Noto Serif CJK SC',serif;--sans:LocalSans,Arial,'PingFang SC','Microsoft YaHei',sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:30px}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}a,button{-webkit-tap-highlight-color:transparent}a:focus-visible,button:focus-visible{outline:2px solid var(--accent);outline-offset:6px}::selection{background:var(--accent);color:#fff}.skip{position:absolute;left:20px;top:-100px;z-index:10;padding:14px;background:var(--ink);color:white}.skip:focus{top:10px}.wrap{max-width:1600px;padding:0 5.2vw;margin:auto}.topbar{display:flex;justify-content:space-between;align-items:center;padding:30px 0;border-bottom:1px solid var(--ink)}.brand{font-size:23px;font-weight:600;letter-spacing:-1px}.brand i{font-family:var(--serif);font-weight:400;color:var(--accent)}.nav{display:flex;align-items:center;gap:35px;font-size:13px}.nav a{padding:7px 0}.nav a:hover{color:var(--accent)}.small{font-size:11px;letter-spacing:1.4px;line-height:1.6}.hero{position:relative;padding:50px 0 42px}.hero-top{display:flex;justify-content:space-between;align-items:start;gap:25px}.eyebrow{display:flex;gap:12px;align-items:center}.dot{width:7px;height:7px;background:var(--accent);border-radius:50%;display:inline-block}.edition{font-family:var(--serif);font-size:13px;font-style:italic}.hero h1{font-size:clamp(84px,15.8vw,242px);font-weight:400;letter-spacing:-.072em;line-height:.95;margin:48px 0 26px}.hero h1 em{font-family:var(--serif);font-weight:400;color:var(--accent);letter-spacing:-.085em}.hero-bottom{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:end}.hero-statement{font-weight:400;font-family:var(--serif);font-size:clamp(26px,3.1vw,45px);line-height:1.5;margin:0;letter-spacing:.025em}.hero-description{max-width:410px;font-size:14px;line-height:1.9;margin:0 0 0 auto}.hero-description span{color:var(--muted);display:block;margin-top:12px;font-size:12px}.section-title{display:flex;align-items:baseline;justify-content:space-between;border-top:1px solid var(--ink);padding:22px 0 25px;margin-top:55px}.section-title h2{font-size:13px;font-weight:400;margin:0;letter-spacing:.08em}.section-title sup{font-size:10px;color:var(--accent);margin-left:8px}.section-title .small{color:var(--muted)}.projects{display:grid;grid-template-columns:1fr 1fr;gap:30px}.project-art{height:clamp(290px,29vw,440px);overflow:hidden;display:flex;flex-direction:column;justify-content:space-between;position:relative;padding:28px;background:var(--green);transition:background .3s}.project:nth-child(2) .project-art{background:var(--violet)}.project-art:hover{background:#d4d9b9}.project:nth-child(2) .project-art:hover{background:#d4cee9}.art-label{display:flex;justify-content:space-between;font-size:10px;letter-spacing:1.6px}.art-title{font-family:var(--serif);font-size:clamp(60px,7.4vw,113px);line-height:.84;font-weight:400;letter-spacing:-.07em;margin:22px 0 18px}.art-title em{font-weight:400}.art-footer{display:flex;justify-content:space-between;align-items:end}.art-footer p{font-size:11px;line-height:1.6;margin:0}.circle-link{display:grid;place-items:center;width:45px;height:45px;border:1px solid #24251f70;border-radius:50%;font-size:23px;transition:transform .2s}.project-art:hover .circle-link{transform:rotate(-45deg);background:var(--ink);color:var(--paper)}.project-meta{display:flex;justify-content:space-between;align-items:center;margin:23px 0 12px;gap:15px}.project-meta h3{font-size:20px;letter-spacing:-.5px;font-weight:500;margin:0}.project-meta h3 a:hover{text-decoration:underline;text-underline-offset:5px}.number{font-family:var(--serif);font-style:italic;font-size:13px;color:var(--muted);margin-right:11px}.project-desc{font-size:13px;line-height:1.9;color:var(--muted);max-width:490px;margin:0}.tag{font-size:10px;padding:6px 9px;border:1px solid var(--line);white-space:nowrap}.project-links{display:flex;gap:25px;margin-top:18px;font-size:12px}.project-links a{border-bottom:1px solid var(--ink);padding-bottom:5px}.project-links a:hover{color:var(--accent);border-color:var(--accent)}.about{display:grid;grid-template-columns:1fr 2fr;gap:80px;margin:110px 0 100px;padding-top:30px;border-top:1px solid var(--ink)}.about-label{font-size:12px;line-height:1.8;letter-spacing:1px}.about h2{font-family:var(--serif);font-size:clamp(28px,3.6vw,48px);font-weight:400;line-height:1.55;margin:0 0 25px}.about p{max-width:620px;font-size:14px;line-height:2;color:var(--muted)}.footer{border-top:1px solid var(--ink);padding:25px 0 32px;display:flex;justify-content:space-between;font-size:11px;gap:20px}.footer a:hover{color:var(--accent)}.detail-hero{padding:45px 0 50px;border-bottom:1px solid var(--ink)}.back{font-size:12px;color:var(--muted);display:inline-block;margin-bottom:45px}.detail-hero h1{font-size:clamp(52px,9vw,134px);font-family:var(--serif);font-weight:400;letter-spacing:-.06em;line-height:1.05;margin:20px 0 27px}.detail-lead{font-size:clamp(24px,3vw,40px);font-family:var(--serif);font-weight:400;line-height:1.5;margin:0 0 18px}.detail-desc{font-size:15px;line-height:1.9;max-width:650px;color:var(--muted)}.actions{display:flex;gap:15px;flex-wrap:wrap;margin-top:30px}.button{background:var(--ink);color:var(--paper);padding:15px 22px;font-size:12px;display:inline-block;border:1px solid var(--ink)}.button:hover{background:var(--accent);border-color:var(--accent)}.button.secondary{background:transparent;color:var(--ink)}.button.secondary:hover{border-color:var(--accent);color:var(--accent)}.feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:50px;padding:50px 0}.feature-grid h2{font-size:20px;font-weight:400;margin:15px 0}.feature-grid p{font-size:13px;line-height:1.9;color:var(--muted)}.install{border-top:1px solid var(--ink);padding:40px 0 70px;display:grid;grid-template-columns:1fr 2fr;gap:65px}.install h2{font-family:var(--serif);font-size:32px;font-weight:400;margin-top:0}.install p{font-size:13px;line-height:1.9;color:var(--muted)}pre{background:#e5e4dc;padding:25px;font-size:12px;line-height:1.9;white-space:pre-wrap;overflow-wrap:anywhere;margin:0 0 25px;border:1px solid var(--line)}.notice{border-left:2px solid var(--accent);padding-left:20px}.text-link{border-bottom:1px solid;padding-bottom:3px;font-size:13px}.error{min-height:70vh;display:flex;flex-direction:column;align-items:start;justify-content:center}.error h1{font-family:var(--serif);font-size:110px;margin:0;font-weight:400}.error p{line-height:1.8}
@media(min-width:1600px){.wrap{padding:0 80px}}
@media(max-width:760px){.wrap{padding:0 6vw}.topbar{padding:23px 0}.nav{gap:20px;font-size:12px}.brand{font-size:20px}.hero{padding-top:30px}.hero h1{font-size:17vw;margin:42px 0 30px}.hero-bottom{grid-template-columns:1fr;gap:22px}.hero-description{margin:0;max-width:100%}.hero-statement{font-size:29px}.edition{display:none}.section-title{margin-top:28px}.projects{grid-template-columns:1fr;gap:50px}.project-art{height:350px;padding:25px}.art-title{font-size:98px}.project-meta h3{font-size:19px}.about{grid-template-columns:1fr;gap:22px;margin:65px 0 60px}.about h2{font-size:31px}.about-label br{display:none}.footer{font-size:10px;flex-wrap:wrap}.feature-grid{grid-template-columns:1fr;gap:15px;padding:30px 0}.install{grid-template-columns:1fr;gap:20px;padding-top:30px}.detail-hero{padding-top:30px}.detail-hero h1{font-size:15vw}.back{margin-bottom:20px}.detail-lead{font-size:27px}.small{font-size:10px}.project-meta{flex-wrap:wrap}.error h1{font-size:80px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important;animation:none!important}}

/* Fluid layouts: preserve reading order, native zoom, and touch targets. */
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
.hero-bottom,.projects,.feature-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.feature-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.hero-bottom>*,.projects>*,.about>*,.feature-grid>*,.install>*{min-width:0}
.project-meta{flex-wrap:wrap}.project-meta h3{overflow-wrap:anywhere}
.hero-description,.project-desc,.detail-desc,.feature-grid p,.install p{overflow-wrap:break-word}
.nav a,.brand{min-height:44px;display:inline-flex;align-items:center}
.project-links{flex-wrap:wrap;row-gap:8px}
.project-links a,.back,.text-link,.footer a{min-height:44px;display:inline-flex;align-items:center}
.button{min-height:44px;line-height:1.5;text-align:center}
.art-label{gap:12px;line-height:1.5}.art-label span:last-child{flex-shrink:0}
.art-footer{gap:12px}.circle-link{flex-shrink:0}
pre{max-width:100%;word-break:break-word}
.about{grid-template-columns:minmax(0,1fr) minmax(0,2fr)}
.install{grid-template-columns:minmax(0,1fr) minmax(0,2fr)}
.footer{flex-wrap:wrap;align-items:center}
@media(min-width:761px) and (max-width:1100px){
 .hero-bottom{gap:28px}.projects{gap:24px}.project-art{padding:22px;height:320px}
 .about{gap:40px}.install{gap:32px}.feature-grid{gap:26px}
 .project-meta h3{font-size:19px}.nav{gap:25px}
}
@media(max-width:760px){
 .hero-bottom,.projects,.about,.feature-grid,.install{grid-template-columns:minmax(0,1fr)}
 .project-art{height:auto;min-height:340px}.art-title{font-size:clamp(78px,17vw,113px)}
 .hero-description,.project-desc,.feature-grid p,.install p{font-size:15px}
 .project-links,.nav,.back,.text-link{font-size:14px}
 .detail-desc{font-size:16px}.hero-description span{font-size:13px}
 .tag,.art-footer p,.art-label{font-size:11px}
 .button{font-size:14px}.footer{gap:8px 20px;font-size:11px}
}
@media(max-width:380px){
 .nav{gap:13px;font-size:13px}.topbar{gap:14px;flex-wrap:wrap}
 .hero-statement{font-size:26px}.section-title{gap:12px;flex-wrap:wrap}
 .project-art{padding:20px}.art-label{font-size:9px;letter-spacing:1px}
 .detail-hero h1{font-size:14vw}.actions{gap:10px}
 .actions .button{flex:1 1 100%}pre{padding:17px;font-size:11px}
}
@media(pointer:coarse){
 .nav a,.project-links a,.back,.text-link,.footer a{min-height:48px}
 .button{min-height:48px}
}
@media(hover:none){
 .project-art:hover{background:var(--green)}
 .project:nth-child(2) .project-art:hover{background:var(--violet)}
 .project-art:hover .circle-link{transform:none;background:transparent;color:var(--ink)}
}
/* Text enlargement must expand covers instead of clipping their lettering. */
.project-art{height:auto;min-height:clamp(290px,29vw,440px)}
.art-title,.hero h1,.detail-hero h1{overflow-wrap:anywhere}
@media(min-width:761px) and (max-width:1100px){.project-art{min-height:320px}}
@media(max-width:760px){.project-art{min-height:340px}}
.error h1{max-width:100%;overflow-wrap:anywhere}
.circle-link{line-height:1}
.project-meta h3 a{display:inline-flex;align-items:center;min-height:44px}
@media(pointer:coarse){.project-meta h3 a{min-height:48px}}