/* Each physical object opens its own reading surface. */
header{gap:20px}.edition{margin-left:auto}#ceiling-toggle{display:flex;align-items:center;gap:9px;min-height:42px}#ceiling-toggle small{margin:0}#ceiling-toggle[aria-pressed=false]{background:#26282c;color:#eee;border-color:#555}
#loading{left:50%;bottom:24px;transform:translateX(-50%);padding:12px 20px;border:1px solid #fff8;border-radius:25px;background:#e9e9e8dd;backdrop-filter:blur(14px);font-size:14px;z-index:8;white-space:nowrap}#loading button{border:0;background:none;text-decoration:underline;font:inherit;color:inherit}
dialog[open]{animation:screen-arrive .5s cubic-bezier(.16,1,.3,1) both}dialog.closing{animation:device-leave .48s cubic-bezier(.4,0,.8,.4) forwards}dialog::backdrop{background:#32363a25;backdrop-filter:blur(5px)}
.dialog-head{padding:22px 28px;align-items:center}.detail-heading h2{font-size:27px;letter-spacing:-1px;margin:5px 0}.detail-heading>span{font-size:12px;letter-spacing:1.7px}.dialog-head #close{font-size:14px}#content{height:calc(100% - 115px)}
@keyframes screen-arrive{from{opacity:0;transform:perspective(1400px) rotateY(-8deg) scale(.68)}to{opacity:1;transform:perspective(1400px) rotateY(0) scale(1)}}
@keyframes device-leave{to{opacity:0;transform:scale(.84) translateY(24px)}}
dialog.device-architecture{width:min(1120px,92vw);height:min(820px,88dvh);border:9px solid #191a1c;border-bottom-width:20px;border-radius:21px;box-shadow:0 0 0 2px #81858a,0 0 0 4px #d0d2d3,0 45px 100px #0005;background:#151719}
.device-architecture .dialog-head{background:#252729;padding:14px 22px}.device-architecture .detail-heading h2{font-size:20px}.device-architecture .detail-heading>span,.device-architecture #subtitle{display:none}.device-architecture #content{height:calc(100% - 68px);padding:0 18px 20px}.desktop-toolbar{height:48px;display:flex;align-items:center;justify-content:space-between;font-size:12px;letter-spacing:.06em;color:#9b9da1}.desktop-toolbar>span:first-child{letter-spacing:4px;color:#92969a}.device-architecture .film-stage{border-radius:4px}.device-architecture .film-stage video{height:calc(min(820px,88dvh) - 228px)}.device-architecture .film-caption{padding:0 6px}.device-architecture .film-caption .index{display:none}
dialog.device-aigc{width:min(1400px,94vw);height:auto;max-height:94dvh;aspect-ratio:16/10;background:#050607;border:5px solid #26282a;border-radius:5px;box-shadow:0 0 0 1px #8c9195,0 35px 150px #0009}
dialog.device-aigc[open]{animation:projection-on .55s ease both}.device-aigc::backdrop{background:#121417ab;backdrop-filter:blur(7px)}.device-aigc .dialog-head{position:absolute;inset:0 0 auto;z-index:2;background:linear-gradient(#000b,transparent);padding:23px 28px}.device-aigc .detail-heading>span,.device-aigc #subtitle{display:none}.device-aigc .detail-heading h2{font-size:19px}.device-aigc #content{height:100%;padding:0;overflow:hidden}.device-aigc .film-stage{height:100%;border-radius:0}.device-aigc .film-stage video{height:100%;min-height:0}.device-aigc .film-caption{display:none}.cinema-kicker{position:absolute;bottom:65px;left:28px;z-index:1;font-size:12px;letter-spacing:3px;pointer-events:none;color:#ffffff80}
@keyframes projection-on{0%{opacity:0;transform:scaleY(.015) scaleX(.7);filter:brightness(2)}45%{opacity:1;transform:scaleY(.5);filter:brightness(1.4)}100%{transform:none;filter:none}}
dialog.device-products{width:398px;max-width:94vw;height:min(820px,93dvh);border:8px solid #191b1e;border-radius:49px;background:#f1f2f2;box-shadow:0 0 0 2px #b4b7ba,0 0 0 4px #4d5155,0 32px 100px #0005;padding-top:30px}
dialog.device-products:before{content:'';position:absolute;top:10px;left:50%;transform:translateX(-50%);width:100px;height:24px;background:#101112;border-radius:25px;z-index:4}.device-products[open]{animation:phone-lift .5s cubic-bezier(.16,1,.3,1) both}.device-products .dialog-head{padding:24px 20px 19px;align-items:flex-start}.device-products .detail-heading>span{font-size:12px;letter-spacing:1px}.device-products .detail-heading h2{font-size:30px;max-width:240px;line-height:1.06}.device-products .dialog-head #close>span{display:none}.device-products .dialog-head #close b{width:30px;height:30px}.device-products #content{height:calc(100% - 144px);padding:0 17px 27px}.device-products:after{content:'';position:absolute;width:100px;height:4px;background:#222;bottom:9px;left:50%;transform:translateX(-50%);border-radius:5px}.device-products .project-card{display:block;padding:0;border:0;background:white;border-radius:22px;min-height:0;overflow:hidden}.device-products .project-visual{min-height:150px;border-radius:0;background:#dfe3e3}.device-products .project-monogram{font-size:73px}.device-products .project-info{padding:24px}.device-products .project-info h3{font-size:28px;margin-top:12px}.device-products .project-info p{font-size:16px;line-height:1.55}.device-products .action{display:flex;flex-direction:column;gap:3px;width:100%;border-radius:14px;padding:13px}.device-products .project-detail{margin:5px 4px}.device-products .project-detail h3{font-size:32px}.device-products .project-detail code{font-size:13px;padding:17px}
@keyframes phone-lift{from{opacity:0;transform:translateY(16vh) rotate(-7deg) scale(.64)}to{opacity:1;transform:none}}
dialog.device-photography{width:min(1250px,94vw);height:min(850px,90dvh);background:#e8e6df;border:0;border-radius:3px 12px 12px 3px;box-shadow:3px 3px #c4c2bb,6px 6px #eeece5,9px 9px #bab8b1,0 30px 90px #0004;overflow:visible}
dialog.device-photography[open]{animation:book-open .6s cubic-bezier(.16,1,.3,1) both}.device-photography .dialog-head{padding:23px 30px}.device-photography .detail-heading>span{display:none}.device-photography .detail-heading h2{font-family:Georgia,serif;font-weight:400;font-size:29px}.device-photography #content{height:calc(100% - 99px);padding:0 25px 22px;overflow:auto}.book-spread{display:grid;grid-template-columns:.65fr 1.35fr;min-height:calc(min(850px,90dvh) - 196px);perspective:1500px}.book-leaf{padding:45px 30px;background:linear-gradient(90deg,#f3f1e9 93%,#c5c2b8 100%);position:relative;display:flex;flex-direction:column}.book-leaf .eyebrow{font-size:12px;line-height:1.8;letter-spacing:1.5px}.book-leaf h3{font-family:Georgia,serif;font-weight:400;font-size:clamp(38px,4vw,67px);line-height:1.04;letter-spacing:-2px;margin:40px 0 25px}.book-leaf p{font-size:16px;line-height:1.7;color:#6e6b64}.book-edition{font-size:12px;letter-spacing:2px;color:#8b877e;margin-top:auto;padding-top:25px}.book-image-leaf{background:linear-gradient(90deg,#dbd8ce,#f7f5ed 5%);padding:22px;display:grid;place-items:center;transform-origin:left center}.device-photography .pdf-page{max-height:calc(min(850px,90dvh) - 240px);max-width:100%;box-shadow:none}.device-photography .pdf-page.expanded{max-height:none}.device-photography .page-controls button{background:#d9d7cf}.turn-next{animation:page-turn .52s ease}.turn-prev{animation:page-back .52s ease}
@keyframes book-open{from{opacity:0;transform:translateY(60px) perspective(1300px) rotateY(-26deg) scale(.7)}to{opacity:1;transform:none}}@keyframes page-turn{0%{transform:rotateY(-55deg);filter:brightness(.7)}100%{transform:rotateY(0);filter:none}}@keyframes page-back{0%{transform:rotateY(40deg);filter:brightness(.8)}100%{transform:rotateY(0);filter:none}}
dialog.device-music{width:min(900px,92vw);height:auto;max-height:90dvh;background:#252729;color:#eee;border:1px solid #8d9295;border-radius:8px}.device-music #content{height:auto;padding-bottom:30px}.device-music .record{background:#34373a;border:1px solid #656a6e;border-radius:4px;color:#eee}.device-music .record.playing{background:#151719;border-color:#d0d2d4}.device-music .track-number{color:#ddd;opacity:.5}.device-music .note{color:#b0b3b4}
@media(max-width:700px){header{gap:9px}.identity{margin-right:auto}#ceiling-toggle{padding:9px 13px;font-size:12px}#ceiling-toggle small{display:none}#reset{padding:9px 13px;font-size:12px}#reset small{display:none}#loading{max-width:95vw;white-space:normal;width:max-content;text-align:center;font-size:12px}dialog.device-architecture{width:96vw;height:80dvh;margin:auto;border-width:5px 5px 12px}.device-architecture .dialog-head{padding:12px}.device-architecture #content{padding:0 10px 15px}.desktop-toolbar{font-size:10px}.desktop-toolbar>span:last-child{display:none}.device-architecture .film-stage video{height:calc(80dvh - 210px)}dialog.device-aigc{width:97vw;height:70dvh;aspect-ratio:auto;margin:auto}.device-aigc .dialog-head{padding:17px}.device-aigc .detail-heading h2{font-size:17px}dialog.device-products{margin:auto;height:92dvh;width:min(390px,94vw)}dialog.device-photography{width:94vw;height:88dvh;margin:auto}.device-photography .dialog-head{padding:17px}.device-photography .detail-heading h2{font-size:25px}.device-photography #content{padding:0 12px 18px;height:calc(100% - 91px)}.book-spread{grid-template-columns:1fr;min-height:0}.book-leaf{display:none}.book-image-leaf{padding:12px;min-height:50dvh}.device-photography .pdf-page{max-height:60dvh}.device-photography .page-meta{display:none}dialog.device-music{margin:auto}.device-music .records{grid-template-columns:1fr}.device-music .record{min-height:160px}.device-music #content{max-height:65dvh;overflow:auto}.device-music .track-number{font-size:38px}.device-music .record strong{margin:10px 0}.cinema-kicker{font-size:10px;letter-spacing:1.5px;left:17px}}
@media(prefers-reduced-motion:reduce){dialog[open],dialog.closing,.turn-next,.turn-prev{animation-duration:.01ms!important}}

@media(min-width:701px) and (max-width:1200px){#intro{max-width:290px}#intro h1{font-size:52px}.intro-sub{font-size:15px}}

/* Maintain the requested visible transition; reduced motion uses a restrained fade. */
dialog[open]{animation-duration:.65s!important}dialog.closing{animation-duration:.6s!important}
@media(prefers-reduced-motion:reduce){dialog[open]{animation-name:quiet-arrive!important}.turn-next,.turn-prev{animation-name:quiet-arrive!important;animation-duration:.5s!important}}
@keyframes quiet-arrive{from{opacity:0}to{opacity:1}}