@import url('https://fonts.googleapis.com/css2?family=Be+Vietnam+Pro:wght@400;500;600;700&family=Playfair+Display:ital,wght@0,500;0,600;1,500&display=swap');
:root{color-scheme:dark;font-family:'Be Vietnam Pro',sans-serif;color:#f8f4ed;background:#090b13;font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer}a{color:inherit}button:focus-visible,a:focus-visible,canvas:focus-visible{outline:2px solid #f5bc89;outline-offset:5px}button{border:0}#experience{position:relative;width:100%;height:100svh;min-height:460px;overflow:hidden;background:#090b13}#universe{position:absolute;inset:0;width:100%;height:100%;display:block;cursor:grab;touch-action:none;outline-offset:-6px}#universe.dragging{cursor:grabbing}.vignette{position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(3,5,12,.4),transparent 25%,transparent 40%,rgba(3,5,12,.16) 64%,rgba(3,5,12,.86)),linear-gradient(90deg,rgba(3,5,12,.4),transparent 65%)}.topbar{position:absolute;inset:0 0 auto;display:flex;justify-content:space-between;align-items:center;padding:29px 42px;pointer-events:none}.topbar>*{pointer-events:auto}.brand{display:flex;align-items:center;gap:12px;font-size:12px;letter-spacing:2.3px;font-weight:600;text-decoration:none}.brand svg{width:39px;height:39px}.brand-degree{color:#f1b98d;letter-spacing:.5px;font-size:11px;margin-left:5px}.glass{display:inline-flex;align-items:center;justify-content:center;gap:10px;background:rgba(23,25,33,.38);border:1px solid rgba(242,238,228,.3);border-radius:30px;padding:13px 19px;font-size:12px;backdrop-filter:blur(12px);transition:background .2s,border-color .2s}.glass:hover{background:rgba(255,255,255,.14);border-color:#e9dfd0}.glass svg{width:17px;height:17px}.intro{position:absolute;bottom:175px;left:6%;pointer-events:none;transition:opacity 1s,transform 1s}.eyebrow{font-size:9px;letter-spacing:2.3px;font-weight:500;color:#ded3c6;display:flex;align-items:center;gap:11px}.eyebrow>span{width:21px;height:1px;background:#e9bb91}h1{font-family:'Playfair Display',Georgia,serif;font-size:clamp(50px,6.2vw,88px);font-weight:500;letter-spacing:-2.5px;line-height:1.12;margin:22px 0 21px;text-shadow:0 2px 30px #090b1370}h1 em{color:#f1be97;font-weight:500}.description{font-size:12px;line-height:1.9;color:#e1dcd4;margin:0}.hint{position:absolute;bottom:91px;left:50%;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:8px;white-space:nowrap;pointer-events:none;transition:opacity 1s}.hint svg{width:46px;height:27px;animation:sway 3s ease-in-out infinite}.hint>span{font-size:11px;letter-spacing:.3px}.hint small{font-size:9px;color:#c0bdba}.scene-label{position:absolute;right:44px;bottom:110px;display:flex;align-items:center;gap:15px;font-size:9px;letter-spacing:2px;pointer-events:none}.scene-sub{display:block;font-size:9px;letter-spacing:0;color:#d1c9c0;margin-top:8px}.orbit{border:1px solid #ffffff50;width:49px;height:49px;border-radius:50%;display:grid;place-items:center;font-size:11px;letter-spacing:0}footer{position:absolute;bottom:0;left:0;right:0;padding:0 42px max(25px,env(safe-area-inset-bottom));display:flex;justify-content:space-between;align-items:center;gap:20px}.footer-actions{display:flex;align-items:center;gap:17px}.quiet-button{background:none;display:flex;align-items:center;gap:8px;padding:9px 0;font-size:10px;color:#ddd6cd;white-space:nowrap}.quiet-button:hover{color:#fff}.quiet-button svg{width:17px;height:17px}.divider{height:13px;width:1px;background:#ffffff30}.info-icon{font:italic 11px Georgia,serif;width:15px;height:15px;border:1px solid #ddd6cd80;border-radius:50%;display:grid;place-items:center}.credits{font-size:8px;color:#b8b4b0;margin:0;line-height:1.7;text-align:right}.credits a{text-decoration:none}.credits a:hover{text-decoration:underline}.loading,.error{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;background:#090b13;z-index:10;gap:20px}.loading{transition:opacity .7s}.loading p{font-size:12px;letter-spacing:.5px;color:#dfd5c9}.loading-orbit{width:44px;height:44px;border:1px solid #e9bb9130;border-top-color:#e9bb91;border-radius:50%;animation:spin 1.4s linear infinite}.ready .loading{opacity:0;pointer-events:none}.error{text-align:center;padding:24px}.error h2{font:32px 'Playfair Display',Georgia,serif;margin-bottom:0}.error p{font-size:13px;line-height:1.8;max-width:390px}.error[hidden],[hidden]{display:none!important}.toast{position:absolute;left:50%;bottom:160px;transform:translateX(-50%);background:#171a23ec;max-width:calc(100% - 32px);padding:14px 22px;font-size:12px;line-height:1.7;border:1px solid #ffffff30;border-radius:12px;z-index:15}.exploring .intro,.immersive .intro{opacity:0;transform:translateY(12px)}.exploring .hint,.immersive .hint{opacity:0}dialog{background:#141821;color:#f8f4ed;border:1px solid #ffffff24;border-radius:20px;max-width:460px;width:calc(100% - 32px);max-height:90svh;padding:38px;box-shadow:0 30px 100px #0007}dialog::backdrop{background:#04070bd9;backdrop-filter:blur(10px)}.close-dialog{position:absolute;top:12px;right:16px;background:transparent;font-size:27px;padding:5px 9px;color:#c8c5c1}dialog h2{font:500 38px/1.2 'Playfair Display',Georgia,serif;letter-spacing:-.8px;margin:24px 0}dialog p{font-size:12px;color:#d1c9c0;line-height:1.9}dialog .eyebrow{font-size:8px;color:#efbb93;letter-spacing:2px}dl{font-size:11px;line-height:1.8;border-top:1px solid #ffffff20;padding-top:18px;margin-top:24px}dt{color:#9c9996;font-size:9px;margin-top:14px;letter-spacing:.7px}dd{margin:4px 0 0}dd>a{color:#efbb93;text-decoration:none}dd>span{display:block;color:#b6b0aa;font-size:10px}dialog .story-note{font-size:10px;color:#a5a09a}.continue-button{width:100%;display:flex;justify-content:space-between;align-items:center;background:#e9bc97;color:#211d1a;border-radius:8px;padding:15px;margin-top:23px;font-size:11px}.continue-button:hover{background:#f4cba8}@keyframes spin{to{transform:rotate(360deg)}}@keyframes sway{50%{transform:translateX(6px)}}@media(min-width:1600px){.intro{bottom:23%}}@media(max-width:760px){.topbar{padding:21px 21px}.brand{font-size:10px;letter-spacing:1.6px;gap:8px}.brand svg{width:32px;height:32px}.glass{font-size:10px;padding:12px 14px;gap:8px}.glass svg{width:15px;height:15px}.intro{left:26px;bottom:205px}h1{font-size:56px;letter-spacing:-1.8px;margin:18px 0}.eyebrow{font-size:7px;letter-spacing:1.8px}.description{font-size:11px}.hint{bottom:116px;gap:7px}.hint small{font-size:8px}.scene-label{display:none}footer{padding:0 21px max(17px,env(safe-area-inset-bottom));flex-direction:column;gap:9px;align-items:center}.footer-actions{gap:17px}.quiet-button{font-size:9px;padding:6px 0}.credits{text-align:center;font-size:7px}.vignette{background:linear-gradient(180deg,rgba(3,5,12,.35),transparent 28%,transparent 40%,rgba(3,5,12,.4) 65%,rgba(3,5,12,.9))}dialog{padding:29px}dialog h2{font-size:34px}.toast{bottom:160px;width:max-content}}@media(max-height:550px) and (orientation:landscape){.topbar{padding:15px 25px}.intro{bottom:100px;left:35px}h1{font-size:43px;margin:12px 0}.description{display:none}.hint{bottom:77px}.hint small{display:none}.scene-label{bottom:85px}footer{padding-bottom:14px}.brand svg{height:30px}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}
.ai-link{color:#e9bc97!important}.credit-dot{margin:0 5px}.scene-list{display:grid;gap:12px;margin-top:24px}.scene-card{position:relative;overflow:hidden;min-height:125px;border:1px solid #ffffff20;border-radius:10px;background:#090b13;text-align:left;padding:60px 18px 17px;isolation:isolate}.scene-card img{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover;transition:transform .4s}.scene-card::after{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(0deg,#080b13ed,transparent)}.scene-card:hover img{transform:scale(1.04)}.scene-card[aria-current=true]{border-color:#e9bc97}.scene-card strong{display:block;font-size:14px;font-weight:500}.scene-card small{display:block;font-size:9px;color:#d4ccc3;margin-top:7px}.scene-card .current-mark{float:right;font-size:9px;color:#e9bc97}footer .credits{font-size:9px}@media(max-width:760px){.footer-actions{gap:12px}.quiet-button{font-size:9px}.quiet-button svg{width:15px}.credits{line-height:1.9}footer .credits{font-size:8px}.hint{bottom:120px}h1{font-size:53px}.eyebrow{letter-spacing:1.35px}}
.top-actions{display:flex;align-items:center;gap:24px}.ai-nav{font-size:11px;color:#ddd1c4;text-decoration:none}.ai-nav span{color:#edbd96;margin-left:5px}.ai-nav:hover{color:#fff}.brand{letter-spacing:2.8px}.fullscreen{background:#15192370}.scene-label{gap:20px;bottom:126px}.orbit{position:relative;border:0;width:64px;height:64px;display:flex;flex-direction:column;justify-content:center;gap:5px;background:#0b101530;backdrop-filter:blur(6px)}.orbit svg{position:absolute;inset:0;width:64px;height:64px;fill:none;stroke:#e9bc9770;stroke-width:.7}.orbit .needle{fill:#e9bc97;stroke:none}.orbit b{font-size:11px;font-weight:400;color:#f1d3b9;margin-top:3px}.orbit small{font-size:5px;letter-spacing:.8px;color:#c3b4a4}.scene-sub{line-height:1.6}.spin-button{color:#e9bc97;background:#e9bc970a;border:1px solid #e9bc972e;border-radius:30px;padding:11px 14px}.spin-button:hover{background:#e9bc971a}.footer-actions{gap:16px}.quiet-button{font-size:10px}.credits .admin-link{color:#c9bbaa}.intro{bottom:190px}.intro h1{font-size:clamp(52px,5.8vw,84px);letter-spacing:-1.5px}.hint{bottom:100px;color:#e9dfd0}.hint svg{opacity:.75}.hint small{font-size:8px;letter-spacing:.3px}.scene-card{min-height:150px;border-radius:13px;padding:75px 20px 20px}.scene-card strong{font-family:'Playfair Display',Georgia,serif;font-size:22px}.scene-card small{font-size:10px;color:#d5c5b5}.scene-card[aria-current=true]::before{content:'ĐANG NGẮM';position:absolute;top:13px;right:13px;font-size:7px;letter-spacing:1px;color:#f1d3b9;background:#12151bbb;border:1px solid #edbd9660;border-radius:20px;padding:6px 10px}dialog h2{font-size:40px}.vignette{background:linear-gradient(180deg,rgba(3,5,12,.32),transparent 25%,transparent 40%,rgba(3,5,12,.1) 60%,rgba(3,5,12,.88)),linear-gradient(90deg,rgba(3,5,12,.3),transparent 65%)}@media(max-width:1100px){.scene-label{right:30px}.scene-sub{max-width:150px}.footer-actions{gap:12px}footer{padding-left:30px;padding-right:30px}.quiet-button{font-size:9px}.credits{max-width:180px}}@media(max-width:760px){.top-actions{gap:13px}.ai-nav{font-size:9px}.brand{font-size:9px;letter-spacing:1.5px}.brand-degree{font-size:9px}.topbar{padding:22px}.fullscreen{padding:11px 12px;font-size:9px}.intro{left:27px;bottom:230px}.intro h1{font-size:49px;letter-spacing:-1.4px}.description{font-size:11px}.hint{bottom:148px}.footer-actions{flex-wrap:wrap;justify-content:center;gap:12px}.footer-actions .divider:nth-child(2){display:none}.spin-button{font-size:9px;padding:10px 14px;flex-basis:auto}.quiet-button{font-size:9px}.credits{max-width:none}footer{padding:0 18px max(20px,env(safe-area-inset-bottom));gap:13px}.scene-label{display:none}}@media(max-width:430px){.fullscreen span{display:none}.fullscreen{width:37px;height:37px;padding:0}.ai-nav{font-size:10px}.footer-actions{column-gap:12px;row-gap:8px}.spin-button{flex-basis:55%;justify-content:center;margin:0 22%}.intro{bottom:250px}.hint{bottom:167px}}@media(max-height:550px) and (orientation:landscape){.intro{bottom:104px}.intro h1{font-size:42px}.hint{bottom:78px}.scene-label{bottom:88px}.footer-actions{gap:12px}.spin-button{padding:7px 10px}.ai-nav{font-size:10px}}
@media(max-width:760px){.scene-label{display:flex;top:110px;right:24px;bottom:auto}.scene-label #scene-label{display:none}.orbit{width:54px;height:54px}.orbit svg{width:54px;height:54px}.orbit b{font-size:10px}.orbit small{font-size:4px}}
#gallery{max-width:780px;width:calc(100% - 32px)}.scene-list{grid-template-columns:1fr 1fr;gap:14px}.scene-card{min-height:155px}.scene-card strong{font-size:20px}.scene-card small{font-size:8px;line-height:1.6}.brand>span{font-size:14px;letter-spacing:1px;font-weight:500}.brand-degree{font-size:10px!important;letter-spacing:1px!important}.ai-nav{color:#edbd96}@media(max-width:500px){.scene-list{grid-template-columns:1fr}.scene-card{min-height:155px}.brand>span{font-size:12px}.brand svg{width:29px}.brand-degree{font-size:9px!important}#gallery{padding:27px}#gallery h2{font-size:33px}}