*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;font-family:Helvetica,Arial,'Microsoft YaHei',sans-serif}body{background:#071624;color:#f2f5f7}.studio{position:relative;width:100%;height:100vh;min-height:670px;overflow:hidden;background:radial-gradient(ellipse at 18% 56%,#0b3f6a50,transparent 48%),radial-gradient(ellipse at 91% 60%,#5c311d40,transparent 46%),linear-gradient(#050d18,#0a2235)}.light .studio{background:radial-gradient(ellipse at 25% 60%,#dde9eb,transparent 60%),linear-gradient(#f5f3ed,#e8e7df);color:#173e5b}header{position:absolute;z-index:5;top:38px;left:48px;right:48px;display:flex;justify-content:space-between;align-items:center;pointer-events:none}.logo{width:210px}header span{font-size:11px;letter-spacing:.18em;color:#90afc4}.floor{position:absolute;width:75%;height:18%;left:13%;bottom:16%;border-radius:50%;background:radial-gradient(ellipse,#2c669930,transparent 67%);filter:blur(25px)}.light .floor{background:radial-gradient(ellipse,#263b4020,transparent 67%)}.view{position:absolute;inset:70px 5% 105px}model-viewer{position:absolute;inset:0;width:100%;height:100%;--poster-color:transparent;outline:none;opacity:0;pointer-events:none;transition:opacity .45s}model-viewer.active{opacity:1;pointer-events:auto}.caption{position:absolute;z-index:3;left:48px;top:43%;pointer-events:none;max-width:300px}.caption small{color:#e9a37b;font-size:11px;letter-spacing:.2em}.caption h1{font-size:35px;font-weight:400;line-height:1.35;letter-spacing:-.03em;margin:18px 0 16px}.caption p{font-size:14px;color:#91acc0;line-height:1.6;margin:0}.measure{position:absolute;right:48px;top:40%;z-index:3;pointer-events:none;display:grid;gap:22px;text-align:right}.measure b{font-weight:300;font-size:24px;display:block;letter-spacing:-.02em}.measure span{font-size:10px;color:#8da7b7;letter-spacing:.05em}.toolbar{position:absolute;bottom:38px;left:48px;right:48px;display:flex;gap:8px;flex-wrap:wrap;align-items:center;z-index:6}.toolbar button{border:1px solid #9db4c333;background:#0c263cbd;color:inherit;padding:12px 17px;cursor:pointer;border-radius:3px;font:inherit;font-size:11px;letter-spacing:.01em;backdrop-filter:blur(8px)}.toolbar button[aria-pressed=true]{background:#e8f0f4;color:#16344c;border-color:#e8f0f4}.toolbar i{flex:1}.light .toolbar button{background:#ffffffa0;border-color:#173e5b30}.light .toolbar button[aria-pressed=true]{background:#173e5b;color:white}.light header span,.light .caption p,.light .measure span{color:#6d818d}.loading{position:absolute;inset:0;display:grid;place-items:center;background:#071624;z-index:10;font-size:14px;letter-spacing:.1em}.ready .loading{display:none}.error .loading{color:#e6ac87}.shot-title{display:none;position:absolute;left:64px;bottom:82px;z-index:7;pointer-events:none}.shot-title small{color:#e3a175;font-size:13px;letter-spacing:.22em}.shot-title h2{font-weight:350;font-size:42px;margin:20px 0 12px;letter-spacing:-.02em}.shot-title p{font-size:19px;color:#96b2c8;margin:0}.film .toolbar,.film .caption,.film .measure,.film header span{display:none}.film .view{inset:10px 0 25px}.film .shot-title{display:block}.film header{top:45px;left:62px}.film .logo{width:245px}.film .floor{bottom:4%;width:90%;left:5%}.fade{position:absolute;inset:0;background:#030a12;opacity:0;z-index:20;pointer-events:none}.film model-viewer{transition:none}.demo-tip{display:none;position:absolute;right:48px;bottom:135px;font-size:14px;background:#0b2235e8;border-left:2px solid #efa570;padding:15px 21px;z-index:15;color:#e6f0f7}.demo .demo-tip{display:block}.cursor{display:none;position:absolute;width:22px;height:22px;border:2px solid #ffb37b;border-radius:50%;transform:translate(-50%,-50%);z-index:30;pointer-events:none;box-shadow:0 0 20px #e6a77065}.demo .cursor{display:block}.cursor.down{width:32px;height:32px;background:#e8a16b44}button:focus-visible{outline:2px solid #f1a975;outline-offset:3px}
@media(max-width:700px){.studio{min-height:870px}header{top:25px;left:25px;right:25px}.logo{width:155px}header span{font-size:8px;letter-spacing:.05em;max-width:100px;text-align:right}.caption{top:105px;left:25px;max-width:280px}.caption small{font-size:9px}.caption h1{font-size:26px;margin:10px 0 8px}.caption p{font-size:12px}.view{inset:195px 0 185px}.measure{top:auto;right:25px;left:25px;bottom:175px;display:flex;justify-content:space-between;text-align:left;gap:8px}.measure b{font-size:21px}.measure span{font-size:9px}.toolbar{left:25px;right:25px;bottom:25px;gap:6px}.toolbar button{padding:10px 11px;font-size:10px}.toolbar i{display:none}.floor{bottom:27%}.demo-tip{bottom:195px;right:25px}.film .studio{min-height:0}.film .view{inset:0}.film .shot-title{left:6vw;bottom:7vh}.film .shot-title h2{font-size:30px}}

.focus-detail .caption,.focus-detail .measure{opacity:0}

/* Compact same-origin website embed. */
body.embed{overflow:hidden;background:#071624}
.embed .studio{height:100vh;min-height:0;background:radial-gradient(ellipse at 18% 56%,#0b3f6a40,transparent 48%),radial-gradient(ellipse at 91% 60%,#5c311d28,transparent 46%),#071624}
.embed header,.embed .caption{display:none}

.embed .view{inset:8px 2% 140px}
.embed .measure{top:auto;left:50%;right:auto;bottom:78px;width:min(620px,calc(100% - 48px));transform:translateX(-50%);display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;text-align:center}
.embed .measure b{font-size:22px;font-weight:400;line-height:1.3}.embed .measure span{display:block;margin-top:3px;font-size:12px;line-height:1.4;letter-spacing:0;color:#b3c6d4}
.embed .toolbar{left:22px;right:22px;bottom:18px;justify-content:center;gap:7px}
.embed .toolbar i{display:none}.embed .toolbar button{font-size:12px;padding:10px 15px;min-height:40px;line-height:1.25}
.embed .floor{bottom:22%;height:14%}
.embed.light .studio{background:radial-gradient(ellipse at 25% 60%,#dde9eb,transparent 60%),#f0f0e9}
.embed.light .measure span{color:#506b7d}
@media(max-width:700px){.embed .view{inset:8px 0 180px}.embed .measure{bottom:115px;gap:10px;width:calc(100% - 28px)}.embed .measure b{font-size:21px}.embed .measure span{font-size:12px;line-height:1.4;min-height:34px}.embed .toolbar{left:12px;right:12px;bottom:14px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}.embed .toolbar button{font-size:12px;padding:5px;min-height:40px;letter-spacing:0}.embed #rotate{grid-column:span 2}.embed .floor{bottom:32%}}

model-viewer::part(default-progress-bar){display:none}
