.shop-logo{object-fit:contain;background:#211d25;padding:10px}.selected-shop .shop-logo{width:88px;height:88px;border-radius:14px}.shop-card>.shop-logo{width:100%;height:190px;object-fit:contain;padding:18px}.plan-selects{grid-template-columns:repeat(2,minmax(0,1fr))}.payoff-ready{width:100%;margin:12px 0}.care-profile .character-profile{margin-top:20px}.shift-time{display:grid;gap:8px;width:min(100%,420px);margin:20px auto 12px}.shift-time progress{width:100%;height:9px;appearance:none;border:0;border-radius:20px;overflow:hidden;background:#ffffff20}.shift-time progress::-webkit-progress-bar{background:#ffffff20}.shift-time progress::-webkit-progress-value{background:#d6bd88}.shift-time progress::-moz-progress-bar{background:#d6bd88}.shift-time span{font-size:14px;color:#e1d5c7}
#narrative-stage .event-opening-mode .narrative-shell::after{content:"";position:absolute;inset:0;background:linear-gradient(160deg,#392240aa,#1a1327e8);pointer-events:none;z-index:2}
#narrative-stage .event-opening-mode .narrative-header,#narrative-stage .event-opening-mode .narrative-scroll,#narrative-stage .event-opening-mode .narrative-footer{z-index:4}
#narrative-stage .event-opening-mode .narrative-scroll{position:absolute;inset:var(--scene-header,90px) 0 0;max-height:none;width:100%;display:flex;flex-direction:column;justify-content:center;padding:24px 24px calc(90px + env(safe-area-inset-bottom));background:transparent;pointer-events:auto;overflow-y:auto}
#narrative-stage .event-opening{margin:auto;max-width:720px;text-align:center;color:#fff}
#narrative-stage .event-opening h2{font-size:clamp(24px,4vw,38px);line-height:1.65}
#narrative-stage .cinema-mode:not(.event-opening-mode):not(.novel-choosing):not(.novel-summary):not(.cinema-art-only) .narrative-scroll,#narrative-stage .encounter-cinema:not(.event-opening-mode):not(.novel-choosing):not(.novel-summary):not(.cinema-art-only) .narrative-scroll{position:absolute;inset:auto 0 0;max-height:55%;padding:0 16px calc(84px + env(safe-area-inset-bottom));display:block;z-index:3}
#narrative-stage .narrative-stage .rpg-text-window{margin:0 auto;max-width:850px}
@media(max-width:600px){.selected-shop .shop-logo{width:72px;height:72px}#narrative-stage .event-opening-mode .narrative-scroll{padding:18px 18px calc(90px + env(safe-area-inset-bottom))}.care-profile .profile-intro{min-width:0}.shift-time{margin-top:12px}}

/* Use the same full-height stage for departure, encounter and Haneda scenes. */
#narrative-stage .cinema-mode .narrative-shell {
  position: relative;
  display: block;
  height: 100dvh;
  max-width: 1200px;
  overflow: hidden;
  isolation: isolate;
}
#narrative-stage .cinema-mode .narrative-header {
  position: absolute;
  inset: 0 0 auto;
  z-index: 5;
}
#narrative-stage .cinema-mode .cinema-image {
  position: absolute;
  inset: var(--scene-header, 90px) 0 0;
  width: 100%;
  height: auto;
  min-height: 0;
  max-height: none;
  aspect-ratio: auto;
}
#narrative-stage .cinema-mode .cinema-image img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
  animation: none;
  transform: none;
}
#narrative-stage .cinema-mode.cinema-art-only .cinema-image { inset: 0; }
#narrative-stage .cinema-mode.cinema-art-only .narrative-header,
#narrative-stage .cinema-mode.cinema-art-only .narrative-scroll { display: none; }