/* Character photography stays prominent at every screen size. */
.review-page{max-width:1540px}
.review-hero img{width:100px;height:128px}
.results-ranking{gap:12px}
.rank-person{min-width:225px;gap:14px;padding:16px}
.rank-person.selected{padding:15px}
.rank-person .avatar{width:68px;height:68px;font-size:28px}
.rank-person b{font-size:17px}
.rank-person strong{font-size:25px}
.scrapbook-header{padding-bottom:25px}
.scrapbook-header h2{margin:12px 0}
.scrapbook-header p{font-size:16px;line-height:1.5}
.story-portrait{position:relative;background:none;border:0;padding:0;flex:none;border-radius:50%}
.scrapbook-header .story-portrait .avatar{width:120px;height:120px;font-size:44px;border-width:4px}
.story-portrait .photo-expand{right:0;bottom:0}
.life-gallery-heading{display:flex;justify-content:space-between;align-items:end;gap:20px;margin:27px 0 16px}
.life-gallery-heading h3{font-size:22px;letter-spacing:-.035em;margin:0 0 7px}
.life-gallery-heading p{font-size:14px;color:#75674e;margin:0}
.life-gallery-swipe{display:none}
.age-photo-row{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));align-items:stretch;gap:16px;margin:0 0 30px;padding:0 0 24px;border-bottom:1px dashed #cdbf9f;overflow-x:auto;scroll-snap-type:x proximity;scroll-padding:4px}
.age-photo{display:block;min-width:0;width:auto;border:1px solid #d7c9af;padding:0;border-radius:14px;background:#fffaf0;text-align:left;overflow:hidden;scroll-snap-align:start;transition:box-shadow .15s,transform .15s}
.age-photo:hover{transform:translateY(-2px);box-shadow:0 8px 20px #483c2520}
.age-photo-image{display:block;position:relative;aspect-ratio:3/4;overflow:hidden;background:#c8c2b9}
.age-photo img{display:block;height:100%;width:100%;max-width:none;object-fit:cover;object-position:50% 0%;mix-blend-mode:normal}
.photo-expand{position:absolute;right:10px;bottom:10px;display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:#fffaf1ed;color:#32473b;font-size:21px;border:1px solid #fff;box-shadow:0 2px 8px #1c261624;pointer-events:none}
.age-photo-caption{display:block;padding:15px 13px;min-height:81px}
.age-photo-caption b{display:block;font-size:16px;line-height:1.25;letter-spacing:-.025em}
.age-photo-caption small{font-size:13px;line-height:1.4;color:#75674e;margin-top:7px}
.photo-unreached{position:absolute;top:10px;left:10px;background:#fffaf0ec;border:1px solid #e0d5c1;padding:5px 8px;border-radius:6px;font-size:12px;color:#615a4e}
.age-photo.unreached{border-style:dashed}
.life-card-top{gap:26px;align-items:center}
.life-card-top h2{font-size:42px}
.life-card-top .eyebrow{font-size:13px}
.life-card-portrait{display:block;position:relative;flex:none;width:172px;aspect-ratio:3/4;padding:0;border:1px solid #cecfc3;border-radius:14px;overflow:hidden;background:#d5d1c9}
.life-card-portrait img{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 0%}
.player-strip{grid-template-columns:repeat(var(--players,4),minmax(215px,1fr))}
.player-card .avatar{width:58px;height:58px;font-size:23px}
.player-card{gap:13px;min-height:90px}
.player-card strong{font-size:16px}
.player-card small{font-size:12px;line-height:1.4}
.turn-person .avatar{width:68px;height:68px;font-size:28px}
.lobby-seat .avatar{width:48px;height:48px;font-size:20px}
.baby-option img{height:245px}
.nursery-baby img{height:290px}
.event-person-card img{height:185px;object-position:50% 18%}
.career-mini img{width:64px!important;height:64px!important;margin:0 0 10px 12px}
.portrait-dialog{width:min(600px,calc(100vw - 28px));padding:24px 28px 20px;background:#fbf7ed;overflow:auto}
.portrait-dialog::backdrop{background:#14221eeb;backdrop-filter:blur(9px)}
.portrait-dialog figure{margin:0;text-align:center}
.portrait-dialog figure>img{display:block;width:100%;height:min(64dvh,620px);object-fit:contain;border-radius:12px;background:#d4cec5}
.portrait-dialog figcaption{padding:18px 24px 0}
.portrait-dialog .eyebrow{font-size:12px;letter-spacing:.08em}
.portrait-dialog h2{font-size:34px;margin:7px 0}
.portrait-dialog p{margin:0;font-size:14px;line-height:1.5}
.portrait-dialog .dialog-close{top:32px;right:36px;background:#fffdf1ef;border:1px solid #ded9c9;box-shadow:0 2px 8px #20312622;width:40px;height:40px;z-index:1}
.portrait-navigation{display:flex;align-items:center;justify-content:center;gap:30px;margin-top:18px}
.portrait-navigation .button{min-width:62px;min-height:44px;padding:8px 18px;font-size:23px}
.portrait-navigation>span{font-size:14px;color:#687064;min-width:40px;text-align:center}
@media(max-width:1000px){
 .age-photo-row{grid-template-columns:repeat(5,220px);gap:14px}
 .life-gallery-swipe{display:block;font-size:13px;color:#75674e;white-space:nowrap}
 .scrapbook-header .story-portrait .avatar{width:104px;height:104px}
}
@media(max-width:650px){
 .review-page{padding:22px 15px}
 .review-hero img{display:none}
 .rank-person{min-width:220px;padding:14px}
 .rank-person.selected{padding:13px}
 .rank-person .avatar{width:64px;height:64px}
 .scrapbook{padding:23px 16px 23px 24px}
 .scrapbook-header{align-items:start;gap:12px}
 .scrapbook-header h2{font-size:32px;line-height:1.15}
 .scrapbook-header p{font-size:14px}
 .scrapbook-header .eyebrow{font-size:11px}
 .scrapbook-header .story-portrait .avatar{width:86px;height:86px;border-width:3px}
 .story-portrait .photo-expand{width:28px;height:28px;font-size:18px}
 .life-gallery-heading{display:block;margin:22px 0 16px}
 .life-gallery-heading h3{font-size:21px}
 .life-gallery-swipe{margin-top:10px;font-size:13px}
 .age-photo-row{grid-template-columns:repeat(5,min(68vw,250px));gap:12px;padding-bottom:20px}
 .age-photo-caption{padding:14px;min-height:78px}
 .age-photo-caption b{font-size:17px}
 .age-photo-caption small{font-size:14px}
 .life-card-top{gap:17px}
 .life-card-top h2{font-size:32px}
 .life-card-top .eyebrow{font-size:11px}
 .life-card-portrait{width:126px}
 .player-card .avatar{width:54px;height:54px;font-size:23px}
 .player-card strong{font-size:15px}
 .player-card small{font-size:12px}
 .baby-option img{height:205px}
 .nursery-baby img{height:220px}
 .portrait-dialog{padding:16px 16px 18px}
 .portrait-dialog .dialog-close{top:24px;right:24px}
 .portrait-dialog figure>img{height:min(59dvh,540px)}
 .portrait-dialog figcaption{padding:18px 0 0}
 .portrait-dialog h2{font-size:30px}
}
@media(prefers-reduced-motion:reduce){.age-photo{transition:none}.age-photo:hover{transform:none}}
