/* Symbolic architectural studies, with real-world references revealed on tap. */
body[data-page=home]{--signal:#ef895d;background:#232622}
.cinema{background:#232622;min-height:760px;overflow:clip}
.cinema-visual{inset:-48px;transition:transform .45s cubic-bezier(.2,.7,.2,1)}
.cinema-frame{transform:translate3d(28px,0,0);transition:opacity .6s ease,transform .85s cubic-bezier(.2,.75,.2,1)}
.cinema-frame.is-active{transform:translate3d(0,0,0)}
.cinema-shade{background:linear-gradient(90deg,rgba(35,38,34,.22),transparent 50%);pointer-events:none}
.editorial-board{position:absolute;left:45%;right:7%;top:20%;bottom:23%;isolation:isolate}
.board-grid{position:absolute;inset:-20px;background-image:linear-gradient(#d4d7c411 1px,transparent 1px),linear-gradient(90deg,#d4d7c411 1px,transparent 1px);background-size:48px 48px;mask-image:linear-gradient(135deg,#000,transparent 85%)}
.board-index{position:absolute;left:-12%;top:-13%;font-size:clamp(100px,19vw,300px);line-height:1;letter-spacing:-.07em;color:#a1aa9511;font-weight:500;z-index:-1}
.editorial-photo{position:absolute;right:10%;top:0;width:71%;height:100%;display:block;transform:rotate(3deg);transition:transform .7s cubic-bezier(.2,.7,.2,1),opacity .5s;box-shadow:0 20px 55px #0004;border:8px solid #cfccb9;overflow:hidden}
.cinema-frame .editorial-photo img{object-position:50% 49%;height:100%;width:100%;object-fit:cover}
.image-caption{position:absolute;bottom:-42px;right:10%;font-size:9px;line-height:1.5;letter-spacing:.055em;color:#e2dfd2a3;max-width:76%;text-align:right}
.board-cross{position:absolute;right:-2%;top:4%;font:35px/1 Arial,sans-serif;font-weight:200;color:var(--signal)}
.abstract-composition{position:absolute;left:3%;bottom:7%;width:37%;aspect-ratio:1;z-index:1;pointer-events:none;transition:transform .7s,opacity .5s}
.abstract-composition span{display:block;position:absolute;inset:0;border:1px solid #ef895d80;border-radius:50%}
.abstract-composition i{position:absolute;left:50%;top:-16%;bottom:-16%;width:1px;background:#ef895d80;transform:rotate(38deg)}
.drawing-layer{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;opacity:0;transform:translate3d(-25px,25px,0) scale(.92);transition:opacity .45s,transform .7s cubic-bezier(.2,.7,.2,1);z-index:3;pointer-events:none}
.cinema-frame .drawing-layer img{object-fit:contain;object-position:center;width:100%;height:calc(100% - 36px);filter:drop-shadow(0 18px 25px #0003)}
.drawing-caption{display:block;font-size:9px;line-height:1.6;letter-spacing:.045em;color:#e9e5d9;margin-top:14px;text-align:center}
.cinema-frame.is-detail .drawing-layer{opacity:1;transform:translate3d(0,0,0) scale(1)}
.cinema-frame.is-detail .editorial-photo{transform:translate3d(80px,-5px,0) rotate(8deg) scale(.84);opacity:.23}
.cinema-frame.is-detail .abstract-composition{transform:translate(-40px,20px) rotate(55deg);opacity:.35}
.board-design .editorial-photo{width:82%;height:76%;top:11%;right:8%;transform:rotate(-5deg);border:0}
.board-design .abstract-composition{width:46%;left:-3%;top:-7%;bottom:auto;z-index:-1;background:#db8057;border-radius:50%;}
.board-design .abstract-composition span{border:0;background:#d8d6c4;inset:17% -38% 17% 68%;border-radius:0;transform:rotate(28deg)}
.board-design .abstract-composition i{width:45%;height:45%;top:75%;left:30%;border:18px solid #5574ac;background:transparent;border-radius:50%}
.board-design .drawing-layer{inset:55% -1% -2% 49%;opacity:1;transform:rotate(7deg);padding:10px;background:#e8e5db;box-shadow:0 10px 35px #0005}
.board-design .drawing-layer img{height:100%;filter:none}.board-design .drawing-caption{display:none}
.cinema-frame.is-detail .board-design .drawing-layer{inset:6% -1% 3% -1%;padding:18px;transform:rotate(0deg);justify-content:center;transition:inset .7s cubic-bezier(.2,.7,.2,1),transform .7s,opacity .45s}
.cinema-frame.is-detail .board-design .drawing-layer img{height:calc(100% - 35px)}
.cinema-frame.is-detail .board-design .drawing-caption{display:block;color:#3d453b;font-size:8px}
.board-construction .editorial-photo{width:92%;height:85%;right:1%;top:8%;transform:rotate(2deg);border-color:#9da399;border-width:5px}
.board-construction .abstract-composition{left:-8%;bottom:-2%;width:26%;border:1px solid #89a6bc;transform:rotate(-12deg);background:linear-gradient(135deg,#7190a422,#db865022)}
.board-construction .abstract-composition span{inset:15%;border-color:#89a6bc;border-radius:0}
.board-construction .abstract-composition i{background:#89a6bc;transform:rotate(0deg)}
.board-construction .drawing-layer{inset:-12% -8% -3% -11%}
.board-construction .drawing-caption{letter-spacing:.06em}
.chapter-copy{width:53vw;top:50%;z-index:4}
.chapter-copy :is(h1,h2){font-size:clamp(64px,7vw,112px);letter-spacing:-.065em}
.chapter-description{font-size:13px;line-height:1.75;max-width:33em}
.chapter-actions{display:flex;gap:16px;align-items:center;flex-wrap:wrap;margin-top:27px}
.chapter-action{margin:0;min-height:52px;background:var(--signal);border:1px solid var(--signal);color:#1b201c;padding:0 18px;gap:24px;font-size:12px;transition:background .2s,transform .15s}
.chapter-action:hover{background:#f4ab84;color:#18201b}.chapter-action:active{transform:scale(.97)}
.layer-toggle{display:inline-flex;align-items:center;gap:9px;min-height:52px;padding:0 12px;color:#f4f0e7;border:1px solid #e7e9df70;background:#232622a6;font:11px var(--sans);cursor:pointer;transition:background .2s,transform .15s,border-color .2s}
.layer-toggle:hover,.layer-toggle[aria-pressed=true]{background:#f4f0e719;border-color:#f4f0e7}
.layer-toggle:active{transform:scale(.96);background:#f4f0e733}
.layer-icon{font-size:20px;font-weight:300;line-height:1;transition:transform .3s}.layer-toggle[aria-pressed=true] .layer-icon{transform:rotate(45deg)}
.cinema-bottom{bottom:72px;gap:35px;z-index:5}
.chapter-nav{width:min(670px,63vw);gap:8px}
.chapter-nav button{min-height:75px;padding:15px;border:1px solid #e4e4d239;background:#40463c65;align-items:center;gap:10px;transition:background .25s,color .25s,transform .15s}
.chapter-nav button::before{display:none}
.chapter-nav button[aria-pressed=true]{background:#e9e5d9;color:#232622;border-color:#e9e5d9}
.chapter-nav button[aria-pressed=true] .chapter-number,.chapter-nav button[aria-pressed=true] .chapter-label small{color:#596052}
.chapter-label{display:flex;flex-direction:column;gap:8px;font-size:15px}.chapter-label small{font-size:8px;white-space:nowrap;letter-spacing:.02em;color:#d7d9c8a3;font-weight:400}
.chapter-nav button .chapter-mark{font-size:17px;color:inherit;transform:none!important}
.chapter-nav button[aria-pressed=true] .chapter-mark{color:#af542e}
.chapter-nav button:active{transform:scale(.96);background:#d4b699;color:#232622}
.chapter-number{align-self:flex-start;margin-top:3px}
.scene-steppers{right:var(--gutter);top:50%;z-index:5;flex-direction:column}
.scene-steppers button{background:#232622bb;width:44px;height:44px}
.cinema-fine{align-items:center;bottom:17px;z-index:5}
.interaction-cue{font-size:10px;color:#f1ede0c4}.interaction-cue::before{font-size:19px}
.cinema-directory a{font-size:10px;min-height:44px}
@media(min-width:701px){.cinema-overline{top:128px}.chapter-copy{transform:translate3d(0,calc(-50% + 20px),0)}.chapter-copy.is-active{transform:translate3d(0,-50%,0)}}
@media(max-width:1100px) and (min-width:701px){.chapter-actions{gap:10px}.chapter-action,.layer-toggle{font-size:10px;padding-inline:12px}.editorial-board{left:45%;right:9%;top:24%;bottom:29%}.chapter-copy :is(h1,h2){font-size:8vw}.chapter-nav{width:100%}}
@media(max-width:700px){
 .cinema{min-height:730px;height:100svh;max-height:1100px}
 .cinema-header{padding-top:24px}
 .cinema-overline{top:91px;font-size:8px}
 .editorial-board{left:18%;right:14%;top:20%;bottom:47%}
 .board-grid{inset:-15px;background-size:29px 29px}
 .board-index{font-size:130px;left:-17%;top:-10%}
 .editorial-photo{width:72%;right:13%;border-width:5px;transform:rotate(4deg)}
 .board-cross{right:-6%;top:3%;font-size:28px}
 .image-caption{font-size:7px;bottom:-21px;right:3%;max-width:100%}
 .board-design .editorial-photo{height:77%;top:12%;width:97%;right:0}
 .board-design .drawing-layer{inset:60% -8% -1% 47%;padding:5px}
 .board-construction .editorial-photo{width:100%;height:89%;top:2%;right:0;border-width:3px}
 .board-construction .drawing-layer{inset:-12% -20% -6% -20%}
 .drawing-caption{font-size:7px;margin-top:8px}
 .cinema-frame.is-detail .board-design .drawing-layer{inset:6% -16% 0 -16%;padding:7px}
 .cinema-frame.is-detail .board-design .drawing-caption{font-size:6px;line-height:1.5;margin-top:6px}
 .cinema-frame.is-detail .editorial-photo{transform:translate3d(30px,0,0) rotate(9deg) scale(.84)}
 .chapter-copy{left:24px;right:24px;top:auto;bottom:190px;width:auto;transform:translate3d(0,14px,0)}
 .chapter-copy.is-active{transform:translate3d(0,0,0)}
 .chapter-copy :is(h1,h2){font-size:clamp(40px,11vw,66px);line-height:1.02;letter-spacing:-.062em}
 .chapter-kicker{font-size:8px;margin-bottom:10px}
 .chapter-description{font-size:11px;line-height:1.6;margin-top:13px;max-width:100%}
 .chapter-actions{margin-top:17px;gap:9px;flex-wrap:nowrap}
 .chapter-action{min-height:48px;font-size:10px;padding:0 12px;gap:11px;flex:1;justify-content:space-between}
 .chapter-action .icon-arrow{width:17px}
 .layer-toggle{min-height:48px;padding:0 9px;gap:6px;font-size:9px;max-width:51%;justify-content:center;flex:1}
 .layer-icon{font-size:18px;flex-shrink:0}
 .cinema-bottom{left:24px;right:24px;bottom:83px}
 .chapter-nav{width:100%;gap:6px}
 .chapter-nav button{min-height:70px;padding:11px 9px;gap:6px;position:relative;align-items:flex-start}
 .chapter-number{font-size:6px;margin-top:1px}
 .chapter-label{font-size:11px;gap:10px}
 .chapter-label small{font-size:6px;letter-spacing:0}
 .chapter-mark{display:none}
 .scene-steppers{display:none}
 .cinema-fine{left:24px;right:24px;bottom:14px;gap:5px;align-items:end}
 .interaction-cue{position:absolute;bottom:40px;font-size:9px!important;opacity:.85;left:0;right:0;justify-content:center;white-space:nowrap}
 .mobile-cue{font-size:9px}
 .interaction-cue::before{font-size:16px;margin-right:6px}
 .cinema-directory{margin-left:auto;gap:22px}
 .cinema-directory a{min-height:35px;font-size:10px}
 .cinema[data-engaged=true] .interaction-cue{opacity:.48}
 .cinema:not([data-engaged=true]) .chapter-nav button:nth-child(2){animation:tap-invitation 1.3s 1s 2}
 html[lang=zh-Hans] .chapter-copy :is(h1,h2){font-size:clamp(35px,10.2vw,61px);line-height:1.16;letter-spacing:-.035em}
 html[lang=zh-Hans] .chapter-description{font-size:11px;line-height:1.7}
 html[lang=zh-Hans] .chapter-label{font-size:12px}
}
@keyframes tap-invitation{50%{border-color:#ef895dcf;background:#5e5444}}
@media(max-width:350px){.chapter-copy,.cinema-bottom,.cinema-fine{left:20px;right:20px}.chapter-copy :is(h1,h2){font-size:36px}.editorial-board{top:20%;bottom:48%}.chapter-copy{bottom:189px}.chapter-description{font-size:10px}.chapter-label{font-size:10px}.chapter-nav button{padding-inline:7px}.chapter-action{font-size:9px;padding-inline:9px;gap:6px}.layer-toggle{font-size:8px;padding-inline:7px}.chapter-actions{gap:6px}.cinema-directory a{font-size:9px}}
@media(prefers-reduced-motion:reduce){.editorial-photo,.drawing-layer,.abstract-composition,.layer-toggle,.layer-icon,.chapter-nav button,.chapter-action{transition:none!important;animation:none!important}.cinema-frame.is-detail .board-design .drawing-layer{transition:none}.cinema-visual{inset:0}.chapter-nav button{animation:none!important}}

/* Abstract objects are the primary visual; real-world references are one tap away. */
.symbol-art{position:absolute;inset:-7% -3% -7% -3%;z-index:2;transition:opacity .55s,transform .75s cubic-bezier(.2,.7,.2,1)}
.cinema-frame .symbol-art img{width:100%;height:100%;object-fit:contain;object-position:center;filter:none}
.editorial-board .editorial-photo{opacity:0;transform:translate3d(30px,12px,0) rotate(4deg) scale(.92);pointer-events:none}
.editorial-board .drawing-layer{opacity:0;inset:0;transform:translate3d(0,20px,0) scale(.9)}
.board-grid{opacity:.4}.board-index{opacity:.4}.board-cross{display:none}
.board-design .drawing-layer{inset:7% -2% 0 -2%;padding:14px;box-shadow:none}
.board-design .drawing-layer img{height:calc(100% - 30px)}
.board-design .drawing-caption{display:block;color:#3d453b;font-size:8px}
.board-real-estate .drawing-layer,.board-construction .drawing-layer{display:none}
.cinema-frame.is-detail .symbol-art{opacity:.12;transform:translate3d(-40px,0,0) scale(.86)}
.cinema-frame.is-detail .editorial-board .editorial-photo{opacity:1;transform:translate3d(0,0,0) rotate(3deg) scale(1);z-index:3}
.cinema-frame.is-detail .board-design .editorial-photo{opacity:0}
.cinema-frame.is-detail .board-design .drawing-layer{opacity:1;inset:7% -2% 0 -2%;transform:translate3d(0,0,0) scale(1);padding:14px}
.art-action{position:absolute;z-index:3;left:46%;right:9%;top:20%;bottom:24%;display:flex;justify-content:flex-end;align-items:flex-end;gap:9px;padding:8px;background:transparent;border:0;color:#e7e9da;font:10px var(--sans);cursor:pointer;touch-action:pan-y;text-align:right}
.art-action[hidden]{display:none!important}
.art-target{display:grid;place-items:center;width:32px;height:32px;border:1px solid #e9e5d975;border-radius:50%;font-size:21px;line-height:1;transition:background .2s,transform .2s}
.art-action [data-layer-button-label]{padding-bottom:8px}
.art-action:hover .art-target,.art-action:active .art-target{background:#e9e5d922;transform:scale(1.12)}
.art-action[aria-pressed=true] .art-target{transform:rotate(45deg)}
.image-caption{bottom:-10px;right:8%;text-align:center;width:84%;max-width:84%;font-size:9px}
@media(max-width:700px){
 .editorial-board{top:183px;bottom:auto;height:clamp(180px,calc(100svh - 565px),320px);left:16%;right:13%}
 .symbol-art{inset:-11% -17% -11% -17%}
 .board-index{font-size:100px;left:-11%;top:1%}
 .board-grid{display:none}
 .image-caption{bottom:-17px;font-size:7px;opacity:.65}
 .art-action{left:10%;right:9%;top:139px;bottom:auto;height:clamp(180px,calc(100svh - 565px),320px);padding:0;align-items:flex-end;font-size:8px;gap:5px}
 .art-target{width:27px;height:27px;font-size:18px}
 .art-action [data-layer-button-label]{padding-bottom:6px}
 .cinema-frame.is-detail .editorial-board .editorial-photo{transform:rotate(3deg);width:84%;right:8%;height:100%;top:0}
 .board-design .drawing-layer,.cinema-frame.is-detail .board-design .drawing-layer{inset:4% -14% 1% -14%;padding:7px}
 .cinema-frame.is-detail .board-design .drawing-caption{font-size:6px}
}
@media(max-width:350px){.editorial-board{top:177px}.art-action{top:133px}}
@media(prefers-reduced-motion:reduce){.symbol-art,.art-target{transition:none!important}}
@media(max-width:700px){.chapter-action{font-size:11px}.layer-toggle{font-size:10px}.chapter-label{font-size:12px}.chapter-label small{font-size:7px}html[lang=zh-Hans] .chapter-label{font-size:14px}.cinema:not([data-engaged=true]) .chapter-nav button:nth-child(2){animation:none}.cinema:not([data-engaged=true]) .art-target{animation:tap-invitation 1.3s 1s 2}}
@media(max-width:350px){.chapter-action{font-size:10px}.layer-toggle{font-size:9px}.chapter-label{font-size:10px}.chapter-label small{font-size:6px}html[lang=zh-Hans] .chapter-label{font-size:12px}}
@media(prefers-reduced-motion:reduce){.art-target{animation:none!important}}