/* Большая карта (ui/world-map.js, panels.renderMap): карта на всю ширину окна, справа — цель, районы, слои, легенда */
.panel.world-map { width: min(1240px, 96vw); height: min(860px, 92vh); display: flex; flex-direction: column; }
.panel.world-map .panel-body { flex: 1; min-height: 0; overflow: hidden; padding: 0; }
.wm-layout { display: grid; grid-template-columns: minmax(0, 1fr) 270px; height: 100%; min-height: 0; }
.wm-stage { position: relative; min-height: 0; overflow: hidden; background: #d8c9a3; border-right: 1px solid var(--edge); }
.wm-canvas { display: block; touch-action: none; cursor: grab; outline: none; }
.wm-canvas.dragging { cursor: grabbing; }
.wm-canvas:focus-visible { box-shadow: inset 0 0 0 2px var(--gold-2); }

/* кнопки масштаба — столбиком у левого края, как на бумажной карте с пометками */
.wm-tools { position: absolute; left: 12px; top: 12px; display: flex; flex-direction: column; gap: 4px; }
.wm-tool {
  width: 34px; height: 34px; display: grid; place-items: center; cursor: pointer;
  font: 600 18px Georgia, serif; color: #3e3320; background: rgba(240, 230, 204, .92);
  border: 1px solid rgba(80, 60, 34, .55); border-radius: 3px; box-shadow: 0 2px 6px rgba(40, 28, 12, .25);
}
.wm-tool:hover { background: #fff6dc; }
.wm-tool:focus-visible { outline: 2px solid #8a6a2c; outline-offset: 1px; }

/* подсказка над значком */
.wm-tip {
  position: absolute; pointer-events: none; max-width: 220px; padding: 6px 9px; display: flex; flex-direction: column; gap: 2px;
  background: rgba(36, 30, 20, .94); color: #f1e4c2; border: 1px solid rgba(217, 182, 95, .6); border-radius: 3px;
  font: 12px Georgia, serif; box-shadow: 0 4px 12px rgba(0, 0, 0, .3);
}
.wm-tip b { font-weight: 600; }
.wm-tip span { color: #cdbf98; font-size: 11px; }

/* боковая колонка */
.wm-side { overflow-y: auto; padding: 14px 14px 18px; display: flex; flex-direction: column; gap: 8px; }
.wm-side .journey-selector { margin: 0; }
.wm-target {
  display: flex; flex-direction: column; gap: 3px; text-align: left; padding: 9px 11px; cursor: pointer;
  background: rgba(184, 64, 42, .12); border: 1px solid rgba(184, 64, 42, .5); border-radius: 3px; color: var(--ink);
}
.wm-target span { font-size: 10px; letter-spacing: 2px; text-transform: uppercase; color: #e59a83; }
.wm-target b { font-weight: 600; font-size: 13px; }
.wm-target:hover { background: rgba(184, 64, 42, .2); }
.wm-head { margin: 10px 0 0; font-size: 10px; letter-spacing: 2.5px; text-transform: uppercase; color: var(--gold); }
.wm-regions { display: grid; grid-template-columns: 1fr 1fr; gap: 5px; }
.wm-region {
  padding: 7px 8px; text-align: left; cursor: pointer; font-size: 12px; color: var(--ink);
  background: rgba(255, 255, 255, .04); border: 1px solid var(--edge); border-radius: 3px;
}
.wm-region:hover { border-color: var(--edge-strong); background: rgba(219, 194, 140, .1); }
.wm-layer { display: flex; gap: 8px; align-items: flex-start; font-size: 12px; color: #d3dccf; cursor: pointer; }
.wm-layer input { accent-color: var(--gold); margin-top: 2px; }
.wm-legend { display: grid; grid-template-columns: 1fr 1fr; gap: 6px 8px; font-size: 11.5px; color: #d3dccf; }
.wm-legend span { display: flex; align-items: center; gap: 6px; }
.wm-legend svg { flex: none; color: #f1e4c2; background: #2f2a21; border: 1px solid rgba(240, 226, 190, .5); border-radius: 50%; padding: 2px; width: 20px; height: 20px; }
.wm-legend i { flex: none; display: inline-block; width: 20px; height: 20px; }
.wm-arrow { background: #e0b23c; clip-path: polygon(50% 0, 85% 90%, 50% 70%, 15% 90%); }
.wm-ring { border: 2.5px dashed #b8402a; border-radius: 50%; box-sizing: border-box; }

@media (max-width: 1000px) {
  .wm-layout { grid-template-columns: minmax(0, 1fr) 220px; }
  .wm-regions, .wm-legend { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .wm-layout { grid-template-columns: 1fr; grid-template-rows: minmax(300px, 1fr) auto; }
  .wm-stage { border-right: none; border-bottom: 1px solid var(--edge); }
  .wm-side { max-height: 38vh; }
}

/* план этажа подземелья: та же раскладка, сверху сбоку — номер и тема этажа */
.wm-floor { padding: 9px 11px; border: 1px solid var(--edge); border-radius: 3px; background: rgba(255, 255, 255, .03); }
.wm-floor span { font-size: 10px; letter-spacing: 2px; text-transform: uppercase; color: var(--gold); }
.wm-floor b { display: block; margin: 3px 0; font-family: var(--font-title); font-weight: 400; font-size: 16px; color: var(--ink); }
.wm-floor p { margin: 0; font-size: 12px; color: var(--ink-dim); }
.wm-foe { background: #b8402a; border: 1.5px solid #2f2416; border-radius: 50%; box-sizing: border-box; transform: scale(.6); }
.wm-note { margin: 6px 0 0; font-size: 11.5px; line-height: 1.5; color: var(--ink-dim); }

/* миникарта (ui/hud.js, updateRadar) — бумажный круг в латунной оправе, как большая карта */
.radar { background: #d8c9a3; border: 2px solid #5a4528; box-shadow: 0 0 0 2px #d9b65f, 0 0 0 6px rgba(28, 24, 16, .88), 0 8px 20px rgba(0, 0, 0, .35); }
.radar-n { top: 4px; color: #3e3320; font-family: Georgia, serif; text-shadow: 0 0 3px rgba(240, 230, 204, .95), 0 0 2px rgba(240, 230, 204, .95); }