:root{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Microsoft YaHei",sans-serif;color:#34405a;font-synthesis:none;-webkit-font-smoothing:antialiased;--ink:#34405a;--muted:#6f7890;--ease-out:cubic-bezier(.23,1,.32,1)}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;overscroll-behavior:none}body{background:#e9ecf5;touch-action:none}button,a{-webkit-tap-highlight-color:transparent;touch-action:manipulation}button{font:inherit;color:inherit;cursor:pointer}button:disabled{cursor:wait}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible{outline:3px solid #798cbd;outline-offset:5px}[hidden]{display:none!important}#atmosphere{position:fixed;inset:-8%;pointer-events:none;background:radial-gradient(ellipse at 24% 38%,#d7bfe2a3,transparent 50%),radial-gradient(ellipse at 76% 62%,#acd8de99,transparent 48%),radial-gradient(ellipse at 73% 12%,#c5c8edbb,transparent 45%),linear-gradient(155deg,#f2f3f8,#e3e8f2 60%,#eee7ee);filter:blur(36px);transform:scale(1.05)}#atmosphere:after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 51% 49%,#fff7,transparent 60%)}body[data-project="1"] #atmosphere{background:radial-gradient(ellipse at 22% 45%,#d6bceba3,transparent 52%),radial-gradient(ellipse at 72% 60%,#edc2ceaa,transparent 52%),#e8e8f3}body[data-project="2"] #atmosphere{background:radial-gradient(ellipse at 22% 45%,#bddfdaa3,transparent 52%),radial-gradient(ellipse at 72% 60%,#dce7bb88,transparent 52%),#e3ecf2}#ice-canvas{position:fixed;inset:0;width:100%;height:100%;display:block;touch-action:none}.site-header{position:fixed;top:0;left:0;right:0;z-index:10;display:flex;justify-content:space-between;align-items:center;padding:26px 38px;gap:20px;pointer-events:none}.site-header>*{pointer-events:auto}.brand{font-size:14px;font-weight:600;letter-spacing:2px;display:flex;align-items:center;gap:15px}.brand-icon{font-size:19px;width:31px;height:31px;border:1px solid #ffffffb3;display:grid;place-items:center;border-radius:10px;box-shadow:inset 0 1px 0 #fff9;background:#fff3}.brand small{font-size:8px;letter-spacing:2.5px;font-weight:500;color:var(--muted)}.header-controls{display:flex;gap:9px;align-items:center}.pill,.round{border:1px solid #ffffffa6;background:#ffffff47;backdrop-filter:blur(20px) saturate(130%);-webkit-backdrop-filter:blur(20px) saturate(130%);box-shadow:inset 0 1px 0 #fff9,0 3px 15px #424b6904;font-size:10px;padding:9px 14px;border-radius:24px;transition:transform 140ms var(--ease-out),background-color 200ms ease}.round{padding:0;width:34px;height:34px;font-size:15px}.pill[aria-pressed="true"]{background:#ffffffb3}.pill:active,.round:active{transform:scale(.97)}#cover{position:fixed;inset:0;z-index:3;will-change:transform;pointer-events:none;transform-origin:50% 0}.cover-top{position:absolute;top:17%;width:100%;text-align:center}.eyebrow{font-size:9px;font-weight:500;letter-spacing:3.5px;color:var(--muted)}.cover-top h1{font-size:clamp(24px,3vw,43px);font-weight:400;letter-spacing:-1.5px;margin:16px 0 12px}.cover-top p{font-size:12px;color:var(--muted);line-height:1.9;margin:0}.cover-bottom{position:absolute;bottom:6%;left:50%;transform:translateX(-50%);text-align:center;width:90%;pointer-events:auto}.unlock-button{border:1px solid #fff9;background:#ffffff59;backdrop-filter:blur(25px);-webkit-backdrop-filter:blur(25px);border-radius:26px;padding:14px 26px;font-size:12px;letter-spacing:1px;box-shadow:inset 0 1px 0 #fffb,0 12px 35px #7381a315;transition:transform 140ms var(--ease-out)}.unlock-button:active{transform:scale(.98)}.unlock-button>span{display:inline-block;margin-left:20px}.cover-bottom p{font-size:9px;letter-spacing:1.4px;color:var(--muted);margin:17px 0}.mobile-instruction{display:none}.screen-grab{display:block;width:35px;height:4px;border-radius:5px;background:#8792ae70;margin:20px auto 0}.sr-only{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.glass{background:linear-gradient(145deg,#ffffff85,#ffffff30);border:1px solid #ffffffaa;box-shadow:inset 0 1px 0 #ffffffdd,inset 0 -1px 0 #ffffff24,0 24px 90px #64739115;backdrop-filter:blur(32px) saturate(130%);-webkit-backdrop-filter:blur(32px) saturate(130%)}#gallery{position:fixed;inset:0;z-index:4;pointer-events:none}#project-panel{position:absolute;left:50%;top:50%;transform:translateY(-50%);width:min(42%,590px);border-radius:38px;pointer-events:auto;padding:42px;isolation:isolate;overflow:hidden;touch-action:pan-y}#project-panel:before{content:"";position:absolute;z-index:-1;inset:-20%;border-radius:45%;background:radial-gradient(ellipse at 20% 30%,#fff8,transparent 55%);pointer-events:none}.panel-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;font-size:9px;color:var(--muted);letter-spacing:2px}.panel-heading>span:last-child{letter-spacing:3px;font-variant-numeric:tabular-nums}#project-name{font-size:clamp(27px,3vw,46px);line-height:1.3;letter-spacing:-1.8px;font-weight:550;margin:30px 0 18px;outline:none}#project-summary{font-size:15px;line-height:1.95;color:#64708b;max-width:330px;margin:0}#project-tags{display:flex;gap:8px;margin:26px 0 35px;flex-wrap:wrap}#project-tags span{font-size:10px;border:1px solid #ffffff85;background:#ffffff3b;border-radius:15px;padding:5px 12px;color:var(--muted)}.panel-footer{border-top:1px solid #ffffff6b;padding-top:23px;display:flex;justify-content:space-between;align-items:center;gap:15px}.panel-footer>span{font-size:8px;color:var(--muted);letter-spacing:2px}.open-button{border:none;background:#46526b;color:#fff;border-radius:23px;padding:11px 18px;font-size:11px;display:flex;gap:20px;align-items:center;box-shadow:0 5px 15px #46526b12}.open-button:active{transform:scale(.98)}.cube-label{position:absolute;left:28%;top:70%;transform:translateX(-50%);text-align:center;pointer-events:none}.cube-label span{font-size:8px;letter-spacing:3px;color:var(--muted)}.cube-label p{font-size:10px;color:var(--muted);margin:12px 0}#active-cube{position:absolute;left:28%;top:48%;transform:translate(-50%,-50%);width:170px;height:170px;background:none;border:none;border-radius:28px;pointer-events:auto;font-size:0}.project-nav{position:absolute;bottom:6%;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:24px;pointer-events:auto}.project-nav .round{width:40px;height:40px;background:#ffffff52}.nav-dots{display:flex;gap:10px;align-items:center}.nav-dots button{width:7px;height:7px;padding:0;border:none;border-radius:50%;background:#aeb7c8;transition:transform 200ms var(--ease-out),background-color 200ms ease}.nav-dots button[aria-pressed="true"]{background:#53627f;transform:scale(1.25)}.gesture-hint{position:absolute;bottom:14px;left:0;right:0;text-align:center;font-size:8px;letter-spacing:1.6px;color:var(--muted)}#detail{position:fixed;inset:0;z-index:8;overflow-y:auto;overscroll-behavior:contain;touch-action:pan-y;background:linear-gradient(145deg,#f1f4ffad,#e1eaf3c4 55%,#ebe4f0c4);backdrop-filter:blur(40px);-webkit-backdrop-filter:blur(40px);padding:110px max(30px,calc((100vw - 860px)/2)) 90px;will-change:transform,opacity}.detail-toolbar{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:60px}.detail-toolbar>span{font-size:9px;letter-spacing:2px;color:var(--muted)}#detail-icon{display:grid;place-items:center;width:86px;height:86px;background:#ffffff52;border:1px solid #ffffffaa;border-radius:26px;font-size:45px;margin-bottom:30px;box-shadow:inset 0 1px 0 #fff}.detail-hero h1{font-size:clamp(38px,5vw,64px);font-weight:550;letter-spacing:-2.7px;margin:16px 0}.detail-hero>p{font-size:20px;line-height:1.8;color:#65708b;margin:0 0 35px}.detail-body{margin-top:50px;border-radius:30px;padding:36px}.detail-body>p,.detail-body section p{font-size:15px;line-height:2;color:#66718a}.detail-body h2{font-size:22px;font-weight:550;letter-spacing:-.7px;margin:35px 0 10px}.sample-note{font-size:11px;color:#73809a;border-left:2px solid #aab8d1;padding:8px 14px;margin-top:35px;line-height:1.8}.detail-bottom{display:flex;justify-content:space-between;align-items:center;border-top:1px solid #fff8;padding-top:25px;margin-top:40px;font-size:10px;color:var(--muted);gap:20px}.detail-bottom a{text-decoration:underline;text-underline-offset:4px}#loader,#fallback{position:fixed;inset:0;z-index:20;display:grid;place-content:center;text-align:center;background:#e9edf6d9;backdrop-filter:blur(30px);padding:30px}#loader p{font-size:12px;color:var(--muted);letter-spacing:3px}#loader .loader-icon{width:30px;height:30px;border:1px solid #ffffffd9;border-radius:9px;margin:0 auto;background:#b8c9e86b;transform:rotate(-12deg)}#fallback h1{font-size:27px;letter-spacing:-1px;font-weight:500}#fallback p{max-width:340px;font-size:13px;line-height:1.9;color:var(--muted)}#fallback .pill{margin-top:20px}#status{position:fixed}.liquid-sheen{position:absolute;inset:-40%;background:linear-gradient(110deg,transparent 38%,#ffffff25 49%,transparent 58%);pointer-events:none;z-index:-1;animation:sheen 18s linear infinite}@keyframes sheen{from{transform:translateX(-25%) rotate(0)}to{transform:translateX(25%) rotate(5deg)}}body[data-state="detail"] #gyro,body[data-state="detail"] #restart{visibility:hidden}
@media(hover:hover) and (pointer:fine){.pill:hover,.round:hover{background:#ffffffa1}.unlock-button:hover{transform:translateY(-2px)}.open-button:hover{background:#35425e}}
@media(max-width:1000px){.brand small{display:none}#project-panel{padding:32px;left:48%;width:46%}.panel-footer>span{display:none}.site-header{padding:23px 26px}.header-controls{gap:6px}.pill{font-size:9px;padding:8px 11px}}
@media(max-width:759px){.site-header{padding:18px 20px;gap:12px}.brand{font-size:12px;letter-spacing:1px;gap:9px}.brand-icon{width:27px;height:27px;font-size:16px}.header-controls{gap:6px}.pill{font-size:8px;padding:8px 10px}.round{width:29px;height:29px;font-size:13px}#reduce{font-size:0;width:29px;height:29px;padding:0}#reduce:before{content:'◐';font-size:14px}#gyro{max-width:104px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.cover-top{top:14%}.cover-top h1{font-size:25px;letter-spacing:-1px}.cover-top p{font-size:10px}.eyebrow{font-size:8px;letter-spacing:2.5px}.cover-bottom{bottom:5%}.desktop-instruction{display:none}.mobile-instruction{display:inline}.unlock-button{font-size:11px;padding:13px 22px}.cover-bottom p{font-size:8px;line-height:1.9;max-width:290px;margin:15px auto}.cube-label{left:50%;top:45%}.cube-label p{display:none}.cube-label span{font-size:7px;letter-spacing:2px}#active-cube{left:50%;top:29%;width:140px;height:140px}#project-panel{left:20px;right:20px;top:51%;width:auto;padding:25px 26px;border-radius:29px;transform:none;max-height:calc(49svh - 104px);overflow-y:auto}.panel-heading{font-size:8px;letter-spacing:1.5px}#project-name{font-size:28px;margin:17px 0 12px;letter-spacing:-1px}#project-summary{font-size:12px;line-height:1.85}#project-tags{margin:17px 0 20px;gap:6px}#project-tags span{font-size:8px;padding:4px 10px}.panel-footer{padding-top:15px}.open-button{font-size:10px;padding:10px 15px}.panel-footer>span{display:inline;font-size:7px;letter-spacing:1px}.project-nav{bottom:5%;gap:20px}.project-nav .round{width:34px;height:34px}.gesture-hint{font-size:7px;bottom:9px;letter-spacing:1px}#detail{padding:90px 22px 50px}.detail-toolbar{margin-bottom:35px}.detail-toolbar>span{font-size:7px}.detail-hero h1{font-size:41px;letter-spacing:-1.8px}.detail-hero>p{font-size:16px}#detail-icon{width:70px;height:70px;font-size:35px;border-radius:22px;margin-bottom:20px}.detail-body{margin-top:25px;padding:25px;border-radius:24px}.detail-body>p,.detail-body section p{font-size:13px}.detail-body h2{font-size:20px}.detail-bottom{font-size:8px}.sample-note{font-size:10px}}
@media(max-height:700px) and (max-width:759px){.cover-top{top:13%}.cover-top h1{font-size:22px;margin:12px 0}.cover-top p{display:none}#project-panel{top:48%;max-height:calc(52svh - 88px);padding:20px 24px}#project-tags{display:none}.panel-footer{margin-top:18px}.cube-label{top:42%}.project-nav{bottom:3%}.gesture-hint{display:none}.header-controls #reduce{display:none}.cover-bottom p{display:none}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:opacity 120ms ease,background-color 120ms ease!important}.liquid-sheen{display:none}}body.reduced .liquid-sheen{animation:none;display:none}
body[data-project] #atmosphere{background:#e9ecf5}.atmosphere-layer{position:absolute;inset:0;opacity:0;transition:opacity 1200ms ease}.layer-0{background:radial-gradient(ellipse at 24% 38%,#d7bfe2a3,transparent 50%),radial-gradient(ellipse at 76% 62%,#acd8de99,transparent 48%),radial-gradient(ellipse at 73% 12%,#c5c8edbb,transparent 45%)}.layer-1{background:radial-gradient(ellipse at 22% 45%,#d6bceba3,transparent 52%),radial-gradient(ellipse at 72% 60%,#edc2ceaa,transparent 52%)}.layer-2{background:radial-gradient(ellipse at 22% 45%,#bddfdaa3,transparent 52%),radial-gradient(ellipse at 72% 60%,#dce7bb88,transparent 52%)}body[data-project="0"] .layer-0,body[data-project="1"] .layer-1,body[data-project="2"] .layer-2{opacity:1}
@media(prefers-reduced-transparency:reduce){.glass{background:#edf1f9f0;backdrop-filter:none}.pill,.round,.unlock-button{background:#f1f4faf0;backdrop-filter:none}#detail{background:#e9eef8fa;backdrop-filter:none}}
