/* ── W451 浮窗控制器（入口 + 扇形）· 面板是 W441 的转鼓 ────────── */
/* 旧的右下角白色 ≡ 由本层接管（节点也会被脚本摘掉，这里只是兜底） */
#w92-toc,#w92-tocpanel{display:none!important}

#w451-dial{
  --w451-sz:38px;--w451-hug:0px;--w451-slide:0px;
  --gold:#C4A46B;--navy:#041640;
  position:fixed;left:0;top:0;z-index:100;
  width:var(--w451-sz);height:var(--w451-sz);
  transform:translate3d(calc(var(--w451-hug) + var(--w451-slide)),0,0);
  transition:left .42s cubic-bezier(.34,1.56,.64,1),
             top .42s cubic-bezier(.34,1.56,.64,1),
             transform .42s cubic-bezier(.34,1.56,.64,1)}
@media(max-width:1199px){#w451-dial{--w451-sz:44px}}
#w451-dial[data-drag="1"]{transition:none}

#w451-orb{
  position:absolute;inset:0;margin:0;padding:0;
  display:grid;place-items:center;appearance:none;
  border:.5px solid rgba(196,164,107,.44);border-radius:50%;
  background:rgba(7,21,53,.70);color:#e6d3a6;cursor:grab;
  -webkit-backdrop-filter:blur(20px) saturate(1.4);backdrop-filter:blur(20px) saturate(1.4);
  box-shadow:0 6px 20px -8px rgba(2,10,30,.72),inset 0 0 0 .5px rgba(196,164,107,.24);
  touch-action:none;-webkit-tap-highlight-color:transparent;
  opacity:1;transform:scale(1);
  transition:opacity .34s ease,transform .34s cubic-bezier(.34,1.56,.64,1),
             border-color .2s ease,background .2s ease}
#w451-orb:active{cursor:grabbing}
#w451-orb:hover{border-color:rgba(196,164,107,.85);background:rgba(9,26,63,.88)}
#w451-orb:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
/* W441 塞进来的齿轮：居中、不吃指针 */
#w451-orb .gr-gear{width:20px;height:20px;pointer-events:none}
@media(max-width:1199px){#w451-orb .gr-gear{width:23px;height:23px}}
/* W441 塞进来的 01 / 37 读数：做成左侧小刻牌，默认不占地方 */
#w451-orb .gr-lab{
  position:absolute;right:calc(100% + 9px);top:50%;transform:translateY(-50%) translateX(5px);
  white-space:nowrap;pointer-events:none;
  font:500 10.5px/1 "Poppins",system-ui,sans-serif;letter-spacing:.14em;
  font-variant-numeric:tabular-nums;color:rgba(232,236,245,.84);
  background:rgba(7,21,53,.90);border:.5px solid rgba(196,164,107,.30);
  border-radius:4px;padding:3px 7px;opacity:0;
  -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
  transition:opacity .2s ease,transform .2s ease}
#w451-orb .gr-lab b{font-weight:600;color:#e6d3a6;letter-spacing:.02em}
#w451-orb:hover .gr-lab,#w451-orb:focus-visible .gr-lab,
#w451-dial[data-open="1"] #w451-orb .gr-lab{opacity:1;transform:translateY(-50%) translateX(0)}
#w451-dial[data-side="l"] #w451-orb .gr-lab{
  right:auto;left:calc(100% + 9px);transform:translateY(-50%) translateX(-5px)}
#w451-dial[data-side="l"] #w451-orb:hover .gr-lab{transform:translateY(-50%) translateX(0)}

/* 闲置 / 打开 / 首屏三态 */
#w451-dial[data-idle="1"] #w451-orb{opacity:.38}
#w451-dial[data-open="1"] #w451-orb{opacity:1;border-color:var(--gold);background:rgba(9,26,63,.94)}
/* 首屏一律不出现：权重压过 idle / open 两态 */
#w451-dial[data-armed="0"] #w451-orb{opacity:0!important;pointer-events:none!important;transform:scale(.6)!important}
#w451-dial[data-armed="0"] .w451-pet{opacity:0!important;pointer-events:none!important}
/* 窄屏面板几乎占满宽度：浮窗整体让位（花瓣那条在扇形段之后，见下） */
#w451-dial[data-duck="1"]{pointer-events:none}
#w451-dial[data-duck="1"] #w451-orb{opacity:.12;pointer-events:none}

/* ── 扇形花瓣 ───────────────────────────────────────────────── */
#w451-fan{position:absolute;left:50%;top:50%;width:0;height:0;pointer-events:none}
#w451-dial[data-open="1"] #w451-fan{pointer-events:auto}
.w451-pet{
  position:absolute;left:-19px;top:-19px;width:38px;height:38px;
  display:flex;align-items:center;justify-content:center;
  border:.5px solid rgba(196,164,107,.42);border-radius:50%;
  background:rgba(6,18,46,.86);color:#e8e1d0;
  -webkit-backdrop-filter:blur(16px) saturate(1.4);backdrop-filter:blur(16px) saturate(1.4);
  box-shadow:0 5px 16px -6px rgba(2,10,30,.8);
  font:600 11.5px/1 "Poppins",-apple-system,system-ui,"PingFang SC",sans-serif;
  letter-spacing:.02em;cursor:pointer;padding:0;
  font-variant-numeric:tabular-nums;
  opacity:0;transform:translate(0,0) scale(.4);
  transition:opacity .2s ease,transform .38s cubic-bezier(.34,1.56,.64,1);
  transition-delay:0ms}
.w451-pet[data-k="top"]{color:var(--gold);font-size:14px}
.w451-pet:hover{border-color:rgba(196,164,107,.85);color:#fff}
.w451-pet:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
#w451-dial[data-open="1"] .w451-pet{opacity:1;transform:translate(var(--px),var(--py)) scale(1)}
/* 让位态的花瓣必须排在上面那条之后，且权重更高（多一个属性选择器），
   否则同权重后来者胜，展开态会把让位态压回去 —— 这一条实测踩过。 */
#w451-dial[data-duck="1"][data-open="1"] .w451-pet{opacity:.12;pointer-events:none}

/* ── 几何冲突修正 ───────────────────────────────────────────── */
/* W441 用 [data-gr-entry] 当入口时会给 body 加 .gr-nocrown，
   那条 body.gr-nocrown>.gr-drum{right:18px} 会压住我这颗贴右边的浮窗。
   这里用权重覆盖推回 62px（W441 给自家表冠留的位置），不用 !important。 */
html body.gr-nocrown.w451-on>.gr-drum{right:62px}
@media(max-width:760px){
  html body.gr-nocrown.w451-on>.gr-drum{right:52px;width:min(296px,calc(100vw - 72px))}}

@media print{#w451-dial{display:none!important}}
@media(prefers-reduced-motion:reduce){
  #w451-dial,#w451-orb,.w451-pet{transition-duration:.12s!important;transition-timing-function:linear!important}
  .w451-pet{transition-delay:0ms!important}}

/* 中文站的「全部 N 张」早已隐藏；英文站这颗还开着，一并收起——入口藏了计数才藏得干净 */
#gx-studio #gs-all{display:none!important}

@media (max-width:768px){
  /* ① 手机没有 hover，idle 就是它唯一的常态——让常态本身就看得见 */
  #w451-dial[data-idle="1"] #w451-orb{opacity:.92}
  /* ② 拇指目标 ≥48px */
  #w451-dial{--w451-sz:52px}
  #w451-orb .gr-gear{width:27px;height:27px}
  /* ③ 从同色系背景里浮起来：描边加重 + 一圈极淡外发光 */
  #w451-orb{
    border-color:rgba(196,164,107,.85);
    background:rgba(7,21,53,.88);
    box-shadow:0 0 0 1px rgba(196,164,107,.16), 0 6px 18px rgba(2,8,22,.45);
  }
  /* ④ 甩出来那一下要占住拇指区 */
  #w451-dial{--w451-r:108px}
  .w451-pet{width:46px;height:46px;left:-23px;top:-23px;font-size:14px;letter-spacing:.02em}
  #w451-dial[data-open="1"] #w451-orb{box-shadow:0 0 0 2px rgba(196,164,107,.30), 0 8px 22px rgba(2,8,22,.55)}
}
@media (max-width:768px) and (prefers-reduced-motion:reduce){
  #w451-orb{box-shadow:none}
}

@media (max-width:768px){
  /* ① 拇指目标下限：所有可点的东西 ≥44×44 */
  /* 这些 !important 不是图省事：实测 `el.style.setProperty('min-height','44px','important')`
     当场从 38px 跳到 44px，去掉 important 又回到 38px —— 说明有一条带 important 的既有规则
     压着，非 important 的覆盖一律无效。加 important 是唯一能赢的写法。 */
  #gx-island button,#gi-sheet button,#gx-studio button{min-height:44px!important}
  #gi-al-go,#gs-draw,#gs-save,#gs-x,#gi-card{min-height:44px!important;min-width:44px!important}
  /* 收起 / 上一章 / 下一章 / 胶囊里的播放：原来 32~43px */
  #gi-close,#gi-prev,#gi-next,#gi-play,#gi-open{min-width:44px!important;min-height:44px!important}
  /* ② 声音与速度两排：原来高 36~38。
     速度档的真实结构是 #gi-rates > #gx-tts-rates > button，压它的规则是
     `#gi-rates #gx-tts-rates button`（两层 id + important）——单层 id 加 important 也赢不了，
     必须同权重再加 important，且本块在后。 */
  #gi-voice button,.gi-seg button,.w443-seg button{
    min-height:44px!important;padding-top:10px!important;padding-bottom:10px!important}
  #gi-rates #gx-tts-rates button,#gx-tts-rates button{
    min-height:44px!important;padding-top:10px!important;padding-bottom:10px!important}
  /* ③ 胶囊是 scale(.9) 的，44px 量出来只有 40 —— 触摸目标要按「缩放后」算，
     所以这里给到 50（50×0.9≈45）。**祖先 transform 会让 getBoundingClientRect 小于 CSS 值**，
     这一条今晚踩过两次：一次是动画中途采样，一次就是这个静态缩放。 */
  #gi-cap #gi-play,#gi-cap button{min-height:50px!important;min-width:50px!important}
  /* ④ 倒计时不是按钮，别占按钮的分量 —— 「只留一个动作」这件事要看得出来 */
  #gi-al-x.gx-w434-cd{min-height:0!important;min-width:0!important;padding:2px 4px!important;
    font-size:11px!important;opacity:.42!important}
  /* ⑤ 相邻可点元素之间留 8px，避免误触 */
  #gi-voice,#gi-rates,.gi-seg{gap:8px}
  /* ⑥ 明信片工作室：保存/再抽是主动作，撑满更好按 */
  #gx-studio .gs-act button{min-height:48px!important;flex:1 1 auto}
}
@media (max-width:768px) and (pointer:coarse){
  /* 触屏专属：点下去要有反馈，否则用户不知道点没点上 */
  #gx-island button:active,#gx-studio button:active{transform:scale(.97)}
}

/* ── 坞位 ────────────────────────────────────────────────────────
   底部坞沿用岛原本的 left:50% + translate(-50%)，一个字节都不改，
   只在手机上把左右也留出缝来——阿康要的「不是完全贴边缘」。 */
#gx-island[data-dock="bottom"]{--w462-gap:14px}
@media (max-width:768px){
  #gx-island[data-dock="bottom"]{
    max-width:calc(100vw - 30px - env(safe-area-inset-left,0px) - env(safe-area-inset-right,0px));
  }
  /* 腾出上面那 30px 的缝：导航片的左右内距收一点，够 375 宽塞下 */
  #gx-island[data-dock="bottom"] .gi-nav a{padding:0 9px}
}

/* 左右坞：竖向。top 用 --gi-y 记住用户放的高度，不是死居中 */
#gx-island[data-dock="left"],#gx-island[data-dock="right"]{
  left:auto;right:auto;bottom:auto;
  top:var(--gi-y,58%);
  transform:translateY(-50%);
  max-width:none;
}
#gx-island[data-dock="left"] {left:calc(10px + env(safe-area-inset-left,0px))}
#gx-island[data-dock="right"]{right:calc(10px + env(safe-area-inset-right,0px))}

/* ── 竖向版式 ────────────────────────────────────────────────── */
#gx-island[data-dock="left"] .gi-cap,#gx-island[data-dock="right"] .gi-cap{
  flex-direction:column;width:auto;min-width:0;
  padding:9px 7px;gap:7px;border-radius:27px;
}
#gx-island[data-dock="left"] .gi-nav,#gx-island[data-dock="right"] .gi-nav{
  flex-direction:column;margin-left:0;gap:5px;
}
/* 中文竖排立起来读，不是把字一个个摞着 */
#gx-island[data-dock="left"] .gi-nav a,#gx-island[data-dock="right"] .gi-nav a{
  writing-mode:vertical-rl;text-orientation:upright;
  height:auto;min-height:46px;min-width:34px;padding:9px 3px;
  letter-spacing:.16em;justify-content:center;
}
/* 「在庚辛 400 分钟」竖排太长：只留数字，点开面板里仍有全文 */
#gx-island[data-dock="left"] #gi-dwell,#gx-island[data-dock="right"] #gi-dwell{
  writing-mode:vertical-rl;text-orientation:upright;letter-spacing:.1em;
  max-height:104px;overflow:hidden;
}
#gx-island[data-dock="left"] #gi-dwell .w462-hide,
#gx-island[data-dock="right"] #gi-dwell .w462-hide{display:none}

/* ── 抓手：让人看出来这东西能拖 ───────────────────────────────── */
#gx-island .w462-grip{
  position:absolute;pointer-events:none;opacity:.34;
  display:grid;gap:2.5px;transition:opacity .25s ease;
}
#gx-island .w462-grip i{display:block;width:3px;height:3px;border-radius:50%;
  background:currentColor;color:var(--gi-ink,#dfe6f2)}
#gx-island[data-dock="bottom"] .w462-grip{
  left:50%;top:4px;transform:translateX(-50%);grid-auto-flow:column;
}
#gx-island[data-dock="left"] .w462-grip,#gx-island[data-dock="right"] .w462-grip{
  top:50%;transform:translateY(-50%);grid-auto-flow:row;
}
#gx-island[data-dock="left"] .w462-grip{right:3px}
#gx-island[data-dock="right"] .w462-grip{left:3px}
#gx-island[data-dragging="1"] .w462-grip{opacity:.85}

/* ── 拖动中 ──────────────────────────────────────────────────── */
#gx-island[data-dragging="1"]{
  left:0!important;right:auto!important;top:0!important;bottom:auto!important;
  transition:none!important;
  transform:translate3d(var(--w462-x,0px),var(--w462-y,0px),0) scale(1.03)!important;
  cursor:grabbing;
}
#gx-island[data-dragging="1"] .gi-cap{
  box-shadow:0 18px 44px rgba(2,8,22,.55),0 0 0 1px rgba(196,164,107,.30);
}
/* 落坞那一下的弹簧。只在这一帧挂 class，不常驻，免得干扰岛自己的过渡 */
#gx-island[data-w462-fly="1"]{
  transition:transform .46s cubic-bezier(.22,1.12,.30,1)!important;
}
/* 吸边提示：拖到边缘附近，那一侧亮一条 */
.w462-edge{
  position:fixed;top:0;bottom:0;width:30px;z-index:98;pointer-events:none;
  opacity:0;transition:opacity .18s ease;
}
.w462-edge[data-on="1"]{opacity:1}
.w462-edge[data-s="l"]{left:0;background:linear-gradient(90deg,rgba(196,164,107,.26),transparent)}
.w462-edge[data-s="r"]{right:0;background:linear-gradient(270deg,rgba(196,164,107,.26),transparent)}

@media (prefers-reduced-motion:reduce){
  #gx-island[data-w462-fly="1"]{transition:none!important}
  #gx-island[data-dragging="1"]{transform:translate3d(var(--w462-x,0px),var(--w462-y,0px),0)!important}
}

/* 按下就有反馈：手指落下那一刻要看得出系统收到了 */
#gr-drum a.gr-it{-webkit-tap-highlight-color:transparent;transition:background .12s ease}
#gr-drum a.gr-it:active,#gr-drum a.gr-it[data-w464-hit="1"]{
  background:rgba(196,164,107,.16);
}
/* 压扁的行也要点得着：垫一层不影响版式的可点区域 */
#gr-drum a.gr-it{position:relative}
#gr-drum a.gr-it::after{
  content:"";position:absolute;left:0;right:0;top:50%;
  height:34px;transform:translateY(-50%);
}
@media (max-width:768px){
  #gr-drum a.gr-it::after{height:44px}
}
/* 刚跳到的那一章，给一下就散的高亮，告诉人「你到了这儿」 */
@keyframes w464Land{
  0%{box-shadow:inset 3px 0 0 rgba(196,164,107,.95),0 0 0 rgba(196,164,107,.26)}
  100%{box-shadow:inset 3px 0 0 rgba(196,164,107,0),0 0 0 rgba(196,164,107,0)}
}
.w464-landed{animation:w464Land 1.5s ease-out 1}
@media (prefers-reduced-motion:reduce){
  .w464-landed{animation:none}
  #gr-drum a.gr-it{transition:none}
}

/* 选中那一格是深字压金底，.62 只有 3.67 对比度（AA 要 4.5）。提到 .78 → 5.32。
   未选中那批是浅字压深底，.62 已有 5.39，这里**刻意不写**，保住「淡」。 */
#gi-voice button.w443-v[aria-checked="true"]>small,
#gi-voice button.w443-v.act>small,
#gi-voice button.w443-v[data-on="1"]>small{opacity:.78}

/* 触屏上解除 armed 接近闸：那道闸靠悬停指针喂坐标，触屏永远喂不到，
   于是 opacity:0 + pointer-events:none 成了永久状态。
   必须同样用 !important 才压得过 W451 那条 !important。 */
@media (hover:none),(pointer:coarse){
  #w451-dial[data-armed="0"] #w451-orb{
    opacity:.92!important;
    pointer-events:auto!important;
    transform:none!important;              /* 撤掉 scale(.6)：52×.6=31px，低于拇指下限 */
  }
  #w451-dial[data-armed="0"] .w451-pet{
    pointer-events:auto!important;          /* 花瓣的 opacity 交给展开态，这里只放开可点 */
  }
  /* 展开时花瓣才现身，收起时仍然藏着——不因为解闸把花瓣常亮 */
  #w451-dial[data-armed="0"][data-open="1"] .w451-pet{opacity:1!important}

  /* 常驻可见了，就得从深蓝背景里浮起来，并且够拇指点 */
  #w451-dial{--w451-sz:52px}
  #w451-orb{
    border-color:rgba(196,164,107,.85)!important;
    background:rgba(7,21,53,.90)!important;
    box-shadow:0 0 0 1px rgba(196,164,107,.18),0 6px 18px rgba(2,8,22,.48)!important;
  }
  /* 按下要有反馈，不然还是「感觉没动」 */
  #w451-orb:active{transform:scale(.94)!important}
}
@media (prefers-reduced-motion:reduce){
  #w451-orb:active{transform:none!important}
}

@media (max-width:768px){
  /* ①a 展开面板底部那排链接（研究院 / 资本 / 人生）：实测 44.6 × **34.0**。
        我第一版把它们当成了胶囊上的 .gi-nav，选择器一个都没命中。
        真实路径是：A < SPAN.gi-links < DIV.gi-foot < #gi-sheet。 */
  #gi-sheet .gi-foot .gi-links a,#gi-sheet .gi-links a{
    min-height:44px!important;
    display:inline-flex!important;align-items:center!important;
  }
  /* ①b 胶囊上的导航片（只有带 C.nav 的页才有，如首页）一并补齐 */
  #gx-island .gi-nav a{
    min-height:44px!important;
    min-width:44px!important;      /* 实测「资本」「人生」宽 43.1，差 0.9 到 44 */
    padding-top:0!important;padding-bottom:0!important;
    display:flex!important;align-items:center!important;justify-content:center!important;
  }
  /* 竖排坞下同理（W462 把它立起来了，高度换成了宽度） */
  #gx-island[data-dock="left"] .gi-nav a,
  #gx-island[data-dock="right"] .gi-nav a{
    min-width:44px!important;min-height:46px!important;
  }

  /* ② 弹层那两颗：祖先 #gi-alert 静止就带 0.937 缩放，
        所以这里写 47，渲染出来才是 47×0.937 ≈ 44。写 44 会落到 41。 */
  #gi-alert #gi-al-go,#gi-alert #gi-al-x,
  #gx-island #gi-al-go,#gx-island #gi-al-x{
    min-height:47px!important;
  }
}