:root{font-family:'Helvetica Neue','Apple SD Gothic Neo','Noto Sans KR',Arial,sans-serif;color:#1b1b1b;background:#fafafa;font-synthesis:none;--muted:#717171;--accent:#6f243d}*{box-sizing:border-box}body{margin:0}html{scroll-behavior:smooth;scroll-padding-top:32px}a{color:inherit;text-decoration:none}a:focus-visible{outline:2px solid var(--accent);outline-offset:7px}.skip{position:absolute;top:-90px;left:24px;z-index:5;background:#fff;padding:15px}.skip:focus{top:12px}.shell{max-width:1600px;margin:auto;padding:0 6vw}header{height:106px;display:flex;align-items:center;justify-content:space-between}.brand{font-size:20px;font-weight:750;letter-spacing:-1px;display:flex;align-items:center;gap:7px}.brand-dot{width:5px;height:5px;background:var(--accent);border-radius:50%;align-self:flex-end;margin-bottom:5px}.nav{font-size:13px;color:#505050;padding:12px 0}.nav:hover{color:var(--accent)}.intro{padding:40px 0 73px}h1{font-size:clamp(80px,17vw,260px);letter-spacing:-.085em;font-weight:550;line-height:.98;margin:0 0 36px -0.01em}.period{color:var(--accent)}.intro-bottom{display:flex;justify-content:space-between;align-items:flex-end}.intro-bottom p{font-size:24px;font-weight:500;line-height:1.45;letter-spacing:-.065em;margin:0}.intro-bottom .intro-aside{font-size:13px;font-weight:400;color:var(--muted);letter-spacing:-.025em;line-height:1.7;padding-right:3px}.projects{padding-top:27px;border-top:1px solid #d8d8d8;display:grid;grid-template-columns:22% 1fr;gap:20px}.section-heading h2{font-size:15px;letter-spacing:-.04em;font-weight:600;margin:0 0 12px}.section-heading>span{font-size:11px;color:var(--muted)}.project{display:flex;flex-direction:column;margin-bottom:48px}.project-art{height:330px;background:#632238;position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center}.book-composition{position:relative;width:100%;height:100%;display:flex;align-items:center;justify-content:center}.spread{display:flex;width:232px;height:241px;transform:perspective(900px) rotateY(-12deg) rotateZ(-9deg);filter:drop-shadow(0 18px 22px #24061555)}.page{width:50%;background:#f2eee6;position:relative;overflow:hidden;padding:14px}.page-left{background:linear-gradient(90deg,#ede9e0 85%,#d2cdc2 100%);transform:skewY(5deg);transform-origin:right}.page-right{background:linear-gradient(90deg,#d8d2c5,#f6f3eb 13%);transform:skewY(-5deg);transform-origin:left}.page-left .page-word{position:absolute;bottom:20px;left:10px;font-family:Georgia,serif;font-size:86px;line-height:.8;color:#632238;letter-spacing:-8px;writing-mode:vertical-rl}.page-right .page-word{font-family:Georgia,serif;font-size:86px;line-height:.8;color:#632238;letter-spacing:-8px;writing-mode:vertical-rl;position:absolute;top:22px;right:20px}.page-micro{font-size:6px;color:#632238;letter-spacing:1px}.page-lines{position:absolute;bottom:19px;right:13px;width:32px;height:32px;background:repeating-linear-gradient(0deg,transparent 0 4px,#9f9286 4px 5px);opacity:.65}.art-label{position:absolute;left:24px;bottom:22px;font-size:10px;color:#f0dce3;letter-spacing:.015em}.art-symbol{position:absolute;right:24px;top:18px;color:#d1a5b4;font-size:27px;font-weight:200}.project-content{position:relative;padding:21px 0 0;display:grid;grid-template-columns:1fr auto;gap:0 15px}.category{grid-column:1;font-size:11px;color:var(--muted);margin:0 0 8px}.project-content h3{grid-column:1;font-size:25px;letter-spacing:-.055em;font-weight:550;margin:0}.project-description{grid-column:1;font-size:13px;line-height:1.7;color:var(--muted);white-space:pre-line;margin:11px 0 0;letter-spacing:-.025em}.status,.project-link{grid-column:2;grid-row:1/3;align-self:center;font-size:11px;color:#656565}.status{display:flex;align-items:center;gap:7px}.status:before{content:'';width:5px;height:5px;border-radius:50%;background:#969696}.project-link{color:var(--accent);border-bottom:1px solid var(--accent);padding:7px 0}.project-link:hover{opacity:.65}.project-initial{color:#f2eee6;font-family:Georgia,serif;font-size:100px}footer{border-top:1px solid #d8d8d8;display:flex;justify-content:space-between;align-items:center;margin-top:20px;padding:26px 0 32px;font-size:11px;color:var(--muted)}footer a{font-size:13px;color:#333;letter-spacing:-.03em}@media(min-width:1500px){.project-art{height:410px}.spread{transform:perspective(900px) rotateY(-12deg) rotateZ(-9deg) scale(1.2)}}@media(max-width:700px){.shell{padding:0 24px}header{height:80px}.brand{font-size:18px}.intro{padding:42px 0 43px}h1{font-size:17vw;margin-bottom:28px;letter-spacing:-.08em}.intro-bottom p{font-size:21px}.intro-bottom .intro-aside{font-size:11px;line-height:1.65}.projects{grid-template-columns:1fr;gap:25px;padding-top:23px}.section-heading{display:flex;align-items:baseline;justify-content:space-between}.section-heading h2{margin:0}.section-heading>span{font-size:10px}.project-art{height:295px}.spread{transform:perspective(900px) rotateY(-12deg) rotateZ(-9deg) scale(.92)}.project-content h3{font-size:23px}.project-description{font-size:12px}.project{margin-bottom:35px}.project-content{padding-top:20px}.art-label{left:19px;bottom:17px;font-size:9px}footer{margin-top:8px}}@media(max-width:370px){.shell{padding:0 20px}.intro-bottom .intro-aside{font-size:10px}.intro-bottom p{font-size:19px}.project-art{height:260px}.spread{transform:rotate(-9deg) scale(.82)}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

header nav{display:flex;gap:26px}
.instagram{padding:27px 0 48px;border-top:1px solid #d8d8d8;display:grid;grid-template-columns:22% 1fr;gap:20px}
.social-intro{font-size:26px;line-height:1.5;letter-spacing:-.055em;font-weight:500;margin:0 0 30px}
.social-link{display:grid;grid-template-columns:100px 1fr 24px;align-items:center;gap:20px;padding:25px 0;border-top:1px solid #e1e1e1}
.social-topic{font-size:13px;color:var(--accent);font-weight:500}
.social-detail{display:flex;flex-direction:column;gap:8px;min-width:0}
.social-handle{font-size:21px;letter-spacing:-.035em;overflow-wrap:anywhere}
.social-description{font-size:12px;line-height:1.6;color:var(--muted);letter-spacing:-.02em}
.social-arrow{font-size:24px;color:var(--muted);justify-self:end}
.social-link:hover .social-handle,.social-link:hover .social-arrow{color:var(--accent)}
.social-link:focus-visible{outline-offset:4px}
@media(max-width:700px){header nav{gap:20px}.instagram{grid-template-columns:1fr;gap:28px;padding:23px 0 24px}.social-intro{font-size:23px;margin-bottom:25px}.social-link{grid-template-columns:65px 1fr 18px;gap:12px;padding:23px 0}.social-topic{font-size:12px}.social-handle{font-size:18px}.social-description{font-size:11px}.social-arrow{font-size:21px}}
@media(max-width:370px){header nav{gap:14px}.social-link{grid-template-columns:1fr 20px;gap:10px}.social-topic{grid-column:1}.social-detail{grid-column:1}.social-arrow{grid-column:2;grid-row:1/3}.intro-bottom{gap:12px}.intro-bottom p{font-size:18px}}
