/* The count doubles as a find-in-text control. The topic name itself is left
   untouched - it still links to its archive. */
.dv-tf-pair{white-space:nowrap}
.dv-tf{position:relative;display:inline-block;margin-left:3px;padding:0;border:0;
 background:none;cursor:pointer;font:500 9.5px/1 "Noto Sans Mono",ui-monospace,monospace;
 color:#a49b8e;vertical-align:super;letter-spacing:.02em}
.dv-tf:hover,.dv-tf:focus-visible{color:#F16522;outline:none}
.dv-tf.is-on{color:#F16522}
/* The glyph is small, so the hit area is enlarged with a pseudo-element rather
   than padding, which would shift the line. Kept tight horizontally on purpose:
   any wider and it starts stealing taps from the neighbouring topic link. */
.dv-tf::after{content:'';position:absolute;inset:-9px -7px}

.dv-tf-clear{position:relative;margin-left:12px;padding:0;border:0;background:none;
 cursor:pointer;font:500 9.5px/1 "Noto Sans Mono",ui-monospace,monospace;
 letter-spacing:.09em;text-transform:uppercase;color:#F16522;white-space:nowrap}
.dv-tf-clear::after{content:'';position:absolute;inset:-10px -8px}
.dv-tf-clear[hidden]{display:none}

mark.dv-hl{background:#ffeec9;color:inherit;border-radius:2px;padding:0 1px;
 box-shadow:0 0 0 1px rgba(241,101,34,.18)}
mark.dv-hl.is-cur{background:#ffc85e;box-shadow:0 0 0 2px rgba(241,101,34,.45)}
/* Sticky navigator.
   Centred with auto margins rather than left:50% + translateX(-50%). Two
   reasons: it is genuinely centred at any width, and iOS Safari is far more
   reliable about keeping a fixed element pinned during scroll when no transform
   is fighting it. The compositing hint below is the other half of that fix. */
.dv-nav{position:fixed;left:0;right:0;margin-inline:auto;
 width:-moz-fit-content;width:fit-content;
 bottom:calc(16px + env(safe-area-inset-bottom,0px));
 z-index:9998;display:flex;align-items:center;gap:9px;
 backface-visibility:hidden;-webkit-backface-visibility:hidden}
.dv-nav[hidden]{display:none}
.dv-nav-b{width:44px;height:44px;border-radius:50%;border:0;cursor:pointer;
 background:#ffc85e;color:#4a3812;font:700 15px/1 "Noto Sans Mono",ui-monospace,monospace;
 box-shadow:0 3px 14px rgba(0,0,0,.24);display:flex;align-items:center;justify-content:center;
 transition:background .12s ease;flex:0 0 auto}
.dv-nav-b:hover,.dv-nav-b:focus-visible{background:#ffb62a;outline:none}
.dv-nav-b:active{background:#f5a712}
.dv-nav-mid{display:flex;align-items:center;gap:10px;height:34px;padding:0 6px 0 13px;
 border-radius:17px;background:#fff;box-shadow:0 3px 14px rgba(0,0,0,.18);
 font:500 11px/1 "Noto Sans Mono",ui-monospace,monospace;color:#4a4237;white-space:nowrap}
.dv-nav-x{width:24px;height:24px;border:0;border-radius:50%;background:none;cursor:pointer;
 color:#a49b8e;font:600 11px/1 -apple-system,sans-serif;display:flex;align-items:center;
 justify-content:center;flex:0 0 auto}
.dv-nav-x:hover,.dv-nav-x:focus-visible{color:#F16522;background:#f6f2ec;outline:none}

/* While the navigator is open the back-to-top button stands aside. At 390px
   there is not room for both, and the navigator is the tool in active use -
   jumping to the top would throw away the reader's place among the matches. */
/* display, not opacity: the component runs its own opacity transition and a
   half-finished transition kept holding the old value. */
html.dv-nav-open .bde-back-to-top{display:none}

/* Easier to hit on a phone. */
@media (max-width:767px){
 .dv-tf{font-size:12px;margin-left:4px}
 .dv-tf::after{inset:-11px -8px}
 .dv-tf-clear{font-size:10px}
 .dv-nav-b{width:48px;height:48px;font-size:16px}
 .dv-nav-mid{height:38px;font-size:11.5px}
}