/* v2.0 World mode — стили */

:root{
  --bg:#0f1117;
  --panel:rgba(16,19,27,.94);
  --box:rgba(12,15,22,.82);
  --line:rgba(255,255,255,.12);
  --text:#eef1f6;
  --dim:#a8b0c0;
  --gold:#e8b64c;
  --gold-2:#f7d68a;
  --accent:#7fb8e8;
  --danger:#e06b6b;
  --shadow:0 18px 50px rgba(0,0,0,.55);
  --radius:16px;
  --ui:clamp(13px,1.45vw,17px);
}
*{/* HUD */
.hud{ position:absolute; inset:0 0 auto 0; padding:10px; z-index:7; pointer-events:none; }
.hud-row{ display:flex; gap:8px; align-items:center; margin-bottom:6px; pointer-events:auto; }
.hud-clock, .hud-loc, .hud-money{
  background:rgba(8,10,15,.78); border:1px solid var(--line); border-radius:99px;
  padding:5px 12px; font-size:.78em; font-weight:600; backdrop-filter:blur(6px); }
.hud-clock{ color:var(--gold-2); }
.hud-loc{ flex:1; text-align:center; color:var(--text); }
.hud-money{ color:#7ce0a3; }

.hud-actions{ display:flex; gap:6px; }
.hbtn{ width:34px; height:34px; border-radius:50%; font-size:1.05em;
  background:rgba(8,10,15,.78); border:1px solid var(--line); cursor:pointer; padding:0;
  display:grid; place-items:center; transition:background .14s, transform .14s; backdrop-filter:blur(6px); }
.hbtn:hover{ background:rgba(232,182,76,.85); transform:scale(1.07); }

/* NPC bar (left) */
.npc-bar{ position:absolute; left:14px; top:50%; transform:translateY(-50%);
  display:flex; flex-direction:column; gap:8px; z-index:6; max-width:240px; }
.npc-card{ display:flex; align-items:center; gap:8px; padding:6px 10px;
  background:rgba(8,10,15,.78); border:1px solid var(--line); border-radius:99px;
  cursor:pointer; transition:background .14s, transform .14s; backdrop-filter:blur(6px); }
.npc-card:hover{ background:rgba(232,182,76,.85); transform:translateX(3px); }
.npc-card .dot{ width:10px; height:10px; border-radius:50%; flex-shrink:0; }
.npc-card .name{ font-size:.78em; font-weight:600; }

/* scene items (clickable) */
.scene-items{ position:absolute; bottom:24%; left:0; right:0; z-index:5;
  display:flex; justify-content:center; gap:8px; flex-wrap:wrap; padding:0 14px; pointer-events:none; }
.scene-item{ pointer-events:auto; padding:6px 12px; background:rgba(8,10,15,.78);
  border:1px solid var(--gold); border-radius:99px; font-size:.78em; font-weight:600;
  cursor:pointer; color:var(--gold-2); display:flex; align-items:center; gap:6px; backdrop-filter:blur(6px); }
.scene-item:hover{ background:rgba(232,182,76,.85); color:#191204; }
.scene-item.taken{ opacity:.4; pointer-events:none; text-decoration:line-through; }

/* dialogue (reuses style.css .dialogue) */

/* choices */
.choice-menu{ position:absolute; left:0; right:0; top:25%; z-index:7;
  display:flex; flex-direction:column; align-items:center; padding:0 14px; }
.choice-q{ max-width:680px; background:rgba(8,10,15,.78); border:1px solid var(--gold);
  border-radius:14px; padding:14px 18px; margin-bottom:12px; font-size:.92em; line-height:1.45;
  text-align:center; color:var(--text); backdrop-filter:blur(8px); }
.choice-list{ display:flex; flex-direction:column; gap:8px; max-width:520px; width:100%; }
.choice-list button{ padding:11px 16px; background:rgba(8,10,15,.88);
  border:1px solid var(--line); border-radius:11px; text-align:left; color:var(--text);
  cursor:pointer; font:inherit; transition:background .14s, border-color .14s; }
.choice-list button:hover{ background:rgba(232,182,76,.85); color:#191204; border-color:transparent; }

/* map panel — list of districts + sub-locations */
.map-grid{ display:grid; gap:14px; }
.map-district{ background:rgba(255,255,255,.03); border:1px solid var(--line);
  border-radius:13px; padding:14px 16px; }
.map-district h3{ font-size:1.05em; margin-bottom:6px; display:flex; align-items:center; gap:8px; color:var(--gold-2); }
.map-district .open-hrs{ font-size:.78em; color:var(--dim); margin-bottom:10px; }
.map-loc{ display:flex; align-items:center; gap:8px; padding:8px 10px; border-radius:9px;
  background:rgba(255,255,255,.02); margin-bottom:5px; cursor:pointer; border:1px solid transparent;
  transition:background .14s, border-color .14s; }
.map-loc:hover{ background:rgba(232,182,76,.15); border-color:rgba(232,182,76,.3); }
.map-loc.current{ background:rgba(232,182,76,.85); color:#191204; }
.map-loc.current .name{ font-weight:700; }
.map-loc .name{ flex:1; font-size:.92em; }
.map-loc .time{ font-size:.74em; color:var(--dim); }
.map-loc .time.closed{ color:var(--danger); }
.map-loc .time.open{ color:#7ce0a3; }
.map-loc .icon{ font-size:1.1em; }

/* inventory */
.inv-grid{ display:grid; gap:8px; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); }
.inv-item{ display:flex; align-items:center; gap:10px; padding:10px 12px;
  background:rgba(255,255,255,.04); border:1px solid var(--line); border-radius:10px; }
.inv-item .icon{ font-size:1.4em; }
.inv-item .name{ font-weight:700; font-size:.92em; }
.inv-item .count{ color:var(--dim); font-size:.8em; margin-left:6px; }
.inv-item .use{ margin-left:auto; padding:5px 9px; border-radius:8px;
  background:rgba(232,182,76,.2); color:var(--gold-2); border:1px solid var(--gold); font-size:.76em; cursor:pointer; }
.inv-item .use:hover{ background:var(--gold); color:#191204; }
.inv-empty{ color:var(--dim); text-align:center; padding:30px; font-style:italic; }

/* quest log */
.quest-list{ display:flex; flex-direction:column; gap:10px; }
.quest-card{ padding:12px 14px; background:rgba(255,255,255,.04); border:1px solid var(--line);
  border-radius:11px; }
.quest-card.active{ border-color:rgba(232,182,76,.4); }
.quest-card.done{ opacity:.55; }
.quest-card h4{ font-size:1em; margin-bottom:4px; color:var(--gold-2); display:flex; align-items:center; gap:6px; }
.quest-card .desc{ color:var(--dim); font-size:.84em; margin-bottom:6px; }
.quest-card .obj{ font-size:.82em; padding:3px 0; }
.quest-card .obj.done{ color:#7ce0a3; text-decoration:line-through; }
.quest-card .obj.current{ color:var(--gold-2); font-weight:600; }
.quest-card .reward{ font-size:.78em; color:#7ce0a3; margin-top:4px; }

/* about */
.about p{ margin-bottom:10px; color:#dbe2ee; }
.about h3{ margin:14px 0 6px; font-size:1em; color:var(--gold); }
.about ul{ padding-left:20px; color:#dbe2ee; }
.about li{ margin-bottom:4px; }

/* responsive */
@media (max-width:760px){
  .hud-clock, .hud-loc, .hud-money{ font-size:.72em; padding:4px 9px; }
  .hbtn{ width:30px; height:30px; font-size:.95em; }
  .npc-bar{ max-width:160px; }
  .npc-card .name{ font-size:.72em; }
  .choice-q{ font-size:.86em; padding:10px 14px; }
  .map-loc .name{ font-size:.84em; }
}

/* SVG-карта в оверлее */
.map-svg-wrap{
  width: 100%;
  overflow: auto;
  max-height: 65vh;
  background: linear-gradient(180deg, #1a2030, #0c0e14);
  border-radius: 12px;
  padding: 8px;
  text-align: center;
}
.world-map-svg{
  display: block;
  margin: 0 auto;
  width: 100%;
  max-width: 800px;
  height: auto;
  user-select: none;
}
.world-map-svg .district-rect{
  transition: fill-opacity .15s, stroke-width .15s;
  cursor: default;
}
.world-map-svg .district-rect.open{ stroke-dasharray: none; }
.world-map-svg .district-rect.closed{ stroke-dasharray: 5,3; opacity: 0.7; }
.world-map-svg .loc{ transition: transform .12s; }
.world-map-svg .loc:hover circle{ stroke-width: 3px; }
.world-map-svg .loc:hover{ transform: scale(1.1); }
.world-map-svg .loc.here circle{ filter: drop-shadow(0 0 6px #e8b64c); }
.map-hint{
  text-align: center;
  color: var(--dim);
  font-size: 0.85em;
  margin-top: 8px;
}
.map-hint b{ color: var(--gold-2); }

/* Кнопки-выходы в сцене */
.scene-exit{
  pointer-events: auto;
  padding: 8px 14px;
  background: rgba(8,10,15,.82);
  border: 1px solid var(--gold);
  border-radius: 99px;
  font-size: 0.85em;
  font-weight: 600;
  cursor: pointer;
  color: var(--gold-2);
  display: inline-flex;
  align-items: center;
  gap: 6px;
  transition: background .14s, color .14s;
  backdrop-filter: blur(6px);
}
.scene-exit:hover{
  background: var(--gold);
  color: #191204;
}
.scene-exit:disabled{
  opacity: 0.4;
  cursor: not-allowed;
  border-color: var(--line);
  color: var(--dim);
}
.scene-exit:disabled:hover{ background: rgba(8,10,15,.82); color: var(--dim); }