/* YEOKJU – first reading accessibility / mobile viewport fix.
 * Preserve exact calculated pillars and prose. All changes are screen-only,
 * no impact on the print/A4/PDF reading or commerce.
 */
@media screen{
  #resultView #yeokjuCustomerReading .yeokju-free-opening > h2.yeokju-opening-headline{
    position:relative!important;isolation:isolate;
    display:block!important;width:100%!important;max-width:100%!important;
    margin:12px 0 21px!important;
    padding:15px 0 16px 18px!important;
    border-left:4px solid #cb6257!important;
    border-bottom:1px solid rgba(215,172,105,.37)!important;
    background:linear-gradient(90deg,rgba(142,53,50,.14),transparent 85%)!important;
    font-family:'Noto Serif KR','Nanum Myeongjo',serif!important;
    font-size:clamp(28px,4.2vw,43px)!important;
    line-height:1.42!important;letter-spacing:-.065em!important;
    color:#fff0d7!important;-webkit-text-fill-color:#fff0d7!important;
    text-shadow:0 3px 18px rgba(0,0,0,.4)!important;
    overflow-wrap:break-word!important;word-break:keep-all!important;
    text-wrap:pretty!important;
  }
  #resultView #yeokjuCustomerReading .yeokju-free-opening > h2.yeokju-opening-headline::before{
    content:"第一章  ·  나의 사주 원국";display:block;
    width:max-content;max-width:100%;
    font:750 12px/1.5 'Noto Sans KR',sans-serif!important;
    letter-spacing:.09em;color:#e6b47d!important;-webkit-text-fill-color:#e6b47d!important;
    margin-bottom:13px;
  }
  #resultView #yeokjuCustomerReading .yeokju-opening-headline .yeokju-opening-heading-top,
  #resultView #yeokjuCustomerReading .yeokju-opening-headline .yeokju-opening-heading-bottom{
    display:block;max-width:100%;font:inherit;color:inherit;-webkit-text-fill-color:inherit;
  }
  #resultView #yeokjuCustomerReading .yeokju-opening-headline .yeokju-opening-heading-top strong{
    font:inherit;font-weight:800!important;color:#f3b3a1!important;
    -webkit-text-fill-color:#f3b3a1!important;text-shadow:0 1px 12px rgba(191,64,47,.3)!important;
  }
  #resultView #yeokjuCustomerReading .yeokju-opening-headline .yeokju-opening-heading-bottom em{
    font:inherit;font-style:normal!important;font-weight:800!important;
    color:#f5ca80!important;-webkit-text-fill-color:#f5ca80!important;
  }
  #resultView #yeokjuCustomerReading .yeokju-free-opening > h2.yeokju-opening-headline::after{
    content:"";display:block;width:55px;height:3px;border-radius:10px;margin:13px 0 0;
    background:linear-gradient(90deg,#b84143,#e4be7a);
  }
}
@media screen and (max-width:720px){
  html,body{max-width:100%!important;overflow-x:clip!important}
  .result-stage,
  #resultStage{
    position:fixed!important;top:0!important;bottom:0!important;left:0!important;right:0!important;
    width:100%!important;max-width:100vw!important;min-width:0!important;
    height:100dvh!important;padding:0!important;margin:0!important;
    overflow:hidden!important;box-sizing:border-box!important;
    overscroll-behavior-x:none!important;
  }
  .result-stage .result-head{
    display:flex!important;flex:none!important;align-items:center!important;justify-content:space-between!important;
    gap:12px!important;max-width:100%!important;min-width:0!important;width:100%!important;
    padding:10px 15px!important;margin:0!important;
    overflow:hidden!important;box-sizing:border-box!important;
  }
  .result-stage .result-head h2{
    flex:1 1 0!important;min-width:0!important;margin:0!important;
    font-size:clamp(16px,4.5vw,19px)!important;line-height:1.35!important;
    white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;
  }
  .result-stage .result-head #closeResult{
    flex:none!important;width:auto!important;max-width:125px!important;
    padding:9px 11px!important;min-height:43px!important;min-width:0!important;
    font-size:13px!important;white-space:nowrap!important;writing-mode:horizontal-tb!important;
  }
  #nativeEngineHost{
    display:block;flex:1 1 auto!important;width:100%!important;max-width:100%!important;
    min-width:0!important;min-height:0!important;
    overflow-x:hidden!important;overflow-y:auto!important;
    box-sizing:border-box!important;
  }
  #nativeEngineHost[hidden]{display:none!important}
  #nativeEngineHost>main{
    display:block!important;width:100%!important;max-width:100%!important;min-width:0!important;
    margin:0!important;padding:8px 11px 26px!important;
    box-sizing:border-box!important;overflow-x:clip!important;
  }
  #nativeEngineHost #resultView,
  #nativeEngineHost #resultView .page-head,
  #nativeEngineHost #resultView #result,
  #nativeEngineHost #resultView .privacy-summary,
  #nativeEngineHost #resultView .yeokju-reading-guide,
  #nativeEngineHost #resultView .yeokju-customer-reading,
  #nativeEngineHost #resultView .yeokju-free-opening,
  #nativeEngineHost #resultView .native-reading-toc,
  #nativeEngineHost #resultView .topic-explorer{
    box-sizing:border-box!important;
    width:100%!important;max-width:100%!important;min-width:0!important;
    margin-left:auto!important;margin-right:auto!important;
  }
  #nativeEngineHost #resultView .page-head{
    padding:21px 9px 12px!important;margin-bottom:11px!important;text-align:left!important;
  }
  #nativeEngineHost #resultView .page-head h1{
    font-size:clamp(26px,7vw,34px)!important;line-height:1.35!important;
    white-space:normal!important;word-break:keep-all!important;overflow-wrap:break-word!important;
    margin:8px 0 12px!important;
  }
  #nativeEngineHost #resultView .page-head p{
    font-size:15px!important;line-height:1.65!important;
    white-space:normal!important;word-break:keep-all!important;overflow-wrap:break-word!important;
    max-width:100%!important;
  }
  #nativeEngineHost #resultView :is(.privacy-summary,.yeokju-reading-guide){
    display:block!important;float:none!important;
    margin:12px auto!important;padding:16px!important;
    border-radius:10px!important;grid-template-columns:none!important;
    font-size:14px!important;line-height:1.75!important;
    white-space:normal!important;overflow-wrap:break-word!important;
  }
  #nativeEngineHost #resultView :is(.privacy-summary,.yeokju-reading-guide) :is(p,strong,span,a){
    display:inline;max-width:100%!important;white-space:normal!important;
    overflow-wrap:break-word!important;word-break:keep-all!important;
    font-size:inherit!important;line-height:inherit!important;
  }
  #nativeEngineHost #resultView :is(.privacy-summary,.yeokju-reading-guide) p{
    display:block;margin:7px 0 0!important;
  }
  #nativeEngineHost #resultView .yeokju-customer-reading{
    padding:0!important;gap:16px!important;margin-bottom:27px!important;
  }
  #nativeEngineHost #resultView .yeokju-customer-reading .yeokju-free-opening{
    margin:0 auto 20px!important;padding:18px 16px 25px!important;
    border-radius:12px!important;overflow-wrap:break-word!important;
  }
  #nativeEngineHost #resultView #yeokjuCustomerReading .yeokju-free-opening > h2.yeokju-opening-headline{
    margin:9px 0 20px!important;padding:12px 0 15px 14px!important;
    font-size:clamp(25px,6.5vw,31px)!important;
    line-height:1.42!important;letter-spacing:-.055em!important;
  }
  #nativeEngineHost #resultView .yeokju-free-pillars{
    width:100%!important;max-width:100%!important;min-width:0!important;
    display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:9px!important;margin:18px 0 28px!important;
  }
  #nativeEngineHost #resultView .yeokju-free-pillar{
    width:100%!important;min-width:0!important;padding:15px 8px!important;
  }
  #nativeEngineHost #resultView .yeokju-free-pillar strong{
    font-size:clamp(25px,7vw,32px)!important;line-height:1.3!important;
  }
  #nativeEngineHost #resultView .yeokju-free-opening .yeokju-story-line{
    font-size:16px!important;line-height:1.82!important;
    word-break:keep-all!important;overflow-wrap:break-word!important;
  }
  #nativeEngineHost #resultView .native-reading-tabs{
    position:relative!important;top:auto!important;width:100%!important;
    max-width:100%!important;min-width:0!important;
    display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:9px!important;padding:10px 11px!important;
  }
  #nativeEngineHost #resultView .native-reading-tabs button{
    width:100%!important;min-width:0!important;box-sizing:border-box!important;
    padding:10px 5px!important;min-height:44px!important;
    font-size:14px!important;white-space:nowrap!important;writing-mode:horizontal-tb!important;
  }
  #nativeEngineHost #resultView .yeokju-result-comic{
    width:auto!important;max-width:calc(100% - 12px)!important;
  }
}
@media screen and (max-width:380px){
  #nativeEngineHost #resultView .yeokju-customer-reading .yeokju-free-opening{padding-inline:13px!important}
  #nativeEngineHost #resultView #yeokjuCustomerReading .yeokju-free-opening > h2.yeokju-opening-headline{
    font-size:25px!important;padding-left:12px!important;
  }
}
/* Native output should print exactly as before; no print CSS changes. */