:root{--paper:#f2efe9;--ink:#1c1b19;--ink-soft:#1c1b198c;--ink-faint:#1c1b192e;--serif:"Noto Serif SC", "Source Han Serif SC", "Songti SC", "STSong", "SimSun", serif;--sans:"Inter", "Helvetica Neue", "PingFang SC", "Microsoft YaHei UI", system-ui, sans-serif;--ease:cubic-bezier(.22, 1, .36, 1);--detail-height:clamp(230px, 28vh, 320px)}[hidden]{display:none!important}.project-subtitle{color:var(--ink-soft);letter-spacing:.18em;margin-top:12px;font-size:12px}.floor-switch{z-index:3;border:1px solid var(--ink-faint);background:var(--paper);border-radius:40px;gap:4px;padding:5px;display:flex;position:fixed;top:38px;right:44px}.floor-switch button{color:var(--ink-soft);cursor:pointer;font:11px var(--sans);letter-spacing:.05em;background:0 0;border:0;border-radius:24px;padding:10px 16px}.floor-switch button[aria-pressed=true]{background:var(--ink);color:var(--paper)}.door-controls{z-index:4;color:var(--ink-soft);align-items:center;gap:10px;font-size:11px;display:flex;position:fixed;bottom:34px;left:44px}.door-controls button{font:inherit;color:var(--ink);border:1px solid var(--ink-faint);background:var(--paper);cursor:pointer;border-radius:20px;padding:7px 12px}body.is-focused .door-controls{bottom:calc(var(--detail-height) + 18px)}.door-dot{background:#8f9275;border-radius:50%;width:5px;height:5px}button:focus-visible{outline-offset:4px;outline:2px solid #9c7b50}@media (width<=720px){.floor-switch{padding:3px;top:112px;left:20px;right:auto}.floor-switch button{padding:8px 12px;font-size:10px}.door-controls{left:20px;bottom:calc(68px + env(safe-area-inset-bottom));gap:7px;font-size:10px}body.is-focused .floor-switch{opacity:0;pointer-events:none}body.is-focused .door-controls{top:16px;bottom:auto}body.is-focused .door-controls #door-status{display:none}}*{box-sizing:border-box;margin:0;padding:0}html,body{background:var(--paper);height:100%;color:var(--ink);font-family:var(--sans);-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent;overflow:hidden}#scene{touch-action:none;cursor:grab;width:100%;height:100%;display:block;position:fixed;inset:0}#scene.is-hovering{cursor:pointer}.masthead{pointer-events:none;position:fixed;top:clamp(20px,4vh,40px);left:clamp(20px,4vw,48px)}.eyebrow{letter-spacing:.28em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:10px;font-size:11px}.masthead h1{font-family:var(--serif);letter-spacing:.12em;font-size:clamp(22px,2.4vw,30px);font-weight:500}.rooms{flex-direction:column;gap:2px;display:flex;position:fixed;top:50%;right:clamp(20px,4vw,48px);transform:translateY(-50%)}.rooms button{appearance:none;font:inherit;color:var(--ink-soft);text-align:right;cursor:pointer;transition:color .4s var(--ease);background:0 0;border:0;justify-content:flex-end;align-items:baseline;gap:12px;padding:7px 0;display:flex}.rooms button .en{letter-spacing:.2em;text-transform:uppercase;opacity:0;transition:opacity .4s var(--ease), transform .4s var(--ease);font-size:10px;transform:translate(6px)}.rooms button .cn{font-family:var(--serif);letter-spacing:.14em;font-size:15px}.rooms button:after{content:"";transform-origin:100%;width:14px;height:1px;transition:transform .4s var(--ease);background:currentColor;align-self:center;transform:scaleX(.4)}.rooms button:hover,.rooms button.is-active{color:var(--ink)}.rooms button:hover .en,.rooms button.is-active .en{opacity:1;transform:none}.rooms button.is-active:after{transform:scaleX(1.6)}.caption{pointer-events:none;--cn-size:clamp(40px, 6vw, 76px);column-gap:calc(var(--cn-size) * .22);grid-template-columns:auto auto;justify-content:start;display:grid;position:fixed;bottom:clamp(24px,6vh,56px);left:clamp(20px,4vw,48px)}.caption-index{letter-spacing:.28em;color:var(--ink-soft);font-variant-numeric:tabular-nums;grid-column:1/-1;margin-bottom:14px;font-size:11px}.caption-cn,.caption-en{grid-column:1}.palette{margin-top:calc(var(--cn-size) * .07);height:calc(var(--cn-size) * .92);grid-area:2/2/span 2;grid-template-columns:calc(var(--cn-size) * .36) auto;grid-auto-rows:1fr;align-self:start;gap:1px 12px;list-style:none;display:grid}.chip{background:var(--c);flex:none;width:9px;height:9px;box-shadow:inset 0 0 0 1px #1c1b191a}.sw-cn{font-family:var(--serif);letter-spacing:.12em;color:var(--ink)}.sw-en{letter-spacing:.2em;text-transform:uppercase;color:var(--ink-soft);font-size:9px}.palette li{grid-column:1/-1;grid-template-columns:subgrid;align-items:center;display:grid}.palette .chip{transform-origin:0;width:100%;height:100%;transition:transform .2s var(--ease);transform:scaleX(0);box-shadow:inset 0 0 0 1px #1c1b1912}.palette .sw-cn{font-size:clamp(9px, calc(var(--cn-size) * .145), 11px);color:var(--ink-soft);white-space:nowrap;opacity:0;transition:opacity .18s var(--ease);line-height:1}.palette .sw-en{display:none}.caption.has-palette:not(.is-swapping) .palette .chip{transition:transform .9s var(--ease) calc(80ms + var(--i) * 50ms);transform:none}.caption.has-palette:not(.is-swapping) .palette .sw-cn{opacity:1;transition:opacity .7s var(--ease) calc(.35s + var(--i) * 50ms)}.caption-cn{font-family:var(--serif);letter-spacing:.08em;transition:opacity .35s var(--ease), transform .5s var(--ease);font-size:clamp(40px,6vw,76px);font-weight:400;line-height:1}.caption-en{letter-spacing:.24em;text-transform:uppercase;color:var(--ink-soft);margin-top:14px;font-size:12px}.caption.is-swapping .caption-cn{opacity:0;transform:translateY(8px)}.compass{border:1px solid var(--ink-faint);pointer-events:none;border-radius:50%;place-items:center;width:44px;height:44px;display:grid;position:fixed;top:clamp(20px,4vh,40px);right:clamp(20px,4vw,48px)}.compass span{letter-spacing:.2em;color:var(--ink-soft);font-size:10px;position:absolute;top:-18px}.compass i{background:linear-gradient(var(--ink) 50%, var(--ink-faint) 50%);width:1px;height:30px}.hint{letter-spacing:.18em;color:var(--ink-soft);pointer-events:none;transition:opacity .8s var(--ease);font-size:11px;position:fixed;bottom:clamp(24px,6vh,56px);right:clamp(20px,4vw,48px)}.loader{background:var(--paper);transition:opacity .9s var(--ease), visibility .9s;z-index:10;place-content:center;gap:16px;display:grid;position:fixed;inset:0}.loader p{font-family:var(--serif);letter-spacing:.4em;color:var(--ink-soft);text-align:center;font-size:13px}.loader .bar{background:var(--ink-faint);width:160px;height:1px;overflow:hidden}.loader .bar i{background:var(--ink);width:0;height:100%;transition:width .3s var(--ease);display:block}.loader.is-done{opacity:0;visibility:hidden}body.is-focused .masthead,body.is-focused .rooms,body.is-focused .caption,body.is-focused .hint{opacity:0;pointer-events:none}.masthead,.rooms,.caption,.hint{transition:opacity .5s var(--ease)}.panel{height:var(--detail-height);padding:12px clamp(20px, 2.4vw, 44px) calc(10px + env(safe-area-inset-bottom));-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-top:1px solid var(--ink-faint);visibility:hidden;transition:transform .7s var(--ease), visibility .7s;z-index:5;background:#f6f4eff0;flex-direction:column;gap:10px;display:flex;position:fixed;bottom:0;left:0;right:0;transform:translateY(104%)}.panel.is-open{visibility:visible;transform:none}.panel-header{flex-shrink:0;align-items:center;gap:18px;min-height:30px;display:flex}.panel-back{appearance:none;font:inherit;letter-spacing:.08em;color:var(--ink-soft);cursor:pointer;transition:color .3s var(--ease);background:0 0;border:0;flex-shrink:0;padding:4px 0;font-size:12px}.panel-back:hover{color:var(--ink)}.panel-index{letter-spacing:.14em;color:var(--ink-soft);font-variant-numeric:tabular-nums;white-space:nowrap;font-size:10px}.panel-cn{font-family:var(--serif);letter-spacing:.08em;white-space:nowrap;font-size:clamp(17px,1.6vw,24px);font-weight:400;line-height:1.3}.panel-en{letter-spacing:.16em;text-transform:uppercase;color:var(--ink-soft);font-size:10px}.panel-details{flex-shrink:0;margin-left:auto}.panel-details summary{color:var(--ink-soft);cursor:pointer;padding:6px 0;font-size:11px}.panel-info{width:min(380px,100vw - 40px);max-height:calc(100dvh - var(--detail-height) - 32px);border:1px solid var(--ink-faint);background:var(--paper);padding:20px;position:absolute;bottom:calc(100% + 12px);right:20px;overflow-y:auto;box-shadow:0 8px 32px #1c1b1914}.panel-meta{letter-spacing:.12em;color:var(--ink-soft);font-variant-numeric:tabular-nums;font-size:12px}.panel-note{font-family:var(--serif);letter-spacing:.04em;margin-top:10px;font-size:14px;line-height:1.9}.panel-palette{margin-top:16px}.panel-palette[hidden]{display:none}.panel-label{border-bottom:1px solid var(--ink-faint);letter-spacing:.22em;text-transform:uppercase;color:var(--ink-soft);justify-content:space-between;padding-bottom:12px;font-size:10px;display:flex}.panel-palette ul{grid-template-columns:22px auto 1fr auto;column-gap:14px;list-style:none;display:grid}.panel-palette li{grid-column:1/-1;grid-template-columns:subgrid;border-bottom:1px solid #1c1b1912;align-items:center;padding:11px 0;display:grid}.panel-palette .chip{width:22px;height:14px}.panel-palette .sw-cn{font-size:13px}.sw-hex{letter-spacing:.14em;color:var(--ink-soft);opacity:.7;font-variant-numeric:tabular-nums;font-size:10px}.panel-figure{flex-direction:column;flex:1;gap:6px;min-width:0;min-height:0;display:flex}.panel-figure[hidden]{display:none}.photo-strip{overscroll-behavior-x:contain;scrollbar-width:thin;scrollbar-color:var(--ink-faint) transparent;flex:1;gap:12px;min-height:0;padding-bottom:6px;display:flex;overflow:auto hidden}.photo-card{aspect-ratio:16/9;cursor:zoom-in;background:#e9e5de;border:0;flex:none;height:100%;padding:0;overflow:hidden}.photo-card img{object-fit:contain;width:100%;height:100%;transition:filter .3s var(--ease);display:block}.photo-card:hover img{filter:brightness(1.06)}.photo-card:focus-visible,.panel-back:focus-visible,.panel-details summary:focus-visible{outline:2px solid var(--ink-soft);outline-offset:-2px}.panel-figure figcaption{letter-spacing:.22em;text-transform:uppercase;color:var(--ink-soft);flex-shrink:0;justify-content:space-between;font-size:10px;display:flex}.lightbox{opacity:0;visibility:hidden;transition:opacity .4s var(--ease), visibility .4s;pointer-events:none;z-index:20;cursor:zoom-out;background:#1c1b19e0;place-items:center;padding:4vmin;display:grid;position:fixed;inset:0}.lightbox.is-open{opacity:1;visibility:visible;pointer-events:auto}.lightbox img{object-fit:contain;max-width:100%;max-height:100%}.lightbox-close{color:#fff;cursor:pointer;background:#1c1b1980;border:1px solid #fff6;border-radius:50%;width:44px;height:44px;font-size:28px;position:absolute;top:16px;right:20px}@media (width<=720px){:root{--detail-height:clamp(220px, 31vh, 280px)}.panel-header{gap:10px}.panel-index,.panel-en{display:none}.panel-back,.panel-details summary{letter-spacing:0;font-size:10px}.panel-cn{letter-spacing:0;font-size:16px}.panel-figure figcaption{letter-spacing:.06em;font-size:9px}.rooms{padding:14px 20px calc(14px + env(safe-area-inset-bottom));scrollbar-width:none;background:linear-gradient(transparent, var(--paper) 40%);flex-direction:row;gap:20px;inset:auto 0 0;overflow-x:auto;transform:none}.rooms::-webkit-scrollbar{display:none}.rooms button{flex:none;padding:6px 0}.rooms button .en,.rooms button:after{display:none}.caption{bottom:calc(76px + env(safe-area-inset-bottom))}.palette{grid-template-columns:20px auto;grid-auto-rows:13px;column-gap:10px;height:auto}.palette .sw-cn{font-size:10px}.hint{display:none}}@media (hover:none){.palette{display:none}}.night-toggle{appearance:none;height:44px;font:inherit;color:var(--ink-soft);cursor:pointer;z-index:6;transition:color .4s var(--ease), right .7s var(--ease);background:0 0;border:0;align-items:center;gap:9px;padding:0 2px;display:flex;position:fixed;top:clamp(20px,4vh,40px);right:calc(clamp(20px,4vw,48px) + 66px)}.night-toggle i{border:1px solid;border-radius:50%;width:12px;height:12px;position:relative;overflow:hidden}.night-toggle i:after{content:"";transition:transform .7s var(--ease);background:currentColor;border-radius:50%;position:absolute;inset:0;transform:translate(105%)}.night-toggle .cn{font-family:var(--serif);letter-spacing:.14em;font-size:13px}.night-toggle .en{letter-spacing:.22em;text-transform:uppercase;font-size:10px}.night-toggle:hover,.night-toggle[aria-pressed=true]{color:var(--ink)}.night-toggle[aria-pressed=true] i:after{transform:translate(34%)}body{transition:background-color .9s var(--ease), color .6s var(--ease)}body.is-night{--paper:#1a1815;--ink:#ede5d6;--ink-soft:#ede5d68f;--ink-faint:#ede5d629}body.is-night .panel{background:#1b1916e6}body.is-night .panel-palette li{border-bottom-color:#ece7dd12}body.is-night .chip{box-shadow:inset 0 0 0 1px #ece7dd24}body.is-night .photo-card{background:#23201c}@media (width<=720px){.night-toggle{gap:7px;right:78px}.night-toggle .en{display:none}}.floor-switch{right:230px}.caption{--cn-size:clamp(32px, 4vw, 56px);bottom:94px}.caption-cn{font-size:var(--cn-size)}body.is-focused .floor-switch{opacity:0;pointer-events:none}@media (width<=1000px) and (width>=721px){.floor-switch{top:140px;left:44px;right:auto}.panel-en{display:none}}@media (width<=720px){.floor-switch{left:20px;right:auto}.caption{--cn-size:30px;bottom:120px}.caption-en{max-width:320px;font-size:9px;line-height:1.6}.eyebrow{letter-spacing:.18em;max-width:230px;font-size:8px;line-height:1.7}.project-subtitle,.caption .palette{display:none}}@media (height<=600px){:root{--detail-height:clamp(148px, 40vh, 220px)}.panel{gap:6px;padding-top:8px}}@media (hover:none){.panel{-webkit-backdrop-filter:none;backdrop-filter:none;background:#f6f4eff7}body.is-night .panel{background:#1b1916f2}}
