Here's the fully updated CSS with all alignment changes applied against your `designTokens.ts` and `theme.ts`:

/* ==========================================================================
   RunWhen — Scroll Sites Custom CSS
   Uses K15t's design token system + cc-registry-v2 theme.ts values
   ==========================================================================
   Paste into: Scroll Sites > Theme > Custom CSS
   ========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap');

/* ==========================================================================
   1. K15t THEME TOKENS — maps cc-registry-v2 theme.ts to Scroll Sites
   ========================================================================== */
:root {
  /* Typography */
  --theme-text-font: "Inter", -apple-system, BlinkMacSystemFont, "Roboto", "Helvetica", "Arial", sans-serif;
  --theme-headline-font: "Inter", -apple-system, BlinkMacSystemFont, "Roboto", "Helvetica", "Arial", sans-serif;
  --theme-text-color: #374151;
  --theme-headline-color: #374151;

  /* Brand — theme.ts palette.primary.main */
  --theme-primary-color: #2F80ED;
  --theme-on-primary-color: #ffffff;

  /* Header */
  --theme-header-background-color: #2F80ED;
  --theme-header-text-color: #ffffff;

  /* Footer */
  --theme-footer-background-color: #2F80ED;
  --theme-footer-text-color: #ffffff;

  /* Banner */
  --theme-banner-background-color: #2F80ED;
  --theme-banner-text-color: #ffffff;

  /* Roundness */
  --theme-roundness: 0.5;
}

/* ==========================================================================
   2. K15t DESIGN TOKENS — official tokens from help.k15t.com
   ========================================================================== */
:root {
  /* designTokens.ts colors.text */
  --K15t-foreground: #374151;
  --K15t-foreground-subtle: #6b7280;
  /* theme.ts palette.link.main */
  --K15t-link: #2F80ED;

  /* designTokens.ts colors.bg */
  --K15t-surface: #ffffff;
  --K15t-surface-raised: #ffffff;
  --K15t-surface-overlay: #f3f4f6;

  /* designTokens.ts colors.border */
  --K15t-border-neutral: #e5e7eb;
  --K15t-border-neutral-strong: #d1d5db;

  /* designTokens.ts colors.bg */
  --K15t-background-neutral: #f3f4f6;
  --K15t-background-neutral-hovered: #e5e7eb;
  --K15t-background-neutral-subtle: #f9fafb;
  --K15t-background-neutral-subtle-hovered: #f3f4f6;
  --K15t-background-neutral-subtle-selected: #e5e7eb;
  --K15t-background-input: #ffffff;

  /* Typography primitives — designTokens.ts fontFamily.sans */
  --K15t-font-family-headline: "Inter", -apple-system, BlinkMacSystemFont, "Roboto", "Helvetica", "Arial", sans-serif;
  --K15t-font-family-body: "Inter", -apple-system, BlinkMacSystemFont, "Roboto", "Helvetica", "Arial", sans-serif;
  --K15t-font-family-code: "Inconsolata", source-code-pro, Menlo, Monaco, Consolas, 'Courier New', monospace;
}

/* ==========================================================================
   3. DARK MODE — following K15t's official dark theme pattern
   ========================================================================== */
[data-theme="dark"],
[data-color-mode="dark"],
.dark-theme,
.sp-dark {
  color-scheme: dark;

  --theme-text-color: #c0c0c0;
  --theme-headline-color: #e0e0e0;
  --theme-header-background-color: #1a1a2e;
  --theme-footer-background-color: #1a1a2e;
  --theme-banner-background-color: #1a1a2e;

  --K15t-foreground: #e0e0e0;
  --K15t-foreground-subtle: #a0a0a0;
  --K15t-link: #6BA3F5;

  --K15t-surface: #121212;
  --K15t-surface-raised: #1e1e1e;
  --K15t-surface-overlay: #2a2a2a;

  --K15t-border-neutral: rgba(255, 255, 255, 0.12);
  --K15t-border-neutral-strong: rgba(255, 255, 255, 0.2);

  --K15t-background-neutral: #2a2a2a;
  --K15t-background-neutral-hovered: #333333;
  --K15t-background-neutral-subtle: #1e1e1e;
  --K15t-background-neutral-subtle-hovered: #2a2a2a;
  --K15t-background-neutral-subtle-selected: #333333;
  --K15t-background-input: #1e1e1e;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]):not(.light-theme):not(.sp-light) {
    color-scheme: dark;

    --theme-text-color: #c0c0c0;
    --theme-headline-color: #e0e0e0;
    --theme-header-background-color: #1a1a2e;
    --theme-footer-background-color: #1a1a2e;
    --theme-banner-background-color: #1a1a2e;

    --K15t-foreground: #e0e0e0;
    --K15t-foreground-subtle: #a0a0a0;
    --K15t-link: #6BA3F5;
    --K15t-surface: #121212;
    --K15t-surface-raised: #1e1e1e;
    --K15t-surface-overlay: #2a2a2a;
    --K15t-border-neutral: rgba(255, 255, 255, 0.12);
    --K15t-border-neutral-strong: rgba(255, 255, 255, 0.2);
    --K15t-background-neutral: #2a2a2a;
    --K15t-background-neutral-hovered: #333333;
    --K15t-background-neutral-subtle: #1e1e1e;
    --K15t-background-neutral-subtle-hovered: #2a2a2a;
    --K15t-background-neutral-subtle-selected: #333333;
    --K15t-background-input: #1e1e1e;
  }
}

/* ==========================================================================
   4. SUPPLEMENTAL CSS — minimal overrides
   ========================================================================== */

body {
  font-size: 14px; /* designTokens.ts fontSize.base */
}

a:visited { color: inherit; }

/* Banner / Hero — gradient from theme.ts palette.primary */
[class*="banner"],
[class*="Banner"],
[class*="hero"],
[class*="cover"] {
  background: linear-gradient(180deg, #2F80ED 0%, #1a6fd6 50%, #116EEB 100%) !important;
}

/* Banner dark mode — match dark header */
[data-theme="dark"] [class*="banner"],
[data-theme="dark"] [class*="Banner"],
[data-theme="dark"] [class*="hero"],
[data-theme="dark"] [class*="cover"],
[data-color-mode="dark"] [class*="banner"],
[data-color-mode="dark"] [class*="Banner"],
[data-color-mode="dark"] [class*="hero"],
[data-color-mode="dark"] [class*="cover"],
.dark-theme [class*="banner"],
.dark-theme [class*="Banner"],
.dark-theme [class*="hero"],
.dark-theme [class*="cover"],
.sp-dark [class*="banner"],
.sp-dark [class*="Banner"],
.sp-dark [class*="hero"],
.sp-dark [class*="cover"] {
  background: linear-gradient(180deg, #1a1a2e 0%, #1a1a2e 40%, #1e2038 100%) !important;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]):not(.light-theme):not(.sp-light) [class*="banner"],
  :root:not([data-theme="light"]):not(.light-theme):not(.sp-light) [class*="Banner"],
  :root:not([data-theme="light"]):not(.light-theme):not(.sp-light) [class*="hero"],
  :root:not([data-theme="light"]):not(.light-theme):not(.sp-light) [class*="cover"] {
    background: linear-gradient(180deg, #1a1a2e 0%, #1a1a2e 40%, #1e2038 100%) !important;
  }
}

/* Header nav links */
header a,
[class*="header"] a,
[class*="Header"] a {
  font-size: 0.9375rem !important;
}

/* Header logo — shrink to fit nav height (both modes) */
.header-logo {
  max-height: 32px !important;
  width: auto !important;
  object-fit: contain !important;
}

/* All inputs — dark-friendly everywhere (header, banner, search) */
input, [type="search"], [type="text"] {
  background-color: var(--K15t-background-input) !important;
  color: var(--K15t-foreground) !important;
  border-color: var(--K15t-border-neutral-strong) !important;
}

/* Left sidebar — remove ALL filled boxes (default, active, hover) */
.tree .tree-item-header {
  background-color: transparent !important;
  background: transparent !important;
}
.tree .tree-item-header:has(> [aria-current="page"]) a,
.tree .tree-item-header:has(> [aria-current]) a {
  color: var(--K15t-link) !important;
  font-weight: 600;
}
.tree .tree-item-header:hover a {
  color: var(--K15t-link) !important;
}

/* Right "On This Page" TOC — "you are here" highlight */
[data-component="toc"] {
  --background-color-selected: rgba(47, 128, 237, 0.08);
  --foreground-color-selected: var(--K15t-foreground);
}
/* Dark mode: subtle dark tint */
[data-theme="dark"] [data-component="toc"],
[data-color-mode="dark"] [data-component="toc"],
.dark-theme [data-component="toc"],
.sp-dark [data-component="toc"] {
  --background-color-selected: rgba(107, 163, 245, 0.12);
  --foreground-color-selected: var(--K15t-foreground);
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]):not(.light-theme):not(.sp-light) [data-component="toc"] {
    --background-color-selected: rgba(107, 163, 245, 0.12);
    --foreground-color-selected: var(--K15t-foreground);
  }
}

/* Content heading underlines */
.sp-content h1, #content h1 {
  border-bottom: 1px solid var(--K15t-border-neutral);
  padding-bottom: 0.4em;
}
.sp-content h2, #content h2 {
  border-bottom: 1px solid var(--K15t-border-neutral);
  padding-bottom: 0.3em;
}

/* Tables — center aligned */
table, .sp-content table, .confluenceTable {
  margin-left: auto;
  margin-right: auto;
}
th, .confluenceTh {
  color: var(--K15t-foreground);
  font-weight: 600;
}
td, .confluenceTd {
  color: var(--K15t-foreground);
}

/* Images — designTokens.ts radius.sm */
.sp-content img, .confluence-embedded-image {
  max-width: 100%;
  height: auto;
  border-radius: 4px;
}

/* Buttons */
button, .sp-button { text-transform: none; }

/* Cards — designTokens.ts radius.lg */
[class*="card"], [class*="tile"] { border-radius: 8px; }

/* HR */
hr {
  border: none;
  height: 1px;
  background-color: var(--K15t-border-neutral);
  margin: 32px 0;
}

html { scroll-behavior: smooth; }

/* ==========================================================================
   5. RESPONSIVE
   ========================================================================== */
@media (max-width: 768px) {
  pre { font-size: 0.8rem; padding: 12px; }
  th, td { padding: 8px 10px; font-size: 0.8125rem; }
}

/* ==========================================================================
   6. PRINT
   ========================================================================== */
@media print {
  body { color: #000; background: #fff; }
  pre, code { border: 1px solid #ddd; background: #f9f9f9; color: #333; }
}