/* И-Цзин app поверх oracle-cards-shell */
body.ic-page.tr-page{
  --tr-accent:#c2410c;
  --tr-accent2:#9a3412;
  --tr-border:#fed7aa;
}
body.ic-page.tr-page:not(.mv-app-page){
  background:
    radial-gradient(900px 420px at 12% -5%,rgba(194,65,12,.1),transparent 55%),
    linear-gradient(180deg,#fffaf5 0%,#faf6f0 100%);
}
.ic-page .tr-label{color:#9a3412;}
.ic-page .tr-spread.is-active,
.ic-page .tr-spread:hover{background:#fff7ed;border-color:#fdba74;box-shadow:0 10px 24px rgba(194,65,12,.1);}
.ic-page .tr-focus-chip.is-active{background:#fff7ed;border-color:#fdba74;box-shadow:0 0 0 3px rgba(194,65,12,.1);}
.ic-page .tr-btn{background:linear-gradient(135deg,#c2410c,#ea580c 55%,#f97316);box-shadow:0 8px 24px rgba(194,65,12,.25);}
.ic-page .tr-oracle-body{margin:0 0 16px;}
.ic-page .tr-oracle-body .mv-iching-table{max-width:100%;}
.ic-page .tr-interp-cta-actions .tr-btn-ghost{
  background:#fff;
  color:#431407;
  border:1.5px solid #fdba74;
  box-shadow:0 2px 8px rgba(194,65,12,.08);
}

/* ============================================================
   Визуальное усиление: секции, подсказки, интерактив
   Только для body.ic-page — не затрагивает другие оракулы.
   ============================================================ */

/* --- Общий фон и "воздух" между блоками --- */
body.ic-page.tr-page{
  --ic-panel-bg:#fffdf9;
  --ic-panel-border:#f3d9b8;
}
body.ic-page .tr-wrap{
  padding-top:6px;
}
body.mv-app-page.ic-page.tr-page .tr-wrap{
  border-color:#f2e2ca;
  box-shadow:0 14px 34px rgba(154,52,18,.07);
}

/* --- Заголовки секций: цветной акцент слева + больше воздуха --- */
body.ic-page .tr-wrap > .tr-label,
body.ic-page .tr-panel > .tr-label{
  position:relative;
  padding-left:16px;
  margin-top:30px;
  margin-bottom:14px;
  font-size:12.5px;
  font-weight:800;
}
body.ic-page .tr-wrap > .tr-label:first-of-type{
  margin-top:4px;
}
body.ic-page .tr-wrap > .tr-label::before,
body.ic-page .tr-panel > .tr-label::before{
  content:'';
  position:absolute;
  left:0;
  top:1px;
  bottom:1px;
  width:4px;
  border-radius:3px;
  background:linear-gradient(180deg,var(--ic-cin,#c2410c),var(--ic-jade,#2d6a4f));
}

/* --- Карточки форматов: отделены друг от друга, живой hover --- */
body.ic-page .tr-spreads{
  padding:16px;
  border-radius:20px;
  background:linear-gradient(165deg,#fffaf3 0%,#fdf3e7 100%);
  border:1px solid var(--ic-panel-border);
  margin-bottom:24px;
}
body.ic-page .tr-spread{
  background:#fff;
  border-width:1.5px;
  transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;
}
body.ic-page .tr-spread:hover{
  transform:translateY(-3px);
  box-shadow:0 14px 28px rgba(194,65,12,.16);
}
body.ic-page .tr-spread.is-active{
  transform:translateY(-2px);
  box-shadow:0 12px 26px rgba(194,65,12,.2);
}
body.ic-page .tr-spread-icon{
  transition:transform .25s ease;
}
body.ic-page .tr-spread:hover .tr-spread-icon{
  transform:scale(1.15) rotate(-4deg);
}

/* --- Сфера вопроса: чипы с более заметным активным состоянием --- */
body.ic-page .tr-focus-row{
  padding:14px 16px;
  border-radius:18px;
  background:#fffaf3;
  border:1px solid var(--ic-panel-border);
  margin-bottom:8px;
}
body.ic-page .tr-focus-chip{
  transition:transform .15s ease,box-shadow .15s ease,border-color .15s ease,background .15s ease;
}
body.ic-page .tr-focus-chip:hover{
  border-color:#fdba74;
  background:#fff7ed;
  transform:translateY(-1px);
}
body.ic-page .tr-focus-chip.is-active{
  box-shadow:0 0 0 3px rgba(194,65,12,.16);
  font-weight:800;
}

/* --- Панель вопроса: явная карточка со своей тенью --- */
body.ic-page .tr-panel{
  background:var(--ic-panel-bg);
  border-color:var(--ic-panel-border);
  box-shadow:0 10px 28px rgba(154,52,18,.08);
}
body.ic-page .tr-q:focus{
  border-color:var(--ic-cin,#c2410c);
  box-shadow:0 0 0 4px rgba(194,65,12,.14);
}
body.ic-page .tr-btn{
  letter-spacing:.01em;
  transition:transform .15s ease,filter .15s ease,box-shadow .15s ease;
}
body.ic-page .tr-btn:hover{
  transform:translateY(-2px);
  box-shadow:0 12px 30px rgba(194,65,12,.32);
}
body.ic-page .tr-btn:active{
  transform:translateY(0);
}

/* --- Результат: заметнее выделен на фоне остальной страницы --- */
body.ic-page .tr-result{
  padding-top:18px;
  border-top:1.5px dashed var(--ic-panel-border);
}
body.ic-page .tr-result-head h2{
  color:var(--ic-ink,#1a1a2e);
}
body.ic-page .tr-interp,
body.ic-page .tr-interp-cta{
  border-color:var(--ic-panel-border);
}
body.ic-page .tr-interp-cta.tr-master-cta{
  border-color:#fdba74;
  box-shadow:0 12px 32px rgba(194,65,12,.12);
}

/* --- История раскладов: отделяем чёткой рамкой-карточкой --- */
body.ic-page .tr-history{
  margin-top:40px;
  padding:20px 18px 4px;
  border-top:none;
  border-radius:18px;
  background:#fffaf3;
  border:1px solid var(--ic-panel-border);
}
body.ic-page .tr-hist-item{
  background:#fff;
}
body.ic-page .tr-hist-item:hover{
  border-color:#fdba74;
  background:#fff7ed;
}
body.ic-page .tr-hist-badge{
  background:#fff1e2;
  color:var(--ic-cin,#c2410c);
}

/* --- Баннер доступа --- */
body.ic-page .tr-access-banner{
  border-color:#fdba74;
  background:linear-gradient(135deg,#fff7ed,#fff);
  box-shadow:0 8px 22px rgba(194,65,12,.08);
}
body.ic-page .tr-access-banner-ic{
  background:#ffedd5;
}
body.ic-page .tr-paywall{
  border-color:#fdba74;
  background:#fff7ed;
}

/* ============================================================
   Плашка подсказок — делаем заметнее на странице И-Цзин:
   крупнее, ярче контраст, "живой" акцент на счётчике.
   ============================================================ */
body.ic-page.tr-page .hints-mini-bar{
  margin-top:4px;
  padding:14px 18px;
  border-radius:18px;
  border:1.5px solid #fdba74;
  background:linear-gradient(135deg,#fff7ed 0%,#fff 68%);
  box-shadow:0 10px 26px rgba(194,65,12,.1);
}
body.ic-page.tr-page .hints-mini-label{
  display:inline-flex;
  align-items:center;
  gap:6px;
  color:var(--ic-cin,#c2410c);
  font-size:14px;
}
body.ic-page.tr-page .hints-mini-label::before{
  content:'☯';
  font-size:15px;
  line-height:1;
}
body.ic-page.tr-page .hints-mini-chip{
  border-color:#fde3c7;
  background:#fff;
  padding:6px 13px;
}
body.ic-page.tr-page .hints-mini-chip b{
  font-size:17px;
  color:var(--ic-cin,#c2410c);
}
body.ic-page.tr-page .hints-mini-chip--free{
  border-color:#a7f3d0;
  background:#ecfdf5;
  box-shadow:0 0 0 3px rgba(16,185,129,.08);
}
body.ic-page.tr-page .hints-mini-buy{
  background:linear-gradient(135deg,#c2410c 0%,#ea580c 100%) !important;
  box-shadow:0 6px 18px rgba(194,65,12,.32);
  font-size:13.5px;
  padding:10px 18px;
  transition:transform .15s ease,box-shadow .15s ease;
}
body.ic-page.tr-page .hints-mini-buy:hover{
  background:linear-gradient(135deg,#9a3412 0%,#c2410c 100%) !important;
  transform:translateY(-1px);
  box-shadow:0 9px 22px rgba(194,65,12,.4);
}

/* --- Адаптив: секции не теряют воздух на мобильных --- */
@media(max-width:640px){
  body.ic-page .tr-spreads,
  body.ic-page .tr-focus-row,
  body.ic-page .tr-history{
    padding:12px;
    border-radius:16px;
  }
  body.ic-page .tr-wrap > .tr-label,
  body.ic-page .tr-panel > .tr-label{
    margin-top:22px;
  }
  body.ic-page.tr-page .hints-mini-bar{
    padding:12px 14px;
  }
}

@media (prefers-reduced-motion:reduce){
  body.ic-page .tr-spread,
  body.ic-page .tr-spread-icon,
  body.ic-page .tr-focus-chip,
  body.ic-page .tr-btn,
  body.ic-page.tr-page .hints-mini-buy{
    transition:none;
  }
}
