/* O3's existing panel reads the NetShow tokens in light and dark. */
.ns-hb[hidden], .ns-hb [hidden] { display: none !important; }
.ns-hb {
    position: fixed;
    z-index: 10020;
    left: 12px;
    top: 144px;
    width: min(540px, calc(100vw - 24px));
    max-height: calc(100dvh - 24px);
    overflow: auto;
    box-sizing: border-box;
    border: 1px solid var(--ns-border, #dadce0);
    border-radius: 18px;
    background: var(--ns-card, #fff);
    color: var(--ns-text, #202124);
    font: 14px/1.5 var(--ns-font, Arial, sans-serif);
    pointer-events: none;
}
.ns-hb[data-layout="beside"] { width: min(540px, calc(100vw - 24px)); }
.ns-hb[data-layout="under"] { width: calc(100vw - 24px); }
.ns-hb__bar { display: flex; gap: 8px; align-items: center; padding: 12px 16px; border-bottom: 1px solid var(--ns-border, #dadce0); }
.ns-hb__site { min-width: 0; flex: 1; overflow-wrap: anywhere; }
.ns-hb__view { padding: 12px 16px; }
/* Line 17187 (RT-09): the task card and its progress, ns-tokens only. */
.ns-hb__card { margin: 12px 16px 0; padding: 12px 14px; border-radius: 12px; background: var(--ns-surface-2, #f1f3f4); }
.ns-hb__card-title { display: block; font-weight: 600; overflow-wrap: anywhere; }
.ns-hb__card-line { margin: 4px 0 0; overflow-wrap: anywhere; }
.ns-hb__progress { display: block; width: calc(100% - 32px); height: 6px; margin: 12px 16px 0; accent-color: var(--ns-link, #1a73e8); }
.ns-hb__progress[hidden], .ns-hb__card[hidden] { display: none; }
.ns-hb__frame { display: block; width: 100%; height: auto; max-height: 50dvh; object-fit: contain; border-radius: 10px; }
.ns-hb__step { margin: 10px 0 0; overflow-wrap: anywhere; }
.ns-hb__note { margin: 0; padding: 0 16px 12px; color: var(--ns-text-2, #5f6368); }
.ns-hb__yours { display: block; padding: 0 16px 16px; color: var(--ns-link, #1a73e8); pointer-events: auto; overflow-wrap: anywhere; }

@media (prefers-color-scheme: dark) {
    .ns-hb { background: var(--ns-card, #2d2e31); color: var(--ns-text, #e8eaed); border-color: var(--ns-border, #5f6368); }
    .ns-hb__bar { border-color: var(--ns-border, #5f6368); }
    .ns-hb__note { color: var(--ns-text-2, #9aa0a6); }
    .ns-hb__card { background: var(--ns-surface-2, #3c4043); }
    .ns-hb__yours { color: var(--ns-link, #8ab4f8); }
}
