/* Same smoked body, optical rim and shallow control lenses as the RSVP drawer.
   Account details stay native text above one shared, demand-rendered canvas. */
.gift-modern {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  isolation: isolate;
  overflow: hidden;
  padding: calc(env(safe-area-inset-top) + 28px) 16px var(--chapter-bottom);
  background: #272b2b;
  color: #f5f5f7;
  --gift-muted: #efedf0;
  --gift-focus: #f7e8cf;
}
.gift-bg {
  position: absolute;
  inset: -42px;
  z-index: -2;
  width: calc(100% + 84px);
  height: calc(100% + 84px);
  object-fit: cover;
  object-position: 50% 78%;
  filter: saturate(108%) brightness(82%);
  pointer-events: none;
}
.gift-modern::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(180deg, rgb(12 12 16 / .28), rgb(12 12 16 / .18) 55%, rgb(12 12 16 / .34));
  pointer-events: none;
}
.gift-optics { position: absolute; left: -42px; top: -42px; z-index: 0; pointer-events: none; }
.gift-body { position: relative; z-index: 1; }
.gift-modern h2 {
  margin: 0 8px 12px;
  color: #f5f5f7;
  font-size: clamp(30px, calc(var(--chapter-height) * .043), 36px);
  line-height: 1.2;
  letter-spacing: -.035em;
  text-shadow: 0 2px 12px rgb(0 0 0 / .3);
}
.gift-lead { margin: 0 8px 28px; color: var(--gift-muted); font-size: 14px; line-height: 1.7; letter-spacing: -.01em; text-shadow: 0 1px 4px rgb(0 0 0 / .6); }
.gift-group {
  flex: none;
  overflow: hidden;
  border: 1px solid rgb(250 243 230 / .25);
  border-radius: 30px;
  background: rgb(2 2 3 / .58);
  box-shadow: inset 0 1px 0 rgb(255 250 239 / .22), inset 0 -1px 0 rgb(255 250 239 / .08), 0 12px 32px rgb(0 0 0 / .13);
  -webkit-backdrop-filter: blur(14px) saturate(145%);
  backdrop-filter: blur(14px) saturate(145%);
}
.gift-group + .gift-group { margin-top: 14px; }
.gift-toggle {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  width: 100%;
  min-height: 64px;
  padding: 16px 20px;
  border: 0;
  background: transparent;
  color: #f5f5f7;
  font: inherit;
  font-size: 16px;
  font-weight: 600;
  letter-spacing: -.02em;
  text-align: left;
  text-shadow: 0 1px 3px rgb(0 0 0 / .45);
  cursor: pointer;
  touch-action: manipulation;
}
.gift-toggle:active { background: rgb(255 250 239 / .06); }
.gift-chevron { width: 20px; height: 20px; flex: none; color: var(--gift-muted); transition: transform .45s cubic-bezier(.32,.72,0,1); }
.gift-group.is-open .gift-chevron { transform: rotate(180deg); }
.gift-panel { display: grid; grid-template-rows: 0fr; transition: grid-template-rows .5s cubic-bezier(.32,.72,0,1); }
.gift-group.is-open .gift-panel { grid-template-rows: 1fr; }
.gift-panel-inner { min-height: 0; overflow: hidden; opacity: 0; transform: translateY(-6px); visibility: hidden; transition: opacity .3s, transform .45s cubic-bezier(.32,.72,0,1), visibility 0s .5s; }
.gift-group.is-open .gift-panel-inner { opacity: 1; transform: none; visibility: visible; transition: opacity .35s .1s, transform .5s cubic-bezier(.32,.72,0,1), visibility 0s; }
.gift-list { list-style: none; margin: 0; padding: 0 18px 8px; }
.gift-row { display: grid; grid-template-columns: minmax(0,1fr) auto; grid-template-rows: auto auto; column-gap: 12px; align-items: center; min-height: 94px; padding: 12px 2px; border-top: 1px solid rgb(255 250 239 / .16); }
.gift-who { display: flex; align-items: baseline; gap: 8px; min-width: 0; color: #f5f5f7; font-size: 16px; letter-spacing: -.02em; }
.gift-role { flex: none; color: var(--gift-muted); font-size: 12px; }
.gift-who b { font-weight: 600; }
.gift-acct { display: flex; flex-direction: column; gap: 1px; min-width: 0; margin-top: 4px; line-height: 1.45; }
.gift-bank { color: var(--gift-muted); font-size: 12px; }
.gift-num { color: #fff; font-size: 16px; font-weight: 500; letter-spacing: .005em; font-variant-numeric: tabular-nums; white-space: nowrap; user-select: text; -webkit-user-select: text; }
.gift-copy {
  grid-column: 2;
  grid-row: 1 / 3;
  min-width: 60px;
  min-height: 44px;
  margin: 0;
  padding: 10px 14px;
  border: 1px solid rgb(255 246 228 / .3);
  border-radius: 24px;
  background: linear-gradient(160deg, rgb(255 252 242 / .12), rgb(255 249 235 / .045) 52%, rgb(255 249 235 / .08));
  box-shadow: inset 0 1px 0 rgb(255 253 245 / .2), inset 0 -1px 0 rgb(255 252 242 / .06);
  color: #fff9ef;
  font: inherit;
  font-size: 14px;
  font-weight: 500;
  text-shadow: 0 1px 3px rgb(0 0 0 / .45);
  cursor: pointer;
  touch-action: manipulation;
  transition: opacity 120ms;
}
.gift-copy:active { opacity: .75; }
.gift-modern :is(.gift-toggle,.gift-copy):focus-visible { outline: 2px solid var(--gift-focus); outline-offset: -5px; }
.gift-num::selection { background: #f7e8cf; color: #272b2b; }
.has-gift-webgl .gift-group { background: transparent; border-color: rgb(250 243 230 / .09); box-shadow: 0 12px 32px rgb(0 0 0 / .13); -webkit-backdrop-filter: none; backdrop-filter: none; }
.has-gift-webgl .gift-copy { background: transparent; border-color: rgb(255 250 239 / .12); box-shadow: none; }
@media (hover: hover) {
  .gift-toggle:hover { background: rgb(255 250 239 / .05); }
  .gift-copy:hover { color: #fff; border-color: rgb(255 250 239 / .38); }
}
html[data-short-viewport] .gift-lead { margin-bottom: 20px; }
html[data-short-viewport] .gift-row { min-height: 88px; }
@media (max-width: 350px) {
  .gift-toggle { padding-inline: 18px; }
  .gift-list { padding-inline: 16px; }
  .gift-row { column-gap: 10px; }
  .gift-who { gap: 6px; font-size: 15px; }
  .gift-num { font-size: 15px; letter-spacing: 0; }
  .gift-copy { min-width: 56px; padding-inline: 12px; }
}
@media (prefers-reduced-motion: reduce) { .gift-panel,.gift-panel-inner,.gift-chevron,.gift-copy { transition: none; } }
@media (prefers-reduced-transparency: reduce) {
  .gift-modern .gift-group { background: #29272b; -webkit-backdrop-filter: none; backdrop-filter: none; }
  .gift-modern .gift-copy { background: #45403b; }
  .gift-optics { display: none; }
}
@media (forced-colors: active) {
  .gift-modern,.gift-modern .gift-group { background: Canvas; color: CanvasText; box-shadow: none; }
  .gift-modern::before,.gift-bg,.gift-optics { display: none; }
  .gift-modern :is(h2,.gift-lead,.gift-toggle,.gift-chevron,.gift-who,.gift-role,.gift-bank,.gift-num) { color: CanvasText; text-shadow: none; }
  .gift-modern .gift-group { border: 1px solid CanvasText; -webkit-backdrop-filter: none; backdrop-filter: none; }
  .gift-row { border-color: CanvasText; }
  .gift-modern .gift-copy { background: ButtonFace; color: ButtonText; border: 1px solid ButtonText; box-shadow: none; text-shadow: none; }
  .gift-modern :is(.gift-toggle,.gift-copy):focus-visible { outline-color: Highlight; }
}