/* Four authored people: entire frames, no detached face / hair / body layers. */
.hero-choice-screen{padding:96px 18px 28px;background:radial-gradient(ellipse at 50% 25%,#51483c,#151a20 72%);min-height:100svh;display:flex;flex-direction:column;gap:24px}
.hero-heading{text-align:center;position:relative;z-index:1}
.hero-heading h2{font:400 clamp(30px,8vw,39px)/1.15 Georgia,serif;margin:16px 0}
.hero-heading>p:last-child{font-size:13px;line-height:1.65;color:#d1c7bb;margin:0}
.ready-hero-choices{display:grid;grid-template-columns:1fr 1fr;gap:12px;flex:1;min-height:270px}
.ready-hero-choice{appearance:none;padding:0;position:relative;overflow:hidden;border:1px solid #f0d8b735;border-radius:100px 100px 12px 12px;background:#242423;color:#fff;text-align:left;isolation:isolate;min-height:300px;cursor:pointer;transition:border-color .3s,box-shadow .3s,transform .3s}
.ready-hero-choice img{position:absolute;width:100%;height:100%;object-fit:cover;object-position:50% 25%;inset:0;animation:hero-card-breathe 12s ease-in-out infinite alternate}
.ready-hero-choice:nth-child(2) img{animation-delay:-5s}
.ready-hero-choice::after{content:'';position:absolute;inset:55% 0 0;background:linear-gradient(transparent,#10151bf5);z-index:0}
.ready-hero-choice .ready-hero-caption{position:absolute;bottom:18px;left:14px;right:14px;z-index:1;display:flex;align-items:center;justify-content:space-between;gap:5px;font-size:15px}
.ready-hero-choice .ready-hero-mark{font-size:20px;color:#e4c392}
.ready-hero-choice[aria-pressed=true]{border-color:#e8c591;box-shadow:0 0 0 2px #d8b88b65;transform:translateY(-3px)}
.hero-choice-footer{text-align:center;position:relative;z-index:1}
.hero-choice-footer p[role=status]{font-size:13px;color:#d3c6b4;min-height:20px;margin:0 0 15px}
.hero-choice-footer .start-button{width:100%;min-height:54px}
.hero-choice-footer .guest-session{margin-top:18px}
.whole-hero-scene{position:absolute;inset:0;overflow:hidden;background:#282a2b}
.whole-hero-scene img,.whole-hero-scene canvas{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover;object-position:50% 18%}
.whole-hero-scene canvas[hidden]{display:none}
.identity-hero,.identity-traits .identity-hero{inset:0;width:100%;height:100%;max-height:none;transform:none;animation:none;mask-image:none;-webkit-mask-image:none;aspect-ratio:auto}
.identity-stage,.identity-traits .identity-stage{height:340px;margin:16px -24px 0;isolation:isolate;position:relative}
.identity-stage::after{display:none}
.identity-dialogue{bottom:0;left:16px;right:16px;padding:14px 18px;background:#121c22df;border:1px solid #ddc6a849;border-radius:18px;backdrop-filter:blur(12px);max-width:none;z-index:3}
.identity-dialogue .moment-label{color:#e6d3b9}
.identity-dialogue p{overflow:visible;padding:0 2px;line-height:1.45}
.identity-controls{padding-top:22px}
.identity-controls::before{display:none}
.identity-traits .identity-stage{height:320px}
.identity-traits .identity-dialogue{bottom:8px}
#identity-ready .identity-stage{height:auto;min-height:0;aspect-ratio:2/3;width:calc(100% + 48px);margin:18px -24px 0;max-height:none;background:#222;overflow:hidden;border-radius:0}
#identity-ready .identity-stage::before,#identity-ready .identity-stage::after{display:none}
#identity-ready .identity-stage .identity-hero{inset:0;left:0;width:100%;height:100%;aspect-ratio:auto;transform:none;mask:none;animation:none}
#identity-ready .identity-stage .whole-hero-scene{transform-origin:50% 23%}
.body-reveal .whole-hero-scene{animation:authored-pullback 4s cubic-bezier(.16,.6,.2,1) both}
#identity-ready .identity-stage .body-floor,#identity-ready .identity-stage .body-window-light{display:none}
#identity-ready .identity-dialogue{bottom:15px}
#chosen-name{overflow-wrap:anywhere}
.dream-actor-stage{height:auto;min-height:0;max-height:none;aspect-ratio:2/3;margin:18px -22px 0;isolation:isolate;overflow:hidden}
.dream-actor{inset:0;left:0;width:100%;height:100%;max-height:none;aspect-ratio:auto;transform:none;mask:none;-webkit-mask-image:none;animation:none}
.dream-actor-stage::after{pointer-events:none}
#dream-ready-name{overflow-wrap:anywhere}
.portrait-art{object-position:50% 20%}
@keyframes authored-pullback{from{transform:scale(1.9)}to{transform:scale(1)}}
@keyframes hero-card-breathe{from{transform:scale(1)}to{transform:scale(1.035)}}
.cinema.paused .whole-hero-scene,.cinema.paused .ready-hero-choice img,.cinema.suspended .whole-hero-scene,.cinema.suspended .ready-hero-choice img{animation-play-state:paused}
@media(max-height:700px){.hero-choice-screen{padding-top:82px;gap:18px}.hero-heading h2{font-size:29px;margin:10px 0}.ready-hero-choices{min-height:260px}.ready-hero-choice{min-height:260px}.identity-stage{height:320px}.identity-traits .identity-stage{height:300px}}
@media(max-width:350px){.hero-choice-screen{padding-left:12px;padding-right:12px}.ready-hero-choices{gap:9px}.ready-hero-choice .ready-hero-caption{left:10px;right:10px;font-size:14px}.hero-heading>p:last-child{font-size:12px}.identity-dialogue{padding:12px 14px}}
@media(prefers-reduced-motion:reduce){.body-reveal .whole-hero-scene,.ready-hero-choice img{animation:none}}

/* 23 Oct: restore the original casting / room / dream staging. */
.portrait-art{object-position:center top}
.ready-hero-choices{flex:0 0 auto;min-height:0;margin:auto 0;align-items:start}
.ready-hero-choice{min-height:0;height:clamp(280px,43svh,365px);border-radius:100px 100px 16px 16px;background:radial-gradient(ellipse at 40% 25%,#7e7566,#363b3e 68%,#1b252e)}
.ready-hero-choice img{animation:none;object-fit:fill;inset:auto;transform:none}
.ready-hero-choice[aria-pressed=true]{transform:none}
.static-hero-portrait{position:absolute;inset:0;overflow:hidden}
.static-hero-portrait img{position:absolute;display:block;max-width:none;object-fit:fill;animation:none;transform:none}
.static-hero-scene{background:transparent;animation:none!important;transform:none!important}
.whole-standing-art{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;display:block}
.identity-name .identity-stage,.identity-traits .identity-stage{height:330px;margin:12px -24px 0}
.identity-name .identity-hero,.identity-traits .identity-hero{width:275px;height:100%;left:calc(50% - 137.5px);top:0;bottom:0;mask-image:linear-gradient(#000 70%,transparent);-webkit-mask-image:linear-gradient(#000 70%,transparent)}
.identity-name .identity-dialogue,.identity-traits .identity-dialogue{left:16px;right:16px;bottom:0;background:linear-gradient(#111d26aa,#111d26e8);border:0;border-radius:16px;backdrop-filter:none;padding:11px 14px}
.identity-name .identity-light,.identity-traits .identity-light{animation:none}
#identity-ready .identity-stage{height:clamp(360px,53svh,490px);min-height:0;max-height:none;aspect-ratio:auto;margin:8px -24px 0;width:calc(100% + 48px);background:none;overflow:visible}
#identity-ready .identity-stage .identity-hero{left:50%;width:auto;height:100%;aspect-ratio:2/3;transform:translateX(-50%);overflow:visible}
#identity-ready .identity-backdrop,#identity-ready.room-reveal .identity-backdrop{animation:none;transform:none;background:linear-gradient(#10161e55,transparent 20%,transparent 57%,#10161ee8 85%,#10161e),url('assets/full-body/city-room.webp') center center/cover}
#identity-ready .identity-stage::before{display:block;content:'';position:absolute;left:calc(50% - 65px);bottom:0;width:130px;height:14px;background:radial-gradient(ellipse,#17212d99,transparent 70%);filter:blur(3px)}
#identity-ready .body-reveal .whole-standing-art{animation:standing-arrive .6s ease-out both}
#identity-ready .identity-controls{padding-top:14px}
#replay-body{display:none}
.dream-actor-stage{height:clamp(340px,49svh,450px);flex:0 0 auto;min-height:0;max-height:none;aspect-ratio:auto;margin:12px -22px 0;overflow:visible}
.dream-actor{left:50%;top:0;width:auto;height:100%;aspect-ratio:2/3;transform:translateX(-50%);animation:none}
.dream-confirmation .dream-backdrop{inset:0;opacity:1}
.dream-confirmation .dream-image{animation:none;transform:none;object-position:50% 35%}
.dream-confirmation .dream-shade{background:linear-gradient(#0d1721aa,transparent 32%,#0d172130 50%,#0d1721e8 88%)}
.dream-confirmation .dream-actor-stage{min-height:0}
@keyframes standing-arrive{from{opacity:0}to{opacity:1}}
@media(max-height:700px){.ready-hero-choice{height:280px}.identity-name .identity-stage,.identity-traits .identity-stage{height:290px}}
@media(max-width:350px){.identity-name .identity-stage,.identity-traits .identity-stage{margin-left:-18px;margin-right:-18px}#identity-ready .identity-stage{margin-left:-18px;margin-right:-18px;width:calc(100% + 36px)}.dream-actor-stage{margin-left:-17px;margin-right:-17px}}
@media(prefers-reduced-motion:reduce){#identity-ready .body-reveal .whole-standing-art{animation:none}}

.static-hero-scene .whole-standing-art{object-fit:contain}
#identity-ready .identity-stage .identity-hero,.dream-actor{right:auto;bottom:auto}

.ready-hero-choice{height:clamp(280px,38svh,325px)}
#identity-ready .identity-stage{height:clamp(320px,46svh,430px)}
.dream-confirmation .dream-actor-stage{height:clamp(280px,40svh,355px);overflow:hidden;mask-image:linear-gradient(#000 75%,transparent);-webkit-mask-image:linear-gradient(#000 75%,transparent)}
.dream-confirmation .dream-actor{width:520px;height:780px;max-height:none;aspect-ratio:2/3}

.dream-confirmation .dream-shade{background:linear-gradient(#0d172199,transparent 25%,#0d172122 43%,#0d1721dd 68%,#0d1721 90%)}

/* Men's wider shoulders need space outside the face-centred portrait crop. */
.identity-name .identity-hero[data-gender=man],.identity-traits .identity-hero[data-gender=man]{width:100%;left:0;right:auto;mask-image:linear-gradient(to right,transparent,#000 6%,#000 94%,transparent),linear-gradient(#000 70%,transparent);-webkit-mask-image:linear-gradient(to right,transparent,#000 6%,#000 94%,transparent),linear-gradient(#000 70%,transparent);mask-composite:intersect;-webkit-mask-composite:source-in}
.identity-name .identity-hero[data-gender=man] .static-hero-portrait,.identity-traits .identity-hero[data-gender=man] .static-hero-portrait{width:275px;left:calc(50% - 137.5px);right:auto;overflow:visible}
