/* Sweet Shift Saga v4.4.0.1 — Refinement Layer */

/* ---------- Daily Candy: readable tier-by-tier progress ---------- */
#screen-map .daily-candy-track {
  width: 330px !important;
  min-height: 78px !important;
  padding: 9px 11px 10px !important;
  gap: 6px 9px !important;
  border-radius: 16px !important;
  border: 2px solid rgba(255,255,255,.9) !important;
  background:
    radial-gradient(circle at 6% 0%, color-mix(in srgb,var(--daily-color,#ef3a5b) 16%,transparent), transparent 34%),
    linear-gradient(180deg,rgba(255,255,255,.97),rgba(255,244,251,.93)) !important;
  box-shadow: 0 8px 20px rgba(89,38,77,.14), inset 0 1px 0 #fff !important;
}
#screen-map .daily-track-copy strong { font-size:.7rem !important; letter-spacing:.015em; }
#screen-map .daily-track-copy small { font-size:.5rem !important; }
#screen-map .daily-track-reward {
  min-width:0;
  max-width:145px;
  gap:6px !important;
}
#screen-map .daily-track-reward > span {
  width:11px !important;
  height:11px !important;
  flex:0 0 auto;
}
#screen-map .daily-track-reward img {
  width:24px;
  height:24px;
  object-fit:contain;
  flex:0 0 auto;
  filter:drop-shadow(0 2px 3px rgba(70,28,65,.16));
}
#screen-map .daily-track-reward b {
  overflow:hidden;
  text-overflow:ellipsis;
  font-size:.54rem !important;
}
#screen-map .daily-track-meter {
  height:15px !important;
  border:1px solid rgba(121,71,103,.12);
  background:#eadce7 !important;
}
#screen-map .daily-track-meter i {
  box-shadow: inset 0 1px 0 rgba(255,255,255,.62), 0 0 10px color-mix(in srgb,var(--daily-color,#ef3a5b) 28%,transparent);
}
#screen-map .daily-track-meter span { font-size:.5rem !important; }
.daily-track-milestones {
  grid-column:1/-1;
  display:grid;
  grid-template-columns:repeat(8,1fr);
  align-items:center;
  gap:4px;
  min-height:18px;
  position:relative;
}
.daily-track-milestones::before {
  content:"";
  position:absolute;
  left:4%;right:4%;top:50%;height:2px;
  transform:translateY(-50%);
  background:#e5d3df;
  border-radius:999px;
}
.daily-milestone {
  position:relative;
  z-index:1;
  display:grid;
  place-items:center;
}
.daily-milestone i {
  width:16px;height:16px;
  display:grid;place-items:center;
  border-radius:50%;
  border:2px solid #fff;
  background:#d9c7d4;
  color:#fff;
  font-style:normal;
  font-size:.42rem;
  font-weight:1000;
  box-shadow:0 2px 5px rgba(86,46,76,.13);
}
.daily-milestone.claimed i {
  background:var(--daily-color,#ef3a5b);
}
.daily-milestone.current i {
  background:#fff;
  color:var(--daily-color,#ef3a5b);
  border-color:var(--daily-color,#ef3a5b);
  box-shadow:0 0 0 3px color-mix(in srgb,var(--daily-color,#ef3a5b) 18%,transparent),0 2px 5px rgba(86,46,76,.13);
}
.daily-candy-track[data-complete="true"] .daily-track-meter i { background:linear-gradient(90deg,#45c67d,#8debb1) !important; }

/* ---------- Inventory: less empty space, clearer ownership ---------- */
.inventory-card {
  width:min(820px,94vw) !important;
  padding:22px 24px 26px !important;
  border-radius:26px !important;
}
.inventory-summary {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:8px;
  margin:14px 0 2px;
}
.inventory-summary span {
  display:grid;
  gap:2px;
  padding:10px 12px;
  border:1px solid #eadce6;
  border-radius:14px;
  background:linear-gradient(180deg,#fff,#faf3f8);
}
.inventory-summary small {
  color:#a0738f;
  font-size:.55rem;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.06em;
}
.inventory-summary strong {
  color:#713d5e;
  font-size:1rem;
}
.inventory-chest-grid {
  grid-template-columns:repeat(auto-fit,minmax(172px,1fr)) !important;
}
.inventory-chest-item {
  min-height:220px;
  padding:14px 12px !important;
  border-radius:20px !important;
  align-content:start;
  transition:transform .15s ease,box-shadow .15s ease,border-color .15s ease;
}
.inventory-chest-item:hover {
  transform:translateY(-2px);
  border-color:#dcb9cf;
  box-shadow:0 10px 20px rgba(96,43,79,.09);
}
.inventory-chest-art {
  width:120px;height:92px;
  display:grid;place-items:center;
}
.inventory-chest-art img {
  width:118px !important;
  height:90px !important;
}
.inventory-chest-item > strong { font-size:.82rem; }
.inventory-chest-item > small { min-height:29px; }
.inventory-chest-item > em {
  color:#b087a0;
  font-size:.55rem;
  font-style:normal;
  font-weight:800;
}
.inventory-chest-item button { margin-top:auto; }
.inventory-empty {
  display:grid;
  gap:5px;
}
.inventory-empty strong { color:#7a4a68; }
.inventory-empty span { font-size:.66rem; font-weight:800; color:#a17491; }
.inventory-booster-grid { gap:10px !important; }
.inventory-booster-item {
  display:grid !important;
  grid-template-columns:44px minmax(0,1fr) auto;
  min-height:54px;
  gap:9px !important;
  padding:9px 10px !important;
  background:linear-gradient(180deg,#fff,#faf3f8) !important;
}
.inventory-booster-art {
  width:44px;height:44px;
  display:grid;place-items:center;
  border-radius:13px;
  background:#f4e9f1;
}
.inventory-booster-art img {
  width:38px !important;
  height:38px !important;
  object-fit:contain;
}
.inventory-booster-item div { min-width:0; }
.inventory-booster-item small { color:#a27a93;font-size:.5rem;font-weight:850; }
.inventory-booster-item > b { align-self:center;font-size:.82rem !important; }
#screen-map .map-inventory-count[hidden] { display:none !important; }

/* ---------- Chest reveal: cinematic but readable ---------- */
body.chest-opening-active { overflow:hidden !important; }
.chest-open-overlay {
  background:rgba(9,2,14,.88) !important;
  transition:opacity .18s ease;
}
.chest-open-overlay.closing { opacity:0; }
.chest-open-stage {
  width:min(820px,96vw) !important;
  min-height:min(720px,96vh) !important;
  gap:5px !important;
  padding:18px 12px;
  box-sizing:border-box;
}
.chest-open-kicker {
  font-size:.78rem !important;
  letter-spacing:.22em !important;
}
.chest-open-source {
  min-height:18px;
  color:#dcb5d1;
  font-size:.64rem;
  font-weight:850;
  text-align:center;
  text-shadow:0 2px 8px #000;
}
.chest-open-visual {
  width:min(340px,68vw) !important;
  height:min(280px,54vw) !important;
  margin-bottom:-8px;
}
.chest-reward-burst {
  width:min(720px,94vw) !important;
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:10px !important;
  min-height:190px !important;
  align-content:center;
}
.chest-live-reward {
  min-height:125px;
  padding:10px 8px;
  border-radius:18px;
  background:rgba(255,255,255,.035);
  border:1px solid rgba(255,255,255,.09);
  box-sizing:border-box;
}
.chest-live-art {
  width:66px;height:66px;
  display:grid;place-items:center;
}
.chest-live-reward img {
  width:62px !important;
  height:62px !important;
}
.chest-live-reward strong { font-size:.76rem !important; line-height:1.12; }
.chest-live-reward small { font-size:.56rem !important; letter-spacing:.05em; text-transform:uppercase; }
.chest-live-reward.sugar {
  background:radial-gradient(circle at 50% 20%,rgba(255,216,91,.12),rgba(255,255,255,.025));
}
.chest-open-overlay.finished #chest-open-done {
  animation:chestDoneAppear .22s ease-out both;
}
@keyframes chestDoneAppear { from{opacity:0;transform:translateY(6px)} to{opacity:1;transform:none} }

/* ---------- Loading: stronger hierarchy, same five-second duration ---------- */
body.loading-active { overflow:hidden !important; }
.loading-transition {
  --loading-hue:326;
  --loading-hue2:205;
  opacity:1;
  background:
    radial-gradient(circle at 22% 35%,hsl(var(--loading-hue) 88% 80% / .44),transparent 26%),
    radial-gradient(circle at 82% 72%,hsl(var(--loading-hue2) 86% 73% / .30),transparent 30%),
    linear-gradient(135deg,hsl(var(--loading-hue) 68% 66%),hsl(var(--loading-hue2) 62% 54%)) !important;
  transition:opacity .2s ease;
}
.loading-transition.finishing { opacity:.18; }
.loading-character-wrap {
  position:relative;
  min-height:340px;
}
.loading-character-wrap::before {
  content:"";
  position:absolute;
  width:260px;height:260px;
  border-radius:50%;
  background:radial-gradient(circle,rgba(255,255,255,.34),rgba(255,255,255,.08) 56%,transparent 70%);
  filter:blur(1px);
}
.loading-character-wrap img { position:relative; z-index:1; }
.loading-copy { gap:7px !important; }
.loading-copy > small { opacity:.9; }
.loading-level-meta {
  display:inline-flex;
  width:max-content;
  max-width:100%;
  padding:5px 9px;
  border:1px solid rgba(255,255,255,.32);
  border-radius:999px;
  background:rgba(46,22,75,.18);
  color:#fff8fd;
  font-size:.72rem;
  font-weight:900;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.loading-tip-card {
  margin-top:8px;
  padding:12px 14px;
  border:1px solid rgba(255,255,255,.25);
  border-radius:18px;
  background:rgba(42,22,70,.16);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.12);
}
.loading-tip-card b {
  display:block;
  margin-bottom:4px;
  color:#ffe3f5;
  font-size:.66rem;
  text-transform:uppercase;
  letter-spacing:.08em;
}
.loading-tip-card p { margin:0 !important; }
.loading-progress {
  height:13px !important;
  border:1px solid rgba(255,255,255,.26);
}
.loading-transition.running .loading-progress i { animation-duration:5s !important; }

/* ---------- Consistent interaction polish ---------- */
.inventory-chest-item button:focus-visible,
#chest-open-done:focus-visible,
.map-tool-inventory:focus-visible {
  outline:3px solid rgba(255,221,92,.95) !important;
  outline-offset:3px;
}

@media(max-width:900px){
  #screen-map .daily-candy-track { width:285px !important; }
  .inventory-summary { grid-template-columns:repeat(3,1fr); }
  .chest-reward-burst { grid-template-columns:repeat(3,minmax(0,1fr)) !important; }
  .loading-character-wrap { min-height:200px; }
}
@media(max-width:620px){
  #screen-map .daily-candy-track { width:242px !important; min-height:76px !important; }
  #screen-map .daily-track-reward { max-width:105px; }
  #screen-map .daily-track-reward img { width:20px;height:20px; }
  .inventory-summary { grid-template-columns:1fr; }
  .inventory-booster-grid { grid-template-columns:1fr !important; }
  .chest-reward-burst { grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
  .chest-live-reward { min-height:112px; }
  .loading-level-meta { width:auto; justify-self:center; }
}

@media(prefers-reduced-motion:reduce){
  .inventory-chest-item,
  .loading-character-wrap img,
  .chest-overlay-art,
  .chest-live-reward,
  .chest-open-bam,
  #chest-open-done { animation-duration:.001ms !important; transition-duration:.001ms !important; }
}

/* v4.4.0.9 — stacked inventory + chest finish button refinement */
.inventory-chest-grid {
  grid-template-columns:minmax(220px,320px) !important;
  justify-content:start;
}
.inventory-stack-item {
  min-height:250px !important;
  width:100%;
  padding:16px 14px 14px !important;
  display:grid !important;
  justify-items:center;
  align-content:start;
  gap:5px;
  overflow:visible;
}
.inventory-stack-art {
  position:relative;
  width:150px !important;
  height:112px !important;
  margin:2px auto 7px;
  overflow:visible;
}
.inventory-stack-art .stack-layer {
  position:absolute;
  left:50%;
  top:50%;
  width:118px !important;
  height:90px !important;
  object-fit:contain;
  filter:drop-shadow(0 7px 8px rgba(94,15,66,.15));
  transform-origin:center;
  transition:transform .16s ease;
}
.inventory-stack-art .stack-layer-1 {
  z-index:3;
  transform:translate(-50%,-50%);
}
.inventory-stack-art .stack-layer-2 {
  z-index:2;
  opacity:.76;
  transform:translate(calc(-50% + 12px),calc(-50% - 6px)) rotate(4deg) scale(.95);
}
.inventory-stack-art .stack-layer-3 {
  z-index:1;
  opacity:.48;
  transform:translate(calc(-50% + 23px),calc(-50% - 11px)) rotate(8deg) scale(.89);
}
.inventory-stack-item:hover .stack-layer-1 { transform:translate(-50%,calc(-50% - 2px)); }
.inventory-stack-item:hover .stack-layer-2 { transform:translate(calc(-50% + 15px),calc(-50% - 9px)) rotate(5deg) scale(.95); }
.inventory-stack-item:hover .stack-layer-3 { transform:translate(calc(-50% + 29px),calc(-50% - 15px)) rotate(9deg) scale(.89); }
.inventory-stack-count {
  position:absolute;
  right:4px;
  bottom:4px;
  z-index:5;
  min-width:40px;
  height:28px;
  padding:0 9px;
  display:grid;
  place-items:center;
  border:3px solid #fff;
  border-radius:999px;
  background:linear-gradient(180deg,#f04d9e,#b92f7b);
  color:#fff;
  font-size:.76rem;
  font-weight:1000;
  line-height:1;
  box-shadow:0 4px 0 #7e2358,0 7px 12px rgba(105,32,77,.2);
}
.inventory-stack-item > strong {
  color:#6e3159 !important;
  font-size:.9rem !important;
}
.inventory-stack-item > small {
  min-height:0 !important;
  color:#9a6f8a;
  text-align:center;
}
.inventory-stack-item > em {
  margin-bottom:7px;
  color:#b28aa2;
}
.inventory-open-stack-button {
  width:100%;
  min-height:52px;
  margin-top:auto;
  padding:8px 14px;
  display:grid;
  place-items:center;
  gap:1px;
  border:2px solid #fff;
  border-radius:15px;
  background:linear-gradient(180deg,#d957a3,#b53681);
  color:#fff;
  font:inherit;
  cursor:pointer;
  box-shadow:0 4px 0 #82255e,0 8px 15px rgba(113,39,84,.16),inset 0 2px 0 rgba(255,255,255,.32);
  transition:transform .13s ease,filter .13s ease,box-shadow .13s ease;
}
.inventory-open-stack-button > span {
  font-size:.72rem;
  font-weight:1000;
}
.inventory-open-stack-button > small {
  font-size:.49rem;
  font-weight:850;
  opacity:.82;
}
.inventory-open-stack-button:hover {
  transform:translateY(-2px);
  filter:brightness(1.04);
  box-shadow:0 6px 0 #82255e,0 11px 18px rgba(113,39,84,.19),inset 0 2px 0 rgba(255,255,255,.34);
}
.inventory-open-stack-button:active {
  transform:translateY(2px);
  box-shadow:0 2px 0 #82255e,0 5px 10px rgba(113,39,84,.14),inset 0 2px 0 rgba(255,255,255,.28);
}
.inventory-open-stack-button:focus-visible {
  outline:4px solid #ffe476;
  outline-offset:3px;
}

#chest-open-done.chest-finish-button {
  position:relative;
  min-width:250px;
  min-height:62px;
  margin:14px auto 4px;
  padding:8px 22px 9px 15px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  border:3px solid rgba(255,255,255,.92);
  border-radius:22px;
  background:linear-gradient(180deg,#ff67b7 0%,#cf3d91 58%,#b62f7d 100%);
  color:#fff;
  font:inherit;
  cursor:pointer;
  box-shadow:0 6px 0 #771e54,0 12px 26px rgba(190,44,132,.30),inset 0 2px 0 rgba(255,255,255,.42);
  text-shadow:0 1px 2px rgba(98,21,71,.18);
  transition:transform .14s ease,filter .14s ease,box-shadow .14s ease;
  overflow:hidden;
}
#chest-open-done.chest-finish-button::after {
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(115deg,transparent 16%,rgba(255,255,255,.24) 38%,transparent 58%);
  transform:translateX(-120%);
}
.chest-open-overlay.finished #chest-open-done.chest-finish-button::after {
  animation:chestFinishShine 1.7s ease-in-out .2s infinite;
}
#chest-open-done .chest-finish-icon {
  position:relative;
  z-index:1;
  width:39px;
  height:39px;
  flex:0 0 auto;
  display:grid;
  place-items:center;
  border:2px solid rgba(255,255,255,.88);
  border-radius:50%;
  background:linear-gradient(180deg,#fff7ab,#f5cf4e);
  color:#8b4d18;
  font-size:1rem;
  font-weight:1000;
  box-shadow:0 3px 0 #b98329,0 5px 9px rgba(90,35,60,.16),inset 0 2px 0 rgba(255,255,255,.7);
}
#chest-open-done .chest-finish-copy {
  position:relative;
  z-index:1;
  display:grid;
  justify-items:start;
  gap:1px;
}
#chest-open-done .chest-finish-copy strong {
  font-size:.82rem;
  line-height:1.05;
  font-weight:1000;
}
#chest-open-done .chest-finish-copy small {
  font-size:.5rem;
  line-height:1;
  font-weight:850;
  opacity:.78;
  letter-spacing:.03em;
}
#chest-open-done.chest-finish-button:hover:not(:disabled) {
  transform:translateY(-2px) scale(1.015);
  filter:brightness(1.04);
  box-shadow:0 8px 0 #771e54,0 16px 30px rgba(190,44,132,.34),inset 0 2px 0 rgba(255,255,255,.46);
}
#chest-open-done.chest-finish-button:active:not(:disabled) {
  transform:translateY(3px) scale(.995);
  box-shadow:0 3px 0 #771e54,0 8px 16px rgba(190,44,132,.24),inset 0 2px 0 rgba(255,255,255,.38);
}
#chest-open-done.chest-finish-button:focus-visible {
  outline:4px solid #ffe476;
  outline-offset:4px;
}
#chest-open-done.chest-finish-button:disabled { opacity:.55;cursor:default; }
@keyframes chestFinishShine {
  0%,30% { transform:translateX(-120%); }
  62%,100% { transform:translateX(120%); }
}

@media(max-width:560px){
  .inventory-chest-grid { grid-template-columns:1fr !important; }
  #chest-open-done.chest-finish-button { min-width:min(250px,84vw); }
}
#chest-open-done.chest-finish-button.hidden { display:none !important; }
