*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html,body{height:100%}body{background:#efefef;font-family:Inter,sans-serif;color:#1a1a1a;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}button,canvas{display:block}button{font:inherit;cursor:pointer}#app{position:relative;height:100vh;overflow:hidden;-webkit-user-select:none;user-select:none}.info-panel{-webkit-user-select:text;user-select:text}#viewer-stage{position:fixed;inset:0;z-index:0;background:linear-gradient(180deg,var(--bg-top, #e9e9e9),var(--bg-bottom, #dcdcdc))}#viewer-canvas{width:100%;height:100%}.page-layout{transition:opacity .7s ease}#app.is-onboarding .page-layout{opacity:0;pointer-events:none}#app.is-onboarding .viewer-loading{opacity:0;visibility:hidden}.viewer-loading{position:absolute;top:52%;left:64%;z-index:1;width:min(28rem,34vw);min-width:18rem;color:#1a1a1a;pointer-events:none;transform:translate(-50%,-50%);opacity:1;visibility:visible;transition:opacity .45s ease,transform .45s ease,visibility 0s linear 0s}#app.is-loaded .viewer-loading{opacity:0;visibility:hidden;transform:translate(-50%,calc(-50% + .75rem));transition:opacity .45s ease,transform .45s ease,visibility 0s linear .45s}.loading-orbit{position:relative;width:4.5rem;height:4.5rem;margin-bottom:1.15rem;border:1px solid rgba(0,0,0,.12);border-radius:50%}.loading-orbit:before{content:"";position:absolute;inset:-1px;border:1px solid transparent;border-top-color:#1a1a1a;border-right-color:#1a1a1a66;border-radius:inherit;animation:loading-spin 1.2s linear infinite}.loading-orbit:after{content:"";position:absolute;inset:1.55rem;border:1px solid rgba(0,0,0,.16);border-radius:inherit}.loading-orbit span{position:absolute;left:50%;top:50%;width:.42rem;height:.42rem;border-radius:50%;background:#1a1a1a;transform:translate(-50%,-50%)}.loading-copy{margin-bottom:1.2rem}.loading-title{font-family:"Libertinus Serif Display",system-ui;font-size:clamp(1.65rem,3.2vw,2.6rem);font-weight:400;line-height:1;letter-spacing:-.04em;color:#0a0a0a}.loading-message{max-width:23rem;margin-top:.55rem;color:#666;font-size:.82rem;line-height:1.65}.progress-row{display:flex;align-items:center;gap:.8rem;width:100%}.progress-shell{flex:1;min-width:0}.progress-track{width:100%;height:2px;overflow:hidden;border-radius:999px;background:#0000001a}.progress-fill{width:0;height:100%;border-radius:inherit;background:#1a1a1a;transform:translate(0);transition:width .18s ease}.progress-shell[data-mode=indeterminate] .progress-fill{width:45%!important;animation:loading-progress 1.35s ease-in-out infinite}.progress-value{width:3.2rem;color:#555;font-size:.72rem;letter-spacing:.08em;text-align:right}.loading-error{margin-top:1rem;color:#8a1f1f;font-size:.78rem;line-height:1.6}.page-layout{position:relative;z-index:1;height:100vh;display:grid;grid-template-rows:auto 1fr;pointer-events:none}.col-line{position:fixed;top:0;bottom:0;width:1px;background:#0000001a;pointer-events:none;z-index:10}.col-line--left{left:5.5rem}.col-line--right{right:6.5rem}.topbar{pointer-events:auto;display:flex;align-items:center;justify-content:space-between;padding:1.1rem 7.5rem;border-bottom:1px solid rgba(0,0,0,.1);background:#efefefb8;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}.brand{font-family:"Libertinus Serif Display",system-ui;font-size:1.5rem;font-weight:700;letter-spacing:.15em;color:#1a1a1a;-webkit-user-select:none;user-select:none}.topnav{display:flex;align-items:center;gap:1rem}.nav-link{text-decoration:none;color:#2a2a2a;font-size:.88rem;letter-spacing:.03em;padding:.3rem .9rem;border-radius:999px;background:transparent;box-shadow:0 0 #0000;transition:opacity .2s ease,background .3s ease,box-shadow .3s ease;position:relative}.nav-link:after{content:"";position:absolute;left:0;right:0;bottom:-.35rem;height:1px;background:#2a2a2a;transform:scaleX(0);transform-origin:left;transition:transform .2s ease}.nav-link:hover:after,.nav-link:focus-visible:after{transform:scaleX(1)}.hero{pointer-events:auto;padding:2.8rem 6.5rem;display:flex;align-items:flex-start}.hero-inner{display:flex;flex-direction:column;max-width:42rem}.year-badge{display:inline-flex;align-items:center;font-size:.75rem;letter-spacing:.06em;color:#555;padding:.28rem .85rem;border:1px solid rgba(0,0,0,.22);border-radius:999px;width:fit-content;margin-bottom:.9rem;background:#fff}.hero-title{font-family:"Libertinus Serif Display",system-ui;font-size:60px;font-weight:400;line-height:1;letter-spacing:-.05em;color:#0a0a0a;margin-bottom:1.1rem}.hero-desc{font-size:.85rem;line-height:1.65;color:#666;max-width:30rem}.start-hint{position:fixed;bottom:15rem;right:22rem;display:flex;flex-direction:column;align-items:center;gap:.3rem;pointer-events:auto;background:transparent;border:none;color:inherit;z-index:5}.click-icon{animation:float 3s ease-in-out infinite}.start-label{font-size:.78rem;letter-spacing:.04em;color:#555}.nav-link.active{background:#fff;box-shadow:0 1px 6px #0000001a}.nav-link.active:after{display:none}.hero,.start-hint{transition:opacity .35s ease}#app.view-explorer .hero,#app.view-explorer .start-hint{opacity:0;pointer-events:none}.explorer-overlay{position:fixed;inset:0;z-index:2;pointer-events:none;opacity:0;visibility:hidden;transition:opacity .35s ease,visibility .35s ease}#app.view-explorer .explorer-overlay{opacity:1;visibility:visible}.blabel{position:fixed;pointer-events:none;z-index:3}.blabel-text{font-size:.8rem;color:#2a2a2a;letter-spacing:.02em;line-height:1.4;white-space:nowrap;background:beige;padding:.2rem .5rem;border-radius:1rem;box-shadow:0 1px 6px #0000001a}.blabel-inner{display:flex;flex-direction:column;align-items:center;transform:translate(-50%,-100%)}.blabel-line{width:1px;height:100px;background:beige;margin-left:2px;box-shadow:0 1px 6px #0000001a}.blabel--d .blabel-text,.blabel--nha-thi-dau .blabel-text{margin-left:.4rem;padding-bottom:1px}.explorer-hint{position:absolute;bottom:10%;left:24%;display:flex;flex-direction:column;align-items:center;gap:.45rem;text-align:center;font-size:.78rem;color:#555;line-height:1.5;letter-spacing:.02em}.zoom-controls{position:absolute;right:8.5rem;top:50%;transform:translate(50%,-50%);display:flex;flex-direction:column;gap:.5rem;pointer-events:auto}.zoom-btn{width:44px;height:44px;border-radius:50%;border:1px solid rgba(0,0,0,.1);background:#fff;box-shadow:0 2px 10px #0000001a;font-size:1.3rem;line-height:1;display:flex;align-items:center;justify-content:center;color:#2a2a2a;transition:box-shadow .15s ease,transform .15s ease}.zoom-btn:hover{box-shadow:0 4px 14px #00000026;transform:scale(1.06)}.zoom-btn--icon{font-size:1rem}.info-panel{position:fixed;top:0;right:0;bottom:0;width:min(680px,90vw);background:#f5f5f5;z-index:30;transform:translate(100%);transition:transform .44s cubic-bezier(.4,0,.2,1);box-shadow:-16px 0 60px #00000017;display:none;flex-direction:row}.info-panel:not([hidden]){display:flex}.info-panel.open{transform:translate(0)}.info-panel__sidebar{width:112px;flex-shrink:0;border-right:1px solid rgba(0,0,0,.08);display:flex;flex-direction:column;align-items:center;justify-content:space-between;padding:2rem 0}.info-panel__tabs{display:flex;flex-direction:column;align-items:center;gap:2rem;width:100%}.panel-tab{background:none;border:none;padding:0;writing-mode:vertical-rl;transform:rotate(180deg);font-size:.82rem;letter-spacing:.04em;color:#bbb;cursor:pointer;transition:color .15s ease;white-space:nowrap}.panel-tab--active{color:#2a2a2a;font-weight:500}.panel-tab:hover{color:#555}.info-panel__share{background:none;border:none;padding:.4rem;display:flex;align-items:center;justify-content:center;cursor:pointer;opacity:.6;transition:opacity .15s ease}.info-panel__share:hover{opacity:1}.info-panel__main{flex:1;min-width:0;display:flex;flex-direction:column;padding:2.5rem 2.8rem 2.5rem 2.4rem;overflow-y:auto;position:relative}.info-panel__close{position:absolute;top:1.4rem;right:1.4rem;width:40px;height:40px;border-radius:50%;border:none;background:#fff;box-shadow:0 2px 10px #0000001a;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:box-shadow .15s ease;flex-shrink:0}.info-panel__close:hover{box-shadow:0 4px 16px #00000029}.info-panel__title{font-family:"Libertinus Serif Display",system-ui;font-size:clamp(2rem,4.5vw,3rem);font-weight:400;letter-spacing:-.03em;line-height:1.05;color:#0a0a0a;text-transform:uppercase;margin:3.5rem 0 0}.info-panel__text-block{margin-top:auto;padding-top:2rem}.info-panel__desc{font-size:.85rem;line-height:1.8;color:#555;margin:0;text-align:justify}.info-panel__stats{display:grid;grid-template-columns:1fr 1fr;gap:0;margin-top:2.5rem;border-top:1px solid rgba(0,0,0,.1)}.info-panel__stats>div{padding:1.4rem 0;border-bottom:1px solid rgba(0,0,0,.07)}.info-panel__stats>div:nth-child(odd){padding-right:1.5rem;border-right:1px solid rgba(0,0,0,.07)}.info-panel__stats>div:nth-child(2n){padding-left:1.5rem}.info-panel__stats dt{font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:#999;margin-bottom:.3rem}.info-panel__stats dd{font-size:1.9rem;font-weight:600;letter-spacing:-.02em;color:#1a1a1a;margin:0;line-height:1.1}.info-panel__footer{margin-top:2.5rem;display:flex;justify-content:flex-end}.info-panel__more{display:inline-flex;align-items:center;gap:.4rem;background:#1a1a1a;color:#fff;border:none;border-radius:999px;padding:.75rem 1.6rem;font-size:.88rem;letter-spacing:.02em;cursor:pointer;transition:background .15s ease}.info-panel__more:hover{background:#333}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-5px)}}@keyframes loading-spin{to{transform:rotate(360deg)}}@keyframes loading-progress{0%{transform:translate(-130%)}to{transform:translate(240%)}}@media(prefers-reduced-motion:reduce){.loading-orbit:before,.progress-shell[data-mode=indeterminate] .progress-fill{animation:none}}@media(max-width:900px){.col-line{display:none}.topbar{padding:1rem 2rem}.topnav{gap:1.6rem}.hero{padding:2rem}.viewer-loading{left:56%;width:min(24rem,calc(100vw - 4rem));min-width:0}.start-hint{right:2rem;bottom:2rem}}@media(max-width:600px){.topnav{display:none}.hero{padding:1.5rem 1.25rem}.hero-title{font-size:clamp(2.2rem,11vw,3.2rem)}.viewer-loading{top:58%;left:50%;width:calc(100vw - 2.5rem)}.loading-title{font-size:1.7rem}.start-hint{right:1.25rem;bottom:1.5rem}}.onboarding{position:fixed;inset:0;z-index:100;overflow:hidden;background:#fff;color:#1a1a1a;font-family:"Libertinus Serif Display",Georgia,Times New Roman,serif;font-style:normal;font-weight:400;opacity:1;transition:opacity .7s ease}.onboarding.is-leaving{opacity:0;pointer-events:none}.onboarding__scroller{position:absolute;inset:0;overflow:hidden;scrollbar-width:none;-webkit-overflow-scrolling:touch}.onboarding__scroller::-webkit-scrollbar{width:0;height:0}.onboarding__track{position:relative;height:1000vh}.onboarding__stage{position:sticky;top:0;height:100vh;overflow:hidden;background:#fff}.ob-years{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;opacity:0;perspective:760px;perspective-origin:50% 50%}.ob-years__reel{position:relative;width:100%;height:0;transform-style:preserve-3d}.ob-year{position:absolute;left:0;right:0;top:0;height:1em;margin-top:-.5em;text-align:center;font-size:min(21vh,13.5vw);line-height:1;letter-spacing:-.02em;white-space:nowrap;backface-visibility:hidden}.ob-caption{position:absolute;left:0;right:0;bottom:7vh;display:flex;flex-direction:column;align-items:center;gap:.55rem;font-family:Inter,sans-serif;text-align:center;opacity:0;transition:opacity .5s ease;pointer-events:none}.ob-caption.is-visible{opacity:1}.onboarding.is-error .ob-caption{top:50%;bottom:auto;transform:translateY(-50%)}.ob-caption__label{font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:#8a8a8a}.ob-caption__bytes{font-size:.72rem;letter-spacing:.02em;color:#b0b0b0;font-variant-numeric:tabular-nums}.ob-caption__bytes--error{color:#a3401f}.ob-caption__retry{pointer-events:auto;margin-top:.3rem;border:1px solid #d4d4d4;border-radius:999px;background:#fff;color:#1a1a1a;font-family:inherit;font-size:.78rem;padding:.45rem 1.1rem;transition:border-color .2s ease}.ob-caption__retry:hover{border-color:#9c9c9c}.ob-logo{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;opacity:0;pointer-events:none}.ob-logo img{display:block;width:min(210px,26vw);height:auto}.ob-scroll-hint{position:absolute;left:0;right:0;bottom:5.5vh;display:flex;flex-direction:column;align-items:center;gap:.5rem;font-family:Inter,sans-serif;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:#9c9c9c;opacity:0;transition:opacity .6s ease;pointer-events:none}.ob-scroll-hint.is-visible{opacity:1}.ob-scroll-hint svg{display:block;animation:ob-nudge 2.2s ease-in-out infinite}@keyframes ob-nudge{0%,to{transform:translateY(0)}50%{transform:translateY(5px)}}.ob-gallery{position:absolute;inset:0;pointer-events:none}.ob-photo{position:absolute;opacity:0;will-change:transform;pointer-events:auto;filter:grayscale(1);transition:filter .5s ease}.ob-photo:hover{filter:grayscale(0)}.ob-photo img{display:block;width:100%;height:100%;object-fit:cover}.ob-roof{position:absolute;left:0;top:0;width:100%;height:170vh;background-image:url(/onboarding/roof.jpg);background-size:cover;background-position:center top;background-repeat:no-repeat;transform:translate3d(0,170vh,0);will-change:transform}.ob-headline{position:absolute;left:0;right:0;top:0;padding-top:17vh;text-align:center;text-transform:uppercase;font-size:min(8.1vh,5.1vw);line-height:1.12;letter-spacing:-.05em;transform:translate3d(0,95vh,0);will-change:transform;pointer-events:none}.ob-headline__line{display:flex;flex-wrap:wrap;gap:0 .26em;justify-content:center}.ob-headline__line--tight{gap:0 .18em;align-items:center}.ob-phrase{color:#e2e2e2}.ob-petal{display:inline-flex;align-items:center;justify-content:center;width:.6em;height:.72em;opacity:0}.ob-petal img{display:block;width:.62em;height:auto;transform:rotate(95deg)}.ob-prompt{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4.2vh;padding-top:5vh;opacity:0;pointer-events:none}.ob-prompt__copy{text-align:center;text-transform:uppercase;font-size:min(5.4vh,3.4vw);line-height:1.15;letter-spacing:-.035em}.ob-prompt__line{display:flex;flex-wrap:wrap;gap:0 .24em;justify-content:center}.ob-prompt__phrase{display:inline-block}.ob-prompt__actions{display:flex;align-items:center;gap:8px;font-family:Inter,sans-serif;opacity:0}.ob-btn{border:0;border-radius:999px;font-family:inherit;font-size:13px;padding:9px 20px;transition:background .2s ease,border-color .2s ease}.ob-btn--primary{background:#5e4a0e;color:#fff}.ob-btn--primary:hover{background:#6e5811}.ob-btn--ghost{background:#fff;color:#1a1a1a;border:1px solid #d4d4d4;padding:8px 18px}.ob-btn--ghost:hover{border-color:#9c9c9c}.ob-skip{position:absolute;top:1.6rem;right:1.8rem;z-index:3;border:1px solid rgba(0,0,0,.14);border-radius:999px;background:#fffc;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);color:#666;font-family:Inter,sans-serif;font-size:.72rem;letter-spacing:.06em;padding:.4rem .95rem;opacity:0;transition:opacity .4s ease,color .2s ease,border-color .2s ease;pointer-events:none}.ob-skip.is-visible{opacity:1;pointer-events:auto}.ob-skip:hover{color:#1a1a1a;border-color:#00000052}.onboarding--reduced .onboarding__track{height:100vh}.onboarding--reduced .ob-gallery,.onboarding--reduced .ob-roof,.onboarding--reduced .ob-headline,.onboarding--reduced .ob-scroll-hint{display:none}.onboarding--reduced .ob-year{filter:none!important}.onboarding--reduced .ob-enter{position:absolute;left:0;right:0;bottom:7vh;display:flex;justify-content:center}@media(max-width:720px){.ob-headline{font-size:min(7vh,8.6vw);padding-top:20vh}.ob-prompt__copy{font-size:min(4.6vh,6.4vw)}.ob-skip{top:1rem;right:1rem}}