:root {
  color-scheme: dark;

  --om-primary:        #8091ff;
  --om-primary-strong: #9daaff;
  --om-primary-deep:   #5b6be0;
  --om-primary-dim:    rgba(128, 145, 255, 0.14);
  --om-accent:         #2fd8c4;
  --om-accent-dim:     rgba(47, 216, 196, 0.14);
  --om-bg:             #0b1026;
  --om-bg-deep:        #070b1c;
  --om-surface:        #151c3d;
  --om-surface-2:      #1a2350;
  --om-ink:            #eef1fb;
  --om-ink-mute:       #a4adcf;
  --om-ink-faint:      #6a7399;
  --om-line:           rgba(128, 145, 255, 0.24);
  --om-line-soft:      rgba(128, 145, 255, 0.12);
  --om-ok:             #4ade80;
  --om-warn:           #fbbf24;
  --om-danger:         #f87171;

  --om-font-head: "Space Grotesk", -apple-system, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
  --om-font-body: "IBM Plex Sans", -apple-system, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
  --om-font-mono: "IBM Plex Mono", ui-monospace, "SF Mono", Menlo, Consolas, "PingFang SC", monospace;

  --om-fs-xs:  0.75rem;
  --om-fs-sm:  0.875rem;
  --om-fs-md:  1rem;
  --om-fs-lg:  1.125rem;
  --om-fs-xl:  clamp(1.25rem, 1.1rem + 0.8vw, 1.5rem);
  --om-fs-2xl: clamp(1.5rem, 1.2rem + 1.6vw, 2.125rem);
  --om-fs-3xl: clamp(2rem, 1.4rem + 3vw, 3.25rem);

  --om-lh-tight: 1.2;
  --om-lh-snug:  1.4;
  --om-lh-body:  1.72;

  --om-s1: 0.25rem;
  --om-s2: 0.5rem;
  --om-s3: 0.75rem;
  --om-s4: 1rem;
  --om-s5: 1.5rem;
  --om-s6: 2rem;
  --om-s7: 3rem;
  --om-s8: 4.5rem;
  --om-s9: 6.5rem;

  --om-r-s: 4px;
  --om-r-m: 8px;
  --om-r-l: 14px;
  --om-shadow-glow: 0 0 0 1px var(--om-line-soft), 0 12px 40px rgba(4, 7, 22, 0.6);
  --om-shadow-lift: 0 10px 30px rgba(4, 7, 22, 0.55);

  --om-max-narrow: 46rem;
  --om-max:        68rem;
  --om-max-wide:   82rem;
  --om-gutter:     clamp(1rem, 4vw, 2rem);
}

*, *::before, *::after { box-sizing: border-box; }
* { margin: 0; }
html { -webkit-text-size-adjust: 100%; scroll-padding-top: 5rem; }
body {
  background: var(--om-bg);
  color: var(--om-ink);
  font-family: var(--om-font-body);
  font-size: var(--om-fs-md);
  line-height: var(--om-lh-body);
  min-height: 100vh;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background:
    radial-gradient(60rem 40rem at 78% -10%, rgba(128, 145, 255, 0.09), transparent 60%),
    radial-gradient(50rem 34rem at -10% 110%, rgba(47, 216, 196, 0.05), transparent 55%),
    repeating-linear-gradient(to right, rgba(128, 145, 255, 0.035) 0 1px, transparent 1px 120px),
    repeating-linear-gradient(to bottom, rgba(128, 145, 255, 0.028) 0 1px, transparent 1px 120px);
}
img, svg { display: block; max-width: 100%; }
input, button, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; }

h1, h2, h3, h4 {
  font-family: var(--om-font-head);
  font-weight: 600;
  line-height: var(--om-lh-tight);
  letter-spacing: -0.015em;
  text-wrap: balance;
}
h1 { font-size: var(--om-fs-3xl); }
h2 { font-size: var(--om-fs-2xl); }
h3 { font-size: var(--om-fs-xl); }
h4 { font-size: var(--om-fs-lg); }
p  { max-width: 72ch; }
a {
  color: var(--om-primary-strong);
  text-decoration: none;
  text-underline-offset: 3px;
}
a:hover { text-decoration: underline; }
strong { color: var(--om-ink); }
small { font-size: var(--om-fs-sm); }
code, kbd, pre {
  font-family: var(--om-font-mono);
  font-size: 0.9em;
}
code, kbd {
  background: var(--om-surface);
  border: 1px solid var(--om-line-soft);
  border-radius: var(--om-r-s);
  padding: 0.1em 0.4em;
}
pre {
  background: var(--om-bg-deep);
  border: 1px solid var(--om-line-soft);
  border-radius: var(--om-r-m);
  padding: var(--om-s4) var(--om-s5);
  overflow-x: auto;
  line-height: 1.6;
}
pre code { background: none; border: 0; padding: 0; }
hr {
  border: 0;
  border-top: 1px solid var(--om-line-soft);
  margin: var(--om-s6) 0;
}
::selection { background: var(--om-primary-deep); color: #fff; }
:focus-visible {
  outline: 2px solid var(--om-accent);
  outline-offset: 2px;
  border-radius: var(--om-r-s);
}

.om-num {
  font-family: var(--om-font-mono);
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.01em;
}

.om-kicker {
  display: inline-flex;
  align-items: center;
  gap: 0.6em;
  font-family: var(--om-font-mono);
  font-size: var(--om-fs-xs);
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--om-accent);
}
.om-kicker::before {
  content: "";
  width: 1.5rem;
  height: 1px;
  background: var(--om-accent);
}

.om-muted { color: var(--om-ink-mute); }
.om-faint { color: var(--om-ink-faint); }
.om-lead  { font-size: var(--om-fs-lg); color: var(--om-ink-mute); max-width: 62ch; }

.om-wrap {
  width: 100%;
  max-width: var(--om-max);
  margin-inline: auto;
  padding-inline: var(--om-gutter);
}
.om-wrap--narrow { max-width: var(--om-max-narrow); }
.om-wrap--wide   { max-width: var(--om-max-wide); }

.om-grid { display: grid; gap: var(--om-s5); }

.om-grid > * { min-width: 0; }
.om-grid--2 { grid-template-columns: repeat(2, 1fr); }
.om-grid--3 { grid-template-columns: repeat(3, 1fr); }
.om-grid--4 { grid-template-columns: repeat(4, 1fr); }
@media (max-width: 960px) {
  .om-grid--4 { grid-template-columns: repeat(2, 1fr); }
  .om-grid--3 { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 640px) {
  .om-grid--2, .om-grid--3, .om-grid--4 { grid-template-columns: 1fr; }
}

.om-mt-2 { margin-top: var(--om-s2); }
.om-mt-3 { margin-top: var(--om-s3); }
.om-mt-4 { margin-top: var(--om-s4); }
.om-mt-5 { margin-top: var(--om-s5); }
.om-mt-6 { margin-top: var(--om-s6); }
.om-mt-7 { margin-top: var(--om-s7); }
.om-mb-4 { margin-bottom: var(--om-s4); }
.om-mb-5 { margin-bottom: var(--om-s5); }
.om-mb-6 { margin-bottom: var(--om-s6); }
.om-flow > * + * { margin-top: var(--om-s4); }
.om-center { text-align: center; }
.om-center p, .om-center .om-lead { margin-inline: auto; }
.om-row {
  display: flex;
  flex-wrap: wrap;
  gap: var(--om-s3);
  align-items: center;
}

.om-hairline { border-top: 1px solid var(--om-line-soft); }

html.om-anim .reveal {
  opacity: 0;
  transform: translateY(16px);
  transition: opacity 0.65s cubic-bezier(0.22, 0.61, 0.36, 1),
              transform 0.65s cubic-bezier(0.22, 0.61, 0.36, 1);
}
html.om-anim .reveal.is-visible { opacity: 1; transform: none; }
html.om-anim [data-reveal-delay="1"] { transition-delay: 0.08s; }
html.om-anim [data-reveal-delay="2"] { transition-delay: 0.16s; }
html.om-anim [data-reveal-delay="3"] { transition-delay: 0.24s; }
html.om-anim [data-reveal-delay="4"] { transition-delay: 0.32s; }
@media (prefers-reduced-motion: reduce) {
  html.om-anim .reveal { opacity: 1 !important; transform: none !important; transition: none !important; }
  * { animation-duration: 0.01ms !important; transition-duration: 0.01ms !important; }
}

.om-visually-hidden {
  position: absolute;
  width: 1px; height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}
main{overflow-x:clip}