/* ============ THE DEPTH ENGINE — 4D world layer ============ */

/* --- HUD world-chrome --- */
.world-hud{position:fixed;inset:0;pointer-events:none;z-index:6}
.world-hud .cnr{position:absolute;width:34px;height:34px;opacity:.5}
.world-hud .cnr.tl{top:10px;left:10px;border-top:1.5px solid var(--lime);border-left:1.5px solid var(--lime)}
.world-hud .cnr.tr{top:10px;right:10px;border-top:1.5px solid var(--lime);border-right:1.5px solid var(--lime)}
.world-hud .cnr.bl{bottom:10px;left:10px;border-bottom:1.5px solid var(--lime);border-left:1.5px solid var(--lime)}
.world-hud .cnr.br{bottom:10px;right:10px;border-bottom:1.5px solid var(--lime);border-right:1.5px solid var(--lime)}
.world-telemetry{position:fixed;right:16px;bottom:14px;font-family:var(--font-mono);font-size:.56rem;letter-spacing:.16em;text-transform:uppercase;color:rgba(238,243,233,.45);z-index:6;pointer-events:none;text-align:right;line-height:1.7}
.world-telemetry b{color:var(--lime)}
@media (max-width:600px){.world-hud .cnr{width:22px;height:22px}.world-telemetry{font-size:.5rem}}

/* --- foreground occlusion layer (things pass IN FRONT of content) --- */
.world-fg{position:fixed;inset:0;pointer-events:none;z-index:4;overflow:hidden}
.world-fg .shard{position:absolute;opacity:.22;will-change:transform;filter:blur(.4px)}
.world-fg .shard svg{display:block}

/* --- cursor torch (reveals surfaces) --- */
.world-torch{position:fixed;top:0;left:0;width:460px;height:460px;margin:-230px 0 0 -230px;border-radius:50%;pointer-events:none;z-index:2;background:radial-gradient(circle,rgba(141,242,80,.10),rgba(57,230,255,.05) 42%,transparent 62%);mix-blend-mode:screen;will-change:transform;opacity:0;transition:opacity .6s}
.world-torch.on{opacity:1}

/* --- living reticle ring (native cursor stays) --- */
.world-reticle{position:fixed;top:0;left:0;width:24px;height:24px;margin:-12px 0 0 -12px;pointer-events:none;z-index:9998;border:1px solid rgba(141,242,80,.55);border-radius:50%;opacity:0;transition:width .22s cubic-bezier(.16,1,.3,1),height .22s cubic-bezier(.16,1,.3,1),margin .22s,border-color .22s,opacity .4s,border-radius .22s}
.world-reticle.on{opacity:.85}
.world-reticle.hot{width:46px;height:46px;margin:-23px 0 0 -23px;border-color:var(--cyan);border-width:1.5px}
.world-reticle.hot.sq{border-radius:12px}

/* --- ambient comet --- */
.world-comet{position:fixed;width:3px;height:3px;border-radius:50%;background:#fff;box-shadow:0 0 10px 2px rgba(141,242,80,.9),0 0 3px 1px #fff;z-index:3;pointer-events:none}

/* --- containment-jar shimmer on specimen cards --- */
.dex-card{position:relative;overflow:hidden}
.dex-card::after{content:"";position:absolute;inset:-40%;background:linear-gradient(115deg,transparent 42%,rgba(255,255,255,.09) 50%,transparent 58%);opacity:0;transform:translateX(-30%);transition:opacity .5s;pointer-events:none}
.dex-card:hover::after{opacity:1;animation:jarSheen 1.1s ease-out}
@keyframes jarSheen{0%{transform:translateX(-40%)}100%{transform:translateX(40%)}}

/* --- scroll-depth fog progression --- */
.world-fog{content:"";position:fixed;inset:0;pointer-events:none;z-index:1;background:radial-gradient(130% 90% at 50% 108%, rgba(141,242,80,.06), transparent 58%);opacity:calc(.35 + .65*var(--scroll-depth,0));transition:opacity .5s}

@media (prefers-reduced-motion:reduce){
  .world-fg,.world-torch,.world-reticle,.world-comet{display:none!important}
  .dex-card:hover::after{animation:none}
}

/* warp transition flash */
.warp-flash{position:fixed;inset:0;z-index:9999;pointer-events:none;background:radial-gradient(circle at 50% 50%, rgba(141,242,80,.18), rgba(6,8,16,.0) 45%);opacity:0}
.warp-flash.in{opacity:1;transition:opacity .55s ease-out}
.warp-flash.in{animation:warpIn .55s ease-out}
@keyframes warpIn{0%{opacity:1;transform:scale(1.15)}100%{opacity:0;transform:scale(1)}}
.warp-flash.out{background:radial-gradient(circle at 50% 50%, rgba(57,230,255,.0), rgba(6,8,16,.85) 60%);opacity:0}
.warp-flash.out.go{opacity:1;transition:opacity .3s ease-in}
@media (prefers-reduced-motion:reduce){.warp-flash{display:none}}

/* spore section dividers */
.spore-divider{height:20px;margin:1.8rem 0;background-image:radial-gradient(circle, rgba(141,242,80,.5) 1px, transparent 1.6px);background-size:22px 20px;background-position:center;opacity:.45;-webkit-mask-image:linear-gradient(90deg,transparent,#000 32%,#000 68%,transparent);mask-image:linear-gradient(90deg,transparent,#000 32%,#000 68%,transparent)}
/* guaranteed hero wordmark */
.hero-wordmark{position:absolute;bottom:6px;right:10px;font-family:var(--font-mono);font-size:.58rem;letter-spacing:.18em;color:rgba(141,242,80,.65);z-index:2;pointer-events:none}
@media (prefers-reduced-motion:reduce){.spore-divider{opacity:.35}}

/* station time (day/night) */
html[data-shift="night"] .living-bg{filter:hue-rotate(-18deg) saturate(.85) brightness(.8)}
html[data-shift="night"] .world-fog{background:radial-gradient(130% 90% at 50% 108%, rgba(57,230,255,.07), transparent 58%)}
html[data-shift="dusk"] .living-bg{filter:hue-rotate(18deg) saturate(1.1)}
html[data-shift="dusk"] .world-fog{background:radial-gradient(130% 90% at 50% 108%, rgba(216,179,106,.07), transparent 58%)}
html[data-shift="dawn"] .living-bg{filter:hue-rotate(8deg) brightness(1.05)}
/* live vitals sparkline */
.sv-vitals{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-top:.9rem;padding-top:.8rem;border-top:1px solid rgba(238,243,233,.1)}
.sv-vt{font-family:var(--font-mono);font-size:.55rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-dim)}
@media (max-width:560px){.sv-vitals{flex-direction:column;align-items:flex-start;gap:.4rem}}