#map-host { margin-bottom: 18px; }
#map-host[hidden], #game-content[hidden], .kremlin [hidden] { display: none !important; }
.kremlin { width: min(100%,1090px); margin-inline: auto; border: 1px solid #725337; border-radius: 8px; overflow: hidden; background: #1d1510; box-shadow: 0 18px 44px #08060494; }
.kremlin-heading { display: flex; justify-content: space-between; align-items: center; gap: 8px; padding: 10px clamp(11px,2.6vw,23px); background: linear-gradient(110deg,#312218,#1b140f 70%); }
.kremlin-heading h2 { margin-top: 3px; font: 700 clamp(29px,4vw,48px)/1 var(--serif); color: #f0ddc4; }
.kremlin-map-status { display: flex; align-items: center; justify-content: end; flex-wrap: wrap; gap: 4px 9px; font-size: .78rem; color: #dcc0a1; }
.kremlin-map-status time { white-space: nowrap; font-variant-numeric: tabular-nums; }
.kremlin-map-status .button,.kremlin-footer .button { min-height: 36px; padding: 5px 8px; }
.kremlin-stage { position: relative; isolation: isolate; overflow: hidden; width: 100%; aspect-ratio: 3/2; background: #1d211d; }
.kremlin-art,.kremlin-atmosphere,.kremlin-pins { position: absolute; inset: 0; width: 100%; height: 100%; }
.kremlin-art { display: block; object-fit: fill; transition: filter 1.2s ease; user-select: none; }
.kremlin-stage.is-night .kremlin-art { filter: brightness(.45) saturate(.68) contrast(1.08); }
.kremlin-atmosphere { pointer-events: none; }
.kremlin-atmosphere::before { content: ""; position: absolute; inset: 0; opacity: .12; transition: opacity 1.2s; background: radial-gradient(ellipse at 56% 35%,transparent 12%,#14253a 91%); }
.is-night .kremlin-atmosphere::before { opacity: .65; background: radial-gradient(ellipse at 64% 44%,#263c5730 8%,#091426cb 92%); }
.kremlin-water { position: absolute; inset: 0 0 0 70%; background: repeating-linear-gradient(172deg,transparent 0 9px,#d9d4b323 12px,transparent 15px 22px); mask-image: radial-gradient(ellipse at 80% 53%,#000 0%,#0008 46%,transparent 70%); animation: kremlin-drift 9s ease-in-out infinite alternate; }
.is-night .kremlin-water { background: repeating-linear-gradient(172deg,transparent 0 9px,#a9cdf329 12px,transparent 15px 22px); }
.kremlin-smoke { position: absolute; left: var(--x); top: var(--y); width: clamp(8px,2.2vw,25px); height: clamp(18px,4vw,60px); transform-origin: center bottom; translate: -50% -90%; opacity: .18; background: radial-gradient(ellipse at 50% 80%,#e5ddd4,transparent 66%); filter: blur(4px); animation: kremlin-smoke 5s var(--delay) infinite ease-out; }
.is-night .kremlin-smoke { opacity: .08; }
.kremlin-torch { position: absolute; left: var(--x); top: var(--y); width: clamp(3px,.5vw,6px); height: clamp(4px,.7vw,9px); border-radius: 70% 50% 60% 53%; translate: -50% -50%; opacity: 0; background: #fff1a5; box-shadow: 0 0 6px 2px #fb9b29,0 0 18px 6px #fb791596,0 0 34px 11px #79401f94; transition: opacity 1.1s ease; }
.kremlin-torch::after { content: ""; position: absolute; inset: -14px; background: radial-gradient(circle,#ff882732,transparent 70%); border-radius: 50%; }
.is-night .kremlin-torch { opacity: .94; animation: kremlin-flame 1.22s var(--delay) infinite alternate ease-in-out; }
.kremlin-pins { pointer-events: none; }
.kremlin-hunt { position: absolute; z-index: 2; left: var(--hunt-x); top: var(--hunt-y); translate: -50% -50%; pointer-events: auto;
  display: grid; width: clamp(26px,4vw,36px); aspect-ratio: 1; padding: 0; place-items: center;
  border: 1px solid #e4b286; border-radius: 50%; background: #542923; color: #ffe3ba;
  font-size: clamp(16px,2vw,24px); line-height: 1; box-shadow: 0 2px 8px #170d09bd; }
.kremlin-hunt:hover,.kremlin-hunt:focus-visible { background: #8c4330; }
.kremlin-hunt:disabled { pointer-events: none; opacity: .66; }
.kremlin-pin { pointer-events: none; position: absolute; left: var(--left); top: var(--top); width: var(--width); height: var(--height); padding: 0; border: 0; background: none; color: #fff0d9; font: inherit; }
.kremlin-hit { pointer-events: auto; position: absolute; inset: 0; border: 1px solid transparent; border-radius: 10px; }
.kremlin-pin-label { pointer-events: auto; position: absolute; z-index: 1; left: var(--x); top: var(--y); translate: -50% -55%; min-width: 44px; min-height: 40px; display: grid; justify-items: center; align-content: center; gap: 1px; }
.kremlin-pin i { display: grid; place-items: center; width: clamp(22px,3.6vw,38px); height: clamp(22px,3.6vw,38px); border: 1px solid #e3b585; border-radius: 7px; background: #2d1e17ec; color: #ffdaa4; box-shadow: 0 2px 10px #120b07bd; font: normal clamp(12px,1.8vw,20px)/1 Georgia,serif; }
.kremlin-pin-label > span { display: block; padding: 3px 5px; border: 1px solid #90674a; border-radius: 3px; background: #22150ff0; text-align: center; text-shadow: 0 1px 2px #090706; font-size: clamp(.64rem,1.31vw,.91rem); font-weight: 600; line-height: 1.05; }
.kremlin-pin.is-current i { color: #fff1c7; background: #663d21; box-shadow: 0 0 16px #f9c878b5; }
.kremlin-pin.is-current .kremlin-pin-label > span,.kremlin-pin.is-destination .kremlin-pin-label > span { color: #fff2c9; border-color: #ffce8d; }
.kremlin-pin:not(:disabled):hover .kremlin-hit,.kremlin-pin:focus-visible .kremlin-hit { border-color: #f7c485; background: #ffc77322; box-shadow: inset 0 0 12px #f7c4855f; }
.kremlin-pin:not(:disabled):hover i,.kremlin-pin:focus-visible i { background: #634324; }
.kremlin-pin:disabled :is(.kremlin-hit,.kremlin-pin-label) { pointer-events: none; }
.kremlin-pin:disabled { opacity: .72; }
.kremlin-pin.is-current:disabled,.kremlin-pin.is-destination:disabled { opacity: 1; }
.kremlin-route { position: absolute; left: var(--x); top: var(--y); width: var(--route-width); height: 3px; transform-origin: left center; transform: rotate(var(--route-angle)); background: repeating-linear-gradient(90deg,#eac58bd0 0 7px,transparent 7px 12px); box-shadow: 0 1px 6px #1c0d08a1; pointer-events: none; }
.kremlin-route::before { content: ""; position: absolute; top: 0; bottom: 0; left: 0; width: var(--travel-progress,0%); background: #f7bd67; }
.kremlin-route i { position: absolute; left: var(--travel-progress,0%); top: 50%; translate: -50% -50%; border-radius: 50%; width: 9px; height: 9px; border: 2px solid #ffe3b0; background: #e49b48; box-shadow: 0 0 10px #ffae61; transition: left .48s linear; }
.kremlin-travel { position: absolute; z-index: 4; inset-inline: clamp(8px,3%,30px); bottom: clamp(7px,2%,19px); display: grid; grid-template-columns: auto minmax(0,1fr) minmax(64px,25%); align-items: center; gap: 7px 12px; padding: 8px 10px; border: 1px solid #d6a46d; border-radius: 6px; background: #22150ff5; box-shadow: 0 2px 22px #1007049c; color: #ebd7be; }
.kremlin-travel h3 { font-size: clamp(23px,3vw,33px); color: #ffe0aa; }
.kremlin-travel-timing { display: grid; gap: 3px; text-align: right; }
.kremlin-travel-timing b { color: #f3bd7b; font: 700 clamp(15px,2vw,23px)/1 var(--sans); font-variant-numeric: tabular-nums; }
.kremlin-travel-timing progress { width: 100%; height: 7px; accent-color: #efb872; }
.kremlin-travel-signal { width: 9px; height: 9px; border-radius: 50%; background: #ffd28a; box-shadow: 0 0 10px #f4a557; animation: kremlin-flame 1.6s infinite alternate; }
.kremlin-footer { display: flex; justify-content: space-between; align-items: center; gap: 5px 10px; flex-wrap: wrap; padding: 7px 11px; background: #281b13; color: var(--muted); font-size: .78rem; }
[data-map-here] { color: #e8be94; font-weight: 600; }
@keyframes kremlin-drift { from { transform: translateX(-3px); opacity: .55; } to { transform: translateX(6px); opacity: 1; } }
@keyframes kremlin-smoke { 0% { transform: translateY(2px) scale(.65); } 100% { transform: translate(5px,-11px) scale(1.2); opacity: 0; } }
@keyframes kremlin-flame { 0%,34% { transform: scale(.78); opacity: .72; } 64%,100% { transform: scale(1.08); opacity: 1; } }
@media(max-width: 620px) {
  .kremlin-heading { padding: 8px; }
  .kremlin-heading .eyebrow { font-size: .57rem; letter-spacing: .1em; }
  .kremlin-map-status { font-size: .69rem; }
  .kremlin-pin { padding-inline: 2px; }
  .kremlin-pin-label > span { padding: 2px 3px; }
  .kremlin-travel { gap: 6px; padding: 6px; }
  .kremlin-travel p { font-size: .72rem; }
}

#game-space { container-type: inline-size; }
.kremlin-layout,.room-location-layout { display: grid; grid-template-columns: minmax(0,1fr) minmax(172px,24%); align-items: start; }
.room-location-layout { gap: 8px; }
.room-location-layout .location-scene { align-self: stretch; }
.place-directory { min-width: 0; padding: 8px; color: #edd9bd; background: #201710; border: 1px solid #59402a; }
.kremlin-layout > .place-directory { align-self: stretch; border-width: 0 0 0 1px; }
.place-directory h3 { padding: 3px 5px 6px; color: #edc696; font-size: 1.2rem; }
.place-directory ul { display: grid; list-style: none; margin: 0; padding: 0; gap: 2px; }
.place-directory button { display: grid; grid-template-columns: 14px minmax(0,1fr) auto; align-items: center; gap: 5px; width: 100%; min-height: 27px; padding: 3px 5px; color: inherit; background: transparent; border: 1px solid transparent; border-radius: 4px; text-align: left; font-size: .8rem; line-height: 1.16; }
.place-directory i { color: #ce9e63; font-style: normal; text-align: center; }
.place-directory small { color: #d0b48d; white-space: nowrap; font-variant-numeric: tabular-nums; }
.place-directory button:not(:disabled):hover,.place-directory button:focus-visible { border-color: #b58256; background: #382719; }
.place-directory .is-current,.place-directory .is-destination { border-color: #876344; color: #ffe4ae; background: #362517; }
.place-directory button:disabled:not(.is-current,.is-destination) { opacity: .58; }
.hall-details > .stack { display: grid; grid-template-columns: repeat(auto-fit,minmax(min(100%,245px),1fr)); align-items: start; }
@container (max-width: 660px) {
  .kremlin-layout,.room-location-layout { grid-template-columns: minmax(0,1fr); }
  .kremlin-layout > .place-directory { border-width: 1px 0 0; }
  .place-directory ul { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .place-directory button { min-height: 38px; }
  .room-location-layout .location-scene { border-radius: 6px; }
}
@container (max-width: 320px) {
  .place-directory button { grid-template-columns: minmax(0,1fr) auto; }
  .place-directory i { display: none; }
}
