/* Game figures use layered CSS illustration and photographic face crops. */
.game-actor{filter:drop-shadow(0 10px 8px #08081599)}
/* Give the seated avatars a small stage-like 3D volume that stays inside the existing encounter viewport. */
.game-scene{perspective:900px;background-color:#151225}
.scene-room .room-world{background:radial-gradient(ellipse at 50% 48%,#6b4b6855,transparent 58%),linear-gradient(#171728,#292334 68%,#16131f)}
.scene-room .room-back{background:linear-gradient(130deg,#54435b,#2c2945 55%,#584258);box-shadow:inset 0 -10px 25px #0007,0 8px 20px #0b091788}
.scene-room .room-floor{background:repeating-linear-gradient(90deg,transparent 0 64px,#e5c1e018 65px 66px),linear-gradient(#695665,#262331 72%);filter:brightness(1.08)}
.scene-room .room-window{box-shadow:0 0 34px #db9ef566,inset 0 0 20px #f7c4ff55}
.scene-room .game-actor{filter:drop-shadow(0 12px 9px #070612bb);transform:translateX(-50%) rotateY(var(--actor-yaw,0deg));transform-style:preserve-3d}
.scene-room .current{--actor-yaw:8deg}.scene-room .future{--actor-yaw:-8deg}
.game-actor .actor-head{background:linear-gradient(115deg,#fff0dd 0%,#d4aa93 62%,#946c69 100%);box-shadow:inset -5px -3px 8px #62444b77,inset 3px 2px 5px #fff8,0 3px 9px #0008}
.game-actor .actor-body{box-shadow:inset 2px 2px 5px #fff6,inset -5px -5px 10px #080a1699,2px 5px 9px #08081588}
.game-actor .actor-arm,.game-actor .actor-leg{box-shadow:inset 2px 0 3px #ffffff55,inset -3px 0 5px #080a1666,2px 4px 6px #08081577}
.game-actor.seated .actor-hand{box-shadow:inset 2px 1px 2px #fff8,1px 3px 4px #170f1b99}
.game-actor.future:before{content:'';position:absolute;z-index:-2;left:-37px;top:-27px;width:174px;height:174px;border:2px solid #b9a2ff88;border-radius:50%;box-shadow:0 0 24px #b28affaa,inset 0 0 30px #a87fff66;animation:futurePortal 5s ease-in-out infinite}
.game-actor.future:after{content:'';position:absolute;z-index:-3;left:-50px;top:-40px;width:200px;height:200px;border:1px solid #a4e9ff66;border-radius:50%;transform:rotateX(66deg);box-shadow:0 0 22px #8fcfff77}
.scene-room .conversation-table{filter:drop-shadow(0 10px 10px #080815bb)}
.scene-room .table-top{background:linear-gradient(180deg,#f8e2cb,#bd8c9e 68%,#785b73);box-shadow:inset 0 2px 5px #fff9,0 5px 8px #08081599}
.game-actor.seated .actor-leg{top:132px;height:15px;width:38px;border-radius:10px 12px 8px 8px;background:linear-gradient(180deg,#687180,#30394a 65%,#1c2433);box-shadow:inset 2px 2px 4px #fff7,inset -3px -3px 5px #080a1688,2px 4px 6px #08081577}
.game-actor.seated .leg-left{left:17px;right:auto;transform:rotate(7deg)}
.game-actor.seated .leg-right{left:43px;right:auto;transform:rotate(-7deg)}
.game-actor.seated .actor-leg:after{left:22px;bottom:-27px;width:13px;height:28px;border-radius:5px 5px 8px 8px;background:linear-gradient(90deg,#232a39,#555c6c 48%,#202635);box-shadow:inset 2px 0 3px #ffffff44,2px 3px 4px #08081588}
.game-actor.future.seated .actor-leg{background:linear-gradient(180deg,#799091,#3c5d64 65%,#203944)}
.game-actor.future.seated .actor-leg:after{background:linear-gradient(90deg,#243640,#5b7478 48%,#1d303a)}
.game-actor.seated .actor-arm.left{left:13px;transform:rotate(24deg)}
.game-actor.seated .actor-arm.right{right:13px;transform:rotate(-24deg)}
.game-actor.current.seated .actor-arm.right{transform:rotate(-38deg)}
.game-actor.future.seated .actor-arm.left{transform:rotate(38deg)}
.modal>.age-compare{margin:8px 0 12px;padding:10px 14px;border-color:#d4b0ff99;box-shadow:0 0 22px #a071ff33}
.modal>.age-compare .compare-title{font-size:14px}
.modal>.age-compare .compare-grid{margin-top:6px;gap:18px}
.modal>.age-compare .compare-grid img{width:76px;height:76px;max-width:20vw;max-height:20vw}
.modal>.age-compare p{margin:5px 0 0}
@keyframes futurePortal{50%{transform:scale(1.06);opacity:.72}}
.actor-hair{position:absolute;top:-3px;left:24px;width:52px;height:43px;border-radius:48% 48% 28% 28%;background:radial-gradient(ellipse at 36% 20%,#84717c,#4a3944 48%,#201b2d 100%);box-shadow:inset 2px 2px 5px #cab0b04a,2px 4px 6px #10101c99;z-index:2}
.actor-head{top:3px;left:27px;width:46px;height:57px;z-index:3;overflow:hidden;border:1px solid #e8cbb8;border-radius:46% 46% 44% 44%;background:radial-gradient(ellipse at 36% 36%,#fff0df,#dbb8a0 60%,#aa7b71);box-shadow:inset -5px -2px 9px #805c5d66,0 2px 5px #0008}
.actor-head img{width:100%;height:100%;object-fit:cover;filter:contrast(1.03) saturate(.93)}
.face-placeholder{display:block;position:relative;width:100%;height:100%;background:radial-gradient(ellipse at 30% 46%,#60494b 0 2px,transparent 3px),radial-gradient(ellipse at 70% 46%,#60494b 0 2px,transparent 3px),radial-gradient(ellipse at 50% 75%,#ad7371 0 4px,transparent 5px),radial-gradient(ellipse at 50% 48%,#f6ddc8,#d2aa99 76%)}
.face-placeholder i{position:absolute;top:52%;left:45%;width:10%;height:11%;border-right:1px solid #a17e77;border-bottom:1px solid #a17e77;border-radius:40%}
.actor-neck{top:55px;z-index:1;background:linear-gradient(90deg,#ad8078,#edcbb4,#b88c7f);border-radius:0 0 7px 7px}
.actor-body{top:63px;left:21px;width:58px;height:69px;z-index:1;clip-path:polygon(21% 0,79% 0,98% 19%,87% 100%,13% 100%,2% 19%);border-radius:15px 15px 9px 9px;background:linear-gradient(105deg,#282838 0%,#565e70 27%,#3e485b 57%,#202938 100%);box-shadow:inset 2px 1px 4px #ffffff50,inset -4px -4px 8px #080a16a0}
.future .actor-body{background:linear-gradient(105deg,#26363d,#6c8c8e 30%,#47636a 60%,#253d49)}
.shirt-collar{position:absolute;top:0;left:19px;width:20px;height:19px;background:linear-gradient(120deg,#f5e3d7,#aaa5a9);clip-path:polygon(0 0,50% 35%,100% 0,65% 100%,50% 58%,35% 100%)}
.shirt-seam{position:absolute;top:20px;bottom:0;left:50%;width:1px;background:#ffffff33}
.actor-arm{top:69px;width:15px;height:66px;z-index:2;background:linear-gradient(90deg,#222b3a,#687182 45%,#374253);box-shadow:inset 1px 0 2px #ffffff40,2px 3px 4px #080a1299}
.future .actor-arm{background:linear-gradient(90deg,#28404a,#88a4a4 45%,#43636a)}
.actor-hand{position:absolute;bottom:-6px;left:2px;width:11px;height:12px;border-radius:45%;background:linear-gradient(110deg,#e9c7ad,#ac7d73);box-shadow:1px 2px 2px #21172877}
.actor-leg{background:linear-gradient(90deg,#222738,#4d5262 45%,#202333);box-shadow:inset 1px 0 2px #ffffff33}
.future .actor-leg{background:linear-gradient(90deg,#24323b,#526872 45%,#202b34)}
.actor-leg:after{background:linear-gradient(#584955,#24232e);box-shadow:0 2px 2px #0008}
.game-actor.seated .actor-head{top:17px}.game-actor.seated .actor-hair{top:11px}.game-actor.seated .actor-neck{top:70px}.game-actor.seated .actor-body{top:80px}.game-actor.seated .actor-arm{top:86px}
.game-actor.seated .actor-leg:after{background:linear-gradient(90deg,#282c3c,#525362,#252634)}
.game-actor.future .actor-hair{background:radial-gradient(ellipse at 36% 20%,#c6b9ba,#80747d 45%,#4a404e 100%)}
@media(prefers-reduced-motion:no-preference){.game-actor.seated .actor-head{animation:headbreath 4s ease-in-out infinite}.game-actor.future.seated .actor-head{animation-delay:-1.5s}@keyframes headbreath{50%{translate:0 -1px;rotate:1deg}}}

/* Make the photo read as a face inside the illustrated character, and give the
   seated pose a clear lap / shin silhouette instead of two dangling sticks. */
.scene-room .game-actor.seated{height:195px;transform:translateX(-50%) rotateY(var(--actor-yaw,0deg));transform-origin:50% 100%}
.scene-room .game-actor.seated .actor-head{border:1px solid #e5c7ad;border-radius:47% 47% 43% 43%;background:#c7a28f;box-shadow:inset 0 -5px 8px #55404c66,0 4px 10px #090711bb;isolation:isolate}
.scene-room .game-actor.seated .actor-head img{transform:scale(1.2);object-position:50% 43%;filter:contrast(1.06) saturate(.86) sepia(.08);}
.scene-room .game-actor.seated .actor-head:before{content:"";position:absolute;z-index:2;left:0;right:0;top:0;height:10px;border-radius:48% 48% 30% 30%;background:linear-gradient(180deg,#25222b 0%,#47414a 56%,transparent);opacity:.82;pointer-events:none}
.scene-room .game-actor.seated .actor-hair{z-index:2;top:12px;left:22px;width:56px;height:39px;background:radial-gradient(ellipse at 45% 2%,#35313b 0 48%,#292631 72%,transparent 74%);box-shadow:none}
.scene-room .game-actor.future.seated .actor-hair{background:radial-gradient(ellipse at 44% 2%,#a69ca0 0 13%,#5b535e 48%,#38323d 72%,transparent 74%)}
.scene-room .game-actor.seated .actor-neck{top:68px;height:16px;z-index:1}
.scene-room .game-actor.seated .actor-body{top:78px;height:58px;border-radius:18px 18px 12px 12px;clip-path:polygon(18% 0,82% 0,100% 20%,88% 100%,12% 100%,0 20%)}
.scene-room .game-actor.seated .actor-arm{top:84px;height:48px;width:14px}
.scene-room .game-actor.seated .actor-arm.left{left:12px;transform:rotate(28deg)}
.scene-room .game-actor.seated .actor-arm.right{right:12px;transform:rotate(-28deg)}
.scene-room .game-actor.current.seated .actor-arm.right{transform:rotate(-56deg)}
.scene-room .game-actor.future.seated .actor-arm.left{transform:rotate(56deg)}
.scene-room .game-actor.seated .actor-hand{width:13px;height:13px;bottom:-5px;left:0;border:1px solid #bc8e7c}
.scene-room .game-actor.seated .actor-leg{top:128px;height:16px;width:48px;border-radius:11px 15px 10px 10px;box-shadow:inset 0 2px 4px #ffffff55,inset 0 -3px 5px #080a1688,2px 5px 7px #08081588}
.scene-room .game-actor.seated .leg-left{left:15px;width:38px;transform:rotate(5deg)}
.scene-room .game-actor.seated .leg-right{left:39px;right:auto;width:48px;transform:rotate(-7deg)}
.scene-room .game-actor.seated .actor-leg:after{left:25px;bottom:-31px;width:14px;height:30px;border-radius:8px 8px 6px 6px;background:linear-gradient(90deg,#242a39,#626574 48%,#252938);box-shadow:inset 2px 0 3px #ffffff44,2px 3px 5px #08081588}
.scene-room .game-actor.future.seated .actor-leg:after{background:linear-gradient(90deg,#243640,#60797d 48%,#1d303a)}
.scene-room .game-actor.seated .chair{left:10px;top:90px;width:80px;height:77px;opacity:.8}
.scene-room .game-actor.seated .chair-back{height:48px}
.scene-room .game-actor.seated .chair-seat{top:44px;width:65px;height:15px}
.scene-room .conversation-table{z-index:3}
@media(max-width:600px){.scene-room .game-actor.seated .actor-head img{transform:scale(1.12)}}

/* Web-ready 3D character renders replace the old photo-head / CSS body composite. */
.game-scene.personalized-3d .game-actor{width:100px;height:195px;filter:drop-shadow(0 12px 10px #070612bb)}
.game-scene.personalized-3d .game-actor:before{content:"";position:absolute;z-index:1;left:50%;top:-14px;width:156px;height:224px;transform:translateX(-50%);border:0;border-radius:0;background:var(--actor-render) center bottom/contain no-repeat;box-shadow:none;animation:none}
.game-scene.personalized-3d .game-actor.current:before{--actor-render:url("assets/current-figure-3d.png")}
.game-scene.personalized-3d .game-actor.future:before{--actor-render:url("assets/future-figure-3d.png")}
.game-scene.personalized-3d .game-actor:after{content:none}
.game-scene.personalized-3d .game-actor> :not(.actor-label):not(.speech-bubble){display:none}
.game-scene.personalized-3d .game-actor .actor-label{z-index:3;top:-25px;left:-28px;right:-28px;font-size:10px;letter-spacing:.1em;text-shadow:0 2px 7px #100b1b}
.scene-room .game-actor.current{--actor-yaw:5deg}
.scene-room .game-actor.future{--actor-yaw:-5deg}
@media(max-width:600px){.game-scene.personalized-3d .game-actor:before{width:136px;height:198px;top:-10px}.game-scene.personalized-3d .game-actor .actor-label{top:-23px}}
