/* Sweet Shift Saga v4.2.0.8 — Candy HUD redesign
   Goals + Score on the left, Moves + Boosters on the right.
   Uses Sweet Shift's own blocker/candy artwork and gameplay systems. */

#screen-game.active .classic-candy-hud-layout {
  align-items:center !important;
}

/* Strip the generic glass-console card from the two gameplay side columns. */
#screen-game.active .classic-goals-column,
#screen-game.active .classic-action-column {
  contain:layout style !important;
  overflow:visible !important;
  padding:0 !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  gap:14px !important;
}
#screen-game.active .classic-goals-column::before,
#screen-game.active .classic-goals-column::after,
#screen-game.active .classic-action-column::before,
#screen-game.active .classic-action-column::after { display:none !important; }

/* ================================================================
   LEFT — GOALS
   ================================================================ */
#screen-game.active .classic-goals-card {
  position:relative !important;
  display:grid !important;
  width:100% !important;
  padding-top:17px !important;
}
#screen-game.active .future-goal-heading {
  position:relative !important;
  z-index:4 !important;
  width:72% !important;
  min-height:39px !important;
  display:grid !important;
  place-items:center !important;
  justify-self:center !important;
  margin:0 0 -18px !important;
  padding:7px 15px !important;
  border:3px solid #e7c8f1 !important;
  border-radius:18px !important;
  background:linear-gradient(180deg,#7650ca 0%,#5b32aa 100%) !important;
  box-shadow:0 5px 0 #45247f,0 8px 13px rgba(67,35,117,.22),inset 0 2px 0 rgba(255,255,255,.28) !important;
}
#screen-game.active .future-goal-heading span {
  color:#fff !important;
  font-size:.98rem !important;
  font-weight:1000 !important;
  line-height:1 !important;
  letter-spacing:.05em !important;
  text-shadow:0 2px 2px rgba(55,26,96,.45) !important;
}

#screen-game.active .future-goals {
  position:relative !important;
  z-index:2 !important;
  width:100% !important;
  min-height:174px !important;
  display:grid !important;
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  align-content:center !important;
  justify-content:center !important;
  gap:3px 8px !important;
  padding:33px 12px 14px !important;
  overflow:visible !important;
  border:3px solid #8d4aaa !important;
  border-radius:24px !important;
  background:linear-gradient(180deg,#ffe9ca 0%,#ffd8ad 100%) !important;
  box-shadow:0 7px 0 #6e347f,0 13px 24px rgba(85,47,90,.19),inset 0 2px 0 rgba(255,255,255,.7) !important;
}
#screen-game.active .future-goals::after {
  content:"" !important;
  position:absolute !important;
  inset:8px !important;
  z-index:-1 !important;
  border-radius:17px !important;
  border:1px solid rgba(255,255,255,.52) !important;
  pointer-events:none !important;
}

#screen-game.active .future-goals .goal-row,
#screen-game.active .future-goals .goal-row:only-child {
  --goal-progress:0%;
  position:relative !important;
  min-width:0 !important;
  min-height:79px !important;
  display:grid !important;
  grid-template-columns:1fr !important;
  grid-template-rows:55px 24px !important;
  justify-items:center !important;
  align-items:center !important;
  gap:0 !important;
  padding:2px 3px !important;
  overflow:visible !important;
  border:0 !important;
  border-radius:15px !important;
  background:transparent !important;
  box-shadow:none !important;
}
#screen-game.active .future-goals .goal-row::before { display:none !important; }
#screen-game.active .future-goals .goal-row.close,
#screen-game.active .future-goals .goal-row.done {
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}
#screen-game.active .future-goals .goal-row.close::before,
#screen-game.active .future-goals .goal-row.done::before { display:none !important; }
#screen-game.active .future-goals .goal-row:nth-child(odd):last-child {
  grid-column:1 / -1 !important;
  width:50% !important;
  justify-self:center !important;
}
#screen-game.active .future-goals .goal-row:only-child {
  grid-column:1 / -1 !important;
  width:62% !important;
  justify-self:center !important;
}

#screen-game.active .future-goals .goal-icon,
#screen-game.active .future-goals .goal-row:only-child .goal-icon {
  grid-column:1 !important;
  grid-row:1 !important;
  width:55px !important;
  height:55px !important;
  min-width:55px !important;
  display:grid !important;
  place-items:center !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  color:#8a3a75 !important;
  box-shadow:none !important;
  font-size:2.2rem !important;
  line-height:1 !important;
  filter:drop-shadow(0 3px 2px rgba(91,47,60,.2)) !important;
}
#screen-game.active .future-goals .goal-icon .mini-blocker {
  width:54px !important;
  height:54px !important;
  vertical-align:0 !important;
  filter:drop-shadow(0 3px 2px rgba(78,39,43,.18)) !important;
}
#screen-game.active .future-goals .goal-icon .mini-candy {
  width:52px !important;
  height:52px !important;
  transform:none !important;
  filter:drop-shadow(0 3px 2px rgba(78,39,43,.16)) !important;
}
#screen-game.active .future-goals .goal-icon .hud-goal-jelly,
#screen-game.active .future-goals .goal-icon .hud-goal-jam,
#screen-game.active .future-goals .goal-icon .hud-goal-light,
#screen-game.active .future-goals .goal-icon .hud-goal-ingredient,
#screen-game.active .future-goals .goal-icon .hud-goal-special {
  width:51px !important;
  height:51px !important;
  display:block !important;
  background-position:center !important;
  background-repeat:no-repeat !important;
  background-size:contain !important;
}
#screen-game.active .future-goals .goal-icon .hud-goal-jelly {
  border-radius:13px !important;
  border:3px solid rgba(136,224,255,.82) !important;
  background:radial-gradient(circle at 38% 28%,rgba(255,255,255,.95) 0 7%,transparent 8%),linear-gradient(145deg,rgba(213,249,255,.94),rgba(85,177,224,.76)) !important;
  box-shadow:inset 0 0 0 3px rgba(255,255,255,.34),0 3px 4px rgba(55,120,156,.2) !important;
}
#screen-game.active .future-goals .goal-icon .hud-goal-jelly::after {
  content:"✦" !important;
  width:100% !important;height:100% !important;display:grid !important;place-items:center !important;
  color:rgba(255,255,255,.85) !important;font-size:1.2rem !important;
}
#screen-game.active .future-goals .goal-icon .hud-goal-jam {
  border-radius:50% 45% 52% 44% !important;
  background:radial-gradient(circle at 35% 30%,#ffd8f3 0 11%,transparent 12%),linear-gradient(145deg,#f553b9,#ad2b96) !important;
  box-shadow:inset 0 0 0 4px rgba(255,255,255,.2),0 3px 4px rgba(107,34,90,.18) !important;
}
#screen-game.active .future-goals .goal-icon .hud-goal-light {
  background:radial-gradient(circle,#fff9ad 0 17%,#ffd640 18% 37%,transparent 39%) !important;
  filter:drop-shadow(0 0 7px rgba(255,218,60,.65)) !important;
}
#screen-game.active .future-goals .goal-icon .hud-goal-light::after {
  content:"★" !important;display:grid !important;place-items:center !important;width:100% !important;height:100% !important;color:#fff8b5 !important;font-size:2rem !important;
}
#screen-game.active .future-goals .goal-icon .hud-goal-ingredient {
  border-radius:50% 50% 45% 45% !important;
  background:radial-gradient(circle at 38% 30%,#fff9df 0 12%,transparent 13%),linear-gradient(145deg,#ffcf5c,#e88227) !important;
  box-shadow:inset 0 0 0 3px rgba(255,255,255,.26) !important;
}
#screen-game.active .future-goals .goal-icon .hud-goal-ingredient::after {
  content:"▼" !important;display:grid !important;place-items:center !important;width:100% !important;height:100% !important;color:#7b3d3c !important;font-size:1.55rem !important;
}
#screen-game.active .future-goals .goal-icon .hud-goal-special-stripe { background-image:url("../assets/candies/sweetshift/special/Striped_blue_h.png") !important; }
#screen-game.active .future-goals .goal-icon .hud-goal-special-wrapped { background-image:url("../assets/candies/sweetshift/special/Wrapped_red.png") !important; }
#screen-game.active .future-goals .goal-icon .hud-goal-special-bomb { background-image:url("../assets/candies/sweetshift/special/Colour_Bomb.png") !important; }
#screen-game.active .future-goals .goal-icon .hud-goal-special-fish { background-image:url("../assets/candies/sweetshift/special/Sweet_Fish.png") !important; }

#screen-game.active .future-goals .goal-copy {
  grid-column:1 !important;
  grid-row:2 !important;
  width:100% !important;
  min-width:0 !important;
  display:grid !important;
  place-items:center !important;
  overflow:visible !important;
}
#screen-game.active .future-goals .goal-label {
  position:absolute !important;
  width:1px !important;height:1px !important;
  margin:-1px !important;padding:0 !important;
  overflow:hidden !important;clip:rect(0 0 0 0) !important;white-space:nowrap !important;border:0 !important;
}
#screen-game.active .future-goals .goal-value,
#screen-game.active .future-goals .goal-row strong.goal-value,
#screen-game.active .future-goals .goal-row:only-child .goal-value {
  width:auto !important;
  min-width:0 !important;
  overflow:visible !important;
  color:#573240 !important;
  font-size:1.16rem !important;
  font-weight:1000 !important;
  line-height:1 !important;
  text-align:center !important;
  white-space:nowrap !important;
  text-overflow:clip !important;
  font-variant-numeric:tabular-nums !important;
  text-shadow:0 2px 0 rgba(255,255,255,.78) !important;
}
#screen-game.active .future-goals .goal-row.close .goal-value { color:#ba5c22 !important; }
#screen-game.active .future-goals .goal-row.done .goal-value { color:#268b5c !important; }
#screen-game.active .future-goals .goal-row.done .goal-icon { opacity:.68 !important; }

/* ================================================================
   LEFT — SCORE
   ================================================================ */
#screen-game.active .classic-score-card {
  position:relative !important;
  display:grid !important;
  width:94% !important;
  justify-self:center !important;
  margin-top:4px !important;
  padding-top:16px !important;
}
#screen-game.active .classic-score-heading {
  position:relative !important;
  z-index:4 !important;
  width:68% !important;
  min-height:34px !important;
  display:grid !important;
  place-items:center !important;
  justify-self:center !important;
  margin:0 0 -15px !important;
  padding:6px 12px !important;
  border:3px solid #d6b7ec !important;
  border-radius:17px !important;
  background:linear-gradient(180deg,#6d43bd,#4b278e) !important;
  color:#fff !important;
  font-size:.92rem !important;
  font-weight:1000 !important;
  letter-spacing:.04em !important;
  text-shadow:0 2px 2px rgba(44,24,80,.45) !important;
  box-shadow:0 5px 0 #3d1e74,0 7px 11px rgba(62,31,94,.18) !important;
}
#screen-game.active .classic-score-card .future-score-stack {
  grid-column:1 !important;
  grid-row:auto !important;
  width:100% !important;
  min-height:78px !important;
  display:grid !important;
  grid-template-columns:1fr !important;
  align-content:center !important;
  gap:1px !important;
  padding:24px 11px 8px !important;
  border:3px solid #704194 !important;
  border-radius:22px 22px 15px 15px !important;
  background:linear-gradient(180deg,#7b3d83,#542a63) !important;
  box-shadow:0 6px 0 #4b2858,0 10px 17px rgba(64,31,71,.18),inset 0 2px 0 rgba(255,255,255,.18) !important;
}
#screen-game.active .classic-score-card .future-score-stack > div {
  min-height:0 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:7px !important;
  padding:0 !important;
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}
#screen-game.active .classic-score-card .future-score-stack > div:first-child span { display:none !important; }
#screen-game.active .classic-score-card #score-value {
  color:#fff !important;
  font-size:1.62rem !important;
  font-weight:1000 !important;
  line-height:1 !important;
  text-shadow:0 3px 2px rgba(43,20,47,.48) !important;
}
#screen-game.active .classic-score-card .future-score-stack > div:nth-child(2) {
  opacity:.72 !important;
  margin-top:4px !important;
}
#screen-game.active .classic-score-card .future-score-stack > div:nth-child(2) span,
#screen-game.active .classic-score-card .future-score-stack > div:nth-child(2) strong {
  color:#f8deef !important;
  font-size:.55rem !important;
  font-weight:900 !important;
}
#screen-game.active .classic-score-card .future-star-meter {
  grid-column:1 !important;
  grid-row:auto !important;
  position:relative !important;
  z-index:5 !important;
  width:92% !important;
  height:37px !important;
  min-height:37px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:space-around !important;
  justify-self:center !important;
  margin:-3px 0 0 !important;
  padding:3px 9px 4px !important;
  border:3px solid #774493 !important;
  border-radius:13px 13px 19px 19px !important;
  background:linear-gradient(180deg,#ffe1ae,#f7c889) !important;
  box-shadow:0 5px 0 #5b316c,0 7px 10px rgba(67,33,77,.17),inset 0 2px rgba(255,255,255,.45) !important;
  overflow:visible !important;
}
#screen-game.active .classic-score-card .future-star-meter .star-meter {
  position:absolute !important;
  z-index:0 !important;
  left:8px !important;
  right:8px !important;
  bottom:4px !important;
  top:auto !important;
  width:calc(100% - 16px) !important;
  height:6px !important;
  border-radius:999px !important;
  background:linear-gradient(90deg,#64df25,#d8ef35) !important;
  opacity:.8 !important;
}
#screen-game.active .classic-score-card .future-star-meter span[data-star] {
  position:relative !important;
  z-index:2 !important;
  left:auto !important;
  top:auto !important;
  bottom:auto !important;
  transform:none !important;
  color:#8a4c43 !important;
  font-size:1.6rem !important;
  line-height:1 !important;
  text-shadow:0 2px 0 #fff2d3 !important;
}
#screen-game.active .classic-score-card .future-star-meter span[data-star].lit { color:#ffc928 !important; filter:drop-shadow(0 2px 1px #b8761f) !important; }

/* ================================================================
   RIGHT — MOVES
   ================================================================ */
#screen-game.active .future-moves-panel {
  position:relative !important;
  width:118px !important;
  height:auto !important;
  min-height:160px !important;
  display:grid !important;
  grid-template-rows:40px 98px 42px !important;
  place-items:center !important;
  justify-self:center !important;
  padding:0 !important;
  border:0 !important;
  border-radius:23px !important;
  background:linear-gradient(180deg,#ec5db6 0%,#cc3ca0 74%,transparent 74%) !important;
  box-shadow:none !important;
  overflow:visible !important;
}
#screen-game.active .future-moves-panel > small {
  position:relative !important;
  z-index:4 !important;
  width:104% !important;
  min-height:39px !important;
  display:grid !important;
  place-items:center !important;
  align-self:start !important;
  margin-top:-8px !important;
  border:3px solid #cab4ef !important;
  border-radius:18px !important;
  background:linear-gradient(180deg,#7047c0,#503092) !important;
  color:#fff !important;
  font-size:.84rem !important;
  font-weight:1000 !important;
  letter-spacing:.05em !important;
  text-shadow:0 2px 2px rgba(47,28,81,.48) !important;
  box-shadow:0 5px 0 #442878,0 7px 11px rgba(49,29,80,.18),inset 0 2px rgba(255,255,255,.25) !important;
}
#screen-game.active #moves-left {
  grid-row:2 !important;
  width:100% !important;
  min-height:98px !important;
  display:grid !important;
  place-items:center !important;
  margin:0 !important;
  padding:6px 4px 9px !important;
  border:3px solid #9d3e9e !important;
  border-top:0 !important;
  border-radius:0 0 22px 22px !important;
  background:linear-gradient(180deg,#ea5ab5,#c9319a) !important;
  color:#fff !important;
  font-size:3.95rem !important;
  font-weight:1000 !important;
  line-height:1 !important;
  text-shadow:0 4px 2px rgba(101,38,91,.43) !important;
  box-shadow:0 7px 0 #81357f,0 10px 14px rgba(88,39,83,.16),inset 0 2px rgba(255,255,255,.18) !important;
}
#screen-game.active .moves-star-shelf {
  grid-row:3 !important;
  position:relative !important;
  z-index:5 !important;
  width:112% !important;
  height:44px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:space-around !important;
  margin-top:-4px !important;
  padding:2px 10px 5px !important;
  border:3px solid #c68465 !important;
  border-radius:18px !important;
  background:linear-gradient(180deg,#ffe4ba,#f2bd82) !important;
  box-shadow:0 5px 0 #9a6251,0 7px 11px rgba(82,49,54,.15),inset 0 2px rgba(255,255,255,.5) !important;
}
#screen-game.active .moves-star-shelf span {
  color:#80443e !important;
  font-size:1.55rem !important;
  line-height:1 !important;
  text-shadow:0 2px #fff0d4 !important;
}
#screen-game.active .moves-star-shelf span.lit { color:#ffc828 !important; filter:drop-shadow(0 2px 1px #b76f1e) !important; }
#screen-game.active .future-moves-panel.low #moves-left { color:#fff8a6 !important; }
#screen-game.active .future-moves-panel.critical #moves-left { color:#fff !important; }

/* ================================================================
   RIGHT — BOOSTER RAIL
   ================================================================ */
#screen-game.active .future-booster-tray.booster-rail {
  position:relative !important;
  width:102px !important;
  min-height:236px !important;
  display:grid !important;
  grid-template-columns:1fr !important;
  grid-auto-rows:72px !important;
  align-content:center !important;
  justify-items:center !important;
  gap:4px !important;
  justify-self:center !important;
  margin:-5px 0 0 !important;
  padding:10px 8px !important;
  border:3px solid #bf795f !important;
  border-radius:19px !important;
  background:linear-gradient(180deg,#ffe0b4,#f4c18b) !important;
  box-shadow:0 7px 0 #945b4a,0 11px 19px rgba(79,47,48,.16),inset 0 2px rgba(255,255,255,.5) !important;
  overflow:visible !important;
}
#screen-game.active .future-booster-tray.booster-rail .ss-booster-control {
  position:relative !important;
  width:66px !important;
  height:66px !important;
  min-width:66px !important;
  min-height:66px !important;
  display:grid !important;
  place-items:center !important;
  padding:0 !important;
  border:3px solid #3b9eca !important;
  border-radius:50% !important;
  background:radial-gradient(circle at 40% 30%,#8ff5ff 0 10%,#37c5ed 38%,#1d90cd 100%) !important;
  color:#fff !important;
  box-shadow:0 4px 0 #166ea1,0 6px 10px rgba(27,96,130,.2),inset 0 2px 0 rgba(255,255,255,.45) !important;
  overflow:visible !important;
}
#screen-game.active .future-booster-tray.booster-rail .ss-booster-control:hover:not(:disabled) {
  transform:translateY(-2px) scale(1.025) !important;
  filter:brightness(1.05) !important;
}
#screen-game.active .future-booster-tray.booster-rail .ss-booster-control:active:not(:disabled) { transform:translateY(1px) !important; }
#screen-game.active .future-booster-tray.booster-rail .ss-booster-control.active {
  outline:4px solid #ffe34f !important;
  outline-offset:2px !important;
}
#screen-game.active .future-booster-tray.booster-rail .ss-booster-control:disabled { opacity:.52 !important; filter:grayscale(.28) !important; }
#screen-game.active .future-booster-tray.booster-rail .booster-art,
#screen-game.active .future-booster-tray.booster-rail .ss-booster-control > span {
  width:54px !important;
  height:54px !important;
  display:grid !important;
  place-items:center !important;
  border:0 !important;
  border-radius:50% !important;
  background:transparent !important;
  color:#fff !important;
  font-size:2.05rem !important;
  line-height:1 !important;
  filter:drop-shadow(0 3px 1px rgba(42,71,105,.28)) !important;
}
#screen-game.active .future-booster-tray.booster-rail .ss-booster-control small {
  position:absolute !important;
  width:1px !important;height:1px !important;
  margin:-1px !important;padding:0 !important;
  overflow:hidden !important;clip:rect(0 0 0 0) !important;white-space:nowrap !important;border:0 !important;
}
#screen-game.active .future-booster-tray.booster-rail .booster-count {
  position:absolute !important;
  z-index:6 !important;
  right:-13px !important;
  bottom:-1px !important;
  min-width:31px !important;
  height:31px !important;
  display:grid !important;
  place-items:center !important;
  padding:0 5px !important;
  border:3px solid #ecffd8 !important;
  border-radius:999px !important;
  background:linear-gradient(180deg,#7ee23e,#39ae24) !important;
  color:#fff !important;
  font-size:.68rem !important;
  font-weight:1000 !important;
  line-height:1 !important;
  text-shadow:0 2px 1px rgba(29,91,25,.4) !important;
  box-shadow:0 3px 0 #2b7e1d,0 4px 7px rgba(42,95,31,.2) !important;
}

/* Small control dock under the booster rail. */
#screen-game.active .classic-action-column .future-action-stack {
  width:112px !important;
  display:grid !important;
  grid-template-columns:repeat(3,1fr) !important;
  gap:5px !important;
  justify-self:center !important;
}
#screen-game.active .classic-action-column .ss-game-control {
  width:34px !important;
  height:34px !important;
  min-width:34px !important;
  min-height:34px !important;
  padding:0 !important;
  border:3px solid #e5f4ff !important;
  border-radius:50% !important;
  background:linear-gradient(180deg,#4dbce8,#267db7) !important;
  color:#fff !important;
  box-shadow:0 4px 0 #1c5f91,0 6px 9px rgba(30,78,115,.16) !important;
}
#screen-game.active .classic-action-column .ss-game-control::before { color:#fff !important;font-size:.9rem !important;margin:0 !important; }
#screen-game.active .classic-action-column .ss-game-control span {
  position:absolute !important;
  width:1px !important;height:1px !important;
  margin:-1px !important;padding:0 !important;
  overflow:hidden !important;clip:rect(0 0 0 0) !important;white-space:nowrap !important;border:0 !important;
}

/* Sweet Mission remains secondary and sits under the Score panel. */
#screen-game.active .classic-goals-column .future-mission-card {
  width:94% !important;
  justify-self:center !important;
  border:2px solid #cba8d4 !important;
  border-radius:17px !important;
  background:linear-gradient(180deg,#fff9ff,#f7eafa) !important;
  box-shadow:0 4px 0 rgba(91,48,102,.1) !important;
}

/* Desktop side-column sizing. The total side budget stays close to the old HUD. */
@media (min-width:1101px) {
  #screen-game.active .futuristic-game-layout.classic-candy-hud-layout {
    grid-template-columns:226px minmax(0,auto) 142px !important;
    column-gap:13px !important;
  }
  #screen-game.active .classic-goals-column { width:226px !important;min-width:226px !important; }
  #screen-game.active .classic-action-column { width:142px !important;min-width:142px !important; }
  #screen-game.active .saga-board-wrap {
    --game-tile:min(calc((100vw - 410px) / 9),calc(((var(--ss-vh) * 100) - 165px) / 9),88px) !important;
  }
}

/* Tablet/mobile keeps all three sections usable while retaining the new visual language. */
@media (max-width:1100px) {
  #screen-game.active .futuristic-game-layout.classic-candy-hud-layout {
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    gap:9px !important;
  }
  #screen-game.active .classic-action-column {
    order:1 !important;
    width:min(610px,98vw) !important;
    min-width:0 !important;
    display:grid !important;
    grid-template-columns:118px minmax(0,1fr) !important;
    grid-template-rows:auto auto !important;
    align-items:center !important;
    gap:8px !important;
  }
  #screen-game.active .classic-action-column .future-moves-panel {
    grid-column:1 !important;
    grid-row:1 / 3 !important;
    width:110px !important;
    min-height:148px !important;
    grid-template-rows:37px 86px 39px !important;
  }
  #screen-game.active .classic-action-column #moves-left { min-height:86px !important;font-size:3.25rem !important; }
  #screen-game.active .classic-action-column .future-booster-tray.booster-rail {
    grid-column:2 !important;
    grid-row:1 !important;
    width:100% !important;
    min-height:84px !important;
    display:grid !important;
    grid-template-columns:repeat(3,72px) !important;
    grid-auto-rows:72px !important;
    justify-content:center !important;
    align-content:center !important;
    gap:12px !important;
    margin:0 !important;
    padding:6px 16px !important;
  }
  #screen-game.active .classic-action-column .future-action-stack {
    grid-column:2 !important;
    grid-row:2 !important;
    width:auto !important;
    justify-content:center !important;
    grid-template-columns:repeat(3,38px) !important;
  }
  #screen-game.active .saga-board-wrap { order:2 !important; }
  #screen-game.active .classic-goals-column {
    order:3 !important;
    width:min(610px,98vw) !important;
    min-width:0 !important;
    display:grid !important;
    grid-template-columns:minmax(0,1.15fr) minmax(170px,.85fr) !important;
    align-items:start !important;
    gap:12px !important;
  }
  #screen-game.active .classic-goals-card { grid-column:1 !important; }
  #screen-game.active .classic-score-card { grid-column:2 !important;width:100% !important;margin-top:0 !important; }
  #screen-game.active .classic-goals-column .future-mission-card { grid-column:1 / -1 !important;width:100% !important; }
}

@media (max-width:620px) {
  #screen-game.active .classic-action-column {
    grid-template-columns:103px minmax(0,1fr) !important;
  }
  #screen-game.active .classic-action-column .future-moves-panel { width:98px !important;min-height:136px !important;grid-template-rows:34px 78px 37px !important; }
  #screen-game.active .classic-action-column #moves-left { min-height:78px !important;font-size:2.8rem !important; }
  #screen-game.active .classic-action-column .future-booster-tray.booster-rail {
    grid-template-columns:repeat(3,62px) !important;
    gap:7px !important;
    padding:5px 8px !important;
  }
  #screen-game.active .future-booster-tray.booster-rail .ss-booster-control { width:58px !important;height:58px !important;min-width:58px !important;min-height:58px !important; }
  #screen-game.active .future-booster-tray.booster-rail .booster-art,
  #screen-game.active .future-booster-tray.booster-rail .ss-booster-control > span { width:47px !important;height:47px !important;font-size:1.75rem !important; }
  #screen-game.active .classic-goals-column { grid-template-columns:1fr !important; }
  #screen-game.active .classic-goals-card,
  #screen-game.active .classic-score-card { grid-column:1 !important;width:min(350px,96vw) !important;justify-self:center !important; }
  #screen-game.active .future-goals { min-height:150px !important; }
}

@media (max-width:420px) {
  #screen-game.active .classic-action-column { grid-template-columns:94px minmax(0,1fr) !important; }
  #screen-game.active .classic-action-column .future-moves-panel { width:90px !important; }
  #screen-game.active .classic-action-column .future-booster-tray.booster-rail { grid-template-columns:repeat(3,55px) !important;gap:4px !important; }
  #screen-game.active .future-booster-tray.booster-rail .ss-booster-control { width:52px !important;height:52px !important;min-width:52px !important;min-height:52px !important; }
  #screen-game.active .future-booster-tray.booster-rail .booster-art,
  #screen-game.active .future-booster-tray.booster-rail .ss-booster-control > span { width:43px !important;height:43px !important;font-size:1.55rem !important; }
}

@media (prefers-reduced-motion: reduce) {
  #screen-game.active .future-booster-tray.booster-rail .ss-booster-control,
  #screen-game.active .future-moves-panel { animation:none !important;transition:none !important; }
}
