/* Fewer layers of copy: the chapter rail provides context once. */
.landscape-story .story-panel h1,.landscape-story .story-panel h2{margin-top:0}
.landscape-story .story-description{max-width:36ch}
.landscape-story .story-panel[data-scene="4"]{display:none}
.landscape-story .story-panel[data-scene="2"] .hero-inspect{margin-top:22px;font:500 12px var(--ui);padding:12px 0;gap:26px;background:none;color:#e3f2f7;cursor:pointer}
.landscape-story .story-panel[data-scene="2"] .hero-inspect:hover{gap:35px;color:#fff}
.landscape-story .scene-bottom{left:auto!important;right:34px!important;bottom:28px;width:auto!important;justify-content:flex-end}
.landscape-story .scene-tools{display:flex;align-items:center;gap:22px}
.landscape-story .transformer-hotspot{position:absolute;left:var(--asset-x);top:var(--asset-y);z-index:9;translate:-50% -50%;width:48px;height:48px;display:grid;place-items:center;border:0;padding:0;background:none;pointer-events:auto;transition:opacity .2s}
.landscape-story .transformer-hotspot[hidden]{display:none}
.hotspot-target{display:grid;place-items:center;width:36px;height:36px;border:1px solid #e0f4f8b0;border-radius:50%;background:#15324642;backdrop-filter:blur(3px);box-shadow:0 0 0 5px #122e3f18;transition:transform .3s,background .3s}
.hotspot-target i{width:5px;height:5px;background:#f1fbff;border-radius:50%;box-shadow:0 0 8px #b6ebff77}
.hotspot-label{position:absolute;right:calc(100% + 7px);top:50%;translate:0 -50%;width:max-content;text-align:left;padding:10px 14px;border-radius:12px;background:#1233459c;border:1px solid #d4edf32b;backdrop-filter:blur(14px);box-shadow:0 8px 25px #06151b1a}
.hotspot-label strong{display:block;font:500 12px/1.4 var(--ui);color:#f1f8fb}
.hotspot-label small{display:flex;align-items:center;gap:18px;margin-top:2px;font:400 10px/1.4 var(--ui);color:#c1dce8}
.transformer-hotspot[data-label-side=right] .hotspot-label{right:auto;left:calc(100% + 7px)}
.transformer-hotspot:hover .hotspot-target{transform:scale(1.13);background:#7ab4cb33}
.transformer-hotspot:focus-visible{outline:1px solid #e0f4ff;outline-offset:5px;border-radius:50%}
html{scrollbar-gutter:stable}
html.inspecting-transformer{overflow:hidden}
.inspecting-transformer .story-copy,.inspecting-transformer .transformer-hotspot{visibility:hidden}
.asset-inspector{position:fixed;inset:108px auto auto 32px;box-sizing:border-box;margin:0;width:min(570px,47vw);max-width:none;max-height:calc(100dvh - 132px);padding:25px 28px 19px;border:1px solid #d9eff64a;border-radius:24px;color:#e5f2f7;background:radial-gradient(ellipse at 0 0,#31657c4d,transparent 65%),#0d2638ee;backdrop-filter:blur(32px);box-shadow:0 25px 100px #03141d55,inset 0 1px #e4f7ff10;overflow:auto;overscroll-behavior:contain;font-family:var(--ui)}
.asset-inspector::backdrop{background:linear-gradient(90deg,#04131a26,transparent 75%);backdrop-filter:none}
.asset-inspector[open]{animation:inspector-arrive .45s cubic-bezier(.2,.8,.2,1) both}
.inspector-top{display:flex;align-items:center;justify-content:space-between;gap:20px;color:#bad7e5;font:400 10px/1.4 var(--mono)}
.inspector-close{width:30px;height:30px;display:grid;place-items:center;border:1px solid #cee6ed2e;border-radius:50%;background:#d4edf608}
.inspector-close svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.3}
.asset-inspector h2{font:400 clamp(27px,2.6vw,39px)/1.1 var(--ui);letter-spacing:-.045em;margin:18px 0 11px;color:#edf7fb}
.inspector-intro{font:400 13px/1.6 var(--ui);color:#b8cfdc;max-width:43ch}
.single-line{margin:21px -5px 12px;border-radius:15px;overflow:hidden;background:linear-gradient(130deg,#071b2a45,#18425a24);border:1px solid #bedfe91b}
.single-line svg{display:block;width:100%;height:auto}
.diagram-grid{opacity:.07}
.diagram-labels{font:11px var(--mono)}
.diagram-labels .diagram-asset-label{fill:#e6f9ff;font:500 13px var(--ui)}
.diagram-transformer{filter:drop-shadow(0 0 7px #9ad9f04d)}
.diagram-protection,.diagram-loads{opacity:0;transition:opacity .3s;filter:drop-shadow(0 0 7px #9ad9f04d)}
.asset-inspector[data-topic=protection] .diagram-protection,.asset-inspector[data-topic=loads] .diagram-loads{opacity:1}
.asset-inspector:not([data-topic=asset]) .diagram-transformer{opacity:0}
.asset-inspector[open] .diagram-circuit{stroke-dasharray:900;stroke-dashoffset:900;animation:diagram-connect 1s .15s cubic-bezier(.2,.65,.2,1) forwards}
.diagram-focus{transition:opacity .3s}
.asset-inspector[data-topic=protection] .diagram-focus,.asset-inspector[data-topic=loads] .diagram-focus{opacity:0}
.asset-inspector[data-topic=protection] .diagram-circuit,.asset-inspector[data-topic=loads] .diagram-circuit{filter:drop-shadow(0 0 4px #99d4ec33)}
.diagram-topics{display:flex;align-items:center;gap:6px;padding-bottom:12px;border-bottom:1px solid #b7dce526}
.diagram-topics button{padding:7px 11px;min-height:30px;font:400 11px var(--ui);border-radius:20px;color:#a9c7d8;border:1px solid transparent;transition:background .25s,color .25s}
.diagram-topics button[aria-pressed=true]{background:#abd4e212;border-color:#c2e3ef38;color:#e4f4fc}
.diagram-topics button:hover{color:#fff;background:#bddbe511}
.diagram-detail{min-height:44px;font:400 12px/1.65 var(--ui);color:#b8cfdc;padding-top:12px}
.inspector-cta{display:flex;align-items:center;justify-content:space-between;gap:16px;border-top:1px solid #b7dce526;margin-top:18px;padding-top:18px}
.inspector-cta>div>span{font:400 10px var(--mono);color:#9ac7dc}
.inspector-cta p{font:400 17px/1.3 var(--ui);letter-spacing:-.02em;margin-top:5px}
.inspector-cta a{display:inline-flex;align-items:center;gap:21px;border:1px solid #cee7f13b;border-radius:30px;padding:12px 16px;font:500 11px var(--ui);background:#c8e9f209;transition:background .25s;white-space:nowrap;flex-shrink:0}
.inspector-cta a:hover{background:#c8e9f21c}
.inspector-cta .ui-icon{width:16px;height:16px}
.inspector-foot{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-top:20px;color:#87a9bc;font:400 9px/1.5 var(--ui)}
.inspector-foot button{padding:4px 0;border-bottom:1px solid #c1dde644;font:400 10px var(--ui);color:#cbe2ed}
@keyframes inspector-arrive{from{opacity:0;transform:translateY(13px) scale(.985)}to{opacity:1;transform:none}}
@keyframes diagram-connect{to{stroke-dashoffset:0}}
@media(max-width:1100px) and (min-width:761px){.asset-inspector{inset:95px auto auto 25px;width:51vw;padding:20px 23px;max-height:calc(100dvh - 117px)}}
@media(max-width:760px){.landscape-story .scene-bottom{right:25px!important;bottom:24px!important}.landscape-story .scene-tools{gap:17px}.landscape-story .scene-tools button{font-size:8px}.landscape-story .story-panel[data-scene="2"] .hero-inspect{margin-top:15px;font-size:11px}.hotspot-label{padding:8px 11px}.hotspot-label strong{font-size:10px}.hotspot-label small{font-size:9px;gap:10px}.hotspot-target{width:30px;height:30px}.asset-inspector{inset:auto 14px 14px 14px;width:auto;max-height:calc(100dvh - 100px);padding:20px 21px 17px;border-radius:23px}.asset-inspector h2{font-size:31px;margin-top:16px}.inspector-top{font-size:9px}.inspector-intro{font-size:12px}.single-line{margin-top:18px}.diagram-topics{gap:2px}.diagram-topics button{font-size:10px;padding-inline:9px}.diagram-detail{font-size:11px}.inspector-cta{margin-top:13px;padding-top:14px}.inspector-cta p{font-size:16px}.inspector-cta a{font-size:10px;gap:12px;padding:11px 13px}.inspector-foot{font-size:8px;margin-top:17px}.inspector-foot button{font-size:9px}}
@media(max-height:760px) and (min-width:761px){.asset-inspector{inset:88px auto auto 25px;padding:17px 24px;max-height:calc(100dvh - 108px);width:510px}.asset-inspector h2{font-size:30px;margin-top:10px}.inspector-intro{font-size:12px}.single-line{margin-top:12px;margin-bottom:10px;max-width:420px;margin-inline:auto}.diagram-detail{font-size:11px;min-height:38px;padding-top:9px}.inspector-cta{margin-top:10px;padding-top:12px}.inspector-foot{margin-top:13px}}
@media(prefers-reduced-motion:reduce){.asset-inspector[open],.asset-inspector[open] .diagram-circuit{animation:none;stroke-dashoffset:0}.hotspot-target{transition:none}}
@media(max-height:760px) and (min-width:761px){.asset-inspector h2{margin-top:8px}.single-line{max-width:390px;margin:10px auto 8px}.diagram-detail{min-height:35px}.inspector-foot{margin-top:11px}}
