/* Theme-owned additions with no mockup equivalent. Everything else is a port of the frozen mockup CSS. */

/* Skip link: hidden until focused (WCAG 2.4.1). */
.v-skip { position: absolute; left: 12px; top: -100px; z-index: 1000; padding: 12px 16px; border-radius: 8px; background: var(--v-bg-2, #0f1b26); color: var(--v-fg, #fff); border: 1px solid var(--v-line-3, #62e2ef); font: 600 15px/1.2 var(--font-sans); text-decoration: none; }
.v-skip:focus { top: 12px; outline: 2px solid var(--v-cyan, #62e2ef); outline-offset: 2px; }
main:focus { outline: none; }

/* Sticky header must not hide focused content (WCAG 2.4.11). */
html { scroll-padding-top: 88px; }

/* Wide tables in prose (cookie list) scroll sideways inside their box, never the page. */
.v-table-scroll { overflow-x: auto; max-width: 100%; }
.v-table-scroll:focus-visible { outline: 2px solid var(--v-cyan, #62e2ef); outline-offset: 2px; }
.v-prose table.obsite-cookies { min-width: 640px; }

/* Video pause buttons stay hidden until the script starts the video (no-JS: nothing to pause). */
.dd-vid__btn[hidden] { display: none; }

/* Header account link (Sign in / Account): in the bar at every width. Below 360px only the icon shows; the
   label stays available to screen readers. */
.v-head__acct { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 12px; border-radius: 8px; color: var(--v-fg-2); text-decoration: none; font-size: 14px; white-space: nowrap; }
.v-head__acct:hover, .v-head__acct[aria-current="page"] { color: var(--v-fg); background: var(--v-wash-1); }
.v-head__acct:focus-visible { outline: 2px solid var(--v-cyan-2); outline-offset: 2px; }
.v-head__acct-ico { flex: none; fill: none; stroke: currentColor; stroke-width: 1.4; stroke-linecap: round; }
@media (max-width: 899px) { .v-head__acct { margin-left: auto; } .v-head__cta { margin-left: 0; } }
@media (max-width: 420px) { .v-menu { margin-left: 0; } }
@media (max-width: 359px) { .v-head__acct { padding: 0 10px; } .v-head__acct-txt { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; } }
/* Prose pages without an "On this page" list (and plugin pages with their own h1) use one column. */
.v-doc--solo { grid-template-columns: minmax(0, 1fr); }
/* The prose hero lines up with the breadcrumb and text, not a centred 760px box. */
.lg-hero > .dd-head { max-width: var(--v-max); }
.dir-d .lg-doc--own { padding-top: clamp(8px, 2vw, 24px); }
/* Plugin markup nested inside prose keeps its paragraph spacing. */
.v-prose :where(div, section, article) > :is(p, ul, ol, h2, h3, h4) + :is(p, ul, ol, h2, h3, h4) { margin-top: 1em; }
/* 900–1099px: everything stays on one line (the header gained "Sign in"); tighter link padding, icon-only sign-in. */
.v-nav a, .v-head__cta, .v-head__acct { white-space: nowrap; }
@media (min-width: 900px) and (max-width: 1099px) {
  .v-head .v-wrap { gap: 12px; }
  .v-nav { gap: 0; }
  .v-nav a { padding: 0 8px; }
  .v-head__acct { padding: 0 10px; }
  .v-head__acct-txt { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
}
/* Analysis Engine marketing blocks use the full content width. */
.v-prose:has([class*="oae-"]) { max-width: none; }
/* Plugin blocks start on the same left edge as the breadcrumb and header. */
.v-prose > [class*="oae-"] { margin-inline-start: 0; }
/* Lists in a plugin's own contents box are navigation, not bullet lists. */
.v-prose nav :is(ul, ol) { padding-left: 0; list-style: none; }
/* Findings illustration: chips share one width so the titles line up ("Needs attention" is the longest label). */
.ae-finds .ae-chip { min-width: 9.6em; }
