/* Forest Frontier v0.9.8 — медальонная карта Руин.
   Один функциональный граф: компактные узлы, три дорожки, скрытие на два шага. */

body.theme-ashen .ruins-route-map {
  overflow: hidden;
  padding: 10px 8px 12px;
  border: 1px solid rgba(54, 112, 96, .48);
  border-radius: 14px;
  background:
    radial-gradient(circle at 50% 32%, rgba(29, 78, 63, .18), transparent 38%),
    linear-gradient(180deg, rgba(5, 19, 16, .95), rgba(4, 12, 10, .98));
}

body.theme-ashen .ruins-labyrinth-map {
  display: grid;
  gap: 8px;
  min-width: 0;
}

body.theme-ashen .ruins-labyrinth-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  padding: 2px 4px 0;
}
body.theme-ashen .ruins-labyrinth-head > span {
  color: #d9bd78;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .1em;
  text-transform: uppercase;
}
body.theme-ashen .ruins-labyrinth-head > small {
  color: #779389;
  font-size: 10px;
  text-align: right;
}

body.theme-ashen .ruins-guardian-caption {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  color: #e1c376;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}
body.theme-ashen .ruins-guardian-caption span { font-size: 17px; }

body.theme-ashen .ruins-medallion-canvas {
  position: relative;
  min-width: 0;
  height: var(--ruins-map-height);
  isolation: isolate;
  background:
    linear-gradient(90deg, transparent 0 16%, rgba(69, 103, 91, .05) 16.2% 16.45%, transparent 16.7% 49.7%, rgba(69, 103, 91, .05) 49.9% 50.15%, transparent 50.35% 83%, rgba(69, 103, 91, .05) 83.2% 83.45%, transparent 83.7%),
    radial-gradient(circle at 50% 50%, rgba(35, 77, 63, .08), transparent 60%);
}
body.theme-ashen .ruins-medallion-canvas::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -1;
  opacity: .18;
  background-image:
    linear-gradient(30deg, transparent 48%, rgba(110, 145, 132, .12) 49%, transparent 51%),
    linear-gradient(-30deg, transparent 48%, rgba(110, 145, 132, .08) 49%, transparent 51%);
  background-size: 78px 78px;
  mask-image: linear-gradient(to bottom, transparent, #000 10%, #000 90%, transparent);
}

body.theme-ashen .ruins-medallion-paths {
  position: absolute;
  inset: 0;
  z-index: 0;
  width: 100%;
  height: 100%;
  overflow: visible;
  pointer-events: none;
}
body.theme-ashen .ruins-medallion-paths path {
  fill: none;
  stroke: #334640;
  stroke-width: 1.8;
  stroke-linecap: round;
  vector-effect: non-scaling-stroke;
  opacity: .32;
}
body.theme-ashen .ruins-medallion-paths path.available {
  stroke: #6dd8a1;
  stroke-width: 3;
  opacity: .96;
  filter: drop-shadow(0 0 4px rgba(78, 214, 151, .58));
}
body.theme-ashen .ruins-medallion-paths path.active {
  stroke: #c8aa60;
  stroke-width: 2.7;
  opacity: .88;
  filter: drop-shadow(0 0 3px rgba(200, 170, 96, .42));
}
body.theme-ashen .ruins-medallion-paths path.mystery {
  stroke-dasharray: 5 5;
  opacity: .23;
}

body.theme-ashen .ruins-medallion-grid {
  position: relative;
  z-index: 1;
  display: grid;
  grid-auto-rows: 94px;
  min-width: 0;
}
body.theme-ashen .ruins-medallion-row {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  align-items: start;
  min-width: 0;
}
body.theme-ashen .ruins-medallion-spacer { min-width: 0; }

body.theme-ashen .ruins-medallion-node {
  position: relative;
  display: grid;
  justify-items: center;
  align-content: start;
  gap: 3px;
  width: 100%;
  min-width: 0;
  min-height: 90px;
  margin: 0;
  padding: 0 2px;
  border: 0;
  background: transparent;
  color: #d4c29a;
  text-align: center;
  appearance: none;
}
body.theme-ashen button.ruins-medallion-node { cursor: pointer; }
body.theme-ashen button.ruins-medallion-node:active { transform: translateY(1px); }

body.theme-ashen .ruins-medallion-shell {
  position: relative;
  display: grid;
  place-items: center;
  width: 58px;
  height: 58px;
  border: 2px solid currentColor;
  border-radius: 50%;
  background:
    radial-gradient(circle at 35% 28%, rgba(255,255,255,.09), transparent 24%),
    linear-gradient(145deg, rgba(23, 33, 29, .99), rgba(6, 10, 9, .99));
  box-shadow:
    inset 0 0 0 4px rgba(2, 6, 5, .72),
    inset 0 0 14px rgba(255,255,255,.025),
    0 5px 12px rgba(0,0,0,.48);
}
body.theme-ashen .ruins-medallion-node.hex .ruins-medallion-shell {
  border: 0;
  border-radius: 0;
  background: currentColor;
  clip-path: polygon(50% 0, 92% 23%, 92% 77%, 50% 100%, 8% 77%, 8% 23%);
}
body.theme-ashen .ruins-medallion-node.hex .ruins-medallion-shell::before {
  content: '';
  position: absolute;
  inset: 2px;
  z-index: 0;
  clip-path: inherit;
  background:
    radial-gradient(circle at 35% 28%, rgba(255,255,255,.1), transparent 24%),
    linear-gradient(145deg, #15211d, #060b09 76%);
}
body.theme-ashen .ruins-medallion-icon {
  position: relative;
  z-index: 1;
  width: 31px;
  height: 31px;
  filter: drop-shadow(0 0 3px rgba(255,255,255,.08));
}
body.theme-ashen .ruins-medallion-node.boss .ruins-medallion-shell {
  width: 70px;
  height: 70px;
  color: #e0bd68;
  box-shadow: 0 0 0 3px rgba(213, 174, 84, .17), 0 0 24px rgba(61, 153, 112, .22);
}
body.theme-ashen .ruins-medallion-node.boss .ruins-medallion-icon { width: 39px; height: 39px; }

body.theme-ashen .ruins-medallion-node.normal { color: #d8c79f; }
body.theme-ashen .ruins-medallion-node.elite { color: #76e09a; }
body.theme-ashen .ruins-medallion-node.rare { color: #75cfff; }
body.theme-ashen .ruins-medallion-node.recovery { color: #83d992; }
body.theme-ashen .ruins-medallion-node.altar { color: #bda5ff; }
body.theme-ashen .ruins-medallion-node.reward { color: #e1bf68; }
body.theme-ashen .ruins-medallion-node.sacrifice { color: #de8585; }
body.theme-ashen .ruins-medallion-node.event { color: #82cfbd; }
body.theme-ashen .ruins-medallion-node.unknown { color: #7e8a85; }
body.theme-ashen .ruins-medallion-node.boss { color: #e0bd68; }

body.theme-ashen .ruins-medallion-node.future { opacity: .58; }
body.theme-ashen .ruins-medallion-node.unknown.future { opacity: .48; }
body.theme-ashen .ruins-medallion-node.completed { opacity: .66; }
body.theme-ashen .ruins-medallion-node.position,
body.theme-ashen .ruins-medallion-node.current { opacity: 1; }
body.theme-ashen .ruins-medallion-node.available { opacity: 1; }
body.theme-ashen .ruins-medallion-node.available .ruins-medallion-shell {
  box-shadow:
    inset 0 0 0 4px rgba(2, 8, 5, .72),
    0 0 0 3px rgba(85, 219, 146, .25),
    0 0 20px rgba(65, 223, 139, .4),
    0 7px 14px rgba(0,0,0,.54);
  animation: ruinsMedallionPulse 1.8s ease-in-out infinite;
}
body.theme-ashen .ruins-medallion-node.available::after {
  content: '▲';
  position: absolute;
  top: 58px;
  color: #79e6a2;
  font-size: 11px;
  filter: drop-shadow(0 0 4px rgba(83, 228, 151, .62));
}
body.theme-ashen .ruins-medallion-node.position .ruins-medallion-shell,
body.theme-ashen .ruins-medallion-node.current .ruins-medallion-shell {
  box-shadow:
    inset 0 0 0 4px rgba(2, 8, 6, .72),
    0 0 0 3px rgba(224, 190, 106, .26),
    0 0 21px rgba(224, 190, 106, .28);
}
body.theme-ashen .ruins-medallion-node.position .ruins-node-label::before,
body.theme-ashen .ruins-medallion-node.current .ruins-node-label::before {
  content: 'ВЫ ЗДЕСЬ';
  display: block;
  margin-bottom: 1px;
  color: #e4c676;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .06em;
}

body.theme-ashen .ruins-node-label {
  display: grid;
  justify-items: center;
  min-width: 0;
  max-width: 105px;
  min-height: 26px;
  padding: 2px 5px;
  border-radius: 5px;
  background: rgba(3, 8, 7, .75);
  box-shadow: 0 1px 0 rgba(109, 132, 123, .18);
}
body.theme-ashen .ruins-node-label strong {
  max-width: 100%;
  overflow: hidden;
  color: currentColor;
  font-size: 11px;
  line-height: 1.12;
  text-overflow: ellipsis;
  white-space: nowrap;
}
body.theme-ashen .ruins-node-label small {
  color: #83968e;
  font-size: 10px;
  line-height: 1.05;
}
body.theme-ashen .ruins-medallion-node.boss .ruins-node-label { margin-top: -1px; }
body.theme-ashen .ruins-medallion-node.boss .ruins-node-label strong { color: #e4c676; }

body.theme-ashen .ruins-node-level {
  position: absolute;
  right: -3px;
  bottom: -2px;
  z-index: 2;
  display: grid;
  place-items: center;
  min-width: 20px;
  height: 20px;
  padding-inline: 4px;
  border: 1px solid rgba(216, 198, 157, .55);
  border-radius: 999px;
  background: #0a100e;
  color: #e4dcc8;
  font-size: 10px;
  font-weight: 900;
}
body.theme-ashen .ruins-node-check {
  position: absolute;
  right: -5px;
  top: -5px;
  z-index: 2;
  display: grid;
  place-items: center;
  width: 20px;
  height: 20px;
  border: 1px solid #78c8a7;
  border-radius: 50%;
  background: #315f50;
  color: #e7fff4;
  font-size: 11px;
  font-weight: 900;
}

body.theme-ashen .ruins-start-marker {
  display: grid;
  justify-items: center;
  gap: 1px;
  margin-top: -3px;
  color: #75d7bd;
  text-align: center;
}
body.theme-ashen .ruins-start-marker i {
  width: 0;
  height: 0;
  border-left: 7px solid transparent;
  border-right: 7px solid transparent;
  border-bottom: 9px solid #72d9b8;
  filter: drop-shadow(0 0 4px rgba(78, 219, 171, .45));
}
body.theme-ashen .ruins-start-marker strong {
  font-size: 12px;
  letter-spacing: .09em;
  text-transform: uppercase;
}
body.theme-ashen .ruins-start-marker small { color: #778b84; font-size: 10px; }
body.theme-ashen .ruins-start-marker.progressed { opacity: .55; }

body.theme-ashen .ruins-medallion-legend {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 5px;
  padding: 7px;
  border: 1px solid rgba(70, 96, 87, .45);
  border-radius: 9px;
  background: rgba(4, 10, 8, .7);
}
body.theme-ashen .ruins-medallion-legend > span {
  display: flex;
  align-items: center;
  gap: 5px;
  min-width: 0;
  color: #9aa9a3;
}
body.theme-ashen .ruins-medallion-legend svg { flex: 0 0 auto; width: 17px; height: 17px; }
body.theme-ashen .ruins-medallion-legend small {
  overflow: hidden;
  font-size: 10px;
  text-overflow: ellipsis;
  white-space: nowrap;
}
body.theme-ashen .ruins-medallion-legend .normal { color: #d8c79f; }
body.theme-ashen .ruins-medallion-legend .elite { color: #76e09a; }
body.theme-ashen .ruins-medallion-legend .rare { color: #75cfff; }
body.theme-ashen .ruins-medallion-legend .recovery { color: #83d992; }
body.theme-ashen .ruins-medallion-legend .altar { color: #bda5ff; }
body.theme-ashen .ruins-medallion-legend .unknown { color: #7e8a85; }

@keyframes ruinsMedallionPulse {
  0%,100% { transform: scale(1); }
  50% { transform: scale(1.035); }
}

@media (max-width: 420px) {
  body.theme-ashen .ruins-route-map { padding-inline: 5px; }
  body.theme-ashen .ruins-labyrinth-head { align-items: flex-start; }
  body.theme-ashen .ruins-labyrinth-head > small { max-width: 150px; }
  body.theme-ashen .ruins-medallion-shell { width: 56px; height: 56px; }
  body.theme-ashen .ruins-medallion-node.boss .ruins-medallion-shell { width: 66px; height: 66px; }
  body.theme-ashen .ruins-medallion-node.available::after { top: 56px; }
  body.theme-ashen .ruins-node-label { max-width: 98px; padding-inline: 3px; }
  body.theme-ashen .ruins-node-label strong { font-size: 10px; }
  body.theme-ashen .ruins-medallion-legend { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 350px) {
  body.theme-ashen .ruins-medallion-shell { width: 52px; height: 52px; }
  body.theme-ashen .ruins-medallion-icon { width: 28px; height: 28px; }
  body.theme-ashen .ruins-medallion-node.boss .ruins-medallion-shell { width: 62px; height: 62px; }
  body.theme-ashen .ruins-medallion-node.available::after { top: 52px; }
  body.theme-ashen .ruins-node-label { max-width: 91px; }
}

@media (prefers-reduced-motion: reduce) {
  body.theme-ashen .ruins-medallion-node.available .ruins-medallion-shell { animation: none; }
}