/* Sweet Shift Saga v4.5.1.8 — Sweetfolio flow redesign + Colour Rush expansion */

:root{
  --sf18-berry:#c92f82;
  --sf18-berry-deep:#7f1f66;
  --sf18-violet:#7146b8;
  --sf18-blue:#2a9dd6;
  --sf18-gold:#ffd35e;
  --sf18-ink:#56385f;
  --sf18-soft:#fff8f1;
}

/* ---------- Sweetfolio shell: clearer hierarchy, less utility-menu feel ---------- */
#screen-cards.card-collection-screen.active{
  grid-template-rows:auto auto minmax(0,1fr) !important;
  background:
    radial-gradient(circle at 9% 4%,rgba(255,255,255,.66),transparent 23%),
    radial-gradient(circle at 91% 12%,rgba(127,210,255,.25),transparent 24%),
    linear-gradient(180deg,#efc9e4 0%,#eee0f5 42%,#f6edf9 100%) !important;
}
#screen-cards .card-collection-topbar{
  min-height:98px !important;
  padding:10px 20px !important;
  grid-template-columns:54px minmax(0,1fr) 128px !important;
  background:
    radial-gradient(circle at 72% -30%,rgba(66,187,246,.46),transparent 35%),
    linear-gradient(115deg,#8d236e 0%,#c73583 45%,#7644ae 100%) !important;
  box-shadow:0 7px 0 #662051,0 14px 28px rgba(65,27,74,.22) !important;
}
#screen-cards .card-collection-topbar::after{
  content:"SWEETFOLIO" !important;
  bottom:-14px !important;
  min-width:166px !important;
  background:linear-gradient(180deg,#ff77bb,#d8388f) !important;
}
#screen-cards .card-album-identity{
  min-width:0;
  display:grid;
  grid-template-columns:58px minmax(0,1fr);
  align-items:center;
  gap:11px;
}
#screen-cards .card-album-cover-chip{
  width:44px;height:66px;object-fit:cover;object-position:center;
  border:3px solid rgba(255,255,255,.92);
  border-radius:12px;
  box-shadow:0 5px 0 rgba(73,27,74,.28),0 8px 15px rgba(49,24,62,.18);
}
#screen-cards .card-album-title-block h1{font-size:1.32rem !important;letter-spacing:-.02em;}
#screen-cards .card-album-title-block small{color:#ffe6f4 !important;font-size:.46rem !important;}
#screen-cards .card-album-title-block span{color:#fff1f8 !important;}
#screen-cards .card-album-progress-pill{
  width:128px !important;min-width:128px !important;
  background:linear-gradient(180deg,#fff7c3,#ffd45d) !important;
  box-shadow:0 5px 0 #a76a1d,0 9px 16px rgba(74,42,20,.16) !important;
}

#screen-cards .card-collection-tabs{
  grid-template-columns:repeat(4,minmax(145px,190px)) !important;
  gap:10px !important;
  padding:24px 18px 11px !important;
  background:linear-gradient(180deg,rgba(251,236,247,.97),rgba(241,226,246,.94)) !important;
}
#screen-cards .card-tab{
  min-height:50px !important;
  padding:7px 13px !important;
  border-radius:15px !important;
  display:grid !important;
  align-content:center !important;
  gap:2px !important;
  background:linear-gradient(180deg,#fff,#f7edf8) !important;
  color:#77537e !important;
  box-shadow:0 4px 0 rgba(115,76,126,.2) !important;
}
#screen-cards .card-tab span{font-size:.61rem;font-weight:1000;letter-spacing:.01em;}
#screen-cards .card-tab small{font-size:.41rem;font-weight:900;color:#a07c9f;letter-spacing:.04em;text-transform:uppercase;}
#screen-cards .card-tab.active{
  background:linear-gradient(180deg,#fff2a9,#ffc84b) !important;
  color:#684313 !important;
  box-shadow:0 4px 0 #a46818,0 8px 13px rgba(102,65,20,.12) !important;
}
#screen-cards .card-tab.active small{color:#8c5d1e;}
#screen-cards .card-collection-content{width:min(1180px,calc(100vw - 32px)) !important;padding:18px 0 46px !important;}

/* ---------- Album Home ---------- */
#screen-cards .sf-home-hero{
  position:relative;
  display:grid;
  grid-template-columns:285px minmax(0,1fr);
  gap:30px;
  min-height:390px;
  padding:24px 30px 25px 24px;
  border:3px solid #fff;
  border-radius:28px;
  overflow:hidden;
  background:
    radial-gradient(circle at 90% 12%,rgba(78,190,244,.24),transparent 30%),
    radial-gradient(circle at 35% 106%,rgba(255,200,75,.2),transparent 32%),
    linear-gradient(135deg,#fff9ef 0%,#ffedf7 54%,#eee7ff 100%);
  box-shadow:0 8px 0 rgba(146,69,128,.17),0 20px 35px rgba(73,43,85,.12);
}
#screen-cards .sf-cover-wrap{position:relative;display:grid;place-items:center;align-self:center;}
#screen-cards .sf-cover-wrap img{
  width:214px;height:322px;object-fit:cover;object-position:center;border-radius:25px;
  border:6px solid #fff;
  box-shadow:0 9px 0 rgba(86,43,100,.25),0 20px 28px rgba(63,35,77,.2);
  transform:rotate(-1.5deg);
}
#screen-cards .sf-cover-wrap span{
  position:absolute;left:6px;top:17px;
  padding:7px 12px;border:3px solid #fff;border-radius:12px;
  background:linear-gradient(180deg,#ff6eb5,#d8388d);color:#fff;
  font-size:.46rem;font-weight:1000;letter-spacing:.08em;
  box-shadow:0 4px 0 #8f245e;
}
#screen-cards .sf-home-copy{display:flex;flex-direction:column;justify-content:center;min-width:0;}
#screen-cards .sf-home-copy>small{color:#c43483;font-size:.5rem;font-weight:1000;letter-spacing:.12em;}
#screen-cards .sf-home-copy h2{margin:4px 0 5px;color:#5b3565;font-size:2rem;line-height:1;letter-spacing:-.035em;}
#screen-cards .sf-home-copy>p{max-width:660px;margin:0;color:#886c8a;font-size:.72rem;font-weight:800;line-height:1.5;}
#screen-cards .sf-album-meta{display:flex;flex-wrap:wrap;gap:7px;margin:13px 0 12px;}
#screen-cards .sf-album-meta span{padding:6px 9px;border:1px solid #ead7e7;border-radius:999px;background:rgba(255,255,255,.7);color:#8b6789;font-size:.49rem;font-weight:900;}
#screen-cards .sf-progress-main{display:grid;grid-template-columns:auto minmax(160px,1fr);align-items:center;gap:15px;max-width:560px;margin:1px 0 14px;}
#screen-cards .sf-progress-main>div{display:flex;align-items:baseline;gap:8px;}
#screen-cards .sf-progress-main strong{color:#6b3e72;font-size:1.7rem;line-height:1;}
#screen-cards .sf-progress-main strong small{font-size:.72rem;}
#screen-cards .sf-progress-main span{color:#9b7898;font-size:.5rem;font-weight:1000;text-transform:uppercase;}
#screen-cards .sf-progress-main>i{height:13px;overflow:hidden;border-radius:999px;background:#eadce9;box-shadow:inset 0 2px 4px rgba(74,42,74,.1);}
#screen-cards .sf-progress-main>i b{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#f15aaa,#8557c6,#2baae3);box-shadow:inset 0 2px 0 rgba(255,255,255,.35);}
#screen-cards .sf-primary-actions{display:flex;flex-wrap:wrap;gap:9px;}
#screen-cards .sf-primary-actions button,
#screen-cards .sf-library-strip button,
#screen-cards .sf-section-route button,
#screen-cards .sf-vault-panel button,
#screen-cards .sf-pack-owned button,
#screen-cards .sf-shop-pack button{
  min-height:42px;padding:8px 14px;border:3px solid #fff;border-radius:14px;
  background:linear-gradient(180deg,#8761ca,#5b3995);color:#fff;
  box-shadow:0 4px 0 #402767;font-size:.56rem;font-weight:1000;cursor:pointer;
}
#screen-cards .sf-primary-actions .sf-action-primary{background:linear-gradient(180deg,#f65baa,#c82f81);box-shadow:0 4px 0 #871f58;}
#screen-cards .sf-primary-actions button em{display:inline-grid;place-items:center;min-width:20px;height:20px;margin-left:5px;padding:0 5px;border-radius:999px;background:#fff;color:#7c468f;font-style:normal;font-size:.46rem;}

#screen-cards .sf-dashboard-grid{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(300px,.65fr);gap:14px;margin-top:15px;}
#screen-cards .sf-dashboard-panel,
#screen-cards .sf-library-strip,
#screen-cards .sf-pack-command,
#screen-cards .sf-shop-panel,
#screen-cards .sf-earn-pack-grid article{
  border:3px solid #fff;border-radius:22px;background:linear-gradient(180deg,#fffaf2,#fff1e6);box-shadow:0 6px 0 rgba(151,71,127,.13),0 13px 22px rgba(73,43,82,.08);
}
#screen-cards .sf-dashboard-panel{padding:17px;}
#screen-cards .sf-dashboard-panel header{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:13px;}
#screen-cards .sf-dashboard-panel header small,
#screen-cards .sf-library-strip>div small,
#screen-cards .sf-pack-command small,
#screen-cards .sf-shop-panel header small,
#screen-cards .sf-earn-pack-grid article small{display:block;color:#ca3e84;font-size:.46rem;font-weight:1000;letter-spacing:.1em;}
#screen-cards .sf-dashboard-panel header strong,
#screen-cards .sf-library-strip>div strong,
#screen-cards .sf-pack-command h2,
#screen-cards .sf-shop-panel header strong,
#screen-cards .sf-earn-pack-grid article strong{color:#67416d;}
#screen-cards .sf-progress-panel header>b{padding:7px 10px;border-radius:11px;background:#f0e4f1;color:#79547f;font-size:.64rem;}
#screen-cards .sf-category-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;}
#screen-cards .sf-category{padding:9px 10px;border:1px solid #eadde8;border-radius:13px;background:rgba(255,255,255,.67);}
#screen-cards .sf-category>div{display:flex;justify-content:space-between;gap:8px;align-items:center;}
#screen-cards .sf-category strong{color:#745178;font-size:.57rem;}
#screen-cards .sf-category small{color:#9c7c9b;font-size:.44rem;font-weight:900;}
#screen-cards .sf-category>span{display:block;height:7px;margin-top:6px;overflow:hidden;border-radius:999px;background:#eadde9;}
#screen-cards .sf-category>span i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#f058a7,#8357c3);}
#screen-cards .sf-vault-panel header img{width:62px;height:62px;object-fit:contain;}
#screen-cards .sf-vault-count{display:flex;align-items:baseline;gap:6px;margin:8px 0 5px;}
#screen-cards .sf-vault-count strong{font-size:1.45rem;color:#633b6d;}.sf-vault-count span{color:#9a7798;font-size:.53rem;font-weight:900;}
#screen-cards .sf-vault-panel p{color:#8e738e;font-size:.56rem;font-weight:800;line-height:1.45;}

#screen-cards .sf-library-strip{display:grid;grid-template-columns:minmax(0,1fr) 190px 190px;align-items:center;gap:10px;margin-top:15px;padding:16px 18px;background:linear-gradient(115deg,#fff7c9,#ffedf5 45%,#eee7ff);}
#screen-cards .sf-library-strip p{margin:3px 0 0;color:#8e728d;font-size:.53rem;font-weight:800;}
#screen-cards .sf-library-strip button{display:grid;text-align:left;gap:2px;background:linear-gradient(180deg,#fff,#f8edf8);color:#68466f;box-shadow:0 4px 0 rgba(117,78,127,.2);border-color:#fff;}
#screen-cards .sf-library-strip button small{color:#9d7d9c;font-size:.43rem;}

/* ---------- Route/header treatment for non-home views ---------- */
#screen-cards .sf-section-route{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:0 0 13px;padding:13px 16px;border:3px solid #fff;border-radius:18px;background:linear-gradient(90deg,#7f245f,#bd3382 55%,#7047af);box-shadow:0 5px 0 #62204f,0 10px 17px rgba(67,33,76,.14);color:#fff;}
#screen-cards .sf-section-route>div{display:grid;grid-template-columns:auto auto;align-items:baseline;gap:2px 10px;}
#screen-cards .sf-section-route small{grid-column:1/-1;color:#ffe7f4;font-size:.43rem;font-weight:1000;letter-spacing:.09em;}
#screen-cards .sf-section-route strong{font-size:.86rem;}.sf-section-route span{font-size:.48rem;font-weight:900;color:#ffe9f5;}
#screen-cards .sf-section-route button{min-height:34px;background:linear-gradient(180deg,#fff4b5,#ffd25a);color:#6d4717;box-shadow:0 3px 0 #a46a1d;}
#screen-cards .sf-legacy-route{background:linear-gradient(90deg,#67409d,#8b50c0 55%,#3f8ac4);box-shadow:0 5px 0 #4c3370,0 10px 17px rgba(50,38,79,.14);}

/* Existing list/reward panels now sit under a clear route header. */
#screen-cards .sf-section-route + .card-list-head,
#screen-cards .sf-section-route + .album-rewards-intro,
#screen-cards .sf-section-route + .exclusive-intro,
#screen-cards .sf-section-route + .archive-empty,
#screen-cards .sf-section-route + .archive-shell{margin-top:0 !important;}
#screen-cards .card-list-head{background:linear-gradient(180deg,#fffaf2,#fff0e6) !important;}
#screen-cards .album-card-grid{grid-template-columns:repeat(auto-fill,minmax(156px,1fr)) !important;gap:13px !important;}
#screen-cards .album-card-slot{min-height:238px !important;border-radius:19px !important;}

/* ---------- Packs: queue first, earning second, shop last ---------- */
#screen-cards .sf-pack-command{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:18px 20px;background:linear-gradient(120deg,#fff6bf,#ffedf7 55%,#e9edff);}
#screen-cards .sf-pack-command h2{margin:3px 0;font-size:1.08rem;}.sf-pack-command p{margin:0;max-width:690px;color:#8f708e;font-size:.56rem;font-weight:800;line-height:1.45;}
#screen-cards .sf-pack-command>strong{display:grid;place-items:center;min-width:76px;height:64px;border:4px solid #fff;border-radius:20px;background:linear-gradient(180deg,#ff6ab1,#c93685);color:#fff;font-size:1.45rem;box-shadow:0 5px 0 #89235b;}
#screen-cards .sf-pack-owned-list{display:grid;gap:10px;margin-top:13px;}
#screen-cards .sf-pack-owned{display:grid;grid-template-columns:98px minmax(0,1fr) auto auto;align-items:center;gap:14px;padding:12px 14px;border:3px solid #fff;border-radius:20px;background:linear-gradient(180deg,#fff,#fff3f8);box-shadow:0 5px 0 rgba(136,85,139,.11),0 11px 17px rgba(70,44,78,.07);}
#screen-cards .sf-pack-owned img{width:88px;height:104px;object-fit:contain;filter:drop-shadow(0 7px 8px rgba(75,40,83,.17));}
#screen-cards .sf-pack-owned>div{min-width:0;}.sf-pack-owned>div small{display:block;color:#c93683;font-size:.44rem;font-weight:1000;letter-spacing:.08em;}.sf-pack-owned>div strong{display:block;color:#63406b;font-size:.78rem;}.sf-pack-owned>div span{display:block;margin-top:3px;color:#987a96;font-size:.49rem;font-weight:800;}
#screen-cards .sf-pack-owned>b{min-width:42px;text-align:center;color:#704a76;font-size:.78rem;}
#screen-cards .sf-pack-owned.sf-colour-rush-pack{background:linear-gradient(115deg,#fff6bd,#ffedf5 44%,#e5f4ff);box-shadow:0 0 0 3px rgba(255,210,77,.32),0 6px 0 rgba(132,78,136,.12),0 12px 20px rgba(66,45,80,.08);}
#screen-cards .sf-pack-owned.sf-colour-rush-pack>div small{color:#8a4dbc;}
#screen-cards .sf-empty-pack{min-height:170px;display:grid;place-items:center;text-align:center;align-content:center;gap:5px;padding:16px;border:3px dashed #e1cadc;border-radius:20px;background:rgba(255,255,255,.47);color:#856984;}
#screen-cards .sf-empty-pack img{width:72px;height:84px;object-fit:contain;opacity:.55;}.sf-empty-pack strong{font-size:.7rem;}.sf-empty-pack span{max-width:560px;font-size:.5rem;font-weight:800;}
#screen-cards .sf-earn-pack-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-top:14px;}
#screen-cards .sf-earn-pack-grid article{padding:14px;background:linear-gradient(180deg,#fffaf3,#fff2e9);}.sf-earn-pack-grid article strong{display:block;margin:4px 0;font-size:.64rem;}.sf-earn-pack-grid article p{margin:0;color:#92778f;font-size:.49rem;font-weight:800;line-height:1.45;}
#screen-cards .sf-shop-panel{margin-top:14px;padding:16px;background:linear-gradient(180deg,#fffaf4,#fff0e6);}.sf-shop-panel header{display:flex;justify-content:space-between;align-items:center;gap:18px;margin-bottom:12px;}.sf-shop-panel header span{display:block;margin-top:2px;color:#967894;font-size:.46rem;font-weight:800;}.sf-shop-panel header>b{padding:7px 10px;border:2px solid #fff;border-radius:11px;background:#ffe083;color:#704a16;box-shadow:0 3px 0 #b0771a;font-size:.58rem;}
#screen-cards .sf-shop-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;}.sf-shop-pack{display:grid;grid-template-columns:62px minmax(0,1fr) auto;align-items:center;gap:9px;padding:8px 9px;border:2px solid #eddde9;border-radius:15px;background:#fff;}.sf-shop-pack img{width:58px;height:70px;object-fit:contain;}.sf-shop-pack strong{display:block;color:#68476e;font-size:.55rem;}.sf-shop-pack small{color:#9b7a98;font-size:.44rem;font-weight:900;}.sf-shop-pack button{min-height:34px;padding:6px 10px;}

/* ---------- Rewards polish ---------- */
#screen-cards .album-reward-track{display:grid !important;grid-template-columns:repeat(6,minmax(0,1fr)) !important;gap:11px !important;padding-top:24px !important;}
#screen-cards .album-reward-line{display:none !important;}
#screen-cards .album-reward-step{min-height:205px !important;padding:20px 9px 10px !important;}
#screen-cards .completion-reward-copy{margin-top:15px !important;background:linear-gradient(120deg,#fff3a9,#ffddf1 48%,#e5ddff) !important;}

/* ---------- Colour Rush compact HUD ---------- */
#screen-map.active .daily-candy-track.daily-candy-compact{
  width:318px !important;
  background:
    radial-gradient(circle at 4% 0%,color-mix(in srgb,var(--daily-color,#ef3a5b) 20%,transparent),transparent 34%),
    linear-gradient(180deg,rgba(255,255,255,.98),rgba(255,244,251,.96)) !important;
  border-radius:16px !important;
}
#screen-map.active .daily-candy-compact .daily-track-copy strong{font-size:.59rem !important;}
#screen-map.active .daily-candy-compact[data-bonus="true"]{
  box-shadow:0 0 0 3px color-mix(in srgb,var(--daily-color,#ef3a5b) 15%,transparent),0 4px 0 rgba(112,77,105,.28),0 9px 19px rgba(55,39,62,.13) !important;
}
#screen-map.active .daily-candy-compact[data-bonus="true"] .daily-track-reward img{width:26px !important;height:28px !important;}
.daily-track-milestones{grid-template-columns:repeat(14,1fr) !important;}
.daily-milestone i{width:15px !important;height:15px !important;font-size:.38rem !important;}

@media(max-width:900px){
  #screen-cards .card-collection-tabs{grid-template-columns:repeat(4,minmax(118px,1fr)) !important;justify-content:start !important;}
  #screen-cards .sf-home-hero{grid-template-columns:220px minmax(0,1fr);gap:20px;padding:20px;}
  #screen-cards .sf-cover-wrap img{width:174px;height:260px;}
  #screen-cards .sf-dashboard-grid{grid-template-columns:1fr;}
  #screen-cards .sf-library-strip{grid-template-columns:1fr 1fr;}.sf-library-strip>div{grid-column:1/-1;}
  #screen-cards .sf-earn-pack-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
  #screen-cards .sf-shop-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
  #screen-cards .album-reward-track{grid-template-columns:repeat(4,minmax(0,1fr)) !important;}
}
@media(max-width:620px){
  #screen-cards .card-collection-topbar{grid-template-columns:48px minmax(0,1fr) 92px !important;padding:8px 10px !important;}
  #screen-cards .card-album-identity{grid-template-columns:42px minmax(0,1fr);gap:7px;}.card-album-cover-chip{width:33px !important;height:49px !important;border-radius:9px !important;}
  #screen-cards .card-album-progress-pill{width:92px !important;min-width:92px !important;}
  #screen-cards .card-collection-tabs{grid-template-columns:repeat(4,126px) !important;justify-content:start !important;overflow-x:auto !important;}
  #screen-cards .sf-home-hero{grid-template-columns:1fr;text-align:center;}.sf-cover-wrap img{width:151px;height:226px;}.sf-cover-wrap span{left:calc(50% - 105px);}.sf-home-copy>p{margin-inline:auto;}.sf-album-meta,.sf-primary-actions{justify-content:center;}.sf-progress-main{grid-template-columns:1fr;gap:6px;margin-inline:auto;width:100%;}.sf-progress-main>div{justify-content:center;}
  #screen-cards .sf-category-grid{grid-template-columns:1fr;}
  #screen-cards .sf-library-strip{grid-template-columns:1fr;}.sf-library-strip>div{grid-column:auto;}
  #screen-cards .sf-pack-owned{grid-template-columns:76px minmax(0,1fr) auto;}.sf-pack-owned img{width:70px;height:84px;}.sf-pack-owned>b{display:none;}.sf-pack-owned button{grid-column:2/-1;width:100%;}
  #screen-cards .sf-earn-pack-grid,.sf-shop-grid{grid-template-columns:1fr;}
  #screen-cards .album-reward-track{grid-template-columns:repeat(2,minmax(0,1fr)) !important;}
}