/* 拨云 depth kit (depth-a)：把日夜开关的三层做法（内凹槽 / 金色颗粒渐变+高光 / 叠云）抽成通用样式。纯 CSS，无图片请求。 */
:root{
  --dp-gold-hi:#F4DDA4;--dp-gold:#D6A956;--dp-gold-lo:#B48737;--dp-gold-ink:#2A1E08;
  --dp-groove:linear-gradient(180deg,rgba(110,80,20,.07),rgba(255,255,255,.35));
  --dp-in:inset 0 2px 5px rgba(110,80,20,.16),inset 0 -1px 2px rgba(255,255,255,.6);
  --dp-in-deep:inset 0 3px 8px rgba(110,80,20,.22),inset 0 -2px 3px rgba(255,255,255,.55);
  --dp-up:0 1px 0 rgba(255,255,255,.7) inset,0 10px 24px -16px rgba(120,85,20,.45),0 2px 4px -2px rgba(120,85,20,.18);
  --dp-up-hi:0 1px 0 rgba(255,255,255,.75) inset,0 18px 34px -18px rgba(140,100,30,.55),0 3px 8px -4px rgba(120,85,20,.25);
  --dp-card:linear-gradient(180deg,rgba(255,253,247,.9),rgba(246,238,220,.55));
  --dp-cloud:#FFFDF7;--dp-cloud2:#F1E6CC;--dp-hair:rgba(180,135,55,.55);
  --dp-grain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .35 0 0 0 0 .25 0 0 0 0 .08 0 0 0 .5 0'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23n)'/%3E%3C/svg%3E");
  --dp-ease:cubic-bezier(.22,1,.36,1);--dp-spring:cubic-bezier(.34,1.56,.64,1)}
html[data-theme=night],html[data-tone=dark]{
  --dp-gold-hi:#E6D6A4;--dp-gold:#CDB57A;--dp-gold-lo:#9C7C3A;--dp-gold-ink:#16131C;
  --dp-groove:linear-gradient(180deg,rgba(0,0,0,.28),rgba(255,255,255,.02));
  --dp-in:inset 0 2px 6px rgba(0,0,0,.5),inset 0 -1px 2px rgba(255,255,255,.05);
  --dp-in-deep:inset 0 4px 10px rgba(0,0,0,.55),inset 0 -2px 3px rgba(255,255,255,.06);
  --dp-up:0 1px 0 rgba(255,255,255,.06) inset,0 12px 26px -16px rgba(0,0,0,.8),0 2px 4px -2px rgba(0,0,0,.5);
  --dp-up-hi:0 1px 0 rgba(255,255,255,.08) inset,0 18px 34px -18px rgba(0,0,0,.9),0 0 0 1px rgba(205,181,122,.12);
  --dp-card:linear-gradient(180deg,rgba(43,33,66,.28),rgba(22,19,28,.25));
  --dp-cloud:rgba(205,181,122,.10);--dp-cloud2:rgba(205,181,122,.06);--dp-hair:rgba(205,181,122,.5)}

/* 叠云：放在卡片右下角的两层半透明云（背景层，不占伪元素） */
:root{--dp-clouds:radial-gradient(60px 26px at calc(100% - 40px) calc(100% + 4px),var(--dp-cloud) 98%,transparent 100%),radial-gradient(38px 22px at calc(100% - 92px) calc(100% + 6px),var(--dp-cloud) 98%,transparent 100%),radial-gradient(48px 26px at calc(100% - 14px) calc(100% - 4px),var(--dp-cloud2) 98%,transparent 100%)}

/* ---------- 1 主按钮：金色颗粒渐变 + 顶部高光，按下内凹 ---------- */
.dp-btn,html[data-theme] .btn:not(.ghost),html[data-tone] #birth-form .submit-button,html[data-tone] .rzq .btn{
  background:var(--dp-grain),radial-gradient(120% 140% at 30% 0%,var(--dp-gold-hi),var(--dp-gold) 52%,var(--dp-gold-lo))!important;
  background-blend-mode:soft-light,normal!important;color:var(--dp-gold-ink)!important;border:0!important;border-radius:var(--r-pill)!important;
  box-shadow:inset 0 1px 1px rgba(255,255,255,.55),inset 0 -3px 6px rgba(130,90,20,.3),0 10px 20px -10px rgba(140,100,30,.6)!important;
  text-shadow:0 1px 0 rgba(255,255,255,.35);font-weight:600;transition:transform .35s var(--dp-spring),box-shadow .3s var(--dp-ease),filter .2s!important}
.dp-btn:hover,html[data-theme] .btn:not(.ghost):hover,html[data-tone] #birth-form .submit-button:hover:not(:disabled){transform:translateY(-1px);filter:brightness(1.04);opacity:1!important}
.dp-btn:active,html[data-theme] .btn:not(.ghost):active,html[data-tone] #birth-form .submit-button:active{transform:translateY(1px) scale(.985);box-shadow:inset 0 3px 7px rgba(110,70,10,.45),inset 0 -1px 1px rgba(255,255,255,.3),0 2px 4px -2px rgba(140,100,30,.4)!important}
html[data-tone] #birth-form .submit-button:disabled{filter:saturate(.35) brightness(.98);opacity:.75}
/* 次按钮：浮起的纸片 */
html[data-theme] .btn.ghost,html[data-tone] main :is(.text-command,.system-link,.relation-chip,.fb-more),html[data-tone] .chart-head-actions button,html[data-tone] main button.ghost-button{
  border-radius:var(--r-pill)!important;background:var(--dp-card)!important;border:1px solid var(--dp-hair)!important;box-shadow:var(--dp-up)!important;transition:transform .35s var(--dp-spring),box-shadow .3s var(--dp-ease)!important}
html[data-theme] .btn.ghost:hover,html[data-tone] main :is(.text-command,.system-link,.relation-chip):hover{transform:translateY(-1px);box-shadow:var(--dp-up-hi)!important}
html[data-theme] .btn.ghost:active,html[data-tone] main :is(.text-command,.system-link,.relation-chip):active{transform:translateY(1px);box-shadow:var(--dp-in)!important}

/* ---------- 2 输入框：开关那种内凹槽 ---------- */
html[data-tone] #birth-form :is(input[type=text],input[type=date],input[type=time],input[type=search],select),html[data-theme] .rzq :is(input[type=date],input[type=time]),.dp-input{
  background:var(--dp-groove)!important;border:1px solid transparent!important;border-radius:var(--r-md)!important;box-shadow:var(--dp-in)!important;transition:box-shadow .3s var(--dp-ease)!important}
html[data-tone] #birth-form :is(input,select):focus,html[data-theme] .rzq input:focus{outline:none!important;box-shadow:var(--dp-in),0 0 0 2px color-mix(in srgb,var(--dp-gold) 55%,transparent)!important}

/* ---------- 3 切换项：凹槽轨道 + 选中项像月亮一样浮起滑动 ---------- */
html[data-tone] :is(.gender-segments,.workbench-tabs,.consult-topic-tabs),html[data-theme] .gt{
  background:var(--dp-groove)!important;box-shadow:var(--dp-in-deep)!important;border:0!important;border-radius:var(--r-pill)!important;padding:var(--sp-4)!important}
html[data-tone] .gender-segments button[aria-pressed="true"],html[data-tone] .gender-segments label:has(input:checked),html[data-tone] :is(.workbench-tabs,.consult-topic-tabs) button:is(.active,[aria-selected="true"],[aria-current]),html[data-theme] .gt span.on{
  background:var(--dp-grain),radial-gradient(120% 160% at 30% 0%,var(--dp-gold-hi),var(--dp-gold) 55%,var(--dp-gold-lo))!important;background-blend-mode:soft-light,normal!important;
  color:var(--dp-gold-ink)!important;border-radius:var(--r-pill)!important;box-shadow:inset 0 1px 1px rgba(255,255,255,.5),inset 0 -2px 4px rgba(130,90,20,.3),0 6px 12px -6px rgba(120,80,10,.55)!important;
  animation:dp-pop .5s var(--dp-spring)}
html[data-tone] :is(.gender-segments,.workbench-tabs,.consult-topic-tabs) button,html[data-theme] .gt span{border-radius:var(--r-pill)!important;transition:color .25s,background-color .25s,transform .4s var(--dp-spring)}
html[data-tone] .seg-pill::before,html[data-tone] .seg-line::after,html[data-tone] .seg-line::before{opacity:0!important}
@keyframes dp-pop{0%{transform:scale(.92)}100%{transform:none}}

/* ---------- 4 卡片 / 面板：浅浮起 + 右下叠云 ---------- */
html[data-tone] :is(.input-panel.birth-panel,.overview-block,.rp-section,.fb-rate,.analysis-settings,.consult-start),html[data-theme] :is(.rzq,.mods .cell,.mo),.dp-card{
  position:relative;background:var(--dp-clouds),var(--dp-card)!important;border:1px solid color-mix(in srgb,var(--dp-hair) 45%,transparent)!important;border-radius:var(--r-lg)!important;box-shadow:var(--dp-up)!important}
html[data-tone] :is(.overview-block,.rp-section,.analysis-settings,.consult-start,.fb-rate){padding:var(--sp-16) var(--sp-24)!important;margin-bottom:var(--sp-16)}
html[data-theme] .rzq{padding:var(--sp-16) var(--sp-16)!important}
html[data-tone] .input-panel.birth-panel{padding:var(--sp-24)!important}
html[data-theme] :is(.mods .cell,.mo){transition:transform .45s var(--dp-spring),box-shadow .35s var(--dp-ease)}
html[data-theme] :is(.mods .cell,.mo):hover{transform:translateY(-3px);box-shadow:var(--dp-up-hi)!important}
/* 四柱：凹槽底座 + 日柱浮起 */
html[data-tone] .chart-dock .dock-grid{background:var(--dp-groove);box-shadow:var(--dp-in-deep);border-radius:var(--r-lg);padding:var(--sp-4);gap:var(--sp-4)}
html[data-tone] .chart-dock .dock-col{border-radius:var(--r-md)!important;border:0!important;background:var(--dp-card)!important;box-shadow:var(--dp-up)!important;transition:transform .45s var(--dp-spring),box-shadow .35s var(--dp-ease)}
html[data-tone] .chart-dock .dock-col.is-day{background:var(--dp-clouds),radial-gradient(120% 90% at 50% 0%,color-mix(in srgb,var(--dp-gold-hi) 55%,transparent),transparent 70%),var(--dp-card)!important;box-shadow:var(--dp-up-hi),inset 0 0 0 1px var(--dp-hair)!important;transform:translateY(-3px)}
html[data-tone] .chart-dock .dock-col:hover{transform:translateY(-3px)}
/* 小行项：轻凹 */
html[data-tone] main :is(.digest-row,.now-row,.key-time-row,.rp-ten-item){border-radius:var(--r-md)!important;transition:background-color .25s,box-shadow .3s var(--dp-ease)}
html[data-tone] main :is(.digest-row,.now-row,.key-time-row,.rp-ten-item):hover{box-shadow:var(--dp-in)}

/* ---------- 5 标题区 / 分隔线：金色细光 + 淡云纹 ---------- */
html[data-theme] .chead{border-top:0!important;position:relative;padding-top:var(--sp-16)!important}
html[data-theme] .chead::before,.dp-rule{content:"";position:absolute;left:0;right:0;top:0;height:1px;background:linear-gradient(90deg,transparent,var(--dp-gold) 18%,var(--dp-gold-hi) 50%,var(--dp-gold) 82%,transparent);box-shadow:0 0 8px color-mix(in srgb,var(--dp-gold) 50%,transparent)}
html[data-theme] .chead::after{content:"";position:absolute;right:0;top:-14px;width:86px;height:28px;background:radial-gradient(22px 12px at 30% 70%,var(--dp-cloud2) 98%,transparent),radial-gradient(28px 14px at 62% 60%,var(--dp-cloud2) 98%,transparent);opacity:.9;pointer-events:none}
html[data-tone] main :is(.overview-block,.rp-section)>:is(h2,h3,.panel-label):first-child{padding-bottom:var(--sp-8);margin-bottom:var(--sp-12);background:linear-gradient(90deg,var(--dp-gold),color-mix(in srgb,var(--dp-gold) 0%,transparent) 70%) bottom left/100% 1px no-repeat}
html[data-tone] .fx-h{text-shadow:0 1px 0 rgba(255,255,255,.4)}

@media (prefers-reduced-motion:reduce){
  html [class],html [class]::before{animation:none!important}
  html[data-theme] .btn,html[data-tone] #birth-form .submit-button,html[data-tone] .dock-col,html[data-theme] :is(.mods .cell,.mo){transition:none!important;transform:none!important}}
/* 首页顶栏小胶囊（登录 / 白天夜间）：浮起纸片，按下内凹 */
html[data-theme] .top .pill{border-radius:var(--r-pill)!important;background:var(--dp-card)!important;border:1px solid var(--dp-hair)!important;box-shadow:var(--dp-up)!important;transition:transform .35s var(--dp-spring),box-shadow .3s var(--dp-ease)}
html[data-theme] .top .pill:active{transform:translateY(1px);box-shadow:var(--dp-in)!important}