/* GENERATED by limn.demo.site.ThemeTokens. Do not edit.
 * Source of truth: limn.components.Theme.limn() and Theme.limnLight().
 * Regenerate with: ./gradlew :limn-demo:exportThemeTokens
 */
:root {
  --limn-color-scheme: light;
  --limn-background: #FFFFFF;
  --limn-surface: #F1ECFD;
  --limn-surface-raised: #E2D8FA;
  --limn-primary: #6D00E0;
  --limn-primary-hover: #7F16F5;
  --limn-primary-pressed: #5600B0;
  --limn-on-primary: #FFFFFF;
  --limn-text: #170A2E;
  --limn-text-muted: #4F3A78;
  --limn-outline: #AC97D9;
  --limn-focus-ring: #26005C;
  --limn-disabled-fill: #F0ECF8;
  --limn-disabled-text: #9A8FB0;
  --limn-danger: #AB0019;
  --limn-success: #0F6530;
  --limn-warning: #875000;
  --limn-info: #135CB0;
  --limn-radius-small: 4px;
  --limn-radius-medium: 8px;
  --limn-radius-large: 14px;
  --limn-space-small: 6px;
  --limn-space-medium: 12px;
  --limn-space-large: 20px;
}

@media (prefers-color-scheme: dark) {
  :root {
    --limn-color-scheme: dark;
    --limn-background: #120D19;
    --limn-surface: #362C45;
    --limn-surface-raised: #483D59;
    --limn-primary: #AF7AFF;
    --limn-primary-hover: #C8A3FF;
    --limn-primary-pressed: #9752FF;
    --limn-on-primary: #0C0616;
    --limn-text: #F5F1FB;
    --limn-text-muted: #B8ADC8;
    --limn-outline: #695783;
    --limn-focus-ring: #E0CCFF;
    --limn-disabled-fill: #2D2539;
    --limn-disabled-text: #78747F;
    --limn-danger: #F990A3;
    --limn-success: #9ECE6A;
    --limn-warning: #E0AF68;
    --limn-info: #8BAEF8;
  }
}

:root[data-theme="light"] {
  --limn-color-scheme: light;
  --limn-background: #FFFFFF;
  --limn-surface: #F1ECFD;
  --limn-surface-raised: #E2D8FA;
  --limn-primary: #6D00E0;
  --limn-primary-hover: #7F16F5;
  --limn-primary-pressed: #5600B0;
  --limn-on-primary: #FFFFFF;
  --limn-text: #170A2E;
  --limn-text-muted: #4F3A78;
  --limn-outline: #AC97D9;
  --limn-focus-ring: #26005C;
  --limn-disabled-fill: #F0ECF8;
  --limn-disabled-text: #9A8FB0;
  --limn-danger: #AB0019;
  --limn-success: #0F6530;
  --limn-warning: #875000;
  --limn-info: #135CB0;
}

:root[data-theme="dark"] {
  --limn-color-scheme: dark;
  --limn-background: #120D19;
  --limn-surface: #362C45;
  --limn-surface-raised: #483D59;
  --limn-primary: #AF7AFF;
  --limn-primary-hover: #C8A3FF;
  --limn-primary-pressed: #9752FF;
  --limn-on-primary: #0C0616;
  --limn-text: #F5F1FB;
  --limn-text-muted: #B8ADC8;
  --limn-outline: #695783;
  --limn-focus-ring: #E0CCFF;
  --limn-disabled-fill: #2D2539;
  --limn-disabled-text: #78747F;
  --limn-danger: #F990A3;
  --limn-success: #9ECE6A;
  --limn-warning: #E0AF68;
  --limn-info: #8BAEF8;
}

/* ==========================================================================
   The top bar: one stylesheet, three renderers.

   The site's pages render it from `SiteHeader.astro`, the guide from the
   Starlight header override, and the API reference from static HTML that
   `scripts/build-api.mjs` writes into every Javadoc page. They are three
   renderers because the three surfaces are built by three different things;
   they are ONE look because this file is the only place the look is written.
   A bar that measured 56px here and 64px there is exactly what a reader
   notices when clicking from /docs/ to /api/.

   Loaded by `app.css`, by `starlight.css`, and by the concatenation
   `build-api.mjs` writes next to the Javadoc. Add a fourth surface and it
   must load this too.

   The mobile rule: below 50rem the navigation collapses behind ONE control
   on the trailing edge. On the site and in the API reference that control is
   the `<details>` disclosure below, which needs no script. In the guide it is
   Starlight's own sidebar button, which was already there; a second
   hamburger beside it would be the inconsistency, not the fix.
   ========================================================================== */

:root {
  /* One height for all three. Starlight's own variable is pinned to it in
     starlight.css; its default grows at 50rem and would break the match. */
  --limn-bar-height: 3.5rem;
  --limn-bar-gap: clamp(0.75rem, 2vw, 1.75rem);
}

/* The bar brings its own box model. The site's stylesheet sets `border-box` globally and
   Javadoc's does not, which is the whole reason the same rules measured 57px on one surface
   and 73px on the other. Nothing about this bar may depend on the page around it. */
.limn-bar,
.limn-bar *,
.limn-bar *::before,
.limn-bar *::after {
  box-sizing: border-box;
}

.limn-bar {
  border-block-end: 1px solid color-mix(in srgb, var(--limn-outline) 26%, transparent);
  background-color: var(--limn-background);
}

/* The site's pages only: the guide and the API reference sit in frames that
   position their own bar. */
/*
 * A sticky bar with a backdrop-filter is the one thing on these pages that costs work on every
 * scrolled frame: the compositor re-reads and re-filters the full-width strip behind it, and on
 * the home page what is behind it is two large radial gradients and a noise layer.
 *
 * So the filter is kept as small as it can be while still reading as frosted glass:
 *
 *  - one function, not two. `saturate()` was a second pass over the same pixels for an effect
 *    that is nearly invisible at this opacity;
 *  - a smaller radius. Cost grows with it, and the background below carries more of the
 *    separation now, which is why that value moved with it.
 *
 * If scrolling still stutters on a weak GPU, the next step is not a smaller radius. It is
 * dropping the filter and making the bar opaque while the page is scrolled, which costs nothing
 * per frame. That is a visible change, so it is a decision rather than a tweak.
 */
.limn-bar--sticky {
  position: sticky;
  inset-block-start: 0;
  z-index: 10;
  background-color: color-mix(in srgb, var(--limn-background) 90%, transparent);
  backdrop-filter: blur(6px);
}

.limn-bar__inner {
  display: flex;
  gap: var(--limn-bar-gap);
  align-items: center;
  min-block-size: var(--limn-bar-height);
}

/* Full-bleed variant, for the frames that supply their own page gutter. */
.limn-bar__inner--flush {
  padding-inline: clamp(0.75rem, 3vw, 1.5rem);
}

.limn-bar__brand {
  display: inline-flex;
  align-items: center;
  flex: none;
  text-decoration: none;
}

.limn-bar__nav ul {
  display: flex;
  gap: clamp(0.7rem, 1.6vw, 1.4rem);
  margin: 0;
  padding: 0;
  list-style: none;
}

/* A primary touch control: bare 14px text is a ~18px hit box, under the 24px
   minimum, and a mis-tap between two links is the likely failure. */
.limn-bar__nav a {
  display: inline-block;
  padding-block: 0.5rem;
  color: var(--limn-text-muted);
  font-size: 0.875rem;
  font-weight: 520;
  text-decoration: none;
  white-space: nowrap;
}

.limn-bar__nav a:hover,
.limn-bar__nav a[aria-current="page"] {
  color: var(--limn-text);
}

.limn-bar__nav a[aria-current="page"] {
  box-shadow: inset 0 -2px 0 var(--limn-primary);
}

.limn-bar__tools {
  display: flex;
  gap: 0.9rem;
  align-items: center;
}

.limn-bar__repo {
  display: inline-flex;
  gap: 0.4rem;
  align-items: center;
  padding-block: 0.5rem;
  color: var(--limn-text-muted);
  font-size: 0.875rem;
  font-weight: 520;
  text-decoration: none;
}

.limn-bar__repo:hover {
  color: var(--limn-text);
}

/* ------------------------------------------------------------- the lockup */

.limn-bar__logo {
  display: block;
  block-size: 26px;
  inline-size: auto;
}

/* The base state matches the tokens' no-JS default, which is light: the same
   swap the site's Logo component uses, so a reader never sees dark ink on a
   dark bar for a frame. */
.limn-bar__logo--dark {
  display: none;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .limn-bar__logo--dark {
    display: block;
  }
  :root:not([data-theme="light"]) .limn-bar__logo--light {
    display: none;
  }
}
:root[data-theme="dark"] .limn-bar__logo--dark {
  display: block;
}
:root[data-theme="dark"] .limn-bar__logo--light {
  display: none;
}

/* ---------------------------------------------------- the theme control

   Here and not in `ThemeToggle.astro`, for the same reason as the rest of this
   file: Astro scopes a component's styles with a hash, and the API reference's
   copy of this control is static markup no component ever rendered. One control,
   one appearance, three surfaces. */

.theme-toggle {
  display: inline-flex;
  gap: 2px;
  margin: 0;
  padding: 2px;
  border: 1px solid var(--limn-outline);
  border-radius: var(--limn-radius-medium);
  background-color: var(--limn-surface);
}

.theme-toggle__legend {
  position: absolute;
  inline-size: 1px;
  block-size: 1px;
  padding: 0;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}

.theme-toggle__option {
  display: inline-flex;
}

/* The input carries focus and state; the span is what is painted. Hiding the
   input with `display:none` would take it out of the tab order and out of the
   accessibility tree, which is why it is clipped instead. */
.theme-toggle__option input {
  position: absolute;
  inline-size: 1px;
  block-size: 1px;
  opacity: 0;
}

.theme-toggle__option span {
  display: inline-block;
  padding-block: 4px;
  padding-inline: 10px;
  border-radius: calc(var(--limn-radius-medium) - 2px);
  color: var(--limn-text-muted);
  font-size: 0.8125rem;
  line-height: 1.2;
  cursor: pointer;
  transition: color 120ms ease-out, background-color 120ms ease-out;
}

/* A contrast change, not a glow: this still reads in greyscale. The weight is the
   cue that survives forced-colors mode, where author backgrounds are stripped and
   the visually-hidden native radio cannot show its check. */
.theme-toggle__option input:checked + span {
  background-color: var(--limn-primary);
  color: var(--limn-on-primary);
  font-weight: 600;
}

@media (forced-colors: active) {
  .theme-toggle__option input:checked + span {
    outline: 2px solid ButtonText;
    outline-offset: -2px;
  }
}

.theme-toggle__option input:focus-visible + span {
  outline: 2px solid var(--limn-focus-ring);
  outline-offset: 2px;
}

/* --------------------------------------------------------- the menu itself

   A row in the bar on a desktop, a dropdown behind one button on a phone,
   with the same elements either way, never a second copy of the navigation.

   The collapse is opt-in through `data-collapsible`, which a script sets, and
   that is deliberate: with no script the panel simply WRAPS onto a second row
   below the breakpoint, so a reader without JavaScript still has the whole
   navigation. The button is `hidden` in the markup for the same reason: a
   control that would open nothing must not be on screen.

   Not a `<details>`: current Chrome hides unopened content through the
   `::details-content` pseudo-element, which an author `display` on the child no
   longer overrides, so "inline above the breakpoint, disclosure below it" is
   not something the element can express any more. */

.limn-bar__menu {
  display: flex;
  flex: 1 1 auto;
  gap: var(--limn-bar-gap);
  align-items: center;
  justify-content: space-between;
  min-inline-size: 0;
}

.limn-bar__panel {
  display: flex;
  flex: 1 1 auto;
  gap: var(--limn-bar-gap);
  align-items: center;
  justify-content: space-between;
  min-inline-size: 0;
}

.limn-bar__toggle {
  padding: 0.45rem;
  border: 1px solid var(--limn-outline);
  border-radius: 9px;
  background-color: transparent;
  color: var(--limn-text-muted);
  cursor: pointer;
}

.limn-bar__toggle:hover {
  color: var(--limn-text);
}

.limn-bar__toggle svg {
  display: block;
}

@media (max-width: 50rem) {
  /* No script: the bar grows a second row rather than losing its links. */
  .limn-bar__inner {
    flex-wrap: wrap;
    padding-block: 0.5rem;
  }

  .limn-bar__menu[data-collapsible] {
    position: relative;
    flex: 0 0 auto;
    /* The control sits at the trailing edge, where the guide's sidebar button is. */
    margin-inline-start: auto;
    justify-content: flex-end;
  }

  .limn-bar__menu[data-collapsible]:not([data-open]) .limn-bar__panel {
    display: none;
  }

  .limn-bar__menu[data-collapsible] .limn-bar__panel {
    position: absolute;
    inset-block-start: calc(100% + 0.5rem);
    inset-inline-end: 0;
    z-index: 30;
    flex-direction: column;
    align-items: stretch;
    gap: 1rem;
    inline-size: max-content;
    min-inline-size: 13rem;
    max-inline-size: min(80vw, 20rem);
    padding: 0.9rem 1rem;
    border: 1px solid var(--limn-outline);
    border-radius: 12px;
    background-color: var(--limn-background);
    box-shadow: 0 14px 36px color-mix(in srgb, var(--limn-focus-ring) 22%, transparent);
  }

  .limn-bar__menu[data-collapsible] .limn-bar__nav ul {
    flex-direction: column;
    gap: 0.15rem;
  }

  .limn-bar__menu[data-collapsible] .limn-bar__tools {
    flex-wrap: wrap;
    gap: 0.75rem;
    padding-block-start: 0.75rem;
    border-block-start: 1px solid color-mix(in srgb, var(--limn-outline) 40%, transparent);
  }
}

/* Above the breakpoint the button never applies, script or no script. */
@media (min-width: 50.0625rem) {
  .limn-bar__toggle {
    display: none;
  }
}

/* For the frame that already owns a mobile control: the guide hides these rather
   than collapsing them, because Starlight's sidebar button opens a menu that
   carries them (see the MobileMenuFooter override). Declared after the block
   above so that it wins over `.limn-bar__panel` at equal specificity. */
@media (max-width: 50rem) {
  .limn-bar__hide-mobile {
    display: none;
  }
}

/* Added to Javadoc's own stylesheet rather than replacing it, and it overrides only the
   custom properties the JDK's stylesheet already declares in its `:root`. That is the
   whole file, on purpose:

   The first attempt overrode selectors instead (`.block`, `.top-nav`, `.summary-table`
   and the rest) and produced dark ink on light panels across half the page, because
   Javadoc sets backgrounds on containers those selectors do not reach. Every one of these
   variables is consumed by the JDK's own rules, so recolouring them recolours everything
   consistently and leaves the layout untouched. If a future JDK renames one, that panel
   falls back to its default colour: a slightly-odd page, never an unreadable one.

   The tokens are prepended by scripts/build-api.mjs from the generated palette file, so
   nothing here restates a tone the toolkit already defines. */

:root {
  --body-font-family: system-ui, -apple-system, "Segoe UI", sans-serif;
  --block-font-family: system-ui, -apple-system, "Segoe UI", sans-serif;
  --code-font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;
  --body-font-size: 15px;
  --code-font-size: 14px;

  --body-text-color: var(--limn-text);
  --block-text-color: var(--limn-text);
  --title-color: var(--limn-text);

  --body-background-color: var(--limn-background);
  --detail-background-color: var(--limn-background);
  --section-background-color: var(--limn-surface);

  --navbar-background-color: var(--limn-surface);
  --navbar-text-color: var(--limn-text);
  --subnav-background-color: var(--limn-surface);

  /* Javadoc's "selected" is an orange tab with dark ink. The accent already carries a
     solved label colour for exactly this pairing, so it is used rather than derived. */
  --selected-background-color: var(--limn-primary);
  --selected-text-color: var(--limn-on-primary);
  --selected-link-color: var(--limn-on-primary);

  --even-row-color: var(--limn-background);
  --odd-row-color: var(--limn-surface);

  --link-color: var(--limn-primary);
  --link-color-active: var(--limn-primary-hover);

  --snippet-background-color: var(--limn-surface);
  --snippet-text-color: var(--limn-text);
  --snippet-highlight-color: color-mix(in srgb, var(--limn-primary) 25%, var(--limn-background));

  --border-color: var(--limn-outline);
  --table-border-color: var(--limn-outline);

  --search-input-background-color: var(--limn-surface);
  --search-input-text-color: var(--limn-text);
  --search-input-placeholder-color: var(--limn-text-muted);
  /* Backgrounds behind UNCHANGED body text. The JDK's defaults here are highlighter
     tints expecting dark ink on top, so a saturated accent makes the searched-for phrase
     the one illegible thing on the page. Mixed tints follow both palettes. */
  --search-tag-highlight-color: color-mix(in srgb, var(--limn-primary) 25%, var(--limn-background));

  --invalid-tag-background-color: var(--limn-danger);
  --invalid-tag-text-color: var(--limn-background);
}

/* The copy-to-clipboard glyphs are dark PNGs; on a dark canvas they need inverting, and
   the JDK exposes exactly this knob for the purpose. */
:root[data-theme="dark"] {
  --copy-icon-brightness: 700%;
}

/* The real color-scheme property, not just the exported custom prop: without it a dark
   /api/ page keeps light UA chrome: scrollbars on every wide signature, the overscroll
   canvas, form-control internals. Mirrors app.css. */
:root {
  color-scheme: light;
}
@media (prefers-color-scheme: dark) {
  :root {
    color-scheme: dark;
  }
}
:root[data-theme="light"] {
  color-scheme: light;
}
:root[data-theme="dark"] {
  color-scheme: dark;
}

/* Glow is never the only signal for state: this is a real ring, and Javadoc ships
   no focus style of its own worth keeping. */
:where(a, button, summary, input, select, textarea, [tabindex]):focus-visible {
  outline: 2px solid var(--limn-focus-ring);
  outline-offset: 2px;
}

/* ------------------------------------------------------------------ controls

   The one place this file styles the JDK's own selectors rather than recolouring through
   its variables, and the boundary is drawn at the CONTROLS: the search box and its
   suggestion list, the copy buttons, the summary tabs. Panels, tables and prose stay on
   the variables above, because that is where overriding selectors went wrong before, and this
   section does not touch any of them.

   The reason for the exception is that a control is where a reader can tell they have
   left the site. Javadoc ships the JDK's 2011 defaults: a square text box with a bitmap
   magnifier baked into it, a `reset` input drawn as a 12px PNG cross, and flat rectangles
   for tabs. Beside `/docs/`, whose search is a rounded control with the same focus ring as
   every field on the site, they read as another product.

   Every glyph below is an inline SVG in a custom property rather than the JDK's PNGs: the
   PNGs are dark artwork with no inversion knob of their own, which is why the dark palette
   used to have to drop them and leave the field with no icon at all. */

:root {
  /* Both glyphs, per palette, because a background image cannot take `currentColor` and
     the JDK's markup gives these two inputs no element to hang a mask on. */
  --limn-glyph-search: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23615c73' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-3.8-3.8'/%3E%3C/svg%3E");
  --limn-glyph-clear: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23615c73' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M6 6l12 12M18 6 6 18'/%3E%3C/svg%3E");
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --limn-glyph-search: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23a8a2bb' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-3.8-3.8'/%3E%3C/svg%3E");
    --limn-glyph-clear: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23a8a2bb' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M6 6l12 12M18 6 6 18'/%3E%3C/svg%3E");
  }
}

:root[data-theme="dark"] {
  --limn-glyph-search: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23a8a2bb' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-3.8-3.8'/%3E%3C/svg%3E");
  --limn-glyph-clear: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23a8a2bb' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M6 6l12 12M18 6 6 18'/%3E%3C/svg%3E");
}

/* ------------------------------------------------------------- the search box */

#search-input,
#page-search-input {
  box-sizing: border-box;
  block-size: 34px;
  inline-size: 260px;
  max-inline-size: 100%;
  margin: 0;
  padding-block: 0;
  padding-inline: 2.1rem 2rem;
  border: 1px solid var(--limn-outline);
  border-radius: 9px;
  background-color: var(--limn-surface);
  background-image: var(--limn-glyph-search);
  background-repeat: no-repeat;
  background-size: 15px;
  background-position: 9px center;
  color: var(--limn-text);
  font-family: var(--body-font-family);
  font-size: 0.875rem;
  transition: border-color 120ms ease-out, background-color 120ms ease-out;
}

/* Javadoc's own rule adds a left margin to the navbar copy only; the field is placed by
   the flex row it sits in now. */
#search-input {
  margin-inline-start: 8px;
}

#search-input:hover,
#page-search-input:hover {
  border-color: var(--limn-primary);
}

#search-input:disabled,
#page-search-input:disabled {
  opacity: 0.6;
}

/* The JDK draws this as a bare 12x12 bitmap pinned to a fixed offset, under the 24px
   minimum for a touch target, and misaligned the moment the field's height changes. */
#reset-button {
  inset-inline-end: 6px;
  inset-block-start: 50%;
  translate: 0 -50%;
  inline-size: 24px;
  block-size: 24px;
  border-radius: 6px;
  background-image: var(--limn-glyph-clear);
  background-repeat: no-repeat;
  background-size: 13px;
  background-position: center;
  opacity: 0.7;
  cursor: pointer;
}

#reset-button:hover {
  background-color: var(--limn-surface-raised);
  opacity: 1;
}

/* The search page's own Reset, which is an `<input type="reset">` and therefore arrives
   with the operating system's button drawn on it: the one control on `/api/` that still
   looked like a dialog from 1995. It is a sibling of the field, not an overlay, so it gets
   the site's button rather than the navbar's icon treatment. */
#page-search-reset {
  min-block-size: 34px;
  margin-inline-start: 0.5rem;
  padding-inline: 0.9rem;
  border: 1px solid var(--limn-outline);
  border-radius: 9px;
  background: transparent;
  color: var(--limn-text);
  font-family: var(--body-font-family);
  font-size: 0.875rem;
  font-weight: 560;
  cursor: pointer;
  transition: background-color 120ms ease-out, border-color 120ms ease-out;
}

#page-search-reset:hover {
  border-color: var(--limn-primary);
  background: var(--limn-surface);
}

/* The disclosure beside it, so the two read as one row of controls. */
#page-search-expand {
  color: var(--limn-text-muted);
  font-size: 0.875rem;
  cursor: pointer;
}

#page-search-expand:hover {
  color: var(--limn-text);
}

/* The link to the full search page, which sits beside the field as shouting uppercase. */
.nav-list-search > a {
  color: var(--limn-text-muted);
  font-size: 0.75rem;
  font-weight: 560;
  letter-spacing: 0.06em;
  text-decoration: none;
}

.nav-list-search > a:hover {
  color: var(--limn-primary);
}

/* --------------------------------------------------------- the suggestion list

   jQuery UI's menu, given the same shape as every other dropdown on the site: the
   language picker's and the bar's mobile panel. */

ul.ui-autocomplete {
  padding: 0.35rem;
  border: 1px solid var(--limn-outline);
  border-radius: 12px;
  background-color: var(--limn-background);
  box-shadow: 0 14px 36px color-mix(in srgb, var(--limn-focus-ring) 22%, transparent);
}

ul.ui-autocomplete li {
  border-radius: 8px;
}

.ui-autocomplete .ui-menu-item-wrapper {
  display: block;
  padding: 0.4rem 0.6rem;
  border-radius: 8px;
}

/* The JDK's active row is the full accent with inverted ink. Class names are monospace and
   long; a tint of the accent keeps them at body contrast, and is what the guide's own
   search results sit on. */
.ui-autocomplete .ui-state-active,
.ui-autocomplete .ui-menu-item-wrapper.ui-state-active {
  margin: 0;
  border: 1px solid transparent;
  background: color-mix(in srgb, var(--limn-primary) 18%, var(--limn-background));
  color: var(--limn-text);
}

.ui-autocomplete-category {
  padding: 0.55rem 0.6rem 0.3rem;
  background-color: transparent;
  color: var(--limn-text-muted);
  font-size: 0.6875rem;
  font-weight: 560;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

ul.ui-autocomplete li.ui-static-link {
  border-radius: 0;
  border-block-start: 1px solid color-mix(in srgb, var(--limn-outline) 40%, transparent);
  background: var(--limn-background);
  font-family: var(--body-font-family);
  font-size: 0.8125rem;
  font-weight: 560;
}

.ui-autocomplete .result-highlight {
  color: var(--limn-primary);
  font-weight: 640;
}

/* ------------------------------------------------------------------- buttons

   The site's button, at the size each of these had. Shape, weight and hover come from one
   place so that a tab on `/api/` and a button on the marketing pages are the same object. */

div.table-tabs > button,
button.page-search-header,
.page-search-header {
  min-block-size: 32px;
  margin-inline-end: 6px;
  padding-block: 0;
  padding-inline: 0.85rem;
  border: 1px solid var(--limn-outline);
  border-radius: 9px;
  background: transparent;
  color: var(--limn-text-muted);
  font-size: 0.8125rem;
  font-weight: 560;
  transition: background-color 120ms ease-out, border-color 120ms ease-out;
}

div.table-tabs > button:hover,
button.page-search-header:hover {
  border-color: var(--limn-primary);
  background: var(--limn-surface);
  color: var(--limn-text);
}

div.table-tabs > .active-table-tab,
.page-search-header {
  border-color: transparent;
  background: var(--limn-primary);
  color: var(--limn-on-primary);
}

/* The current item in Javadoc's own navigation row, which the JDK paints as a hard-edged
   accent block. The same corner as every other selected thing on the site. */
.nav-bar-cell1-rev {
  border-radius: 7px;
}

/* The copy-to-clipboard buttons, which the JDK ships as a bare glyph at 70% opacity.
   A real surface is what makes them findable; the fade-in on hover stays. */
button.copy {
  border: 1px solid var(--limn-outline);
  border-radius: 8px;
  background-color: var(--limn-surface);
}

button.copy:hover {
  border-color: var(--limn-primary);
}

button.copy:active {
  background-color: var(--limn-surface-raised);
}

/* Search-page checkboxes: the accent, so the one saturated colour on the page is the
   toolkit's rather than the browser's. */
div.checkboxes > label > input {
  accent-color: var(--limn-primary);
}

/* The site's bar that `scripts/build-api.mjs` injects into every page is styled by
   `src/styles/bar.css`, which that script concatenates ahead of this file, so the guide and
   the marketing pages load the very same stylesheet. Nothing about the bar is written
   here, so it cannot drift from the other two.

   Except this: the bar is injected INSIDE `div.flex-box`, the fixed-height column that owns
   the page's scrolling, and a flex child defaults to shrinking. Without this the bar is
   squeezed as the content grows, and it is the only rule the other two surfaces must not
   have, because neither of them puts the bar in a flex column. */
.flex-box > .limn-bar {
  flex: 0 0 auto;
}

/* Contributor-facing signatures and tables run wide; they scroll inside their own box so
   the page body never scrolls horizontally. */
.summary-table,
.details-table,
.member-signature,
pre,
/* The JDK's search-results grid declares an 800px min-content floor that overflows the
   viewport in the band just above its own mobile breakpoint. */
.two-column-search-results {
  max-width: 100%;
  overflow-x: auto;
}