/* 世界书 · 人物与生活圈 界面 (worldbook-people-ui.js): the 设定 / 地点 / 人物 tabs, the directory lists, the 生活圈 book page, the person page and its
   dialogs, the 待确认 page. Styles come from _handoff/worldbook/preview.html (every class carries the wbp- prefix so none of them can meet an existing
   name); colours follow the theme variables, so each rule needs no second dark copy - only the white tints below change. */
#v-world,#sheet{--wbp-w22:rgba(255,255,255,.22);--wbp-w35:rgba(255,255,255,.35);--wbp-w5:rgba(255,255,255,.5);--wbp-w55:rgba(255,255,255,.55);--wbp-w6:rgba(255,255,255,.6);--wbp-w62:rgba(255,255,255,.62);--wbp-w7:rgba(255,255,255,.7);--wbp-w72:rgba(255,255,255,.72);--wbp-w75:rgba(255,255,255,.75);--wbp-w85:rgba(255,255,255,.85);--wbp-w9:rgba(255,255,255,.9);--wbp-w95:rgba(255,255,255,.95);--wbp-base:#fff;--wbp-on-bg:#FCFCFB}
@media(prefers-color-scheme:dark){:root:not([data-theme="light"]) :is(#v-world,#sheet){--wbp-w22:rgba(255,255,255,.08);--wbp-w35:rgba(255,255,255,.06);--wbp-w5:rgba(255,255,255,.06);--wbp-w55:rgba(255,255,255,.07);--wbp-w6:rgba(255,255,255,.07);--wbp-w62:rgba(255,255,255,.08);--wbp-w7:rgba(255,255,255,.09);--wbp-w72:rgba(255,255,255,.09);--wbp-w75:rgba(255,255,255,.1);--wbp-w85:rgba(255,255,255,.12);--wbp-w9:rgba(255,255,255,.12);--wbp-w95:rgba(255,255,255,.14);--wbp-base:var(--surface);--wbp-on-bg:color-mix(in srgb,var(--surface) 75%,#fff)}}
:root[data-theme="dark"] :is(#v-world,#sheet){--wbp-w22:rgba(255,255,255,.08);--wbp-w35:rgba(255,255,255,.06);--wbp-w5:rgba(255,255,255,.06);--wbp-w55:rgba(255,255,255,.07);--wbp-w6:rgba(255,255,255,.07);--wbp-w62:rgba(255,255,255,.08);--wbp-w7:rgba(255,255,255,.09);--wbp-w72:rgba(255,255,255,.09);--wbp-w75:rgba(255,255,255,.1);--wbp-w85:rgba(255,255,255,.12);--wbp-w9:rgba(255,255,255,.12);--wbp-w95:rgba(255,255,255,.14);--wbp-base:var(--surface);--wbp-on-bg:color-mix(in srgb,var(--surface) 75%,#fff)}
.wbp-circle-mark{position:absolute;left:50%;bottom:52px;transform:translateX(-50%);width:20px;height:20px;border-radius:50%;display:grid;place-items:center;background:var(--wbp-w22);color:var(--bk-t,var(--wbp-base))}
.wbp-circle-mark svg{width:12px;height:12px;stroke-width:2}
.wbp-foot{padding:16px 24px 40px;font-size:12px;color:var(--ink2);line-height:1.7}
.wbp-rel{display:flex;align-items:center;gap:10px;margin-top:12px;padding-top:12px;border-top:1px solid var(--wb-rule,rgba(0,0,0,.08));font-size:13px}
.wbp-rel span{color:var(--ink2);flex:none}
.wbp-rel input{flex:1;min-width:0;border:none;border-bottom:1px solid var(--wb-rule,rgba(0,0,0,.12));background:none;outline:none;font-family:inherit;font-size:14px;color:var(--ink);padding:4px 0}
.wbp-mav{width:22px;height:22px;border-radius:50%;display:inline-grid;place-items:center;color:#fff;font-size:11px;font-weight:600;flex:none}
.wbp-val .wbp-mav+.wbp-mav{margin-left:-10px;box-shadow:0 0 0 1.5px #fff}
.wbp-mav.lg{width:34px;height:34px;font-size:14px}
.wbp-segrow{align-items:center}
.wbp-segrow .ee-mini-seg{margin-left:auto}
.wbp-note{margin:6px 0 4px 76px;font-size:11.5px;line-height:1.6;color:var(--ink2)}
.wbp-dlg h3{margin:0;font-family:var(--font-display);font-size:17px;color:var(--ink)}
.wbp-dlg p{margin:4px 0 12px;font-size:12px;color:var(--ink2)}
.wbp-plist{display:flex;flex-direction:column}
.wbp-pi{display:flex;align-items:center;gap:12px;padding:10px 4px;border:none;border-bottom:1px solid var(--wb-rule,rgba(0,0,0,.07));background:none;font-family:inherit;cursor:pointer;text-align:left}
.wbp-pi b{flex:1;font-size:14.5px;font-weight:500;color:var(--ink)}
.wbp-pi i{width:18px;height:18px;border:1.5px solid color-mix(in srgb,var(--ink2) 45%,transparent);flex:none}
.wbp-pi i.rd{border-radius:50%}.wbp-pi i.ck{border-radius:5px}
.wbp-pi.on i{border-color:var(--pri-deep);background:radial-gradient(circle,var(--pri-deep) 0 4.5px,transparent 5px)}
.wbp-pi.on i.ck{background:var(--pri-deep)}
.wbp-dbtns{display:flex;gap:10px;margin-top:14px}
.wbp-dbtns button{flex:1;border:none;border-radius:14px;padding:11px;font-family:inherit;font-size:14px;cursor:pointer;background:color-mix(in srgb,var(--ink2) 10%,transparent);color:var(--ink)}
.wbp-dbtns button.pri{background:var(--pri-deep);color:var(--on-pri-deep);font-weight:600}
.wbp-nc{position:relative;overflow:hidden;border-radius:26px;padding:20px 20px 16px;background:linear-gradient(160deg,color-mix(in srgb,var(--c) 22%,var(--wbp-w75)),var(--wbp-w55) 60%);border:1px solid var(--wbp-w95);box-shadow:0 16px 34px -18px color-mix(in srgb,var(--c) 60%,rgba(30,45,80,.5))}
.wbp-nc-glow{position:absolute;right:-60px;top:-70px;width:200px;height:200px;border-radius:50%;background:radial-gradient(circle,color-mix(in srgb,var(--c) 35%,transparent),transparent 70%);pointer-events:none}
.wbp-nc-top{position:relative;display:flex;align-items:center;gap:16px}
.wbp-nc-av{flex:none;width:76px;height:76px;border-radius:50%;border:none;padding:0;cursor:pointer;display:grid;place-items:center;background:color-mix(in srgb,var(--c) 85%,var(--wbp-base));color:#fff;font-family:var(--font-display);font-size:32px;font-weight:600;box-shadow:0 0 0 3px var(--wbp-w9),0 0 0 5px color-mix(in srgb,var(--c) 45%,transparent)}
.wbp-nc-av.heard{box-shadow:0 0 0 3px var(--wbp-w9);outline:1.5px dashed color-mix(in srgb,var(--c) 70%,transparent);outline-offset:4px}
.wbp-nc-av.none{opacity:.55;box-shadow:0 0 0 3px var(--wbp-w9)}
.wbp-nc-id{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.wbp-nc-name,.wbp-nc-role,.wbp-nc-quote input,.wbp-gl-in{border:none;background:none;outline:none;font-family:inherit;color:var(--ink);padding:0;min-width:0;width:100%}
.wbp-nc-name{font-family:var(--font-display);font-size:26px;font-weight:700;letter-spacing:.04em}
.wbp-nc-role{font-size:13.5px;color:var(--ink2)}
.wbp-nc-badges{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}
.wbp-nc-badge{font-size:11px;padding:3px 9px;border-radius:99px;background:var(--wbp-w6);color:var(--ink2);border:1px solid var(--wbp-w9)}
.wbp-nc-badge.rose{color:var(--ink2)}
.wbp-nc-line{display:flex;align-items:center;gap:8px;margin-top:16px;padding-top:14px;border-top:1px solid var(--wbp-w7);font-size:12.5px}
.wbp-nc-line i{flex:1;height:0;border-top:1.5px solid color-mix(in srgb,var(--c) 55%,transparent)}
.wbp-nc-line b{font-weight:600;color:var(--ink);white-space:nowrap}
.wbp-nc-dot{flex:none;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;font-size:12px;font-weight:700;color:var(--c);background:color-mix(in srgb,var(--c) 15%,var(--wbp-base));border:none;padding:0}
.wbp-nc-dot.owner{color:#fff;cursor:pointer}
.wbp-nc-own{color:var(--ink);font-size:12.5px;white-space:nowrap}
.wbp-nc-also{margin-top:10px;font-size:12px;color:var(--ink2);display:flex;align-items:center;gap:5px;flex-wrap:wrap}
.wbp-nc-mini{display:inline-grid;place-items:center;width:20px;height:20px;border-radius:50%;color:#fff;font-size:10px;font-weight:700;flex:none}
.wbp-gl-h{margin:22px 6px 8px;font-size:12.5px;color:var(--ink2);letter-spacing:.04em}
.wbp-gl{border-radius:20px;background:var(--wb-glass,var(--wbp-w55));border:1px solid var(--wb-glass-edge,var(--wbp-w95));overflow:hidden}
.wbp-gl-row{display:flex;align-items:center;gap:12px;width:100%;min-height:50px;padding:10px 16px;border:none;background:none;font-family:inherit;text-align:left;color:var(--ink);box-sizing:border-box}
button.wbp-gl-row{cursor:pointer}
.wbp-gl-row+.wbp-gl-row,.wbp-gl-note+.wbp-gl-row,.wbp-gl-tags+.wbp-gl-row{border-top:1px solid color-mix(in srgb,var(--ink) 7%,transparent)}
.wbp-gl-row>svg{width:15px;height:15px;color:var(--ink2);opacity:.6;flex:none}
.wbp-gl-row>.wbp-gl-t svg,.wbp-gl-solo>svg:first-child{width:16px;height:16px;opacity:1;color:var(--ink2)}
.wbp-gl-t{flex:1;min-width:0;font-size:14.5px;display:flex;flex-direction:column;gap:2px}
.wbp-gl-t small{font-size:11.5px;color:var(--ink2)}
.wbp-gl-v{display:flex;align-items:center;gap:6px;font-size:14px;color:var(--ink2)}
.wbp-gl-in{text-align:right;font-size:14px;flex:1}
.wbp-gl-note{margin:-4px 16px 10px;font-size:11.5px;line-height:1.6;color:var(--ink2)}
.wbp-gl-ta{display:block;width:100%;box-sizing:border-box;border:none;background:none;outline:none;resize:none;font-family:inherit;font-size:14px;line-height:1.75;color:var(--ink);padding:14px 16px 4px}
.wbp-gl-count{text-align:right;font-size:11px;color:var(--ink2);padding:0 16px 10px}
.wbp-gl-tags{display:flex;flex-wrap:wrap;gap:8px;padding:0 16px 12px}
.wbp-gl-tag{display:inline-flex;align-items:center;gap:4px;font-size:12.5px;padding:5px 10px;border-radius:99px;background:var(--wbp-w7);border:1px solid var(--wbp-w95);color:var(--ink);font-family:inherit}
.wbp-gl-tag svg{width:11px;height:11px;opacity:.5}
.wbp-gl-tag.add{background:none;border:1px dashed color-mix(in srgb,var(--ink2) 40%,transparent);color:var(--ink2);cursor:pointer}
.wbp-gl-solo{margin-top:10px;border-radius:18px;background:color-mix(in srgb,#956A77 9%,var(--wb-glass,var(--wbp-w55)));border:1px solid var(--wbp-w95)}
.wbp-gl-solo .wbp-gl-t{font-size:13px}
.wbp-gl-acts{margin-top:22px}
.wbp-gl-row.center{justify-content:center;font-size:14.5px;font-weight:600;color:var(--ink)}
.wbp-gl-row.danger{color:var(--danger,#B4606A)}
.wbp-gl .ee-mini-seg{flex:none}
.wbp-nc-rel{border:none;background:none;padding:0;font-family:inherit;font-size:13px;font-weight:600;color:var(--ink);white-space:nowrap;cursor:pointer}
.wbp-nc-sent{margin-top:8px;font-size:11.5px;color:var(--ink2);text-align:center}
.wbp-gl-t small{line-height:1.5}
.wbp-dlg.wbp-rel{max-width:340px;display:flex;flex-direction:column;max-height:calc(100% - 20px)}
.wbp-rel-sent{min-height:18px;color:var(--ink) !important;font-size:12.5px !important;background:color-mix(in srgb,var(--pri) 10%,transparent);border-radius:10px;padding:8px 10px;margin:8px 0 10px !important}
.wbp-rel-scroll{overflow-y:auto;max-height:420px;scrollbar-width:none;margin:0 -4px;padding:0 4px}
.wbp-rel-g{padding:6px 0 8px}
.wbp-rel-g small{display:block;font-size:11.5px;color:var(--ink2);margin-bottom:6px}
.wbp-rel-chips{display:flex;flex-wrap:wrap;gap:6px}
.wbp-rel-chip{border:1px solid color-mix(in srgb,var(--ink2) 22%,transparent);background:var(--wbp-w6);border-radius:99px;padding:5px 11px;font-family:inherit;font-size:12.5px;color:var(--ink);cursor:pointer;display:inline-flex;align-items:center;gap:4px;transition:transform .38s cubic-bezier(.34,1.56,.64,1)}
.wbp-rel-chip:active{transform:scale(.92);transition-duration:90ms}
.wbp-rel-chip.on{border-color:var(--pri-deep);background:color-mix(in srgb,var(--pri) 16%,var(--wbp-base));color:var(--ink);font-weight:600}
.wbp-rel-chip.add{border-style:dashed;color:var(--ink2);background:none}
.wbp-rel-chip svg{width:12px;height:12px}
.wbp-rel-custom{display:flex;flex-direction:column;gap:8px}
.wbp-rel-custom label{display:flex;align-items:center;gap:8px;font-size:12.5px;color:var(--ink2)}
.wbp-rel-custom input{flex:1;min-width:0;border:none;border-bottom:1px solid color-mix(in srgb,var(--ink2) 30%,transparent);background:none;outline:none;font-family:inherit;font-size:14px;color:var(--ink);padding:4px 0}
.wbp-nc-sub{display:flex;align-items:baseline;gap:8px}
.wbp-nc-sub .wbp-nc-role{flex:1}
.wbp-nc-age{flex:none;font-size:12.5px;color:var(--ink2)}
.wbp-nc-tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:14px;border:none;background:none;padding:0;cursor:pointer;font-family:inherit}
.wbp-nc-tags span{font-size:13px;padding:5px 12px;border-radius:99px;background:var(--wbp-w62);border:1px solid var(--wbp-w95);color:color-mix(in srgb,var(--c) 70%,var(--ink))}
.wbp-nc-tags em{font-style:normal;font-size:13px;color:var(--ink2);padding:5px 12px;border:1px dashed color-mix(in srgb,var(--ink2) 40%,transparent);border-radius:99px}
.wbp-stp{display:flex;align-items:center;gap:6px}
.wbp-stp button{width:30px;height:30px;border-radius:50%;border:1px solid color-mix(in srgb,var(--ink2) 22%,transparent);background:var(--wbp-w7);font-family:inherit;font-size:16px;color:var(--ink);cursor:pointer;transition:transform .38s cubic-bezier(.34,1.56,.64,1)}
.wbp-stp button:active{transform:scale(.88);transition-duration:90ms}
.wbp-stp input{width:40px;text-align:center;border:none;background:none;outline:none;font-family:inherit;font-size:15px;color:var(--ink);font-variant-numeric:tabular-nums}
.wbp-stp span{font-size:13px;color:var(--ink2);margin-right:4px}
.wbp-pl-seg{margin:4px 0 10px;width:100%;display:flex}
.wbp-pl-seg button{flex:1}
.wbp-pl-search{display:flex;align-items:center;gap:8px;padding:8px 12px;border-radius:12px;background:var(--wbp-w7);border:1px solid color-mix(in srgb,var(--ink2) 15%,transparent);margin-bottom:6px;color:var(--ink2)}
.wbp-pl-search svg{width:15px;height:15px}
.wbp-pl-search input{flex:1;min-width:0;border:none;background:none;outline:none;font-family:inherit;font-size:13.5px;color:var(--ink)}
.wbp-pl-ic{width:30px;height:30px;border-radius:10px;display:grid;place-items:center;background:color-mix(in srgb,var(--pri) 12%,transparent);color:var(--ink);flex:none}
.wbp-pl-ic svg{width:15px;height:15px}
.wbp-pi b small{display:block;font-size:11.5px;font-weight:400;color:var(--ink2);margin-top:2px}
.wbp-pl-empty{font-size:12.5px;color:var(--ink2);text-align:center;padding:14px 0}
.wbp-pl-note{font-size:11.5px !important;margin:8px 0 0 !important}
.wbp-cl{padding:26px 24px 0}
.wbp-cl-h{display:flex;align-items:baseline;gap:10px;padding-bottom:10px;border-bottom:1px solid var(--ink)}
.wbp-cl-mark{width:9px;height:9px;background:var(--c);flex:none;align-self:center;transform:rotate(45deg)}
.wbp-cl-h h2{margin:0;font-family:var(--font-display);font-size:20px;font-weight:600;letter-spacing:.06em;color:var(--ink)}
.wbp-cl-n{font-size:12px;color:var(--ink2);letter-spacing:.08em}
.wbp-cl-go,.wbp-cl-assign{margin-left:auto;border:none;background:none;padding:0;font-family:inherit;font-size:12px;color:var(--ink2);cursor:pointer;white-space:nowrap}
.wbp-cl-k{display:inline-block;width:7px;height:7px;border-radius:50%;flex:none;transform:translateY(-3px)}
.wbp-cl-k.know{background:var(--c,var(--ink))}
.wbp-cl-k.heard{border:1.2px solid var(--c,var(--ink));box-sizing:border-box}
.wbp-cl-legend .wbp-cl-k{transform:none;--c:var(--ink2)}
.wbp-cl-star{display:inline-grid;place-items:center;color:var(--ink2);font-style:normal;transform:translateY(-2px)}
.wbp-cl-star svg{width:12px;height:12px}
.wbp-cl-legend .wbp-cl-star{transform:none}
.wbp-cl-more{margin:14px 0 0;font-family:var(--font-display);font-size:13px;font-style:italic;color:var(--ink2);letter-spacing:.04em;text-align:center}
.wbp-cl-un{--c:#8A94A3}
#v-world .wbp-cl-e,#v-world .wbp-cl-e:hover,#v-world .wbp-cl-e:focus,#v-world .wbp-cl-e:active,#v-world .wbp-cl-e:focus-visible{background:none !important;box-shadow:none !important;outline:none}
#v-world .wbp-cl-e:focus-visible .wbp-cl-l1 b{text-decoration:underline;text-underline-offset:4px}
#v-world .wbp-cl-e:active .wbp-cl-l1 b{color:var(--c)}
#v-world .wbp-cl-e:active .wbp-cl-dots{border-color:var(--c)}
.wbp-cl-spine{width:5px;height:20px;border-radius:1px;background:var(--c);flex:none;align-self:center;box-shadow:inset 1.5px 0 0 rgba(0,0,0,.15)}
.wbp-cl-search{display:flex;align-items:center;gap:8px;margin:14px 24px 0;padding:8px 4px 8px 0;border-bottom:1px solid var(--ink);color:var(--ink2);animation:moFade 180ms ease-out backwards}
.wbp-cl-search svg{width:16px;height:16px;flex:none}
.wbp-cl-search input{flex:1;min-width:0;border:none;background:none;outline:none;font-family:inherit;font-size:14.5px;color:var(--ink)}
.wbp-cl-x{border:none;background:none;padding:2px;cursor:pointer;color:var(--ink2);display:grid}
.wbp-cl-filter{display:flex;justify-content:flex-end;flex-wrap:wrap;gap:2px;padding:0 20px}
.wbp-cl-filter button{border:none;background:none;font-family:inherit;font-size:12px;color:var(--ink2);padding:3px 8px;border-radius:99px;cursor:pointer}
.wbp-cl-filter button.on{color:var(--ink);background:color-mix(in srgb,var(--pri) 14%,transparent);font-weight:600}
.wbp-cl-none{text-align:center;font-size:13px;color:var(--ink2);padding:40px 0 0}
.wbp-cl mark{background:color-mix(in srgb,var(--c) 22%,transparent);color:inherit;border-radius:2px;padding:0 1px}
.wbp-sw-row{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;padding:16px 24px 2px}
.wbp-sw-row::-webkit-scrollbar{display:none}
.wbp-sw-p,.wbp-sw-b{flex:none;display:flex;flex-direction:column;align-items:center;gap:5px;min-width:62px;padding:4px 4px 8px;border:none;background:none;font-family:inherit;cursor:pointer;color:var(--ink2);position:relative}
.wbp-sw-p::after,.wbp-sw-b::after{content:"";position:absolute;left:22%;right:22%;bottom:0;height:1.5px;background:var(--ink);transform:scaleX(0);transition:transform 240ms cubic-bezier(.22,.9,.3,1)}
.wbp-sw-p.on::after,.wbp-sw-b.on::after{transform:none}
.wbp-sw-av{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;color:#fff;font-weight:700;font-size:16px;background:var(--c);opacity:.55;transition:opacity .2s,transform .38s cubic-bezier(.34,1.56,.64,1)}
.wbp-sw-p.on .wbp-sw-av{opacity:1;box-shadow:0 0 0 2px var(--wb-paper,var(--wbp-base)),0 0 0 3.5px var(--c)}
.wbp-sw-p:active .wbp-sw-av{transform:scale(.9);transition-duration:90ms}
.wbp-sw-p b,.wbp-sw-b b{font-size:12.5px;font-weight:500;white-space:nowrap}
.wbp-sw-p.on b,.wbp-sw-b.on b{color:var(--ink);font-weight:600}
.wbp-sw-p small,.wbp-sw-b small{position:absolute;top:0;right:6px;font-size:10px;color:var(--ink2);font-variant-numeric:tabular-nums}
.wbp-sw-b{min-width:72px;padding-top:8px}
.wbp-sw-spine{width:12px;height:34px;border-radius:2px 3px 3px 2px;background:var(--c);opacity:.6;box-shadow:inset 3px 0 0 rgba(0,0,0,.15);transition:opacity .2s}
.wbp-sw-b.on .wbp-sw-spine{opacity:1}
.wbp-cl-go{display:inline-flex;align-items:center;gap:3px}
.wbp-cl-go svg{width:13px;height:13px}
.wbp-cl-filter{justify-content:flex-start;padding:10px 0 0;gap:4px}
.wbp-cl-filter button{display:inline-flex;align-items:center;gap:5px}
.wbp-cl-filter .wbp-cl-k,.wbp-cl-filter .wbp-cl-star{transform:none;--c:var(--ink2)}
.r1 .wbp-cl-dots{min-width:12px}
.wbp-cl-intro{margin:10px 0 0;font-size:12px;color:var(--ink2)}
.wbp-cl .wbp-cl-h{border-bottom-width:1px}
.wbp-r2{display:flex;align-items:baseline;gap:10px;width:100%;min-width:0;padding:9px 0;border:none;background:none !important;font-family:inherit;text-align:left;cursor:pointer;outline:none;color:var(--ink)}
.wbp-r2 .wbp-cl-k{flex:none;transform:translateY(-2px);width:6px;height:6px}
.wbp-r2-pin{flex:none;width:6px;height:6px;border-radius:1px;background:color-mix(in srgb,var(--c) 70%,transparent);transform:translateY(-2px) rotate(45deg)}
.wbp-r2 b{flex:none;font-family:var(--font-display);font-size:16px;font-weight:600;letter-spacing:.05em;white-space:nowrap;transition:color .25s}
.wbp-r2:active b{color:var(--c)}
.wbp-r2 .wbp-cl-star{margin-left:-6px}
.wbp-r2-m{flex:1;min-width:0;font-size:13px;color:color-mix(in srgb,var(--ink) 62%,transparent);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wbp-r2-static{cursor:default}
.wbp-r2-static .wbp-cl-assign{flex:none;margin-left:6px}
.wbp-cl-filter button{color:color-mix(in srgb,var(--ink) 62%,transparent)}
.wbp-ob .wbp-r2{padding:9px 0}
.wd-entry-tag.wbp-dim{opacity:.55;margin-left:2px}
.wd-circle-more,.wbp-cl-more{margin-top:14px}
.wbp-r2-av{display:none}
.wbp-ts{margin:22px 0 0}
.wbp-ts-tab{display:flex;align-items:baseline;gap:7px}
.wbp-ts-tab small{letter-spacing:0}
.wbp-ts .wbp-r2{display:grid;grid-template-columns:auto auto 1fr;column-gap:10px;row-gap:2px;align-items:center;padding:9px 0}
.wbp-ts .wbp-r2>.wbp-cl-k,.wbp-ts .wbp-r2>.wbp-r2-pin,.wbp-ts .wbp-r2>.wbp-r2-av{grid-column:1;grid-row:1/span 2}
.wbp-ts .wbp-r2>.wbp-cl-k{transform:none}
.wbp-ts .wbp-r2>.wbp-r2-pin{transform:rotate(45deg)}
.wbp-ts .wbp-r2>b{grid-column:2;grid-row:1;font-size:16px}
.wbp-ts .wbp-r2>.wbp-cl-star{grid-column:3;grid-row:1;justify-self:start;margin-left:-4px}
.wbp-ts .wbp-r2>.wbp-r2-m{grid-column:2/-1;grid-row:2;font-size:12.5px;line-height:1.5;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:color-mix(in srgb,var(--ink) 55%,transparent)}
.wbp-ts .wbp-r2>.wbp-cl-k,.wbp-ts .wbp-r2>.wbp-r2-pin{align-self:start;margin-top:9px}
.wbp-cl{counter-reset:grp}
.wbp-ts{counter-increment:grp;margin-top:26px}
.wbp-ts-tab{font-family:var(--font-display);font-size:15px;font-weight:600;letter-spacing:.12em;color:var(--ink);padding-bottom:4px}
.wbp-ts-tab::before{content:counter(grp,decimal-leading-zero);font-family:Georgia,serif;font-style:italic;font-size:22px;font-weight:400;color:color-mix(in srgb,var(--c) 75%,transparent);margin-right:4px;letter-spacing:0}
.wbp-ts-tab small{color:color-mix(in srgb,var(--ink) 40%,transparent)}
.wbp-ts-sheet{padding-left:38px}
.wbp-ts .wbp-r2{padding:7px 0}
.wbp-r2-r{display:none}
.wbp-ts .wbp-r2>.wbp-r2-r{grid-column:4;grid-row:1;justify-self:end;font-family:Georgia,var(--font-display),serif;font-style:italic;font-size:12px;color:color-mix(in srgb,var(--ink) 45%,transparent);white-space:nowrap}
.wbp-ts .wbp-r2{grid-template-columns:auto auto 1fr auto}
.wbp-ts{display:grid;grid-template-columns:52px 1fr;align-items:start}
.wbp-ts-tab{flex-direction:column;align-items:flex-start;gap:2px;padding-top:12px;font-size:13.5px}
.wbp-ts-tab::before{font-size:30px;line-height:1;margin:0 0 4px}
.wbp-ts-sheet{padding:6px 16px;background:var(--wbp-w72);border-radius:16px;box-shadow:0 4px 14px rgba(40,50,70,.05)}
.wbp-ts .wbp-r2>.wbp-r2-r{display:block}
.wbp-sw-p{transition:background .2s,box-shadow .2s,color .2s}
.wbp-sw-row:has(.wbp-sw-p){gap:18px;padding:18px 24px 0}
.wbp-sw-p{flex-direction:row;gap:7px;min-width:0;padding:0 0 9px}
.wbp-sw-av{width:22px;height:22px;font-size:11px}
.wbp-sw-p.on .wbp-sw-av{box-shadow:none}
.wbp-sw-p small{position:static}
.wbp-sw-p::after{left:0;right:0;height:2px;background:var(--c)}
.wbp-sw-row:has(.wbp-sw-b){gap:8px;padding:18px 24px 4px}
.wbp-sw-b{flex-direction:row;gap:7px;min-width:0;padding:7px 13px;border-radius:999px;background:var(--wbp-w35)}
.wbp-sw-b::after{display:none}
.wbp-sw-spine{width:7px;height:7px;border-radius:50%;box-shadow:none}
.wbp-sw-b.on{background:var(--wbp-on-bg);box-shadow:0 3px 10px rgba(40,50,70,.08)}
.wbp-sw-b small{position:static}
.wbp-b6-list{display:flex;flex-direction:column;gap:4px;margin-top:12px}
.wbp-b6-list button{display:flex;align-items:center;gap:10px;padding:11px 12px;border:none;border-radius:12px;background:none;font:inherit;color:var(--ink);cursor:pointer;text-align:left}
.wbp-b6-list button.on{background:color-mix(in srgb,var(--c) 12%,transparent)}
.wbp-b6-list i{width:8px;height:8px;border-radius:50%;background:var(--c)}
.wbp-b6-list b{flex:1;font-family:var(--font-display);font-size:15px}
.wbp-b6-list small{color:var(--ink2);font-size:12px}
.wbp-sw-wrap{display:flex;align-items:center;gap:4px;padding-right:20px}
.wbp-sw-wrap .wbp-sw-row{flex:1;min-width:0;-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 28px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 28px),transparent);padding-right:28px !important;scroll-behavior:smooth}
.wbp-sw-all{flex:none;border:none;background:none;font:inherit;font-size:12px;color:var(--ink2);padding:6px 4px;cursor:pointer;white-space:nowrap;margin-top:12px}
.wbp-sw-all::after{content:" ›"}
.wbp-b6-list .wbp-sw-av{width:28px;height:28px;font-size:12px;opacity:1;box-shadow:none}
.wbp-b6-list{max-height:52vh;overflow-y:auto;scrollbar-width:none}
.wbp-dlg .wbp-pl-search{margin-top:12px}
.wbp-r2-fold{display:flex;align-items:center;gap:4px;margin:2px 0 4px;padding:8px 0 4px 20px;border:none;background:none !important;font:inherit;font-size:12.5px;color:color-mix(in srgb,var(--c) 75%,#555);cursor:pointer}
.wbp-r2-fold i{display:grid;width:14px;height:14px}
.wbp-r2-fold i svg{width:14px;height:14px}
.wbp-r2-fold i svg{transform:rotate(90deg)}.wbp-r2-fold i.up svg{transform:rotate(-90deg)}
/* the segmented control of the person page (the preview's flat, underlined look) */
.wbp-seg{display:flex;gap:6px;padding:0;background:transparent}
.wbp-seg button{min-width:28px;padding:5px 7px;border:none;border-radius:9px;background:transparent;color:var(--ink2);font-family:inherit;font-size:12.5px;cursor:pointer;box-shadow:none}
.wbp-seg button.active{color:var(--ink);font-weight:700;text-decoration:underline;text-underline-offset:4px}
.wbp-gl .wbp-seg{flex:none}
.wbp-segrow .wbp-seg{margin-left:auto}
.wbp-cl-k.none{border:1.2px dotted var(--c,var(--ink));box-sizing:border-box;opacity:.6}
.wbp-r2-m,.wbp-r2 b{min-width:0}
.wbp-empty{margin:40px 24px;text-align:center;font-size:13px;line-height:1.8;color:var(--ink2)}
.wbp-empty button{margin-top:12px;border:none;border-radius:99px;padding:8px 18px;font-family:inherit;font-size:13px;color:var(--on-pri-deep);background:var(--pri-deep);cursor:pointer}
.wbp-page{padding:0 16px 40px}
.wbp-pend-card{margin:12px 16px 0;padding:14px 16px 12px;border-radius:18px;background:var(--wbp-w72);border:1px solid var(--wbp-w95);box-shadow:0 4px 14px rgba(40,50,70,.05)}
.wbp-pend-card b{display:block;font-family:var(--font-display);font-size:16px;font-weight:600;letter-spacing:.05em;color:var(--ink)}
.wbp-pend-card small{display:block;margin-top:4px;font-size:12px;line-height:1.6;color:var(--ink2)}
.wbp-pend-acts{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.wbp-pend-acts button{border:none;border-radius:99px;padding:7px 14px;font-family:inherit;font-size:12.5px;cursor:pointer;white-space:nowrap;background:color-mix(in srgb,var(--ink2) 10%,transparent);color:var(--ink)}
.wbp-pend-acts button.pri{background:var(--pri-deep);color:var(--on-pri-deep)}
.wbp-dlg.wbp-rel{max-width:none;max-height:calc(100dvh - 90px)}
.wbp-gl-v{flex-wrap:nowrap;text-align:right;min-width:0;justify-content:flex-end}
.wbp-gl-v .wbp-mav{margin-right:2px}

.wbp-rel-scroll::-webkit-scrollbar,.wbp-b6-list::-webkit-scrollbar,.wbp-pend-list::-webkit-scrollbar{display:none}
/* buttons inside the dialogs and cards keep the preview's regular weight (the app's button default is heavier) */
.wbp-dlg button,.wbp-gl button,.wbp-nc button,.wbp-cl button,.wbp-sw-row button,.wbp-pend-card button{font-weight:400}
.wbp-dlg .wbp-rel-chip.on,.wbp-seg button.active,.wbp-cl-filter button.on,.wbp-sw-p.on b,.wbp-sw-b.on b,.wbp-dlg .wbp-dbtns button.pri{font-weight:600}
.wbp-seg button.active{font-weight:700}
/* the dialog body fills the modal (the modal is a flex box) and lets the list inside it scroll */
.wbp-dlg>#wbp-dlg-body{flex:1;width:100%;min-width:0;min-height:0;display:flex;flex-direction:column}
.wbp-dlg .wbp-rel-scroll{flex:1;min-height:0;max-height:none}
/* 「N 条新设定待确认 ›」: one thin line under the tabs, the height of a filter row */
.wbp-pend-bar{display:block;margin:6px 24px 0;padding:4px 10px;border:none;border-radius:99px;background:color-mix(in srgb,var(--pri) 10%,transparent);color:var(--ink);font-family:inherit;font-size:12px;font-weight:400;line-height:1.5;text-align:left;cursor:pointer}
/* the 生活圈 book's button adds a person */
.wd-fab.is-person::after{content:'添加人物'}
html[lang="en"] .wd-fab.is-person::after{content:'Add person'}
/* a message shows above the dialog while one is open, never over its buttons */
body:has(.wbp-dlg) #toast-host{bottom:auto;top:calc(20px + var(--sat,0px))}
/* a long name must not break the circle's title: one line with an ellipsis, the count never wraps */
.wbp-cl-h h2{min-width:0;flex:0 1 auto;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.wbp-cl-n{flex:none;white-space:nowrap}
.wbp-cl-empty{display:flex;flex-direction:column;align-items:center;gap:12px;padding:44px 0 20px;color:var(--ink2);font-size:13px}
.wbp-cl-empty p{margin:0}
.wbp-cl-empty button{display:inline-flex;align-items:center;gap:4px;border:1px solid color-mix(in srgb,var(--ink) 25%,transparent);background:none;border-radius:99px;padding:8px 18px;font-family:inherit;font-size:13px;color:var(--ink);cursor:pointer}
.wbp-cl-empty button svg{width:14px;height:14px}
/* the person page: the card only shows; the list below holds every field */
.wbp-nc-name.empty{color:var(--ink2);font-weight:500}
.wbp-gl-intro{margin:-4px 6px 8px;font-size:11.5px;line-height:1.6;color:var(--ink2)}
.wbp-gl-t small{display:block;margin-top:2px;font-size:11px;font-weight:400;color:var(--ink2)}
.wbp-gl-t{min-width:0}
.wbp-gl-in{min-width:0}
.wbp-rel-grp{margin-top:10px}
.wbp-rel-grp small{display:block;margin-bottom:6px;font-size:11.5px;color:var(--ink2)}
#person-title,#person-sub{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
