/* Forest Frontier v0.9.5 — focused mobile fixes.
   Layout is corrected without shrinking the global UI scale. */

/* Reward cards use their own stable layout and never inherit inventory-grid geometry. */

/* Level locks are visible at a glance; comparison arrows are intentionally hidden in JS. */
body.theme-ashen .inventory-icon-cell.level-locked {
  border-style: dashed;
  border-color: rgba(170, 157, 124, .5);
  background: linear-gradient(155deg, rgba(22, 25, 22, .96), rgba(6, 9, 8, .98));
}
body.theme-ashen .inventory-icon-cell.level-locked .inventory-cell-icon {
  opacity: .48;
  filter: grayscale(.68) saturate(.55);
}
body.theme-ashen .inventory-level-lock {
  position: absolute;
  z-index: 4;
  inset: 50% 4px auto;
  display: grid;
  place-items: center;
  gap: 1px;
  padding: 3px 4px;
  transform: translateY(-50%);
  border: 1px solid rgba(214, 192, 143, .58);
  border-radius: 8px;
  background: rgba(5, 8, 7, .92);
  color: #e5d6ad;
  box-shadow: 0 5px 14px rgba(0, 0, 0, .5);
  pointer-events: none;
}
body.theme-ashen .inventory-level-lock b {
  font-size: 15px;
  line-height: 1;
}
body.theme-ashen .inventory-level-lock small {
  font-size: 10px;
  font-weight: 900;
  line-height: 1.05;
  white-space: nowrap;
}

/* Universal sockets and installed runes are visible directly in the icon grid. */
body.theme-ashen .inventory-socket-strip {
  position: absolute;
  z-index: 3;
  right: 4px;
  bottom: 4px;
  display: flex;
  justify-content: flex-end;
  gap: 2px;
  max-width: calc(100% - 35px);
  pointer-events: none;
}
body.theme-ashen .inventory-socket-marker {
  display: grid;
  place-items: center;
  width: 11px;
  height: 11px;
  flex: 0 0 11px;
  border: 1px solid rgba(102, 205, 193, .64);
  border-radius: 50%;
  background: rgba(3, 8, 7, .94);
  color: #74d8ce;
  font-size: 10px;
  font-weight: 900;
  line-height: 1;
  box-shadow: 0 1px 4px rgba(0, 0, 0, .65);
}
body.theme-ashen .inventory-socket-marker.empty {
  color: rgba(116, 216, 206, .62);
  border-style: dashed;
}
body.theme-ashen .inventory-socket-marker.filled {
  border-color: rgba(235, 215, 157, .72);
  color: #f1dda5;
  background: rgba(31, 27, 17, .96);
}
body.theme-ashen .inventory-socket-marker.special {
  border-radius: 3px;
  border-color: rgba(184, 132, 226, .78);
  color: #d8b5f1;
}
body.theme-ashen .inventory-socket-badge { display: none !important; }

/* Crushing strike keeps the same button height and uses a deliberate two-line label. */
body.theme-ashen #attackButton.crushing-ready {
  grid-template-columns: auto minmax(0, 1fr);
  gap: 6px;
  padding-inline: 7px;
}
body.theme-ashen #attackButton .crushing-action-label {
  display: grid;
  align-content: center;
  gap: 2px;
  min-width: 0;
  font-size: 12px;
  line-height: 1.02;
  text-align: center;
  white-space: normal;
}
body.theme-ashen #attackButton .crushing-action-label > span {
  display: block;
  min-width: 0;
  overflow-wrap: anywhere;
  font-size: inherit;
}
body.theme-ashen #attackButton .crushing-action-label > small {
  display: block;
  color: #f2d48c;
  font-size: 10px;
  line-height: 1;
  white-space: nowrap;
}

/* Ruins: compact opaque nodes, restrained future roads and explicit next transitions. */
body.theme-ashen .ruins-route-grid { gap: 8px; }
body.theme-ashen .ruins-route-row,
body.theme-ashen .ruins-node-spacer {
  height: 58px;
  min-height: 58px;
}
body.theme-ashen .ruins-route-node {
  height: 58px;
  min-height: 58px;
  padding: 6px 5px;
  grid-template-columns: 21px minmax(0, 1fr);
  gap: 4px;
  border-radius: 9px;
  background: linear-gradient(180deg, #111916, #080d0b);
  box-shadow: 0 5px 14px rgba(0, 0, 0, .42);
}
body.theme-ashen .ruins-route-node .ruins-node-glyph { font-size: 18px; }
body.theme-ashen .ruins-route-node .ruins-node-copy { gap: 1px; }
body.theme-ashen .ruins-route-node .ruins-node-copy strong {
  -webkit-line-clamp: 2;
  font-size: 10px;
  line-height: 1.06;
}
body.theme-ashen .ruins-route-node .ruins-node-copy small {
  font-size: 10px;
  line-height: 1.02;
}
body.theme-ashen .ruins-route-lines line {
  stroke-width: 1.5;
}
body.theme-ashen .ruins-route-lines line.locked {
  stroke: #43504b;
  opacity: .14;
}
body.theme-ashen .ruins-route-lines line.available {
  stroke: #d4b15f;
  stroke-width: 3;
  opacity: 1;
  filter: drop-shadow(0 0 4px rgba(212, 177, 95, .65));
}
body.theme-ashen .ruins-route-lines line.active {
  stroke: #70ccb0;
  stroke-width: 3.5;
  opacity: 1;
}
body.theme-ashen .ruins-route-node.locked {
  opacity: .34;
  filter: grayscale(.38) saturate(.55);
}
body.theme-ashen .ruins-route-node.completed { opacity: .64; }
body.theme-ashen .ruins-route-node.current {
  opacity: 1;
  border-color: #75d1b5;
  background: linear-gradient(180deg, #14251f, #09120f);
}
body.theme-ashen .ruins-route-node.available {
  opacity: 1;
  border-color: #d4b15f;
  background: linear-gradient(180deg, #192019, #0a100d);
  box-shadow: 0 0 0 2px rgba(212, 177, 95, .28), 0 0 20px rgba(212, 177, 95, .28);
}
/* “Опасный бой” follows the green combat language instead of the old yellow tier. */
body.theme-ashen .ruins-route-node.elite,
body.theme-ashen .ruins-route-node.elite.available {
  color: #92dda6;
  border-color: rgba(88, 184, 111, .82);
  background: linear-gradient(180deg, rgba(20, 48, 30, .98), rgba(8, 18, 12, .99));
}
body.theme-ashen .ruins-route-node.elite.available {
  box-shadow: 0 0 0 2px rgba(212, 177, 95, .28), 0 0 20px rgba(83, 184, 108, .3);
}

@media (max-width: 420px) {
  body.theme-ashen #attackButton .crushing-action-label { font-size: 11px; }
  body.theme-ashen .ruins-route-row { gap: 5px; }
  body.theme-ashen .ruins-route-node { padding-inline: 4px; grid-template-columns: 18px minmax(0, 1fr); gap: 2px; }
  body.theme-ashen .ruins-route-node .ruins-node-glyph { font-size: 16px; }
}

@media (max-width: 360px) {
  body.theme-ashen #attackButton .crushing-action-label { font-size: 10px; }
  body.theme-ashen #attackButton .battle-action-icon { font-size: 15px; }
  body.theme-ashen .inventory-socket-marker {
    width: 10px;
    height: 10px;
    flex-basis: 10px;
  }
}