/* Tropical after-dark: lagoon, sunset and warm paper. All assets stay local. */
.portal-body {
  --lagoon: #073b3c;
  --night: #04272e;
  --deep: #071e28;
  --palm: #168c79;
  --aqua: #7fe1c4;
  --coral: #f17d64;
  --coral-light: #ffb186;
  --gold: #f4d094;
  --cream: #fff9e9;
  --card: #fffdf6;
  --card-ink: #163d40;
  --card-muted: #596e70;
  --card-line: #dce6df;
  --field: #f7f9f3;
  --faint: #eaf5eb;
  --white-06: #ffffff0f;
  --white-12: #ffffff1f;
  --white-25: #ffffff40;
  --gold-20: #f4d09433;
  --coral-20: #f17d6433;
  --shadow-deep: #001e2870;
  --shadow-soft: #073b3c14;
  background: var(--night);
  color: var(--cream);
  min-height: 100svh;
  isolation: isolate;
  overflow-x: clip;
}
.portal-body .simulation {
  position: relative;
  z-index: 5;
  padding: 5px 12px;
  background: var(--gold);
  font-size: 0.875rem;
  letter-spacing: 1.3px;
  color: var(--night);
}
.tropical-world { position: fixed; inset: 0; overflow: hidden; pointer-events: none; z-index: -1; background: radial-gradient(ellipse at 9% 48%, var(--lagoon), transparent 65%), linear-gradient(135deg, var(--deep), var(--lagoon) 55%, var(--night)); }
.sunset-glow { position: absolute; width: 650px; height: 650px; border-radius: 50%; right: -360px; top: -300px; background: radial-gradient(circle, var(--coral-20), transparent 68%); animation: sky-drift 20s ease-in-out infinite alternate; }
.sea-glow { position: absolute; width: 850px; height: 650px; bottom: -400px; left: -220px; background: radial-gradient(ellipse, var(--palm), transparent 68%); opacity: .5; animation: sky-drift 24s ease-in-out infinite alternate-reverse; }
.svg-library { position: absolute; overflow: hidden; pointer-events: none; }
.tropical-leaf { position: absolute; width: 350px; height: 580px; color: var(--palm); opacity: .27; transform-origin: bottom center; }
.leaf-top { right: -110px; top: -260px; rotate: 155deg; animation: palm-sway 14s ease-in-out infinite alternate; }
.leaf-bottom { left: -150px; bottom: -300px; rotate: 18deg; opacity: .28; animation: palm-sway 16s ease-in-out infinite alternate-reverse; }
.ocean { position: absolute; width: 180%; height: 500px; left: -40%; bottom: -430px; border-radius: 45%; background: var(--white-06); animation: ocean-drift 22s linear infinite alternate; }
.ocean-two { bottom: -445px; left: -20%; background: var(--gold-20); opacity: .35; animation-duration: 30s; animation-direction: alternate-reverse; }
.flower { position: absolute; color: var(--coral); opacity: .13; animation: flower-turn 65s linear infinite; }
.flower-one { width: 160px; height: 160px; top: 22%; left: -70px; }
.flower-two { width: 105px; height: 105px; bottom: 5%; right: -32px; animation-direction: reverse; color: var(--gold); }
.firefly { position: absolute; border-radius: 50%; width: 4px; height: 4px; background: var(--gold); box-shadow: 0 0 18px var(--gold); animation: firefly-float 8s ease-in-out infinite; }
.firefly-one { top: 18%; left: 35%; }.firefly-two { top: 68%; left: 8%; animation-delay: -3s; }.firefly-three { top: 75%; right: 8%; animation-delay: -5s; }
.hawaii-shell { max-width: 1260px; margin: auto; padding: 28px 50px 20px; }
.hawaii-header { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 34px; }
.club-brand { display: inline-flex; gap: 18px; align-items: center; color: var(--cream); text-decoration: none; }
.club-brand img { width: 100px; height: 58px; object-fit: contain; }
.club-brand>span { display: block; font-size: 0.875rem; letter-spacing: 2.4px; line-height: 1.8; padding-left: 18px; border-left: 1px solid var(--white-25); }
.club-brand small { display: block; font-size: 0.875rem; color: var(--aqua); letter-spacing: 3px; }
.icon { width: 22px; height: 22px; flex: 0 0 auto; stroke: currentColor; stroke-width: 1.6; fill: none; stroke-linecap: round; stroke-linejoin: round; }
.wifi-pill { display: flex; gap: 10px; align-items: center; padding: 9px 14px; border: 1px solid var(--white-12); border-radius: 30px; color: var(--cream); background: var(--white-06); font-size: 0.875rem; backdrop-filter: blur(8px); }
.wifi-pill .icon { color: var(--aqua); width: 17px; height: 17px; }.connection-dot { width: 5px; height: 5px; border-radius: 50%; background: var(--aqua); box-shadow: 0 0 10px var(--aqua); }
.hawaii-layout { display: grid; grid-template-columns: 1fr 1fr; gap: 65px; align-items: center; }
.hawaii-story { padding: 22px 0 20px; min-width: 0; }
.edition-label { display: flex; align-items: center; gap: 10px; color: var(--gold); font-size: 0.875rem; letter-spacing: 2.8px; font-weight: 500; }
.edition-label span { display: inline-block; height: 1px; width: 25px; background: var(--gold); }
.event-logo { display: block; object-fit: contain; width: min(100%, 420px); height: auto; aspect-ratio: 2.43; margin: 22px 0 32px; filter: drop-shadow(0 8px 20px var(--shadow-deep)); animation: logo-float 9s ease-in-out infinite; }
.hawaii-story h1 { font-family: Georgia, 'Times New Roman', serif; font-size: clamp(37px, 4vw, 55px); line-height: 1.14; letter-spacing: -2px; font-weight: 400; margin-bottom: 22px; }
.hawaii-story h1 em { font-style: italic; color: var(--coral-light); }
.hawaii-intro { font-size: 14px; line-height: 1.85; color: var(--aqua); max-width: 360px; margin-bottom: 26px; }
.event-moods { display: flex; flex-wrap: wrap; gap: 8px; }.event-moods span { font-size: 0.875rem; padding: 5px 11px; border-radius: 20px; border: 1px solid var(--white-12); color: var(--cream); }.event-moods span::before { content: '✦'; margin-right: 5px; font-size: 0.875rem; color: var(--gold); }
.island-line { margin-top: 40px; color: var(--aqua); opacity: .5; max-width: 390px; }.island-line svg { width: 100%; fill: none; stroke: currentColor; stroke-width: 1; }.island-line>span { font-size: 0.875rem; letter-spacing: 4px; }
.hawaii-card { position: relative; width: 100%; max-width: 500px; min-width: 0; background: var(--card); color: var(--card-ink); border-radius: 25px; padding: 28px 34px 22px; box-shadow: 0 25px 80px var(--shadow-deep), 0 0 0 1px var(--white-12); border-top: 3px solid var(--gold); animation: card-arrive .65s cubic-bezier(.2,.8,.2,1) both; }

.hawaii-card h2 { font-family: Georgia, 'Times New Roman', serif; font-size: 36px; letter-spacing: -1.2px; font-weight: 400; line-height: 1.13; margin-bottom: 13px; }.hawaii-card h2 em { color: var(--palm); }.hawaii-card .eyebrow { color: var(--palm); font-size: 0.875rem; letter-spacing: 2px; margin-bottom: 12px; }
.hawaii-card p { color: var(--card-muted); }.hawaii-card a { color: var(--lagoon); }.step-description { font-size: 0.875rem; line-height: 1.75; margin-bottom: 23px; max-width: 360px; }
.wizard-progress { display: flex; align-items: center; gap: 8px; margin-bottom: 27px; }.wizard-progress>span { display: flex; align-items: center; gap: 6px; font-size: 0.875rem; color: var(--card-muted); white-space: nowrap; }.wizard-progress b { display: grid; place-items: center; border: 1px solid var(--card-line); border-radius: 50%; width: 24px; height: 24px; font-size: 0.875rem; font-weight: 500; transition: background .25s; }.wizard-progress i { height: 1px; background: var(--card-line); flex: 1; }.wizard-progress .is-current { font-weight: 700; color: var(--lagoon); }.wizard-progress .is-current b { background: var(--lagoon); border-color: var(--lagoon); color: var(--cream); box-shadow: 0 0 0 3px var(--faint); }.wizard-progress .is-complete b { background: var(--faint); color: var(--palm); border-color: var(--faint); }
.wizard-step { animation: step-arrive .3s ease-out; }.wizard-step+.wizard-step { margin-top: 28px; }.wizard-enhanced .wizard-step+.wizard-step { margin-top: 0; }.tropical-field { margin-bottom: 17px; }.tropical-field>label { display: block; font-size: 0.875rem; font-weight: 600; margin-bottom: 7px; }.input-wrap { display: flex; align-items: center; position: relative; }.input-wrap>.icon { position: absolute; left: 15px; color: var(--palm); width: 19px; height: 19px; pointer-events: none; }.input-wrap input { min-height: 53px; border-radius: 12px; background: var(--field); border: 1px solid var(--card-line); padding: 14px 35px 14px 45px; font-size: 15px; transition: border-color .2s, box-shadow .2s, background .2s; }.input-wrap input::placeholder { color: var(--card-muted); opacity: .8; font-size: 0.875rem; }.input-wrap input:focus { outline: none; border-color: var(--palm); box-shadow: 0 0 0 3px var(--faint); background: var(--white); }.field-valid { position: absolute; right: 14px; color: var(--palm); font-size: 0.875rem; opacity: 0; transition: opacity .2s; }.is-valid .field-valid { opacity: 1; }.tropical-field>small { display: block; margin-top: 6px; font-size: 0.875rem; color: var(--card-muted); }
.hawaii-card .button { min-height: 51px; width: 100%; border-radius: 12px; background: linear-gradient(110deg, var(--lagoon), var(--palm)); color: var(--cream); border: 0; padding: 14px 19px; box-shadow: 0 7px 20px var(--shadow-soft); font-size: 0.875rem; position: relative; overflow: hidden; isolation: isolate; transition: transform .2s, box-shadow .2s; }.hawaii-card .button::before { content: ''; position: absolute; width: 80px; height: 180%; top: -40%; left: -90%; background: linear-gradient(90deg, transparent, var(--white-12), transparent); transform: rotate(20deg); transition: left .7s; pointer-events: none; }.hawaii-card .button:hover { transform: translateY(-2px); box-shadow: 0 10px 26px var(--shadow-soft); }.hawaii-card .button:hover::before { left: 120%; }.hawaii-card .button:active { transform: translateY(0); }.button>.icon { width: 19px; height: 19px; }.wizard-actions { display: flex; align-items: center; gap: 14px; margin-top: 24px; }.wizard-actions .button { flex: 1; }.wizard-back { flex: 0 0 auto; min-height: 48px; color: var(--card-muted); background: transparent; border: 0; padding: 8px 4px; font-size: 0.875rem; }.wizard-back span { margin-right: 5px; }.wizard-status { text-align: center; font-size: 0.875rem; min-height: 15px; margin: 12px 0 0; }
.boat-question { border: 0; padding: 0; margin: 0 0 22px; min-width: 0; }.boat-question legend { font-size: 0.875rem; font-weight: 600; margin-bottom: 12px; }.choice-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }.choice-card { position: relative; display: flex; flex-direction: column; gap: 12px; background: var(--field); border: 1px solid var(--card-line); border-radius: 13px; padding: 17px 13px; cursor: pointer; transition: border-color .2s, background .2s, transform .2s; overflow: hidden; }.choice-card:hover { transform: translateY(-2px); border-color: var(--palm); }.choice-card>input { position: absolute; opacity: 0; width: 1px; min-height: 1px; height: 1px; padding: 0; margin: 0; }.choice-picture { display: grid; place-items: center; background: var(--faint); width: 36px; height: 36px; border-radius: 11px; color: var(--palm); }.choice-picture .icon { width: 23px; height: 23px; }.choice-card strong { font-size: 0.875rem; font-weight: 600; display: block; }.choice-card small { display: block; font-size: 0.875rem; font-weight: 400; color: var(--card-muted); margin-top: 3px; }.choice-tick { position: absolute; top: 12px; right: 11px; border: 1px solid var(--card-line); width: 16px; height: 16px; display: grid; place-items: center; border-radius: 50%; font-size: 0.875rem; color: transparent; }.choice-card:has(input:checked) { border-color: var(--palm); background: var(--faint); box-shadow: 0 0 0 1px var(--palm); }.choice-card:has(input:checked) .choice-tick { color: var(--cream); background: var(--palm); border-color: var(--palm); }.choice-card:has(input:focus-visible) { outline: 3px solid var(--coral); outline-offset: 3px; }.choice-grid-compact .choice-card { padding: 15px 26px 15px 12px; }.choice-grid-compact .choice-card strong { font-size: 0.875rem; }.choice-grid-compact .choice-tick { right: 7px; top: 15px; width: 13px; height: 13px; }.question-hint { font-size: 0.875rem; margin: -4px 0 12px; }.boat-feedback { display: flex; gap: 12px; align-items: center; padding: 14px; border-radius: 12px; background: var(--faint); color: var(--palm); font-size: 0.875rem; }.boat-feedback small { display: block; color: var(--card-muted); font-size: 0.875rem; }.tropical-form:has(input[name=owns_boat][value=yes]:checked) .purchase-question { display: none; }
.consent-card { display: flex; gap: 11px; align-items: flex-start; padding: 15px 13px; border: 1px solid var(--card-line); background: var(--field); border-radius: 12px; margin-bottom: 12px; cursor: pointer; font-size: 0.875rem; font-weight: 400; line-height: 1.65; transition: background .2s, border-color .2s; }.consent-card input { width: 18px; height: 18px; min-height: 18px; margin: 2px 0; accent-color: var(--palm); }.consent-card:has(input:checked) { background: var(--faint); border-color: var(--palm); }.consent-card small { display: block; color: var(--card-muted); font-size: 0.875rem; margin-top: 6px; }.consent-optional>span { font-size: 0.875rem; font-weight: 600; }.consent-card .consent-details { font-size: 0.875rem; font-weight: 400; line-height: 1.65; }.consent-card .optional-tag { font-size: 0.875rem; letter-spacing: .7px; color: var(--palm); font-weight: 600; }.connection-note { display: flex; gap: 9px; align-items: center; color: var(--card-muted); font-size: 0.875rem; margin: 20px 0 0; }.connection-note .icon { color: var(--palm); width: 18px; height: 18px; }
.portal-privacy { border-top: 1px solid var(--card-line); padding-top: 17px; margin-top: 22px; display: flex; justify-content: center; align-items: center; gap: 7px; color: var(--card-muted); font-size: 0.875rem; }.portal-privacy>.icon { width: 13px; height: 13px; color: var(--palm); }.portal-privacy a { color: var(--lagoon); }
.hawaii-card .notice { border-radius: 13px; background: var(--faint); color: var(--card-ink); border-color: var(--card-line); font-size: 0.875rem; }.hawaii-card .advert { border-radius: 15px; background: var(--lagoon); }.hawaii-card #authorization-status { font-size: 0.875rem; line-height: 1.8; }.hawaii-card .success-mark { background: var(--faint); color: var(--palm); box-shadow: 0 0 0 12px var(--field); margin-top: 24px; }.hawaii-card .legal { font-size: 0.875rem; }.hawaii-card .stack .field>label { font-size: 0.875rem; }.hawaii-card .stack input:not([type=checkbox]) { font-size: 16px; border-radius: 12px; background: var(--field); }.hawaii-card .errorlist { margin-top: 5px; font-size: 0.875rem; }.wizard-step h2:focus { outline: none; }
@keyframes palm-sway { from { transform: rotate(-4deg); } to { transform: rotate(5deg); } }
@keyframes sky-drift { from { transform: translate3d(-20px, -15px, 0); opacity: .65; } to { transform: translate3d(40px, 30px, 0); opacity: 1; } }
@keyframes ocean-drift { from { transform: translate3d(-2%, 0, 0) rotate(-3deg); } to { transform: translate3d(8%, -30px, 0) rotate(3deg); } }
@keyframes flower-turn { to { transform: rotate(360deg); } }
@keyframes logo-float { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-5px); } }
@keyframes firefly-float { 0%,100% { opacity: .15; transform: translateY(0); } 50% { opacity: .8; transform: translateY(-20px); } }
@keyframes card-arrive { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: translateY(0); } }
@keyframes step-arrive { from { opacity: .1; transform: translateX(9px); } to { opacity: 1; transform: translateX(0); } }
@media(min-width: 1001px) { .hawaii-layout { min-height: calc(100svh - 220px); }.hawaii-card { justify-self: end; } }
@media(min-width: 1500px) { .hawaii-shell { padding-top: 45px; }.hawaii-layout { gap: 90px; }.hawaii-story h1 { font-size: 58px; } }
@media(max-width: 1000px) { .hawaii-shell { max-width: 650px; padding: 22px 30px 20px; }.hawaii-header { margin-bottom: 20px; }.club-brand img { width: 82px; height: 47px; }.club-brand>span { font-size: 0.875rem; padding-left: 12px; }.club-brand small { font-size: 0.875rem; }.hawaii-layout { grid-template-columns: 1fr; gap: 18px; }.hawaii-story { text-align: center; padding: 0; }.edition-label { justify-content: center; font-size: 0.875rem; letter-spacing: 2px; }.edition-label span { width: 15px; }.event-logo { width: 250px; margin: 12px auto 8px; }.hawaii-story h1,.event-moods,.island-line { display: none; }.hawaii-intro { max-width: 360px; margin: 0 auto; font-size: 0.875rem; line-height: 1.75; }.hawaii-card { max-width: 500px; justify-self: center; padding: 27px 32px 22px; }.leaf-top { right: -180px; opacity: .22; }.leaf-bottom { left: -240px; opacity: .2; }.flower-one { top: 16%; width: 100px; left: -50px; } }
@media(max-width: 480px) { .hawaii-shell { padding: max(14px, env(safe-area-inset-top)) 16px max(18px, env(safe-area-inset-bottom)); }.hawaii-header { margin-bottom: 16px; gap: 8px; }.club-brand { gap: 9px; }.club-brand img { width: 72px; height: 42px; }.club-brand>span { font-size: 0.875rem; letter-spacing: 1.2px; padding-left: 9px; }.club-brand small { font-size: 0.875rem; letter-spacing: 1.8px; }.wifi-pill { padding: 7px 9px; font-size: 0.875rem; gap: 6px; }.wifi-pill .icon { width: 14px; height: 14px; }.connection-dot { width: 4px; height: 4px; }.edition-label { font-size: 0.875rem; letter-spacing: 1.7px; }.event-logo { width: 222px; margin: 10px auto 7px; }.hawaii-intro { font-size: 0.875rem; max-width: 270px; }.hawaii-layout { gap: 17px; }.hawaii-card { padding: 22px 23px 19px; border-radius: 23px; }.wizard-progress { margin-bottom: 23px; }.hawaii-card h2 { font-size: 32px; }.step-description { font-size: 0.875rem; margin-bottom: 21px; }.input-wrap input { font-size: 16px; min-height: 52px; }.input-wrap input::placeholder { font-size: 0.875rem; }.wizard-actions { margin-top: 23px; }.portal-privacy { font-size: 0.875rem; padding-top: 14px; margin-top: 17px; }.choice-card { padding: 15px 10px; }.choice-card strong { font-size: 0.875rem; }.choice-card small { font-size: 0.875rem; }.choice-grid { gap: 9px; }.choice-grid-compact .choice-card strong { font-size: 0.875rem; }.consent-card { padding: 12px 10px; }.consent-card .consent-details { font-size: 0.875rem; }.connection-note { font-size: 0.875rem; } }
@media(max-width: 350px) { .hawaii-shell { padding-left: 10px; padding-right: 10px; }.club-brand>span { display: none; }.hawaii-card { padding-left: 18px; padding-right: 18px; }.hawaii-card h2 { font-size: 29px; }.wizard-progress>span { font-size: 0.875rem; } }
@media(prefers-reduced-motion: reduce) { .portal-body *, .portal-body *::before, .portal-body *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; } }

.connect-acceptance { font-size: 0.875rem; line-height: 1.8; margin: 20px 0 0; padding-top: 17px; border-top: 1px solid var(--card-line); }
.connect-acceptance strong { color: var(--card-ink); }
.connect-acceptance small { display: block; font-size: 0.875rem; margin-top: 5px; color: var(--card-muted); }
.hawaii-card .button.is-submitting { pointer-events: none; opacity: .7; cursor: wait; }

/* Mobile-first reading scale. Main copy is 16px; supporting text never drops
   below 14px at the default browser setting, including small-screen breakpoints. */
.portal-body {
  font-size: 1rem;
  line-height: 1.65;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}
.portal-body .simulation { font-size: 0.875rem; line-height: 1.5; letter-spacing: 0; padding: 8px 14px; }
.portal-body .club-brand>span,
.portal-body .club-brand small { font-size: 0.875rem; letter-spacing: .06em; }
.portal-body .wifi-pill { font-size: 0.875rem; line-height: 1.5; min-height: 44px; }
.portal-body .edition-label,
.portal-body .hawaii-card .eyebrow { font-size: 0.875rem; letter-spacing: .05em; line-height: 1.5; }
.portal-body .hawaii-intro,
.portal-body .step-description { font-size: 1rem; line-height: 1.65; max-width: 40ch; }
.portal-body .hawaii-card { max-width: 560px; }
.portal-body .hawaii-card h2 { font-size: clamp(2rem, 4vw, 2.5rem); line-height: 1.18; }
.portal-body #step-one-title { margin-bottom: 24px; }
.portal-body .tropical-field { margin-bottom: 24px; }
.portal-body .tropical-field>label,
.portal-body .hawaii-card .stack .field>label { font-size: 1rem; line-height: 1.5; margin-bottom: 9px; }
.portal-body .input-wrap input,
.portal-body .hawaii-card .stack input:not([type=checkbox]) { font-size: 1.125rem; line-height: 1.5; min-height: 60px; }
.portal-body .input-wrap input::placeholder { font-size: 1rem; opacity: 1; }
.portal-body .tropical-field>small,
.portal-body .wizard-status { font-size: 0.875rem; line-height: 1.6; margin-top: 10px; }
.portal-body .wizard-progress { gap: 7px; flex-wrap: wrap; }
.portal-body .wizard-progress>span { font-size: 0.875rem; gap: 6px; }
.portal-body .wizard-progress b { font-size: 0.875rem; width: 30px; height: 30px; }
.portal-body .wizard-progress i { min-width: 4px; }
.portal-body .hawaii-card .button { font-size: 1.0625rem; line-height: 1.5; min-height: 58px; padding: 16px; gap: 12px; }
.portal-body .button>.icon { width: 23px; height: 23px; }
.portal-body .wizard-back { font-size: 1rem; min-height: 48px; padding: 10px 8px; }
.portal-body .boat-question legend { font-size: 1.0625rem; line-height: 1.5; margin-bottom: 16px; }
.portal-body .choice-card { padding: 20px 15px; gap: 15px; }
.portal-body .choice-card strong,
.portal-body .choice-grid-compact .choice-card strong { font-size: 1rem; line-height: 1.45; padding-right: 8px; }
.portal-body .choice-card small { font-size: 0.875rem; line-height: 1.5; margin-top: 6px; }
.portal-body .choice-grid-compact .choice-card { padding: 18px 26px 18px 14px; min-height: 70px; }
.portal-body .choice-tick { width: 20px; height: 20px; font-size: 0.875rem; right: 12px; top: 12px; }
.portal-body .choice-grid-compact .choice-tick { right: 8px; top: 17px; width: 17px; height: 17px; }
.portal-body .question-hint,
.portal-body .boat-feedback { font-size: 1rem; line-height: 1.6; }
.portal-body .boat-feedback small { font-size: 0.875rem; line-height: 1.6; }
.portal-body .consent-card { gap: 13px; padding: 18px 16px; }
.portal-body .consent-card,
.portal-body .consent-optional>span,
.portal-body .consent-card .consent-details,
.portal-body .connection-note,
.portal-body .connect-acceptance { font-size: 1rem; line-height: 1.7; }
.portal-body .consent-card .consent-details { font-weight: 400; margin-top: 10px; }
.portal-body .consent-card small,
.portal-body .consent-card .optional-tag,
.portal-body .connect-acceptance small { font-size: 0.875rem; line-height: 1.6; letter-spacing: 0; }
.portal-body .consent-card input { width: 24px; height: 24px; min-height: 24px; }
.portal-body .connection-note { align-items: flex-start; gap: 10px; }
.portal-body .connection-note .icon { margin-top: 4px; }
.portal-body .portal-privacy { font-size: 0.875rem; line-height: 1.7; text-align: left; align-items: flex-start; }
.portal-body .portal-privacy>.icon { width: 18px; height: 18px; margin-top: 3px; }
.portal-body .hawaii-card .notice,
.portal-body .hawaii-card #authorization-status,
.portal-body .hawaii-card .legal,
.portal-body .hawaii-card .muted,
.portal-body .hawaii-card>p { font-size: 1rem; line-height: 1.75; }
.portal-body .hawaii-card .errorlist,
.portal-body .hawaii-card .stack small { font-size: 0.875rem; line-height: 1.6; }
.portal-body .event-moods span,
.portal-body .island-line>span { font-size: 0.875rem; line-height: 1.5; letter-spacing: .03em; }
@media(max-width: 1000px) {
  .portal-body .hawaii-shell { max-width: 650px; }
  .portal-body .hawaii-intro { max-width: 30ch; }
  .portal-body .edition-label { display: none; }
  .portal-body .hawaii-header { margin-bottom: 14px; }
  .portal-body .event-logo { margin-top: 8px; }
}
@media(max-width: 600px) {
  .portal-body .club-brand>span { display: none; }
  .portal-body .club-brand img { width: 90px; height: 52px; }
  .portal-body .wifi-pill { padding: 9px 12px; gap: 7px; }
  .portal-body .hawaii-card { padding: 24px 20px; }
  .portal-body .wizard-actions { flex-wrap: wrap; gap: 8px; }
  .portal-body .wizard-actions .button { flex-basis: 100%; }
  .portal-body .wizard-back { order: 2; flex-basis: 100%; text-align: center; }
  .portal-body .choice-grid { grid-template-columns: 1fr; gap: 12px; }
  .portal-body .choice-card { flex-direction: row; align-items: center; gap: 14px; min-height: 90px; padding: 20px 38px 20px 16px; }
  .portal-body .choice-card>span:not(.choice-tick) { min-width: 0; }
  .portal-body .choice-grid-compact .choice-card { padding: 18px 38px 18px 16px; min-height: 64px; }
  .portal-body .choice-picture { flex-shrink: 0; width: 42px; height: 42px; }
  .portal-body .choice-tick,
  .portal-body .choice-grid-compact .choice-tick { top: 50%; transform: translateY(-50%); right: 13px; width: 20px; height: 20px; }
  .portal-body .portal-privacy { margin-top: 24px; padding-top: 20px; }
}
@media(max-width: 400px) {
  .portal-body .wizard-progress { gap: 4px; }
  .portal-body .wizard-progress>span { gap: 4px; }
  .portal-body .wizard-progress b { width: 28px; height: 28px; }
  .portal-body .hawaii-card { padding-left: 18px; padding-right: 18px; }
}

/* Keep the final state focused on the confirmation itself. */
.hawaii-card:has(.success-content) {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 350px;
  text-align: center;
}
.success-content { width: 100%; padding: 16px 0; }
.hawaii-card .success-content .success-mark { margin: 0 auto 28px; }
.success-content h2 { margin-bottom: 12px; }
.portal-body .success-content p:last-child { margin-bottom: 0; color: var(--card-muted); }
.hawaii-card:has(.success-content) .portal-privacy { display: none; }

/* The required acceptance stays readable without competing with the action. */
.portal-body .connect-acceptance {
  margin: 18px 3px 0;
  padding: 0;
  border: 0;
  color: var(--card-muted);
  font-size: .875rem;
  line-height: 1.55;
  text-align: center;
}
.portal-body .connect-acceptance strong { color: inherit; font-weight: 500; }
.portal-body .connect-acceptance a { color: var(--card-muted); text-decoration-color: var(--palm); }
.hawaii-card:has(.tropical-form) .portal-privacy { display: none; }

.wizard-enhanced .wizard-step:not([hidden]) { animation: wizard-enter-forward .48s cubic-bezier(.2,.75,.25,1) both; }
.wizard-enhanced[data-direction="back"] .wizard-step:not([hidden]) { animation-name: wizard-enter-back; }
.wizard-progress>span b { transition: background .32s, border-color .32s, color .32s, transform .32s; }
.wizard-progress .is-current b { transform: scale(1.08); }
.wizard-progress i { transition: background .32s; }
.wizard-progress .is-complete + i { background: var(--palm); }
@keyframes wizard-enter-forward {
  from { opacity: 0; transform: translateX(22px) translateY(8px) scale(.985); }
  to { opacity: 1; transform: translateX(0) translateY(0) scale(1); }
}
@keyframes wizard-enter-back {
  from { opacity: 0; transform: translateX(-22px) translateY(8px) scale(.985); }
  to { opacity: 1; transform: translateX(0) translateY(0) scale(1); }
}