:root{color-scheme:light;--ink:#182c36;--muted:#657780;--line:#d9e1e5;--paper:#f6f8f9;--accent:#224e54;--focus:#137c8b;font-family:Inter,"Segoe UI",Arial,sans-serif;font-synthesis:none}
*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink)}button{font:inherit}button,summary{-webkit-tap-highlight-color:transparent}button:focus-visible,summary:focus-visible,canvas:focus-visible{outline:3px solid var(--focus);outline-offset:4px}[hidden]{display:none!important}
.page{width:min(1480px,100%);margin:0 auto;padding:36px 48px 22px}.page-header{display:flex;justify-content:space-between;align-items:center;gap:28px;margin-bottom:28px}.brand{display:flex;align-items:center;gap:11px;font-size:10px;letter-spacing:1.6px;font-weight:700;color:#516a74}.brand-mark{width:34px;height:34px;display:grid;place-items:center;border:1px solid #c4d5d9;border-radius:10px;background:#e7eff0;color:#2b5b62;font-size:16px;letter-spacing:-.7px}.brand-divider{color:#a4b4bc;padding:0 7px}h1{font-size:clamp(24px,2.45vw,38px);line-height:1.19;font-weight:650;letter-spacing:-1.05px;margin:20px 0 12px;max-width:900px}.intro{font-size:14px;line-height:1.5;color:var(--muted);margin:0}.project-tag{display:flex;align-items:center;gap:9px;white-space:nowrap;font-size:12px;color:#526d76;border:1px solid #d8e3e6;padding:10px 14px;border-radius:50px;background:#fff8}.project-tag svg{width:17px;height:17px;stroke:#507b82;stroke-width:1.5}
.viewer-shell{border:1px solid #d3dde2;border-radius:20px;overflow:hidden;background:#e9eef1;box-shadow:0 12px 36px #223e4d08}.stage{position:relative;height:clamp(440px,62vh,730px);min-height:360px;isolation:isolate}.model-viewport{position:absolute;inset:0}.model-viewport canvas{display:block;width:100%;height:100%;touch-action:none}.stage-caption{position:absolute;left:24px;top:23px;display:flex;align-items:center;gap:9px;color:#6a7d87;font-size:10px;letter-spacing:1.5px;pointer-events:none}.caption-line{height:1px;width:20px;background:#8ea6b0}.model-status{position:absolute;right:23px;top:18px;color:#5e747e;font-size:11px;background:#f7fafbcc;padding:7px 10px;border-radius:6px;pointer-events:none}
.viewer-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:13px 18px;background:#ffffffed;border-top:1px solid #d8e1e6}.view-buttons{display:flex;align-items:center;gap:7px;flex-wrap:wrap}.button{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:39px;padding:9px 14px;border:1px solid #d9e2e5;border-radius:8px;background:#fff;color:#38525e;font-size:12px;font-weight:550;line-height:1.2;cursor:pointer;transition:background .15s,border-color .15s,box-shadow .15s}.button:hover:not(:disabled){background:#f0f5f6;border-color:#a9bfc7}.button:active:not(:disabled){background:#e0ebee}.button:disabled{opacity:.43;cursor:default}.button svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}.button-primary{background:var(--accent);border-color:var(--accent);color:#fff}.button-primary:hover:not(:disabled){background:#183f45;border-color:#183f45}.button-primary:active:not(:disabled){background:#10353b}.fullscreen-button{flex:none}
.status-overlay{position:absolute;inset:0;display:grid;place-items:center;background:#e9eef1e8;padding:24px;z-index:3}.status-card{max-width:370px;width:100%;text-align:center}.status-card h2{font-size:18px;letter-spacing:-.3px;font-weight:600;margin:21px 0 9px}.status-card p{font-size:13px;line-height:1.6;color:var(--muted);margin:0 0 17px}.loader{width:35px;height:35px;border:2px solid #cad9df;border-top-color:#2c6870;border-radius:50%;display:block;margin:0 auto;animation:turn 1s linear infinite}progress{width:210px;max-width:100%;height:5px;border:none;border-radius:5px;overflow:hidden;accent-color:#2c6870;background:#d1dfe3}progress::-webkit-progress-bar{background:#d1dfe3;border-radius:5px}progress::-webkit-progress-value{background:#2c6870;border-radius:5px}progress::-moz-progress-bar{background:#2c6870;border-radius:5px}.status-card details{margin-top:16px;color:#6b7e86;font-size:12px}.status-card summary{cursor:pointer}.status-card details p{margin-top:10px;font-size:11px;overflow-wrap:anywhere}.noscript-message{position:absolute;inset:0;z-index:5;display:grid;place-items:center;padding:30px;background:#e9eef1;color:var(--ink)}
.interaction-help{display:flex;justify-content:space-between;gap:20px;align-items:center;margin-top:14px;color:#7a8b93;font-size:11px}.desktop-help{margin:0;display:flex;gap:22px;flex-wrap:wrap;line-height:1.6}.desktop-help strong{color:#536e7b;font-weight:600;margin-right:5px}.keyboard-tip{color:#83939b}.touch-help{display:none;margin:0;line-height:1.7}.touch-help span{padding:0 5px;color:#9badb5}.model-note{white-space:nowrap;color:#8b9ba3;font-size:10px}.action-notice{min-height:15px;margin:6px 0 0;font-size:12px;color:#526d76}footer{display:flex;justify-content:space-between;gap:15px;border-top:1px solid #e1e7ea;margin-top:14px;padding-top:14px;font-size:10px;letter-spacing:.4px;color:#8d9ca4}
.viewer-shell:fullscreen{width:100vw;height:100dvh;border:none;border-radius:0;display:flex;flex-direction:column}.viewer-shell:fullscreen .stage{flex:1;height:auto;min-height:0}.viewer-shell:fullscreen .viewer-toolbar{padding-bottom:max(13px,env(safe-area-inset-bottom))}
@keyframes turn{to{transform:rotate(360deg)}}
@media(max-width:850px){.page{padding:26px 24px 18px}.page-header{align-items:flex-start}.project-tag{font-size:0;width:37px;height:37px;padding:9px;justify-content:center;margin-top:1px}.project-tag svg{flex:none}h1{letter-spacing:-.7px}.keyboard-tip{display:none}.model-note{display:none}.stage{height:59vh}}
@media(max-width:540px){.page{padding:20px 14px 14px}.page-header{gap:10px;margin-bottom:21px}.brand{font-size:8px;letter-spacing:1px;gap:8px}.brand-mark{width:29px;height:29px;font-size:14px;border-radius:8px}.brand-divider{padding:0 3px}h1{font-size:25px;letter-spacing:-.7px;line-height:1.17;margin-top:17px}.desktop-break{display:none}.intro{font-size:12px}.project-tag{display:none}.viewer-shell{border-radius:14px}.stage{height:56svh;min-height:350px;max-height:650px}.stage-caption{left:16px;top:19px;font-size:8px;letter-spacing:1px}.model-status{right:13px;top:13px;font-size:10px;padding:6px 8px}.viewer-toolbar{padding:10px;gap:8px;flex-wrap:wrap}.view-buttons{gap:6px;flex:1}.button{font-size:11px;padding:9px 10px;min-height:38px}.button svg{width:14px;height:14px}.fullscreen-button{padding:10px}.fullscreen-button span{display:none}.interaction-help{margin-top:11px;font-size:10px;gap:0}.desktop-help{display:none}.touch-help{display:block}footer{font-size:9px;letter-spacing:.15px;line-height:1.5;flex-wrap:wrap;margin-top:9px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}