a3s-flow 1.1.0

html:root {
  --rp-c-brand: #1456f0;
  --rp-c-brand-dark: #0f46c7;
  --rp-c-brand-darker: #0d3aa4;
  --rp-c-brand-light: #3b73f4;
  --rp-c-brand-lighter: #dce8ff;
  --rp-c-brand-tint: rgb(20 86 240 / 10%);
  --rp-c-link: #0f46c7;
  --rp-c-bg: #f5f7fb;
  --rp-c-bg-soft: #ffffff;
  --rp-c-bg-mute: #eaf0f8;
  --rp-c-divider: #cbd4e0;
  --rp-c-divider-light: #dce3ec;
  --rp-c-text-1: #142033;
  --rp-c-text-2: #526078;
  --rp-c-text-3: #748095;
  --rp-nav-height: 64px;
  --rp-sidebar-width: 320px;
  --rp-sidebar-padding: 20px;
  --rp-outline-width: 268px;
  --rp-content-padding-x: 80px;
  --rp-content-padding-y: 48px;
  --rp-content-max-width: 920px;
  --rp-radius: 16px;
  --rp-radius-small: 8px;
  --rp-radius-large: 24px;
  --rp-font-family-base:
    'Geist Variable', 'Avenir Next', 'HarmonyOS Sans SC', 'PingFang SC',
    'Microsoft YaHei', ui-sans-serif, system-ui, sans-serif;
  --rp-font-family-mono: var(--flow-mono);
  --rp-code-title-bg: #eaf0f8;
  --rp-code-block-bg: #f5f7fb;
  --rp-c-text-code-bg: #eaf0f8;
  --rp-c-text-code-border: #dce3ec;
  --rp-c-text-code: #0f46c7;
  --flow-nav-width: 1440px;
  --flow-max-width: 1440px;
  --flow-bg: #f5f7fb;
  --flow-paper: #eaf0f8;
  --flow-surface: #ffffff;
  --flow-surface-soft: #edf3fb;
  --flow-surface-strong: #dce6f4;
  --flow-text: #142033;
  --flow-muted: #526078;
  --flow-faint: #748095;
  --flow-line: #dce3ec;
  --flow-line-strong: #cbd4e0;
  --flow-border-strong: #aab7c8;
  --flow-accent: #1456f0;
  --flow-accent-strong: #0f46c7;
  --flow-accent-soft: #e8efff;
  --flow-code: #0d1728;
  --flow-code-text: #edf4ff;
  --flow-success: #16845b;
  --flow-success-soft: #e7f5ef;
  --flow-wait: #5b57d9;
  --flow-wait-soft: #efefff;
  --flow-warning: #a55b09;
  --flow-warning-soft: #fff1da;
  --flow-radius: 14px;
  --flow-shell-radius: 18px;
  --flow-control-radius: 10px;
  --flow-shadow: 0 20px 32px -18px rgb(15 35 70 / 28%);
  --flow-font: var(--rp-font-family-base);
  --flow-mono:
    'Geist Mono Variable', 'SFMono-Regular', 'Cascadia Code', Menlo, Consolas,
    monospace;
  color-scheme: light;
}

@media (max-width: 1279px) {
  html:root {
    --rp-content-padding-x: 36px;
  }
}

@media (max-width: 768px) {
  html:root {
    --rp-sidebar-width: min(320px, 88vw);
    --rp-content-padding-x: 24px;
  }
}

html {
  overflow-x: clip;
  scroll-behavior: smooth;
}

body {
  min-width: 0;
  overflow-x: clip;
  background: var(--flow-bg);
  color: var(--flow-text);
  font-family: var(--flow-font);
  text-rendering: optimizeLegibility;
}

button,
input,
select,
textarea {
  font: inherit;
}

::selection {
  background: color-mix(in srgb, var(--flow-accent) 24%, transparent);
  color: var(--flow-text);
}

:where(a, button, input, select, textarea, [tabindex]):focus-visible {
  outline: 3px solid color-mix(in srgb, var(--flow-accent) 46%, transparent);
  outline-offset: 3px;
}

html .rp-nav {
  height: var(--rp-nav-height);
  padding-right: max(24px, calc((100vw - var(--flow-nav-width)) / 2 + 24px));
  padding-left: max(24px, calc((100vw - var(--flow-nav-width)) / 2 + 24px));
  border-bottom: 1px solid var(--flow-line);
  background: var(--flow-surface);
  transition: none;
}

.rp-nav__left,
.rp-nav__right {
  min-width: 0;
}

.rp-nav__left {
  align-items: center;
  gap: 32px;
}

.rp-nav__title__link {
  gap: 10px;
  letter-spacing: -0.025em;
}

html .rp-nav__title__logo,
html .rspress-logo {
  display: grid;
  overflow: hidden;
  width: 31px;
  min-width: 31px;
  max-width: 31px;
  height: 31px;
  min-height: 31px;
  max-height: 31px;
  aspect-ratio: 1;
  flex: 0 0 31px;
  margin-right: 0;
  border-radius: 9px;
  box-shadow: none;
  object-fit: contain;
  place-items: center;
}

html .rp-nav__title__logo img,
html img.rspress-logo {
  display: block;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  max-height: none !important;
  aspect-ratio: 1;
  object-fit: contain !important;
}

.rp-nav__title__link > span {
  color: var(--flow-text);
  font-size: 17px;
  font-weight: 740;
}

.rp-nav-menu__item {
  color: var(--flow-muted);
  font-size: 14px;
  font-weight: 560;
}

.rp-nav-menu__item:hover,
.rp-nav-menu__item--active {
  color: var(--flow-accent);
}

.rp-search-button {
  border-color: var(--flow-line) !important;
  border-radius: var(--flow-control-radius) !important;
  background: var(--flow-surface) !important;
}

.rp-nav-hamburger,
.rp-search-button--mobile {
  min-width: 44px;
  min-height: 44px;
  color: var(--flow-text);
}

html .rp-nav-screen {
  top: calc(var(--rp-nav-height) + var(--rp-banner-height, 0px));
  bottom: 0;
  width: 100%;
  height: calc(100dvh - var(--rp-nav-height) - var(--rp-banner-height, 0px));
  max-height: calc(
    100dvh - var(--rp-nav-height) - var(--rp-banner-height, 0px)
  );
  padding: 18px 16px 32px;
  overflow-y: auto;
  overscroll-behavior: contain;
  border-top: 1px solid var(--flow-line);
  background: var(--flow-bg);
  color: var(--flow-text);
}

.rp-nav-screen__container,
.rp-nav-screen-menu {
  width: 100%;
  align-items: stretch;
}

.rp-nav-screen-divider {
  background: var(--flow-line);
}

/* Rspress 2.0.x needs an explicit display rule for expanded locale rows. */
.rp-nav-screen-langs-group {
  display: none !important;
}

.rp-nav-screen-langs:has(.rp-nav-screen-langs__icon--open)
  + .rp-nav-screen-langs-group {
  display: block !important;
}

.rp-doc-layout {
  --rp-c-bg: var(--flow-bg);
  --rp-c-bg-soft: var(--flow-surface);
  --rp-c-bg-mute: var(--flow-paper);
  --rp-c-divider: var(--flow-line-strong);
  --rp-c-divider-light: var(--flow-line);
  --rp-c-text-1: var(--flow-text);
  --rp-c-text-2: var(--flow-muted);
  --rp-c-text-3: var(--flow-faint);
}

.rp-doc-layout__container,
.rp-doc-layout__doc-container,
.rp-doc-container {
  background: var(--flow-bg);
}

.rp-doc-layout,
.rp-doc-layout__container,
.rp-doc-layout__content,
.rp-doc-container,
.rp-doc {
  min-width: 0;
  max-width: 100%;
  color: var(--flow-text);
}

html .rp-doc-layout__doc {
  min-width: 0;
  overflow: visible;
}

.rp-doc.rspress-doc {
  font-size: 16px;
  line-height: 1.75;
}

.rp-doc :not(:where(.rp-not-doc, .rp-not-doc *)):where(h1, h2, h3, h4) {
  color: var(--flow-text);
  font-family: var(--flow-font);
  letter-spacing: -0.025em;
}

.rp-doc :not(:where(.rp-not-doc, .rp-not-doc *)):where(h1) {
  margin-bottom: 2rem;
  font-size: 2rem;
  font-weight: 680;
  line-height: 1.18;
}

.rp-doc :not(:where(.rp-not-doc, .rp-not-doc *)):where(h2) {
  margin-top: 3rem;
  margin-bottom: 1.25rem;
  padding-top: 0;
  border-top: 0;
  font-size: 1.75rem;
  font-weight: 680;
  line-height: 1.25;
}

.rp-doc :not(:where(.rp-not-doc, .rp-not-doc *)):where(h3) {
  margin-top: 2rem;
  margin-bottom: 1.25rem;
  font-size: 1.5rem;
  font-weight: 650;
  line-height: 1.3;
}

.rp-doc :not(:where(.rp-not-doc, .rp-not-doc *)):where(h4) {
  font-size: 1.25rem;
  line-height: 1.4;
}

.rp-doc :not(:where(.rp-not-doc, .rp-not-doc *)):where(p, li) {
  overflow-wrap: anywhere;
  color: var(--flow-muted);
  font-size: 16px;
  line-height: 1.75;
}

.rp-doc.rspress-doc > p:first-of-type {
  color: var(--flow-text);
}

.rp-doc :not(:where(.rp-not-doc, .rp-not-doc *)):where(a[href]:not([class])) {
  color: var(--flow-accent-strong);
  text-decoration-color: color-mix(in srgb, currentcolor 34%, transparent);
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}

.rp-doc
  :not(:where(.rp-not-doc, .rp-not-doc *)):where(a[href]:not([class])):hover {
  text-decoration-color: currentcolor;
}

.rp-codeblock,
.rp-codeblock__content,
.rp-codeblock__content__scroll-container {
  min-width: 0;
  max-width: 100%;
}

.rp-codeblock__content__scroll-container {
  overflow-x: auto;
}

.rp-doc .rp-codeblock {
  margin: 1.5rem 0;
  border: 1px solid var(--flow-line-strong);
  border-radius: var(--rp-radius);
  background: var(--flow-bg);
  box-shadow: none;
  direction: ltr;
}

.rp-doc .rp-codeblock__title {
  border-bottom: 1px solid var(--flow-line);
  background: var(--flow-paper);
  color: var(--flow-muted);
  font-size: 12px;
  font-weight: 600;
}

.rp-doc .rp-codeblock__content {
  background: var(--flow-bg);
}

.flow-code-example {
  color: var(--flow-text);
}

.flow-code-example code {
  padding-inline-end: 3.75rem;
}

.flow-node-reference__code
  .rp-codeblock__content--wrap-code
  .flow-code-example
  code {
  word-break: normal !important;
  overflow-wrap: anywhere;
}

.flow-code-token--property,
.flow-code-token--keyword {
  color: var(--shiki-token-keyword);
}

.flow-code-token--string {
  color: var(--shiki-token-string-expression);
}

.flow-code-token--number,
.flow-code-token--parameter {
  color: var(--shiki-token-constant);
}

.flow-code-token--boolean {
  color: var(--shiki-token-constant);
  font-weight: 620;
}

.flow-code-token--punctuation {
  color: var(--shiki-token-punctuation);
}

.flow-code-token--command {
  color: var(--shiki-token-function);
  font-weight: 620;
}

.flow-code-token--comment {
  color: var(--shiki-token-comment);
  font-style: italic;
}

.flow-code-token--variable,
.flow-code-token--file {
  color: var(--shiki-token-link);
}

.rp-doc .rp-code-button-group {
  top: 12px;
  right: 12px;
  gap: 4px;
}

.rp-doc .rp-code-button-group__button {
  width: 32px;
  height: 32px;
  padding: 0;
  border: 0;
  border-radius: 8px;
  background: transparent;
  opacity: 1;
}

.rp-doc .rp-code-button-group__button:hover {
  background: var(--flow-paper);
}

@media (max-width: 640px) {
  .flow-node-reference__code .rp-codeblock__content {
    padding-top: 2.5rem;
  }

  .flow-node-reference__code .rp-code-button-group {
    top: 8px;
  }
}

.rp-doc :not(:where(.rp-not-doc, .rp-not-doc *)):not(pre) > code {
  border: 1px solid var(--flow-line-strong);
  border-radius: 5px;
  background: var(--flow-paper);
  color: var(--flow-accent-strong);
  font-family: var(--flow-mono);
  font-size: 0.84em;
}

.rp-doc .rp-table-scroll-container {
  width: 100%;
  max-width: 100%;
  overflow-x: auto;
  overscroll-behavior-inline: contain;
  scrollbar-color: var(--flow-line-strong) transparent;
  scrollbar-width: thin;
}

.rp-doc :not(:where(.rp-not-doc, .rp-not-doc *)):where(table) {
  overflow: hidden;
  width: 100%;
  max-width: 100%;
  border: 1px solid var(--flow-line-strong);
  border-radius: 12px;
  background: var(--flow-surface);
  border-collapse: separate;
  border-spacing: 0;
}

.rp-doc :not(:where(.rp-not-doc, .rp-not-doc *)):where(thead, th) {
  background: var(--flow-paper);
}

.rp-doc :not(:where(.rp-not-doc, .rp-not-doc *)):where(th) {
  color: var(--flow-text);
  font-size: 14px;
  font-weight: 650;
}

.rp-doc :not(:where(.rp-not-doc, .rp-not-doc *)):where(td) {
  color: var(--flow-muted);
}

.rp-doc :not(:where(.rp-not-doc, .rp-not-doc *)):where(th, td) {
  padding: 12px 14px;
  border-right: 1px solid var(--flow-line);
  border-bottom: 1px solid var(--flow-line);
  vertical-align: top;
}

.rp-doc :not(:where(.rp-not-doc, .rp-not-doc *)):where(tbody tr:hover) {
  background: var(--flow-paper);
}

.rp-doc :not(:where(.rp-not-doc, .rp-not-doc *)):where(tr:last-child) td {
  border-bottom: 0;
}

.rp-doc
  :not(:where(.rp-not-doc, .rp-not-doc *)):where(th:last-child, td:last-child) {
  border-right: 0;
}

.rp-sidebar,
.rp-doc-layout__sidebar {
  border-right-color: var(--flow-line-strong);
  background: var(--flow-bg);
}

.rp-sidebar-item {
  border-radius: 8px;
  color: var(--flow-muted);
}

.rp-sidebar-item--active,
.rp-sidebar-item--active:hover {
  background: color-mix(in srgb, var(--flow-accent) 10%, transparent);
  color: var(--flow-accent-strong);
}

.rp-outline,
.rp-doc-layout__outline {
  border-left-color: var(--flow-line-strong);
}

.rp-doc-footer {
  margin-top: 72px;
  padding-bottom: 32px;
}

.rp-doc-footer__edit {
  min-height: 44px;
  padding: 12px 0;
  border-top: 1px solid var(--flow-line-strong);
  gap: 16px;
}

.rp-doc-footer .rp-edit-link {
  display: inline-flex;
  min-height: 36px;
  margin-inline-start: -10px;
  padding: 0 10px;
  border-radius: 8px;
  align-items: center;
  color: var(--flow-muted);
  font-size: 13px;
  font-weight: 600;
}

.rp-doc-footer .rp-edit-link:hover {
  background: var(--flow-paper);
  color: var(--flow-accent-strong);
}

.rp-last-updated {
  color: var(--flow-faint);
  font-size: 13px;
}

.rp-prev-next-page {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.rp-prev-next-page__item {
  min-width: 0;
  min-height: 88px;
  padding: 16px;
  border: 1px solid var(--flow-line-strong);
  border-radius: 12px;
  background: var(--flow-surface);
  color: var(--flow-text);
  opacity: 1;
}

.rp-prev-next-page__item:hover {
  border-color: var(--flow-border-strong);
  background: var(--flow-paper);
  opacity: 1;
}

.rp-prev-next-page__item__desc {
  color: var(--flow-faint);
  font-size: 12px;
}

.rp-prev-next-page__item__title {
  min-width: 0;
  font-size: 14px;
  font-weight: 650;
}

.rp-doc-layout__sidebar[aria-hidden='true'] {
  visibility: hidden;
  pointer-events: none;
}

@media (min-width: 769px) and (max-width: 1180px) {
  html .rp-nav__others {
    display: flex;
  }

  html .rp-nav__others .rp-social-links {
    display: none;
  }
}

@media (max-width: 640px) {
  html .rp-nav {
    padding-right: 16px;
    padding-left: 16px;
    background: var(--flow-surface);
  }

  .rp-doc-footer {
    margin-top: 56px;
    padding-bottom: 24px;
  }

  .rp-doc-footer__edit {
    align-items: flex-start;
    flex-direction: column;
    gap: 2px;
  }

  .rp-prev-next-page {
    grid-template-columns: 1fr;
  }
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
  }
}