/* Sweet Shift Saga v4.5.0.2 — SWEETFOLIO
   Native candy-game visual pass using the supplied Sweet Shift panel assets. */

:root {
  --sf-pink:#f64b9d;
  --sf-pink-dark:#bc216f;
  --sf-pink-deep:#8b1856;
  --sf-purple:#8c59c8;
  --sf-purple-dark:#5b338d;
  --sf-gold:#ffd45f;
  --sf-gold-dark:#c9861c;
  --sf-cream:#fff9ed;
  --sf-cream-2:#fff0df;
  --sf-ink:#6a3f70;
  --sf-muted:#987e9b;
  --sf-shadow:0 7px 0 rgba(151,56,112,.20),0 16px 28px rgba(91,45,101,.13);
}

/* ---------- Entry point ---------- */
#screen-map.active #map-cards-btn {
  background:linear-gradient(180deg,#f45aa7 0%,#b9307c 100%) !important;
  --map-ui-shadow:#812257 !important;
}
#screen-map.active #map-cards-btn .map-square-icon {
  width:29px !important;
  height:29px !important;
  border-radius:9px !important;
  background:linear-gradient(145deg,#fff5bb,#ffd460) !important;
  color:#a33776 !important;
  box-shadow:inset 0 2px 0 rgba(255,255,255,.72),0 3px 0 #a06e19 !important;
  font-size:1rem !important;
}
#screen-map.active #map-cards-btn > small { font-size:.44rem !important; }
#screen-map.active .map-card-progress {
  top:-8px !important;
  right:-8px !important;
  border:2px solid #fff !important;
  background:linear-gradient(180deg,#fff0a8,#ffc947) !important;
  color:#724c16 !important;
  box-shadow:0 3px 0 #a66b15 !important;
}

/* ---------- Full-screen Sweetfolio ---------- */
.card-collection-screen {
  background:
    radial-gradient(circle at 12% 7%,rgba(255,255,255,.62),transparent 18%),
    radial-gradient(circle at 88% 15%,rgba(255,218,241,.62),transparent 20%),
    radial-gradient(circle at 50% 110%,rgba(195,162,255,.42),transparent 38%),
    linear-gradient(180deg,#f3c8e7 0%,#efdcf7 35%,#eee8ff 68%,#f8eff8 100%) !important;
  color:var(--sf-ink) !important;
}
.card-collection-screen::before,
.card-collection-screen::after {
  content:"";
  position:fixed;
  pointer-events:none;
  z-index:0;
  border-radius:50%;
  opacity:.28;
}
.card-collection-screen::before {
  width:170px;height:170px;left:-58px;bottom:9%;
  background:radial-gradient(circle at 35% 30%,#fff 0 12%,#ff8dd1 13% 42%,#d747a0 43% 63%,transparent 64%);
}
.card-collection-screen::after {
  width:130px;height:130px;right:-34px;top:31%;
  background:radial-gradient(circle at 32% 28%,#fff 0 10%,#ffc969 11% 40%,#ec7f3d 41% 64%,transparent 65%);
}

.card-collection-topbar {
  min-height:88px !important;
  padding:10px 18px !important;
  grid-template-columns:58px minmax(0,1fr) auto !important;
  gap:12px !important;
  border:0 !important;
  background:linear-gradient(180deg,#cf3b89 0%,#a92f79 100%) !important;
  box-shadow:0 6px 0 #7d2359,0 12px 24px rgba(75,30,73,.22) !important;
}
.card-collection-topbar::before {
  content:"";
  position:absolute;
  inset:5px 7px auto;
  height:2px;
  border-radius:999px;
  background:rgba(255,255,255,.38);
}
.card-collection-topbar::after {
  content:"SWEETFOLIO";
  position:absolute;
  left:50%;
  bottom:-13px;
  transform:translateX(-50%);
  z-index:3;
  min-width:150px;
  padding:5px 16px 6px;
  border:3px solid #fff;
  border-radius:999px;
  background:linear-gradient(180deg,#ff76bd,#e63f96);
  color:#fff;
  font-size:.57rem;
  font-weight:1000;
  letter-spacing:.13em;
  text-align:center;
  text-shadow:0 1px 1px rgba(102,22,74,.35);
  box-shadow:0 4px 0 #9e2967,0 8px 14px rgba(78,26,69,.17);
}
.cards-back-button {
  width:48px !important;height:48px !important;
  border:3px solid #fff !important;
  border-radius:15px !important;
  background:linear-gradient(180deg,#8e64cf,#5c3a98) !important;
  color:#fff !important;
  box-shadow:0 4px 0 #402768,0 7px 12px rgba(52,28,81,.2) !important;
  font-size:1.75rem !important;
}
.card-album-title-block { gap:1px !important; }
.card-album-title-block small {
  color:#ffe6f4 !important;
  font-size:.47rem !important;
  letter-spacing:.1em !important;
}
.card-album-title-block h1 {
  color:#fff !important;
  font-size:1.25rem !important;
  text-shadow:0 2px 1px rgba(103,24,73,.32) !important;
}
.card-album-title-block span {
  color:#ffeaf6 !important;
  font-size:.5rem !important;
}
.card-album-progress-pill {
  min-width:108px !important;
  min-height:52px !important;
  border:3px solid #fff !important;
  border-radius:16px !important;
  background:linear-gradient(180deg,#fff5b9,#ffd356) !important;
  color:#6e4814 !important;
  box-shadow:0 4px 0 #b27418,0 8px 12px rgba(85,53,18,.16) !important;
}

.card-collection-tabs {
  top:88px !important;
  z-index:17 !important;
  gap:7px !important;
  padding:23px 16px 9px !important;
  border:0 !important;
  background:linear-gradient(180deg,rgba(246,218,240,.96),rgba(241,225,246,.94)) !important;
  box-shadow:0 5px 12px rgba(91,56,101,.07) !important;
}
.card-tab {
  min-height:39px !important;
  padding:6px 13px !important;
  border:2px solid #fff !important;
  border-radius:13px !important;
  background:linear-gradient(180deg,#fffdfd,#f5eaf7) !important;
  color:#76537f !important;
  box-shadow:0 3px 0 rgba(126,86,135,.24) !important;
  font-size:.55rem !important;
}
.card-tab:hover { transform:translateY(-1px); }
.card-tab.active {
  background:linear-gradient(180deg,#ffeb8f,#ffc846) !important;
  color:#704714 !important;
  box-shadow:0 4px 0 #a66a15,0 7px 10px rgba(111,70,14,.10) !important;
}

.card-collection-content {
  position:relative;
  z-index:1;
  width:min(1240px,calc(100vw - 30px)) !important;
  padding:18px 0 30px !important;
}

/* ---------- Shared candy panels ---------- */
.card-panel,
.card-overview-hero,
.album-rewards-intro,
.exclusive-intro,
.archive-intro,
.card-list-head,
.card-packs-head,
.completion-reward-copy,
.archive-album-list,
.archive-album-view {
  border:3px solid #fff !important;
  background:linear-gradient(180deg,#fffaf1 0%,#fff0e1 100%) !important;
  box-shadow:var(--sf-shadow) !important;
}
.card-panel,
.card-overview-hero,
.completion-reward-copy,
.archive-album-list,
.archive-album-view { border-radius:22px !important; }
.card-list-head,
.card-packs-head,
.album-rewards-intro,
.exclusive-intro,
.archive-intro { border-radius:20px !important; }
.card-panel { padding:15px !important; }
.card-panel > header { margin-bottom:11px !important; }
.card-panel > header small,
.album-overview-copy > small,
.card-list-head small,
.card-packs-head small,
.album-rewards-intro small,
.exclusive-intro small,
.archive-intro small {
  color:#d1458c !important;
  font-size:.49rem !important;
}
.card-panel > header strong,
.album-overview-copy h2,
.card-list-head h2,
.card-packs-head h2,
.album-rewards-intro h2,
.exclusive-intro h2,
.archive-intro h2 {
  color:#69416f !important;
}

/* Album cover / overview */
.card-overview-hero {
  position:relative !important;
  overflow:visible !important;
  min-height:275px !important;
  padding:31px 28px 24px !important;
  background:
    radial-gradient(circle at 83% 22%,rgba(255,255,255,.72),transparent 25%),
    linear-gradient(135deg,#ffe8f3,#f4eaff 55%,#e5f7ff) !important;
}
.card-overview-hero::before {
  content:"ACTIVE ALBUM";
  position:absolute;
  top:-14px;left:28px;
  min-width:116px;
  padding:6px 13px;
  border:3px solid #fff;
  border-radius:13px 13px 16px 16px;
  background:linear-gradient(180deg,#fa69b1,#d93b8d);
  color:#fff;
  font-size:.48rem;
  font-weight:1000;
  letter-spacing:.09em;
  text-align:center;
  box-shadow:0 4px 0 #9c2865;
}
.album-overview-copy h2 { font-size:1.55rem !important; }
.album-overview-copy p { color:#886f8d !important; }
.album-overview-stats { gap:9px !important; }
.album-overview-stats span {
  min-width:112px !important;
  padding:8px 11px !important;
  border:2px solid #fff !important;
  border-radius:15px !important;
  background:rgba(255,255,255,.78) !important;
  box-shadow:0 4px 0 rgba(140,93,145,.12) !important;
}
.album-overview-actions { gap:8px !important; }
.album-overview-actions button,
.vault-overview button,
.duplicate-vault-panel button,
.card-shop-pack button,
.owned-card-pack button,
.card-special-offers button,
.album-reward-step button,
.inventory-card-pack-stack button,
.profile-card-collection button {
  min-height:36px !important;
  border:3px solid #fff !important;
  border-radius:12px !important;
  background:linear-gradient(180deg,#9165cd,#603d9a) !important;
  color:#fff !important;
  box-shadow:0 4px 0 #452b71 !important;
}
.album-overview-actions button:first-child,
.card-special-offers button,
.album-reward-step.reached button {
  background:linear-gradient(180deg,#f85bab,#c52f7d) !important;
  box-shadow:0 4px 0 #852054 !important;
}
.album-overview-emblem img {
  width:200px !important;
  filter:drop-shadow(0 13px 15px rgba(71,31,81,.18)) !important;
}
.album-overview-emblem > strong {
  text-shadow:0 2px 3px rgba(63,24,75,.42) !important;
}

.card-overview-columns { gap:13px !important; }
.album-category-row > span { color:#735679 !important; }
.album-category-row > div,
.vault-meter {
  height:10px !important;
  background:#eaddea !important;
  box-shadow:inset 0 2px 3px rgba(91,57,98,.08) !important;
}
.album-category-row i,
.vault-meter i,
.album-reward-line i {
  background:linear-gradient(90deg,#f15ba8,#8a5ec4) !important;
}
.vault-overview header img,.duplicate-vault-panel header img {
  width:60px !important;height:60px !important;
  filter:drop-shadow(0 5px 7px rgba(77,44,86,.14));
}
.recent-card-row button {
  border:2px solid #efddec !important;
  border-radius:13px !important;
  background:#fffdfd !important;
  box-shadow:0 5px 10px rgba(78,48,86,.06) !important;
}

/* ---------- Album card shelf ---------- */
.card-list-head,.card-packs-head,.album-rewards-intro,.exclusive-intro,.archive-intro {
  padding:17px 18px !important;
}
.card-list-filters button {
  min-height:32px !important;
  border:2px solid #fff !important;
  border-radius:11px !important;
  background:linear-gradient(180deg,#f9f1fb,#eadcf0) !important;
  color:#795c81 !important;
  box-shadow:0 3px 0 rgba(115,84,123,.2) !important;
}
.card-list-filters button.active {
  background:linear-gradient(180deg,#ffdf72,#efaa2c) !important;
  color:#724819 !important;
  box-shadow:0 3px 0 #9e6819 !important;
}
.album-card-grid { gap:10px !important; }
.album-card-slot {
  min-height:220px !important;
  padding:9px !important;
  border:3px solid #fff !important;
  border-radius:18px !important;
  background:linear-gradient(180deg,#fffdfd,#fff2f8) !important;
  box-shadow:0 6px 0 rgba(142,93,146,.10),0 11px 16px rgba(84,52,92,.07) !important;
}
.album-card-slot.collected:hover {
  transform:translateY(-3px) rotate(-.25deg) !important;
  box-shadow:0 9px 0 rgba(142,93,146,.10),0 16px 22px rgba(84,52,92,.10) !important;
}
.album-card-slot.missing {
  background:
    repeating-linear-gradient(135deg,rgba(131,101,142,.035) 0 8px,transparent 8px 16px),
    linear-gradient(180deg,#f3edf5,#eae1ef) !important;
  color:#9a829c !important;
}
.album-card-art,.album-card-back {
  border:2px solid rgba(255,255,255,.9) !important;
  border-radius:13px !important;
  box-shadow:inset 0 2px 0 rgba(255,255,255,.72) !important;
}
.album-card-slot.has-shiny {
  border-color:#fff !important;
  box-shadow:0 0 0 3px #ffe77e,0 0 20px rgba(184,226,255,.58),0 10px 22px rgba(109,70,120,.13) !important;
}
.shiny-stamp {
  border:2px solid #fff !important;
  box-shadow:0 3px 0 rgba(128,83,140,.25),0 7px 11px rgba(75,46,83,.10) !important;
}

/* ---------- Packs / Shop ---------- */
.owned-card-packs,.card-shop-grid { gap:10px !important; }
.owned-card-pack,
.card-shop-pack {
  border:2px solid #efdcec !important;
  border-radius:17px !important;
  background:linear-gradient(180deg,#fffdfd,#fff4f9) !important;
  box-shadow:0 5px 0 rgba(140,96,145,.09),0 10px 15px rgba(84,53,91,.06) !important;
}
.owned-card-pack img,.card-shop-pack img {
  filter:drop-shadow(0 7px 8px rgba(79,43,88,.16));
}
.card-shop-pack b { color:#a26025 !important; }
.card-pack-shop > header > span {
  border:2px solid #fff !important;
  border-radius:11px !important;
  background:linear-gradient(180deg,#fff0a3,#ffd25b) !important;
  color:#6c4716 !important;
  box-shadow:0 3px 0 #ac711b !important;
}
.card-special-offers article {
  border:2px solid #fff !important;
  border-radius:16px !important;
  background:linear-gradient(90deg,#fff6c9,#ffe8f7) !important;
  box-shadow:0 5px 0 rgba(155,104,91,.10) !important;
}

/* ---------- Album Rewards ---------- */
.album-reward-track { gap:9px !important;padding-top:24px !important; }
.album-reward-line {
  top:45px !important;
  height:9px !important;
  background:#e8d9ea !important;
}
.album-reward-step {
  border:3px solid #fff !important;
  border-radius:17px !important;
  background:linear-gradient(180deg,#fffdfd,#fff5f9) !important;
  box-shadow:0 5px 0 rgba(137,91,143,.10),0 10px 15px rgba(79,48,87,.06) !important;
}
.album-reward-step.reached { background:linear-gradient(180deg,#fff8d6,#fffdfb) !important; }
.album-reward-target {
  border:3px solid #fff !important;
  background:linear-gradient(180deg,#986bd0,#68419f) !important;
  box-shadow:0 3px 0 #49306d !important;
}
.album-reward-step.reached .album-reward-target {
  background:linear-gradient(180deg,#f65da9,#c3317f) !important;
  box-shadow:0 3px 0 #842257 !important;
}
.completion-reward-copy {
  background:linear-gradient(135deg,#fff5b7,#ffe5f4 54%,#eadfff) !important;
}

/* ---------- Exclusives / Archive ---------- */
.exclusive-card {
  border:3px solid #fff !important;
  border-radius:19px !important;
  background:linear-gradient(180deg,#fffdfd,#fff2f8) !important;
  box-shadow:0 6px 0 rgba(140,91,145,.10),0 11px 16px rgba(85,52,93,.07) !important;
}
.exclusive-card-art { border:2px solid #fff !important; }
.archive-album-list button {
  border:2px solid #ecdcea !important;
  border-radius:12px !important;
  background:linear-gradient(180deg,#fffdfd,#f6edf7) !important;
}
.archive-album-list button.active {
  border-color:#fff !important;
  background:linear-gradient(180deg,#ffe891,#ffc94a) !important;
  color:#704716 !important;
  box-shadow:0 3px 0 #a66a17 !important;
}
.archive-card-grid .album-card-slot.missing button,
.archive-completion-claim {
  border:3px solid #fff !important;
  border-radius:12px !important;
  background:linear-gradient(180deg,#f19b4c,#c96532) !important;
  color:#fff !important;
  box-shadow:0 4px 0 #88451f !important;
}

/* ---------- Card detail: uses supplied candy guide panel ---------- */
.card-detail-panel {
  padding:18px !important;
  background:rgba(44,19,46,.72) !important;
  backdrop-filter:blur(7px) !important;
}
.card-detail-card {
  position:relative !important;
  width:min(930px,92vw) !important;
  min-height:610px !important;
  box-sizing:border-box !important;
  padding:132px 76px 72px !important;
  grid-template-columns:300px minmax(0,1fr) !important;
  gap:28px !important;
  border:0 !important;
  border-radius:0 !important;
  background:url('../assets/cards/frames/sweetfolio-wide-frame.png') center/100% 100% no-repeat !important;
  box-shadow:none !important;
}
.card-detail-card::before {
  content:"SWEETFOLIO CARD";
  position:absolute;
  top:52px;left:50%;
  transform:translateX(-50%);
  width:45%;
  color:#fff;
  font-size:.67rem;
  font-weight:1000;
  letter-spacing:.12em;
  text-align:center;
  text-shadow:0 2px 1px rgba(118,28,77,.28);
}
.card-detail-close {
  position:fixed !important;
  top:calc(50% - 305px + 54px) !important;
  right:calc(50% - min(465px,46vw) + 27px) !important;
  z-index:4 !important;
  width:74px !important;height:74px !important;
  padding:0 !important;
  border:0 !important;
  border-radius:50% !important;
  background:url('../assets/cards/frames/sweetfolio-close.png') center/contain no-repeat !important;
  box-shadow:none !important;
  color:transparent !important;
  font-size:0 !important;
  filter:drop-shadow(0 6px 8px rgba(83,21,57,.18));
}
.card-detail-close:hover { transform:scale(1.05) !important; }
.card-detail-art {
  min-height:330px !important;
  border:3px solid #fff !important;
  border-radius:20px !important;
  background:linear-gradient(145deg,hsl(var(--card-hue,320) 74% 88%),#fff) !important;
  box-shadow:0 6px 0 rgba(144,89,148,.14),0 12px 18px rgba(80,49,87,.09) !important;
}
.card-detail-copy h2 { color:#713e6f !important;font-size:1.55rem !important; }
.card-detail-rarity,
.card-detail-shiny,
.card-detail-copy > div span {
  border:2px solid #fff !important;
  box-shadow:0 3px 0 rgba(130,90,136,.13) !important;
}
.card-detail-rarity { background:linear-gradient(180deg,#f6edf8,#eaddf0) !important; }
.card-detail-shiny { background:linear-gradient(90deg,#fff0a1,#c8f7ff,#f2c5ff) !important; }

/* ---------- Card Pack opening: supplied wide popup backdrop ---------- */
.card-pack-opening {
  padding:12px !important;
  background:rgba(40,17,45,.76) !important;
  backdrop-filter:blur(7px) !important;
}
.card-pack-opening-stage {
  position:relative !important;
  width:min(1180px,96vw) !important;
  min-height:0 !important;
  aspect-ratio:1.5/1 !important;
  box-sizing:border-box !important;
  grid-template-rows:auto auto 1fr auto !important;
  gap:8px !important;
  padding:124px 75px 70px !important;
  background:url('../assets/cards/frames/sweetfolio-wide-frame.png') center/100% 100% no-repeat !important;
}
.card-pack-opening-head {
  position:absolute !important;
  top:48px !important;
  left:50% !important;
  transform:translateX(-50%) !important;
  z-index:2 !important;
  color:#fff !important;
  text-shadow:0 2px 1px rgba(111,26,76,.3) !important;
}
.card-pack-opening-head small { color:#ffe6f5 !important; }
.card-pack-opening-head strong { font-size:1.2rem !important; }
.card-pack-opening-art {
  width:120px !important;height:150px !important;
  margin-top:-4px !important;
  filter:drop-shadow(0 10px 11px rgba(76,40,84,.18)) !important;
}
.card-pack-results { gap:9px !important;align-items:center !important; }
.pack-result-card {
  width:142px !important;
  min-height:218px !important;
  padding:8px !important;
  border:3px solid #fff !important;
  border-radius:18px !important;
  background:linear-gradient(180deg,#fffdfd,#fff2f8) !important;
  box-shadow:0 6px 0 rgba(137,88,141,.12),0 12px 18px rgba(69,41,75,.10) !important;
}
.pack-result-card.visible { animation:sfCardPop .34s cubic-bezier(.2,.9,.28,1.25) both; }
.pack-result-card.shiny {
  background:linear-gradient(145deg,#fff3a7,#d7fbff 52%,#f6d4ff) !important;
  box-shadow:0 0 0 3px #ffe873,0 0 25px rgba(198,237,255,.75),0 12px 20px rgba(69,41,75,.12) !important;
}
.pack-result-card > div { height:116px !important; }
.pack-result-card img { max-width:104px !important;max-height:104px !important; }
.card-pack-done {
  min-width:215px !important;
  min-height:48px !important;
  border:3px solid #fff !important;
  border-radius:15px !important;
  background:linear-gradient(180deg,#ffdc69,#eea52e) !important;
  color:#684315 !important;
  box-shadow:0 5px 0 #a66d1d,0 9px 14px rgba(84,52,19,.12) !important;
}
@keyframes sfCardPop {
  from{opacity:0;transform:translateY(22px) scale(.86) rotate(-1.5deg)}
  70%{opacity:1;transform:translateY(-3px) scale(1.025) rotate(.4deg)}
  to{opacity:1;transform:translateY(0) scale(1) rotate(0)}
}

/* ---------- Profile / Inventory integration ---------- */
.profile-card-collection {
  border:3px solid #fff !important;
  border-radius:16px !important;
  background:linear-gradient(180deg,#fff9e9,#fff0df) !important;
  box-shadow:0 5px 0 rgba(139,91,143,.1) !important;
}
.inventory-card-packs-section {
  border-top:1px solid rgba(118,78,126,.12);
  padding-top:10px;
}
.inventory-card-pack-stack > span {
  border-radius:12px;
  background:rgba(255,255,255,.55);
}
.inventory-card-pack-stack b {
  border:2px solid #fff !important;
  background:linear-gradient(180deg,#f15aa5,#bd347d) !important;
  box-shadow:0 3px 0 #7f2455 !important;
}

@media(max-width:900px){
  .card-detail-card {
    width:min(540px,94vw) !important;
    min-height:760px !important;
    padding:148px 66px 86px !important;
    grid-template-columns:1fr !important;
    gap:14px !important;
    background-image:url('../assets/cards/frames/sweetfolio-tall-frame.png') !important;
  }
  .card-detail-card::before { top:66px !important;width:60% !important; }
  .card-detail-close {
    top:calc(50% - 380px + 78px) !important;
    right:calc(50% - min(270px,47vw) + 34px) !important;
    width:68px !important;height:68px !important;
  }
  .card-detail-art { min-height:245px !important; }
  .card-detail-art img { width:74% !important;height:74% !important; }
  .card-detail-copy { align-content:start !important; }

  .card-pack-opening-stage {
    width:min(720px,96vw) !important;
    aspect-ratio:auto !important;
    min-height:620px !important;
    padding:118px 54px 58px !important;
  }
  .card-pack-results { overflow-y:auto !important;max-height:330px !important; }
}

@media(max-width:620px){
  .card-collection-topbar { min-height:74px !important;padding:8px !important;grid-template-columns:46px 1fr auto !important; }
  .card-collection-topbar::after { bottom:-11px !important;min-width:125px !important;font-size:.49rem !important;padding:4px 12px 5px !important; }
  .cards-back-button { width:42px !important;height:42px !important; }
  .card-album-title-block small { font-size:.4rem !important; }
  .card-album-title-block h1 { font-size:.88rem !important; }
  .card-album-title-block span { font-size:.42rem !important; }
  .card-album-progress-pill { min-width:73px !important;min-height:42px !important;padding:4px 6px !important; }
  .card-album-progress-pill strong { font-size:.72rem !important; }
  .card-collection-tabs { top:74px !important;padding:18px 7px 7px !important; }
  .card-tab { min-height:34px !important;padding:5px 9px !important;font-size:.48rem !important; }
  .card-collection-content { width:calc(100vw - 14px) !important;padding-top:10px !important; }
  .card-overview-hero { padding:27px 15px 16px !important; }
  .card-overview-hero::before { top:-11px !important;left:16px !important;padding:5px 10px !important;font-size:.41rem !important; }

  .card-detail-panel { padding:4px !important; }
  .card-detail-card {
    width:min(460px,98vw) !important;
    min-height:700px !important;
    max-height:96vh !important;
    overflow:auto !important;
    padding:135px 48px 75px !important;
  }
  .card-detail-card::before { top:58px !important;font-size:.55rem !important; }
  .card-detail-close {
    top:calc(50% - 350px + 70px) !important;
    right:calc(50% - min(230px,49vw) + 25px) !important;
    width:60px !important;height:60px !important;
  }
  .card-detail-art { min-height:220px !important; }

  .card-pack-opening-stage {
    width:min(500px,99vw) !important;
    min-height:700px !important;
    padding:126px 42px 64px !important;
    background-image:url('../assets/cards/frames/sweetfolio-tall-frame.png') !important;
  }
  .card-pack-opening-head { top:60px !important; }
  .card-pack-opening-art { width:88px !important;height:112px !important; }
  .card-pack-results { max-height:390px !important;gap:7px !important; }
  .pack-result-card { width:112px !important;min-height:186px !important;padding:6px !important; }
  .pack-result-card > div { height:94px !important; }
  .pack-result-card img { max-width:84px !important;max-height:84px !important; }
  .pack-result-card strong { font-size:.47rem !important; }
}

@media(prefers-reduced-motion:reduce){
  .pack-result-card.visible { animation:none !important; }
}

.card-pack-close {
  position:absolute;
  top:42px;
  right:32px;
  z-index:4;
  width:70px;
  height:70px;
  padding:0;
  border:0;
  border-radius:50%;
  background:url('../assets/cards/frames/sweetfolio-close.png') center/contain no-repeat;
  color:transparent;
  font-size:0;
  cursor:pointer;
  filter:drop-shadow(0 6px 8px rgba(83,21,57,.18));
  transition:transform .12s ease;
}
.card-pack-close:hover { transform:scale(1.05); }
.card-pack-close:active { transform:scale(.96); }
@media(max-width:900px){.card-pack-close{top:54px;right:26px;width:62px;height:62px}}
@media(max-width:620px){.card-pack-close{top:58px;right:22px;width:54px;height:54px}}
#screen-map.active #map-cards-btn > small {
  max-width:66px !important;
  font-size:.39rem !important;
  letter-spacing:-.01em !important;
}