/* YEOKJU / 11 shrine images: full-illustration mobile portrait layout.
   Loaded AFTER the legacy cover and continuity styles. 2026-10-30
   Only visual story and dialogue are affected; engines and commerce are untouched. */
@media screen and (max-width:680px) {
  #yeokjuTempleAtlas .s-guide {
    width:100%!important; margin:0!important; border:0!important;
    background:#081522!important; overflow:visible!important;
  }
  /* Spoken introduction stays on its original guardian picture. */
  #yeokjuTempleAtlas .s-guide-portrait {
    position:relative!important; display:flex!important;
    flex-direction:column!important; justify-content:flex-end!important;
    width:100%!important; height:auto!important; min-height:max(145vw,78svh)!important;
    aspect-ratio:auto!important; box-sizing:border-box!important;
    padding:clamp(195px,64vw,410px) 0 0!important;
    overflow:visible!important; isolation:isolate;
    background:#07121e!important;
  }
  #yeokjuTempleAtlas .s-guide-portrait .s-guide-image {
    position:absolute!important; inset:0!important; z-index:0!important;
    display:block!important; width:100%!important; height:100%!important;
    object-fit:contain!important; object-position:top center!important;
    max-width:none!important;
  }
  #yeokjuTempleAtlas .s-guide-portrait:after {
    position:absolute!important; inset:0!important; z-index:1!important;
    pointer-events:none!important; content:"";
    background:linear-gradient(180deg,
      transparent 0%, #06101a0b 30%, #06101a78 58%,
      #06101ae5 82%, #081522 100%)!important;
  }
  #yeokjuTempleAtlas .s-guide-heading {
    position:relative!important; inset:auto!important; bottom:auto!important;
    display:block!important; width:100%!important; z-index:2!important;
    padding:18px 20px 8px!important; box-sizing:border-box!important;
  }
  #yeokjuTempleAtlas .s-guide-portrait .s-guide-words {
    position:relative!important; z-index:3!important;
    width:100%!important; max-width:none!important;
    margin:0!important; padding:5px 20px 28px!important;
    min-height:0!important; box-shadow:none!important;
    border:0!important; background:transparent!important;
    box-sizing:border-box!important;
  }
  #yeokjuTempleAtlas .s-guide-portrait .s-guide-quote {
    margin:0!important; padding:0!important;
    max-width:100%!important; background:transparent!important;
    border:0!important; color:#fff6e7!important;
    font-size:clamp(16px,4.3vw,19px)!important; line-height:1.8!important;
    overflow-wrap:break-word!important; word-break:keep-all!important;
  }
  /* The cover's world is a real image in grid flow, not a cropped CSS background.
     The same grid cell holds the native text overlay, and grows if text is longer
     than the image: no clipped words or fixed-height "strip" on short iPhones. */
  #yeokjuTempleAtlas .s-chron-opening.is-story-opening {
    display:block!important; overflow:visible!important; width:100%!important;
    min-height:0!important; padding:0!important; margin:0!important;
    background:#081522!important;
  }
  #yeokjuTempleAtlas .s-chron-opening.is-story-opening > .s-chron-cover {
    display:grid!important; grid-template-columns:minmax(0,1fr)!important;
    grid-template-rows:auto!important; align-items:stretch!important;
    position:relative!important; width:100%!important;
    min-width:0!important; max-width:100%!important;
    height:auto!important; min-height:0!important;
    margin:0!important; padding:0!important;
    aspect-ratio:auto!important; overflow:visible!important;
    border:0!important; border-radius:0!important;
    background:var(--cover-night,#081522)!important;
    isolation:isolate!important;
  }
  #yeokjuTempleAtlas .s-chron-cover > img.s-chron-cover-world {
    grid-column:1!important; grid-row:1!important;
    position:relative!important; inset:auto!important;
    display:block!important; width:100%!important; height:auto!important;
    max-width:none!important; min-height:0!important;
    object-fit:contain!important; object-position:top center!important;
    transform:none!important; filter:brightness(.84) contrast(1.04)!important;
    opacity:1!important; z-index:0!important;
    background:transparent!important;
  }
  /* The temple illustration already occupies the entire canvas; do not crop
     or cover it with a second enlarged character photograph. */
  #yeokjuTempleAtlas .s-chron-cover > .s-chron-cover-person {
    display:none!important;
  }
  #yeokjuTempleAtlas .s-chron-cover > .s-chron-cover-halation {
    position:absolute!important; inset:0!important; z-index:1!important;
    pointer-events:none!important; opacity:.55!important;
  }
  #yeokjuTempleAtlas .s-chron-cover > .s-chron-cover-light {
    position:absolute!important; inset:0!important; z-index:2!important;
    pointer-events:none!important;
    background:linear-gradient(180deg,
      #03081235 0%,#03081205 21%,#050a1480 58%,
      #040914d9 79%,#040914 100%)!important;
  }
  #yeokjuTempleAtlas .s-chron-cover > .s-chron-cover-face {
    grid-column:1!important; grid-row:1!important;
    position:relative!important; z-index:4!important;
    align-self:stretch!important; display:flex!important;
    flex-direction:column!important; justify-content:flex-end!important;
    width:100%!important; min-width:0!important; max-width:none!important;
    margin:0!important; min-height:0!important;
    padding:clamp(130px,35vw,215px) 19px 25px!important;
    box-sizing:border-box!important; text-align:center!important;
    background:transparent!important;
  }
  #yeokjuTempleAtlas .s-chron-cover-head {
    top:20px!important; right:18px!important; left:18px!important;
    bottom:auto!important; max-width:none!important;
    z-index:5!important;
  }
  #yeokjuTempleAtlas .s-chron-cover-body,
  #yeokjuTempleAtlas .s-chron-cover-foot,
  #yeokjuTempleAtlas .s-chron-cover .s-chron-toolbar {
    position:relative!important; z-index:5!important;
  }
  #yeokjuTempleAtlas .s-chron-cover:before,
  #yeokjuTempleAtlas .s-chron-cover:after {display:none!important}
  #yeokjuTempleAtlas .s-chron-cover-marks {z-index:3!important}
  #yeokjuTempleAtlas .s-chron-cover .s-chron-toolbar {
    margin-top:12px!important; padding:0!important;
  }
  #yeokjuTempleAtlas .s-chron-opening.is-story-opening + .s-chron-track {
    margin:0!important; padding:0!important; border:0!important;
  }
}
@media screen and (max-width:359px) {
  #yeokjuTempleAtlas .s-guide-portrait {padding-top:175px!important}
  #yeokjuTempleAtlas .s-guide-heading {padding-inline:16px!important}
  #yeokjuTempleAtlas .s-guide-portrait .s-guide-words {padding-inline:16px!important}
  #yeokjuTempleAtlas .s-chron-cover > .s-chron-cover-face {
    padding:112px 16px 22px!important;
  }
  #yeokjuTempleAtlas .s-chron-cover-head {
    left:14px!important;right:14px!important;top:15px!important;
  }
}
