@font-face{font-family:Maru;src:url('assets/fonts/MaruBuri-Light.woff2') format('woff2');font-weight:300;font-display:swap}
@font-face{font-family:Pretendard;src:url('assets/fonts/PretendardVariable.woff2') format('woff2');font-weight:100 900;font-display:swap}
:root{--paper:#e9e4dc;--ink:#342c25;--white:#f8f5ef;--edge:clamp(24px,4.6vw,76px)}
*{box-sizing:border-box}[hidden]{display:none!important}html{background:var(--paper)}body{margin:0;color:var(--white);font-family:Pretendard,sans-serif;-webkit-font-smoothing:antialiased}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}a{color:inherit;text-decoration:none}button{color:inherit}button:focus-visible,a:focus-visible{outline:2px solid currentColor;outline-offset:6px}button:disabled{cursor:wait}::selection{background:#c9baa5;color:var(--ink)}
.skip-link{position:fixed;left:20px;top:-80px;z-index:20;background:var(--paper);color:var(--ink);padding:16px}.skip-link:focus{top:20px}
.header{position:fixed;z-index:5;left:0;right:0;top:0;display:flex;align-items:center;justify-content:space-between;padding:30px var(--edge);gap:24px;pointer-events:none}.header>*{pointer-events:auto}.wordmark{min-height:44px;display:flex;flex-direction:column;justify-content:center;font-family:Georgia,serif;font-size:29px;letter-spacing:.06em;line-height:1}.wordmark span{display:block;font-family:Pretendard,sans-serif;font-size:8px;font-weight:400;letter-spacing:.17em;margin-top:11px}.header-note{font-family:Georgia,serif;font-size:15px;letter-spacing:.03em;font-style:italic;position:absolute;left:50%;transform:translateX(-50%);margin:0}.header-actions{display:flex;align-items:center;gap:25px}.mode-button{min-height:44px;border:0;background:transparent;padding:14px 2px;font-size:12px}.room-button{border:1px solid #f8f5ef65;background:#f8f5ef12;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;gap:28px;padding:14px 22px;font-size:12px;min-height:45px;transition:background .3s,color .3s,box-shadow .3s}.room-button:hover{background:var(--paper);color:var(--ink);box-shadow:0 0 28px #fff4}.room-button span{font-size:16px}.scroll-track{height:850svh;position:relative}.stage{position:sticky;top:0;width:100%;height:100svh;overflow:hidden;background:#b4b1a6}.poster,#film{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}#film{opacity:0;transition:opacity .4s}.stage.is-loaded #film{opacity:1}.shade{position:absolute;inset:0;background:linear-gradient(0deg,#17201ce8 0%,#17201c87 20%,#17201c00 65%),linear-gradient(180deg,#17201c80,#17201c00 24%),linear-gradient(90deg,#17201c50 0%,#17201c2b 40%,#17201c00 72%);pointer-events:none}
.scene-copy{position:absolute;left:var(--edge);bottom:132px;max-width:calc(100% - var(--edge)*2 - 110px);opacity:0;transform:translateY(16px);filter:blur(5px);transition:opacity .45s,transform .65s,filter .65s;pointer-events:none}.scene-copy.is-current{opacity:1;transform:translateY(0);filter:blur(0);pointer-events:auto}.eyebrow{font-size:10px;letter-spacing:.2em;font-weight:400;margin:0 0 26px}.hero-name{font-family:Georgia,serif;font-weight:400;font-size:clamp(112px,17vw,264px);line-height:.79;letter-spacing:-.066em;margin:0 0 25px -.025em}.hero-line{font:300 clamp(24px,2.65vw,39px)/1.45 Maru,serif;letter-spacing:-.045em;margin:0 0 14px}.caption{font-size:13px;line-height:1.8;letter-spacing:-.01em;color:#f8f5efc2;margin:0;word-break:keep-all}.scene-copy h2{font:300 clamp(36px,4.8vw,76px)/1.35 Maru,serif;letter-spacing:-.055em;margin:0 0 22px;word-break:keep-all}.ending-actions{display:flex;gap:15px;align-items:center;flex-wrap:wrap;margin-top:30px}.ending-actions .room-button{background:var(--paper);color:var(--ink);border-color:var(--paper);padding:16px 25px;font-size:13px}.restart-button{background:transparent;border:1px solid #f8f5ef50;border-radius:999px;padding:16px 24px;font-size:12px;min-height:49px}.restart-button span{margin-left:20px;font-size:16px}.restart-button:hover{background:#f8f5ef20}
.journey-bottom{position:absolute;bottom:35px;left:var(--edge);right:var(--edge);display:flex;align-items:center;justify-content:space-between;gap:20px}.continue-button{border:0;background:transparent;padding:4px 0;display:flex;align-items:center;gap:14px;font-size:10px;letter-spacing:.06em;min-height:44px}.down-arrow{border:1px solid #f8f5ef60;border-radius:50%;width:36px;height:36px;display:grid;place-items:center;font-size:17px}.continue-button:hover .down-arrow{background:#f8f5ef20}.concept-note{font-size:8px;letter-spacing:.14em;color:#f8f5efb0;line-height:1.5;margin:0}.chapters{position:absolute;right:var(--edge);bottom:140px;display:flex;flex-direction:column;align-items:flex-end;gap:4px}.chapters a{min-width:44px;min-height:35px;display:flex;flex-direction:row-reverse;align-items:center;justify-content:flex-start;gap:12px;position:relative}.chapter-dot{width:5px;height:5px;border-radius:50%;background:#f8f5ef66;transition:box-shadow .3s,background .3s}.chapter-name{font-size:10px;opacity:0;transform:translateX(5px);transition:opacity .25s,transform .25s}.chapters a:hover .chapter-name,.chapters a:focus-visible .chapter-name,.chapters a[aria-current] .chapter-name{opacity:1;transform:translateX(0)}.chapters a[aria-current] .chapter-dot{background:var(--white);box-shadow:0 0 0 5px #f8f5ef20}.chapter-count{display:flex;gap:10px;font:24px/1 Georgia,serif;margin-top:20px}.chapter-total{font-size:12px;opacity:.5;align-self:flex-end}.progress{position:absolute;bottom:0;height:2px;width:100%;background:#ffffff10}.progress span{display:block;width:100%;height:100%;background:#eee6d5;transform:scaleX(0);transform-origin:0 50%}.loading{position:absolute;top:48%;left:50%;transform:translate(-50%,-50%);font-size:11px;letter-spacing:.08em;padding:12px 20px;border-radius:99px;background:#1f292d7a;transition:opacity .3s;display:flex;gap:12px;align-items:center}.loading span{width:12px;height:12px;border:1px solid #fff4;border-top-color:white;border-radius:50%;animation:spin 1s linear infinite}.is-loaded .loading{opacity:0;pointer-events:none}@keyframes spin{to{transform:rotate(360deg)}}.media-error{position:absolute;top:112px;left:var(--edge);font-size:12px;background:var(--paper);color:var(--ink);padding:12px;border-radius:4px;max-width:calc(100% - var(--edge)*2)}
dialog{border:0;padding:88px var(--edge) 45px;background:var(--paper);color:var(--ink);width:100vw;max-width:none;height:100svh;max-height:none;margin:0;overflow-y:auto;overscroll-behavior:contain}dialog::backdrop{background:#252a23b3}.close-dialog{position:fixed;z-index:2;top:25px;right:var(--edge);background:#e9e4dcf2;border:1px solid #342c2533;border-radius:99px;padding:12px 20px;min-height:44px;font-size:12px}.close-dialog span{font-size:22px;margin-left:25px;vertical-align:middle}.detail-intro{display:grid;grid-template-columns:1fr 1fr;gap:16px 60px;align-items:end;max-width:1180px;margin:25px auto 50px}.detail-intro .eyebrow{grid-column:1/-1;margin-bottom:12px}.detail-intro h2{font:300 clamp(35px,4vw,60px)/1.45 Maru,serif;letter-spacing:-.06em;margin:0}.detail-intro>p:last-child{font-size:14px;line-height:2;color:#655c52;word-break:keep-all;margin:0 0 8px}figure{margin:0 auto 55px;max-width:1180px}figure img{width:100%;height:auto;display:block}figcaption{display:flex;justify-content:space-between;font-size:10px;letter-spacing:.16em;margin-top:18px}figcaption span{letter-spacing:0;color:#746c61;font-size:12px}.detail-terrace{width:72%;margin-left:auto;margin-right:0}.detail-footer{display:flex;justify-content:space-between;align-items:center;gap:24px;max-width:1180px;margin:55px auto 0}.detail-footer p{font-size:11px;line-height:1.8;color:#746c61;word-break:keep-all}.return-button{border:1px solid #342c2533;border-radius:99px;padding:16px 22px;background:transparent;white-space:nowrap;font-size:12px}.return-button span{margin-left:25px}.no-script{color:var(--ink);padding:40px}.no-script img{max-width:100%}
body.scene-mode .scroll-track{height:100svh}body.scene-mode .stage{position:relative}body.scene-mode .mode-button{opacity:.7}body.scene-mode .scene-copy{transition:opacity .3s,transform .3s,filter .3s}
/* The eight-second Flow study has its own route and the same native scroll controls. */
body.flow-film .scroll-track{height:550svh}
body.flow-film.scene-mode .scroll-track{height:100svh}
body.flow-film .shade{background:linear-gradient(0deg,#17201cd4 0%,#17201c65 24%,#17201c00 65%),linear-gradient(180deg,#17201c75,#17201c00 24%),linear-gradient(90deg,#17201c30,#17201c00 65%)}
body.flow-film .hero-name{font-size:clamp(110px,14vw,220px)}
body.flow-film .scene-copy h2{font-size:clamp(36px,4.3vw,66px)}
@media(min-width:1800px){.scene-copy{bottom:18vh}.chapters{bottom:18vh}}
@media(max-width:800px){.header-note{display:none}.header{padding-top:24px}.wordmark{font-size:25px}.header-actions{gap:16px}.room-button{gap:15px;padding:12px 18px}.mode-button{font-size:11px}.scene-copy{bottom:170px;max-width:calc(100% - var(--edge)*2)}.chapters{left:var(--edge);right:var(--edge);bottom:91px;flex-direction:row;align-items:center;gap:7px}.chapters a{min-width:44px;min-height:44px;flex-direction:column;justify-content:center;gap:8px}.chapter-name{font-size:9px;transform:none;opacity:.6}.chapters a[aria-current] .chapter-name{opacity:1}.chapter-count{margin:0 0 0 auto;font-size:22px}.concept-note{font-size:7px;max-width:160px;text-align:right}.journey-bottom{bottom:23px}.scene-copy h2{font-size:clamp(36px,6.8vw,55px)}.detail-terrace{width:100%}}
@media(max-width:480px){.header{gap:10px;padding-top:21px}.wordmark{font-size:23px}.wordmark span{font-size:6px;letter-spacing:.1em;margin-top:8px}.header-actions{gap:12px}.mode-button{font-size:10px;max-width:64px;line-height:1.6;padding:8px 0}.header-actions .room-button{padding:11px 16px;gap:12px;font-size:11px}.hero-name{font-size:clamp(100px,28vw,134px);margin-bottom:20px}.hero-line{font-size:26px}.eyebrow{font-size:9px;margin-bottom:24px}.caption{font-size:12px;max-width:260px}.ending-actions{gap:10px;margin-top:25px}.ending-actions .room-button{padding:13px 20px;font-size:12px}.restart-button{padding:13px 18px;font-size:11px}.restart-button span{margin-left:10px}.scene-copy h2{font-size:39px;line-height:1.45;margin-bottom:16px}.scene-copy{bottom:178px}.journey-bottom{align-items:center;gap:12px}.continue-button{font-size:9px;gap:10px}.concept-note{max-width:116px;font-size:6px}.chapters{gap:4px}.chapters a{min-width:42px}.chapter-count{font-size:19px;gap:7px}.chapter-total{font-size:10px}.detail-intro{display:block;margin:15px 0 32px}.detail-intro h2{font-size:36px;margin:22px 0}.detail-intro>p:last-child{font-size:13px}.close-dialog{top:20px}.detail-footer{display:block;margin-top:36px}.detail-footer p{margin-bottom:25px}dialog{padding-top:88px}figure{margin-bottom:35px}figcaption{font-size:9px;gap:20px}figcaption span{font-size:11px}}
@media(max-width:350px){:root{--edge:20px}.header-actions{gap:9px}.mode-button{max-width:52px}.header-actions .room-button{padding:10px 12px}.hero-line{font-size:24px}.scene-copy h2{font-size:34px}.scene-copy{bottom:159px}.eyebrow{margin-bottom:18px}.chapters{bottom:83px;gap:1px}.chapters a{min-width:39px}.chapter-count{font-size:17px}.concept-note{display:none}.ending-actions{gap:8px}.ending-actions .room-button,.restart-button{padding:12px 15px;min-height:44px}.scene-copy .caption{font-size:11px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}.scene-copy{filter:none;transform:none}.loading span{border-color:currentColor}}

/* Full photographic journey uses 24 seconds of separately reviewed motion. */
body.journey-film .scroll-track{height:850svh}
body.journey-film.scene-mode .scroll-track{height:100svh}
body.journey-film .chapters a{min-width:44px;min-height:44px}
body.journey-film .caption{color:#f8f5efe6}