/* Keep the selected cast member on the academy stage, then reveal their introduction. */
.cast-entry.selecting .cast-link:not(.selected),.cast-entry.selecting .cast-entry-copy{opacity:0;transition:opacity .3s}
.role-choice{display:block;padding:0;background:transparent;backdrop-filter:none;overflow:hidden;z-index:100}
.role-choice.hidden{display:none}
.role-choice .role-choice-panel{position:absolute;inset:0;display:block;width:100%;height:100%;max-height:none;min-height:0;padding:0;border:0;border-radius:0;box-shadow:none;overflow:hidden;background:none;color:#ebf2f8;text-align:left;isolation:isolate}
.role-choice-panel::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#0a1a2c55,#0b1b2cb8 54%,#081827ee),url('assets/promo/academy-gate.fast.webp') center/cover;animation:stage-background .4s ease both}
.room-brand{position:absolute;top:26px;right:34px;font:600 .7rem/1.6 sans-serif;letter-spacing:.17em;color:#b4c7d7;z-index:3;margin:0}.room-brand span{display:block;font-size:.55rem}
.role-choice .role-choice-art{position:absolute;top:55px;bottom:0;left:2%;width:48%;height:auto;min-height:0;padding:0;display:block;background:none;transform:none;pointer-events:none;overflow:visible}
.role-choice .role-choice-art img{width:100%;height:100%;max-height:none;max-width:none;display:block;object-fit:contain;object-position:center bottom;transform:scaleX(var(--person-flip,1));opacity:1;filter:none;mix-blend-mode:normal}
.role-choice .role-choice-copy{position:absolute;top:13%;bottom:7%;left:53%;width:41%;max-height:none;margin:0;padding:28px 20px 22px 0;align-self:auto;overflow-y:auto;overflow-x:hidden;background:none;border:0;box-shadow:none;transform:none;animation:stage-copy .75s .3s both cubic-bezier(.2,.75,.25,1)}
.role-choice .role-choice-english{font:500 .72rem/1.5 sans-serif;letter-spacing:.2em;color:#b9d0df;margin:0 0 12px}
.role-choice .role-choice-panel h3{font-family:'Yu Mincho','Hiragino Mincho ProN',serif;font-size:clamp(2rem,3.6vw,3.8rem);line-height:1.3;letter-spacing:.04em;color:#fff7e8;margin:0 0 14px;overflow-wrap:anywhere}
.role-choice .role-choice-role{font-size:.9rem;font-weight:500;color:#d8c594;line-height:1.8;margin:0 0 24px}
.room-profile[hidden],.room-opening[hidden],.role-choice-actions [hidden]{display:none!important}
.room-quote{margin:0 0 22px;padding:0 0 14px;border-bottom:1px solid #b6c9d633;font-family:'Yu Mincho','Hiragino Mincho ProN',serif;font-size:clamp(1.05rem,1.55vw,1.4rem);line-height:1.9;color:#e7d6ab}
.role-choice .role-choice-intro{font-size:.95rem;line-height:2.1;color:#dce8f2;margin:0 0 24px;text-wrap:pretty}
.room-facts{display:grid;grid-template-columns:58px 1fr;gap:8px 16px;margin:0 0 26px;padding:16px 0;border-top:1px solid #a6bdcc30;border-bottom:1px solid #a6bdcc30;font-size:.8rem;line-height:1.8}
.room-facts dt{color:#91aabd}.room-facts dd{margin:0;color:#e1ebf3}
.role-choice .role-choice-actions{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.role-choice .role-choice-actions a,.role-choice .role-choice-actions button{position:static;inset:auto;display:inline-flex;align-items:center;justify-content:center;width:auto;height:auto;min-height:48px;padding:10px 20px;border:1px solid #a6bdcc66;border-radius:3px;background:#122c43d9;color:#ebf2f8;font:500 .85rem/1.8 'Hiragino Sans','Yu Gothic',sans-serif;text-decoration:none;box-shadow:none}
.role-choice .role-choice-actions a{background:#d7c28e;color:#172e43;border-color:#dac69b}
.role-choice .role-choice-actions button:hover{background:#24465f}.role-choice .role-choice-actions a:hover{background:#ecdab0}
.role-choice .role-choice-actions .role-choice-close{padding-inline:18px;background:transparent;color:#b4c9d8}
.role-choice button:focus-visible,.role-choice a:focus-visible{outline:2px solid #ead7a2;outline-offset:4px}
.room-opening h4{font:500 1.5rem/1.5 'Yu Mincho',serif;margin:0 0 22px;color:#e7d6ab}.room-opening-text p{font-size:.9rem;line-height:2;white-space:pre-wrap;margin:0 0 16px}.room-opening-text h5{font-size:.9rem;color:#d8c594;border-top:1px solid #b6c9d630;padding-top:18px;margin:24px 0 18px}
.room-profile-back{background:transparent;border:0;border-bottom:1px solid #91aabd;color:#b4c9d8;margin:16px 0 22px;padding:8px 0;font-size:.85rem}
@keyframes stage-background{from{opacity:0}to{opacity:1}}
@keyframes stage-copy{from{opacity:0;transform:translateX(35px)}to{opacity:1;transform:translateX(0)}}
@media(max-width:700px){
 .room-brand{top:16px;right:18px;font-size:.6rem}
 .role-choice .role-choice-art{top:36px;bottom:auto;height:36%;width:80%;left:3%}
 .role-choice .role-choice-copy{top:37%;bottom:0;left:0;width:100%;padding:24px 24px 30px;background:linear-gradient(#0a1a2cf2,#091a2d);border-top:1px solid #b6c9d630}
 .role-choice .role-choice-panel h3{font-size:2rem;margin-bottom:10px}.role-choice .role-choice-english{font-size:.65rem;margin-bottom:10px}.role-choice .role-choice-role{font-size:.8rem;margin-bottom:18px}
 .room-quote{font-size:1.05rem;margin-bottom:18px}.role-choice .role-choice-intro{font-size:.9rem;line-height:2}.room-facts{font-size:.78rem}
 .role-choice .role-choice-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px}.role-choice .role-choice-actions a,.role-choice .role-choice-actions button{width:100%;padding:10px 8px;font-size:.8rem}
 .role-choice .role-choice-actions .role-choice-close{grid-column:1/-1}
}
@media(max-height:600px) and (min-width:701px){.role-choice .role-choice-copy{top:8%;bottom:3%;padding-top:12px}.role-choice .role-choice-panel h3{font-size:2rem}.role-choice .role-choice-role{margin-bottom:14px}.room-quote{margin-bottom:16px}}
@media(prefers-reduced-motion:reduce){.role-choice *,.role-choice-panel::before,.cast-entry.selecting *{animation:none!important;transition:none!important}}
/* Keep all three actions available while longer introductions scroll. */
.role-choice .role-choice-copy{bottom:18%}
.role-choice .role-choice-actions{position:absolute;left:53%;bottom:7%;width:41%;padding-right:20px}
@media(max-width:700px){.role-choice .role-choice-copy{bottom:124px}.role-choice .role-choice-actions{left:24px;right:24px;bottom:14px;width:auto;padding:0}}
/* Scale the reading area with large displays and keep the actions beside the copy. */
@media(min-width:701px){
 .room-detail{position:absolute;left:53%;top:14%;bottom:10%;width:41%;display:flex;flex-direction:column;align-items:stretch}
 .role-choice .role-choice-copy{position:static;flex:0 1 auto;min-height:0;width:100%;max-height:none;padding:0 20px 0 0;overflow-y:auto}
 .role-choice .role-choice-actions{position:static;flex:none;width:100%;margin-top:clamp(18px,1.5vw,42px);padding:0 20px 0 0;gap:clamp(10px,.75vw,22px)}
 .role-choice .role-choice-panel h3{font-size:clamp(2.4rem,3.5vw,6.5rem);margin-bottom:clamp(14px,1.2vw,34px)}
 .role-choice .role-choice-english{font-size:clamp(.8rem,.7vw,1.3rem);margin-bottom:clamp(12px,.8vw,24px)}
 .role-choice .role-choice-role{font-size:clamp(1rem,.95vw,1.75rem);margin-bottom:clamp(20px,1.6vw,46px)}
 .room-quote{font-size:clamp(1.2rem,1.45vw,2.6rem);margin-bottom:clamp(20px,1.4vw,40px);padding-bottom:clamp(14px,1vw,28px)}
 .role-choice .role-choice-intro,.room-opening-text p{font-size:clamp(1.05rem,1.12vw,2rem);line-height:1.95;margin-bottom:clamp(20px,1.6vw,44px)}
 .room-facts{font-size:clamp(.9rem,.9vw,1.6rem);grid-template-columns:4em 1fr;gap:.45em 1em;padding:1em 0;margin:0}
 .role-choice .role-choice-actions a,.role-choice .role-choice-actions button{font-size:clamp(.95rem,.95vw,1.7rem);min-height:clamp(50px,4vw,94px);padding:.7em 1.15em}
 .room-opening h4{font-size:clamp(1.5rem,1.6vw,2.8rem)}.room-opening-text h5,.room-profile-back{font-size:clamp(1rem,1vw,1.8rem)}
 .room-brand{font-size:clamp(.7rem,.65vw,1.2rem)}.room-brand span{font-size:.8em}
}
@media(min-width:701px) and (max-height:650px){.room-detail{top:10%;bottom:6%}.role-choice .role-choice-panel h3{font-size:2.4rem}.role-choice .role-choice-role{margin-bottom:14px}.room-quote{margin-bottom:16px}.role-choice .role-choice-intro{margin-bottom:16px}.role-choice .role-choice-actions{margin-top:14px}}
@media(max-width:700px){.room-detail{display:contents}}
/* A diagonal field of the selected person's established color. */
.role-choice-panel::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(125deg,color-mix(in srgb,var(--room-color) 64%,#071222) 0%,color-mix(in srgb,var(--room-color) 42%,#071222) 100%);clip-path:polygon(54% 0,100% 0,100% 100%,37% 100%);opacity:.94;animation:stage-color .85s .12s cubic-bezier(.2,.75,.25,1) both;pointer-events:none}
.room-pair{display:inline-block;padding:.5em .9em;border:1px solid #e5e9f24d;border-radius:3px;background:#07122235;color:#f0e5c6;font-size:clamp(.85rem,.85vw,1.5rem);line-height:1.7;margin:0 0 1.1em;letter-spacing:.04em}
.room-pair[hidden]{display:none}
.cast-entry.selecting .cast-link.selected{visibility:hidden}
.cast-entry.returning .cast-link:not(.selected){opacity:1;transition:opacity .75s .12s}
.role-choice.closing .room-detail{animation:stage-copy-out .35s ease both;pointer-events:none}
.role-choice.closing .role-choice-panel::before{animation:stage-background-out .85s ease both}
.role-choice.closing .role-choice-panel::after{animation:stage-color-out .85s ease both}
@keyframes stage-color{from{transform:translateX(70%);opacity:0}to{transform:translateX(0);opacity:.94}}
@keyframes stage-color-out{from{transform:translateX(0);opacity:.94}to{transform:translateX(70%);opacity:0}}
@keyframes stage-background-out{from{opacity:1}to{opacity:0}}
@keyframes stage-copy-out{from{opacity:1;transform:translateX(0)}to{opacity:0;transform:translateX(30px)}}
@media(max-width:700px){.role-choice-panel::after{clip-path:polygon(48% 0,100% 0,100% 100%,0 100%)}.room-pair{font-size:.8rem}.role-choice.closing .role-choice-copy,.role-choice.closing .role-choice-actions{animation:stage-copy-out .35s ease both}}
@media(prefers-reduced-motion:reduce){.role-choice-panel::after{animation:none!important}}