* { box-sizing: border-box; }
body { margin: 0; font-family: -apple-system, BlinkMacSystemFont, "Microsoft YaHei", sans-serif; color: #1a1a1a; }
.invitation { width: 100%; max-width: 750px; margin: auto; text-align: center; }
.hero { position: relative; width: 100%; aspect-ratio: 750 / 631; background: url('./static/H5_BG.png') center / cover no-repeat; }
.logo { position: absolute; top: 53.57%; left: 50%; transform: translateX(-50%); width: 18.67%; aspect-ratio: 1; border-radius: 17%; object-fit: cover; }
h1 { position: relative; margin: -2.93% 0 0; font-size: clamp(21px, 5.6vw, 42px); line-height: 1; }
p { margin: 3.2% 0 0; color: #808080; font-size: clamp(14px, 3.73vw, 28px); }
p + p { margin-top: 2.13%; }
button { display: block; width: calc(100% - 8.53%); height: clamp(44px, 11.73vw, 88px); margin: 16.53% auto 0; border: 0; border-radius: 4px; background: #3c6df8; color: white; font-size: clamp(16px, 4.27vw, 32px); cursor: pointer; }
[hidden] { display: none !important; }
.hint { position: fixed; z-index: 2; top: 15px; right: 12px; width: 160px; padding: 10px; border-radius: 6px; background: #3c6df8; color: white; font-size: 14px; }
.hint::before { content: ''; position: absolute; top: -12px; right: 10px; border: 7px solid transparent; border-bottom-color: #3c6df8; }
.error { margin: 24px; font-size: 14px; }

.apple-extras { width: calc(100% - 8.53%); max-width: 686px; margin: 24px auto 40px; text-align: left; }
.refresh-row { display: flex; align-items: center; gap: 10px; }
.apple-extras button { width: auto; height: auto; margin: 0; font-family: inherit; cursor: pointer; }
.apple-extras .refresh-button { flex: none; padding: 8px 12px; border: 0; border-radius: 5px; background: #edf2ff; color: #3c6df8; font-size: 13px; }
.refresh-row { justify-content: space-between; margin-top: 14px; color: #808080; font-size: 13px; }
.apple-extras button:disabled { opacity: .45; cursor: not-allowed; }
.apple-extras .notice, .apple-extras .apple-message { margin: 12px 0 0; color: #808080; font-size: 12px; line-height: 1.5; }
.apple-extras dialog { width: min(90vw, 380px); padding: 24px; border: 0; border-radius: 10px; text-align: left; box-shadow: 0 20px 60px #0003; }
.apple-extras dialog::backdrop { background: #0008; }
.apple-extras dialog h2 { margin: 0 0 10px; font-size: 18px; }
.apple-extras dialog p { margin: 0; font-size: 14px; line-height: 1.5; }
.dialog-actions { display: flex; flex-direction: column; gap: 8px; margin-top: 20px; }
.apple-extras .primary-button { width: 100%; min-height: 44px; background: #3c6df8; color: #fff; font-size: 15px; }
.apple-extras .secondary-button { width: 100%; min-height: 44px; padding: 10px; border: 1px solid #c9c9ce; border-radius: 4px; background: #fff; color: #666; font-size: 14px; }