:root {
  --ks-lime: #b6ff3b;
  --ks-mint: #55e6c1;
  --ks-ink: #0b0f14;
  --md-primary-fg-color: #0b0f14;
  --md-accent-fg-color: #65c700;
}
[data-md-color-scheme="slate"] {
  --md-default-bg-color: #0b0f14;
  --md-default-bg-color--light: #111821;
  --md-code-bg-color: #111821;
  --md-accent-fg-color: var(--ks-lime);
}
.md-header { border-bottom: 1px solid rgba(127, 255, 170, .16); }
.md-tabs { border-bottom: 1px solid rgba(127, 255, 170, .1); }
.md-tabs__link { color: rgba(255,255,255,.72); opacity: 1; }
.md-tabs__link--active, .md-tabs__link:focus, .md-tabs__link:hover { color: #fff; }
.ks-hero {
  position: relative;
  overflow: hidden;
  margin: .5rem 0 2rem;
  padding: clamp(2rem, 6vw, 4.5rem);
  border: 1px solid rgba(101, 199, 0, .28);
  border-radius: 1.25rem;
  background:
    linear-gradient(135deg, rgba(182,255,59,.11), transparent 42%),
    radial-gradient(circle at 90% 10%, rgba(85,230,193,.18), transparent 35%),
    var(--md-code-bg-color);
}
.ks-hero::after {
  content: "K";
  position: absolute;
  right: 3%;
  bottom: -28%;
  color: rgba(182,255,59,.055);
  font: 800 clamp(10rem, 28vw, 22rem)/1 ui-monospace, monospace;
  pointer-events: none;
}
.ks-hero h1 { max-width: 15ch; margin: .45rem 0 1rem; font-size: clamp(2.25rem, 6vw, 4.4rem); line-height: 1.02; letter-spacing: -.045em; }
.ks-title-line { display: block; white-space: nowrap; }
.ks-hero > p { position: relative; z-index: 1; max-width: 46rem; font-size: .9rem; }
.ks-kicker { color: var(--md-accent-fg-color); font: 700 .65rem/1.2 ui-monospace, monospace; letter-spacing: .16em; }
.ks-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .8rem; margin: 1.5rem 0 2.5rem; }
.ks-card { min-width: 0; padding: 1.2rem 1.3rem; border: 1px solid var(--md-default-fg-color--lightest); border-radius: .85rem; background: var(--md-code-bg-color); transition: transform .18s ease, border-color .18s ease; }
.ks-card:hover { transform: translateY(-2px); border-color: var(--md-accent-fg-color); }
.ks-card h3 { margin-top: 0; }
.ks-card p:last-child { margin-bottom: 0; }
.md-typeset pre, .md-typeset code { max-width: 100%; }
.md-typeset pre { overflow-x: auto; }
.md-typeset .admonition, .md-typeset details { border-radius: .65rem; }
@media (max-width: 44.9844em) {
  .ks-hero { padding: 1.5rem; border-radius: .9rem; }
  .ks-hero h1 { max-width: none; font-size: 1.75rem; line-height: 1.08; letter-spacing: -.025em; }
  .ks-hero .md-button { display: block; width: 100%; margin: .5rem 0 0; text-align: center; }
  .ks-grid { grid-template-columns: 1fr; }
  .ks-card { padding: 1rem; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; }
}
