/* ============================================================
   MYEONGRIGYEOL_REPORT_READER_V8
   Readability-first paid report UI
   ============================================================ */


/* ------------------------------------------------------------
   Main reading typography
------------------------------------------------------------ */

.mg-reading-opening,
.mg-reading-body,
.mg-life-chapter-body{
  color:rgba(242,244,245,.86)!important;
  font-size:18px!important;
  line-height:2.02!important;
  letter-spacing:-.012em!important;
  word-break:keep-all!important;
  overflow-wrap:break-word;
}


/* 첫 소개문은 조금 더 크게 */
.mg-reading-opening{
  font-size:18.5px!important;
  line-height:1.95!important;
  color:rgba(246,244,239,.90)!important;
}


/* 일반 문단 사이의 숨 쉴 공간 */
.mg-reading-paragraph,
.mg-reading-body > p,
.mg-reading-opening > p,
.mg-life-chapter-body > p{
  margin:0 0 1.55em!important;
}


/* 긴 문장 폭을 조금 제한 */
.mg-reading-body,
.mg-reading-opening{
  max-width:920px;
}


/* ------------------------------------------------------------
   Part / chapter title
------------------------------------------------------------ */

.mg-life-chapter h3,
.mg-reader-subhead-v8{
  margin:2.35em 0 .85em!important;
  color:#f3dfb7!important;
  font-size:23px!important;
  line-height:1.48!important;
  font-weight:750!important;
  letter-spacing:-.025em!important;
  word-break:keep-all!important;
}

.mg-reader-subhead-v8:first-child{
  margin-top:.5em!important;
}


/* ------------------------------------------------------------
   Markdown quote -> visual quote
------------------------------------------------------------ */

.mg-reader-quote-v8{
  position:relative;
  display:block;
  margin:1.75em 0 1.9em!important;
  padding:18px 22px 18px 25px!important;

  border-left:3px solid rgba(211,164,85,.80);
  border-radius:0 15px 15px 0;

  background:
    linear-gradient(
      90deg,
      rgba(211,164,85,.10),
      rgba(255,255,255,.025)
    );

  color:#f4e2be!important;
  font-size:19px!important;
  line-height:1.8!important;
  font-weight:650!important;
}


/* ------------------------------------------------------------
   Summary / takeaway
------------------------------------------------------------ */

.mg-reading-mirror,
.mg-reading-takeaway,
.mg-reading-chunk-emphasis{
  margin:2rem 0!important;
  padding:20px 22px!important;

  border-radius:18px!important;

  background:
    linear-gradient(
      145deg,
      rgba(203,154,76,.09),
      rgba(255,255,255,.025)
    )!important;
}

.mg-reading-mirror small,
.mg-reading-takeaway small,
.mg-reading-chunk-emphasis small{
  margin-bottom:9px!important;

  color:#d1a35f!important;

  font-size:13px!important;
  line-height:1.5!important;
  letter-spacing:.09em!important;
}

.mg-reading-mirror strong,
.mg-reading-takeaway strong{
  color:#f3ddb2!important;

  font-size:20px!important;
  line-height:1.72!important;
}


/* ------------------------------------------------------------
   "왜 이렇게 읽었나요?"
------------------------------------------------------------ */

.mg-reading-details{
  margin:2rem 0!important;
  padding:18px 20px!important;

  border-radius:16px!important;
}

.mg-reading-details summary{
  font-size:16px!important;
  line-height:1.6!important;
}

.mg-reading-details[open] summary{
  margin-bottom:16px!important;
}

.mg-reading-details p,
.mg-reading-details li{
  font-size:16px!important;
  line-height:1.85!important;
}


/* ============================================================
   V8 TIMING OVERVIEW
============================================================ */

.mg-reader-timing-overview-v8{
  margin:26px 0 40px;
  padding:24px;

  border:
    1px solid
    rgba(205,158,79,.28);

  border-radius:20px;

  background:
    linear-gradient(
      145deg,
      rgba(205,158,79,.07),
      rgba(11,23,31,.92)
    );
}

.mg-reader-timing-head-v8{
  margin-bottom:20px;
}

.mg-reader-timing-head-v8 small{
  display:block;

  margin-bottom:5px;

  color:#c7974d;

  font-size:11px;
  font-weight:800;

  letter-spacing:.16em;
}

.mg-reader-timing-head-v8 h2{
  margin:0 0 7px;

  color:#f4dfb6;

  font-size:25px;
  line-height:1.35;
}

.mg-reader-timing-head-v8 p{
  margin:0;

  color:rgba(233,238,241,.63);

  font-size:14px;
  line-height:1.7;
}

.mg-reader-timing-group-v8{
  margin-top:22px;
}

.mg-reader-timing-group-v8 > h3{
  margin:0 0 12px!important;

  color:#e8d0a2!important;

  font-size:16px!important;
  line-height:1.5!important;
}


/* Current daewoon */
.mg-reader-timing-overview-v8
.mg-timing-current-v7{
  gap:7px!important;

  margin:0 0 14px!important;
  padding:16px 18px!important;

  border-radius:15px!important;
}

.mg-reader-timing-overview-v8
.mg-timing-current-v7 small{
  font-size:11px!important;
}

.mg-reader-timing-overview-v8
.mg-timing-current-v7 strong{
  font-size:20px!important;
  line-height:1.45!important;
}

.mg-reader-timing-overview-v8
.mg-timing-current-v7 span{
  font-size:13px!important;
  line-height:1.6!important;
}


/* daewoon / annual strips */
.mg-reader-timing-overview-v8
.mg-real-luck-strip,

.mg-reader-timing-overview-v8
.mg-real-annual-strip{
  display:flex!important;

  gap:10px!important;

  overflow-x:auto!important;

  padding:2px 2px 10px!important;

  scroll-snap-type:x proximity;
}

.mg-reader-timing-overview-v8
.mg-real-luck-strip article,

.mg-reader-timing-overview-v8
.mg-real-annual-strip article{
  flex:0 0 auto!important;

  min-width:126px!important;

  padding:15px 14px!important;

  border:
    1px solid
    rgba(255,255,255,.09)!important;

  border-radius:14px!important;

  background:
    rgba(255,255,255,.025)!important;

  scroll-snap-align:start;
}

.mg-reader-timing-overview-v8
.mg-real-luck-strip article strong,

.mg-reader-timing-overview-v8
.mg-real-annual-strip article strong{
  display:block;

  color:#f0d8ab!important;

  font-size:19px!important;
  line-height:1.4!important;
}

.mg-reader-timing-overview-v8
.mg-real-luck-strip article span,

.mg-reader-timing-overview-v8
.mg-real-annual-strip article span{
  display:block;

  margin-top:5px;

  font-size:13px!important;
  line-height:1.5!important;
}

.mg-reader-timing-overview-v8
.mg-real-luck-strip article small,

.mg-reader-timing-overview-v8
.mg-real-annual-strip article small{
  display:block;

  margin-top:6px;

  font-size:11px!important;
  line-height:1.5!important;

  opacity:.66;
}


/* ------------------------------------------------------------
   Reader progress visual spacing
------------------------------------------------------------ */

.mg-life-chapter{
  margin-bottom:3.2rem!important;
}

.mg-life-part{
  padding-top:2rem;
}


/* ============================================================
   MOBILE
============================================================ */

@media(max-width:760px){

  .mg-reading-opening,
  .mg-reading-body,
  .mg-life-chapter-body{
    font-size:17px!important;
    line-height:1.95!important;
  }

  .mg-reading-opening{
    font-size:17.5px!important;
  }

  .mg-life-chapter h3,
  .mg-reader-subhead-v8{
    margin-top:2em!important;

    font-size:20px!important;
    line-height:1.5!important;
  }

  .mg-reader-quote-v8{
    margin:1.5em 0!important;
    padding:16px 17px!important;

    font-size:17.5px!important;
  }

  .mg-reading-mirror,
  .mg-reading-takeaway,
  .mg-reading-chunk-emphasis{
    margin:1.6rem 0!important;
    padding:17px!important;
  }

  .mg-reading-mirror strong,
  .mg-reading-takeaway strong{
    font-size:18px!important;
  }

  .mg-reader-timing-overview-v8{
    margin:20px 0 30px;

    padding:18px 15px;
  }

  .mg-reader-timing-head-v8 h2{
    font-size:22px;
  }

  .mg-reader-timing-overview-v8
  .mg-real-luck-strip article,

  .mg-reader-timing-overview-v8
  .mg-real-annual-strip article{
    min-width:116px!important;
  }

}


/* ============================================================
   MYEONGRIGYEOL_REPORT_READER_VISUAL_V81
   ============================================================ */


/* ------------------------------------------------------------
   실제 leaf text까지 강제 확대
   기존 V8은 부모만 18px이어서,
   하위 .mg-reading-paragraph의 1rem 규칙이 우선될 수 있었다.
------------------------------------------------------------ */

.mg-report-reader-v81 .mg-reading-opening,
.mg-report-reader-v81 .mg-reading-body,
.mg-report-reader-v81 .mg-reading-paragraph,
.mg-report-reader-v81 .mg-reading-chunk-emphasis p,
.mg-report-reader-v81 .mg-reading-details p,
.mg-report-reader-v81 .mg-reading-details li{
  font-size:20px!important;
  line-height:1.95!important;
  letter-spacing:-.018em!important;
  word-break:keep-all!important;
  overflow-wrap:break-word!important;
}


.mg-report-reader-v81 .mg-reading-opening{
  font-size:20.5px!important;
  line-height:1.9!important;
  color:rgba(247,244,237,.94)!important;
}


.mg-report-reader-v81 .mg-reading-paragraph{
  margin:0 0 1.75rem!important;
}


.mg-report-reader-v81 .mg-reading-body{
  margin-top:22px!important;
}


/* ------------------------------------------------------------
   PART 자체를 하나의 읽기 카드처럼 분리
------------------------------------------------------------ */

.mg-report-reader-v81 .mg-life-chapter{
  position:relative;

  margin:0 0 38px!important;
  padding:30px 32px 34px!important;

  border:
    1px solid
    rgba(255,255,255,.075);

  border-radius:22px;

  background:
    linear-gradient(
      145deg,
      rgba(255,255,255,.035),
      rgba(255,255,255,.012)
    );

  box-shadow:
    0 18px 44px
    rgba(0,0,0,.10);
}


.mg-report-reader-v81
.mg-life-chapter:nth-of-type(even){
  background:
    linear-gradient(
      145deg,
      rgba(198,148,72,.055),
      rgba(255,255,255,.012)
    );
}


.mg-report-reader-v81 .mg-life-chapter h3{
  margin:
    5px 0 22px!important;

  color:#f3ddb1!important;

  font-size:
    clamp(
      24px,
      2.2vw,
      31px
    )!important;

  line-height:1.43!important;

  letter-spacing:-.035em!important;
}


.mg-report-reader-v81 .mg-life-chapter-code,
.mg-report-reader-v81 .mg-life-part-head small{
  color:#c7974d!important;
  font-size:12px!important;
  font-weight:800!important;
  letter-spacing:.16em!important;
}


/* ------------------------------------------------------------
   실제 ### 제목
------------------------------------------------------------ */

.mg-reader-subhead-v81{
  position:relative;

  margin:
    42px 0
    18px!important;

  padding-left:18px;

  color:#f7ead0!important;

  font-size:
    clamp(
      21px,
      1.9vw,
      26px
    )!important;

  line-height:1.48!important;

  font-weight:800!important;

  letter-spacing:-.03em!important;
}


.mg-reader-subhead-v81:before{
  content:"";

  position:absolute;

  left:0;
  top:.25em;

  width:4px;
  height:1.15em;

  border-radius:999px;

  background:
    linear-gradient(
      180deg,
      #d8a85e,
      #8f6327
    );
}


/* ------------------------------------------------------------
   강조문
------------------------------------------------------------ */

.mg-reader-quote-v81{
  display:block;

  margin:
    28px 0
    31px!important;

  padding:
    22px 25px!important;

  border:
    1px solid
    rgba(211,164,85,.28);

  border-radius:18px;

  background:
    linear-gradient(
      135deg,
      rgba(211,164,85,.13),
      rgba(255,255,255,.025)
    );

  color:#f5dfb1!important;

  font-size:20px!important;
  line-height:1.8!important;

  font-weight:700!important;

  letter-spacing:-.02em!important;
}


/* ------------------------------------------------------------
   향후 generator가 내보내는 장면/근거 박스
------------------------------------------------------------ */

.mg-reader-note-v81{
  margin:
    20px 0 25px;

  padding:
    17px 20px;

  border-radius:15px;

  font-size:17px;
  line-height:1.75;
}


.mg-reader-note-v81 strong{
  display:block;

  margin-bottom:6px;

  color:#dbb36f;

  font-size:12px;

  letter-spacing:.11em;
}


.mg-reader-note-v81.scene{
  border:
    1px solid
    rgba(255,255,255,.08);

  background:
    rgba(255,255,255,.035);
}


.mg-reader-note-v81.evidence{
  border:
    1px solid
    rgba(203,154,76,.20);

  background:
    rgba(203,154,76,.055);
}


/* ============================================================
   SAJU DASHBOARD
   ============================================================ */

.mg-saju-dashboard-v81{
  margin:
    18px 0
    42px;

  padding:
    27px;

  border:
    1px solid
    rgba(210,163,82,.28);

  border-radius:22px;

  background:
    radial-gradient(
      circle at top right,
      rgba(205,157,76,.10),
      transparent 38%
    ),
    linear-gradient(
      145deg,
      rgba(255,255,255,.035),
      rgba(5,15,22,.48)
    );

  box-shadow:
    0 20px 55px
    rgba(0,0,0,.13);
}


.mg-saju-dashboard-head-v81{
  display:flex;

  align-items:flex-end;
  justify-content:space-between;

  gap:15px;

  margin-bottom:23px;

  padding-bottom:18px;

  border-bottom:
    1px solid
    rgba(255,255,255,.075);
}


.mg-saju-dashboard-head-v81 small{
  display:block;

  margin-bottom:6px;

  color:#c7974d;

  font-size:11px;
  font-weight:850;

  letter-spacing:.17em;
}


.mg-saju-dashboard-head-v81 h2{
  margin:0;

  color:#f4dfb7;

  font-size:
    clamp(
      25px,
      2.6vw,
      34px
    );

  line-height:1.3;
}


.mg-saju-dashboard-head-v81 p{
  max-width:430px;

  margin:0;

  color:
    rgba(233,238,241,.55);

  font-size:13px;
  line-height:1.65;

  text-align:right;
}


.mg-saju-chart-clone-v81{
  font-size:16px!important;
}


/* clone된 기존 원국판의 typography 확대 */
.mg-saju-chart-clone-v81 strong{
  font-size:
    1.08em;
}


.mg-saju-chart-clone-v81 section{
  margin-top:18px;
}


/* ============================================================
   TIMING BOARD
   ============================================================ */

.mg-report-reader-v81
.mg-reader-timing-overview-v8{
  margin:
    0 0 43px!important;

  padding:
    27px!important;

  border-radius:22px!important;
}


.mg-report-reader-v81
.mg-reader-timing-head-v8 h2{
  font-size:28px!important;
}


.mg-report-reader-v81
.mg-timing-current-v7 strong{
  font-size:22px!important;
}


/* ============================================================
   SUMMARY CARDS
   ============================================================ */

.mg-report-reader-v81
.mg-reading-mirror,

.mg-report-reader-v81
.mg-reading-takeaway,

.mg-report-reader-v81
.mg-reading-chunk-emphasis{
  margin:
    28px 0!important;

  padding:
    21px 23px!important;

  border-radius:18px!important;
}


.mg-report-reader-v81
.mg-reading-mirror strong,

.mg-report-reader-v81
.mg-reading-takeaway strong{
  font-size:20px!important;
  line-height:1.75!important;
}


/* ============================================================
   MOBILE
   ============================================================ */

@media(max-width:760px){

  .mg-report-reader-v81 .mg-reading-opening,
  .mg-report-reader-v81 .mg-reading-body,
  .mg-report-reader-v81 .mg-reading-paragraph,
  .mg-report-reader-v81 .mg-reading-chunk-emphasis p,
  .mg-report-reader-v81 .mg-reading-details p,
  .mg-report-reader-v81 .mg-reading-details li{
    font-size:18px!important;
    line-height:1.9!important;
  }


  .mg-report-reader-v81 .mg-life-chapter{
    margin-bottom:24px!important;

    padding:
      23px 18px
      27px!important;

    border-radius:18px;
  }


  .mg-report-reader-v81 .mg-life-chapter h3{
    font-size:
      23px!important;
  }


  .mg-reader-subhead-v81{
    margin-top:34px!important;

    font-size:20px!important;
  }


  .mg-reader-quote-v81{
    margin:
      23px 0!important;

    padding:
      18px!important;

    font-size:
      18px!important;
  }


  .mg-saju-dashboard-v81,
  .mg-report-reader-v81
  .mg-reader-timing-overview-v8{
    margin-bottom:28px!important;

    padding:
      19px 15px!important;

    border-radius:18px!important;
  }


  .mg-saju-dashboard-head-v81{
    display:block;
  }


  .mg-saju-dashboard-head-v81 p{
    margin-top:9px;

    text-align:left;
  }

}


/* ============================================================
   REPORT_READER_REAL_V82
   실제 4,900P 저장 리포트
   ============================================================ */


/* ------------------------------------------------------------
   Reader width / header
------------------------------------------------------------ */

#mgMyReader.mg-report-reader-v82{
  scroll-behavior:smooth;
}


#mgMyReader.mg-report-reader-v82
.mg-my-reader-head{
  margin-bottom:24px!important;
}


#mgMyReader.mg-report-reader-v82
.mg-my-reader-head h3{
  margin-top:7px!important;

  font-size:
    clamp(
      27px,
      3vw,
      38px
    )!important;

  line-height:1.28!important;

  letter-spacing:-.035em!important;
}


#mgMyReader.mg-report-reader-v82
.mg-my-report-meta{
  margin-top:9px!important;

  font-size:13px!important;

  opacity:.65!important;
}


/* ============================================================
   REPORT MAP
============================================================ */

#mgMyReader
.mg-report-overview-v82{
  position:relative;

  overflow:hidden;

  margin:
    12px 0
    34px;

  padding:
    28px;

  border:
    1px solid
    rgba(205,158,79,.30);

  border-radius:22px;

  background:
    radial-gradient(
      circle at 88% 0%,
      rgba(208,159,77,.14),
      transparent 32%
    ),
    linear-gradient(
      145deg,
      rgba(255,255,255,.045),
      rgba(5,16,23,.40)
    );

  box-shadow:
    0 20px 54px
    rgba(0,0,0,.13);
}


#mgMyReader
.mg-report-overview-head-v82{
  display:flex;

  align-items:flex-end;
  justify-content:space-between;

  gap:30px;

  margin-bottom:24px;

  padding-bottom:19px;

  border-bottom:
    1px solid
    rgba(255,255,255,.08);
}


#mgMyReader
.mg-report-overview-head-v82 small{
  display:block;

  margin-bottom:6px;

  color:#c99a51;

  font-size:10px;
  font-weight:850;

  letter-spacing:.18em;
}


#mgMyReader
.mg-report-overview-head-v82 h2{
  margin:0;

  color:#f4dfb5;

  font-size:
    clamp(
      25px,
      2.5vw,
      34px
    );

  line-height:1.3;

  letter-spacing:-.035em;
}


#mgMyReader
.mg-report-overview-head-v82 p{
  max-width:410px;

  margin:0;

  color:
    rgba(233,238,241,.62);

  font-size:14px;
  line-height:1.72;

  word-break:keep-all;
}


#mgMyReader
.mg-report-zone-grid-v82{
  display:grid;

  grid-template-columns:
    repeat(
      4,
      minmax(0,1fr)
    );

  gap:11px;

  margin-bottom:23px;
}


#mgMyReader
.mg-report-zone-grid-v82 article{
  position:relative;

  min-height:118px;

  padding:
    16px;

  border:
    1px solid
    rgba(255,255,255,.08);

  border-radius:16px;

  background:
    rgba(255,255,255,.028);
}


#mgMyReader
.mg-report-zone-grid-v82 article b{
  position:absolute;

  right:13px;
  top:8px;

  color:
    rgba(207,163,91,.15);

  font-size:32px;
  font-weight:500;
}


#mgMyReader
.mg-report-zone-grid-v82 article small{
  display:block;

  color:#b98b49;

  font-size:9px;
  font-weight:800;

  letter-spacing:.13em;
}


#mgMyReader
.mg-report-zone-grid-v82 article strong{
  display:block;

  margin-top:22px;

  color:#f0e2c4;

  font-size:15px;
  line-height:1.5;

  word-break:keep-all;
}


#mgMyReader
.mg-report-zone-grid-v82 article span{
  display:block;

  margin-top:5px;

  color:
    rgba(224,231,234,.47);

  font-size:11px;
}


#mgMyReader
.mg-report-toc-v82{
  display:grid;

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

  gap:8px;
}


#mgMyReader
.mg-report-toc-v82 a{
  display:flex;

  align-items:center;

  gap:13px;

  min-width:0;

  padding:
    12px 14px;

  border:
    1px solid
    rgba(255,255,255,.07);

  border-radius:13px;

  background:
    rgba(255,255,255,.022);

  color:inherit;

  text-decoration:none;

  transition:
    transform .15s ease,
    border-color .15s ease,
    background .15s ease;
}


#mgMyReader
.mg-report-toc-v82 a:hover{
  transform:
    translateY(-1px);

  border-color:
    rgba(205,158,79,.35);

  background:
    rgba(205,158,79,.055);
}


#mgMyReader
.mg-report-toc-v82 a small{
  flex:0 0 auto;

  color:#a77a3d;

  font-size:10px;
  font-weight:800;
}


#mgMyReader
.mg-report-toc-v82 a strong{
  overflow:hidden;

  color:
    rgba(240,239,234,.82);

  font-size:13px;

  font-weight:650;

  text-overflow:ellipsis;
  white-space:nowrap;
}


#mgMyReader
.mg-report-toc-v82
a.is-daewoon,

#mgMyReader
.mg-report-toc-v82
a.is-sewoon,

#mgMyReader
.mg-report-toc-v82
a.is-answer{
  border-color:
    rgba(203,154,76,.20);

  background:
    rgba(203,154,76,.045);
}


/* ============================================================
   REAL REPORT BLOCKS
============================================================ */

#mgMyReader.mg-report-reader-v82
.mg-my-block{
  position:relative;

  scroll-margin-top:24px;

  margin:
    0 0
    32px!important;

  padding:
    30px 31px
    34px!important;

  border:
    1px solid
    rgba(255,255,255,.075)!important;

  border-radius:
    21px!important;

  background:
    linear-gradient(
      145deg,
      rgba(255,255,255,.033),
      rgba(255,255,255,.012)
    )!important;

  box-shadow:
    0 16px 40px
    rgba(0,0,0,.08);
}


#mgMyReader.mg-report-reader-v82
.mg-my-block:nth-of-type(even){
  background:
    radial-gradient(
      circle at 100% 0%,
      rgba(199,149,72,.055),
      transparent 30%
    ),
    linear-gradient(
      145deg,
      rgba(255,255,255,.03),
      rgba(255,255,255,.012)
    )!important;
}


#mgMyReader.mg-report-reader-v82
.mg-my-block-label{
  margin-bottom:9px!important;

  color:#b98945!important;

  font-size:10px!important;
  font-weight:850!important;

  letter-spacing:.16em!important;
}


#mgMyReader.mg-report-reader-v82
.mg-my-block > h4{
  margin:
    0 0
    24px!important;

  max-width:860px;

  color:#f2dfb8!important;

  font-size:
    clamp(
      23px,
      2.2vw,
      30px
    )!important;

  line-height:1.43!important;

  font-weight:800!important;

  letter-spacing:-.035em!important;

  word-break:keep-all!important;
}


/* ============================================================
   REAL BODY FONT
============================================================ */

#mgMyReader.mg-report-reader-v82
.mg-reading-opening,

#mgMyReader.mg-report-reader-v82
.mg-reading-body,

#mgMyReader.mg-report-reader-v82
.mg-reading-paragraph,

#mgMyReader.mg-report-reader-v82
.mg-reading-chunk-emphasis p,

#mgMyReader.mg-report-reader-v82
.mg-reading-details p,

#mgMyReader.mg-report-reader-v82
.mg-reading-details li{
  color:
    rgba(241,243,243,.88)!important;

  font-size:
    20px!important;

  line-height:
    1.95!important;

  letter-spacing:
    -.018em!important;

  word-break:
    keep-all!important;

  overflow-wrap:
    break-word!important;
}


#mgMyReader.mg-report-reader-v82
.mg-reading-opening{
  color:
    rgba(248,244,235,.94)!important;

  font-size:
    20.5px!important;

  line-height:
    1.9!important;

  font-weight:
    600!important;
}


#mgMyReader.mg-report-reader-v82
.mg-reading-paragraph{
  margin:
    0 0
    1.75rem!important;
}


/* ============================================================
   REAL ### SUBHEAD
============================================================ */

#mgMyReader
.mg-reading-subhead-v82{
  position:relative;

  margin:
    39px 0
    18px!important;

  padding-left:
    17px;

  color:
    #f6e6c7!important;

  font-size:
    23px!important;

  line-height:
    1.48!important;

  font-weight:
    800!important;

  letter-spacing:
    -.03em!important;

  word-break:
    keep-all!important;
}


#mgMyReader
.mg-reading-subhead-v82:before{
  content:"";

  position:absolute;

  left:0;
  top:.22em;

  width:4px;
  height:1.25em;

  border-radius:999px;

  background:
    linear-gradient(
      180deg,
      #d4a357,
      #8c6024
    );
}


/* ============================================================
   REAL > QUOTE
============================================================ */

#mgMyReader
.mg-reading-impact-v82{
  margin:
    26px 0
    30px!important;

  padding:
    20px 23px!important;

  border:
    1px solid
    rgba(210,162,81,.30);

  border-radius:
    17px;

  background:
    linear-gradient(
      135deg,
      rgba(208,158,77,.13),
      rgba(255,255,255,.024)
    );

  color:
    #f3deb4!important;

  font-size:
    20px!important;

  line-height:
    1.8!important;

  font-weight:
    700!important;

  letter-spacing:
    -.02em!important;
}


/* ============================================================
   EXISTING READER COMPONENTS
============================================================ */

#mgMyReader.mg-report-reader-v82
.mg-reading-mirror,

#mgMyReader.mg-report-reader-v82
.mg-reading-takeaway,

#mgMyReader.mg-report-reader-v82
.mg-reading-chunk-emphasis{
  margin:
    27px 0!important;

  padding:
    20px 22px!important;

  border-radius:
    17px!important;
}


#mgMyReader.mg-report-reader-v82
.mg-reading-mirror small,

#mgMyReader.mg-report-reader-v82
.mg-reading-takeaway small,

#mgMyReader.mg-report-reader-v82
.mg-reading-chunk-emphasis small{
  font-size:
    11px!important;

  letter-spacing:
    .10em!important;
}


#mgMyReader.mg-report-reader-v82
.mg-reading-mirror strong,

#mgMyReader.mg-report-reader-v82
.mg-reading-takeaway strong{
  font-size:
    21px!important;

  line-height:
    1.72!important;
}


#mgMyReader.mg-report-reader-v82
.mg-reading-details{
  margin:
    27px 0!important;

  padding:
    18px 20px!important;
}


#mgMyReader.mg-report-reader-v82
.mg-reading-details summary{
  font-size:
    16px!important;

  line-height:
    1.55!important;
}


/* ============================================================
   MOBILE
============================================================ */

@media(max-width:760px){

  #mgMyReader
  .mg-report-overview-v82{
    margin-bottom:
      24px;

    padding:
      19px 15px;

    border-radius:
      18px;
  }


  #mgMyReader
  .mg-report-overview-head-v82{
    display:block;
  }


  #mgMyReader
  .mg-report-overview-head-v82 p{
    margin-top:
      10px;
  }


  #mgMyReader
  .mg-report-zone-grid-v82{
    grid-template-columns:
      repeat(
        2,
        minmax(0,1fr)
      );
  }


  #mgMyReader
  .mg-report-toc-v82{
    grid-template-columns:
      1fr;
  }


  #mgMyReader.mg-report-reader-v82
  .mg-my-block{
    margin-bottom:
      22px!important;

    padding:
      23px 18px
      27px!important;

    border-radius:
      18px!important;
  }


  #mgMyReader.mg-report-reader-v82
  .mg-my-block > h4{
    font-size:
      22px!important;
  }


  #mgMyReader.mg-report-reader-v82
  .mg-reading-opening,

  #mgMyReader.mg-report-reader-v82
  .mg-reading-body,

  #mgMyReader.mg-report-reader-v82
  .mg-reading-paragraph,

  #mgMyReader.mg-report-reader-v82
  .mg-reading-chunk-emphasis p,

  #mgMyReader.mg-report-reader-v82
  .mg-reading-details p,

  #mgMyReader.mg-report-reader-v82
  .mg-reading-details li{
    font-size:
      18px!important;

    line-height:
      1.9!important;
  }


  #mgMyReader
  .mg-reading-subhead-v82{
    margin-top:
      31px!important;

    font-size:
      20px!important;
  }


  #mgMyReader
  .mg-reading-impact-v82{
    font-size:
      18px!important;

    padding:
      17px!important;
  }

}
