/* Preserve all five hero chapters when the 3D renderer is unavailable. */
.hero-fallback[hidden],.model-poster[hidden],.webgl-help[hidden]{display:none!important}
.hero-poster{display:none}
html.hero-static #stage>canvas,html.hero-static #callouts{display:none!important}
html.hero-static #stage{pointer-events:none}
html.hero-static .hero-poster{display:block;position:absolute;left:var(--d0);top:var(--d1);width:var(--d2);height:var(--d3);opacity:0}
.hero-poster img{width:100%;height:100%;object-fit:contain;display:block}
.hero-fallback{position:absolute;z-index:7;left:24px;top:16px;max-width:320px;color:var(--ink);font:12px/1.65 Arial,'Microsoft YaHei',sans-serif}
.hero-fallback>summary{cursor:pointer;width:max-content;max-width:100%;padding:6px 12px;border:1px solid var(--rule);border-radius:20px;background:var(--bg)}
.hero-fallback[open]{padding:14px 16px;background:var(--bg);border:1px solid var(--rule);border-radius:14px;box-shadow:0 8px 32px #0003}
.hero-fallback[open]>summary{border:0;padding:0 0 10px}
.webgl-help p{margin-top:10px;color:var(--muted)}
.fallback-retry{display:inline-block;background:none;border:0;border-bottom:1px solid var(--accent);color:var(--accent);padding:3px 0;margin-top:12px;font:inherit}
@media(max-width:1600px){.hero-fallback{top:auto;bottom:90px;left:7%;max-width:min(320px,86%)}}
@media(max-width:700px){
 html.hero-static .hero-poster{left:var(--m0);top:var(--m1);width:var(--m2);height:var(--m3)}
 html.hero-static .hero-poster:is([data-frame="1"],[data-frame="2"],[data-frame="3"]){left:8%;top:14%;width:80%;height:31%}
 html.hero-static #experience .copy:is(.left,.right){top:49%}
 html.hero-static .hero-poster[data-frame="4"]{left:10%;top:51%;width:80%;height:28%}
 html.hero-static #experience>footer{bottom:88px}
 .hero-fallback{font-size:10px;top:8px;bottom:auto}
}
.model-static>canvas{display:none!important}
.model-poster{position:absolute;inset:4% 5% 25%;margin:0;display:flex;flex-direction:column;justify-content:center;gap:8px}
.model-poster img{display:block;width:100%;min-height:0;max-height:100%;object-fit:contain;border-radius:10px}
.model-poster figcaption{font:11px/1.4 Arial,sans-serif;color:#a9a5a0;text-align:center}
.preview-notice{position:absolute;bottom:3%;left:6%;right:6%;margin:0;color:#aaa;font:12px/1.6 Arial,'Microsoft YaHei',sans-serif;text-align:center}
@media(max-width:700px){.preview-notice{font-size:10px;line-height:1.5;bottom:1%}.model-poster{inset:1% 6% 30%}}
@media(max-width:700px){#hardware-visual #ports-canvas.model-static{top:clamp(210px,28vh,300px);height:32vh}}
@media(max-width:700px){#ports-canvas.model-static .model-poster img{transform:scale(1.35);transform-origin:center 55%}}