/* Sweet Shift Saga v4.2.1.6 — Floating map HUD; no map navbar */
#screen-map.saga-map-screen{
  position:relative;
  overflow:hidden!important;
}
#screen-map .map-hud-layer{
  position:absolute;
  inset:0 0 auto 0;
  z-index:120;
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:18px;
  padding:14px 16px;
  pointer-events:none;
}
#screen-map .map-hud-left,
#screen-map .map-hud-right,
#screen-map .map-hud-currencies,
#screen-map .map-hud-tools{
  pointer-events:auto;
}
#screen-map .map-hud-left{
  display:flex;
  align-items:flex-start;
  gap:10px;
}
#screen-map .map-hud-back{
  width:48px;
  height:48px;
  padding:0 0 4px;
  border:3px solid rgba(255,255,255,.9);
  border-radius:18px;
  background:linear-gradient(180deg,#7654cf,#4a2c96);
  color:#fff;
  font:1000 2rem/1 inherit;
  cursor:pointer;
  box-shadow:0 5px 0 #34206f,0 10px 22px rgba(31,25,76,.3),inset 0 2px 0 rgba(255,255,255,.24);
}
#screen-map .map-hud-back:hover{transform:translateY(-1px)}
#screen-map .map-player-hud{
  width:clamp(210px,24vw,300px);
  min-height:58px;
  display:grid;
  grid-template-columns:46px auto 1fr;
  grid-template-rows:auto 14px;
  align-items:center;
  gap:3px 10px;
  padding:7px 12px 7px 7px;
  border:3px solid rgba(255,255,255,.87);
  border-radius:22px;
  background:linear-gradient(145deg,rgba(55,52,128,.94),rgba(35,77,139,.92));
  box-shadow:0 5px 0 rgba(36,34,91,.72),0 11px 24px rgba(17,45,80,.24),inset 0 2px 0 rgba(255,255,255,.2);
  backdrop-filter:blur(8px);
}
#screen-map .map-player-hud .player-avatar{
  grid-row:1/3;
  width:44px;
  height:44px;
  border:2px solid rgba(255,255,255,.9);
  box-shadow:0 3px 8px rgba(17,20,55,.24);
}
#screen-map .map-player-copy{
  display:flex;
  align-items:baseline;
  gap:7px;
  color:#fff;
  white-space:nowrap;
}
#screen-map .map-player-copy small{font-size:.61rem;font-weight:1000;letter-spacing:.11em;opacity:.78}
#screen-map .map-player-copy strong{font-size:1.05rem;font-weight:1000}
#screen-map .map-player-hud .account-xp-track{
  grid-column:2/4;
  height:11px;
  border:2px solid rgba(255,255,255,.86);
  border-radius:999px;
  overflow:hidden;
  background:rgba(8,24,65,.72);
  box-shadow:inset 0 2px 4px rgba(0,0,0,.18);
}
#screen-map .map-player-hud .account-xp-fill{display:block;height:100%;background:linear-gradient(90deg,#ffe544,#ff9e2f)}
#screen-map .map-hud-right{
  display:grid;
  justify-items:end;
  gap:9px;
}
#screen-map .map-hud-currencies{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:8px;
}
#screen-map .map-hud-pill{
  min-width:72px;
  height:43px;
  padding:0 12px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  border:3px solid rgba(255,255,255,.86);
  border-radius:18px;
  background:linear-gradient(180deg,rgba(38,88,148,.94),rgba(22,58,115,.94));
  color:#fff;
  box-shadow:0 4px 0 rgba(26,50,100,.68),0 8px 18px rgba(19,51,91,.2),inset 0 2px 0 rgba(255,255,255,.16);
  backdrop-filter:blur(7px);
}
#screen-map .map-hud-pill.sugar{background:linear-gradient(180deg,rgba(186,65,137,.95),rgba(125,43,112,.95))}
#screen-map .map-hud-pill.stars{background:linear-gradient(180deg,rgba(219,151,39,.96),rgba(175,98,24,.96))}
#screen-map .map-hud-pill>span{font-size:1.12rem;line-height:1}
#screen-map .map-hud-pill>strong{font-size:.9rem;font-weight:1000}
#screen-map .map-tool-grid.map-hud-tools{
  display:flex!important;
  justify-content:flex-end;
  gap:7px!important;
  margin:0!important;
}
#screen-map .map-hud-tools .map-tool-square{
  width:42px!important;
  min-width:42px!important;
  height:42px!important;
  min-height:42px!important;
  padding:0!important;
  display:grid!important;
  place-items:center!important;
  border:3px solid rgba(255,255,255,.88)!important;
  border-radius:16px!important;
  background:linear-gradient(180deg,#8059d7,#5131a3)!important;
  color:#fff!important;
  cursor:pointer;
  box-shadow:0 4px 0 #39217f,0 8px 16px rgba(28,24,75,.2)!important;
}
#screen-map .map-hud-tools .map-tool-square:hover{transform:translateY(-1px)}
#screen-map .map-hud-tools .map-tool-square strong,
#screen-map .map-hud-tools .map-tool-square small{display:none!important}
#screen-map .map-hud-tools .map-tool-icon{font-size:1.05rem!important}
#screen-map .saga-map-shell{
  height:100dvh!important;
  min-height:540px!important;
  min-width:0!important;
  width:100%!important;
  padding:0!important;
  margin:0!important;
}
/* The episode banner is part of the map scene, not a navbar. Leave extra air for the floating HUD. */
#screen-map .map4208-world-banner{top:88px!important}

@media(max-width:900px){
  #screen-map .map-hud-layer{padding:10px;gap:10px}
  #screen-map .map-player-hud{width:210px}
  #screen-map .map-hud-pill{min-width:58px;padding:0 9px}
  #screen-map .map-hud-tools .map-tool-square{width:38px!important;min-width:38px!important;height:38px!important;min-height:38px!important}
}
@media(max-width:720px){
  #screen-map .map-hud-layer{display:grid;grid-template-columns:1fr auto;align-items:start}
  #screen-map .map-player-hud{width:180px;grid-template-columns:40px auto 1fr;min-height:52px}
  #screen-map .map-player-hud .player-avatar{width:38px;height:38px}
  #screen-map .map-player-copy small{display:none}
  #screen-map .map-hud-currencies{gap:5px}
  #screen-map .map-hud-pill{min-width:48px;height:38px;padding:0 7px;border-width:2px}
  #screen-map .map-hud-pill>span{font-size:.95rem}
  #screen-map .map-hud-pill>strong{font-size:.78rem}
  #screen-map .map-hud-tools{gap:5px!important}
  #screen-map .map-hud-tools .map-tool-square:nth-child(-n+2){display:grid!important}
  #screen-map .map4208-world-banner{top:116px!important}
}
