:root{--ink:#263234;--navy:#1d2b2d;--cyan:#3b58ad;--ice:#f0ece3;--pale:#f5f1e8;--line:#777e7877;--g:clamp(24px,5vw,86px)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#eeeae2;color:var(--ink);font-family:'Noto Sans KR',sans-serif;-webkit-font-smoothing:antialiased}a{color:inherit}button{font:inherit}::selection{background:var(--cyan);color:#fff}.skip{position:fixed;top:-100px;left:10px;z-index:200;background:#fff;padding:12px}.skip:focus{top:10px}main{position:relative;z-index:1;overflow:hidden}section,footer{scroll-margin-top:70px}
.nav{height:70px;position:fixed;z-index:80;top:0;left:0;right:0;padding:0 var(--g);display:flex;align-items:center;justify-content:space-between;background:#f6f2ebe8;border-bottom:1px solid #26323430;backdrop-filter:blur(15px)}.nav__brand{text-decoration:none;font-weight:800;font-size:16px;letter-spacing:-.04em;white-space:nowrap}.nav__brand span{font:700 10px 'DM Sans',sans-serif;letter-spacing:.13em;color:#626b65}.nav__right{display:flex;align-items:center;gap:34px}.nav nav{display:flex;align-items:center;gap:25px}.nav nav a{text-decoration:none;font-size:12px;font-weight:700}.nav nav small{font:700 9px 'DM Sans';color:#3b58ad;margin-right:6px}.nav a:hover,.nav a:focus-visible{color:#2d49a0}.motion-switch,.menu-switch{border:1px solid #26323444;background:transparent;color:var(--ink);border-radius:100px;min-height:35px;padding:0 14px;cursor:pointer;font-size:11px;font-weight:700}.motion-switch:hover,.motion-switch:focus-visible,.menu-switch:hover,.menu-switch:focus-visible{background:var(--ink);color:#fff}.menu-switch{display:none}.small-menu{position:fixed;z-index:75;top:70px;left:0;right:0;padding:25px var(--g);background:#f6f2eb;box-shadow:0 20px 30px #1d2b2d22}.small-menu:not([hidden]){display:grid;gap:13px}.small-menu a{font-size:23px;font-weight:700;text-decoration:none}.small-menu small{font:700 10px 'DM Sans';margin-right:20px}
.world{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden;opacity:0;transition:opacity .35s}.world canvas{width:100%;height:100%;display:block;mask-image:linear-gradient(90deg,transparent 0%,transparent 39%,#000 64%);-webkit-mask-image:linear-gradient(90deg,transparent 0%,transparent 39%,#000 64%)}.world.is-paused{display:none}
.hero{height:145svh;position:relative;background:#ede8de;padding:70px var(--g) 0;overflow:hidden}.hero__back{position:absolute;right:-2vw;top:11svh;font:700 clamp(160px,24vw,430px)/.68 'DM Sans',sans-serif;letter-spacing:-.12em;color:#827b6c20;white-space:nowrap;text-align:right;pointer-events:none}.hero__image{position:absolute;right:6vw;top:23svh;width:min(32vw,520px);height:min(60svh,650px);background:#fff;overflow:hidden;transform-style:preserve-3d;box-shadow:25px 28px 0 #8d8a8042}.hero__image img{width:100%;height:100%;display:block;object-fit:cover;object-position:center 19%}.hero__image span{position:absolute;bottom:0;left:0;right:0;padding:13px 18px;background:#f6f2ebdc;font:700 10px 'DM Sans';letter-spacing:.12em}.hero__front{position:absolute;z-index:2;left:var(--g);top:25svh;width:61vw}.kicker,.eyebrow{font:700 11px/1.5 'DM Sans','Noto Sans KR',sans-serif;letter-spacing:.13em;color:#3b58ad}.hero h1{font-size:clamp(67px,8.7vw,155px);line-height:1.08;letter-spacing:-.096em;margin:50px 0 34px;font-weight:800;white-space:nowrap}.hero h1 em,.build h2 em{font-style:normal;color:#3b58ad}.hero__line{font-size:clamp(19px,1.7vw,25px);line-height:1.6;max-width:23ch;font-weight:600;letter-spacing:-.05em;word-break:keep-all}.hero__scroll{display:inline-flex;gap:40px;align-items:center;margin-top:53px;min-width:210px;padding:11px 0;border-bottom:1px solid var(--ink);font-size:12px;text-decoration:none;font-weight:700}.hero__scroll span{font-size:22px}.hero__foot{position:absolute;left:var(--g);right:var(--g);bottom:calc(45svh + 23px);display:flex;justify-content:space-between;border-top:1px solid #26323455;padding-top:15px;font-size:11px;color:#5a655f}
.hero__line small{font-size:13px;font-weight:500;color:#626b65}.hero__actions{display:flex;gap:30px;margin-top:43px}.hero__actions a{min-width:145px;display:flex;justify-content:space-between;gap:20px;border-bottom:1px solid var(--ink);padding:10px 0;text-decoration:none;font-size:12px;font-weight:700}.hero__actions a:hover,.hero__actions a:focus-visible{color:#2d49a0}
.chapter{position:relative;padding:115px var(--g) 130px;min-height:100svh;background:linear-gradient(90deg,#eeeae2 0%,#eeeae2 44%,#eeeae2c0 56%,#eeeae200 72%)}.section-label{display:flex;justify-content:space-between;border-top:1px solid var(--ink);padding-top:14px;font:700 10px 'DM Sans','Noto Sans KR',sans-serif;letter-spacing:.14em}.chapter h2{letter-spacing:-.09em;margin:0}.text-link{display:inline-flex;justify-content:space-between;gap:60px;min-width:185px;text-decoration:none;border-bottom:1px solid;padding:15px 0 8px;font-weight:700;font-size:13px}.text-link:hover,.text-link:focus-visible{color:#2d49a0}
.content{background:linear-gradient(105deg,#f1ece3 0%,#f1ece3 44%,#f1ece3c0 56%,#f1ece300 72%)}.content__headline{display:grid;grid-template-columns:1fr .56fr;gap:10vw;align-items:end;margin:130px 0 40px}.content__headline>p{font-size:19px;line-height:1.85;max-width:42ch;word-break:keep-all;margin:0 0 30px}.kinetic{display:flex;align-items:end;gap:30px}.kinetic span{font:700 clamp(190px,28vw,430px)/.75 'DM Sans',sans-serif;letter-spacing:-.15em;color:#263e65}.kinetic small{font:700 clamp(32px,3vw,48px)/1 'DM Sans',sans-serif;letter-spacing:-.05em;writing-mode:vertical-rl;margin-bottom:7px}.content__ruler{display:flex;max-width:1100px;border-top:1px solid var(--ink);border-bottom:1px solid var(--ink);margin:80px 0 18px}.content__ruler>div{display:flex;align-items:end;gap:16px;padding:24px 40px 24px 0}.content__ruler>div+div{border-left:1px solid var(--line);padding-left:40px}.content__ruler strong{font:700 clamp(55px,7vw,110px)/1 'DM Sans';letter-spacing:-.09em}.content__ruler span{font:700 12px 'DM Sans';margin-bottom:12px}.content__footnote{font-size:12px;color:#626b65}.works{margin:0 0 60px}.works__heading{display:flex;justify-content:space-between;padding-bottom:16px;color:#3b58ad;font:700 10px 'DM Sans';letter-spacing:.13em}
.plan{background:linear-gradient(110deg,#f4f0e8 0%,#f4f0e8 44%,#f4f0e8c0 56%,#f4f0e800 72%)}.plan__top{margin:150px 0 95px}.plan h2{font:700 clamp(90px,12vw,190px)/.98 'DM Sans',sans-serif;letter-spacing:-.10em}.plan h2 span{color:#3b58ad;font-size:.75em;padding-left:.12em}.plan__grid{display:grid;grid-template-columns:1fr .8fr;gap:8vw;align-items:start;border-top:1px solid var(--ink);padding-top:35px}.plan__grid>p{font-size:clamp(20px,2vw,30px);line-height:1.65;font-weight:600;max-width:33ch;word-break:keep-all;margin:0}.plan__grid ol{list-style:none;margin:0;padding:0}.plan__grid li{display:flex;gap:25px;padding:20px 0;border-bottom:1px solid var(--line);font-size:19px;font-weight:600}.plan__grid li b{font:700 11px 'DM Sans';color:#3b58ad;padding-top:7px}.plan__result{display:flex;align-items:center;gap:5vw;flex-wrap:wrap;margin:100px 0 0;padding:20px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.plan__result strong{font-size:20px}.plan__result p{font-size:14px}.plan__result a{font-size:13px;font-weight:700;text-decoration:none;border-bottom:1px solid;padding-bottom:7px}
.build{background:linear-gradient(110deg,#e8e4da 0%,#e8e4da 44%,#e8e4dac0 56%,#e8e4da00 72%)}.build__lead{margin:150px 0 190px}.build h2{font-size:clamp(75px,9.8vw,154px);line-height:1.1}.build__rail{display:grid;grid-template-columns:1fr 1fr;gap:5vw;border-top:1px solid var(--ink);padding-top:30px;margin-bottom:70px}.build__rail article{padding:0 0 40px}.build__rail article>span{font:700 11px 'DM Sans';letter-spacing:.12em;color:#3b58ad}.build__rail h3{font-size:clamp(38px,4.2vw,68px);letter-spacing:-.07em;margin:40px 0 25px}.build__rail p{max-width:46ch;line-height:1.8;font-size:16px}.build__rail small{display:block;font-size:11px;color:#626b65;line-height:1.7}.build__rail a{display:inline-block;text-decoration:none;font-weight:700;font-size:13px;border-bottom:1px solid;margin-top:25px;padding-bottom:10px}.build__source{width:min(680px,58%);margin:0 0 0 auto}.build__source img{display:block;width:100%;height:auto}.build__source figcaption{text-align:right;font:700 10px 'DM Sans';letter-spacing:.1em;padding-top:12px}
.people{background:linear-gradient(110deg,#f0ece4 0%,#f0ece4 44%,#f0ece4c0 56%,#f0ece400 72%)}.people__intro{display:grid;grid-template-columns:1fr .48fr;gap:8vw;align-items:end;margin:140px 0 100px}.people h2{font-size:clamp(82px,10vw,165px);line-height:1.1}.people h2 i{font-style:normal;color:#3b58ad}.people__intro p{font-size:19px;line-height:1.8;max-width:33ch;word-break:keep-all}.timeline{border-top:1px solid var(--ink);margin-bottom:50px}.timeline__row{display:grid;grid-template-columns:70px 260px 1fr;gap:35px;align-items:start;border-bottom:1px solid var(--line);padding:30px 0}.timeline__row>span{font:700 11px 'DM Sans';color:#3b58ad;padding-top:12px}.timeline__row strong{font:700 clamp(43px,5vw,74px)/1 'DM Sans';letter-spacing:-.08em}.timeline__row p{font-size:17px;line-height:1.8;max-width:58ch;margin:0}
footer{position:relative;z-index:2;background:#202c2e;color:#f6f2eb;padding:35px var(--g)}.outro__top,.outro__bottom{display:flex;justify-content:space-between;gap:30px;font:700 11px 'DM Sans','Noto Sans KR';letter-spacing:.04em}.outro__top a,.outro__bottom a{text-decoration:none}footer>p{font-size:clamp(55px,7.5vw,125px);line-height:1.3;letter-spacing:-.08em;margin:130px 0 100px;font-weight:700}.outro__mail{display:flex;justify-content:space-between;align-items:center;font-size:clamp(45px,7vw,120px);font-weight:700;letter-spacing:-.08em;text-decoration:none;border-bottom:2px solid #f6f2eb;padding-bottom:15px}.outro__bottom{margin-top:160px;border-top:1px solid #c3c6bd88;padding-top:24px;justify-content:flex-start}.outro__bottom>a{display:inline-flex;gap:9px}.outro__bottom>span{margin-left:auto}
@media(max-width:1060px){.nav nav{gap:14px}.nav__right{gap:13px}.hero__front{width:67vw}.hero h1{font-size:9vw}.timeline__row{grid-template-columns:40px 190px 1fr}}
@media(max-width:760px){.nav{height:62px}.nav nav{display:none}.nav__brand span{display:none}.menu-switch{display:block}.motion-switch{font-size:10px}.small-menu{top:62px}.world{display:none}.hero{height:auto;min-height:0;padding:62px var(--g) 0}.hero__back{top:90px;font-size:40vw;right:0}.hero__front{position:relative;top:auto;left:auto;width:100%;padding-top:90px}.kicker{font-size:9px}.hero h1{font-size:clamp(53px,12.7vw,90px);margin:30px 0 28px}.hero__line{font-size:17px;max-width:24ch}.hero__scroll{margin-top:30px}.hero__image{position:relative;right:auto;top:auto;width:min(78%,380px);height:430px;margin:65px 0 0 auto;box-shadow:13px 14px 0 #8d8a8042}.hero__foot{position:static;margin-top:40px;padding:16px 0 25px;font-size:10px}.chapter{padding:75px var(--g) 90px;min-height:0;background:#eeeae2}.section-label{font-size:9px}.content__headline,.plan__grid,.people__intro{display:block;margin:70px 0 50px}.content__headline>p,.people__intro p{font-size:15px;margin:35px 0 0}.kinetic span{font-size:44vw}.kinetic small{font-size:25px}.content__ruler{margin:45px 0 12px}.content__ruler>div{gap:8px;padding:18px 16px 18px 0}.content__ruler>div+div{padding-left:16px}.content__ruler strong{font-size:70px}.content__ruler span{font-size:9px;margin-bottom:5px}.plan{background:#f4f0e8}.plan__top{margin:75px 0 60px}.plan h2{font-size:clamp(66px,15vw,115px)}.plan__grid>p{font-size:20px;margin-bottom:35px}.plan__grid li{font-size:15px}.plan__result{margin-top:70px;display:block}.plan__result p{line-height:1.7}.build{background:#e8e4da}.build__lead{margin:75px 0 100px}.build h2{font-size:clamp(58px,12vw,95px)}.build__rail{display:block}.build__rail article+article{border-top:1px solid var(--line);padding-top:30px}.build__rail h3{font-size:40px;margin:25px 0}.build__rail p{font-size:15px}.build__source{width:100%}.people{background:#f0ece4}.people__intro{margin:75px 0 60px}.people h2{font-size:clamp(62px,13vw,110px)}.timeline__row{grid-template-columns:35px 1fr;gap:12px;padding:23px 0}.timeline__row strong{font-size:43px}.timeline__row p{grid-column:2;font-size:14px}.outro__top{font-size:10px}footer>p{font-size:clamp(45px,10vw,80px);margin:110px 0 100px}.outro__mail{font-size:clamp(35px,9vw,65px)}.outro__bottom{margin-top:130px;flex-wrap:wrap}.outro__bottom>span{margin-left:0;width:100%}}
@media(max-width:390px){.nav__brand{font-size:14px}.motion-switch{padding:0 9px}.menu-switch{padding:0 9px}.hero h1{font-size:12.2vw}.kinetic span{font-size:40vw}.content__ruler strong{font-size:58px}.outro__mail{font-size:8.5vw}}
.plan__grid{background:#f4f0e8}.build__rail{background:#e8e4da}.timeline{background:#f0ece4}
.works{background:#f1ece3}
.motion-switch,.menu-switch{min-height:44px}.hero__actions a,.text-link{min-height:44px;align-items:center}
.outro__address{display:inline-block;margin-top:24px;color:#c8d1e1;text-decoration:none;font:500 clamp(19px,2vw,30px) 'DM Sans',sans-serif;border-bottom:1px solid #c8d1e1;padding-bottom:5px}.outro__address:hover,.outro__address:focus-visible{color:#fff}.outro__bottom{margin-top:130px}
.world.fallback{display:none}
.plan__result{background:#f4f0e8;position:relative;z-index:2}.people__intro p{background:#f0ece4;position:relative;z-index:2}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.world{display:none}.motion-target,.hero__back,.hero__front{transform:none!important;opacity:1!important}}html.motion-off{scroll-behavior:auto}html.motion-off .world{display:none}html.motion-off .motion-target,html.motion-off .hero__back,html.motion-off .hero__front{transform:none!important;opacity:1!important}
/* The index keeps every post readable and in its original format. */
.content-gallery{scroll-margin-top:84px;margin:105px 0 60px;background:#f1ece3;position:relative;z-index:1}
.content-filters{display:flex;flex-wrap:wrap;gap:8px;margin:20px 0 34px}
.content-filters button{appearance:none;border:1px solid #9b9c95;border-radius:100px;background:transparent;color:var(--ink);padding:12px 18px;font:700 13px 'DM Sans','Noto Sans KR',sans-serif;cursor:pointer;min-height:44px}
.content-filters button.active{background:#263438;border-color:#263438;color:#f8f3e9}
.content-filters button:hover:not(.active),.content-filters button:focus-visible{border-color:#3b58ad;color:#3b58ad}
.content-filters small{font-size:10px;margin-left:7px;opacity:.7}
.media-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.media-card{min-width:0;background:#f7f3ec;border:1px solid #c8c6bd;display:flex;flex-direction:column}
.media-card__top{display:flex;justify-content:space-between;gap:8px;padding:13px 14px;font:700 10px 'DM Sans','Noto Sans KR',sans-serif;letter-spacing:.05em;color:#3b58ad}
.media-card__frame{position:relative;overflow:hidden;background:#e6e1d7;aspect-ratio:1/1.2}
.media-card__frame:before{content:'INSTAGRAM / 원본 미리보기';position:absolute;inset:0;display:grid;place-items:center;color:#737c78;font:700 11px 'DM Sans','Noto Sans KR',sans-serif;letter-spacing:.1em}
.media-card__frame iframe{position:relative;width:100%;height:100%;border:0;background:transparent}
.media-card__bottom{padding:16px 14px 18px;display:flex;flex-direction:column;gap:18px;flex:1}
.media-card__bottom h3{margin:0 0 5px;font-size:17px;letter-spacing:-.035em;line-height:1.35}
.media-card__bottom p{font-size:11px;color:#68716c;margin:0}
.media-card__bottom a{font-size:12px;font-weight:700;text-decoration:none;display:flex;justify-content:space-between;border-top:1px solid #b4b6ae;padding-top:12px;min-height:36px;margin-top:auto}
.media-card__bottom a:hover,.media-card__bottom a:focus-visible{color:#3b58ad}
.gallery-pages{display:flex;justify-content:space-between;align-items:center;gap:12px;border-top:1px solid #a4a8a2;margin-top:35px;padding-top:18px;font:700 12px 'DM Sans','Noto Sans KR',sans-serif}
.gallery-pages>div{display:flex;gap:8px}.gallery-pages button{border:1px solid #8c9896;background:transparent;color:var(--ink);cursor:pointer;min-height:44px;padding:0 15px;font:700 12px 'DM Sans','Noto Sans KR',sans-serif}.gallery-pages button:disabled{opacity:.35;cursor:default}.gallery-pages button:hover:not(:disabled),.gallery-pages button:focus-visible{background:#263438;color:#fff}
@media(max-width:1060px){.media-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){.content-gallery{margin:75px 0 45px;scroll-margin-top:72px}.media-grid{grid-template-columns:1fr;max-width:470px}.media-card__frame{aspect-ratio:1/1.15}.gallery-pages{align-items:flex-start}.gallery-pages>div{flex-wrap:wrap;justify-content:flex-end}.content-filters button{font-size:12px;padding:10px 13px}}
/* Short cinematic entry and one-time reveals, adapted to the portfolio's own work. */
.nav::after{content:'';position:absolute;left:0;bottom:-1px;width:var(--page-progress,0%);height:2px;background:#3b58ad;pointer-events:none}
.nav nav a{position:relative;padding:24px 0}.nav nav a::after{content:'';position:absolute;left:0;right:100%;bottom:16px;height:1px;background:#3b58ad;transition:right .25s ease}.nav nav a:hover::after,.nav nav a:focus-visible::after,.nav nav a[aria-current]::after{right:0}.nav nav a[aria-current]{color:#3b58ad}
.intro{position:fixed;inset:0;z-index:150;background:#202c2e;color:#f4efe5;overflow:hidden;animation:intro-out .58s 1.82s cubic-bezier(.76,0,.24,1) forwards}
.intro__index,.intro__foot{position:absolute;left:var(--g);font:700 10px 'DM Sans','Noto Sans KR',sans-serif;letter-spacing:.16em;color:#d5d6c9}.intro__index{top:35px}.intro__foot{bottom:35px}
.intro__center{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;padding:6vh var(--g)}.intro__center>span{font:700 11px 'DM Sans','Noto Sans KR',sans-serif;letter-spacing:.19em;color:#c8d2c9;animation:intro-label .75s .23s both}.intro__center strong{font:800 clamp(62px,11.8vw,180px)/.93 'DM Sans','Noto Sans KR',sans-serif;letter-spacing:-.095em;margin-top:28px;animation:intro-title 1.1s .35s both}.intro__center em{font-style:normal;color:#91a5dc}
.intro button{position:absolute;right:var(--g);top:27px;display:flex;gap:25px;align-items:center;border:0;border-bottom:1px solid #d9dfd4;background:transparent;color:#f4efe5;min-height:44px;padding:0 0 7px;cursor:pointer;font:700 11px 'DM Sans','Noto Sans KR',sans-serif;z-index:2}.intro button:hover,.intro button:focus-visible{color:#b8caff;border-color:#b8caff}
@keyframes intro-title{from{opacity:0;filter:blur(14px);transform:translateY(30px) scale(.97)}to{opacity:1;filter:blur(0);transform:translateY(0) scale(1)}}
@keyframes intro-label{from{opacity:0;transform:translateY(15px)}to{opacity:1;transform:translateY(0)}}
@keyframes intro-out{from{clip-path:inset(0 0 0 0)}to{clip-path:inset(0 0 100% 0)}}
.hero__foot{gap:25px;align-items:center}.hero__foot a,.hero__foot button{font-size:11px;font-weight:700;color:var(--ink);text-decoration:none;background:transparent;border:0;border-bottom:1px solid transparent;padding:6px 0;cursor:pointer;min-height:33px;white-space:nowrap}.hero__foot small{color:#3b58ad;font:700 9px 'DM Sans';margin-right:8px}.hero__foot a:hover,.hero__foot a:focus-visible,.hero__foot button:hover,.hero__foot button:focus-visible{border-bottom-color:#3b58ad;color:#3b58ad}
.reveal-ready .chapter .motion-target:not(.is-shown){opacity:0;transform:translateY(36px)}.reveal-ready .chapter .motion-target{transition:opacity .72s ease,transform .72s cubic-bezier(.19,1,.22,1);transition-delay:var(--reveal-delay,0ms)}
.media-card{transition:border-color .2s ease}.media-card:hover,.media-card:focus-within{border-color:#3b58ad}.media-card__bottom a span[aria-hidden]{transition:transform .2s ease}.media-card__bottom a:hover span[aria-hidden],.media-card__bottom a:focus-visible span[aria-hidden]{transform:translate(2px,-2px)}
@media(max-width:760px){.intro__center strong{font-size:clamp(52px,12.5vw,94px)}.intro__index{top:24px}.intro__foot{bottom:22px}.intro button{top:auto;right:var(--g);bottom:20px}.intro__foot{max-width:48%}.hero__foot{display:grid;grid-template-columns:repeat(3,1fr);gap:5px 12px}.hero__foot a{font-size:11px}.hero__foot button{grid-column:1/-1;justify-self:start}.small-menu:not([hidden]){display:flex;flex-direction:column;gap:0;height:calc(100dvh - 62px);overflow:auto;animation:menu-in .3s ease-out both}.small-menu{background:#202c2e;color:#f3eee5;padding:34px var(--g)}.small-menu__label{font:700 10px 'DM Sans';letter-spacing:.16em;color:#b8caff;margin-bottom:28px}.small-menu a{display:flex;align-items:baseline;border-top:1px solid #ffffff55;padding:17px 0;font-size:clamp(29px,8vw,44px);letter-spacing:-.07em}.small-menu a:last-of-type{border-bottom:1px solid #ffffff55}.small-menu a span{margin-left:auto;font-size:19px}.small-menu a:focus-visible,.small-menu a:hover{color:#b8caff}.small-menu small{color:#b8caff}.small-menu p{margin-top:auto;font-size:11px;color:#cbd2cb}}
@keyframes menu-in{from{opacity:0;transform:translateY(-12px)}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){.intro{display:none!important}.reveal-ready .chapter .motion-target{opacity:1!important;transform:none!important;transition:none!important}.small-menu:not([hidden]){animation:none}}
html.motion-off .intro{display:none!important}html.motion-off .reveal-ready .chapter .motion-target{opacity:1!important;transform:none!important;transition:none!important}
@media(prefers-reduced-motion:reduce){.hero__foot button{display:none}}
html.motion-off .hero__foot button{display:none}
/* Keep the optional introduction under two seconds. */
.intro{animation-duration:.48s;animation-delay:1.54s}
@media(min-width:761px) and (max-height:900px){.hero__front{top:20svh}.hero h1{font-size:clamp(70px,7vw,120px);margin:30px 0 22px}.hero__line{font-size:19px;line-height:1.45}.hero__actions{margin-top:22px}.hero__image{top:20svh;height:min(58svh,580px)}}
/* Quiet pointer depth on the portrait; the reading surface stays still. */
.hero__tilt{position:relative;width:100%;height:100%;transform-style:preserve-3d;transition:transform .24s ease-out;will-change:transform}
.hero__tilt::after{content:'';position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at var(--glow-x,50%) var(--glow-y,50%),#ffffff3b,transparent 53%);mix-blend-mode:screen}
@media(hover:none),(pointer:coarse){.hero__tilt{transform:none!important}.hero__tilt::after{display:none}}
@media(prefers-reduced-motion:reduce){.hero__tilt{transform:none!important;transition:none!important}.hero__tilt::after{display:none}}
html.motion-off .hero__tilt{transform:none!important;transition:none!important}html.motion-off .hero__tilt::after{display:none}
/* In-page source viewer. All 38 posts retain their original links. */
.media-card__actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:auto}
.media-card__actions button,.media-card__actions a{display:flex;align-items:center;justify-content:space-between;gap:6px;min-width:0;min-height:44px;margin:0;padding:8px 10px;border:1px solid #aeb3ad;background:transparent;color:var(--ink);cursor:pointer;text-decoration:none;font:700 11px 'DM Sans','Noto Sans KR',sans-serif}
.media-card__actions button{background:#263438;color:#f7f3ec;border-color:#263438}.media-card__actions a{border-top:1px solid #aeb3ad}
.media-card__actions button:hover,.media-card__actions button:focus-visible,.media-card__actions button:active{background:#3b58ad;border-color:#3b58ad;color:#fff}
.media-card__actions a:hover,.media-card__actions a:focus-visible,.media-card__actions a:active{border-color:#3b58ad;color:#3b58ad;background:#edf0f7}
.media-card__actions button span,.media-card__actions a span{font-size:17px;font-weight:400;line-height:1}
.media-viewer-backdrop{position:fixed;inset:0;z-index:220;display:grid;place-items:center;padding:24px;background:#172223d9;backdrop-filter:blur(8px)}
.media-viewer{width:min(1120px,100%);max-height:calc(100dvh - 48px);overflow:auto;background:#f2eee6;color:#263234;box-shadow:0 35px 80px #0c1519a8}
.media-viewer__top,.media-viewer__nav{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:15px 24px;border-bottom:1px solid #aab0a9;font:700 11px 'DM Sans','Noto Sans KR',sans-serif;letter-spacing:.08em}
.media-viewer__top{position:sticky;top:0;background:#f2eee6;z-index:2}.media-viewer__top button{border:0;background:transparent;color:#263234;display:flex;align-items:center;gap:25px;min-height:44px;cursor:pointer;font-weight:700}.media-viewer__top button span{font-size:25px;line-height:1}
.media-viewer__body{display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,470px);gap:5vw;padding:30px 24px 24px;align-items:start}
.media-viewer__info{padding:26px 10px 10px 0}.media-viewer__info h2{font-size:clamp(42px,5.2vw,80px);line-height:1.1;letter-spacing:-.075em;margin:28px 0 30px}.media-viewer__info h2 em{font-style:normal;color:#3b58ad}.media-viewer__info p{font-size:17px;line-height:1.7;max-width:34ch;word-break:keep-all}.media-viewer__info a{display:inline-flex;align-items:center;justify-content:space-between;gap:40px;min-height:44px;border-bottom:1px solid #263234;margin-top:32px;text-decoration:none;font-size:13px;font-weight:700}.media-viewer__info a:hover,.media-viewer__info a:focus-visible{color:#3b58ad}
.media-viewer__embed{height:min(70dvh,680px);min-height:420px;overflow:hidden;background:#e5e0d6}.media-viewer__embed iframe{display:block;width:100%;height:100%;border:0}
.media-viewer__nav{position:sticky;bottom:0;border-top:1px solid #aab0a9;border-bottom:0;background:#f2eee6;z-index:2}.media-viewer__nav button{min-height:44px;border:1px solid #8c9896;background:transparent;color:#263234;padding:0 16px;cursor:pointer;font-size:12px;font-weight:700;letter-spacing:0}.media-viewer__nav button:hover:not(:disabled),.media-viewer__nav button:focus-visible{background:#263438;color:#fff}.media-viewer__nav button:active:not(:disabled){background:#3b58ad}.media-viewer__nav button:disabled{opacity:.35;cursor:default}
@media(max-width:760px){.media-viewer-backdrop{padding:0;display:block;backdrop-filter:none}.media-viewer{width:100%;max-height:100dvh;min-height:100dvh}.media-viewer__top,.media-viewer__nav{padding:10px 18px}.media-viewer__body{display:block;padding:10px 18px 18px}.media-viewer__info{padding:10px 0 20px}.media-viewer__info h2{font-size:40px;margin:10px 0 12px}.media-viewer__info p{font-size:14px;margin:0}.media-viewer__info a{margin-top:10px;font-size:12px}.media-viewer__embed{height:min(57dvh,600px);min-height:330px}.media-viewer__nav{padding-bottom:max(10px,env(safe-area-inset-bottom))}.media-viewer__nav button{padding:0 10px}}
@media(max-width:360px){.media-card__actions button,.media-card__actions a{font-size:10px;padding:8px}.media-viewer__info h2{font-size:35px}}
