:root {
  --ads-ink: #0A1628;
  --ads-deep: #12294A;
  --ads-blue: #2E6FF2;
  --ads-blue-hover: #1E5AD8;
  --ads-blue-ink: #173E9E;
  --ads-sky: #7FA8F8;
  --ads-mist: #E9F0FC;
  --ads-paper: #F7FAFE;
  --ads-white: #FFFFFF;
  --ads-text: #0A1628;
  --ads-text-muted: #43506B;
  --ads-text-inverse: #F7FAFE;
  --ads-text-inverse-muted: #9FB2D4;
  --ads-border: #D8E3F5;
  --ads-border-dark: #1E3A66;
  --ads-success: #0F6E56;
  --ads-success-bg: #E1F5EE;
  --ads-radius-sm: 6px;
  --ads-radius: 10px;
  --ads-radius-lg: 16px;
  --ads-font-sans: 'Inter', -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
  --ads-font-mono: 'JetBrains Mono', ui-monospace, SFMono-Regular, Consolas, monospace;
}

.ads-logo { display: inline-flex; align-items: center; gap: 10px; font-family: var(--ads-font-sans); text-decoration: none; }
.ads-logo-word { font-size: 18px; font-weight: 600; letter-spacing: -0.01em; color: var(--ads-text); white-space: nowrap; }
.ads-logo-word span { font-weight: 400; color: var(--ads-text-muted); }
.ads-logo-light .ads-logo-word { color: var(--ads-text-inverse); }
.ads-logo-light .ads-logo-word span { color: var(--ads-text-inverse-muted); }

.ads-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; font-family: var(--ads-font-sans); font-weight: 600; border-radius: var(--ads-radius-sm); border: 1px solid transparent; cursor: pointer; text-decoration: none; line-height: 1; transition: background-color 0.15s, border-color 0.15s, color 0.15s; }
.ads-btn-md { font-size: 15px; padding: 11px 20px; }
.ads-btn-lg { font-size: 16px; padding: 15px 28px; }
.ads-btn-primary { background: var(--ads-blue); color: var(--ads-white); }
.ads-btn-primary:hover { background: var(--ads-blue-hover); }
.ads-btn-secondary { background: transparent; color: var(--ads-blue); border-color: var(--ads-blue); }
.ads-btn-secondary:hover { background: var(--ads-mist); }
.ads-btn-ghost { background: transparent; color: var(--ads-text-muted); }
.ads-btn-ghost:hover { color: var(--ads-blue); }

.ads-badge { display: inline-flex; align-items: center; gap: 6px; font-family: var(--ads-font-sans); font-size: 13px; font-weight: 500; line-height: 1; padding: 6px 12px; border-radius: 999px; border: 1px solid var(--ads-border); color: var(--ads-text-muted); background: var(--ads-white); }
.ads-badge-accent { background: var(--ads-mist); border-color: transparent; color: var(--ads-blue-ink); }
.ads-badge-success { background: var(--ads-success-bg); border-color: transparent; color: var(--ads-success); }

.ads-card { background: var(--ads-white); border: 1px solid var(--ads-border); border-radius: var(--ads-radius); padding: 24px; font-family: var(--ads-font-sans); }
.ads-card-title { margin: 0 0 8px; font-size: 17px; font-weight: 600; line-height: 1.4; color: var(--ads-text); }
.ads-card-dot { color: var(--ads-blue); margin-right: 8px; }
.ads-card-body { margin: 0; font-size: 14.5px; line-height: 1.65; color: var(--ads-text-muted); }

.ads-section-heading { font-family: var(--ads-font-sans); }
.ads-section-heading h2 { margin: 0 0 10px; font-size: 28px; font-weight: 600; letter-spacing: -0.01em; line-height: 1.25; color: var(--ads-text); }
.ads-section-heading p { margin: 0; font-size: 16.5px; line-height: 1.65; color: var(--ads-text-muted); max-width: 720px; }
.ads-section-heading-center { text-align: center; }
.ads-section-heading-center p { margin-left: auto; margin-right: auto; }

.ads-code { background: var(--ads-ink); border-radius: var(--ads-radius); padding: 20px 24px; overflow-x: auto; }
.ads-code-title { font-family: var(--ads-font-sans); font-size: 12px; font-weight: 500; letter-spacing: 0.08em; text-transform: uppercase; color: var(--ads-text-inverse-muted); margin: 0 0 12px; }
.ads-code pre { margin: 0; font-family: var(--ads-font-mono); font-size: 13.5px; line-height: 1.75; color: var(--ads-paper); }
.ads-code-comment { color: #5B7396; }
.ads-code-str { color: #9CC2FF; }
.ads-code-kw { color: var(--ads-sky); }

.ads-callout { background: var(--ads-paper); border-left: 3px solid var(--ads-blue); border-radius: 0 var(--ads-radius) var(--ads-radius) 0; padding: 16px 20px; font-family: var(--ads-font-sans); font-size: 14.5px; line-height: 1.65; color: var(--ads-text-muted); }
.ads-callout-title { margin: 0 0 4px; font-size: 14.5px; font-weight: 600; color: var(--ads-text); }
.ads-callout p { margin: 0; }

.ads-stat { display: flex; flex-direction: column; gap: 4px; font-family: var(--ads-font-sans); }
.ads-stat-value { font-size: 30px; font-weight: 600; line-height: 1.1; letter-spacing: -0.02em; color: var(--ads-text); }
.ads-stat-value em { font-style: normal; color: var(--ads-blue); }
.ads-stat-label { font-size: 13.5px; line-height: 1.4; color: var(--ads-text-muted); }
