/* WEB6 visual effects and compact concept preview. */
.story-visual{width:100%;max-width:430px;height:310px;min-height:0;margin-inline:auto}
.story-image-link{position:relative;display:block;width:min(84%,340px);z-index:1;transform:rotate(-3deg);transition:transform .35s}
.story-image-link:hover,.story-image-link:focus-visible{transform:rotate(0)}
.story-image{display:block;width:100%;height:auto;max-height:210px;object-fit:contain;transform:none;border-radius:9px;background:#040b18;box-shadow:0 16px 45px #0007}
.story-preview-label{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:10px 11px;color:var(--aqua);font-size:9px;border:1px solid #50728d88;border-top:0;border-radius:0 0 8px 8px;background:#0a1a30}
.story-seal{left:18px;bottom:16px;font-size:7px}
.living-particles,.living-flux{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.living-particles{z-index:1;overflow:hidden}
.living-particles span{position:absolute;left:var(--x);top:var(--y);width:var(--size,2px);height:var(--size,2px);border-radius:50%;background:#a1e8ff;box-shadow:0 0 8px #75d5ffa3;opacity:.5;animation:particle-drift calc(var(--duration,22s)*var(--particle-rate,1)) ease-in-out var(--delay,0s) infinite}
.living-particles span:nth-child(3n){background:#f4d7a2;box-shadow:0 0 8px #edc98799}
.living-particles span:nth-child(7n){background:#d1bfff;box-shadow:0 0 8px #ac9ef799}
.living-flux{z-index:1;overflow:visible;opacity:.72}
.living-flux path{stroke:#7bd9f7;stroke-width:1;fill:none;stroke-linecap:round;stroke-dasharray:32 560;animation:flux-travel var(--flux-duration,10s) linear infinite;filter:drop-shadow(0 0 3px #6cdcff88)}
.living-flux path:nth-child(2){stroke:#dbc291;stroke-width:.7;animation-delay:-4s}
.living-flux path:nth-child(3){stroke:#a79deb;stroke-width:.7;animation-delay:-7s}
.hero-art::before{animation:ambient-breathe 9s ease-in-out infinite}
.harmony-prism path{animation:crystal-light 7s ease-in-out infinite}
.map-lines path{stroke-dasharray:3 13;animation:map-flow var(--map-duration,8s) linear infinite}
.map-lines .fx-selected-edge{stroke:#69e0ffbb;stroke-width:1.3;stroke-dasharray:5 10;filter:drop-shadow(0 0 3px #68deff66)}
.map-hub::after{content:"";position:absolute;inset:-5px;border-radius:50%;border:1px solid #7ddfff33;pointer-events:none;animation:core-breathe 6s ease-in-out infinite}
.fx-surface{isolation:isolate;overflow:hidden}
.map-hub.fx-surface{overflow:visible}
.route-choice,.pinned-card,.button,.group-filters button,.pin-button{position:relative}
.module-card{transition:border-color .2s,background .2s,transform .3s}
.fx-ready:not(.quiet) .module-card:hover{transform:translateY(-3px)}
.fx-ready .module-card::after,.fx-ready .route-choice::after,.fx-ready .pinned-card::after,.fx-ready .button::after{content:"";position:absolute;inset:0;pointer-events:none;border-radius:inherit;background:radial-gradient(190px circle at var(--fx-x,50%) var(--fx-y,50%),#81dcff24,transparent 75%);opacity:0;transition:opacity .35s;z-index:0}
.fx-ready .world-window::before{content:"";position:absolute;inset:0;z-index:3;pointer-events:none;background:radial-gradient(160px circle at var(--fx-x,50%) var(--fx-y,50%),#baeaff33,transparent 75%);opacity:0;transition:opacity .35s}
.fx-ready .fx-active::after,.fx-ready .fx-active::before,.fx-ready .fx-surface:focus-visible::after{opacity:1}
.fx-ripple{position:absolute;pointer-events:none;z-index:4;left:var(--wave-x,50%);top:var(--wave-y,50%);width:var(--wave-size,180px);height:var(--wave-size,180px);border:1px solid #92e5ff7a;border-radius:50%;background:radial-gradient(circle,transparent 35%,#7bdcff1c 70%,transparent);transform:translate(-50%,-50%) scale(.05);animation:touch-wave .8s ease-out forwards}
.fx-ready:not(.quiet) .fx-reveal{transition:opacity .7s ease,transform .7s ease}
.fx-ready:not(.quiet) .fx-reveal:not(.fx-in-view){opacity:0;transform:translateY(14px)}
.fx-ready .fx-reveal.fx-in-view,.quiet .fx-reveal{opacity:1;transform:none}
.fx-paused *,.fx-paused *::before,.fx-paused *::after{animation-play-state:paused!important}
.hero-art.fx-offscreen *,.hero-art.fx-offscreen::before{animation-play-state:paused!important}
.quiet .fx-surface::after,.quiet .world-window::before{opacity:0!important}
.quiet .story-image-link{transform:none}
body[data-rhythm=calm]{--flux-duration:17s;--particle-rate:1.6;--map-duration:14s}
body[data-rhythm=energy]{--flux-duration:6s;--particle-rate:.7;--map-duration:5s}
@keyframes particle-drift{0%,100%{transform:translate3d(0,0,0);opacity:.22}45%{transform:translate3d(var(--drift-x,12px),-17px,0);opacity:.8}75%{transform:translate3d(-6px,7px,0);opacity:.4}}
@keyframes flux-travel{to{stroke-dashoffset:-592}}
@keyframes map-flow{to{stroke-dashoffset:-48}}
@keyframes ambient-breathe{0%,100%{transform:scale(.97);opacity:calc(var(--glow)*.65)}50%{transform:scale(1.06);opacity:var(--glow)}}
@keyframes crystal-light{0%,100%{stroke-opacity:.55}50%{stroke-opacity:1}}
@keyframes core-breathe{0%,100%{transform:scale(1);opacity:.35}50%{transform:scale(1.12);opacity:.75}}
@keyframes touch-wave{0%{transform:translate(-50%,-50%) scale(.05);opacity:.8}100%{transform:translate(-50%,-50%) scale(1);opacity:0}}
@media(max-width:960px){.story-visual{max-width:380px;height:275px;min-height:0}.story-image-link{width:min(82%,300px)}.story-image{max-height:184px}.story-seal{font-size:6px}}
@media(max-width:760px){.story-visual{max-width:350px;height:235px;min-height:0}.story-image-link{width:min(80%,268px)}.story-image{max-height:160px}.story-preview-label{font-size:8px;padding:8px 10px}.story-seal{bottom:10px;left:14px}.living-particles span:nth-child(n+13){display:none}.living-flux{opacity:.5}.living-flux path{stroke-width:.75}.fx-ready:not(.quiet) .module-card:hover{transform:none}}
@media(max-width:480px){.story-visual{height:210px;min-height:0;max-width:310px}.story-image-link{width:min(80%,238px)}.story-image{max-height:140px}.story-seal{font-size:5px}.story-seal img{height:21px;width:16px}}
@media(prefers-reduced-motion:reduce){.fx-ready .fx-reveal{opacity:1!important;transform:none!important}.living-flux path,.living-particles span,.map-lines path,.map-hub::after,.hero-art::before,.harmony-prism path{animation:none!important}.fx-ready .module-card:hover,.story-image-link{transform:none!important}.fx-ripple{display:none}.fx-surface::after,.world-window::before{opacity:0!important}}
