/* V20 public-live polish: preserve the cinematic shop, reduce friction, deepen collection. */
:root{--artifact:#cdb58b;--artifactGlow:rgba(227,190,126,.28)}
.panel-inner{max-height:inherit;overflow:auto;overscroll-behavior:contain}
.panel[open]{animation:panelIn .22s ease-out}
.panel::backdrop{animation:backdropIn .2s ease-out;background:rgba(0,0,0,.8);backdrop-filter:blur(5px)}
@keyframes panelIn{from{opacity:0;transform:translateY(12px) scale(.988)}to{opacity:1;transform:none}}
@keyframes backdropIn{from{opacity:0}to{opacity:1}}

/* Hidden artifacts are discoverable but never become visual confetti. */
.hotspot.artifact-hotspot{width:42px;height:42px;min-width:42px;min-height:42px;opacity:.56;border-style:dotted;border-color:rgba(224,195,145,.48);box-shadow:0 0 0 5px rgba(180,142,84,.04),0 0 16px rgba(218,166,88,.15);animation:artifactBreath 3.8s ease-in-out infinite}
.hotspot.artifact-hotspot:before{inset:15px;border-radius:2px;transform:rotate(45deg);background:var(--artifact)}
.hotspot.artifact-hotspot span{opacity:0;transition:opacity .18s ease,transform .18s ease;top:50px;color:#ecd7b2}
.hotspot.artifact-hotspot:hover span,.hotspot.artifact-hotspot:focus-visible span{opacity:1;transform:translateX(-50%) translateY(2px)}
.hotspot.artifact-hotspot.collected-artifact{opacity:.18;filter:grayscale(1);animation:none}
@keyframes artifactBreath{0%,100%{filter:brightness(.86)}50%{filter:brightness(1.2);box-shadow:0 0 0 7px rgba(203,169,112,.05),0 0 25px var(--artifactGlow)}}

.artifact-shelf{grid-column:1/-1}
.artifact-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:10px}
.artifact-card{border:1px solid #4f3e2c;background:linear-gradient(180deg,#17100b,#0d0906);padding:12px;min-height:84px}
.artifact-card strong{display:block;color:#e0c291;margin-bottom:5px}.artifact-card small{color:#9e907d;line-height:1.4}
.artifact-empty{color:#9c8d78;font-style:italic}
.shop-anchor{display:inline-block;margin-top:10px;padding:6px 9px;border:1px solid rgba(207,172,112,.35);color:#d7b783;font:10px ui-monospace,monospace;letter-spacing:.12em}

.epilogue-panel{width:min(760px,94vw);background:radial-gradient(circle at 50% 0,rgba(102,55,20,.18),transparent 34%),#090705}
.epilogue-panel h2{color:#e0bd84;font-size:clamp(1.7rem,5vw,2.7rem)}
.epilogue-panel p{line-height:1.62;color:#d2c5b4}
.epilogue-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:22px 0}
.epilogue-stat{border:1px solid #5d452e;background:#110c08;padding:13px;text-align:center}
.epilogue-stat strong{display:block;color:#e7c58e;font-size:1.3rem}.epilogue-stat span{display:block;margin-top:5px;color:#9f907b;font:9px ui-monospace,monospace;letter-spacing:.14em;text-transform:uppercase}
.epilogue-actions{display:grid;gap:10px}.epilogue-actions a,.epilogue-actions button{text-decoration:none;text-align:center;min-height:48px;display:grid;place-items:center}
.epilogue-primary{font-weight:700;letter-spacing:.06em;background:#24150b;border-color:#bb8444}

/* Closing state breathes: the story is done, the shop remains explorable. */
.case-closed .objective-card{border-color:rgba(215,177,111,.5)}
.case-closed .progress i{background:#c79a59}
.case-closed .scene-nav{opacity:.92}

/* Mobile dialog rescue: narrative panels read like cinematic sheets, not floating desktop boxes. */
@media(max-width:640px){
  .panel{width:auto;left:8px;right:8px;max-height:76svh}
  .inspect-panel,.talk-panel,.ending-panel,.epilogue-panel{position:fixed;inset:auto 8px calc(10px + env(safe-area-inset-bottom)) 8px;margin:0;width:auto;max-height:72svh}
  .inspect-panel .panel-inner,.talk-panel .panel-inner,.ending-panel .panel-inner,.epilogue-panel .panel-inner{padding:22px 18px 18px}
  .inspect-panel h2{font-size:1.55rem;line-height:1.15;padding-right:34px}.inspect-panel p{font-size:1rem;line-height:1.55}
  #inspectAction{width:100%;min-height:48px}
  .artifact-grid{grid-template-columns:1fr}.epilogue-stats{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.epilogue-stat{padding:10px 5px}.epilogue-stat strong{font-size:1.05rem}.epilogue-stat span{font-size:7px;letter-spacing:.08em}
  .hotspot.artifact-hotspot{width:46px;height:46px;min-width:46px;min-height:46px}.hotspot.artifact-hotspot:before{inset:17px}.hotspot.artifact-hotspot span{display:none}
}
@media(prefers-reduced-motion:reduce){.panel[open],.panel::backdrop,.hotspot.artifact-hotspot{animation:none!important}}
/* Public-live interaction stability: glow without moving the hit target. */
.hotspot{animation:stableHotspotPulse 2.5s ease-in-out infinite}
.hotspot.guided,.scene-nav button.guided{animation:stableGuidePulse 1.65s ease-in-out infinite}
@keyframes stableHotspotPulse{0%,100%{filter:brightness(.96);box-shadow:0 0 0 7px rgba(194,136,60,.06),0 0 20px rgba(187,113,42,.22)}50%{filter:brightness(1.12);box-shadow:0 0 0 11px rgba(194,136,60,.025),0 0 30px rgba(187,113,42,.42)}}
@keyframes stableGuidePulse{0%,100%{filter:brightness(1);box-shadow:0 0 0 8px rgba(255,201,106,.1),0 0 20px rgba(255,186,72,.58)}50%{filter:brightness(1.28);box-shadow:0 0 0 12px rgba(255,201,106,.05),0 0 34px rgba(255,186,72,.78),0 0 58px rgba(255,144,25,.28)}}
/* Mobile movement drawer: navigation never carpets the playable scene. */
@media(max-width:900px),(pointer:coarse){
  .scene-nav .move-toggle{display:block;flex:0 0 auto;min-width:76px;min-height:44px;border-color:#9d7546;background:rgba(20,12,7,.94);color:#e8c996;font:10px ui-monospace,monospace;letter-spacing:.16em;padding:10px 12px;position:relative;z-index:2}
  .scene-nav.mobile-collapsed{right:auto;width:auto;max-width:calc(100vw - 16px);padding:4px;background:rgba(5,3,2,.7)}
  .scene-nav.mobile-collapsed button:not(.move-toggle){display:none}
  .scene-nav:not(.mobile-collapsed){right:8px;width:auto;max-width:calc(100vw - 16px)}
  .scene-nav:not(.mobile-collapsed) .move-toggle{position:sticky;left:0}
}