/* ==========================================================
   MYEONGRIGYEOL UI V14 FINAL
   Free + Report + Lifebook + Home
   Presentation only
   ========================================================== */


/* ----------------------------------------------------------
   GLOBAL SAFETY
   ---------------------------------------------------------- */

html,
body {
  max-width:100%;
  overflow-x:hidden;
}

* {
  box-sizing:border-box;
}

img,
svg,
video,
canvas {
  max-width:100%;
}

table {
  max-width:100%;
}


/* ----------------------------------------------------------
   HOME
   ---------------------------------------------------------- */

body.mg-ui-v14-home .mg-hero-actions {
  position:relative;
  z-index:20;
}

body.mg-ui-v14-home .mg-hero-primary,
body.mg-ui-v14-home .mg-hero-secondary {
  position:relative;
  z-index:21;
  pointer-events:auto;
}


/* ----------------------------------------------------------
   FREE RESULT - GENERAL
   ---------------------------------------------------------- */

body.mg-ui-v14-free #result {
  width:min(100%,1120px);
  margin-inline:auto;
  overflow:visible;
}

body.mg-ui-v14-free #result > * {
  min-width:0;
  max-width:100%;
}


/* ----------------------------------------------------------
   FREE - FIRST READING
   ---------------------------------------------------------- */

body.mg-ui-v14-free
.mg-free-v132-reading {
  width:min(100%,920px) !important;
  margin:0 auto 22px !important;
  padding:clamp(22px,3vw,34px) !important;
}

body.mg-ui-v14-free
.mg-free-v132-reading p {
  margin:.72em 0 !important;
  line-height:1.76 !important;
  word-break:keep-all !important;
  overflow-wrap:break-word !important;
}

body.mg-ui-v14-free
.mg-free-v132-reading h1,
body.mg-ui-v14-free
.mg-free-v132-reading h2,
body.mg-ui-v14-free
.mg-free-v132-reading h3,
body.mg-ui-v14-free
.mg-free-v132-reading h4 {
  margin:1.45em 0 .64em !important;
  line-height:1.32 !important;
  word-break:keep-all !important;
}

body.mg-ui-v14-free
.mg-ui-v14-hide {
  display:none !important;
}


/* ----------------------------------------------------------
   FREE - OVERVIEW
   PC에서도 좌우를 억지로 절반씩 나누지 않는다.
   ---------------------------------------------------------- */

body.mg-ui-v14-free
#mgFreeOverviewV132 {
  width:min(100%,980px) !important;
  margin:0 auto 22px !important;
  padding:clamp(20px,3vw,30px) !important;
}

body.mg-ui-v14-free
#mgFreeOverviewV132
.mg-free-overview-grid-v132 {
  display:block !important;
}

body.mg-ui-v14-free
#mgFreeOverviewV132
.mg-free-overview-left-v132 {
  width:100% !important;
  margin:0 0 22px !important;
}

body.mg-ui-v14-free
#mgFreeOverviewV132
.mg-free-overview-right-v132 {
  width:100% !important;
}

body.mg-ui-v14-free
#mgFreeOverviewV132
.result-head {
  display:grid !important;
  grid-template-columns:minmax(0,1fr) auto !important;
  align-items:end !important;
  gap:18px !important;
  width:100% !important;
}

body.mg-ui-v14-free
#mgFreeOverviewV132
#resultName {
  max-width:680px !important;
  margin:0 !important;
  font-size:clamp(30px,4vw,46px) !important;
  line-height:1.17 !important;
  word-break:keep-all !important;
}


/* ----------------------------------------------------------
   FREE - PILLARS
   ---------------------------------------------------------- */

body.mg-ui-v14-free
#mgFreeOverviewV132
#pillars {
  display:grid !important;
  grid-template-columns:
    repeat(4,minmax(0,1fr)) !important;
  gap:10px !important;
  width:100% !important;
  margin:0 !important;
}

body.mg-ui-v14-free
#mgFreeOverviewV132
#pillars > * {
  min-width:0 !important;
  max-width:none !important;
}


/* ----------------------------------------------------------
   FREE - ELEMENT SUMMARY
   ---------------------------------------------------------- */

body.mg-ui-v14-free
#mgFreeElementsV132 {
  width:100% !important;
  margin:14px 0 0 !important;
}

body.mg-ui-v14-free
#mgFreeElementsV132
.mg-elements-grid-v132 {
  grid-template-columns:
    repeat(5,minmax(0,1fr)) !important;
}


/* ----------------------------------------------------------
   FREE - CURRENT YEAR
   ---------------------------------------------------------- */

body.mg-ui-v14-free
#yearPreview {
  width:min(100%,920px) !important;
  max-width:920px !important;
  min-width:0 !important;

  margin:0 auto 22px !important;

  overflow:hidden !important;
}

body.mg-ui-v14-free
#yearPreview * {
  min-width:0;
  max-width:100%;
}

body.mg-ui-v14-free
#yearPreview h1,
body.mg-ui-v14-free
#yearPreview h2,
body.mg-ui-v14-free
#yearPreview h3,
body.mg-ui-v14-free
#yearPreview h4,
body.mg-ui-v14-free
#yearPreview p,
body.mg-ui-v14-free
#yearPreview strong,
body.mg-ui-v14-free
#yearPreview span {
  word-break:keep-all !important;
  overflow-wrap:break-word !important;
}

body.mg-ui-v14-free
#yearPreview p {
  line-height:1.72 !important;
}

body.mg-ui-v14-free
#yearPreview
.mg-free-v133-lock-grid {
  display:grid !important;
  grid-template-columns:
    repeat(4,minmax(0,1fr)) !important;
  gap:8px !important;
  width:100% !important;
}


/* ----------------------------------------------------------
   FREE - CURIOSITY
   ---------------------------------------------------------- */

body.mg-ui-v14-free
.mg-free-v132-curiosity {
  width:min(100%,920px) !important;
  margin:0 auto 22px !important;
}

body.mg-ui-v14-free
.mg-free-v132-question-grid {
  grid-template-columns:
    repeat(2,minmax(0,1fr)) !important;
}


/* ----------------------------------------------------------
   FREE - EVIDENCE
   ---------------------------------------------------------- */

body.mg-ui-v14-free
#mgFreeEvidenceV132 {
  width:min(100%,920px) !important;
  margin:0 auto 24px !important;

  display:grid !important;

  grid-template-columns:
    repeat(2,minmax(0,1fr)) !important;

  gap:10px !important;
}

body.mg-ui-v14-free
#mgFreeEvidenceV132 > details {
  width:100% !important;
  min-width:0 !important;
  max-width:100% !important;
}

body.mg-ui-v14-free
#mgFreeCalculatedDetailsV6[open] {
  grid-column:1 / -1;
}

body.mg-ui-v14-free
#mgFreeCalculatedDetailsV6
.mg-free-calculated-body-v6 {
  display:flex !important;
  flex-direction:column !important;

  gap:16px !important;

  width:100% !important;
  min-width:0 !important;

  padding:16px 0 0 !important;

  overflow:visible !important;
}

body.mg-ui-v14-free
#mgFreeCalculatedDetailsV6
.mg-free-calculated-body-v6 > * {
  width:100% !important;
  min-width:0 !important;
  max-width:100% !important;

  margin-left:0 !important;
  margin-right:0 !important;
}

body.mg-ui-v14-free
#mgFreeCalculatedDetailsV6
.mg-ui-v14-hide-detail {
  display:none !important;
}

body.mg-ui-v14-free
#mgFreeCalculatedDetailsV6 p,
body.mg-ui-v14-free
#mgFreeCalculatedDetailsV6 span,
body.mg-ui-v14-free
#mgFreeCalculatedDetailsV6 strong,
body.mg-ui-v14-free
#mgFreeCalculatedDetailsV6 h1,
body.mg-ui-v14-free
#mgFreeCalculatedDetailsV6 h2,
body.mg-ui-v14-free
#mgFreeCalculatedDetailsV6 h3,
body.mg-ui-v14-free
#mgFreeCalculatedDetailsV6 h4 {
  word-break:keep-all !important;
  overflow-wrap:break-word !important;
}


/* ----------------------------------------------------------
   PAID REPORT / LIFEBOOK
   ---------------------------------------------------------- */

body.mg-ui-v14-report #reportPreview,
body.mg-ui-v14-lifebook #lifeBookPreview {
  max-width:100%;
  overflow-x:hidden;
}

body.mg-ui-v14-report .mg-reading-opening,
body.mg-ui-v14-report .mg-reading-body,
body.mg-ui-v14-report .mg-reading-takeaway,
body.mg-ui-v14-report .takeaway,
body.mg-ui-v14-lifebook .mg-reading-opening,
body.mg-ui-v14-lifebook .mg-reading-body,
body.mg-ui-v14-lifebook .mg-reading-takeaway,
body.mg-ui-v14-lifebook .takeaway {
  min-width:0;
  max-width:920px;
  margin-left:auto !important;
  margin-right:auto !important;
}

body.mg-ui-v14-report .mg-reading-opening,
body.mg-ui-v14-lifebook .mg-reading-opening {
  padding:clamp(18px,2.5vw,26px) !important;
  line-height:1.7 !important;
}

body.mg-ui-v14-report .mg-reading-body,
body.mg-ui-v14-lifebook .mg-reading-body {
  line-height:1.84 !important;
}

body.mg-ui-v14-report .mg-reading-body p,
body.mg-ui-v14-lifebook .mg-reading-body p {
  margin:.78em 0 !important;
  word-break:keep-all;
  overflow-wrap:break-word;
}

body.mg-ui-v14-report .mg-reading-body h2,
body.mg-ui-v14-report .mg-reading-body h3,
body.mg-ui-v14-report .mg-reading-body h4,
body.mg-ui-v14-lifebook .mg-reading-body h2,
body.mg-ui-v14-lifebook .mg-reading-body h3,
body.mg-ui-v14-lifebook .mg-reading-body h4 {
  line-height:1.35 !important;
  word-break:keep-all;
}

body.mg-ui-v14-report
details.mg-report-tech,
body.mg-ui-v14-lifebook
details.mg-report-tech {
  width:min(100%,920px);
  max-width:920px;

  margin:20px auto !important;

  overflow:hidden;
}

body.mg-ui-v14-report
details.mg-report-tech > summary,
body.mg-ui-v14-lifebook
details.mg-report-tech > summary {
  padding:15px 17px !important;
  line-height:1.5;
  cursor:pointer;
}

body.mg-ui-v14-report table,
body.mg-ui-v14-lifebook table {
  display:block;
  width:100%;

  overflow-x:auto;
  overscroll-behavior-inline:contain;
}

body.mg-ui-v14-report pre,
body.mg-ui-v14-report code,
body.mg-ui-v14-lifebook pre,
body.mg-ui-v14-lifebook code {
  max-width:100%;
  overflow-x:auto;
}

body.mg-ui-v14-report .classical-card,
body.mg-ui-v14-lifebook .classical-card {
  min-width:0;
  max-width:100%;
}


/* ----------------------------------------------------------
   MOBILE
   ---------------------------------------------------------- */

@media (max-width:720px) {

  body.mg-ui-v14-home
  .mg-hero-actions {
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:10px !important;
  }

  body.mg-ui-v14-home
  .mg-hero-primary,
  body.mg-ui-v14-home
  .mg-hero-secondary {
    width:100% !important;
    max-width:none !important;
    min-height:58px !important;
  }


  body.mg-ui-v14-free
  #result {
    width:100%;
  }


  body.mg-ui-v14-free
  #mgFreeOverviewV132 {
    width:100% !important;
    padding:16px !important;
  }


  body.mg-ui-v14-free
  #mgFreeOverviewV132
  .result-head {
    grid-template-columns:1fr !important;
    gap:10px !important;
  }


  body.mg-ui-v14-free
  #mgFreeOverviewV132
  #resultName {
    font-size:clamp(28px,8vw,38px) !important;
  }


  body.mg-ui-v14-free
  #mgFreeOverviewV132
  #pillars {
    grid-template-columns:
      repeat(2,minmax(0,1fr)) !important;
  }


  body.mg-ui-v14-free
  .mg-free-v132-reading {
    width:100% !important;
    padding:18px !important;
  }


  body.mg-ui-v14-free
  .mg-free-v132-reading p {
    line-height:1.7 !important;
  }


  body.mg-ui-v14-free
  #yearPreview {
    width:100% !important;
  }


  body.mg-ui-v14-free
  #yearPreview
  .mg-free-v133-lock-grid {
    grid-template-columns:
      repeat(2,minmax(0,1fr)) !important;
  }


  body.mg-ui-v14-free
  .mg-free-v132-question-grid {
    grid-template-columns:1fr !important;
  }


  body.mg-ui-v14-free
  #mgFreeEvidenceV132 {
    width:100% !important;

    grid-template-columns:1fr !important;
  }


  body.mg-ui-v14-free
  #mgFreeCalculatedDetailsV6[open] {
    grid-column:auto;
  }


  body.mg-ui-v14-report .mg-reading-opening,
  body.mg-ui-v14-report .mg-reading-body,
  body.mg-ui-v14-report .mg-reading-takeaway,
  body.mg-ui-v14-report .takeaway,
  body.mg-ui-v14-lifebook .mg-reading-opening,
  body.mg-ui-v14-lifebook .mg-reading-body,
  body.mg-ui-v14-lifebook .mg-reading-takeaway,
  body.mg-ui-v14-lifebook .takeaway {
    width:100%;
  }


  body.mg-ui-v14-report .mg-reading-opening,
  body.mg-ui-v14-lifebook .mg-reading-opening {
    padding:16px !important;
    font-size:16px !important;
  }


  body.mg-ui-v14-report .mg-reading-body,
  body.mg-ui-v14-lifebook .mg-reading-body {
    line-height:1.76 !important;
  }


  body.mg-ui-v14-report
  details.mg-report-tech,
  body.mg-ui-v14-lifebook
  details.mg-report-tech {
    width:100%;
  }

}
