/* V24 — 천기해독·천명개벽록 시각 해설 계층 */
:root {
  --v24-void:#050508;
  --v24-ink:#0a080d;
  --v24-purple:#291746;
  --v24-violet:#8c63ff;
  --v24-silver:#d9dbe5;
  --v24-ivory:#f2ead8;
  --v24-gold:#d6aa55;
}

body.v16-flow.page-app,
body.v16-flow.page-report {
  background:
    radial-gradient(circle at 50% 0, rgba(92,48,148,.2), transparent 35rem),
    #050508;
}

/* 천기해독: 이미지를 먼저 보고, 그 다음 쉬운 문장으로 읽는다. */
body.v16-flow.page-app #interpretation {
  display:grid;
  gap:20px;
}

body.v16-flow.page-app #result .plain-reading {
  padding:0 0 22px;
  overflow:hidden;
  border:1px solid rgba(215,177,99,.38);
  border-radius:3px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.98), rgba(242,234,216,.98)),
    var(--v24-ivory);
  box-shadow:0 22px 64px rgba(0,0,0,.45), inset 0 0 0 1px rgba(255,255,255,.45);
}

body.v16-flow.page-app #result .plain-reading::after { top:228px; }

.interpret-visual {
  position:relative;
  z-index:2;
  width:100%;
  margin:0 0 21px;
  aspect-ratio:2.2 / 1;
  overflow:hidden;
  background:#09060e;
}

.interpret-visual::after {
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(180deg, transparent 45%, rgba(3,2,7,.72));
  box-shadow:inset 0 0 34px rgba(0,0,0,.7);
}

.interpret-visual img {
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  transform:scale(1.015);
}

.interpret-visual figcaption {
  position:absolute;
  z-index:3;
  left:18px;
  right:18px;
  bottom:14px;
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  color:white;
  text-shadow:0 2px 15px #000;
}

.interpret-visual figcaption span {
  font:700 42px/1 "Song Myung",serif;
  color:#eee8ff;
}

.interpret-visual figcaption small {
  max-width:72%;
  text-align:right;
  font:500 11px/1.5 "Noto Sans KR",sans-serif;
  letter-spacing:.08em;
  color:rgba(255,255,255,.82);
}

.plain-reading > :not(.interpret-visual) { margin-left:20px!important; margin-right:20px!important; }
.plain-reading .sec-top { margin-top:0!important; }
.plain-reading .sec-headline { font-family:"Gowun Batang","Noto Sans KR",serif!important; }

.symbol-decree {
  margin-top:-2px!important;
  padding:13px 14px;
  border:1px solid rgba(83,45,125,.22);
  background:linear-gradient(120deg, rgba(48,22,75,.08), rgba(140,99,255,.04));
  color:#25182f;
  font:700 15px/1.65 "Gowun Batang",serif;
}

.symbol-decree small {
  display:block;
  margin-top:4px;
  color:#75657d;
  font:500 11px/1.55 "Noto Sans KR",sans-serif;
}

.idiom-list { display:grid; gap:7px; margin-top:13px!important; }
.idiom-note { margin:0!important; border:1px solid rgba(93,57,112,.16); background:rgba(255,255,255,.52); }
.idiom-note summary {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:9px 11px;
  cursor:pointer;
  list-style:none;
  color:#45364e!important;
  font:700 12px/1.4 "Noto Sans KR",sans-serif;
}
.idiom-note summary::-webkit-details-marker { display:none; }
.idiom-note summary i {
  display:grid;
  place-items:center;
  flex:0 0 20px;
  height:20px;
  border-radius:50%;
  background:#24122f;
  color:#dec7ff;
  font:700 11px/1 sans-serif;
}
.idiom-note p { margin:0!important; padding:0 11px 10px; color:#6c5d70!important; }

/* 접어둔 명리표의 왼쪽 상징판 */
.technical-element-hero {
  display:grid;
  grid-template-columns:104px 1fr;
  gap:16px;
  align-items:center;
  margin:15px 0 18px;
  padding:14px;
  border:1px solid rgba(212,170,85,.35);
  background:linear-gradient(135deg,#0c080e,#160a12);
}
.technical-element-sigil {
  position:relative;
  width:104px;
  height:104px;
  overflow:hidden;
  border:1px solid rgba(223,182,90,.72);
  border-radius:50%;
  box-shadow:0 0 30px rgba(126,55,114,.25);
}
.technical-element-sigil img { width:100%; height:100%; object-fit:cover; filter:saturate(.85) contrast(1.12) brightness(.72); }
.technical-element-sigil::after { content:""; position:absolute; inset:0; background:radial-gradient(circle,transparent 20%,rgba(0,0,0,.48)); }
.technical-element-sigil b {
  position:absolute;
  z-index:2;
  inset:0;
  display:grid;
  place-items:center;
  color:#f2d991;
  font:700 48px/1 "Song Myung",serif;
  text-shadow:0 0 18px rgba(255,193,90,.7),0 2px 4px #000;
}
.technical-element-copy small { display:block; margin-bottom:7px; color:#b28f58; letter-spacing:.13em; font-size:10px; }
.technical-element-copy strong { display:block; color:#f3ead9; font:700 20px/1.45 "Song Myung",serif; }
.technical-element-copy p { margin:7px 0 0!important; color:#a9a1ad!important; font-size:12px!important; line-height:1.65!important; }

/* 천명개벽록 */
body.page-report .wrap { max-width:480px; padding:0 0 88px; }
body.page-report .cover,
body.page-report .toc,
body.page-report .page,
body.page-report .destiny-conversion { border-color:rgba(211,170,88,.34); }

body.page-report .toc {
  padding:28px 18px;
  background:linear-gradient(150deg,#0b0710,#15101d 55%,#08070b);
  color:var(--v24-silver);
}
body.page-report .toc h2 { color:#f0e7d6; }
.toc-chapter { margin:0 0 9px; border:1px solid rgba(190,162,213,.16); background:rgba(255,255,255,.025); }
.toc-chapter summary {
  display:grid;
  grid-template-columns:44px 1fr auto;
  gap:10px;
  align-items:center;
  padding:13px;
  cursor:pointer;
  list-style:none;
}
.toc-chapter summary::-webkit-details-marker { display:none; }
.toc-chapter .toc-hanja { color:#d8b96f; font:700 29px/1 "Song Myung",serif; text-align:center; }
.toc-chapter summary b { display:block; color:#eee8f3; font:700 13px/1.45 "Noto Sans KR",sans-serif; }
.toc-chapter summary small { display:block; margin-top:2px; color:#857d8d; font-size:10px; }
.toc-chapter .toc-state { color:#b69ad7; font-size:10px; }
.toc-items { padding:0 12px 11px; border-top:1px solid rgba(255,255,255,.06); }
.toc-item {
  display:grid;
  grid-template-columns:26px 1fr auto;
  gap:7px;
  padding:8px 2px;
  border-bottom:1px solid rgba(255,255,255,.045);
  color:#aba4b2;
  font-size:11px;
}
.toc-item em { color:#71677a; font-style:normal; }
.toc-item .mini-lock { color:#79618c; }
.locked-preview .locked-chapter { margin:0; border:0; }
.locked-preview .locked-chapter > .locked-row { cursor:pointer; list-style:none; }
.locked-preview .locked-chapter > .locked-row::-webkit-details-marker { display:none; }
.locked-preview .locked-chapter > .locked-row .lock::after { content:" ＋"; }
.locked-preview .locked-chapter[open] > .locked-row .lock::after { content:" －"; }
.locked-preview .locked-chapter[open] > .locked-row { border-color:rgba(213,184,120,.3); }
.locked-preview .locked-items { padding:2px 11px 9px; border:1px solid rgba(213,184,120,.14); border-top:0; background:#0a0c0e; }
.locked-preview .locked-title { display:grid; grid-template-columns:30px minmax(0,1fr) auto; gap:8px; padding:8px 0; border-bottom:1px solid rgba(255,255,255,.055); color:#aaa59b; font-size:10.5px; line-height:1.45; }
.locked-preview .locked-title:last-child { border-bottom:0; }
.locked-preview .locked-title em { color:#6f685c; font-style:normal; }
.locked-preview .locked-title i { color:#79618c; font-style:normal; }

body.page-report .page {
  padding:0 0 25px;
  overflow:hidden;
  background:linear-gradient(180deg,#f6f0e4,#ede2cf);
  box-shadow:0 20px 60px rgba(0,0,0,.4);
}
.report-visual {
  position:relative;
  width:100%;
  aspect-ratio:2.2/1;
  margin:0 0 22px;
  overflow:hidden;
  background:#09060e;
}
.report-visual img { width:100%; height:100%; display:block; object-fit:cover; }
.report-visual::after { content:""; position:absolute; inset:0; background:linear-gradient(90deg,rgba(0,0,0,.06),rgba(0,0,0,.02)),linear-gradient(180deg,transparent 44%,rgba(2,1,4,.82)); }
.report-visual figcaption { position:absolute; z-index:2; inset:auto 17px 14px; display:flex; align-items:flex-end; justify-content:space-between; gap:15px; color:white; }
.report-visual .image-hanja { color:#eee8ff; font:700 46px/1 "Song Myung",serif; text-shadow:0 0 22px #6c3de5; }
.report-visual figcaption span:last-child { text-align:right; }
.report-visual small { display:block; color:#bda4dc; font-size:9px; letter-spacing:.1em; }
.report-visual b { display:block; max-width:270px; margin-top:3px; color:#fff; font:700 13px/1.45 "Gowun Batang",serif; }
body.page-report .page > :not(.report-visual) { margin-left:20px; margin-right:20px; }
body.page-report .page > .no { margin-left:0; margin-right:0; }
.report-summary { padding:14px; border-left:3px solid #7651a4; background:rgba(255,255,255,.48); color:#352d39; font-size:14px; line-height:1.75; }
.report-summary b { display:block; margin-bottom:4px; color:#5a326f; font-size:11px; }
.report-deep { margin-top:12px!important; border-top:1px solid rgba(80,56,73,.14); }
.report-deep summary { padding:11px 0; cursor:pointer; color:#736678; font-size:11px; }
.report-deep p { margin:0!important; color:#51484e!important; font-size:12px!important; line-height:1.72!important; }

/* 3문답: 결제 직전의 개인화 의식 */
.survey-box {
  border:1px solid rgba(204,167,97,.52)!important;
  background:
    radial-gradient(circle at 50% 0,rgba(127,78,196,.35),transparent 42%),
    linear-gradient(160deg,#0b0710,#171020)!important;
  box-shadow:0 30px 90px rgba(0,0,0,.72),inset 0 0 60px rgba(110,65,157,.1)!important;
}
.survey-kicker { color:#c7a964!important; }
.survey-box h3 { color:#f4ecde!important; font-family:"Song Myung",serif!important; }
.survey-help { color:#aaa0b2!important; }
.survey-options { gap:10px!important; }
.survey-options button {
  position:relative;
  display:grid!important;
  grid-template-columns:44px 1fr 22px;
  align-items:center;
  gap:10px;
  min-height:64px;
  border:1px solid rgba(185,147,218,.22)!important;
  background:linear-gradient(100deg,rgba(255,255,255,.035),rgba(114,69,157,.08))!important;
  color:#eee8f3!important;
}
.survey-options button:hover { border-color:#b58aea!important; transform:none; }
.survey-options .survey-symbol { color:#d5b86d; font:700 27px/1 "Song Myung",serif; text-align:center; }
.survey-options .survey-label { text-align:left; font-weight:700; }
.survey-options .survey-arrow { color:#806c8b; }

/* 가격은 실제 29,000원만 공개한다. 카운트는 선택 초점 임시 보존 시간이다. */
#unlock .box.v24-payment-box {
  width:min(448px,calc(100vw - 24px));
  max-height:calc(100vh - 24px);
  padding:0 0 20px;
  overflow:auto;
  border:1px solid rgba(213,172,88,.52);
  background:linear-gradient(180deg,#09060e,#110b16);
  color:#eee7f1;
  box-shadow:0 35px 100px rgba(0,0,0,.85),inset 0 0 60px rgba(100,55,145,.08);
}
.payment-scene { position:relative; width:100%; margin:0 0 20px; aspect-ratio:2.2/1; overflow:hidden; }
.payment-scene img { width:100%; height:100%; object-fit:cover; display:block; }
.payment-scene::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,transparent 48%,#09060e); }
.payment-scene span { position:absolute; z-index:2; right:17px; bottom:14px; color:#eee9f4; font:700 13px/1.5 "Gowun Batang",serif; }
.v24-payment-box > :not(.payment-scene) { margin-left:20px; margin-right:20px; }
.v24-payment-box h4 { color:#f2ead9!important; font-family:"Song Myung",serif!important; }
.v24-payment-box .desc { color:#a9a0af!important; }
.sealed-price {
  margin-top:17px!important;
  padding:16px;
  border:1px solid rgba(199,162,85,.37);
  background:linear-gradient(120deg,rgba(137,85,189,.13),rgba(211,170,85,.06));
  text-align:center;
}
.sealed-price span { display:block; color:#a98d59; font-size:10px; letter-spacing:.17em; }
.sealed-price strong { display:block; margin:6px 0 2px; color:#efe7f5; font:700 31px/1.2 "Song Myung",serif; letter-spacing:.08em; }
.sealed-price.revealed strong { color:#e0bd65; text-shadow:0 0 24px rgba(208,157,72,.28); animation:v24PriceReveal .7s ease both; }
.sealed-price small { color:#756e79; font-size:9px; }
@keyframes v24PriceReveal { from { opacity:.2; filter:blur(8px); transform:scale(.94); } to { opacity:1; filter:blur(0); transform:scale(1); } }
.focus-hold { display:flex; justify-content:space-between; align-items:center; margin-top:10px!important; padding:10px 12px; border:1px solid rgba(255,255,255,.08); color:#8f8793; font-size:10px; }
.focus-hold b { color:#ccb2ec; font:700 18px/1 monospace; }
.use-scenes { margin-top:16px!important; }
.use-scenes h5 { margin:0 0 9px; color:#d3b76e; font-size:11px; letter-spacing:.08em; }
.use-scene-grid { display:grid; grid-template-columns:1fr 1fr; gap:7px; }
.use-scene-grid div { padding:10px; border:1px solid rgba(255,255,255,.07); background:rgba(255,255,255,.025); }
.use-scene-grid b { display:block; margin-bottom:3px; color:#ddd4e2; font-size:11px; }
.use-scene-grid small { color:#837b88; font-size:9px; line-height:1.45; }
.review-status { margin-top:9px!important; color:#6f6872!important; font-size:9px!important; text-align:left!important; }

@media (prefers-reduced-motion:reduce) {
  .sealed-price.revealed strong { animation:none; }
  .survey-options button { transition:none!important; }
}

@media (max-width:390px) {
  .plain-reading > :not(.interpret-visual), body.page-report .page > :not(.report-visual) { margin-left:15px!important; margin-right:15px!important; }
  .technical-element-hero { grid-template-columns:82px 1fr; }
  .technical-element-sigil { width:82px; height:82px; }
  .technical-element-sigil b { font-size:38px; }
  .use-scene-grid { grid-template-columns:1fr; }
}
