/* =========================================================
   RC103 — APPROVED QUALITY RUNTIME OUTPUT LOCK
   The approved reference is the visual target.
   Priority: character first -> text in negative space.
   Text never shrinks the character.
   ========================================================= */

/* Fixed editorial page: one complete picture-book page, then scaled as one unit on mobile. */
body.reading .pictureStage .picturePage{
  width:820px!important;
  min-width:820px!important;
  max-width:820px!important;
  height:1180px!important;
  min-height:1180px!important;
  max-height:1180px!important;
  position:relative!important;
  display:block!important;
  overflow:hidden!important;
  padding:0!important;
  margin:0!important;
  background:#fffdf8!important;
  color:#2c2823!important;
  box-sizing:border-box!important;
  isolation:isolate!important;
}

/* Full-page scene. Never resized because of copy. */
body.reading .pictureStage .picturePage .pageCharacter{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  max-width:none!important;
  max-height:none!important;
  object-fit:cover!important;
  object-position:center!important;
  opacity:1!important;
  filter:none!important;
  z-index:1!important;
  transform:scale(var(--rc103-art-scale,1.12))!important;
  transform-origin:84% 48%!important;
  -webkit-mask-image:none!important;
  mask-image:none!important;
}
body.reading .pictureStage .picturePage.pose-left .pageCharacter{
  transform:scale(var(--rc103-art-scale,1.12))!important;
  transform-origin:16% 48%!important;
}

/* Close-up scenes need less zoom; medium scenes get the approved +5~7% presence. */
body.reading .scene-01,body.reading .scene-04,body.reading .scene-07,body.reading .scene-10,body.reading .scene-13,body.reading .scene-16,body.reading .scene-19{--rc103-art-scale:1.07}
body.reading .scene-02,body.reading .scene-03,body.reading .scene-05,body.reading .scene-06,body.reading .scene-08,body.reading .scene-09,body.reading .scene-11,body.reading .scene-12,body.reading .scene-14,body.reading .scene-15,body.reading .scene-17,body.reading .scene-18,body.reading .scene-20{--rc103-art-scale:1.12}

/* Soft ivory veil only where copy lives; this is not a box/card. */
body.reading .pictureStage .picturePage::after{
  content:""!important;
  position:absolute!important;
  inset:0!important;
  z-index:2!important;
  pointer-events:none!important;
  background:linear-gradient(90deg,
    rgba(255,253,248,.995) 0%,
    rgba(255,253,248,.985) 26%,
    rgba(255,253,248,.90) 36%,
    rgba(255,253,248,.50) 44%,
    rgba(255,253,248,.12) 54%,
    rgba(255,253,248,0) 64%)!important;
}
body.reading .pictureStage .picturePage.pose-left::after{
  background:linear-gradient(270deg,
    rgba(255,253,248,.995) 0%,
    rgba(255,253,248,.985) 26%,
    rgba(255,253,248,.90) 36%,
    rgba(255,253,248,.50) 44%,
    rgba(255,253,248,.12) 54%,
    rgba(255,253,248,0) 64%)!important;
}

/* Decorative stars stay subtle. */
body.reading .pictureStage .picturePage .pageStars{position:absolute!important;inset:0!important;z-index:3!important;opacity:.58!important;pointer-events:none!important}

/* Fixed safe zones, modeled after approved reference. */
body.reading .pictureStage .picturePage .pageMeta{
  position:absolute!important;
  z-index:5!important;
  top:32px!important;
  left:44px!important;
  right:44px!important;
  width:auto!important;
  margin:0!important;
  padding:0 0 13px!important;
  font-size:10.5px!important;
  line-height:1.2!important;
  letter-spacing:.15em!important;
  color:#9a6a2c!important;
  border-bottom:1px solid rgba(190,137,55,.22)!important;
}
body.reading .pictureStage .picturePage .chapterLine{
  position:absolute!important;
  z-index:5!important;
  top:82px!important;
  left:44px!important;
  width:330px!important;
  margin:0!important;
  font-size:13px!important;
  line-height:1.55!important;
  color:#956429!important;
  letter-spacing:-.01em!important;
}
body.reading .pictureStage .picturePage h3{
  position:absolute!important;
  z-index:5!important;
  top:126px!important;
  left:44px!important;
  width:345px!important;
  max-width:345px!important;
  margin:0!important;
  font-family:"Noto Serif KR","Batang",Georgia,serif!important;
  font-size:39px!important;
  line-height:1.38!important;
  letter-spacing:-.035em!important;
  font-weight:500!important;
  color:#8b591b!important;
  word-break:keep-all!important;
}
body.reading .pictureStage .picturePage .bodyFlow{
  position:absolute!important;
  z-index:5!important;
  top:330px!important;
  left:44px!important;
  width:350px!important;
  max-width:350px!important;
  height:610px!important;
  min-height:0!important;
  margin:0!important;
  padding:0!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:space-evenly!important;
  overflow:hidden!important;
  font-family:"Noto Serif KR","Batang",Georgia,serif!important;
  font-size:17.8px!important;
  line-height:1.82!important;
  letter-spacing:-.018em!important;
  color:#302d29!important;
  word-break:keep-all!important;
}
body.reading .pictureStage .picturePage .bodyFlow p{margin:0!important;padding:0!important}
body.reading .pictureStage .picturePage .impactLine{
  position:absolute!important;
  z-index:5!important;
  left:44px!important;
  bottom:64px!important;
  width:650px!important;
  max-width:650px!important;
  margin:0!important;
  padding:0!important;
  font-family:"Noto Serif KR","Batang",Georgia,serif!important;
  font-size:31px!important;
  line-height:1.5!important;
  letter-spacing:-.035em!important;
  font-weight:500!important;
  color:#9a641d!important;
  word-break:keep-all!important;
}
body.reading .pictureStage .picturePage .impactLine::before{content:"✦"!important;display:block!important;font-size:12px!important;color:#c9953e!important;margin:0 0 12px!important}

/* Mirrored text safe zones for left-character pages. */
body.reading .pictureStage .picturePage.pose-left .chapterLine,
body.reading .pictureStage .picturePage.pose-left h3,
body.reading .pictureStage .picturePage.pose-left .bodyFlow{
  left:auto!important;
  right:44px!important;
  margin:0!important;
}
body.reading .pictureStage .picturePage.pose-left .impactLine{
  left:auto!important;
  right:44px!important;
  margin:0!important;
}

/* Density only changes typography inside the safe zone. Character is untouched. */
body.reading .pictureStage .picturePage.dense h3{font-size:36px!important;line-height:1.38!important}
body.reading .pictureStage .picturePage.dense .bodyFlow{font-size:16.3px!important;line-height:1.72!important;top:316px!important;height:630px!important}
body.reading .pictureStage .picturePage.dense .impactLine{font-size:28px!important;line-height:1.48!important}
body.reading .pictureStage .picturePage.compact h3{font-size:33px!important;line-height:1.34!important}
body.reading .pictureStage .picturePage.compact .bodyFlow{font-size:14.8px!important;line-height:1.62!important;top:300px!important;height:650px!important;justify-content:space-between!important}
body.reading .pictureStage .picturePage.compact .impactLine{font-size:25px!important;line-height:1.44!important}
body.reading .pictureStage .picturePage.fit-tight .bodyFlow{font-size:13.8px!important;line-height:1.55!important;height:660px!important}
body.reading .pictureStage .picturePage.fit-tight .impactLine{font-size:23px!important}

/* Compatibility uses same composition, only the locked rose color world changes. */
body.reading .pictureStage .picturePage.compat{background:#fff9f9!important}
body.reading .pictureStage .picturePage.compat::after{background:linear-gradient(90deg,rgba(255,249,250,.995) 0%,rgba(255,249,250,.985) 26%,rgba(255,249,250,.90) 36%,rgba(255,249,250,.50) 44%,rgba(255,249,250,.12) 54%,rgba(255,249,250,0) 64%)!important}
body.reading .pictureStage .picturePage.compat.pose-left::after{background:linear-gradient(270deg,rgba(255,249,250,.995) 0%,rgba(255,249,250,.985) 26%,rgba(255,249,250,.90) 36%,rgba(255,249,250,.50) 44%,rgba(255,249,250,.12) 54%,rgba(255,249,250,0) 64%)!important}
body.reading .pictureStage .picturePage.compat .chapterLine,body.reading .pictureStage .picturePage.compat h3,body.reading .pictureStage .picturePage.compat .impactLine{color:#985064!important}
body.reading .pictureStage .picturePage.compat .pageCharacter{filter:sepia(.07) saturate(.90) hue-rotate(314deg) brightness(1.025)!important}

/* Mobile must only scale the complete fixed page. No reflow. */
@media(max-width:620px){
  body.reading #readerScreen{padding:0 9px 28px!important;overflow-x:hidden!important}
  body.reading .pictureStage .picturePage{
    width:820px!important;min-width:820px!important;max-width:820px!important;
    height:1180px!important;min-height:1180px!important;max-height:1180px!important;
    padding:0!important;
  }
}

/* ===== PDF / PRINT: same composition, physical A4 page ===== */
@page{size:A4;margin:0}
@media print{
  html,body{margin:0!important;padding:0!important;background:#fff!important}
  .shell{display:none!important}
  #printArea{display:block!important}
  .printPage{
    width:210mm!important;height:297mm!important;box-sizing:border-box!important;
    position:relative!important;overflow:hidden!important;display:block!important;
    margin:0!important;padding:0!important;break-after:page!important;
    background:#fffdf8!important;color:#2d2925!important;isolation:isolate!important;
  }
  .printPage img{
    position:absolute!important;inset:0!important;width:100%!important;height:100%!important;
    object-fit:cover!important;object-position:center!important;max-height:none!important;
    z-index:1!important;filter:none!important;opacity:1!important;
    transform:scale(var(--rc103-print-scale,1.12))!important;transform-origin:84% 48%!important;
    -webkit-mask-image:none!important;mask-image:none!important;
  }
  .printPage.pose-left img,.printPage.left img{transform-origin:16% 48%!important}
  .printPage.scene-01,.printPage.scene-04,.printPage.scene-07,.printPage.scene-10,.printPage.scene-13,.printPage.scene-16,.printPage.scene-19{--rc103-print-scale:1.07}
  .printPage.scene-02,.printPage.scene-03,.printPage.scene-05,.printPage.scene-06,.printPage.scene-08,.printPage.scene-09,.printPage.scene-11,.printPage.scene-12,.printPage.scene-14,.printPage.scene-15,.printPage.scene-17,.printPage.scene-18,.printPage.scene-20{--rc103-print-scale:1.12}
  .printPage::after{content:""!important;position:absolute!important;inset:0!important;z-index:2!important;background:linear-gradient(90deg,rgba(255,253,248,.995) 0%,rgba(255,253,248,.985) 26%,rgba(255,253,248,.90) 36%,rgba(255,253,248,.50) 44%,rgba(255,253,248,.12) 54%,rgba(255,253,248,0) 64%)!important}
  .printPage.pose-left::after,.printPage.left::after{background:linear-gradient(270deg,rgba(255,253,248,.995) 0%,rgba(255,253,248,.985) 26%,rgba(255,253,248,.90) 36%,rgba(255,253,248,.50) 44%,rgba(255,253,248,.12) 54%,rgba(255,253,248,0) 64%)!important}
  .printPage .pMeta{position:absolute!important;z-index:5!important;top:8mm!important;left:11mm!important;right:11mm!important;width:auto!important;padding:0 0 3mm!important;margin:0!important;font-size:7.6pt!important;letter-spacing:.14em!important;color:#9a6a2c!important;border-bottom:.2mm solid rgba(190,137,55,.22)!important}
  .printPage .pChapter{position:absolute!important;z-index:5!important;top:20mm!important;left:11mm!important;width:82mm!important;max-width:82mm!important;margin:0!important;font-size:9.7pt!important;line-height:1.5!important;color:#956429!important}
  .printPage h2{position:absolute!important;z-index:5!important;top:31mm!important;left:11mm!important;width:86mm!important;max-width:86mm!important;margin:0!important;font-family:"Noto Serif KR","Batang",serif!important;font-size:25pt!important;line-height:1.38!important;font-weight:500!important;color:#8b591b!important;letter-spacing:-.035em!important;word-break:keep-all!important}
  .printPage .pBody{position:absolute!important;z-index:5!important;top:82mm!important;left:11mm!important;width:88mm!important;max-width:88mm!important;height:153mm!important;margin:0!important;padding:0!important;display:flex!important;flex-direction:column!important;justify-content:space-evenly!important;overflow:hidden!important;font-family:"Noto Serif KR","Batang",serif!important;font-size:10.7pt!important;line-height:1.82!important;letter-spacing:-.018em!important;color:#302d29!important;word-break:keep-all!important}
  .printPage .pBody p{margin:0!important;padding:0!important}
  .printPage .pImpact{position:absolute!important;z-index:5!important;left:11mm!important;bottom:15mm!important;width:165mm!important;max-width:165mm!important;margin:0!important;padding:0!important;font-family:"Noto Serif KR","Batang",serif!important;font-size:20pt!important;line-height:1.5!important;font-weight:500!important;letter-spacing:-.035em!important;color:#9a641d!important;word-break:keep-all!important}
  .printPage.pose-left .pChapter,.printPage.pose-left h2,.printPage.pose-left .pBody,.printPage.left .pChapter,.printPage.left h2,.printPage.left .pBody{left:auto!important;right:11mm!important;margin:0!important}
  .printPage.pose-left .pImpact,.printPage.left .pImpact{left:auto!important;right:11mm!important;margin:0!important}
  .printPage.dense h2{font-size:23pt!important}.printPage.dense .pBody{font-size:9.8pt!important;line-height:1.72!important;top:78mm!important;height:157mm!important}.printPage.dense .pImpact{font-size:18pt!important}
  .printPage.compact h2{font-size:21pt!important}.printPage.compact .pBody{font-size:8.9pt!important;line-height:1.62!important;top:75mm!important;height:160mm!important;justify-content:space-between!important}.printPage.compact .pImpact{font-size:16.5pt!important}
  .printPage.compat{background:#fff9f9!important}.printPage.compat .pChapter,.printPage.compat h2,.printPage.compat .pImpact{color:#985064!important}.printPage.compat img{filter:sepia(.07) saturate(.90) hue-rotate(314deg) brightness(1.025)!important}
  .printPage.compat.ending{background:#4b192a!important;color:#fff9f6!important}
}

/* RC103.1 — balanced overflow zone: long copy uses a second natural negative-space band. */
body.reading .pictureStage .picturePage .bodyFlowBottom{display:none!important}
body.reading .pictureStage .picturePage.has-bottom .bodyFlow{
  top:314px!important;height:480px!important;justify-content:space-between!important;
}
body.reading .pictureStage .picturePage.has-bottom .bodyFlowBottom{
  display:flex!important;position:absolute!important;z-index:5!important;
  left:44px!important;top:815px!important;width:650px!important;height:170px!important;
  flex-direction:column!important;justify-content:space-evenly!important;overflow:hidden!important;
  margin:0!important;padding:0!important;
  font-family:"Noto Serif KR","Batang",Georgia,serif!important;
  font-size:17.2px!important;line-height:1.72!important;letter-spacing:-.018em!important;
  color:#302d29!important;word-break:keep-all!important;
}
body.reading .pictureStage .picturePage.has-bottom .bodyFlowBottom p{margin:0!important;padding:0!important}
body.reading .pictureStage .picturePage.pose-left.has-bottom .bodyFlowBottom{left:auto!important;right:44px!important}
body.reading .pictureStage .picturePage.has-bottom .impactLine{bottom:48px!important}
body.reading .pictureStage .picturePage.dense.has-bottom .bodyFlow{font-size:15.8px!important;line-height:1.66!important;height:488px!important}
body.reading .pictureStage .picturePage.dense.has-bottom .bodyFlowBottom{font-size:15.8px!important;line-height:1.62!important;height:178px!important}
body.reading .pictureStage .picturePage.compact.has-bottom .bodyFlow{font-size:14.2px!important;line-height:1.56!important;height:500px!important}
body.reading .pictureStage .picturePage.compact.has-bottom .bodyFlowBottom{font-size:14.2px!important;line-height:1.54!important;height:184px!important}
body.reading .pictureStage .picturePage.fit-tight .bodyFlow,body.reading .pictureStage .picturePage.fit-tight .bodyFlowBottom{font-size:13.2px!important;line-height:1.48!important}
body.reading .pictureStage .picturePage.fit-ultra .bodyFlow,body.reading .pictureStage .picturePage.fit-ultra .bodyFlowBottom{font-size:12.2px!important;line-height:1.42!important}
body.reading .pictureStage .picturePage.fit-ultra .impactLine{font-size:21px!important}

@media print{
  .printPage .pBodyBottom{display:none!important}
  .printPage.has-bottom .pBody{top:79mm!important;height:120mm!important;justify-content:space-between!important}
  .printPage.has-bottom .pBodyBottom{
    display:flex!important;position:absolute!important;z-index:5!important;
    left:11mm!important;top:205mm!important;width:165mm!important;height:35mm!important;
    flex-direction:column!important;justify-content:space-evenly!important;overflow:hidden!important;
    margin:0!important;padding:0!important;font-family:"Noto Serif KR","Batang",serif!important;
    font-size:10.2pt!important;line-height:1.62!important;letter-spacing:-.018em!important;color:#302d29!important;word-break:keep-all!important;
  }
  .printPage.has-bottom .pBodyBottom p{margin:0!important;padding:0!important}
  .printPage.pose-left.has-bottom .pBodyBottom{left:auto!important;right:11mm!important}
  .printPage.has-bottom .pImpact{bottom:12mm!important}
  .printPage.dense.has-bottom .pBody,.printPage.dense.has-bottom .pBodyBottom{font-size:9.4pt!important;line-height:1.56!important}
  .printPage.compact.has-bottom .pBody,.printPage.compact.has-bottom .pBodyBottom{font-size:8.6pt!important;line-height:1.48!important}
}

/* RC103.2 — character-first edge shift: enlarge the figure but push it away from copy. */
body.reading .pictureStage .picturePage .pageCharacter{
  transform:translateX(var(--rc103-art-shift,4%)) scale(var(--rc103-art-scale,1.12))!important;
}
body.reading .pictureStage .picturePage.pose-left .pageCharacter{
  --rc103-art-shift:-4%;
  transform:translateX(var(--rc103-art-shift,-4%)) scale(var(--rc103-art-scale,1.12))!important;
}
body.reading .scene-01,body.reading .scene-04,body.reading .scene-07,body.reading .scene-10,body.reading .scene-13,body.reading .scene-16,body.reading .scene-19{--rc103-art-shift:2.5%}
body.reading .scene-04,body.reading .scene-10,body.reading .scene-16{--rc103-art-shift:-2.5%}
@media print{
  .printPage img{transform:translateX(var(--rc103-print-shift,4%)) scale(var(--rc103-print-scale,1.12))!important}
  .printPage.pose-left img,.printPage.left img{--rc103-print-shift:-4%;transform:translateX(var(--rc103-print-shift,-4%)) scale(var(--rc103-print-scale,1.12))!important}
  .printPage.scene-01,.printPage.scene-07,.printPage.scene-13,.printPage.scene-19{--rc103-print-shift:2.5%}
  .printPage.scene-04,.printPage.scene-10,.printPage.scene-16{--rc103-print-shift:-2.5%}
}
