/* Connected story scenes use the approved illustration family, fully contained. */
.recruit-story-intro{display:grid;grid-template-columns:minmax(0,1fr);gap:0;width:100%;margin:0 0 20px;padding:0;text-align:left;border:1px solid #bfa874aa;border-radius:16px;background:linear-gradient(135deg,#284650,#193447);color:#f5e8cf;overflow:hidden;box-shadow:0 6px 18px #04152133}
.recruit-story-intro>img{display:block;width:100%;height:auto;max-height:24dvh;aspect-ratio:3/2;object-fit:contain;background:#142e3b}
.recruit-story-intro>span{padding:14px 16px}
.starter-story-card>img{object-fit:cover;object-position:50% 15%}
.recruit-preview .recruit-requirement{display:grid;grid-template-columns:26px minmax(0,1fr);align-items:center;gap:10px;margin:16px 0 0;text-align:left}
.recruit-preview .recruit-requirement>.camp-icon{width:26px;height:26px;margin:0}
.recruit-preview .recruit-requirement>span{min-width:0;line-height:1.45}
.recruit-story-intro>span{display:grid;gap:6px}.recruit-story-intro small{font-size:11px;letter-spacing:.08em;color:#ddc292}.recruit-story-intro strong{font:22px/1.15 var(--display,Georgia,serif)}.recruit-story-intro span>span{font-size:14px;line-height:1.4;color:#cfdddb}.recruit-story-intro b{font-size:14px;line-height:1.4;color:#f3d498}.recruit-story-intro i{font-style:normal}
.recruit-story[data-chapter="opening"] .recruit-owned{font-size:12px}
.recruit-story{height:min(850px,100dvh);background:#102b39}
.recruit-story .story-stage-art{width:100%;height:auto;aspect-ratio:3/2;max-height:37dvh;overflow:hidden;background:#193642}
.recruit-story .story-stage-art:after{display:none}
.recruit-story .story-stage-art>.recruit-scene{object-fit:contain;object-position:center;display:block}
.recruit-story .story-stage-art>.recruit-scene[hidden]{display:none}
.recruit-scene-caption{position:absolute;bottom:9px;left:12px;max-width:calc(100% - 24px);padding:5px 9px;border-radius:7px;background:#0a2037ed;color:#f6e2bc;font-size:12px;line-height:1.4;letter-spacing:.015em;pointer-events:none}
.recruit-scene-caption[hidden]{display:none}
.recruit-story .campaign-scroll{flex:1;padding-top:12px}
.recruit-story h2{font-size:30px;line-height:1.12;margin:12px 0 16px}
.recruit-story .story-speaker{margin:0 0 14px}
.recruit-story .recruit-face{display:block;position:relative;flex:none;width:64px;height:76px;border:1px solid #d7b77977;border-radius:14px;overflow:hidden;background:radial-gradient(ellipse at 50% 75%,#57706b,#193747 80%)}
.recruit-story .recruit-face img{display:block;width:100%;height:100%;border:0;border-radius:0;background:none;animation:none}
.recruit-story .recruit-face.is-scene img{position:absolute;max-width:none;width:600%;height:auto;left:var(--face-x);top:var(--face-y)}
.recruit-story .story-line{font-size:16px;line-height:1.6;margin:0 0 8px;color:#e2e9e4}
.recruit-story footer{background:#102b39;padding-top:10px}
.recruit-story-controls{display:flex;gap:10px}.recruit-story-controls #recruitStoryNext{flex:1;width:auto}.recruit-story-controls #recruitStoryPrevious{flex:0 0 auto;width:auto;padding-inline:14px;border:1px solid #85a7af88;border-radius:12px;background:#244350;color:#e0e8e3;font-size:14px}.recruit-story-controls #recruitStoryPrevious[hidden]{display:none}
.recruit-owned{display:flex;align-items:center;justify-content:center;gap:8px;color:#c9d8d7;font-size:14px;margin:0 0 12px}
.recruit-owned .camp-icon{width:20px;height:20px;color:#a5d7bd}
.recruit-art-status{position:absolute;inset:0;z-index:1;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:12px;padding:28px 65px 20px 24px;text-align:center;font-size:14px;color:#d8e5e4;background:#193642}
.recruit-art-status[hidden]{display:none}
.recruit-story .recruit-art-status button{position:static;width:auto;min-width:100px;height:auto;min-height:44px;font-size:14px;padding:8px 14px}
.recruit-story .recruit-art-status button[hidden]{display:none}
.recruit-story .story-stage-art>[data-recruit-close]{z-index:2}
#heroJoiningStory{display:flex;align-items:center;justify-content:flex-start;gap:9px;width:100%;min-height:44px;margin-top:8px;padding:10px 12px;border:1px solid #8cabaa66;border-radius:12px;background:#244753;color:#f4e6ca;font:14px/1.4 var(--body,Arial,sans-serif);text-align:left}
#heroJoiningStory[hidden]{display:none}
#heroJoiningStory .camp-icon{width:23px;height:23px;flex:none}
@media(max-height:600px){.recruit-story .story-stage-art{max-height:29dvh}.recruit-story .campaign-scroll{padding:10px 15px}.recruit-story h2{font-size:25px;margin:8px 0 10px}.recruit-story .story-speaker{gap:9px;margin-bottom:8px}.recruit-story .recruit-face{width:42px;height:50px;border-radius:10px}.recruit-story .story-line{line-height:1.45}.recruit-story footer{padding-block:8px max(10px,env(safe-area-inset-bottom))}.recruit-owned{font-size:12px;margin-bottom:8px}.recruit-story .story-page-track{margin-bottom:8px}}
@media(prefers-reduced-motion:no-preference){.recruit-story{animation:recruit-arrive .22s ease-out}.recruit-story .recruit-scene:not([hidden]){animation:recruit-page .32s ease-out}@keyframes recruit-page{from{opacity:.2}to{opacity:1}}@keyframes recruit-arrive{from{opacity:.65;translate:0 6px}to{opacity:1;translate:0 0}}}
