/* W446 · 英文站 OS 消息系统。自带节点与样式，不依赖岛本体。 */#w446-msg{position:fixed;z-index:9200;right:20px;bottom:20px;width:min(392px,calc(100vw - 40px));box-sizing:border-box;padding:14px 16px 13px 58px;border-radius:14px;background:rgba(22,28,42,.94);border:1px solid rgba(201,168,106,.26);box-shadow:0 10px 34px rgba(0,0,0,.42);color:#e9eef7;font:400 14px/1.6 -apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;-webkit-backdrop-filter:blur(9px);backdrop-filter:blur(9px);opacity:0;transform:translateY(10px);pointer-events:none;transition:opacity .34s ease,transform .34s ease}#w446-msg.w446-on{opacity:1;transform:translateY(0);pointer-events:auto}#w446-msg .w446-av{position:absolute;left:14px;top:14px;width:34px;height:34px;border-radius:9px;display:flex;align-items:center;justify-content:center;font:600 15px/1 inherit;letter-spacing:.01em}#w446-msg[data-w446-kind="voice"] .w446-av{color:#1b2233;background:linear-gradient(145deg,#f0d696,#c9a86a);box-shadow:0 1px 3px rgba(0,0,0,.35)}#w446-msg[data-w446-kind="quote"] .w446-av,#w446-msg[data-w446-kind="stat"] .w446-av,#w446-msg[data-w446-kind="nav"] .w446-av,#w446-msg[data-w446-kind="chapter"] .w446-av{color:#c9a86a;background:rgba(201,168,106,.12);border:1px solid rgba(201,168,106,.34)}#w446-msg .w446-k{font-size:11.5px;letter-spacing:.08em;text-transform:uppercase;color:#c9a86a;font-weight:600}#w446-msg[data-w446-kind="voice"] .w446-k{text-transform:none;letter-spacing:.02em;font-size:12.5px}#w446-msg .w446-t{margin-top:5px;color:#e9eef7}#w446-msg[data-w446-kind="voice"] .w446-t{background:rgba(255,255,255,.055);border:1px solid rgba(201,168,106,.22);border-radius:10px;padding:8px 11px;line-height:1.62}#w446-msg .w446-row{display:flex;align-items:center;gap:12px;margin-top:11px}#w446-msg .w446-go{appearance:none;-webkit-appearance:none;cursor:pointer;font:600 12.5px/1 inherit;letter-spacing:.03em;color:#1b2233;background:linear-gradient(145deg,#f0d696,#c9a86a);border:0;border-radius:999px;padding:8px 15px;animation:w446Breathe 2.6s ease-in-out infinite}#w446-msg .w446-go[hidden]{display:none}#w446-msg .w446-cd{font-size:11.5px;letter-spacing:.06em;color:rgba(233,238,247,.42);font-variant-numeric:tabular-nums}@keyframes w446Breathe{0%,100%{box-shadow:0 0 0 0 rgba(196,164,107,.40)}50%{box-shadow:0 0 0 7px rgba(196,164,107,0)}}@media(max-width:640px){#w446-msg{left:12px;right:12px;width:auto;bottom:calc(env(safe-area-inset-bottom,0px) + 104px)}}@media (prefers-reduced-motion:reduce){#w446-msg{transition:none}#w446-msg .w446-go{animation:none}} /* 呼吸：和中文站 W434 同一条曲线、同一个节拍，只给主动作按钮 */ @keyframes gxW447Breathe{0%,100%{box-shadow:0 0 0 0 rgba(196,164,107,.40)}50%{box-shadow:0 0 0 7px rgba(196,164,107,0)}} html[lang^="en"] #gi-al-go{animation:gxW447Breathe 2.6s ease-in-out infinite} /* 倒计时：原位顶掉 Later，不再长得像按钮 */ html[lang^="en"] #gi-al-x.gx-w447-cd{animation:none;background:none!important;border:0!important;box-shadow:none!important; padding:2px 3px;font-size:11.5px;line-height:1.25;letter-spacing:.06em;cursor:default; color:rgba(233,238,247,.40);font-variant-numeric:tabular-nums} html[lang^="en"] #gi-al-x.gx-w447-cd:hover{color:rgba(233,238,247,.60)} /* 抽卡封闭死：选择条与「全部」收掉，只剩「再抽一张 / 保存这张」 */ html[lang^="en"] #gx-studio .gs-strip,html[lang^="en"] #gx-studio #gs-all{display:none!important} @media (prefers-reduced-motion:reduce){html[lang^="en"] #gi-al-go{animation:none}} /* ── ① 胶囊播放键外圈进度环 ── */ #gi-play{position:relative} #gi-play .w481-ring{position:absolute;inset:-4px;width:calc(100% + 8px);height:calc(100% + 8px); transform:rotate(-90deg);pointer-events:none;overflow:visible} #gi-play .w481-ring circle{fill:none;stroke-width:2.2;vector-effect:non-scaling-stroke} #gi-play .w481-ring-bg{stroke:rgba(255,255,255,.12)} #gi-play .w481-ring-fg{stroke:#f0d49a;stroke-linecap:round;transition:stroke-dashoffset .25s linear} #gx-island[data-w481-has="0"] #gi-play .w481-ring{opacity:0} #gx-island[data-w481-has="1"] #gi-play .w481-ring{opacity:1;transition:opacity .3s ease} /* ── ② 面板进度条 ── */ #w481-seek{display:flex;align-items:center;gap:6px;margin:4px 2px 10px;user-select:none;-webkit-user-select:none} #w481-seek .w481-t{font:600 11.5px/1 -apple-system,"PingFang SC",sans-serif;font-variant-numeric:tabular-nums; color:rgb(192,203,224);min-width:34px;text-align:center} #w481-seek .w481-cur{color:#f0d49a} #w481-seek .w481-skip{flex:0 0 auto;position:relative;width:44px;height:44px;border:0;border-radius:50%; background:transparent;color:rgb(222,229,242);display:grid;place-items:center;cursor:pointer; -webkit-tap-highlight-color:transparent;transition:transform .22s cubic-bezier(.34,1.56,.64,1),background .2s} #w481-seek .w481-skip svg{width:22px;height:22px} #w481-seek .w481-skip[data-d="15"] svg{transform:scaleX(-1)} #w481-seek .w481-skip i{position:absolute;font:700 8px/1 -apple-system,sans-serif;font-style:normal;top:52%;left:50%; transform:translate(-50%,-50%);letter-spacing:-.02em} #w481-seek .w481-skip:active{transform:scale(.88);background:rgba(255,255,255,.08)} #w481-seek .w481-track{position:relative;flex:1 1 auto;height:44px;cursor:pointer;touch-action:none;outline:none} #w481-seek .w481-rail{position:absolute;left:0;right:0;top:50%;height:4px;margin-top:-2px;border-radius:4px; background:rgba(255,255,255,.14);overflow:hidden;transition:height .18s ease,margin-top .18s ease} #w481-seek .w481-buf{position:absolute;left:0;top:0;bottom:0;width:var(--b,0%);background:rgba(255,255,255,.14)} #w481-seek .w481-fill{position:absolute;left:0;top:0;bottom:0;width:var(--f,0%); background:linear-gradient(90deg,#c9a86a,#f0d49a)} #w481-seek .w481-knob{position:absolute;top:50%;left:var(--f,0%);width:14px;height:14px;margin:-7px 0 0 -7px; border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff7e3,#f0d49a 55%,#c9a86a); box-shadow:0 2px 6px rgba(0,0,0,.35),0 0 0 3px rgba(240,212,154,.18); transition:transform .2s cubic-bezier(.34,1.56,.64,1)} #w481-seek .w481-tip{position:absolute;bottom:40px;left:var(--f,0%);transform:translateX(-50%) scale(.8);opacity:0; padding:5px 9px;border-radius:10px;background:rgba(240,212,154,.96);color:#0b1630; font:700 12px/1 -apple-system,sans-serif;font-variant-numeric:tabular-nums;pointer-events:none; box-shadow:0 6px 16px -4px rgba(0,0,0,.45);transition:opacity .15s ease,transform .2s cubic-bezier(.34,1.56,.64,1)} #w481-seek[data-drag="1"] .w481-rail{height:8px;margin-top:-4px} #w481-seek[data-drag="1"] .w481-knob{transform:scale(1.45)} #w481-seek[data-drag="1"] .w481-tip{opacity:1;transform:translateX(-50%) scale(1)} #w481-seek[data-drag="1"] .w481-fill,#w481-seek[data-drag="1"] .w481-knob,#w481-seek[data-drag="1"] .w481-tip{transition:none} #w481-seek .w481-track:focus-visible .w481-knob{box-shadow:0 0 0 3px rgba(240,212,154,.75)} #w481-seek[data-off="1"]{opacity:.42} #w481-seek[data-off="1"] .w481-track,#w481-seek[data-off="1"] .w481-skip{pointer-events:none} #w481-seek[data-off="1"] .w481-knob{opacity:0} /* ── ④ 下拉收起时的跟手 ── */ #gi-sheet[data-w481-pull="1"]{transition:none!important} #gi-sheet.w481-snap{transition:translate .42s cubic-bezier(.34,1.4,.64,1)!important} #gi-title.w481-snap{transition:translate .38s cubic-bezier(.34,1.56,.64,1)} /* ── ⑦ 面板展开时藏起浮窗章节盘（线上实测它压在面板上） ── */ #w451-dial{transition:opacity .2s ease} html[data-w481-sheet="1"] #w451-dial{opacity:0!important;pointer-events:none!important} @media (prefers-reduced-motion:reduce){ #w481-seek *,#gi-play .w481-ring-fg{transition:none!important} #gi-sheet.w481-snap,#gi-title.w481-snap{transition:none!important} } /* ── 玻璃：面板 / 弹层 ── */ #gx-island #gi-sheet,#gx-island #gi-alert{ background:radial-gradient(130% 60% at 18% 0%,rgba(255,255,255,0.06) 0%,rgba(255,255,255,0) 58%),linear-gradient(180deg,rgba(24,36,72,0.86) 0%,rgba(9,15,33,0.93) 100%)!important; -webkit-backdrop-filter:blur(28px) saturate(1.9)!important;backdrop-filter:blur(28px) saturate(1.9)!important; box-shadow:inset 0 1px 0 rgba(255,255,255,.14),inset 0 0 0 1px rgba(255,255,255,.05), 0 0 0 1px rgba(201,168,106,.16),0 24px 60px -18px rgba(2,8,24,.72),0 6px 18px -6px rgba(2,8,24,.45)!important} /* ── 玻璃：胶囊（morph 层要和胶囊同一身衣服，否则展开收起那一下会闪色） ── */ #gx-island .gi-cap,#gx-island .w443-morph{ background:radial-gradient(130% 60% at 18% 0%,rgba(255,255,255,0.06) 0%,rgba(255,255,255,0) 58%),linear-gradient(180deg,rgba(24,36,72,0.86) 0%,rgba(9,15,33,0.93) 100%)!important; -webkit-backdrop-filter:blur(24px) saturate(1.9)!important;backdrop-filter:blur(24px) saturate(1.9)!important; box-shadow:inset 0 1px 0 rgba(255,255,255,.14),inset 0 0 0 1px rgba(255,255,255,.05), 0 14px 34px -12px rgba(2,8,24,.6),0 3px 10px -4px rgba(2,8,24,.35)!important; transition:box-shadow .45s ease} #gx-island[data-w481-playing="1"] .gi-cap{ box-shadow:inset 0 1px 0 rgba(255,255,255,.16),0 0 0 1px rgba(201,168,106,.42), 0 14px 34px -12px rgba(2,8,24,.6),0 0 22px -6px rgba(201,168,106,.45)!important} /* ── 字色：变透之后必须一起提亮（自检里有算式） ── */ #gx-island .gi-rk{color:rgb(192,203,224)!important} #gx-island #gi-k{color:rgb(234,205,146)!important} /* ── 气泡：分段容器 ── */ #gx-island .gi-seg,#gx-island #gx-tts-rates{ background:rgba(255,255,255,0.06)!important; box-shadow:inset 0 1px 0 rgba(255,255,255,.07),inset 0 -1px 0 rgba(0,0,0,.18)!important;border-radius:15px!important} #gx-island #gi-voice button,#gx-island #gx-tts-rates button,#gx-island #gi-modes button{ color:rgb(214,222,236);border-radius:11px!important; transition:transform .26s cubic-bezier(.34,1.56,.64,1),background-color .2s ease,box-shadow .25s ease!important} /* 未选中项的男女小字：底变透后按新底重算的门槛（见文件头） */ #gx-island #gi-voice button.w443-v[aria-checked="false"]>small{color:rgb(238,242,248)!important;opacity:0.82!important} /* ── 气泡：选中态金泡（渐变只往亮走，最暗点＝原金） ── */ #gx-island #gi-voice button[aria-checked="true"],#gx-island #gx-tts-rates button.act,#gx-island #gi-modes button.act{ background:linear-gradient(180deg,rgb(223,195,137) 0%,rgb(201,168,106) 55%,rgb(201,168,106) 100%)!important; box-shadow:inset 0 1px 0 rgba(255,255,255,.5),inset 0 -1px 0 rgba(120,90,40,.25), 0 6px 16px -6px rgba(201,168,106,.7)!important} /* 按下：弹一下 */ #gx-island #gi-voice button:active,#gx-island #gx-tts-rates button:active,#gx-island #gi-modes button:active, #gx-island .gi-foot a:active,#gx-island #gi-card:active,#gx-island #gi-close:active, #gx-island #gi-prev:active,#gx-island #gi-next:active,#gx-island #gi-stop:active{transform:scale(.93)!important;transition-duration:.08s!important} /* ── 气泡：播放键是一颗带高光的金珠 ── */ #gx-island #gi-play,#gx-island #gi-pp{ background:radial-gradient(circle at 34% 26%,#fbe9bf 0%,#e2c48a 30%,#c9a86a 62%,#b0904f 100%)!important; box-shadow:inset 0 1px 1px rgba(255,255,255,.55),inset 0 -2px 4px rgba(90,64,24,.3), 0 6px 16px -6px rgba(201,168,106,.75)!important; transition:transform .28s cubic-bezier(.34,1.56,.64,1),box-shadow .35s ease!important} #gx-island #gi-play:active,#gx-island #gi-pp:active{transform:scale(.9)!important;transition-duration:.08s!important} #gx-island[data-w481-playing="1"] #gi-pp{animation:w482Breathe 2.8s ease-in-out infinite} @keyframes w482Breathe{ 0%,100%{box-shadow:inset 0 1px 1px rgba(255,255,255,.55),inset 0 -2px 4px rgba(90,64,24,.3),0 0 0 0 rgba(201,168,106,.0),0 6px 16px -6px rgba(201,168,106,.75)} 50%{box-shadow:inset 0 1px 1px rgba(255,255,255,.55),inset 0 -2px 4px rgba(90,64,24,.3),0 0 0 9px rgba(201,168,106,.13),0 8px 22px -6px rgba(201,168,106,.85)}} /* ── 气泡：关闭键、明信片键 ── */ #gx-island #gi-close{background:rgba(255,255,255,.09)!important; box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 2px 6px -2px rgba(0,0,0,.35)!important; transition:transform .26s cubic-bezier(.34,1.56,.64,1)!important} #gx-island #gi-card{background:linear-gradient(180deg,rgba(201,168,106,.24),rgba(201,168,106,.12))!important; box-shadow:inset 0 1px 0 rgba(255,236,190,.32),inset 0 0 0 1px rgba(201,168,106,.5),0 6px 16px -8px rgba(201,168,106,.6)!important; transition:transform .26s cubic-bezier(.34,1.56,.64,1)!important} /* ── 可访问性：要求少透明 → 直接给实底；不支持毛玻璃 → 提高不透明度 ── */ @media (prefers-reduced-transparency:reduce){ #gx-island #gi-sheet,#gx-island #gi-alert,#gx-island .gi-cap,#gx-island .w443-morph{ background:rgb(12,20,42)!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important}} @supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){ #gx-island #gi-sheet,#gx-island #gi-alert,#gx-island .gi-cap,#gx-island .w443-morph{ background:linear-gradient(180deg,rgba(24,36,72,.97),rgba(9,15,33,.98))!important}} @media (prefers-reduced-motion:reduce){ #gx-island[data-w481-playing="1"] #gi-pp{animation:none} #gx-island *{transition-duration:0s!important}}