/* A gift floats over the profile; its claim panel shares the existing dialog behavior.
   All color and type values come from the page's design tokens. */
.gift-scene-scrim { background: color-mix(in srgb, var(--bg-deep) 48%, transparent); }
.sheet.gift-scene {
  bottom: max(8px, var(--safe-bottom));
  width: min(calc(100% - 24px), 414px);
  max-height: calc(100% - var(--safe-top) - max(8px, var(--safe-bottom)) - 12px);
  border-radius: 0;
  background: none;
  box-shadow: none;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  scrollbar-width: none;
}
.gift-scene::-webkit-scrollbar { display: none; }
.gift-scene > .grabber { display: none; }
.gift-scene > .sheet-close {
  position: sticky; z-index: 3; top: 0; margin: 0 0 -32px auto;
  background: var(--glass-bg); color: var(--label); box-shadow: var(--glass-shadow);
  -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px);
}
.gift-scene .sheet-body { padding: var(--s4) var(--s1) var(--s2); }
.gift-scene .sheet-swap { animation: none; }
.gift-stage { position: relative; isolation: isolate; padding: var(--s6) var(--s6) var(--s5); perspective: 900px; }
.gift-aura {
  position: absolute; z-index: -1; inset: 10% -10% 2%; pointer-events: none;
  border-radius: 50%; background: radial-gradient(ellipse, var(--glow), transparent 66%);
  filter: blur(16px); opacity: .85;
  animation: gift-aura-breathe 4s ease-in-out infinite alternate;
}
.gift-pack, .gift-prize-card {
  position: relative; width: min(100%, 266px); margin-inline: auto;
  border: 1px solid rgba(229,237,255,.42); border-radius: var(--r-group);
  background: linear-gradient(142deg, rgba(239,246,255,.18), transparent 28%, transparent 67%, rgba(195,211,244,.1)), radial-gradient(ellipse at 20% 0%, color-mix(in srgb, var(--accent) 20%, transparent), transparent 72%), var(--surface);
  box-shadow: var(--glass-shadow), 0 0 36px color-mix(in srgb, var(--glow) 42%, transparent);
  overflow: hidden; color: var(--label);
}
.gift-pack {
  width: min(100%, 222px); min-height: 240px; padding: var(--s6);
  display: flex; flex-direction: column; justify-content: center; align-items: center; gap: var(--s6);
  transform: rotate(-5deg); animation: gift-pack-arrive 700ms var(--spring) both;
}
.gift-pack::before, .gift-pack::after {
  content: ''; position: absolute; left: var(--s3); right: var(--s3); height: 8px;
  background: repeating-linear-gradient(90deg, var(--glass-edge) 0 2px, transparent 2px 5px);
}
.gift-pack::before { top: var(--s2); }
.gift-pack::after { bottom: var(--s2); }
.gift-pack-seal {
  display: grid; place-items: center; width: 100px; height: 100px; border-radius: 50%;
  background: var(--fill); border: 1px solid var(--glass-edge); color: var(--label);
}
.gift-pack-caption { font: var(--t-footnote); color: var(--label-2); }
.gift-preview-label, .gift-card-eyebrow { display: block; font: var(--t-caption); color: var(--label-2); }
.gift-preview-label { margin-bottom: var(--s2); }
.gift-card-float { animation: gift-card-float 4s ease-in-out 850ms infinite; }
.gift-prize-card {
  min-height: 264px; padding: var(--s5); transform-origin: 50% 80%;
  animation: gift-card-reveal 800ms var(--spring) both;
}
.gift-card-art {
  position: relative; width: 100px; height: 100px; margin: var(--s3) auto;
  display: grid; place-items: center; border-radius: var(--r-inner);
  background: radial-gradient(ellipse, var(--fill-2), transparent 75%);
}
.gift-card-art > svg { filter: drop-shadow(0 0 16px var(--glow)); }
.gift-card-art img { width: 118px; height: 110px; object-fit: contain; filter: drop-shadow(0 10px 12px var(--scrim)); }
.gift-prize-card h2 { margin-top: var(--s1); font: var(--t-title2); outline: none; }
.gift-prize-card .gift-card-detail { margin-top: var(--s2); font: var(--t-footnote); color: var(--label-2); }
.gift-card-glint {
  position: absolute; inset: -70% -130%; z-index: 1; pointer-events: none;
  background: linear-gradient(110deg, transparent 44%, color-mix(in srgb, var(--label) 24%, transparent) 50%, transparent 56%);
  transform: translateX(-40%); animation: gift-card-shimmer 5s ease-in-out 500ms infinite;
}
.gift-sparkles { position: absolute; inset: 0; z-index: -1; pointer-events: none; }
.gift-sparkles i {
  position: absolute; width: 6px; height: 6px; border-radius: 1px; background: var(--label);
  box-shadow: 0 0 12px var(--glow); opacity: .5; transform: rotate(45deg);
  animation: gift-sparkle 3.2s ease-in-out infinite;
}
.gift-sparkles i:nth-child(1) { top: 16%; left: 6%; }
.gift-sparkles i:nth-child(2) { top: 35%; right: 3%; animation-delay: .7s; width: 4px; height: 4px; }
.gift-sparkles i:nth-child(3) { bottom: 20%; left: 9%; animation-delay: 1.4s; width: 4px; height: 4px; }
.gift-sparkles i:nth-child(4) { bottom: 11%; right: 12%; animation-delay: .3s; }
.gift-sparkles i:nth-child(5) { top: 4%; right: 22%; animation-delay: 1s; width: 3px; height: 3px; }
.gift-sparkles i:nth-child(6) { top: 62%; left: 1%; animation-delay: 1.9s; width: 3px; height: 3px; }
.gift-claim-panel {
  position: relative; padding: var(--s5); border: 1px solid var(--glass-edge); border-radius: var(--r-sheet);
  background: var(--sheet-bg); box-shadow: var(--glass-shadow); text-align: center;
  -webkit-backdrop-filter: blur(24px) saturate(140%); backdrop-filter: blur(24px) saturate(140%);
  animation: gift-panel-arrive 500ms var(--ease) both;
}
.gift-claim-panel h2 { margin-top: 0; }
.gift-claim-panel > p { margin-top: var(--s2); color: var(--label-2); }
.gift-claim-panel #gift-claim-note { margin-top: 0; font: var(--t-subhead); }
.gift-scene .gift-claim-panel .group { margin-top: var(--s4); }
/* Keep the focus ring on the rounded field shell, including its validation message. */
.gift-scene .gift-claim-panel .group:has(#g-email:focus-visible) { box-shadow: inset 0 0 0 1.5px var(--label-3); }
.gift-scene .gift-claim-panel .row:has(#g-email:focus-visible) { box-shadow: none; }
.gift-scene .gift-claim-panel .btn-block { margin-top: var(--s4); }
.gift-scene .gift-claim-panel .btn-block + .btn-block { margin-top: var(--s1); }
.gift-scene .gift-claim-panel .fine { margin-top: var(--s3); font: var(--t-caption); }
.gift-scene #gift-error:empty { display: none; }
.gift-receipt { margin-top: var(--s10); }
.gift-receipt-mark {
  width: 60px; height: 60px; margin: 0 auto var(--s4); border-radius: 50%;
  display: grid; place-items: center; background: var(--fill-2); color: var(--label);
}
.gift-scene.is-opening .gift-pack { animation: gift-pack-open 620ms var(--ease) both; }
.gift-scene.is-opening .gift-aura { animation: gift-aura-open 620ms var(--ease) both; }
.gift-scene.is-claiming .gift-stage { animation: gift-card-away 360ms var(--ease-in) both; }
.gift-scene.is-claiming .gift-claim-panel { animation: gift-panel-away 300ms var(--ease-in) both; }

@keyframes gift-pack-arrive { from { opacity: 0; transform: translateY(20px) rotate(-9deg) scale(.94); } to { opacity: 1; transform: rotate(-5deg); } }
@keyframes gift-pack-open { 0% { transform: rotate(-5deg); } 30% { transform: rotate(3deg) scale(1.025); } 60% { opacity: 1; transform: rotate(-3deg) scale(1.06); } 100% { opacity: 0; transform: translateY(-22px) rotate(5deg) scale(1.12); } }
@keyframes gift-aura-open { from { opacity: .6; transform: scale(.9); } to { opacity: 1; transform: scale(1.25); } }
@keyframes gift-card-reveal { from { opacity: 0; transform: translateY(24px) rotateY(-30deg) rotate(-7deg) scale(.78); } to { opacity: 1; transform: none; } }
@keyframes gift-panel-arrive { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
@keyframes gift-card-float { 0%, 100% { transform: translateY(0) rotate(-1deg); } 50% { transform: translateY(-7px) rotate(1deg); } }
@keyframes gift-card-shimmer { 0%, 15% { transform: translateX(-40%); opacity: 0; } 22% { opacity: 1; } 45%, 100% { transform: translateX(40%); opacity: 0; } }
@keyframes gift-aura-breathe { from { opacity: .65; transform: scale(.95); } to { opacity: .95; transform: scale(1.05); } }
@keyframes gift-sparkle { 0%, 100% { opacity: .15; transform: translateY(0) rotate(45deg) scale(.7); } 50% { opacity: .7; transform: translateY(-5px) rotate(45deg) scale(1); } }
@keyframes gift-card-away { to { opacity: 0; transform: translateY(-28px) scale(.93); } }
@keyframes gift-panel-away { to { opacity: 0; transform: translateY(14px) scale(.97); } }

/* The full-size scene can scroll when a keyboard or text enlargement reduces space. */
@media (max-height: 690px) {
  .gift-stage { padding-block: var(--s3); }
  .gift-pack { min-height: 186px; }
  .gift-prize-card { min-height: 224px; padding: var(--s4); }
  .gift-card-art { height: 76px; margin-block: var(--s2); }
  .gift-card-art img { width: 64px; height: 76px; }
}
@media (prefers-reduced-motion: reduce) {
  .gift-scene *, .gift-scene *::before, .gift-scene *::after { animation: none !important; transition: none !important; }
  .gift-scene .gift-pack, .gift-scene .gift-prize-card { transform: none; }
  .gift-card-glint { display: none; }
  .gift-sparkles { opacity: .35; }
}
@media (prefers-reduced-transparency: reduce) {
  .gift-claim-panel { background: var(--surface); -webkit-backdrop-filter: none; backdrop-filter: none; }
}
/* Hoodie gift: the recipient picks a color before claiming. */
.gift-claim-label { font: var(--t-footnote); color: var(--label-2); margin: 0 0 8px 4px; text-align: left; }
.gift-color { margin-bottom: 12px; }
.gift-color button { color: var(--label-2); }
.gift-color button[aria-checked="true"] { color: var(--label); }
.gift-claim-panel #g-color-err { margin: -4px 4px 10px; text-align: left; }