.hero-scene{position:relative;width:100%;aspect-ratio:620/530}.hero-scene>.flow-art{width:100%;height:100%}.scene-canvas{position:absolute;inset:0;width:100%;height:100%}.hero-scene[data-ready=true]>.flow-art{visibility:hidden}.scene-controls{position:absolute;z-index:2;top:72px;right:28px;display:flex;gap:5px;padding:5px;border:1px solid #3a5262;border-radius:6px;background:#12232dde}.scene-controls[hidden]{display:none}.scene-controls button{min-height:38px;padding:9px 17px;font:11px var(--sans);color:#9eb9cb;cursor:pointer;background:transparent;border:0;border-radius:3px}.scene-controls button[aria-pressed=true]{background:#92d7ed;color:#12313f}.scene-controls button span{margin-left:9px}.hero-visual{isolation:isolate}.visual-bottom a{color:#9fbac8;text-decoration:none}.visual-bottom a:hover{color:#bcf0ff}.before-path{margin-top:23px;padding:17px 19px;border-left:2px solid #ae9273;background:linear-gradient(90deg,#d5a8690c,transparent);border-radius:0 4px 4px 0}.before-path>span{font:9px var(--mono);letter-spacing:.1em;color:#cbb492}.before-path p{font-size:12px;line-height:1.8;color:#a99e96;margin-top:9px}.exploration-path small{display:block;color:#8ed8ed;font:9px var(--mono);letter-spacing:.07em;margin:5px 0 11px}.exploration-panel.transformed .before-path{opacity:.55;transition:opacity .4s}.exploration-panel.transformed .exploration-screen{border-color:#80b9ca;box-shadow:0 20px 70px #67d8fa09}.transformation-result{display:flex;align-items:flex-start;gap:15px;border-top:1px solid #538798;padding-top:23px;margin-top:27px}.transformation-result[hidden]{display:none}.transformation-check{display:grid;place-items:center;width:30px;height:30px;flex-shrink:0;color:#8ad9c6;border:1px solid #70b6a7;border-radius:50%;font-size:14px}.transformation-result small{font:8px var(--mono);letter-spacing:.05em;color:#8cd2c4;line-height:1.8}.transformation-result p{font-size:15px;line-height:1.65;color:#d2f1f2;margin-top:7px}.transformed .demo-output{animation:result-reveal .4s ease both}@keyframes result-reveal{from{opacity:.4;transform:translateY(9px)}to{opacity:1;transform:translateY(0)}}.source-ribbon{display:flex;align-items:center;gap:9px;flex-wrap:wrap}.source-ribbon>span{font-size:11px;line-height:1.7;color:#8eaabb;border:1px solid #355467;background:#182c37;padding:9px 12px;border-radius:5px}.source-ribbon>i{font-style:normal;color:#6b92a6;font-size:13px}.source-ribbon>.ribbon-target{border-color:#569597;color:#a8e3d9;background:#213f4055}.scattered-records{display:flex;gap:8px;flex-wrap:wrap;padding:13px 0 7px}.scattered-records>span{font-size:10px;color:#b4c8d5;border:1px solid #485660;border-radius:4px;padding:10px;background:#29303b55}.scattered-records>span:nth-child(2){transform:rotate(-2deg);border-color:#66664b}.scattered-records>span:nth-child(3){transform:rotate(2deg);border-color:#4a5d71}.product-shelf{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px;border-bottom:2px solid #4f6470;padding-bottom:13px}.product-shelf>span{display:flex;flex-direction:column;align-items:center;gap:10px;color:#9eb9c8;font-size:9px;line-height:1.5;padding:13px 5px 5px;border:1px solid #334e5c;border-radius:4px;background:linear-gradient(#243845,#122736)}.product-shelf i{font-style:normal;color:#90bdc4;font-size:28px;line-height:1.3}.product-shelf>span:nth-child(3n) i{color:#d4b487}.error-sample{display:flex;gap:13px;align-items:center;padding:17px;border:1px solid #8f6b594d;background:#66483924;border-radius:4px}.error-sample>span{display:grid;place-items:center;border:1px solid #b58c6c;border-radius:50%;width:26px;height:26px;flex-shrink:0;color:#d3ab86;font-size:12px}.error-sample strong{font-weight:400;font-size:12px;color:#dec5b0;line-height:1.7}.error-sample small{display:block;color:#a5958e;font-size:10px;line-height:1.7;margin-top:5px}.demo-download{display:block;text-align:center;border:1px solid #5d8e9b;border-radius:3px;background:#153644;color:#c6edf2;font:11px var(--sans);line-height:1.8;padding:10px 14px;margin-top:16px;cursor:pointer;width:100%}.demo-download:hover{background:#244b59}.demo-boundary{border-top:1px solid #2f4b5c;margin-top:23px;padding-top:16px}.demo-boundary summary{font-size:10px;line-height:1.8;color:#93adbd;cursor:pointer}.demo-boundary .demo-limit{border-top:0;margin-top:12px;padding-top:0}.explorer-more{display:flex;align-items:center;gap:15px;justify-content:center;background:#192d39;color:#a8cddd;cursor:pointer;border:1px solid #416071;border-radius:4px;font:11px var(--sans);line-height:1.8;min-height:44px;padding:11px 24px;margin:0 auto 28px}.explorer-more[hidden]{display:none}.explorer-more>span{font-size:17px}.explorer-more[aria-expanded=true]>span{transform:rotate(45deg)}.demo-reset[hidden]{display:none}.demo-output[data-state=done]{background:linear-gradient(145deg,#24495366,#162c38);border-color:#518697}.demo-choice{position:relative;overflow:hidden}.demo-choice:after{content:"";position:absolute;width:50px;height:50px;border-radius:50%;background:#77d8ff0c;right:-25px;bottom:-25px;transition:transform .25s}.demo-choice:hover:after,.demo-choice[aria-current=true]:after{transform:scale(4)}.exploration-story h3{font-size:31px;line-height:1.27}.explorer-top{background:linear-gradient(110deg,#183745,#162a35 55%,#182c30)}.demo-widget h4{font-size:25px}.hero-result-tag{pointer-events:none}.hero-result-tag strong{transition:color .2s}.hero-visual[data-future=true] .hero-result-tag strong{color:#b0f2dc}
@media(max-width:1100px){.scene-controls{top:65px;right:18px}.scene-controls button{padding:8px 12px}.exploration-story h3{font-size:27px}.demo-widget h4{font-size:23px}.product-shelf{gap:5px}.product-shelf i{font-size:24px}}
@media(max-width:600px){.scene-controls{top:48px;right:12px;padding:3px}.scene-controls button{min-height:36px;font-size:10px;padding:7px 11px}.hero-scene{aspect-ratio:620/570}.hero-result-tag{max-width:88%}.before-path{margin-top:20px;padding:15px}.before-path p{font-size:11px}.exploration-path small{font-size:8px}.exploration-story h3{font-size:25px}.demo-widget h4{font-size:22px}.source-ribbon>span{font-size:10px;padding:8px 10px}.product-shelf{grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}.product-shelf>span{padding:10px 5px}.product-shelf i{font-size:22px}.transformation-result{gap:11px}.transformation-result p{font-size:14px}.scattered-records>span{font-size:9px}.demo-boundary summary{font-size:10px}.explorer-more{font-size:11px;padding:10px 17px;margin-bottom:22px}}
@media(prefers-reduced-motion:reduce){.transformed .demo-output{animation:none}.demo-choice:after,.before-path{transition:none}}
.result-row strong{font-size:13px}.result-row small{font-size:12px}.result-tag{font-size:11px}.lab-table{font-size:12px}.output-summary{font-size:14px}@media(max-width:600px){.result-row strong{font-size:12px}.result-row small{font-size:11px}.result-tag{font-size:10px}.lab-table{font-size:11px}.output-summary{font-size:13px}}
