/* Seasonal drops (catalog.js SEASONS) and the decorations that come with them (js/season.js) */

/* ---------- Thanksgiving pieces ---------- */
/* Harvest Moon background: a big low moon over rolling fields at dusk */
.pbg-harvest{background-image:
  radial-gradient(circle at 72% 46%,#fff4d6 0,#ffd58a 6%,#f59e0b 10.5%,rgba(245,158,11,.35) 11%,rgba(245,158,11,0) 24%),
  radial-gradient(120% 60% at 50% 100%,#3b1d08 0 38%,transparent 38.5%),
  radial-gradient(90% 40% at 15% 100%,#2a1305 0 45%,transparent 45.5%),
  linear-gradient(180deg,#1a0b1f 0,#4a1a1a 34%,#9a3b12 58%,#d97706 72%,#2a1305 72.4%,#160a03 100%)}
.pbg-harvest:before{content:"";position:absolute;inset:0;z-index:-1;background:repeating-linear-gradient(100deg,transparent 0 22px,rgba(0,0,0,.18) 22px 24px);-webkit-mask:linear-gradient(180deg,transparent 74%,#000 76%);mask:linear-gradient(180deg,transparent 74%,#000 76%)}
.pbg-harvest:after{content:"";position:absolute;left:6%;bottom:22%;width:34px;height:46px;z-index:-1;opacity:.85;
  background:radial-gradient(ellipse 50% 32% at 50% 82%,#160a03 60%,transparent 62%),linear-gradient(90deg,transparent 46%,#160a03 46% 54%,transparent 54%),radial-gradient(circle at 50% 30%,#160a03 30%,transparent 31%);animation:harvestSway 6s ease-in-out infinite}
@keyframes harvestSway{0%,100%{transform:rotate(-2deg)}50%{transform:rotate(2deg)}}

/* Autumn Wreath frame: warm leaves turning slowly around your photo */
.pfr-autumn:before{inset:-2px;background:conic-gradient(from 0deg,#f59e0b,#b91c1c 14%,#ea580c 28%,#ca8a04 42%,#7c2d12 56%,#f97316 70%,#dc2626 84%,#f59e0b);animation:spin 9s linear infinite;box-shadow:0 0 12px rgba(245,158,11,.45)}

/* Harvest name: amber to ember, gently shimmering */
.pnm-harvest{background:linear-gradient(90deg,#fde68a,#f59e0b,#ea580c,#f59e0b,#fde68a) 0 0/220% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 0 8px rgba(245,158,11,.45));animation:shim 5s linear infinite}

/* Thankful ’26 badge */
.pb-thankful i{background:linear-gradient(135deg,#f59e0b,#b45309)}

/* ---------- the harvest scene (Season.scene) ---------- */
.ssn-scene{display:block;width:100%;height:100%}

/* ---------- Home during Thanksgiving ---------- */
.h14-ssn{margin-top:14px}
.ssn-card{all:unset;cursor:pointer;box-sizing:border-box;position:relative;overflow:hidden;display:block;width:100%;min-height:172px;border-radius:24px;isolation:isolate;
  background:#120601;border:1px solid rgba(251,146,60,.28);box-shadow:0 22px 44px -28px rgba(234,88,12,.9);transition:transform .15s}
.ssn-card:active{transform:scale(.985)}
.ssn-card>.ssn-scene{position:absolute;inset:0;z-index:-2}
.ssn-card::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(18,6,1,.92) 0%,rgba(18,6,1,.72) 42%,rgba(18,6,1,0) 72%),linear-gradient(0deg,rgba(18,6,1,.75),transparent 46%)}
.ssn-card>canvas.pfx{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:0;opacity:.8}
.ssn-body{position:relative;z-index:1;display:flex;flex-direction:column;align-items:flex-start;gap:3px;padding:16px 16px 14px}
.ssn-tag{display:inline-flex;align-items:center;gap:6px;height:26px;padding:0 4px 0 9px;border-radius:99px;background:rgba(0,0,0,.42);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1px solid rgba(251,191,36,.3);
  font-size:11.5px;font-weight:850;letter-spacing:.06em;text-transform:uppercase;color:#fde68a}
.ssn-tag svg{width:13px;height:13px;fill:#f59e0b}
.ssn-tag em{font-style:normal;margin-left:2px;height:18px;line-height:18px;padding:0 7px;border-radius:99px;background:rgba(251,191,36,.18);color:#fff;letter-spacing:.02em;text-transform:none;font-weight:750}
.ssn-ti{margin-top:8px;font:850 24px/1.05 ui-rounded,"SF Pro Rounded",-apple-system,system-ui,sans-serif;letter-spacing:-.025em;color:#fff;text-shadow:0 2px 14px rgba(0,0,0,.5)}
.ssn-sub{font-size:13px;font-weight:600;color:rgba(255,232,200,.78)}
.ssn-ft{display:flex;align-items:center;gap:16px;margin-top:14px}
.ssn-go{flex:none;height:36px;line-height:36px;padding:0 16px;border-radius:99px;background:#fff;color:#1c0a02;font-size:13.5px;font-weight:800;box-shadow:0 8px 20px -10px rgba(0,0,0,.8)}
/* the little piece previews */
.ssn-pcs{display:flex;align-items:center}
.ssn-pc{position:relative;flex:none;display:grid;place-items:center;width:34px;height:34px;border-radius:11px;margin-right:-6px;overflow:hidden;font-style:normal;box-shadow:0 0 0 2.5px #1a0803,0 6px 12px -6px #000}
.ssn-pc:nth-child(1){transform:rotate(-6deg)}.ssn-pc:nth-child(2){transform:rotate(3deg)}.ssn-pc:nth-child(3){transform:rotate(-3deg)}.ssn-pc:nth-child(4){transform:rotate(6deg)}
.ssn-pc.nm{background:#2a1206}.ssn-pc.bg{background-size:cover}
.ssn-pc.fr b{width:22px;height:22px;border-radius:50%;background:radial-gradient(circle at 50% 38%,#fff 0 18%,transparent 19%),radial-gradient(ellipse 60% 40% at 50% 92%,#fff 0 70%,transparent 72%),#5b6cf0;
  box-shadow:0 0 0 2.5px #1a0803,0 0 0 5px #f59e0b,0 0 10px rgba(245,158,11,.7)}
.ssn-pc.fr{background:conic-gradient(from 0deg,#f59e0b,#b91c1c,#ea580c,#ca8a04,#f59e0b)}
.ssn-pc.fr b{box-shadow:0 0 0 2px #1a0803}
.ssn-pc.nm b{font-size:15px;font-weight:900}
.ssn-pc.bd{background:linear-gradient(135deg,#fbbf24,#b45309)}
.ssn-pc.bd svg{width:22px;height:22px;fill:#fff7ed;display:block}
/* wide cards: keep the whole scene (moon included) on the right and let the sky run out to the left */
@media (min-width:700px){
  .ssn-card{background:linear-gradient(180deg,#170a1d 0%,#4a1715 42%,#a63c14 70%,#5c2209 86%,#120601 100%)}
  .ssn-card>.ssn-scene{left:auto;right:0;width:auto;height:100%;aspect-ratio:2/1;-webkit-mask:linear-gradient(90deg,transparent,#000 35%);mask:linear-gradient(90deg,transparent,#000 35%)}
  .ssn-card::before{background:linear-gradient(90deg,rgba(18,6,1,.85) 0%,rgba(18,6,1,.4) 50%,rgba(18,6,1,0) 75%)}
}
@media (min-width:1100px){.h14-ssn{margin-top:0}.ssn-card{min-height:190px}.ssn-ti{font-size:28px}.ssn-body{padding:20px 22px 18px}}
.h12-ban canvas.pfx.ssn-fx{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:1;opacity:.75}
@media (prefers-reduced-motion:reduce){.pfr-autumn:before,.pnm-harvest,.pbg-harvest:after{animation:none}.ssn-card canvas.pfx,.h12-ban canvas.pfx.ssn-fx{display:none}}