.registration-email { color: #45515e; min-width: 0; }
.registration-email-row { display: flex; align-items: center; gap: 8px; min-height: 48px; padding: 0 12px; border: 1px solid #dce3ed; border-radius: 16px; background: #ffffffeb; box-shadow: 0 6px 18px #1828480d; }
.registration-email-row:focus-within { border-color: #8ba7df; box-shadow: 0 0 0 3px #1456f014; }
.registration-email-row input { min-width: 0; width: 0; flex: 1; height: 46px; border: 0; outline: 0; background: transparent; font: inherit; font-size: 14px; color: inherit; }
.registration-email-row select { max-width: 145px; border: 0; outline-offset: 3px; background: transparent; font: inherit; font-size: 13px; color: inherit; padding: 8px 2px; }
.registration-email-row > span { color: #8e9bb0; font-size: 13px; }
.registration-email p { margin: 8px 1px 0; font-size: 11px; line-height: 1.8; color: #76859a; overflow-wrap: anywhere; }
.registration-email .is-error, .registration-gift .is-error { color: #c73352; }
.registration-email-row :disabled { opacity: .55; }
.registration-gift { --gift-ink: #25324b; --gift-muted: #78849a; box-sizing: border-box; position: fixed; inset: 0; margin: auto; width: min(440px, calc(100vw - 32px)); max-height: calc(100dvh - 40px); overflow-y: auto; padding: 36px 30px 25px; border: 1px solid #fff; border-radius: 28px; color: var(--gift-ink); background: radial-gradient(ellipse at 15% 5%, #fbe1e6, transparent 52%), radial-gradient(ellipse at 95% 80%, #e7efff, transparent 55%), #fffafc; box-shadow: 0 28px 100px #17223a3d; text-align: center; font-family: 'PingFang SC', 'Microsoft YaHei', sans-serif; animation: gift-enter .3s ease-out; }
.registration-gift::backdrop { background: #18233965; backdrop-filter: blur(5px); }
.registration-gift-close { position: absolute; top: 13px; right: 15px; width: 30px; height: 30px; border: 0; border-radius: 50%; background: #ffffff91; color: var(--gift-muted); font-size: 22px; line-height: 1; cursor: pointer; }
.registration-gift-tag { color: #b65b72; font-size: 11px; letter-spacing: 2px; font-weight: 600; }
.registration-gift h2 { margin: 17px 0 10px; font-size: 25px; line-height: 1.4; font-weight: 600; letter-spacing: -.7px; }
.registration-gift > p { font-size: 12px; line-height: 1.8; color: var(--gift-muted); }
.registration-gift-open { position: relative; display: flex; flex-direction: column; align-items: center; width: 100%; margin: 13px 0 20px; padding: 0; border: 0; background: none; color: inherit; cursor: pointer; }
.registration-gift-open:focus-visible, .registration-gift-close:focus-visible { outline: 3px solid #8ba7df; outline-offset: 4px; }
.registration-gift-art { position: relative; display: block; width: 220px; height: 195px; isolation: isolate; }
.registration-gift-art:before { content: ''; position: absolute; inset: 8px; border: 1px dashed #e9cbd6; border-radius: 50%; background: radial-gradient(circle, #fff9, transparent 68%); z-index: -1; }
.registration-gift-art:after { content: ''; position: absolute; width: 115px; height: 14px; left: 55px; bottom: 15px; border-radius: 50%; background: #bd64712b; filter: blur(8px); }
.registration-gift-art i { position: absolute; display: block; }
.gift-box { left: 48px; top: 82px; width: 126px; height: 91px; background: linear-gradient(125deg, #e993a8, #c6647e); border-radius: 4px 4px 13px 13px; box-shadow: inset -18px 0 #87374e14, inset 0 -2px #b3526b; transform: rotate(-5deg); }
.gift-lid { left: 39px; top: 67px; width: 143px; height: 30px; border-radius: 7px; background: linear-gradient(115deg, #f3b3c3, #d98199); box-shadow: 0 5px 8px #a8435f26; transform: rotate(-5deg); transition: transform .5s ease; }
.gift-ribbon { left: 97px; top: 68px; width: 23px; height: 106px; border-radius: 0 0 4px 4px; background: linear-gradient(90deg, #f4dac1, #fff0db 50%, #ecc7a7); transform: rotate(-5deg); }
.gift-loop { top: 35px; width: 48px; height: 35px; border: 10px solid #eed3b7; border-radius: 50% 50% 5px 50%; }
.gift-loop.left { left: 65px; transform: rotate(15deg); }
.gift-loop.right { left: 105px; transform: rotate(75deg); }
.registration-gift-action { padding: 11px 27px; border: 1px solid #ba5c75; border-radius: 12px; background: #b95c76; color: #fff; font-size: 13px; font-weight: 600; box-shadow: 0 5px 16px #ae506224; }
.registration-gift-open:hover:not(:disabled) .gift-lid { transform: translateY(-5px) rotate(-9deg); }
.registration-gift-open:disabled { cursor: wait; opacity: .65; }
.registration-gift-range { font-size: 12px; color: var(--gift-muted); }
.registration-gift-range strong { margin-left: 4px; color: #b34d69; font: 500 24px/1.5 Bahnschrift, sans-serif; letter-spacing: -.6px; }
.registration-gift-range > span { display: block; margin-top: 4px; font-size: 11px; }
.registration-gift .registration-gift-status { min-height: 21px; margin: 13px 0 5px; font-size: 11px; }
.registration-gift .registration-gift-note { padding-top: 15px; margin-top: 0; border-top: 1px solid #e8dfe8; font-size: 10px; }
.registration-gift.is-claimed .gift-lid { transform: translateY(-24px) rotate(-14deg); }
.registration-gift.is-claimed .registration-gift-range strong { font-size: 34px; }
.dark .registration-email { color: #e0e7f4; }
.dark .registration-email-row { background: #ffffff14; border-color: #ffffff1f; }
.dark .registration-email-row select option { color: #e0e7f4; background: #182335; }
.dark .registration-gift { --gift-ink: #e6eaf4; --gift-muted: #aab4ca; background: radial-gradient(ellipse at 10% 0, #572d47, transparent 60%), #1b2538; border-color: #ffffff24; }
.dark .registration-gift-tag, .dark .registration-gift-range strong { color: #efb0c0; }
.dark .registration-gift-close { background: #ffffff10; }
.dark .registration-gift-art:before { border-color: #e9cbd632; background: radial-gradient(circle, #ffffff0a, transparent 68%); }
.dark .registration-gift .registration-gift-note { border-color: #ffffff1f; }
@keyframes gift-enter { from { opacity: 0; transform: translateY(10px) scale(.98); } to { opacity: 1; transform: none; } }
@media (max-width: 420px) { .registration-gift { padding: 32px 20px 21px; } .registration-gift h2 { font-size: 23px; } .registration-email-row { gap: 5px; padding: 0 9px; } .registration-email-row select { max-width: 126px; } }
@media (prefers-reduced-motion: reduce) { .registration-gift { animation: none; } .gift-lid { transition: none; } }
