/* 奉卦功德匣：重新分配纵向留白，并强化金额牌的立体光影。 */
#sp-panel[data-view="gua-gift"] .sp-body{
  background:
    radial-gradient(circle at 50% 0,rgba(255,255,255,.72),transparent 32%),
    linear-gradient(180deg,#f1ecff 0%,#e7dcfa 100%);
  color:#39235c;
}
#sp-panel[data-view="gua-gift"] .gua-stage{
  padding-top:12px;
  padding-bottom:8px;
}
#sp-panel[data-view="gua-gift"] .gua-steps{
  margin-top:2px;
  margin-bottom:10px;
}
#sp-panel[data-view="gua-gift"] .gua-ritual-head{
  padding-top:3px;
}
#sp-panel[data-view="gua-gift"] .gua-celestial{
  height:100px;
  margin:2px auto 8px;
}
#sp-panel[data-view="gua-gift"] .gua-eyebrow{
  margin:7px 0 6px;
}
#sp-panel[data-view="gua-gift"] .gua-gift-copy{
  line-height:1.68;
  margin-top:3px;
  margin-bottom:14px;
}
#sp-panel[data-view="gua-gift"] .gua-merit-box{
  flex:0 0 auto;
  margin-top:5px;
  padding-top:34px;
  padding-bottom:10px;
}
#sp-panel[data-view="gua-gift"] .gua-gift-levels.gua-many{
  grid-auto-rows:50px;
  gap:7px 8px;
}
#sp-panel[data-view="gua-gift"] .gua-box-blessing{
  margin-top:8px;
}
#sp-panel[data-view="gua-gift"] .gua-gift-foot{
  margin-top:9px;
  margin-bottom:4px;
}
#sp-panel[data-view="gua-gift"] .gua-many .gua-gift-level,
#sp-panel[data-view="gua-gift"] .gua-many .gua-gift-level:last-child:nth-child(odd){
  height:50px;min-height:50px;padding:4px 6px;
  grid-template-columns:32px minmax(0,1fr) auto;
  gap:4px;
}
#sp-panel[data-view="gua-gift"] .gua-many .gua-level-copy strong{font-size:11.2px!important}
#sp-panel[data-view="gua-gift"] .gua-many .gua-level-copy{transform:translateX(11px)}
#sp-panel[data-view="gua-gift"] .gua-many .gua-level-price,
#sp-panel[data-view="gua-gift"] .gua-many .gua-gift-level:last-child:nth-child(odd) .gua-level-price{
  grid-column:auto;justify-self:end;margin:0;font-size:16px!important;white-space:nowrap;
}
#sp-panel[data-view="gua-gift"] .gua-many .gua-level-mark{font-size:8px}
#sp-panel[data-view="gua-gift"] .gua-eyebrow{color:#624280;font-weight:700}
#sp-panel[data-view="gua-gift"] .gua-gift-copy{color:#4b315f}
#sp-panel[data-view="gua-gift"] .gua-gift-foot{color:#5f4678;font-weight:600}
#sp-panel[data-view="gua-gift"] .gua-step{color:#715d74}
#sp-panel[data-view="gua-gift"] .gua-box-top em{color:#e2c88f!important;font-weight:600}
#sp-panel[data-view="gua-gift"] .gua-box-blessing{color:#e3c895!important;font-weight:600}

/* 金额牌：上亮下暗的厚度、静态釉面与流动高光。 */
#sp-panel[data-view="gua-gift"] .gua-gift-level{
  isolation:isolate;
  border-color:rgba(255,222,151,.72);
  background:
    radial-gradient(circle at 18% 2%,rgba(255,255,255,.20),transparent 38%),
    linear-gradient(155deg,rgba(154,112,212,.34) 0%,rgba(86,48,142,.30) 48%,rgba(47,25,85,.44) 100%);
  box-shadow:
    0 5px 0 rgba(77,36,13,.23),
    0 10px 18px rgba(38,14,4,.20),
    inset 0 2px 1px rgba(255,255,255,.96),
    inset 0 -4px 8px rgba(133,86,24,.15);
  transform-origin:50% 55%;
  backface-visibility:hidden;
  will-change:transform;
}
#sp-panel[data-view="gua-gift"] .gua-many .gua-gift-level{
  background:
    radial-gradient(circle at 18% 2%,rgba(255,255,255,.20),transparent 38%),
    linear-gradient(155deg,rgba(154,112,212,.34) 0%,rgba(86,48,142,.30) 48%,rgba(47,25,85,.44) 100%);
}
#sp-panel[data-view="gua-gift"] .gua-gift-level::before{
  content:'';
  position:absolute;
  z-index:0;
  inset:2px 3px 5px;
  border-radius:10px;
  border-top:1px solid rgba(255,255,255,.92);
  border-bottom:1px solid rgba(105,59,16,.13);
  background:linear-gradient(180deg,rgba(255,255,255,.24),transparent 42%,rgba(111,65,20,.035));
  pointer-events:none;
}
#sp-panel[data-view="gua-gift"] .gua-gift-level>*{
  position:relative;
  z-index:1;
}
#sp-panel[data-view="gua-gift"] .gua-gift-level.gua-breathing{
  opacity:1;
  animation:guaGiftLevelBreath 3.8s cubic-bezier(.37,0,.24,1) var(--gua-breathe-delay,0s) infinite;
}
#sp-panel[data-view="gua-gift"] .gua-gift-level.gua-breathing::after{
  opacity:.48;
  width:42%;
  inset:-18% auto -18% -55%;
  background:linear-gradient(105deg,transparent 12%,rgba(255,255,255,.18) 34%,rgba(255,250,216,.78) 50%,rgba(255,255,255,.12) 67%,transparent 86%);
  transform:translate3d(-140%,0,0) skewX(-16deg);
  animation:guaGiftLightSweep 5.2s ease-in-out var(--gua-breathe-delay,0s) infinite;
  pointer-events:none;
  will-change:transform,opacity;
}
#sp-panel[data-view="gua-gift"] .gua-level-mark{
  box-shadow:
    0 5px 8px rgba(83,48,10,.28),
    inset 0 2px 2px rgba(255,250,207,.82),
    inset 0 -3px 5px rgba(93,52,10,.24),
    0 0 0 1px rgba(255,231,157,.36);
}
#sp-panel[data-view="gua-gift"] .gua-level-price{
  color:#ffd95a!important;
  -webkit-text-stroke:.55px #261109;
  paint-order:stroke fill;
  text-shadow:-1px -1px 0 rgba(23,8,4,.92),1px -1px 0 rgba(23,8,4,.92),-1px 1px 0 rgba(23,8,4,.92),1px 1px 0 rgba(23,8,4,.92),0 0 9px rgba(255,210,67,.40),0 3px 7px rgba(35,16,0,.32);
}
#sp-panel[data-view="gua-gift"] .gua-level-price small{color:#ffe07a!important;-webkit-text-stroke:.35px #261109}
#sp-panel[data-view="gua-gift"] .gua-level-price i{color:#f4e2bd!important;text-shadow:0 1px 2px rgba(21,7,40,.92)}
#sp-panel[data-view="gua-gift"] .gua-level-copy strong{
  color:#fff!important;
  text-shadow:0 1px 2px rgba(21,7,40,.82),0 0 8px rgba(255,255,255,.16);
}
/* 五个奉礼层级采用吉卦符号；大有卦专用于 88.88，寓意丰盛圆满。 */
#sp-panel[data-view="gua-gift"] .gua-many .gua-level-mark.gua-hexagram{
  display:grid!important;place-items:center;font-family:"Noto Serif CJK SC","Songti SC",serif;
  font-size:19px!important;font-weight:700;line-height:1;color:#251205!important;
  text-shadow:0 1px 0 rgba(255,247,201,.8),0 2px 3px rgba(49,21,0,.32);
  background:radial-gradient(circle at 35% 27%,#fff1b4 0 13%,#e8bd57 31%,#8b541b 65%,#41230b 100%)!important;
  box-shadow:0 4px 9px rgba(35,12,4,.48),inset 0 1px 1px rgba(255,250,214,.94),inset 0 -3px 5px rgba(53,25,4,.42),0 0 0 1px rgba(255,224,129,.72)!important;
}
#sp-panel[data-view="gua-gift"] .gua-hexagram.gua-hex-tai{color:#55300a!important;background:radial-gradient(circle at 35% 27%,#fff4bd 0 13%,#eccd70 31%,#a96d24 65%,#4a290d 100%)!important}
#sp-panel[data-view="gua-gift"] .gua-hexagram.gua-hex-tongren{color:#2d1607!important;background:radial-gradient(circle at 35% 27%,#fff0b1 0 13%,#e9b44d 31%,#95501b 65%,#3d210b 100%)!important}
#sp-panel[data-view="gua-gift"] .gua-hexagram.gua-hex-yi{color:#fff1a9!important;background:radial-gradient(circle at 35% 27%,#fff7c6 0 13%,#dfb649 31%,#76501d 65%,#34230d 100%)!important}
#sp-panel[data-view="gua-gift"] .gua-hexagram.gua-hex-dayou{
  color:#fff2ae!important;font-size:21px!important;
  background:radial-gradient(circle at 35% 27%,#fff8cd 0 12%,#ffe37b 25%,#d69b22 49%,#754008 72%,#331a03 100%)!important;
  box-shadow:0 0 0 1px #ffe893,0 4px 10px rgba(42,14,0,.6),0 0 15px rgba(255,205,57,.44),inset 0 1px 2px #fff8d5,inset 0 -3px 6px rgba(82,37,0,.46)!important;
}

@keyframes guaGiftLevelBreath{
  0%,100%{transform:translate3d(0,0,0) scale(1)}
  50%{transform:translate3d(0,-1px,0) scale(1.012)}
}
@keyframes guaGiftLightSweep{
  0%,24%{transform:translate3d(-140%,0,0) skewX(-16deg);opacity:0}
  38%{opacity:.56}
  58%{transform:translate3d(410%,0,0) skewX(-16deg);opacity:.18}
  59%,100%{transform:translate3d(410%,0,0) skewX(-16deg);opacity:0}
}

@media(max-height:680px){
  #sp-panel[data-view="gua-gift"] .gua-stage{padding-top:8px}
  #sp-panel[data-view="gua-gift"] .gua-celestial{height:92px;margin-bottom:5px}
  #sp-panel[data-view="gua-gift"] .gua-gift-copy{margin-bottom:9px;line-height:1.58}
  #sp-panel[data-view="gua-gift"] .gua-merit-box{margin-top:2px}
}
@media(prefers-reduced-motion:reduce){
  #sp-panel[data-view="gua-gift"] .gua-gift-level.gua-breathing,
  #sp-panel[data-view="gua-gift"] .gua-gift-level.gua-breathing::after{
    animation:none!important;
  }
  #sp-panel[data-view="gua-gift"] .gua-gift-level.gua-breathing{transform:none}
}
