/* Map readability overrides. Keep route filters and layout behavior unchanged. */
body[data-route="map"] .map-v3-monster>b{
  width:30px;
  height:30px;
  background:rgba(4,13,18,.72);
}

/* Map v5: round monsters, corner route badges and one compact signal group per lane. */
body[data-route="map"] .map-v3-monster>b,
body[data-route="map"] .map-v3-monster img,
body[data-route="map"] .map-v3-monster .inline-icon{
  border-radius:50%!important;
  overflow:hidden;
}

body[data-route="map"] .map-v3-route-number{width:14px;height:14px;border-width:1px}
body[data-route="map"] .map-v3-route-number b{font-size:6.5px}

body[data-route="map"] .map-v3-lane{
  display:grid;
  width:max-content;
  grid-template-columns:auto 28px auto;
  grid-template-areas:"blue signals red";
  gap:4px;
  align-items:center;
}
body[data-route="map"] .map-v3-lane-team{display:flex;align-items:center;min-width:34px}
body[data-route="map"] .map-v3-lane-team.blue{grid-area:blue;justify-content:flex-end}
body[data-route="map"] .map-v3-lane-team.red{grid-area:red;justify-content:flex-start}
body[data-route="map"] .map-v3-lane-team .map-champion-token{grid-area:auto!important;flex:0 0 34px}
body[data-route="map"] .map-v3-lane-team .map-champion-token+.map-champion-token{margin-left:-7px!important}

body[data-route="map"] .map-v3-lane-signals{
  grid-area:signals;
  position:relative;
  display:grid;
  width:28px;
  height:30px;
  place-items:center;
}
body[data-route="map"] .map-v3-lane-signals .map-v3-lane-edge{
  grid-area:auto;
  width:26px;
  min-width:26px;
  min-height:22px;
  border:1px solid rgba(255,255,255,.72);
  border-radius:6px;
  padding:2px;
  box-shadow:0 3px 8px rgba(0,0,0,.7);
}
body[data-route="map"] .map-v3-lane-signals .map-v3-lane-edge b{font-size:15px;letter-spacing:-2px}
body[data-route="map"] .map-v3-lane-signals .map-v3-lane-edge small{display:none}

body[data-route="map"] .map-v3-lane-danger{
  position:absolute;
  top:-12px;
  right:-9px;
  z-index:3;
  display:grid;
  width:17px;
  height:17px;
  place-items:center;
  border:1px solid #fff;
  border-radius:50%;
  background:#b45309;
  color:#fff;
  box-shadow:0 2px 7px rgba(0,0,0,.72);
}
body[data-route="map"] .map-v3-lane-danger b{font-size:8px;line-height:1}
body[data-route="map"] .map-v3-lane-danger.warning{background:#dc2626}
body[data-route="map"] .map-v3-lane-danger.critical{
  top:-15px;
  right:-11px;
  width:20px;
  height:18px;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
}
body[data-route="map"] .map-v3-lane-danger.critical i,
body[data-route="map"] .map-v3-monster>em.critical i,
body[data-route="map"] .map-v3-legend .danger i{
  position:relative;
  display:block;
  width:20px;
  height:18px;
  clip-path:polygon(50% 0,100% 100%,0 100%);
  background:#dc2626;
  filter:drop-shadow(0 2px 3px rgba(0,0,0,.7));
}
body[data-route="map"] .map-v3-lane-danger.critical i::after,
body[data-route="map"] .map-v3-monster>em.critical i::after,
body[data-route="map"] .map-v3-legend .danger i::after{
  content:"!";
  position:absolute;
  left:0;
  right:0;
  bottom:1px;
  color:#fff;
  font-size:10px;
  font-style:normal;
  font-weight:1000;
  text-align:center;
}
body[data-route="map"] .map-v3-monster>em.critical{
  top:-12px;
  right:-13px;
  width:20px;
  height:18px;
  border:0;
  background:transparent;
  padding:0;
  box-shadow:none;
}

body[data-route="map"] .map-v3-jungler.route-start>b{display:none}
body[data-route="map"] .map-v3-jungler.route-start,
body[data-route="map"] .map-v3-jungler.route-auto{z-index:14}
body[data-route="map"] .map-v3-jungler.route-start .portrait{width:28px!important;height:28px!important;border:2px solid #fff!important}
body[data-route="map"] .map-v3-jungler.route-start.blue .portrait{border-color:#7dd3fc!important}
body[data-route="map"] .map-v3-jungler.route-start.red .portrait{border-color:#fca5a5!important}

body[data-route="map"] .map-v3-center-controls label{min-height:36px;cursor:pointer}
body[data-route="map"] .map-v3-center-controls input{width:16px;height:16px;accent-color:#2563eb}
body[data-route="map"] .map-v3-legend .danger i{width:15px;height:14px;filter:none}
body[data-route="map"] .map-v3-legend .danger i::after{font-size:8px}

@media(max-width:650px){
  body[data-route="map"] .map-v3-lane{grid-template-columns:auto 25px auto;gap:2px}
  body[data-route="map"] .map-v3-lane-signals{width:25px}
  body[data-route="map"] .map-v3-lane-signals .map-v3-lane-edge{width:24px;min-width:24px}
  body[data-route="map"] .map-v3-lane.lane-bot{left:79%!important}
}

body[data-route="map"] .map-v3-monster img,
body[data-route="map"] .map-v3-monster .inline-icon{
  width:28px!important;
  height:28px!important;
  --inline-icon-size:28px!important;
}

body[data-route="map"] .map-v3-monster>em{
  top:-14px;
  right:-19px;
}

body[data-route="map"] .map-v3-objective-list>article{
  min-height:76px;
}

body[data-route="map"] .map-v3-objective-center{
  grid-template-columns:52px minmax(0,1fr);
  gap:8px;
}

body[data-route="map"] .map-v3-objective-center>.objective-icon-shell{
  width:52px;
  height:52px;
  padding:3px;
}

body[data-route="map"] .map-v3-objective-center .objective-img{
  width:46px;
  height:46px;
}

body[data-route="map"] .map-v3-objective-center>span{
  gap:1px;
}

body[data-route="map"] .map-v3-objective-center small,
body[data-route="map"] .map-v3-objective-center b,
body[data-route="map"] .map-v3-objective-center em{
  overflow:visible;
  max-width:100%;
  text-overflow:clip;
  white-space:normal;
}

body[data-route="map"] .map-v3-objective-center b{
  font-size:12px;
  line-height:1.2;
}

body[data-route="map"] .map-v3-objective-center em{
  width:auto;
  line-height:1.2;
}

/* Active v3 map: keep the lane signal in the middle of both teams. */
body[data-route="map"] .map-v3-lane{
  grid-template-columns:34px 24px 34px;
  grid-template-areas:"blue signal red";
  gap:3px;
}

body[data-route="map"] .map-v3-lane .map-champion-token.blue{grid-area:blue}
body[data-route="map"] .map-v3-lane .map-v3-lane-edge{grid-area:signal;min-width:24px;padding:2px}
body[data-route="map"] .map-v3-lane .map-champion-token.red{grid-area:red}
body[data-route="map"] .map-v3-lane-edge small{display:none}
body[data-route="map"] .map-v3-lane-edge b{font-size:15px;letter-spacing:-2px}

/* Monsters carry the visual weight; route order is only a small corner badge. */
body[data-route="map"] .map-v3-monster-layer{z-index:11}
body[data-route="map"] .map-v3-monster>b{
  width:36px;
  height:36px;
  background:rgba(4,13,18,.78);
}
body[data-route="map"] .map-v3-monster img,
body[data-route="map"] .map-v3-monster .inline-icon{
  width:34px!important;
  height:34px!important;
  --inline-icon-size:34px!important;
  filter:drop-shadow(0 3px 3px rgba(0,0,0,.9));
}
body[data-route="map"] .map-v3-route-number-layer{z-index:12}
body[data-route="map"] .map-v3-route-number{
  width:16px;
  height:16px;
  border-width:1px;
}
body[data-route="map"] .map-v3-route-number b{font-size:7px}
body[data-route="map"] .map-v3-monster>em{
  top:-8px;
  right:-10px;
  padding:2px 3px;
  font-size:7px;
}

/* Gank/danger is a compact icon beside the real lane fight, never a text pill. */
body[data-route="map"] .map-v3-gank-layer{z-index:13}
body[data-route="map"] .map-v3-gank-signal{
  display:block;
  width:22px;
  height:22px;
  min-height:22px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.95);
  border-radius:6px;
  padding:0;
  background:#07111f url("assets/ui-icons/gank-route.svg") center/18px 18px no-repeat!important;
  color:transparent!important;
  box-shadow:0 0 0 2px rgba(3,9,18,.82),0 0 12px rgba(250,204,21,.72);
}
body[data-route="map"] .map-v3-gank-signal>*{display:none!important}
body[data-route="map"] .map-v3-gank-signal.lane-top{left:20%!important;top:11%!important}
body[data-route="map"] .map-v3-gank-signal.lane-mid{left:50%!important;top:50%!important}
body[data-route="map"] .map-v3-gank-signal.lane-bot{left:84%!important;top:84%!important}
body[data-route="map"] .map-v3-gank-signal.blue{margin-top:-23px}
body[data-route="map"] .map-v3-gank-signal.red{margin-top:23px}

/* Main map hierarchy: lane duel -> centered gank signal -> monsters -> route order. */
body[data-route="map"] .map-main-canvas .map-lane-state.champion-only{
  width:82px!important;
  height:36px!important;
}

body[data-route="map"] .map-main-canvas .map-lane-state.champion-only>div,
body[data-route="map"] .map-main-canvas .map-lane-state.champion-only.lane-mid,
body[data-route="map"] .map-main-canvas .map-lane-state.champion-only.lane-mid>div{
  width:82px!important;
  height:36px!important;
}

body[data-route="map"] .map-main-canvas .map-lane-state.champion-only .map-champion-token{
  width:34px!important;
  height:34px!important;
  box-shadow:0 0 0 2px rgba(3,9,18,.72),0 7px 16px rgba(0,0,0,.58)!important;
}

body[data-route="map"] .map-main-canvas .map-lane-state.champion-only .map-champion-token .portrait,
body[data-route="map"] .map-main-canvas .map-lane-state.champion-only .map-champion-token img{
  width:30px!important;
  height:30px!important;
}

body[data-route="map"] .map-main-canvas .map-monster-position-layer{
  z-index:11;
}

body[data-route="map"] .map-main-canvas .map-monster-node,
body[data-route="map"] .map-main-canvas .map-monster-node>b{
  width:36px!important;
  height:36px!important;
}

body[data-route="map"] .map-main-canvas .map-monster-node>b{
  background:#07111f!important;
  box-shadow:0 0 0 2px rgba(255,255,255,.92),0 3px 10px rgba(0,0,0,.78),0 0 14px rgba(34,211,238,.22)!important;
}

body[data-route="map"] .map-main-canvas .map-monster-node .map-monster-icon{
  width:36px!important;
  height:36px!important;
}

body[data-route="map"] .map-main-canvas .map-monster-node.blue>b{box-shadow:0 0 0 2px #7dd3fc,0 3px 10px rgba(0,0,0,.78),0 0 15px rgba(56,189,248,.42)!important}
body[data-route="map"] .map-main-canvas .map-monster-node.red>b{box-shadow:0 0 0 2px #fca5a5,0 3px 10px rgba(0,0,0,.78),0 0 15px rgba(251,113,133,.42)!important}
body[data-route="map"] .map-main-canvas .map-monster-node.scuttle>b{box-shadow:0 0 0 2px #67e8f9,0 3px 10px rgba(0,0,0,.78),0 0 16px rgba(34,211,238,.55)!important}

body[data-route="map"] .map-main-canvas .map-monster-node>em{
  right:-3px;
  bottom:-3px;
  width:12px;
  height:12px;
  border-width:1px;
  font-size:6px;
}

body[data-route="map"] .map-main-canvas .check-route-layer{z-index:12}

body[data-route="map"] .map-main-canvas .map-check-node{
  width:15px;
  height:15px;
  min-width:15px;
  grid-template-columns:15px;
  gap:0;
  border:0;
  background:transparent;
  padding:0;
  box-shadow:none;
}

body[data-route="map"] .map-main-canvas .map-check-node>b{
  width:15px;
  height:15px;
  border:1px solid rgba(255,255,255,.95);
  font-size:7px;
  box-shadow:0 2px 5px rgba(0,0,0,.65);
}

body[data-route="map"] .map-main-canvas .map-check-node>small{display:none}
body[data-route="map"] .map-main-canvas .map-check-node:not(.gank).blue{transform:translate(-120%,-135%)}
body[data-route="map"] .map-main-canvas .map-check-node:not(.gank).red{transform:translate(20%,-135%)}

/* A gank warning is a single symbol at the matchup midpoint. */
body[data-route="map"] .map-main-canvas .map-check-node.gank{
  z-index:14;
  width:22px;
  height:22px;
  min-width:22px;
  transform:translate(-50%,-50%);
  border:1px solid rgba(255,255,255,.95);
  border-radius:6px;
  background:#07111f url("assets/ui-icons/gank-route.svg") center/18px 18px no-repeat;
  box-shadow:0 0 0 2px rgba(3,9,18,.8),0 0 13px rgba(250,204,21,.72);
}

body[data-route="map"] .map-main-canvas .map-check-node.gank>b,
body[data-route="map"] .map-main-canvas .map-check-node.gank>small,
body[data-route="map"] .map-main-canvas .map-check-node.gank>em{
  display:none;
}

body[data-route="map"] .map-main-canvas .map-check-node.gank.blue,
body[data-route="map"] .map-main-canvas .map-check-node.gank.red{
  margin-left:0;
}
body[data-route="map"] .map-main-canvas .map-check-node.gank.blue{margin-left:3px!important}
body[data-route="map"] .map-main-canvas .map-check-node.gank.red{margin-left:-3px!important}

/* River conflict warnings remain icon-only and anchored to the fight point. */
body[data-route="map"] .map-main-canvas .map-scuttle-read span{
  width:18px;
  height:18px;
  min-width:18px;
  min-height:18px;
  place-items:center;
  overflow:hidden;
  border-radius:50%;
  padding:0;
  background:#7c2d12;
  color:#fff;
  box-shadow:0 0 0 2px rgba(255,255,255,.84),0 0 12px rgba(239,68,68,.7);
}

body[data-route="map"] .map-main-canvas .map-scuttle-read span::before{
  content:"!";
  font-size:11px;
  font-weight:1000;
  line-height:1;
}

body[data-route="map"] .map-main-canvas .map-scuttle-read b,
body[data-route="map"] .map-main-canvas .map-scuttle-read small{display:none}

@media(max-width:650px){
  body[data-route="map"] .map-v3-monster>b{
    width:36px;
    height:36px;
  }

  body[data-route="map"] .map-v3-monster img,
  body[data-route="map"] .map-v3-monster .inline-icon{
    width:34px!important;
    height:34px!important;
    --inline-icon-size:34px!important;
  }

  body[data-route="map"] .map-v3-objective-center{
    grid-template-columns:44px minmax(0,1fr);
    gap:6px;
  }

  body[data-route="map"] .map-v3-objective-center>.objective-icon-shell{
    width:44px;
    height:44px;
  }

  body[data-route="map"] .map-v3-objective-center .objective-img{
    width:38px;
    height:38px;
  }

  body[data-route="map"] .map-main-canvas .map-monster-node,
  body[data-route="map"] .map-main-canvas .map-monster-node>b,
  body[data-route="map"] .map-main-canvas .map-monster-node .map-monster-icon{
    width:32px!important;
    height:32px!important;
  }
}

/* v5 final cascade: these rules intentionally win over earlier map compatibility blocks. */
body[data-route="map"] .map-v3-route-number{width:14px;height:14px;border-width:1px}
body[data-route="map"] .map-v3-route-number b{font-size:6.5px}
body[data-route="map"] .map-v3-lane{
  width:max-content;
  grid-template-columns:auto 28px auto;
  grid-template-areas:"blue signals red";
  gap:4px;
}
body[data-route="map"] .map-v3-lane-team.blue{grid-area:blue}
body[data-route="map"] .map-v3-lane-team.red{grid-area:red}
body[data-route="map"] .map-v3-lane-signals{grid-area:signals}
body[data-route="map"] .map-v3-lane>.map-v3-lane-team,
body[data-route="map"] .map-v3-lane>.map-v3-lane-signals,
body[data-route="map"] .map-v3-lane-signals>.map-v3-lane-edge{
  position:static;
  z-index:auto;
  transform:none;
}
body[data-route="map"] .map-v3-lane-signals>.map-v3-lane-edge{grid-area:auto;min-width:26px;padding:2px}
body[data-route="map"] .map-v3-lane-signals>.map-v3-lane-danger{transform:none}
@media(max-width:650px){
  body[data-route="map"] .map-v3-lane{grid-template-columns:auto 25px auto;gap:2px}
  body[data-route="map"] .map-v3-lane-signals .map-v3-lane-edge{min-width:24px}
}