/* Exact source-image details, native controls, and stable shared geometry. */
.component-hotspots{position:absolute;inset:0;pointer-events:none;z-index:4;direction:ltr}
.component-hotspot{position:absolute;pointer-events:auto;margin:0;padding:0;border:1px solid transparent;border-radius:4px;background:transparent;transition:border-color .16s,background .16s}
.component-hotspot:hover,.component-hotspot[aria-expanded="true"]{border-color:var(--light);background:rgba(153,185,222,.13);box-shadow:0 0 18px rgba(153,185,222,.3)}
.component-controls{position:absolute;z-index:6;display:grid;grid-template-columns:repeat(8,minmax(44px,1fr));gap:5px;direction:ltr}
.component-hint{grid-column:1/-1;font-size:12px;color:var(--light);margin-bottom:3px;line-height:1.35}
.component-choice{min-height:44px;min-width:44px;padding:5px;color:var(--light);border:1px solid var(--line);background:var(--blue);font-size:12px;font-variant-numeric:tabular-nums;transition:background .16s,color .16s}
.component-choice:hover,.component-choice[aria-expanded="true"]{background:var(--light);color:var(--blue);border-color:var(--light)}
.component-card{position:absolute;z-index:5;padding:22px;background:var(--blue);border:1px solid var(--light);box-shadow:0 14px 45px rgba(0,0,0,.25);overflow:auto;overscroll-behavior:contain;text-align:start}
.component-close{position:absolute;top:4px;right:4px;z-index:1;min-width:44px;min-height:44px;color:white;background:var(--blue);border:0;font-size:26px}
.component-magnifier{display:block;width:100%;height:190px;overflow:hidden;background:radial-gradient(ellipse,rgba(153,185,222,.14),transparent 68%);margin-bottom:14px}
.component-number{display:block;font-size:12px;letter-spacing:.1em;color:var(--light);margin-bottom:8px}
.component-title{font-size:26px;line-height:1.12;letter-spacing:-.02em;overflow-wrap:break-word}
.component-description{font-size:16px;line-height:1.45;color:var(--light);margin-top:12px}
.component-card[hidden],.component-controls[hidden],.component-hotspots[hidden]{display:none!important}
.landing-screen>.component-controls{left:5%;bottom:94px;width:min(420px,42%)}
.landing-screen>.component-card{left:5%;top:90px;width:43%;max-height:calc(100% - 265px);display:grid;grid-template-columns:minmax(80px,.7fr) minmax(0,1fr);gap:18px;align-items:center}
.landing-screen .component-magnifier{height:180px;margin:0}
.landing-screen .component-title{font-size:23px}
.landing-screen .component-description{font-size:15px}
.landing-screen[data-inspecting="true"] .landing-copy{visibility:hidden;opacity:0}
.module-panel[data-components-ready="true"]{min-height:810px}
.module-panel[data-components-ready="true"] .module-window img{transition:none}
.module-panel>.component-controls{left:24px;right:24px;bottom:112px;grid-template-columns:repeat(8,minmax(0,1fr));gap:3px}
.module-panel .component-choice{min-width:0}
.module-panel>.component-card{left:52%;right:12px;top:130px;max-height:470px;padding:15px}
.module-panel .component-title{font-size:21px}
.module-panel .component-description{font-size:14px}
.module-panel[data-inspecting="true"] .module-callout{visibility:hidden}
html[dir="rtl"] .component-card{direction:rtl}
html[dir="rtl"] .component-title{line-height:1.4}
html[lang="zh-CN"] .component-title{letter-spacing:normal;line-height:1.4}
@media(max-width:1100px){
 .module-panel[data-components-ready="true"]{min-height:850px}
 .module-panel>.component-controls{grid-template-columns:repeat(4,minmax(44px,1fr))}
 .module-panel>.component-card{left:14px;right:14px;top:135px;max-height:450px}
 .module-panel .component-magnifier{height:180px}
}
@media(min-width:701px) and (max-width:1000px){
 .landing-screen>.component-controls{grid-template-columns:repeat(4,minmax(44px,1fr));width:220px;bottom:90px}
 .landing-screen>.component-card{width:43%;max-height:calc(100% - 280px);top:74px;padding:15px;display:flex;flex-direction:column;align-items:stretch;gap:10px}
 .landing-screen .component-text{order:-1}
 .landing-screen .component-magnifier{height:130px}
 .landing-screen .component-title{font-size:22px}
 .landing-screen .component-description{font-size:14px}
}
@media(max-width:700px){
 .landing-screen>.component-controls{left:16px;right:16px;bottom:160px;width:auto;grid-template-columns:repeat(4,minmax(44px,1fr));gap:4px}
 .landing-screen>.component-card{left:16px;right:16px;top:68px;width:auto;max-height:calc(100% - 345px);padding:15px;display:flex;flex-direction:column;align-items:stretch;gap:10px}
 .landing-screen .component-text{order:-1;padding-inline-end:20px}
 .landing-screen .component-magnifier{height:110px;margin:0;flex-shrink:0}
 .landing-screen .component-title{font-size:23px}
 .landing-screen .component-description{font-size:15px}
 .component-hint{font-size:11px}
}
@media(orientation:landscape) and (max-height:500px) and (min-width:701px) and (max-width:1000px){
 .landing-screen>.component-controls{bottom:85px;width:42%;grid-template-columns:repeat(8,minmax(0,1fr));gap:3px}
 .landing-screen .component-choice{min-width:0}
 .landing-screen>.component-card{top:60px;max-height:calc(100% - 245px)}
 .landing-screen .component-magnifier{height:95px}
}
@media(prefers-reduced-motion:reduce){.component-hotspot,.component-choice{transition:none}}
html[data-motion="off"] .component-hotspot,html[data-motion="off"] .component-choice{transition:none}