/* =========================================================================
   Knowledge Base (Hybrid): docs styling for /knowledge-base/**. Loaded after styles.css + site.css.
   Light, calm and very readable: white pages, mist bands, one dark video band on the KB home, and
   the Hybrid "landmark" motif (yellow lock-on ring) on the search box and video play buttons.
   Generated pages come from tools/build-kb.mjs.
   ========================================================================= */
.kb .ico { width: 1em; height: 1em; flex: none; }
.kb-page { width: min(var(--maxw), 100% - 2 * var(--gutter)); margin-inline: auto; }
.kb mark { background: rgba(254, 192, 32, .38); color: inherit; border-radius: 3px; padding: 0 1px; }

/* ---------- KB sub-bar (section nav + compact search) ---------- */
.kb-bar { position: relative; z-index: 40; background: rgba(255, 255, 255, .92); border-bottom: 1px solid var(--line); }
.kb-bar__in { width: min(var(--maxw), 100% - 2 * var(--gutter)); margin-inline: auto; display: flex; align-items: center; gap: 26px; min-height: 60px; }
.kb-bar__home { display: inline-flex; align-items: center; gap: 9px; font-weight: 700; font-size: 15px; letter-spacing: -.01em; color: var(--ink); white-space: nowrap; }
.kb-bar__home:hover { text-decoration: none; color: var(--blue-t); }
.kb-bar__dot { width: 9px; height: 9px; border-radius: 50%; background: var(--yellow); box-shadow: 0 0 0 3px rgba(254, 192, 32, .25); }
.kb-bar__nav { display: flex; gap: 20px; font-size: 14px; font-weight: 500; }
.kb-bar__nav a { position: relative; color: var(--ink-2); padding: 19px 0; white-space: nowrap; }
.kb-bar__nav a:hover { color: var(--ink); text-decoration: none; }
.kb-bar__nav a[aria-current] { color: var(--blue-t); }
.kb-bar__nav a[aria-current]::after { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 2px; border-radius: 2px; background: var(--blue); }
.kb-bar .kb-search { margin-left: auto; width: min(360px, 38vw); }

/* ---------- search ---------- */
.kb-search { position: relative; display: flex; align-items: center; }
.kb-search input { width: 100%; height: 40px; padding: 0 44px 0 38px; border-radius: 999px; border: 1px solid var(--line-2); background: #fff; font: inherit; font-size: 14.5px; color: var(--ink); -webkit-appearance: none; appearance: none; transition: border-color .2s, box-shadow .2s; }
.kb-search input::placeholder { color: #7d8a9c; }
.kb-search input::-webkit-search-cancel-button { -webkit-appearance: none; appearance: none; }
.kb-search input:focus { outline: none; border-color: var(--blue); box-shadow: 0 0 0 4px rgba(0, 128, 178, .14); }
.kb-search__ico { position: absolute; left: 13px; width: 17px; height: 17px; color: var(--ink-3); pointer-events: none; z-index: 1; }
.kb-search__kbd { position: absolute; right: 12px; min-width: 22px; height: 22px; padding: 0 6px; display: grid; place-items: center; border-radius: 6px; font: 600 12px/1 var(--font); color: var(--ink-3); background: var(--bg-2); box-shadow: inset 0 -1px 0 var(--line-2), inset 0 0 0 1px var(--line); pointer-events: none; transition: opacity .2s; }
.kb-search input:focus ~ .kb-search__kbd, .kb-search input:not(:placeholder-shown) ~ .kb-search__kbd { opacity: 0; }
.kb-search__go { position: absolute; right: 5px; width: 30px; height: 30px; border-radius: 50%; display: grid; place-items: center; color: var(--ink-3); opacity: 0; pointer-events: none; transition: opacity .2s, background .2s, color .2s; }
.kb-search__go .ico { width: 15px; height: 15px; }
.kb-search input:not(:placeholder-shown) ~ .kb-search__go { opacity: 1; pointer-events: auto; }
.kb-search__go:hover { background: var(--ink); color: #fff; }
.kb-search--big { width: min(740px, 100%); }
.kb-search--big input { height: 68px; padding: 0 150px 0 60px; font-size: 18.5px; border: 0; box-shadow: inset 0 0 0 1px rgba(11, 26, 46, .09), 0 2px 4px rgba(11, 26, 46, .05), 0 30px 60px -30px rgba(0, 60, 100, .45); }
.kb-search--big input:focus { box-shadow: inset 0 0 0 1.5px var(--blue), 0 0 0 6px rgba(0, 128, 178, .12), 0 30px 60px -30px rgba(0, 60, 100, .45); }
.kb-search--big .kb-search__ico { left: 23px; width: 22px; height: 22px; color: var(--blue-t); }
.kb-search--big .kb-search__kbd { right: 138px; }
.kb-search--big .kb-search__go { opacity: 1; pointer-events: auto; right: 10px; width: auto; height: 48px; padding: 0 24px; gap: 8px; display: inline-flex; align-items: center; border-radius: 999px; background: var(--ink); color: #fff; font-weight: 600; font-size: 15.5px; transition: transform var(--dur-xs) var(--ease-out), background .2s; }
.kb-search--big .kb-search__go:hover { background: #000; transform: translateY(-1px); }
.kb-search--big .kb-search__go:hover::after { content: ""; position: absolute; left: 0; right: 0; top: 100%; height: 3px; } /* hover stays put (styles.css, .btn) */
.kb-search--big .kb-search__go .ico { display: none; }
/* landmark lock-on ring while the big search has focus (same motif as the App Store badge) */
.kb-search--big::before { content: ""; position: absolute; inset: -8px; border-radius: 999px; box-shadow: 0 0 0 1.5px var(--yellow); opacity: 0; transform: scale(1.015); transition: opacity .25s var(--ease-out), transform .35s var(--ease-spring); pointer-events: none; }
.kb-search--big::after { content: ""; position: absolute; inset: -16px; pointer-events: none; opacity: 0; transition: opacity .2s var(--ease-out) .05s;
  background: linear-gradient(var(--yellow), var(--yellow)) 50% 0 / 1.5px 8px no-repeat, linear-gradient(var(--yellow), var(--yellow)) 50% 100% / 1.5px 8px no-repeat,
              linear-gradient(var(--yellow), var(--yellow)) 0 50% / 8px 1.5px no-repeat, linear-gradient(var(--yellow), var(--yellow)) 100% 50% / 8px 1.5px no-repeat; }
.kb-search--big:focus-within::before { opacity: 1; transform: none; }
.kb-search--big:focus-within::after { opacity: 1; }
/* suggestions */
.kb-search__pop { position: absolute; left: 0; right: 0; top: calc(100% + 10px); z-index: 90; background: #fff; border-radius: 18px; padding: 8px; text-align: left; max-height: min(70vh, 540px); overflow: auto; overscroll-behavior: contain; box-shadow: 0 0 0 1px var(--line), 0 30px 70px -24px rgba(11, 26, 46, .4); animation: kb-pop .18s var(--ease-out); }
.kb-bar .kb-search__pop { left: auto; width: min(480px, calc(100vw - 2 * var(--gutter))); }
@keyframes kb-pop { from { opacity: 0; transform: translateY(-4px); } }
.kb-sr a { display: grid; gap: 3px; padding: 11px 14px; border-radius: 12px; color: var(--ink); }
.kb-sr a:hover, .kb-sr[aria-selected="true"] a { background: #eef6fa; text-decoration: none; }
.kb-sr__c { font-size: 12px; font-weight: 600; color: var(--blue-t); }
.kb-sr__v { color: var(--ink-3); font-weight: 500; }
.kb-sr__t { font-size: 15.5px; font-weight: 650; line-height: 1.3; letter-spacing: -.005em; }
.kb-sr__x { font-size: 13.5px; line-height: 1.45; color: var(--ink-2); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.kb-pop__all { display: block; margin-top: 6px; padding: 12px 14px; border-top: 1px solid var(--line); font-size: 14px; font-weight: 600; }
.kb-pop__none { padding: 16px 14px; font-size: 14.5px; color: var(--ink-2); }

/* ---------- KB home hero (the only aurora on KB pages) ---------- */
.kb-hero { position: relative; isolation: isolate; z-index: 3; padding: clamp(64px, 10vw, 132px) 0 clamp(60px, 8vw, 104px); text-align: center; }
.kb-hero .aurora { -webkit-mask-image: linear-gradient(180deg, #000 72%, transparent); mask-image: linear-gradient(180deg, #000 72%, transparent); }
.kb-hero .hero__grid { -webkit-mask-image: radial-gradient(60% 70% at 50% 40%, #000 0%, transparent 75%); mask-image: radial-gradient(60% 70% at 50% 40%, #000 0%, transparent 75%); }
.kb-hero__in { position: relative; z-index: 2; width: min(900px, 100% - 2 * var(--gutter)); margin-inline: auto; display: grid; justify-items: center; }
.kb-hero__h { font-size: clamp(46px, 7.4vw, 96px); line-height: .98; letter-spacing: -.052em; font-weight: 800; text-wrap: balance; }
.kb-hero__h .kb-l2 { background: linear-gradient(90deg, var(--blue) 0%, #0a9cc9 55%, #1fb3d1 100%); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; padding-bottom: .06em; }
.kb-hero__sub { margin-top: 20px; max-width: 46ch; font-size: clamp(17px, 1.5vw, 20px); line-height: 1.5; color: var(--ink-2); text-wrap: pretty; }
.kb-hero .kb-search { margin-top: clamp(28px, 4vw, 40px); }
.kb-hero__chips { margin-top: 20px; display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; }
.kb-hero__chips a { display: inline-flex; height: 34px; align-items: center; padding: 0 14px; border-radius: 999px; background: rgba(255, 255, 255, .7); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); box-shadow: inset 0 0 0 1px rgba(0, 128, 178, .16); font-size: 13.5px; font-weight: 500; color: var(--ink-2); transition: background .2s, color .2s, transform .2s var(--ease-out); }
.kb-hero__chips a:hover { position: relative; background: #fff; color: var(--blue-t); text-decoration: none; transform: translateY(-1px); }
.kb-hero__chips a:hover::after { content: ""; position: absolute; left: 0; right: 0; top: 100%; height: 3px; } /* hover stays put (styles.css, .btn) */
.kb-hero__stats { margin-top: clamp(30px, 4vw, 44px); display: flex; flex-wrap: wrap; justify-content: center; gap: 10px 40px; font-size: 14px; color: var(--ink-3); }
.kb-hero__stats li { display: grid; justify-items: center; }
.kb-hero__stats b { font-size: 26px; line-height: 1.1; font-weight: 750; letter-spacing: -.03em; color: var(--ink); font-variant-numeric: tabular-nums; }

/* ---------- sections ---------- */
.kb-sec { padding: clamp(64px, 8vw, 108px) 0; }
.kb-sec--mist { background: #edf4f8; }
.kb-sec__head { margin-bottom: clamp(28px, 4vw, 46px); }
.kb-sec__head--row { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px 40px; flex-wrap: wrap; }
.kb-sec__head--row .lede { max-width: 40ch; }
.kb-sec__h { font-size: clamp(30px, 3.8vw, 48px); }
.kb-sec-h { font-size: clamp(22px, 2.2vw, 28px); font-weight: 750; letter-spacing: -.025em; line-height: 1.2; }

/* product family cards */
.kb-fams { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.kb-fam { position: relative; display: flex; flex-direction: column; padding: 26px 26px 24px; border-radius: var(--r); background: #fff; box-shadow: inset 0 0 0 1px var(--line), var(--shadow-1); transition: transform .35s var(--ease-out), box-shadow .35s var(--ease-out); }
.kb-fam:hover { transform: translateY(-3px); box-shadow: inset 0 0 0 1px rgba(0, 128, 178, .28), var(--shadow-2); }
.kb-fam__hit { position: absolute; inset: 0; border-radius: inherit; z-index: 1; }
.kb-fam:hover .kb-fam__hit::after { content: ""; position: absolute; left: 0; right: 0; top: 100%; height: 5px; } /* hover stays put (styles.css, .btn): the strip belongs to the card's link */
.kb-fam__top { display: flex; justify-content: space-between; align-items: center; }
.kb-fam__n { font-size: 12.5px; font-weight: 600; color: var(--blue-t); background: rgba(0, 128, 178, .08); padding: 5px 10px; border-radius: 999px; font-variant-numeric: tabular-nums; }
.kb-fam__h { margin-top: 18px; font-size: 19px; line-height: 1.28; font-weight: 700; letter-spacing: -.02em; text-wrap: balance; }
.kb-fam__d { margin-top: 8px; font-size: 14.5px; line-height: 1.5; color: var(--ink-2); }
.kb-fam__subs, .kb-fam__arts { position: relative; z-index: 2; margin-top: 16px; display: grid; gap: 1px; }
.kb-fam__subs a, .kb-fam__arts a { display: flex; justify-content: space-between; gap: 12px; padding: 7px 10px; margin-inline: -10px; border-radius: 10px; font-size: 14.5px; line-height: 1.35; color: var(--ink); }
.kb-fam__subs a:hover, .kb-fam__arts a:hover { background: #eef6fa; color: var(--blue-t); text-decoration: none; }
.kb-fam__subs span { color: var(--ink-3); font-size: 13px; font-variant-numeric: tabular-nums; }
.kb-fam__go { margin-top: auto; padding-top: 18px; display: inline-flex; align-items: center; gap: 6px; font-size: 14.5px; font-weight: 600; color: var(--blue-t); }
.kb-fam__go .ico { width: 14px; height: 14px; transition: transform .25s var(--ease-out); }
.kb-fam:hover .kb-fam__go .ico { transform: translateX(3px); }

/* product icons */
.kb-ico { width: var(--s, 44px); height: var(--s, 44px); flex: none; border-radius: 23%; box-shadow: 0 8px 16px -10px rgba(0, 60, 100, .55); object-fit: cover; }
.kb-ico--ray { display: block; background: url(../assets/img/logos/logo-postureray-2025.png) 0 50% / auto 100% no-repeat; border-radius: 22%; }
.kb-ico--doc, .kb-ico--tag { display: grid; place-items: center; background: linear-gradient(135deg, #e3f3fa, #cbe8f4); color: var(--blue-t); --s: 52px; }
.kb-ico--doc .ico, .kb-ico--tag .ico { width: 46%; height: 46%; }

/* article cards */
.kb-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.kb-card > a { position: relative; display: flex; flex-direction: column; gap: 8px; height: 100%; padding: 22px 22px 18px; border-radius: 18px; background: #fff; color: var(--ink); box-shadow: inset 0 0 0 1px var(--line); transition: transform .3s var(--ease-out), box-shadow .3s var(--ease-out); }
.kb-card > a:hover { text-decoration: none; transform: translateY(-2px); box-shadow: inset 0 0 0 1px rgba(0, 128, 178, .28), var(--shadow-1); }
.kb-card > a:hover::after { content: ""; position: absolute; left: 0; right: 0; top: 100%; height: 4px; } /* hover stays put (styles.css, .btn) */
.kb-card__top { display: flex; align-items: center; gap: 10px; margin-bottom: 4px; }
.kb-card__top .kb-ico { --s: 26px; border-radius: 7px; box-shadow: 0 4px 10px -6px rgba(0, 60, 100, .5); }
.kb-card__top .kb-ico--doc { --s: 26px; }
.kb-card__c { font-size: 12.5px; font-weight: 600; color: var(--blue-t); }
.kb-card__t { font-size: 17.5px; font-weight: 650; line-height: 1.3; letter-spacing: -.014em; text-wrap: pretty; }
.kb-card__d { font-size: 14.5px; line-height: 1.5; color: var(--ink-2); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.kb-card__m { margin-top: auto; padding-top: 12px; display: flex; flex-wrap: wrap; align-items: center; gap: 4px 14px; border-top: 1px solid var(--line); }
.kb-card__go { margin-left: auto; width: 30px; height: 30px; border-radius: 50%; display: grid; place-items: center; color: var(--ink-3); transition: background .2s, color .2s, transform .25s var(--ease-out); }
.kb-card__go .ico { width: 14px; height: 14px; }
.kb-card > a:hover .kb-card__go { background: var(--ink); color: #fff; transform: translateX(2px); }
.kb-card__thumb { position: relative; display: block; aspect-ratio: 16 / 9; background: #0b1a2e; overflow: hidden; }
.kb-strip__th img { width: 100%; height: 100%; object-fit: cover; transition: transform .7s var(--ease-out); }
.kb-strip__i a:hover img { transform: scale(1.045); }
.kb-card__play { position: absolute; left: 14px; bottom: 14px; width: 38px; height: 38px; border-radius: 50%; display: grid; place-items: center; background: rgba(255, 255, 255, .94); color: var(--ink); box-shadow: 0 8px 20px -8px rgba(0, 0, 0, .5); }
.kb-card__play .ico { width: 13px; height: 13px; margin-left: 2px; }
.kb-card__dur { position: absolute; right: 10px; bottom: 10px; padding: 4px 7px; border-radius: 6px; background: rgba(5, 8, 13, .76); color: #fff; font: 600 12px/1.2 var(--font); font-variant-numeric: tabular-nums; }

/* dark video band */
.kb-vband { padding: clamp(64px, 8vw, 108px) 0; background: radial-gradient(70% 90% at 85% 0%, rgba(38, 188, 215, .14), transparent 70%), #071a30; color: var(--dk-ink); overflow: hidden; }
.kb-vband .kb-sec__h { color: #fff; }
.kb-strip { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(250px, 296px); gap: 20px; overflow-x: auto; scroll-snap-type: x proximity; margin-inline: calc(50% - 50vw); padding: 4px max(var(--gutter), calc((100vw - var(--maxw)) / 2)) 18px; scroll-padding-inline: max(var(--gutter), calc((100vw - var(--maxw)) / 2)); scrollbar-width: thin; scrollbar-color: rgba(255, 255, 255, .25) transparent; }
.kb-strip:focus-visible { outline-offset: -3px; }
.kb-strip__i { scroll-snap-align: start; }
.kb-strip__i a { display: grid; gap: 10px; color: #fff; }
.kb-strip__i a:hover { text-decoration: none; }
.kb-strip__th { position: relative; display: block; aspect-ratio: 16 / 9; border-radius: 14px; overflow: hidden; background: #0d2440; box-shadow: 0 0 0 1px rgba(255, 255, 255, .08), 0 20px 40px -24px rgba(0, 0, 0, .8); }
.kb-strip__c { font-size: 12.5px; font-weight: 600; color: var(--sky); }
.kb-strip__t { font-size: 16px; font-weight: 600; line-height: 1.32; letter-spacing: -.01em; margin-top: -4px; }
.kb-strip__i a:hover .kb-strip__t { color: var(--sky-l); }

/* recently updated */

/* ---------- article rows ---------- */
.kb-rows { display: grid; border-top: 1px solid var(--line); }
.kb-row > a { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) auto; column-gap: 20px; row-gap: 3px; padding: 18px 6px 18px 2px; border-bottom: 1px solid var(--line); color: var(--ink); transition: background .2s; }
.kb-row > a:hover { text-decoration: none; background: linear-gradient(90deg, rgba(0, 128, 178, .055), rgba(0, 128, 178, 0) 70%); }
.kb-row__t { grid-column: 1; font-size: 16.5px; font-weight: 650; line-height: 1.35; letter-spacing: -.01em; text-wrap: pretty; transition: color .2s; }
.kb-row > a:hover .kb-row__t { color: var(--blue-t); }
.kb-row__d { grid-column: 1; font-size: 14.5px; line-height: 1.5; color: var(--ink-2); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.kb-row__m { grid-column: 1; display: flex; flex-wrap: wrap; gap: 4px 14px; margin-top: 5px; }
.kb-row__m:empty { display: none; }
.kb-row__go { grid-column: 2; grid-row: 1 / span 3; align-self: center; width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center; color: var(--ink-3); transition: background .2s, color .2s, transform .25s var(--ease-out); }
.kb-row__go .ico { width: 15px; height: 15px; }
.kb-row > a:hover .kb-row__go { background: var(--ink); color: #fff; transform: translateX(2px); }
.kb-m { display: inline-flex; align-items: center; gap: 5px; font-size: 12.5px; line-height: 1.4; color: var(--ink-3); white-space: nowrap; }
.kb-m .ico { width: 14px; height: 14px; }
.kb-m--vid { color: #0a6f96; font-weight: 600; }
.kb-m--cat { color: var(--ink-2); font-weight: 600; white-space: normal; }
.kb-empty { padding: 24px 2px; color: var(--ink-3); }

/* ---------- archive pages (category / tag) ---------- */
.kb-arch { display: grid; grid-template-columns: 252px minmax(0, 1fr); gap: clamp(32px, 5vw, 72px); padding: clamp(32px, 4vw, 52px) 0 clamp(64px, 8vw, 100px); }
.kb-arch__side { min-width: 0; }
.kb-tree { position: sticky; top: calc(var(--hdr) + 24px); max-height: calc(100vh - var(--hdr) - 48px); overflow: auto; padding: 2px 6px 12px 0; scrollbar-width: thin; }
.kb-tree__h, .kb-toc__h, .kb-tags__h { font-size: 11.5px; font-weight: 700; letter-spacing: .09em; text-transform: uppercase; color: var(--ink-3); margin-bottom: 10px; }
.kb-tree ul { display: grid; gap: 1px; }
.kb-tree ul ul { margin: 2px 0 8px 12px; padding-left: 6px; border-left: 1px solid var(--line); }
.kb-tree ul ul.is-folded { display: none; }
.kb-tree a { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; padding: 6px 10px; border-radius: 9px; font-size: 13.5px; line-height: 1.35; color: var(--ink-2); }
.kb-tree > ul > li > a { font-weight: 600; color: var(--ink); font-size: 14px; }
.kb-tree a:hover { background: var(--bg-2); color: var(--ink); text-decoration: none; }
.kb-tree .n { font-size: 12px; font-weight: 500; color: var(--ink-3); font-variant-numeric: tabular-nums; }
.kb-tree li.is-cur > a { background: rgba(0, 128, 178, .09); color: var(--blue-t); font-weight: 650; }
.kb-tree li.is-cur > a .n { color: var(--blue-t); }
.kb-tree__vid { margin-top: 16px; display: flex; justify-content: flex-start !important; align-items: center; gap: 8px; padding: 11px 13px; border-radius: 12px; background: var(--bg-2); font-size: 14px; font-weight: 600; color: var(--ink); }
.kb-tree__vid .ico { width: 17px; height: 17px; color: var(--blue-t); }
.kb-tree__vid:hover { background: var(--bg-3); text-decoration: none; }
.kb-crumbs { margin-bottom: 18px; }
.kb-crumbs .crumbs span[aria-current] { color: var(--ink-2); }
.kb-arch__head { padding-bottom: 26px; }
.kb-arch__title { display: flex; align-items: center; gap: 18px; }
.kb-arch__title .eyebrow { margin-bottom: 6px; }
.kb-h1 { font-size: clamp(32px, 4.3vw, 54px); line-height: 1.04; letter-spacing: -.038em; font-weight: 800; text-wrap: balance; }
.kb-arch__desc { margin-top: 16px; max-width: 62ch; font-size: clamp(16.5px, 1.4vw, 18.5px); line-height: 1.55; color: var(--ink-2); text-wrap: pretty; }
.kb-arch__stats { margin-top: 18px; display: flex; flex-wrap: wrap; gap: 8px; }
.kb-arch__stats span { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border-radius: 999px; background: var(--bg-2); font-size: 13px; font-weight: 600; color: var(--ink-2); }
.kb-arch__stats .ico { width: 14px; height: 14px; color: var(--blue-t); }
.kb-subs { margin: 6px 0 12px; }
.kb-subgrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 12px; }
.kb-sub { display: grid; align-content: start; gap: 4px; height: 100%; padding: 16px 18px; border-radius: 16px; background: #fff; color: var(--ink); box-shadow: inset 0 0 0 1px var(--line); transition: transform .3s var(--ease-out), box-shadow .3s; }
.kb-sub:hover { position: relative; text-decoration: none; transform: translateY(-2px); box-shadow: inset 0 0 0 1px rgba(0, 128, 178, .3), var(--shadow-1); }
.kb-sub:hover::after { content: ""; position: absolute; left: 0; right: 0; top: 100%; height: 4px; } /* hover stays put (styles.css, .btn) */
.kb-sub__t { font-weight: 650; font-size: 15.5px; line-height: 1.3; }
.kb-sub__d { font-size: 13.5px; line-height: 1.45; color: var(--ink-3); }
.kb-sub__d:empty { display: none; }
.kb-sub__n { margin-top: 6px; display: inline-flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 600; color: var(--blue-t); }
.kb-sub__n .ico { width: 13px; height: 13px; transition: transform .25s var(--ease-out); }
.kb-sub:hover .kb-sub__n .ico { transform: translateX(3px); }
.kb-listsec { margin-top: 30px; }
.kb-listbar { display: flex; justify-content: space-between; align-items: center; gap: 12px 20px; flex-wrap: wrap; margin-bottom: 12px; }
.kb-listbar__h { font-size: 19px; font-weight: 700; letter-spacing: -.02em; line-height: 1.3; }
.kb-listbar__tools { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.kb-filter { position: relative; display: flex; align-items: center; }
.kb-filter .kb-search__ico { left: 12px; width: 15px; height: 15px; }
.kb-filter input { width: 230px; height: 38px; padding: 0 14px 0 35px; border-radius: 999px; border: 1px solid var(--line-2); background: #fff; font: inherit; font-size: 14px; color: var(--ink); -webkit-appearance: none; appearance: none; }
.kb-filter input:focus { outline: none; border-color: var(--blue); box-shadow: 0 0 0 4px rgba(0, 128, 178, .13); }
.kb-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
.kb-cotags { margin-top: 44px; }
.kb-chip { display: inline-flex; align-items: center; gap: 6px; padding: 6px 11px; border-radius: 999px; background: #fff; box-shadow: inset 0 0 0 1px var(--line-2); font-size: 13px; line-height: 1.2; color: var(--ink-2); transition: color .2s, box-shadow .2s; }
.kb-chip .ico { width: 12px; height: 12px; color: var(--ink-3); }
.kb-chip .n { font-size: 11.5px; color: var(--ink-3); font-variant-numeric: tabular-nums; }
.kb-chip:hover { color: var(--blue-t); box-shadow: inset 0 0 0 1px var(--blue); text-decoration: none; }
.kb-chip:hover .ico { color: var(--blue-t); }

/* ---------- article page ---------- */
.kb-art { padding: clamp(28px, 4vw, 48px) 0 clamp(52px, 7vw, 88px); }
.kb-art__head { max-width: 880px; }
.kb-art__cats { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 16px; }
.kb-pill { display: inline-flex; align-items: center; padding: 5px 11px; border-radius: 999px; background: var(--bg-2); font-size: 12.5px; font-weight: 600; line-height: 1.3; color: var(--ink-2); transition: background .2s, color .2s; }
.kb-pill:hover { background: var(--bg-3); color: var(--ink); text-decoration: none; }
.kb-pill--on { background: rgba(0, 128, 178, .1); color: var(--blue-t); }
.kb-art__title { font-size: clamp(31px, 4.1vw, 52px); line-height: 1.07; letter-spacing: -.036em; font-weight: 800; text-wrap: balance; }
.kb-art__title--long { font-size: clamp(28px, 3.2vw, 42px); line-height: 1.12; letter-spacing: -.03em; }
.kb-art__meta { margin-top: 18px; display: flex; flex-wrap: wrap; gap: 6px 18px; }
.kb-art__meta .kb-m { font-size: 13.5px; }
.kb-art__grid { margin-top: clamp(26px, 3.4vw, 44px); display: grid; grid-template-columns: minmax(0, 728px) minmax(0, 1fr); gap: clamp(32px, 5vw, 84px); align-items: start; }
.kb-art__main { min-width: 0; }
.kb-art__rail { min-width: 0; height: 100%; }
.kb-rail { position: sticky; top: calc(var(--hdr) + 28px); display: grid; gap: 30px; max-width: 300px; max-height: calc(100vh - var(--hdr) - 56px); overflow: auto; padding: 2px 4px 8px 0; scrollbar-width: thin; }
.kb-toc ol { display: grid; border-left: 1px solid var(--line); }
.kb-toc a { display: block; margin-left: -1px; padding: 5px 0 5px 14px; border-left: 2px solid transparent; font-size: 13.5px; line-height: 1.4; color: var(--ink-3); transition: color .2s, border-color .2s; }
.kb-toc li.l3 a { padding-left: 26px; font-size: 13px; }
.kb-toc a:hover { color: var(--ink); text-decoration: none; }
.kb-toc a.is-active { color: var(--blue-t); border-left-color: var(--blue); font-weight: 600; }
.kb-incat ul { display: grid; gap: 1px; margin-bottom: 12px; }
.kb-incat li a { display: block; padding: 6px 10px; margin-inline: -10px; border-radius: 9px; font-size: 13.5px; line-height: 1.38; color: var(--ink-2); }
.kb-incat li a:hover { background: var(--bg-2); color: var(--ink); text-decoration: none; }
.kb-incat li.is-cur a { background: #eef6fa; color: var(--ink); font-weight: 600; box-shadow: inset 2px 0 0 var(--blue); }
.kb-toc-m { display: none; margin-bottom: 22px; border-radius: 14px; background: var(--bg-2); }
.kb-toc-m summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; align-items: center; padding: 13px 16px; font-weight: 650; font-size: 15px; }
.kb-toc-m summary::-webkit-details-marker { display: none; }
.kb-toc-m summary span { font-size: 13px; font-weight: 500; color: var(--ink-3); }
.kb-toc-m summary span::after { content: "+"; margin-left: 10px; font-size: 18px; color: var(--blue-t); }
.kb-toc-m[open] summary span::after { content: "–"; }
.kb-toc-m .kb-toc { padding: 0 16px 14px; }
.kb-toc-m .kb-toc__h { display: none; }

/* summary lead */
.kb-summary { position: relative; margin-bottom: 32px; padding: 20px 24px 21px 26px; border-radius: 16px; background: linear-gradient(135deg, #eaf5fa, #f5fafc); box-shadow: inset 0 0 0 1px rgba(0, 128, 178, .12); }
.kb-summary::before { content: ""; position: absolute; left: 0; top: 18px; bottom: 18px; width: 3px; border-radius: 0 3px 3px 0; background: linear-gradient(var(--blue), var(--sky)); }
.kb-summary__h { font-size: 11.5px; font-weight: 700; letter-spacing: .09em; text-transform: uppercase; color: var(--blue-t); margin-bottom: 6px; }
.kb-summary__p { font-size: 18px; line-height: 1.62; color: var(--ink); text-wrap: pretty; }
.kb-summary__p a { text-decoration: underline; text-decoration-color: rgba(0, 116, 162, .35); text-underline-offset: 3px; }
.kb-soon { margin-bottom: 26px; padding: 18px 22px; border-radius: 16px; background: #fff8e6; box-shadow: inset 0 0 0 1px rgba(254, 192, 32, .55); font-size: 15.5px; line-height: 1.55; color: var(--ink-2); }
.kb-soon__h { font-weight: 700; color: var(--ink); margin-bottom: 3px; }

/* prose */
.kb-prose { font-size: 17.5px; line-height: 1.72; color: #1b2a3d; overflow-wrap: break-word; }
.kb-prose > * + * { margin-top: 1.05em; }
.kb-prose h2, .kb-prose h3, .kb-prose h4, .kb-prose h5, .kb-prose h6 { position: relative; color: var(--ink); text-wrap: balance; }
.kb-prose h2 { margin-top: 2.1em; font-size: 27px; line-height: 1.25; letter-spacing: -.026em; font-weight: 750; }
.kb-prose h3 { margin-top: 1.85em; font-size: 21px; line-height: 1.32; letter-spacing: -.016em; font-weight: 700; }
.kb-prose h4 { margin-top: 1.6em; font-size: 18px; line-height: 1.4; font-weight: 700; }
.kb-prose h5, .kb-prose h6 { margin-top: 1.4em; font-size: 16px; font-weight: 700; }
.kb-prose > :first-child { margin-top: 0; }
.kb-prose h2 + *, .kb-prose h3 + *, .kb-prose h4 + * { margin-top: .55em; }
.kb-prose a { color: var(--blue-t); text-decoration: underline; text-decoration-color: rgba(0, 116, 162, .32); text-decoration-thickness: 1.5px; text-underline-offset: 3px; transition: text-decoration-color .2s; }
.kb-prose a:hover { text-decoration-color: currentColor; }
.kb-prose a.ext::after { content: "↗"; display: inline-block; margin-left: 2px; font-size: .78em; opacity: .55; text-decoration: none; }
.kb-prose strong { font-weight: 650; color: var(--ink); }
.kb-prose ul, .kb-prose ol { padding-left: 1.5em; }
.kb-prose ul { list-style: none; }
.kb-prose ol { list-style: decimal; }
.kb-prose li { position: relative; padding-left: .15em; }
.kb-prose li + li { margin-top: .42em; }
.kb-prose ul > li::before { content: ""; position: absolute; left: -1.05em; top: .7em; width: 6px; height: 6px; border-radius: 50%; background: var(--sky); }
.kb-prose ul ul > li::before { background: none; box-shadow: inset 0 0 0 1.5px var(--sky); }
.kb-prose ol > li::marker { color: var(--blue-t); font-weight: 700; font-variant-numeric: tabular-nums; }
.kb-prose li > ul, .kb-prose li > ol, .kb-prose li > p + * { margin-top: .42em; }
.kb-prose li > p + p { margin-top: .6em; }
.kb-prose code { padding: .12em .4em; border-radius: 6px; background: var(--bg-2); box-shadow: inset 0 0 0 1px var(--line); font: 500 .86em/1.4 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; color: #0d2a45; }
.kb-prose pre { padding: 18px 20px; border-radius: 14px; background: #0b1a2e; color: #e3edf6; overflow: auto; font-size: 14px; line-height: 1.6; box-shadow: var(--shadow-1); }
.kb-prose pre code { padding: 0; background: none; box-shadow: none; color: inherit; font-size: inherit; }
.kb-prose blockquote { padding: 16px 20px 16px 22px; border-radius: 14px; background: #fff9ea; box-shadow: inset 3px 0 0 var(--yellow), inset 0 0 0 1px rgba(254, 192, 32, .28); color: var(--ink); }
.kb-prose blockquote > * + * { margin-top: .6em; }
.kb-prose blockquote h2, .kb-prose blockquote h3 { margin-top: .2em; font-size: 19px; }
.kb-prose hr { height: 1px; border: 0; background: var(--line); margin-block: 2.2em; }
.kb-prose img { border-radius: 12px; }
.kb-fig { margin-block: 1.7em; }
.kb-fig img { margin-inline: auto; width: auto; max-height: 760px; border-radius: 14px; box-shadow: 0 0 0 1px var(--line), 0 24px 50px -30px rgba(11, 26, 46, .45); }
.kb-fig img + img { margin-top: 16px; }
.kb-prose p img { display: inline-block; vertical-align: middle; max-height: 640px; box-shadow: 0 0 0 1px var(--line); }
.kb-table { overflow-x: auto; border-radius: 14px; box-shadow: inset 0 0 0 1px var(--line); }
.kb-table table { width: 100%; border-collapse: collapse; font-size: 15px; line-height: 1.5; }
.kb-table th { padding: 11px 14px; background: var(--bg-2); text-align: left; font-weight: 650; color: var(--ink); border-bottom: 1px solid var(--line-2); vertical-align: bottom; }
.kb-table td { padding: 11px 14px; border-top: 1px solid var(--line); vertical-align: top; }
.kb-table tbody tr:first-child td { border-top: 0; }
.kb-table tbody tr:nth-child(even) td { background: #fafcfd; }
/* numbered steps lifted from "**1. Step title** 0:46" lines */
.kb-prose .kb-step { display: flex; align-items: flex-start; flex-wrap: wrap; column-gap: 14px; row-gap: 6px; }
.kb-step__n { flex: none; width: 32px; height: 32px; margin-top: -1px; border-radius: 50%; display: grid; place-items: center; background: linear-gradient(135deg, var(--blue), #1eb0d0); color: #fff; font-size: 15px; font-weight: 700; letter-spacing: 0; box-shadow: 0 6px 14px -6px rgba(0, 128, 178, .65); font-variant-numeric: tabular-nums; }
.kb-prose h2.kb-step .kb-step__n { width: 36px; height: 36px; font-size: 16px; }
.kb-step__t { flex: 1 1 220px; min-width: 0; }
.kb-ts { display: inline-flex; align-items: center; gap: 6px; height: 27px; padding: 0 11px; border-radius: 999px; background: rgba(0, 128, 178, .09); font: 600 12.5px/1 var(--font); color: var(--blue-t) !important; text-decoration: none !important; font-variant-numeric: tabular-nums; letter-spacing: 0; vertical-align: middle; transition: background .2s, color .2s; }
.kb-ts .ico { width: 9px; height: 9px; }
.kb-ts:hover { background: var(--blue); color: #fff !important; }
.kb-ts--plain { background: var(--bg-2); color: var(--ink-3) !important; }
.kb-step__t .kb-ts { margin-left: 10px; vertical-align: .14em; }
.kb-prose h2 > .kb-ts, .kb-prose h3 > .kb-ts, .kb-prose h4 > .kb-ts { margin-left: 10px; vertical-align: .14em; }
.kb-anchor { margin-left: 8px; font-weight: 500; color: var(--ink-3) !important; text-decoration: none !important; opacity: 0; transition: opacity .2s; }
.kb-prose h2:hover .kb-anchor, .kb-prose h3:hover .kb-anchor, .kb-prose h4:hover .kb-anchor, .kb-anchor:focus-visible { opacity: 1; }


/* ---------- YouTube facade ---------- */
.kb-video { margin-block: 1.8em; }
.kb-prose > .kb-video:first-child { margin-top: 0; }
.kb-video__play, .kb-video__frame { position: relative; display: block; aspect-ratio: 16 / 9; border-radius: 18px; overflow: hidden; background: #05080d; box-shadow: 0 0 0 1px rgba(11, 26, 46, .08), 0 30px 60px -34px rgba(11, 26, 46, .6); }
.kb-video__play img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .9s var(--ease-out), filter .4s; }
.kb-video__play::after { content: ""; position: absolute; inset: 0; background: radial-gradient(60% 60% at 50% 50%, rgba(5, 8, 13, 0), rgba(5, 8, 13, .28)), linear-gradient(180deg, rgba(5, 8, 13, 0) 55%, rgba(5, 8, 13, .5)); transition: opacity .4s; }
.kb-video__btn { position: absolute; z-index: 2; left: 50%; top: 50%; width: 78px; height: 78px; margin: -39px 0 0 -39px; border-radius: 50%; display: grid; place-items: center; background: rgba(255, 255, 255, .95); color: var(--ink); box-shadow: 0 16px 36px -12px rgba(0, 0, 0, .6); transition: transform .35s var(--ease-spring), background .2s; }
.kb-video__btn .ico { width: 24px; height: 24px; margin-left: 4px; }
.kb-video__btn::before { content: ""; position: absolute; inset: -9px; border-radius: 50%; box-shadow: 0 0 0 1.5px var(--yellow); opacity: 0; transform: scale(1.18); transition: opacity .25s var(--ease-out), transform .35s var(--ease-spring); }
.kb-video__btn::after { content: ""; position: absolute; inset: -19px; opacity: 0; transition: opacity .2s var(--ease-out) .05s;
  background: linear-gradient(var(--yellow), var(--yellow)) 50% 0 / 1.5px 8px no-repeat, linear-gradient(var(--yellow), var(--yellow)) 50% 100% / 1.5px 8px no-repeat,
              linear-gradient(var(--yellow), var(--yellow)) 0 50% / 8px 1.5px no-repeat, linear-gradient(var(--yellow), var(--yellow)) 100% 50% / 8px 1.5px no-repeat; }
.kb-video__play:hover .kb-video__btn, .kb-video__play:focus-visible .kb-video__btn { transform: scale(1.06); }
.kb-video__play:hover .kb-video__btn::before, .kb-video__play:focus-visible .kb-video__btn::before { opacity: 1; transform: none; }
.kb-video__play:hover .kb-video__btn::after, .kb-video__play:focus-visible .kb-video__btn::after { opacity: 1; }
.kb-video__play:hover img { transform: scale(1.03); }
.kb-video__play:focus-visible { outline-offset: 4px; border-radius: 18px; }
.kb-video__dur { position: absolute; z-index: 2; right: 14px; bottom: 14px; padding: 5px 8px; border-radius: 7px; background: rgba(5, 8, 13, .78); color: #fff; font: 600 12.5px/1.2 var(--font); font-variant-numeric: tabular-nums; }
.kb-video__frame iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.kb-video figcaption { display: flex; justify-content: space-between; align-items: baseline; gap: 6px 16px; flex-wrap: wrap; margin-top: 11px; font-size: 14px; line-height: 1.45; color: var(--ink-3); }
.kb-video__t { color: var(--ink-2); font-weight: 600; }
.kb-video__m { white-space: nowrap; }
.kb-video__m a { color: var(--ink-3); }
.kb-video--gone { padding: 16px 20px; border-radius: 14px; background: var(--bg-2); box-shadow: inset 0 0 0 1px var(--line); font-size: 15px; line-height: 1.5; color: var(--ink-3); }
.kb-video--gone p { display: flex; gap: 10px; align-items: flex-start; }
.kb-video--gone .ico { width: 18px; height: 18px; margin-top: 2px; opacity: .7; }

/* ---------- article footer ---------- */
.kb-art__foot { margin-top: 52px; display: grid; gap: 26px; }
.kb-tags { display: flex; flex-wrap: wrap; align-items: baseline; gap: 10px 14px; }
.kb-tags__h { margin: 0; }
.kb-tags ul { display: flex; flex-wrap: wrap; gap: 6px; }
.kb-helpful { display: grid; grid-template-columns: auto auto minmax(0, 1fr); align-items: center; gap: 12px 18px; padding: 18px 22px; border-radius: 18px; background: var(--bg-2); }
.kb-helpful__q { font-weight: 650; font-size: 15.5px; }
.kb-helpful__btns { display: flex; gap: 8px; }
.kb-hbtn { display: inline-flex; align-items: center; gap: 6px; height: 36px; padding: 0 16px; border-radius: 999px; background: #fff; box-shadow: inset 0 0 0 1px var(--line-2); font-size: 14px; font-weight: 600; transition: transform var(--dur-xs) var(--ease-out), background .2s, color .2s; }
.kb-hbtn .ico { width: 13px; height: 13px; }
.kb-hbtn:hover { position: relative; transform: translateY(-1px); box-shadow: inset 0 0 0 1px var(--blue); }
.kb-hbtn:hover::after { content: ""; position: absolute; left: 0; right: 0; top: 100%; height: 3px; } /* hover stays put (styles.css, .btn) */
.kb-hbtn[aria-pressed="true"] { background: var(--ink); color: #fff; box-shadow: none; }
.kb-helpful__thanks { grid-column: 1 / -1; font-weight: 600; color: #17784a; font-size: 14.5px; }
.kb-helpful__more { justify-self: end; font-size: 14px; color: var(--ink-3); text-align: right; }
.kb-helpful.is-done .kb-helpful__more { grid-column: 1 / -1; justify-self: start; text-align: left; }
.kb-helpful.is-no .kb-helpful__more { color: var(--ink); font-size: 15px; }
.kb-pn { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.kb-pn__a { display: grid; align-content: start; gap: 4px; padding: 16px 18px; border-radius: 16px; box-shadow: inset 0 0 0 1px var(--line); color: var(--ink); transition: box-shadow .2s, transform .25s var(--ease-out); }
.kb-pn__a:hover { position: relative; text-decoration: none; box-shadow: inset 0 0 0 1px var(--blue); transform: translateY(-1px); }
.kb-pn__a:hover::after { content: ""; position: absolute; left: 0; right: 0; top: 100%; height: 3px; } /* hover stays put (styles.css, .btn) */
.kb-pn__a--next { text-align: right; justify-items: end; }
.kb-pn__l { display: inline-flex; align-items: center; gap: 4px; font-size: 12.5px; font-weight: 600; color: var(--ink-3); }
.kb-pn__l .ico { width: 13px; height: 13px; }
.kb-pn__t { font-weight: 650; font-size: 15px; line-height: 1.35; }

/* related + contact */
.kb-related { padding: clamp(52px, 6vw, 84px) 0; background: #f3f7fa; border-top: 1px solid var(--line); }
.kb-related .kb-sec-h { margin-bottom: 24px; }
.kb-help { padding: clamp(56px, 7vw, 100px) 0; }
.kb-related + .kb-help { background: #f3f7fa; padding-top: 0; }
.kb-help__in { position: relative; overflow: hidden; width: min(var(--maxw), 100% - 2 * var(--gutter)); margin-inline: auto; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(28px, 4vw, 64px); align-items: center; padding: clamp(28px, 4.4vw, 56px); border-radius: 28px; background: linear-gradient(135deg, #0a1b34 0%, #0d2846 100%); color: var(--dk-ink); box-shadow: var(--shadow-2); isolation: isolate; }
.kb-help__in::before { content: ""; position: absolute; z-index: -1; width: 520px; height: 520px; right: -140px; top: -260px; border-radius: 50%; background: radial-gradient(closest-side, rgba(38, 188, 215, .26), transparent); }
.kb-help .eyebrow { color: var(--sky); }
.kb-help__h { font-size: clamp(24px, 2.6vw, 34px); line-height: 1.16; letter-spacing: -.026em; font-weight: 700; color: #fff; text-wrap: balance; }
.kb-help__p { margin-top: 12px; max-width: 50ch; font-size: 15.5px; line-height: 1.55; color: var(--dk-2); }
.kb-help__ways { display: grid; gap: 10px; }
.kb-way { display: flex; align-items: center; gap: 14px; padding: 14px 18px; border-radius: 16px; background: rgba(255, 255, 255, .06); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .1); color: #fff; transition: background .2s, transform .25s var(--ease-out); }
.kb-way:hover { position: relative; background: rgba(255, 255, 255, .11); text-decoration: none; transform: translateX(3px); }
.kb-way:hover::after { content: ""; position: absolute; top: 0; bottom: 0; right: 100%; width: 5px; } /* hover stays put (styles.css, .btn): it slides right, so the strip is on its left */
.kb-way .ico { width: 20px; height: 20px; color: var(--sky); }
.kb-way b { display: block; font-size: 16px; font-weight: 650; }
.kb-way small { display: block; font-size: 13px; color: var(--dk-2); }
.kb-help--compact .kb-help__h { font-size: clamp(22px, 2.2vw, 28px); }

/* ---------- search results (KB home ?q=) ---------- */
.kb-results { padding: clamp(36px, 5vw, 56px) 0 8px; }
.kb-results__head { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; margin-bottom: 16px; }
.kb-results__clear { font-size: 14px; font-weight: 600; color: var(--blue-t); }
.kb-results__clear:hover { text-decoration: underline; text-underline-offset: 3px; }

/* ---------- video library ---------- */
.kb-vids { padding: clamp(28px, 4vw, 48px) 0 clamp(64px, 8vw, 100px); }
.kb-vids__head { max-width: 940px; margin-bottom: 18px; }
.kb-vids__head .eyebrow { margin-bottom: 8px; }
.kb-vids__tools { margin-top: 26px; display: flex; flex-wrap: wrap; gap: 12px 14px; align-items: center; }
.kb-seg { display: flex; flex-wrap: wrap; gap: 6px; }
.kb-seg button { height: 36px; padding: 0 14px; border-radius: 999px; background: #fff; box-shadow: inset 0 0 0 1px var(--line-2); font-size: 13.5px; font-weight: 600; color: var(--ink-2); transition: background .2s, color .2s, box-shadow .2s; }
.kb-seg button span { margin-left: 3px; font-weight: 500; color: var(--ink-3); }
.kb-seg button:hover { box-shadow: inset 0 0 0 1px var(--blue); }
.kb-seg button[aria-pressed="true"] { background: var(--ink); color: #fff; box-shadow: none; }
.kb-seg button[aria-pressed="true"] span { color: rgba(255, 255, 255, .7); }
.kb-vgroup { margin-top: 48px; }
.kb-vgroup.is-empty { display: none; }
.kb-vgroup__h { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 20px; padding-bottom: 14px; border-bottom: 1px solid var(--line); font-size: 22px; font-weight: 750; letter-spacing: -.022em; }
.kb-vgroup__h .kb-ico { --s: 30px; }
.kb-vgroup__h > span:last-child { font-size: 14px; font-weight: 500; letter-spacing: 0; color: var(--ink-3); }
.kb-vgrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(264px, 1fr)); gap: 30px 22px; }
.kb-vcard .kb-video { margin: 0; }
.kb-video--card .kb-video__play { border-radius: 14px; box-shadow: 0 0 0 1px rgba(11, 26, 46, .08), 0 18px 36px -26px rgba(11, 26, 46, .6); }
.kb-video--card .kb-video__frame { border-radius: 14px; }
.kb-video--card .kb-video__btn { width: 54px; height: 54px; margin: -27px 0 0 -27px; }
.kb-video--card .kb-video__btn .ico { width: 17px; height: 17px; margin-left: 3px; }
.kb-video--card .kb-video__dur { right: 10px; bottom: 10px; font-size: 12px; }
.kb-video--card figcaption { display: block; margin-top: 12px; }
.kb-video--card .kb-video__t { display: block; font-size: 15.5px; font-weight: 650; line-height: 1.35; color: var(--ink); text-wrap: pretty; }
.kb-video--card .kb-video__m { display: none; }
.kb-vcard__m { display: flex; flex-wrap: wrap; gap: 4px 10px; margin-top: 5px; font-size: 12.5px; color: var(--ink-3); font-variant-numeric: tabular-nums; }
.kb-vcard__m span + span::before { content: "·"; margin-right: 10px; }
.kb-vcard__in { margin-top: 6px; font-size: 13.5px; line-height: 1.45; color: var(--ink-3); }

/* ---------- PostureRay customer access (WEB-41; kb-access.js) ---------- */
.kb-gate { margin-bottom: 32px; padding: 22px 24px 24px; border-radius: 18px; background: #fff; box-shadow: inset 0 0 0 1px var(--line-2), var(--shadow-1); }
.kb-gate__h { display: flex; align-items: center; gap: 9px; font-size: 13px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--blue-t); }
.kb-gate__h .ico { width: 17px; height: 17px; }
.kb-gate__p { margin-top: 8px; font-size: 17.5px; line-height: 1.55; color: var(--ink); text-wrap: pretty; }
.kb-gate__p a { color: var(--blue-t); font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
.kb-gate__btns, .kba__btns { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 14px; margin-top: 18px; }
.kb-gate__alt, .kba__line { background: #fff; color: var(--ink); box-shadow: inset 0 0 0 1.5px var(--line-2); }
.kb-gate__alt:hover, .kba__line:hover { box-shadow: inset 0 0 0 1.5px var(--ink-3); }
.kb-gated:empty { display: none; }
.kb-gated .kb-toc-m { display: block; }
.kb-who { background: var(--bg-3); border-bottom: 1px solid var(--line); font-size: 13.5px; color: var(--ink-2); }
.kb-who__in { width: min(var(--maxw), 100% - 2 * var(--gutter)); margin-inline: auto; display: flex; flex-wrap: wrap; justify-content: flex-end; align-items: center; gap: 4px 10px; min-height: 36px; padding: 6px 0; }
.kb-who__in b { font-weight: 650; color: var(--ink); overflow-wrap: anywhere; }
.kb-who__out, .kba__link { font: inherit; font-weight: 600; color: var(--blue-t); background: none; border: 0; padding: 0; cursor: pointer; text-decoration: underline; text-underline-offset: 3px; }
.kb-who__out[disabled] { opacity: .6; cursor: progress; }
.kb-who__msg { flex: 1 1 100%; text-align: right; text-wrap: balance; font-weight: 600; color: var(--ink); }
.kb-video--mux { padding: 16px 20px; border-radius: 14px; background: var(--bg-2); box-shadow: inset 0 0 0 1px var(--line); }
.kb-video__soon { display: flex; gap: 10px; align-items: center; font-size: 15px; color: var(--ink-3); }
.kb-video__soon .ico { width: 18px; height: 18px; opacity: .7; }
/* sign-in and request-access pages */
.kba { padding-block: clamp(22px, 3vw, 36px) clamp(48px, 6vw, 84px); }
.kba__card { max-width: 560px; padding: clamp(22px, 3vw, 36px); border-radius: 24px; background: var(--bg-2); box-shadow: inset 0 0 0 1px var(--line), var(--shadow-1); }
.kba__card--wide { max-width: 760px; }
.kba__h { margin-top: 6px; font-size: clamp(28px, 3.4vw, 40px); line-height: 1.1; letter-spacing: -.03em; font-weight: 800; text-wrap: balance; }
.kba__lede { margin-top: 12px; font-size: 16.5px; line-height: 1.55; color: var(--ink-2); text-wrap: pretty; }
.kba__lede b, .kba__sent b { color: var(--ink); overflow-wrap: anywhere; }
.kba__form { margin-top: 22px; }
.kba__row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 16px; align-items: start; }
.kba__f { display: grid; align-content: start; gap: 6px; margin: 0 0 16px; border: 0; padding: 0; min-width: 0; }
.kba__f label, .kba__checks legend { font-size: 14px; font-weight: 600; color: var(--ink); }
.kba__opt { font-weight: 400; color: var(--ink-3); }
.kba__f input, .kba__f select, .kba__f textarea { width: 100%; min-height: 46px; padding: 11px 14px; border-radius: 12px; border: 1px solid rgba(11, 26, 46, .18); background: #fff; font: inherit; font-size: 16px; color: var(--ink); transition: border-color .2s, box-shadow .2s; }
.kba__f textarea { min-height: 110px; resize: vertical; line-height: 1.5; }
.kba__f select { appearance: none; -webkit-appearance: none; padding-right: 40px; background-image: linear-gradient(45deg, transparent 50%, var(--ink-3) 50%), linear-gradient(135deg, var(--ink-3) 50%, transparent 50%); background-position: calc(100% - 20px) 50%, calc(100% - 15px) 50%; background-size: 5px 5px; background-repeat: no-repeat; }
.kba__f input:focus, .kba__f select:focus, .kba__f textarea:focus { outline: none; border-color: var(--blue); box-shadow: 0 0 0 3px rgba(38, 188, 215, .35); }
.kba__f [aria-invalid="true"] { border-color: #c0392b; }
.kba__code { max-width: 220px; font-size: 22px !important; letter-spacing: .3em; font-variant-numeric: tabular-nums; }
.kba__checks { display: flex; flex-wrap: wrap; gap: 8px 22px; }
.kba__checks legend { margin-bottom: 8px; }
.kba__checks label { display: inline-flex; align-items: center; gap: 8px; font-size: 15.5px; font-weight: 500; }
.kba__checks input { width: 18px; height: 18px; min-height: 0; accent-color: var(--blue); }
.kba__checks .kba__err { flex-basis: 100%; }
.kba__hint { font-size: 13px; line-height: 1.45; color: var(--ink-3); }
.kba__hint a, .kba__fine a, .kba__more a, .kba__status a { color: var(--blue-t); text-decoration: underline; text-underline-offset: 2px; }
.kba__err { font-size: 13px; font-weight: 600; color: #b42318; }
.kba__hp { position: absolute !important; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.kba__btns .btn { background: var(--cta-fill); color: #fff; box-shadow: var(--cta-sh); }
.kba__btns .btn:hover { box-shadow: var(--cta-sh-hover); }
.kba__btns .kba__line { background: #fff; color: var(--ink); box-shadow: inset 0 0 0 1.5px var(--line-2); }
.kba__btns .btn[disabled] { opacity: .6; cursor: progress; }
.kba__sent { margin-bottom: 14px; font-size: 15.5px; line-height: 1.5; color: var(--ink-2); }
.kba__fine { flex: 1 1 240px; font-size: 13px; color: var(--ink-3); }
.kba__more { margin-top: 22px; font-size: 14.5px; line-height: 1.55; color: var(--ink-3); }
.kba__status { margin-top: 16px; padding: 14px 16px; border-radius: 14px; font-size: 15px; line-height: 1.5; }
.kba__status[data-state="ok"] { background: #ecfdf3; color: #05603a; box-shadow: inset 0 0 0 1px #abefc6; }
.kba__status[data-state="err"] { background: #fef3f2; color: #912018; box-shadow: inset 0 0 0 1px #fecdca; }
.kba__status a { color: inherit; font-weight: 700; }
.kba__form.is-sent > :not(.kba__status) { display: none; }
@media (max-width: 640px) {
  .kb-gate { padding: 18px 18px 20px; }
  .kb-gate__p { font-size: 16.5px; }
  .kba__row { grid-template-columns: minmax(0, 1fr); }
  .kb-who__in { justify-content: flex-start; }
  .kb-who__msg { text-align: left; }
}

/* ---------- PostureScreen® version history (tools/version-history.mjs; body.kb--vh) ---------- */
.kb-prose .vh-entry { scroll-margin-top: calc(var(--hdr) + 24px); }
.kb-prose .vh-entry + .vh-entry { margin-top: 1.9em; padding-top: 1.7em; border-top: 1px solid var(--line); }
.kb-prose .vh-entry > * + * { margin-top: .9em; }
.kb-prose .vh-entry h2 { margin-top: 0; font-variant-numeric: tabular-nums; scroll-margin-top: calc(var(--hdr) + 24px); }
.kb-prose .vh-entry > .vh-date { margin-top: .25em; display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; font-size: 15px; font-weight: 600; color: var(--ink-3); }
.kb-prose .vh-none { font-size: 16px; font-style: italic; color: var(--ink-3); }
.vh-badge { display: inline-flex; padding: 2px 9px; border-radius: 999px; background: rgba(0, 128, 178, .1); font-size: 12px; font-weight: 700; letter-spacing: .02em; color: var(--blue-t); }
/* "On this page": every version as a chip, grouped by major version */
.kb-toc--vh > ol { border-left: 0; gap: 14px; }
.kb-toc--vh .vh-g__h { margin-bottom: 6px; font-size: 12.5px; font-weight: 700; color: var(--ink-2); }
.kb-toc--vh .vh-g__l { display: flex; flex-wrap: wrap; gap: 4px; border-left: 0; }
.kb-toc--vh .vh-g__l a { margin: 0; padding: 3px 9px; border: 0; border-radius: 999px; background: var(--bg-2); font-size: 13px; line-height: 1.4; font-variant-numeric: tabular-nums; color: var(--ink-2); }
.kb-toc--vh .vh-g__l a:hover { background: var(--bg-3); color: var(--ink); }
.kb-toc--vh .vh-g__l a.is-active { background: rgba(0, 128, 178, .12); color: var(--blue-t); }
.kb-toc-m .kb-toc--vh .vh-g__l a { background: #fff; }
/* the raised ® in body-size text (styles.css .reg is sized for display headings) */
.kb--vh .kb-art .reg, .kb--vh .kb-related .reg { font-size: .62em; vertical-align: .68em; }
.kb--vh .kb-art .reg--p, .kb--vh .kb-related .reg--p { margin-right: -.2em; }
.kb--vh .kb-art__title .reg { font-size: .42em; vertical-align: .95em; }
.kb--vh .kb-pill { display: inline-block; } /* inline-flex would make the <sup> a flex item: not raised, and the text wraps in columns */

/* ---------- responsive ---------- */
@media (max-width: 1100px) {
  .kb-art__grid { grid-template-columns: minmax(0, 1fr); }
  .kb-art__rail { display: none; }
  .kb-toc-m { display: block; }
  .kb-art__main { max-width: 760px; }
}
@media (max-width: 1000px) {
  .kb-fams, .kb-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .kb-arch { grid-template-columns: minmax(0, 1fr); }
  .kb-arch__side { display: none; }
}
@media (max-width: 900px) {
  .kb-bar__nav { display: none; }
  .kb-help__in { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 640px) {
  .kb-bar__in { flex-wrap: wrap; gap: 8px 16px; padding: 10px 0 12px; min-height: 0; }
  .kb-bar .kb-search { width: 100%; margin-left: 0; }
  .kb-bar .kb-search__pop { width: auto; left: 0; right: 0; }
  .kb-fams, .kb-cards { grid-template-columns: minmax(0, 1fr); }
  .kb-search--big input { height: 58px; padding: 0 64px 0 50px; font-size: 16px; }
  .kb-search--big .kb-search__ico { left: 19px; width: 19px; height: 19px; }
  .kb-search--big .kb-search__kbd { display: none; }
  .kb-search--big .kb-search__go { width: 44px; height: 44px; padding: 0; right: 7px; justify-content: center; }
  .kb-search--big .kb-search__go span { display: none; }
  .kb-search--big .kb-search__go .ico { display: block; width: 17px; height: 17px; }
  .kb-hero__stats { gap: 8px 26px; }
  .kb-hero__stats b { font-size: 22px; }
  .kb-prose { font-size: 17px; line-height: 1.68; }
  .kb-prose h2 { font-size: 23px; }
  .kb-prose h3 { font-size: 19px; }
  .kb-summary__p { font-size: 17px; }
  .kb-video__btn { width: 62px; height: 62px; margin: -31px 0 0 -31px; }
  .kb-video__play, .kb-video__frame { border-radius: 14px; }
  .kb-helpful { grid-template-columns: minmax(0, 1fr); }
  .kb-helpful__more { justify-self: start; text-align: left; }
  .kb-pn { grid-template-columns: minmax(0, 1fr); }
  .kb-filter, .kb-filter input { width: 100%; }
  .kb-listbar__tools { width: 100%; }
  .kb-row__go { display: none; }
  .kb-row > a { grid-template-columns: minmax(0, 1fr); }
  .kb-strip { grid-auto-columns: minmax(240px, 78vw); }
}
@media (prefers-reduced-motion: reduce) {
  .kb-fam, .kb-card > a, .kb-sub, .kb-video__btn, .kb-video__play img, .kb-way, .kb-pn__a { transition: none; }
  .kb-fam:hover, .kb-card > a:hover, .kb-sub:hover, .kb-way:hover { transform: none; }
  .kb-search__pop { animation: none; }
}
@media print {
  .hdr, .kb-bar, .kb-art__rail, .kb-toc-m, .kb-helpful, .kb-pn, .kb-related, .kb-help, .foot, .totop { display: none !important; }
  .kb-art__grid { display: block; }
  .kb-video__play::after, .kb-video__btn { display: none; }
}

/* Mux player (WEB-49, video.js) */
.kb-video__frame mux-player { position: absolute; inset: 0; width: 100%; height: 100%; --media-object-fit: contain; }
.kb-video .pc-vid-note { margin-top: 10px; }
.pc-vid-note p { margin: 0; padding: 12px 16px; border-radius: 12px; background: var(--bg-2); box-shadow: inset 0 0 0 1px var(--line); font-size: 15px; line-height: 1.5; color: var(--ink-2); }
.pc-vid-note a { font-weight: 600; margin-left: .35em; }