/* Weekend Meetup: immersive evening palette for the existing signup flow. */
:root{color-scheme:dark;--ink:#14263a;--green:#ff6b61;--line:#27394d;--muted:#647488;--white:#fff;background:#0b1929;color:#f5f7fb}
body{background:#0b1929;color:#f5f7fb}
.siteHeader{padding-top:20px;padding-bottom:20px}
.brandGlyph{color:#ff756b}
.brandGlyph{display:inline-flex;align-items:center;justify-content:center;width:42px;height:36px;flex:0 0 auto;padding:0;font-size:0;letter-spacing:0}
.brandGlyph svg{display:block;width:42px;height:36px;overflow:visible}
.brandName{color:#f7f8fb}
.brandName>span{color:#b7c2cf}
.languageControl svg{stroke:#d0d9e3}
.languageControl select{color:#f4f6f9;background:#14243a;border:1px solid #435166;border-radius:999px;padding:10px 14px}
.hero h1{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Noto Sans",Arial,sans-serif;font-size:clamp(40px,4.6vw,60px);font-weight:700;letter-spacing:-.045em;line-height:1.12}
html[lang=zh] h1,html[lang=zh-Hant] h1,html[lang=ja] h1,html[lang=ko] h1{font-family:inherit;font-weight:700;letter-spacing:-.035em;line-height:1.25}
.eyebrow{color:#ff8d82}
.lead{color:#c0cbd8}
.primary{background:#ff6b61;border-color:#ff6b61;color:#101f30;border-radius:14px;font-weight:700;box-shadow:0 8px 22px #ff6b612b}
.primary:hover{background:#ff8278;border-color:#ff8278}
.benefits{color:#b6c2d0}
.benefits li>span:first-child{color:#ff9a8f}
.videoFrame{box-shadow:0 24px 54px #0005;border:1px solid #ffffff20}
.videoFrame:after{background:linear-gradient(0deg,#07132178,transparent 35%)}
.videoBadge{background:#101f30dc;border-color:#ffffff42;color:#fff;border-radius:999px;backdrop-filter:blur(10px)}
.videoToggle{background:#f6f8faee;color:#14263a;border-radius:999px;font-weight:600}
.registration{border-color:#ffffff1a}
.registrationIntro h2{font-family:inherit;font-weight:700;color:#f4f6f9;letter-spacing:-.035em}
.howSteps li{border-color:#ffffff20}
.howSteps li>span{color:#a8b5c4}
.howSteps p{color:#e8edf3}
.signupCard{background:#fff;border:1px solid #ffffff;border-radius:22px;box-shadow:0 18px 48px #0004;color:#14263a}
.stepIndicator{color:#718096}
.stepIndicator .active{color:#d84e49}
.stepIndicator .active b{background:#ff6b61;border-color:#ff6b61;color:#132337}
.stepDivider{background:#e6eaf0}
.sceneCard{background:#f5f7fa;border-color:#e4e8ee;border-radius:15px;color:#172a40}
.sceneCard svg{stroke:#39546f}
.sceneCard i{border-color:#c2cbd6}
.sceneOption input:checked+.sceneCard{background:#fff0ee;border-color:#ff6b61;color:#8e342f}
.sceneOption input:checked+.sceneCard svg{stroke:#d94d46}
.sceneOption input:checked+.sceneCard i{background:#ff6b61;border-color:#ff6b61;box-shadow:inset 0 0 0 3px #fff0ee}
.sceneOption:hover .sceneCard{border-color:#ff9188}
.fields label{color:#344b64}
.fields input{border-color:#d6dde6;color:#14263a;border-radius:11px}
.fields input:focus{border-color:#ff6b61;outline-color:#ffc1bb}
.textButton{color:#465f79}
.privacy{border-color:#e9edf2;color:#768397}
.successMark{background:#fff0ee;color:#c24a43}
.successPanel p{color:#65758a}
.siteFooter{border-color:#ffffff20;color:#aab6c4}
:focus-visible{outline-color:#ff9b91}

@media(max-width:650px){
  body{padding-bottom:env(safe-area-inset-bottom)}
  .siteHeader{padding:14px 16px 12px;gap:10px}
  .wordmark{gap:9px}
  .brandGlyph{width:38px;height:34px}
  .brandGlyph svg{width:38px;height:34px}
  .brandName{font-size:15px}
  .languageControl{gap:5px}
  .languageControl svg{width:17px;height:17px}
  .languageControl select{max-width:150px;padding:8px 11px;font-size:13px}
  .hero{display:flex;flex-direction:column;align-items:stretch;gap:15px;padding:14px 16px 0}
  .heroCopy{width:100%}
  .eyebrow{font-size:13px;line-height:1.4;margin:0 0 7px}
  .hero h1{font-size:clamp(29px,8vw,35px);line-height:1.2;margin:0 0 7px;letter-spacing:-.035em}
  html[lang=zh] .hero h1,html[lang=zh-Hant] .hero h1,html[lang=ja] .hero h1,html[lang=ko] .hero h1{font-size:clamp(29px,8vw,35px);line-height:1.3;letter-spacing:-.025em}
  .lead{font-size:15px;line-height:1.55;margin:0;max-width:100%;color:#c4cfdb}
  .heroAction,.benefits{display:none}
  .videoFrame{width:100%;max-width:none;aspect-ratio:1.32;border-radius:20px}
  .videoFrame video{object-position:center 42%}
  .videoBadge{inset-inline-start:13px;top:13px;padding:7px 11px;font-size:12px}
  .videoToggle{inset-inline-start:auto;inset-inline-end:13px;bottom:13px;padding:9px 13px;font-size:13px}
  .registration{position:relative;z-index:2;display:block;margin-top:-22px;padding:0 16px 28px;border:0;scroll-margin-top:18px}
  .registrationIntro{display:none}
  .signupCard{width:100%;padding:18px 16px 17px;border-radius:22px;box-shadow:0 18px 44px #0005}
  .stepIndicator{font-size:12px;gap:10px;margin-bottom:16px}
  .stepIndicator>span:not(.stepDivider){gap:7px}
  .stepIndicator b{width:21px;height:21px;font-size:11px}
  h3{font-size:19px;line-height:1.4;margin-bottom:5px}
  .muted{font-size:13px;line-height:1.5;margin-bottom:14px}
  .sceneGrid{gap:9px;margin-bottom:14px}
  .sceneCard{min-height:68px;padding:12px 11px;flex-direction:row;justify-content:flex-start;gap:10px;font-size:14px;line-height:1.35}
  .sceneCard svg{width:24px;height:24px;flex-shrink:0}
  .sceneCard i{inset-inline-end:10px;top:10px;width:13px;height:13px}
  .sceneOption input:checked+.sceneCard{box-shadow:0 4px 13px #ff6b6118}
  .primary{min-height:50px;border-radius:13px}
  .fields{grid-template-columns:1fr 1fr;gap:14px 11px;margin:19px 0}
  .fields label{font-size:14px;gap:7px}
  .fields input{min-height:48px}
  .wide{grid-column:1/-1}
  .siteFooter{margin:0 16px;display:flex;flex-direction:row;justify-content:space-between;gap:12px;padding:18px 0 22px;font-size:12px}
  .privacy{font-size:12px}
}
@media(max-width:360px){
  .siteHeader{padding-inline:13px}
  .brandName{font-size:14px}
  .languageControl select{max-width:125px}
  .hero{padding-inline:13px}
  .registration{padding-inline:13px}
  .sceneCard{padding-inline:9px;gap:8px;font-size:13px}
}

/* The four event choices use real scene photography, matching the approved mockup. */
.sceneCard{align-items:stretch;justify-content:flex-start;flex-direction:column;gap:9px;min-height:160px;padding:11px 11px 10px;font-size:15px;font-weight:650}
.sceneImage{display:block;width:100%;height:98px;object-fit:cover;border-radius:10px;background:#dbe2ea}
.sceneCard>span{padding-inline:3px}
.sceneCard i{inset-inline-end:12px;top:12px;width:22px;height:22px;background:#ffffffed;border-color:#ffffff}
.sceneOption input:checked+.sceneCard i{background:#ff6b61;border-color:#ff6b61;box-shadow:inset 0 0 0 4px #fff0ee}
.sceneOption input:checked+.sceneCard i:after{content:"";position:absolute;inset-inline-start:7px;top:4px;width:5px;height:9px;border:solid #fff;border-width:0 2px 2px 0;transform:rotate(45deg)}
@media(max-width:650px){
  .sceneCard{flex-direction:column;align-items:stretch;gap:7px;min-height:110px;padding:8px 8px 9px;font-size:14px}
  .sceneImage{height:62px;border-radius:9px}
  .sceneCard>span{padding-inline:2px}
  .sceneCard i{inset-inline-end:9px;top:9px;width:19px;height:19px}
  .sceneOption input:checked+.sceneCard i{box-shadow:inset 0 0 0 3px #fff0ee}
  .sceneOption input:checked+.sceneCard i:after{inset-inline-start:6px;top:3px;width:4px;height:7px}
}
@media(max-width:360px){
  .sceneCard{min-height:104px;padding:7px;font-size:13px}
  .sceneImage{height:56px}
}

/* Add the warm ambient light from the selected evening-gathering direction. */
html{background-color:#091625}
body{background-color:#091625;background-image:radial-gradient(ellipse 82% 27rem at 92% 2rem,rgba(196,102,87,.22),transparent 72%),radial-gradient(ellipse 76% 32rem at 4% 27rem,rgba(44,102,140,.21),transparent 72%),radial-gradient(ellipse 85% 38rem at 78% 78%,rgba(31,63,95,.2),transparent 72%),linear-gradient(155deg,#091625 0%,#12243a 43%,#0a1727 100%)}
.videoFrame{box-shadow:0 24px 54px #0005,0 0 48px #f28a7414}
@media(max-width:650px){
  body{background-image:radial-gradient(ellipse 120% 24rem at 92% 1rem,rgba(196,102,87,.22),transparent 72%),radial-gradient(ellipse 105% 29rem at 0% 25rem,rgba(44,102,140,.22),transparent 72%),linear-gradient(155deg,#091625 0%,#12243a 44%,#0a1727 100%)}
}

/* Brighter welcoming palette with a photographic, retina-ready group mark. */
:root{color-scheme:light;background:#f4f4ff;color:#17263f;--ink:#17263f;--green:#e85d69;--line:#e4e6f0;--muted:#67748b}
html{background:#f4f4ff}
body{color:#17263f;background-color:#f4f4ff;background-image:radial-gradient(ellipse 82% 29rem at 94% 0%,rgba(255,183,160,.62),transparent 72%),radial-gradient(ellipse 78% 33rem at 3% 25rem,rgba(164,192,250,.66),transparent 72%),radial-gradient(ellipse 80% 38rem at 82% 76%,rgba(232,206,247,.48),transparent 72%),linear-gradient(145deg,#f2f2ff 0%,#fff4ef 54%,#f0f5ff 100%)}
.siteHeader{color:#17263f}
.brandGlyph{display:inline-flex;align-items:center;justify-content:center;width:46px;height:46px;flex:0 0 auto;padding:3px;font-size:0;letter-spacing:0;border-radius:50%;background:linear-gradient(140deg,#ff8c7a,#e44f74);box-shadow:0 5px 15px #d956662b}
.brandGlyph img{display:block;width:100%;height:100%;border-radius:50%;object-fit:cover;object-position:center 34%}
.brandName{color:#182940}
.brandName>span{color:#5d6d85}
.languageControl svg{stroke:#485b74}
.languageControl select{color:#263954;background:#ffffffcc;border-color:#dce0eb;box-shadow:0 3px 12px #2639540a}
.hero h1{color:#17263f}
.eyebrow{color:#d94f62}
.lead{color:#52627b}
.benefits{color:#56677f}
.benefits li>span:first-child{color:#dd5364}
.registration{border-color:#dfe4ee}
.registrationIntro h2{color:#17263f}
.howSteps li{border-color:#dce2ed}
.howSteps li>span{color:#818da1}
.howSteps p{color:#31435b}
.siteFooter{border-color:#dce2ed;color:#66748a}
.videoFrame{box-shadow:0 24px 52px #1b315020,0 0 38px #ef8b7c24}
.videoBadge{background:#fffffff0;color:#293b54;border-color:#ffffff}
.videoToggle{background:#fffffff2;color:#253750}
.signupCard{box-shadow:0 18px 48px #29395714;border-color:#ffffff}
@media(max-width:650px){
  .brandGlyph{width:40px;height:40px;padding:2px}
  body{background-image:radial-gradient(ellipse 122% 25rem at 94% 0%,rgba(255,183,160,.65),transparent 72%),radial-gradient(ellipse 112% 29rem at 0% 24rem,rgba(164,192,250,.7),transparent 72%),linear-gradient(145deg,#f2f2ff 0%,#fff4ef 55%,#f0f5ff 100%)}
}
