.photo-option video{display:block;width:100%;height:100%;object-fit:fill;pointer-events:none}.click-hint{z-index:3;border-radius:24px}.click-hint svg{width:100%;height:100%;overflow:visible;pointer-events:none}.tap-hand{fill:#ffffff66;stroke:#ffffffe0;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;animation:cursor-tap 1.5s ease-in-out infinite}.tap-ring{fill:none;stroke:#ffffff70;stroke-width:5;transform-origin:45px 18px;animation:tap-ripple 1.5s ease-out infinite}@keyframes cursor-tap{0%,65%,100%{transform:translate(0,0)}30%,45%{transform:translate(0,-5px)}}@keyframes tap-ripple{0%,15%{opacity:0;transform:scale(.45)}35%{opacity:.8}70%,100%{opacity:0;transform:scale(1.15)}}@media(prefers-reduced-motion:reduce){.tap-hand,.tap-ring{animation:none}.tap-ring{opacity:.4}}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:#1b1d21}body{font-family:Arial,"Microsoft YaHei",sans-serif}button{font:inherit;-webkit-tap-highlight-color:transparent}button:disabled{cursor:default}.viewport{min-height:100dvh;display:flex;align-items:center;justify-content:center;overflow:hidden}.frame{position:relative;flex:none;overflow:hidden}.stage{position:absolute;left:0;top:0;width:880px;transform-origin:top left;isolation:isolate}.backdrop{position:absolute;inset:0;width:100%;height:100%;display:block;pointer-events:none;user-select:none}.controls{position:absolute;inset:0}.tap{position:absolute;border:0;background:transparent;color:transparent;cursor:pointer;padding:0;touch-action:manipulation;border-radius:22px}.tap:focus-visible,.photo-option:focus-visible,.radio-option:focus-visible{outline:6px solid #6e6f71;outline-offset:6px;z-index:2}.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.radio-option{position:absolute;border:3px solid transparent;border-radius:19px;background:transparent;padding:0;cursor:pointer}.radio-option[aria-checked=true]{border-color:#7d7e80}.radio-option .radio-circle{display:none;position:absolute;right:39px;top:27px;width:57px;height:57px;border:4px solid #737476;border-radius:50%;background:#ffffff}.radio-option[aria-checked=true] .radio-circle{display:block}.radio-circle:after{content:"";position:absolute;inset:6px;border-radius:50%;background:#5c5d5f}.submit-face{background:#565759;color:#ffffff;font-size:38px}.submit-face:disabled{opacity:0}.submit-face.busy{opacity:1}.spinner{display:block;width:29px;height:29px;margin:auto;border:4px solid #ffffff70;border-right-color:white;border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.photo-option{position:absolute;border:0;padding:0;overflow:hidden;background:#d6d6d4;border-radius:28px;cursor:pointer;outline:4px solid transparent;outline-offset:-2px}.photo-option img{display:block;width:100%;height:100%;object-fit:fill;pointer-events:none}.photo-option[aria-pressed=true]{outline-color:#87888a}.disabled-mask{border-radius:60px;background:#b2b2b080;cursor:not-allowed}.progress-track{position:absolute;height:30px;background:#f5f5f3;border-radius:30px;overflow:hidden}.progress-fill{height:100%;width:0;background:linear-gradient(90deg,#949597,#b1b1af);border-radius:30px;transition:width .06s linear}.plain-screen{position:absolute;inset:0;background:linear-gradient(#dbdbd9,#d8d8d6 47%,#e5e5e3);color:#1f2125}.plain-title{margin:30px 0 0;text-align:center;font-size:46px;font-weight:900;font-style:italic}.plain-center{position:absolute;left:110px;right:110px;top:500px;text-align:center}.plain-center h1{font-size:46px;line-height:1.4;margin:0 0 32px}.plain-center p{font-size:30px;line-height:1.8;margin:0}.plain-button{position:absolute;left:140px;right:140px;bottom:125px;height:100px;border:0;border-radius:56px;background:#24262a;color:white;font-size:36px;cursor:pointer}.plain-button:focus-visible{outline:6px solid #6e6f71;outline-offset:6px}.secondary-end{bottom:250px;background:transparent;border:3px solid #27292d;color:#27292d}.scrim{position:absolute;inset:0;background:#00020677;display:flex;justify-content:center;align-items:center;z-index:20}.dialog{background:white;border-radius:24px;padding:40px;width:710px;color:#292b2f;box-shadow:0 12px 50px #00020633}.dialog h2{font-size:40px;margin:0 0 26px}.dialog p{font-size:29px;line-height:1.65}.dialog button{width:100%;font-size:32px;min-height:84px;background:#595a5c;color:white;border:0;border-radius:16px;cursor:pointer}.dialog button+button{margin-top:18px;background:#f0f0ee;color:#292b2f}.dialog button:focus-visible{outline:5px solid #6e6f71}.menu{position:absolute;right:36px;top:110px;width:300px;padding:10px;background:white;box-shadow:0 10px 30px #00020644;border-radius:15px;z-index:12}.menu button{display:block;width:100%;border:0;padding:22px 12px;background:white;color:#282a2e;font-size:30px;text-align:center;cursor:pointer}.menu button+button{border-top:1px solid #dfdfdd}.menu button:focus-visible{outline:4px solid #6e6f71}.nojs{position:fixed;bottom:20px;left:20px;right:20px;padding:12px;background:#ffffff;color:#111317;z-index:100;text-align:center}@media(prefers-reduced-motion:reduce){.spinner{animation-duration:1.5s}.progress-fill{transition:none}}
.safari-launch{z-index:4;background:#ffffff;border-radius:35px;overflow:hidden}.safari-launch svg,.safari-placeholder-icon svg{display:block;width:100%;height:100%}.safari-placeholder-icon{position:absolute}.plain-center .preview-note{margin-top:36px;color:#656668;font-size:24px}

:root{color-scheme:dark;--ink:#f8f8f6;--muted:#ccccca;--accent:#b8b8b6;--night:radial-gradient(ellipse at 88% 5%,#393b3f88,transparent 44%),radial-gradient(ellipse at 3% 85%,#2d2f3388,transparent 48%),linear-gradient(145deg,#17191d,#17191d 65%,#191b1f)}
html,body{background:#17191d;color:var(--ink)}
.stage{background:var(--night)}
.backdrop{filter:grayscale(1) invert(1) brightness(.87) contrast(1.6) sepia(.75) saturate(2.8) hue-rotate(220deg);mix-blend-mode:screen}
.controls{z-index:2}
.stage[data-page=welcome] .backdrop{height:1500px;object-fit:cover;object-position:50% 30%;filter:brightness(.78) saturate(.85);mix-blend-mode:normal;mask-image:linear-gradient(#000206 0%,#000206 55%,transparent 98%)}
.welcome-copy{position:absolute;z-index:1;margin:0;color:var(--ink)}
.welcome-copy h1{font-size:64px;line-height:1.25;margin:0 0 40px;font-weight:700;letter-spacing:-2px}
.welcome-copy p{font-size:36px;margin:0;color:#dbdbd9}
.tap-label{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;pointer-events:none}
.tap.primary-face,.plain-button{background:linear-gradient(125deg,#a5a6a8,#828385);border:2px solid #c9c9c763;color:#ffffff;box-shadow:0 12px 38px #999a9c36,inset 0 1px 0 #ffffff1f;font-size:38px;font-weight:600}
.tap.secondary-face{background:linear-gradient(135deg,#27292d,#1b1d21);border:2px solid #88898b;color:#e4e4e2;font-size:38px}
.tap.pill-face{border-radius:60px}
.primary-face:hover,.plain-button:hover{filter:brightness(1.12)}
.tap:focus-visible,.photo-option:focus-visible,.radio-option:focus-visible,.plain-button:focus-visible,.dialog button:focus-visible{outline-color:#dddddb}
.tap.native-close,.tap.native-more{color:#efefed;background:transparent;font-weight:300;font-size:60px;border:0}
.tap.native-more{font-size:32px;letter-spacing:5px}
.form-panel{position:absolute;background:linear-gradient(160deg,#27292d,#1c1e22 62%,#1f2125);border:2px solid #515254;border-radius:24px;box-shadow:0 25px 80px #00020677}
.native-progress{position:absolute;background:linear-gradient(90deg,#b5b5b3,#e2e2e0);border-radius:8px;box-shadow:0 0 25px #bbbbb958}
.form-step,.form-title,.form-question,.form-privacy-copy{position:absolute;margin:0}
.form-step{font-size:30px;line-height:45px;color:#c4c4c2}
.form-title{font-size:46px;line-height:64px;font-weight:700;color:#f8f8f6}
.form-question{font-size:34px;line-height:60px;color:#cdcdcb}
.form-privacy-copy{font-size:27px;line-height:38px;color:#bdbdbb}
.tap.privacy-link{color:#e4e4e2;font-size:28px;font-weight:600}
.radio-option{background:#191b1f;border:3px solid #494b4f;color:#f0f0ee;text-align:left}
.radio-label{position:absolute;left:32px;top:0;line-height:112px;font-size:38px}
.radio-option[aria-checked=true]{border-color:#bbbbb9;background:#333539;box-shadow:0 0 30px #9c9d9f29}
.radio-option .radio-circle{display:block;border-color:#868789;background:#1c1e22}
.radio-option .radio-circle:after{display:none;background:#c5c5c3}
.radio-option[aria-checked=true] .radio-circle{border-color:#dbdbd9}
.radio-option[aria-checked=true] .radio-circle:after{display:block}
.submit-face:disabled{opacity:1;background:#333539;color:#a2a3a5;border-color:#494b4f;box-shadow:none}
.submit-face.busy{background:linear-gradient(125deg,#a5a6a8,#828385);color:#ffffff}
.success-mark{position:absolute;border-radius:50%;background:linear-gradient(140deg,#bcbcba,#8c8d8f);color:#ffffff;font-size:98px;text-align:center;line-height:140px;font-weight:700;box-shadow:0 0 85px #a0a1a350}
.success-title,.success-subtitle{position:absolute;margin:0;text-align:center}
.success-title{font-size:55px;line-height:90px;color:#f8f8f6}
.success-subtitle{font-size:42px;line-height:70px;color:#cececc}
.photo-option{background:#24262a;outline:4px solid #7f8082;box-shadow:0 8px 24px #00020655}
.photo-option[aria-pressed=true]{outline-color:#c4c4c2;box-shadow:0 0 30px #afafad66}
.photo-option img{filter:none;mix-blend-mode:normal}
.tap.disabled-mask{background:#323438;border-color:#494a4c;color:#9e9fa1;box-shadow:none}
.progress-track{z-index:3;background:#26282c;box-shadow:inset 0 0 0 2px #4c4e52}
.progress-fill{background:linear-gradient(90deg,#98999b,#b8b8b6);box-shadow:0 0 25px #aeaeac80}
.plain-screen{background:var(--night);color:var(--ink)}
.plain-title{color:#c6c6c4;text-shadow:0 0 36px #97989a55}
.plain-center p{color:#d0d0ce}
.plain-center .preview-note{color:#b7b7b5}
.secondary-end{background:#222428;border-color:#828385;color:#e8e8e6;box-shadow:none}
.scrim{background:#17191db8;backdrop-filter:blur(8px)}
.dialog{background:#24262a;color:#f8f8f6;border:2px solid #868789;box-shadow:0 25px 100px #00020688}
.dialog p{color:#d8d8d6}
.dialog button{background:linear-gradient(125deg,#a5a6a8,#828385);color:#ffffff}
.menu{background:#24262a;border:2px solid #747577;box-shadow:0 20px 65px #00020688}
.menu button{background:#24262a;color:#f4f4f2}
.menu button+button{border-top-color:#47494d}
.safari-launch{box-shadow:0 0 50px #a1a2a43b;background:#ffffff}
.nojs{background:#27292d;color:#f2f2f0;border:1px solid #8a8b8d}

.gate-scene{position:absolute;inset:0;pointer-events:none;overflow:hidden;background:radial-gradient(ellipse at 95% 20%,#80818344,transparent 20%),radial-gradient(ellipse at 3% 74%,#35373b5c,transparent 35%)}
.gate-scene::before,.gate-scene::after{content:"♥";position:absolute;color:#e5e5e348;font-size:240px;line-height:1;filter:blur(24px);transform:rotate(-25deg);right:-30px;top:200px}
.gate-scene::after{font-size:150px;right:650px;top:1230px;color:#bebebc33;transform:rotate(15deg)}
.gate-heading{position:absolute;top:32px;left:55px;width:770px;text-align:center}
.gate-brand{font-size:60px;font-weight:900;font-style:italic;line-height:1.35;letter-spacing:1px;text-shadow:0 0 32px #c2c2c077;color:#f4f4f2}
.gate-brand::before,.gate-brand::after{content:"⌁";display:inline-block;margin:0 45px;font-size:57px;color:#bcbcba84;font-weight:400;vertical-align:middle}
.gate-subtitle{font-size:29px;line-height:1.5;color:#e6e6e4;margin:12px 0 0}
.gate-card-stack{position:absolute;left:110px;top:275px;width:675px;height:1110px;border:3px solid #cececc;border-radius:40px;background:linear-gradient(160deg,#24262a,#1a1c20 80%);transform:rotate(2deg);box-shadow:0 25px 80px #00020633}
.gate-card-stack::before,.gate-card-stack::after{content:"";position:absolute;inset:-12px;border:3px solid #b8b8b6;border-radius:40px;transform:rotate(-7deg);z-index:-1}
.gate-card-stack::after{inset:-15px;transform:rotate(5deg);border-color:#9c9d9f}
.gate-card-title,.gate-question,.gate-preference-title,.gate-progress-title,.gate-progress-sub,.gate-photo-caption,.gate-guide-action{position:absolute;margin:0;color:#f7f7f5}
.gate-card-title{font-size:29px;font-weight:900;font-style:italic;letter-spacing:1px;line-height:1.3;color:#e0e0de;max-width:400px}
.gate-question{font-size:39px;font-weight:500;line-height:1.7;text-wrap:pretty}
.gate-preference-title{font-size:34px;line-height:1.4;font-weight:600}
.gate-photo-caption{font-size:30px;font-weight:700;line-height:44px;text-align:center;pointer-events:none}
.gate-progress-title{font-size:41px;font-weight:700;line-height:1.45;text-align:center}
.gate-progress-sub{font-size:29px;line-height:1.3;text-align:center;color:#d6d6d4}
.gate-guide-copy{position:absolute;left:56px;top:200px;width:768px;color:#efefed;font-size:31px;line-height:1.48}
.gate-guide-copy h1{font-size:46px;line-height:1.25;margin:0 0 26px;color:#f8f8f6;font-weight:800}
.gate-guide-copy p{margin:0 0 26px}.gate-guide-copy .gate-guide-lead{font-size:33px;font-weight:600;color:#e4e4e2}
.gate-guide-next{font-weight:600}
.gate-guide-notes{padding-left:44px;margin:42px 0 0;font-size:25px;line-height:1.5;color:#c8c8c6}
.gate-guide-notes li{padding-left:6px;margin-bottom:21px}
.gate-guide-action{font-size:31px;line-height:1.45;font-weight:700}
.gate-handoff-instructions{position:absolute;margin:0;padding:20px 24px;border:2px solid #b0b0ae4f;border-radius:20px;background:#3234384d;color:#eaeae8;font-size:27px;line-height:1.45;white-space:pre-line;pointer-events:none}
.handoff-address{width:100%;margin:0 0 30px;padding:20px;border:2px solid #97989a;border-radius:12px;background:#17191d;color:#f4f4f2;font-size:24px;user-select:text;-webkit-user-select:text}
.success-title{font-size:50px;line-height:1.4;display:flex;align-items:center;justify-content:center}
.success-subtitle{font-size:37px;line-height:1.4}
body.local-preview{max-width:390px;margin:0 auto;min-height:100dvh}


.photo-option img{object-fit:cover;object-position:center 28%}.age-tile{display:grid;place-items:center;background:linear-gradient(135deg,#35373b,#202226);color:#f7f7f5}.age-tile-label{font-size:38px;font-weight:700;line-height:1.5;padding:16px}.form-title{font-size:42px}.gate-question{font-size:42px}.gate-preference-title{font-size:38px}

.text-option{position:absolute;display:flex;align-items:center;gap:28px;border:3px solid #515254;border-radius:24px;padding:22px 30px;background:linear-gradient(135deg,#25272b,#1a1c20);color:#f7f7f5;text-align:left;cursor:pointer}
.text-option[aria-checked=true]{border-color:#c4c4c2;background:#35373b;box-shadow:0 0 30px #afafad55}
.text-option:focus-visible{outline:6px solid #dddddb;outline-offset:6px}.answer-number{display:grid;place-items:center;width:48px;height:48px;border:2px solid #b0b0ae;border-radius:50%;font-size:28px;color:#d3d3d1;flex:none}.answer-label{font-size:39px;font-weight:650;flex:1}.answer-radio{width:34px;height:34px;border:3px solid #a3a4a6;border-radius:50%;flex:none}.text-option[aria-checked=true] .answer-radio{background:#c8c8c6;border:7px solid #2f3135;outline:3px solid #c8c8c6}
.photo-option[aria-checked=true]{outline-color:#c4c4c2;box-shadow:0 0 30px #afafad66}.ai-badge{position:absolute;left:10px;bottom:10px;padding:5px 10px;background:#1d1f23cc;border:1px solid #d6d6d4;border-radius:8px;color:#f8f8f6;font-size:21px;line-height:1.3}.stage[data-page=pref0] .gate-preference-title{font-size:37px}.stage[data-page=pref0] .gate-photo-caption{font-size:31px}