/* One search, one continuous study. Scoped to the unified home only. */
.unified-home .hub-program-viewport .preview-content-only.hp-story .hp-heading{text-align:center}
.unified-home .hub-program-viewport .preview-content-only.hp-story .hp-heading h2{font-size:clamp(24px,2.7vw,38px);line-height:1.32;font-weight:600;letter-spacing:-1.2px;white-space:pre-line;margin:0;min-height:2.64em;color:#252c33}
.unified-home .hub-program-viewport .preview-content-only.hp-story .hp-heading p,
.unified-home .hub-program-viewport .preview-content-only.hp-story .hp-caption{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);margin:-1px;padding:0;white-space:nowrap}
.unified-home .hub-program-viewport .preview-content-only.hp-story .hp-base-map,
.unified-home .hub-program-viewport .preview-content-only.hp-story .hp-diagrams,
.unified-home .hub-program-viewport .preview-content-only.hp-story .hp-composition,
.unified-home .hub-program-viewport .preview-content-only.hp-story .hp-canvas-viewport,
.unified-home .hub-program-viewport .preview-content-only.hp-story .hp-charts{opacity:0}
.unified-home .hub-program-viewport .preview-content-only.hp-story[data-phase="search"] .hp-base-map{opacity:.75;transform:scale(.8)}
.hp-search-cue,.hp-dimension-cue{position:absolute;z-index:9;opacity:0;pointer-events:none;background:#fff;border:1px solid #c9d4db;border-radius:5px;box-shadow:0 6px 24px #3244530b;color:#425562;transition:opacity .25s,transform .65s cubic-bezier(.18,.7,.22,1)}
.hp-search-cue{left:50%;top:43%;transform:translate(-50%,-50%);width:65%;max-width:330px;padding:15px 18px;display:flex;align-items:center;gap:12px;font-size:13px}
.hp-search-cue>b{margin-left:auto;font-weight:400;color:#7d8c96}.hp-search-query{overflow:hidden;white-space:nowrap}
.hp-story[data-phase="search"] .hp-search-cue{opacity:1}.hp-story[data-phase="search"] .hp-search-query{animation:hp-query .8s steps(9,end) both}
@keyframes hp-query{from{max-width:0}to{max-width:180px}}
.unified-home .hub-program-viewport .preview-content-only.hp-story:is([data-phase="fan"],[data-phase="choose"],[data-phase="combine"],[data-phase="refan"],[data-phase="stack"],[data-phase="dimension"]) .hp-diagrams{opacity:1}
.unified-home .hub-program-viewport .preview-content-only.hp-story .hp-sheet{transition:transform 1.15s cubic-bezier(.18,.7,.22,1),left 1.15s cubic-bezier(.18,.7,.22,1),top 1.15s cubic-bezier(.18,.7,.22,1),opacity .65s,border-color .3s;box-shadow:0 5px 15px #344d610e}
.hp-story .hp-sheet:nth-child(1){--card-x:14%;--card-y:28%}.hp-story .hp-sheet:nth-child(2){--card-x:38%;--card-y:28%}.hp-story .hp-sheet:nth-child(3){--card-x:62%;--card-y:28%}.hp-story .hp-sheet:nth-child(4){--card-x:86%;--card-y:28%}.hp-story .hp-sheet:nth-child(5){--card-x:26%;--card-y:68%}.hp-story .hp-sheet:nth-child(6){--card-x:50%;--card-y:68%}.hp-story .hp-sheet:nth-child(7){--card-x:74%;--card-y:68%}
.unified-home .hub-program-viewport .preview-content-only.hp-story:is([data-phase="fan"],[data-phase="choose"],[data-phase="refan"]) .hp-sheet{left:var(--card-x);top:var(--card-y);opacity:1;transform:translate(-50%,-50%) scale(.49);transition-delay:calc(var(--sheet-index)*.065s)}
.unified-home .hub-program-viewport .preview-content-only.hp-story .hp-sheet figcaption{font-size:clamp(12px,1.5vw,17px)}
.hp-story .hp-sheet::after{content:'✓';position:absolute;right:8px;top:7px;background:#425c70;color:#fff;border-radius:50%;width:21px;height:21px;text-align:center;line-height:21px;font-size:13px;opacity:0;transform:scale(.5);transition:opacity .3s,transform .4s}
.unified-home .hub-program-viewport .preview-content-only.hp-story[data-phase="choose"] .hp-sheet{opacity:.25}
.unified-home .hub-program-viewport .preview-content-only.hp-story[data-phase="choose"] .hp-picked{opacity:1;border-color:#526f85;transform:translate(-50%,-55%) scale(.52)}
.hp-story[data-phase="choose"] .hp-picked::after{opacity:1;transform:scale(1);transition-delay:calc(var(--sheet-index)*.13s)}
.unified-home .hub-program-viewport .preview-content-only.hp-story[data-phase="combine"] .hp-sheet{left:50%;top:50%;opacity:0;transform:translate(-50%,-50%) scale(.7);transition-delay:0s}
.unified-home .hub-program-viewport .preview-content-only.hp-story[data-phase="combine"] .hp-composition{opacity:1;transform:scale(.85);transition-delay:.5s}
.hp-story .hp-composition{isolation:isolate}.hp-story .hp-map-label,.hp-story .hp-map-chip{display:none}
.hp-story .hp-composed-map,.hp-story .hp-composed-overlay{position:absolute;inset:10%;width:80%;height:80%;object-fit:contain}
.hp-story .hp-composed-overlay{mix-blend-mode:multiply;opacity:.5}
.unified-home .hub-program-viewport .preview-content-only.hp-story:is([data-phase="stack"],[data-phase="dimension"]) .hp-sheet{left:50%;top:50%;opacity:.96;transform:translate(-50%,-50%) translateY(calc((3 - var(--sheet-index))*10%)) rotateX(48deg) rotateZ(-28deg) scale(var(--hp-stack-scale,1));transition-delay:calc(var(--sheet-index)*.65s)}
.hp-dimension-cue{right:8%;bottom:9%;font-size:16px;padding:10px 20px;font-weight:550}
.hp-dimension-cue span{position:absolute;right:-13px;bottom:-16px;font-size:26px;color:#344f61}
.hp-story[data-phase="dimension"] .hp-dimension-cue{opacity:1;animation:hp-press .65s ease-out both}
@keyframes hp-press{0%,35%{transform:scale(1)}65%{transform:scale(.9);background:#e4edf2}100%{transform:scale(1)}}
.unified-home .hub-program-viewport .preview-content-only.hp-story:is([data-phase="model"],[data-phase="explode"],[data-phase="exploded"]) .hp-canvas-viewport{opacity:1}
.unified-home .hub-program-viewport .preview-content-only.hp-story .hp-files{max-width:600px;margin:auto;padding:30px;justify-content:center}
.hp-story .hp-file-list{gap:16px}.hp-story .hp-file{padding:24px 20px;min-height:90px}.hp-story .hp-file b{font-size:25px}.hp-story .hp-file span,.hp-story .hp-files>p{display:none}
@media(max-width:730px){.unified-home .hub-program-viewport .preview-content-only.hp-story .hp-heading h2{font-size:24px}.hp-search-cue{font-size:11px;padding:12px}.hp-story .hp-file{padding:16px;min-height:65px}.hp-story .hp-file b{font-size:20px}}

/* Native 22-card board; every sheet assembles in one motion into the model. */
.unified-home .hub-program-viewport .preview-content-only.hp-story .hp-sheet{width:15%;height:22%;padding:0;display:flex;flex-direction:column;border:1px solid #dce1e5;border-radius:2px;overflow:hidden;z-index:calc(var(--stack-rank) + 1);transition:transform .85s cubic-bezier(.18,.78,.22,1),left .85s cubic-bezier(.18,.78,.22,1),top .85s cubic-bezier(.18,.78,.22,1),opacity .5s,border-color .25s;transform:translate(-50%,-50%) scale(.75)}
.unified-home .hub-program-viewport .preview-content-only.hp-story .hp-sheet figcaption{font-family:Pretendard,sans-serif;font-size:clamp(6px,.65vw,9px);line-height:1.2;gap:4px;padding:5px 5px 3px;margin:0;min-height:15px;color:#303439;white-space:nowrap}
.hp-story .hp-sheet figcaption>span{font-size:.8em;color:#8d969e}.hp-story .hp-sheet figcaption>b{font-weight:600;overflow:hidden;text-overflow:ellipsis}
.unified-home .hub-program-viewport .preview-content-only.hp-story .hp-sheet img{width:100%;height:calc(100% - 29px);flex:1;min-height:0;object-fit:contain}
.hp-story .hp-card-foot{display:flex;align-items:center;justify-content:space-between;font:5px/1.4 Pretendard,sans-serif;color:#8b959e;border-top:1px solid #edf0f2;padding:2px 5px}.hp-story .hp-card-foot b{font-weight:500;color:#627582}
.unified-home .hub-program-viewport .preview-content-only.hp-story:is([data-phase="fan"],[data-phase="choose"],[data-phase="refan"]) .hp-sheet{left:calc(8.5% + var(--card-col)*16.6%);top:calc(14% + var(--card-row)*24%);opacity:1;transform:translate(-50%,-50%) scale(1);transition-delay:0s}
.unified-home .hub-program-viewport .preview-content-only.hp-story[data-phase="choose"] .hp-sheet:not(.hp-picked){opacity:.22}
.unified-home .hub-program-viewport .preview-content-only.hp-story[data-phase="choose"] .hp-picked{transform:translate(-50%,-54%) scale(1.04);border-color:#526f85}
.hp-story .hp-sheet::after{width:12px;height:12px;line-height:12px;font-size:8px;top:3px;right:3px}
.unified-home .hub-program-viewport .preview-content-only.hp-story[data-phase="stack"] .hp-sheet{left:50%;top:50%;opacity:0;transform:translate(-50%,-50%) rotateX(48deg) rotateZ(-28deg) scale(2.2);transition:transform .85s cubic-bezier(.18,.78,.22,1),left .85s cubic-bezier(.18,.78,.22,1),top .85s cubic-bezier(.18,.78,.22,1),opacity .45s .55s;transition-delay:0s,0s,0s,.55s}
.unified-home .hub-program-viewport .preview-content-only.hp-story:is([data-phase="stack"],[data-phase="model"],[data-phase="explode"],[data-phase="exploded"]) .hp-canvas-viewport{opacity:1;transition:opacity .7s .45s}
.unified-home .hub-program-viewport .preview-content-only.hp-story[data-phase="stack"] .hp-dimension-cue{opacity:1;animation:hp-press .85s ease-out both}
.unified-home .hub-program-viewport .preview-content-only.hp-story[data-phase="select"] .hp-base-map{opacity:.9;transform:scale(.8)}
.unified-home .hub-program-viewport .preview-content-only.hp-story .hp-selection{inset:25% 25%;border:0;background:#ba67510c;transform:none}
.hp-story .hp-selection svg{width:100%;height:100%;overflow:visible;fill:none;stroke:#a8473d;stroke-width:.7}
.hp-story .hp-selection path{stroke-dasharray:100;stroke-dashoffset:100}
.hp-story[data-phase="select"] .hp-selection path{animation:hp-boundary 1s .1s ease-in-out forwards}
.hp-story .hp-selection i{position:absolute;left:2%;top:2%;width:10px;height:14px;background:#344f61;clip-path:polygon(0 0,0 100%,38% 65%,100% 64%);opacity:0}
.hp-story[data-phase="select"] .hp-selection i{animation:hp-trace 1s .1s linear forwards}
@keyframes hp-boundary{to{stroke-dashoffset:0}}
@keyframes hp-trace{0%{left:2%;top:2%;opacity:1}25%{left:98%;top:2%}50%{left:98%;top:98%}75%{left:2%;top:98%}100%{left:2%;top:2%;opacity:1}}
@media(prefers-reduced-motion:reduce){.hp-story[data-phase="select"] .hp-selection path{stroke-dashoffset:0}.hp-story[data-phase="select"] .hp-selection i{opacity:1}}
@media(max-width:730px){.unified-home .hub-program-viewport .preview-content-only.hp-story .hp-sheet{width:23%;height:15%}.unified-home .hub-program-viewport .preview-content-only.hp-story:is([data-phase="fan"],[data-phase="choose"],[data-phase="refan"]) .hp-sheet{left:calc(13% + var(--mobile-col)*24.6%);top:calc(9% + var(--mobile-row)*16.2%)}.hp-story .hp-card-foot{display:none}.unified-home .hub-program-viewport .preview-content-only.hp-story .hp-sheet figcaption{font-size:6px;padding:3px;min-height:12px}}

/* The same controls and terms as the real exploded-diagram tool. */
.hp-explode-cue{position:absolute;left:50%;bottom:4%;transform:translateX(-50%);z-index:9;display:flex;align-items:center;gap:12px;white-space:nowrap;font:11px/1.4 Pretendard,sans-serif;color:#637580;padding:9px 13px;background:#ffffffed;border:1px solid #d9e1e6;border-radius:4px;opacity:0;pointer-events:none;transition:opacity .2s}
.hp-story:is([data-phase="explode"],[data-phase="exploded"]) .hp-explode-cue{opacity:1}
.hp-explode-choice{position:relative;padding:5px 8px;background:#eaf0f4;border:1px solid #b5c5d0;border-radius:3px;color:#365569;font-weight:550}
.hp-explode-choice i{position:absolute;right:-7px;bottom:-9px;font-size:23px;font-style:normal}
.hp-story[data-phase="explode"] .hp-explode-choice{animation:hp-press .35s ease-out both}
.hp-explode-track{position:relative;width:90px;height:3px;background:#d8e1e7}
.hp-explode-track::before{content:'';position:absolute;inset:0 auto 0 0;width:var(--hp-explode-progress,0%);background:#617f94}
.hp-explode-track i{position:absolute;left:var(--hp-explode-progress,0%);top:50%;width:10px;height:10px;transform:translate(-50%,-50%);border-radius:50%;background:#617f94;border:2px solid #fff;box-shadow:0 0 0 1px #617f94}
#hover-explode-value{min-width:28px;font-variant-numeric:tabular-nums}
.hp-story .hp-file:last-child{border-color:#7d96a8;background:#f5f8fa}
.hp-story .hp-file:last-child b::after{content:'3D 모델';display:block;margin-top:10px;font-size:14px;letter-spacing:0;font-weight:500}
@media(max-width:730px){.hp-explode-cue{gap:7px;font-size:8px;padding:6px}.hp-explode-track{width:50px}.hp-story .hp-file:last-child b::after{font-size:11px}}
