/* ChainCSS Generated — DO NOT EDIT */

/* comparison.css */
.chain-comparison-check {
  color:#22c55e;
  font-weight:600
}
.chain-comparison-cross {
  color:#ef4444
}
.chain-comparison-partial {
  color:#f59e0b
}
.chain-comparison-table {
  width:100%;
  border-collapse:collapse;
  font-size:14px
}
.chain-comparison-td {
  padding:14px 16px;
  color:#e4e4e7;
  border-bottom:1px solid rgba(255,255,255,0.04)
}
.chain-comparison-th {
  padding:12px 16px;
  text-align:left;
  color:#71717a;
  font-weight:500;
  font-size:13px;
  text-transform:uppercase;
  letter-spacing:.5px;
  border-bottom:1px solid rgba(255,255,255,0.06)
}
.chain-comparison-wrapper {
  overflow:auto;
  border-radius:12px;
  border:1px solid rgba(255,255,255,0.06)
}

/* docs.css */
.chain-code-block {
  background-color:rgba(0,0,0,0.4);
  border-radius:12px;
  padding:20px 24px;
  overflow:auto;
  font-family:'JetBrains Mono', 'Fira Code', monospace;
  font-size:14px;
  line-height:1.7;
  margin-bottom:24px;
  border:1px solid rgba(255,255,255,0.06);
  color:#e4e4e7;
  white-space:pre-wrap;
  word-break:break-word
}
.chain-docs-content {
  flex-grow:1;
  min-width:0px;
  max-width:calc(100% - 308px)
}
.chain-content-desc {
  font-size:17px;
  color:#a1a1aa;
  margin-bottom:40px;
  line-height:1.7
}
.chain-content-title {
  font-size:36px;
  font-weight:700;
  color:#f4f4f5;
  margin-bottom:8px;
  letter-spacing:-1px
}
.chain-doc-table {
  width:100%;
  border-collapse:collapse;
  font-size:14px
}
.chain-doc-td {
  padding:12px 16px;
  color:#d4d4d8;
  border-bottom:1px solid rgba(255,255,255,0.04);
  font-size:14px
}
.chain-doc-th {
  padding:12px 16px;
  text-align:left;
  color:#a1a1aa;
  font-weight:600;
  font-size:13px;
  text-transform:uppercase;
  letter-spacing:.5px;
  border-bottom:1px solid rgba(255,255,255,0.08);
  background-color:rgba(255,255,255,0.02)
}
.chain-docs-layout {
  display:flex;
  max-width:1300px;
  margin:0 auto;
  padding:80px 24px 40px;
  gap:48px
}
.chain-inline-code {
  background-color:rgba(99,102,241,0.12);
  color:#c7d2fe;
  padding:2px 8px;
  border-radius:4px;
  font-size:13px;
  font-family:'JetBrains Mono', 'Fira Code', monospace;
  white-space:nowrap
}
.chain-docs-note {
  background-color:rgba(99,102,241,0.08);
  border-left:3px solid #6366f1;
  padding:16px 20px;
  border-radius:0 8px 8px 0;
  margin-bottom:24px;
  font-size:14px;
  color:#c7d2fe;
  line-height:1.7
}
.chain-docs-paragraph {
  font-size:15px;
  color:#c4c4cc;
  line-height:1.8;
  margin-bottom:20px
}
.chain-section-heading {
  font-size:22px;
  font-weight:600;
  color:#e4e4e7;
  margin-top:48px;
  margin-bottom:16px;
  padding-bottom:8px;
  border-bottom:1px solid rgba(255,255,255,0.06)
}
.chain-docs-sidebar {
  width:260px;
  flex-shrink:0;
  position:sticky;
  top:88px;
  height:fit-content;
  max-height:calc(100vh - 120px);
  overflow:auto;
  padding-right:16px
}
.chain-sidebar-link {
  display:block;
  padding:8px 12px;
  border-radius:6px;
  font-size:14px;
  color:#a1a1aa;
  cursor:pointer;
  transition:all 0.1s ease;
  margin-bottom:2px;
  text-decoration:none
}
.chain-sidebar-link:hover {
  background-color:rgba(255,255,255,0.04);
  color:#e4e4e7
}
.chain-sidebar-link-active {
  background-color:rgba(99,102,241,0.12);
  color:#c7d2fe;
  font-weight:500
}
.chain-sidebar-title {
  font-size:12px;
  font-weight:600;
  color:#52525b;
  text-transform:uppercase;
  letter-spacing:1px;
  margin-bottom:12px
}
.chain-docs-table-wrap {
  overflow:auto;
  margin-bottom:24px;
  border-radius:10px;
  border:1px solid rgba(255,255,255,0.06)
}

/* features.css */
.chain-feature-card {
  background-color:rgba(255, 255, 255, 0.02);
  border:1px solid rgba(255, 255, 255, 0.05);
  border-radius:16px;
  padding:32px;
  transition:all 0.2s ease
}
.chain-feature-card:hover {
  border-color:rgba(99, 102, 241, 0.2);
  background-color:rgba(99, 102, 241, 0.04)
}
.chain-feature-card-code {
  background-color:rgba(0, 0, 0, 0.3);
  border-radius:8px;
  padding:14px 16px;
  font-size:13px;
  font-family:'JetBrains Mono', 'Fira Code', monospace;
  color:#a5b4fc;
  margin-top:16px;
  overflow:auto;
  line-height:1.6
}
.chain-feature-card-icon {
  font-size:36px;
  margin-bottom:20px
}
.chain-feature-card-text {
  font-size:14px;
  color:#a1a1aa;
  line-height:1.7
}
.chain-feature-card-title {
  font-size:18px;
  font-weight:600;
  color:#e4e4e7;
  margin-bottom:12px
}
.chain-feature-grid {
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(340px, 1fr));
  gap:24px
}
.chain-features-section {
  padding:100px 24px;
  max-width:1200px;
  margin:0 auto
}
.chain-section-label {
  font-size:13px;
  font-weight:600;
  color:#818cf8;
  text-transform:uppercase;
  letter-spacing:1px;
  text-align:center;
  margin-bottom:16px
}
.chain-section-subtitle {
  font-size:17px;
  color:#a1a1aa;
  text-align:center;
  max-width:600px;
  margin:0 auto 64px;
  line-height:1.7
}
.chain-section-title {
  font-size:36px;
  font-weight:700;
  color:#f4f4f5;
  text-align:center;
  margin-bottom:16px;
  letter-spacing:-0.5px
}

/* footer.css */
.chain-site-footer {
  border-top:1px solid rgba(255,255,255,0.06);
  padding:40px 24px;
  text-align:center
}
.chain-footer-link {
  color:#71717a;
  transition:color 0.15s ease
}
.chain-footer-link:hover {
  color:#a5b4fc
}
.chain-footer-text {
  font-size:14px;
  color:#52525b
}

/* hero.css */
.chain-hero-badge {
  display:inline-flex;
  align-items:center;
  gap:8px;
  background-color:rgba(99, 102, 241, 0.1);
  color:#a5b4fc;
  padding:6px 16px;
  border-radius:9999px;
  font-size:13px;
  font-weight:500;
  margin-bottom:32px
}
.chain-hero-cta-group {
  display:flex;
  gap:16px;
  justify-content:center
}
.chain-hero-gradient {
  background:linear-gradient(135deg, #818cf8, #a78bfa, #f472b6);
  --webkit-background-clip:text;
  --webkit-text-fill-color:transparent;
  background-clip:text
}
.chain-hero-primary-btn {
  background-color:#6366f1;
  color:#fff;
  padding:14px 32px;
  border-radius:12px;
  font-size:16px;
  font-weight:600;
  cursor:pointer;
  border:none;
  transition:all 0.2s ease
}
.chain-hero-primary-btn:hover {
  background-color:#4f46e5;
  transform:translateY(-1px);
  box-shadow:0 4px 20px rgba(99, 102, 241, 0.3)
}
.chain-hero-secondary-btn {
  background-color:rgba(255, 255, 255, 0.04);
  color:#d4d4d8;
  padding:14px 32px;
  border-radius:12px;
  font-size:16px;
  font-weight:500;
  cursor:pointer;
  border:1px solid rgba(255, 255, 255, 0.1);
  transition:all 0.2s ease
}
.chain-hero-secondary-btn:hover {
  background-color:rgba(255, 255, 255, 0.08);
  border-color:rgba(255, 255, 255, 0.2)
}
.chain-hero {
  padding:140px 24px 100px;
  text-align:center;
  max-width:900px;
  margin:0 auto
}
.chain-hero-subtitle {
  font-size:18px;
  color:#a1a1aa;
  line-height:1.7;
  max-width:650px;
  margin:0 auto 48px
}
.chain-hero-title {
  font-size:60px;
  font-weight:800;
  color:#f4f4f5;
  line-height:1.1;
  letter-spacing:-2px;
  margin-bottom:24px
}

/* nav.css */
.chain-nav-logo {
  font-size:20px;
  font-weight:700;
  color:#fff;
  letter-spacing:-0.5px;
  cursor:pointer
}
.chain-nav-logo-accent {
  color:#6366f1
}
.chain-nav {
  position:fixed;
  top:0px;
  left:0px;
  right:0px;
  z-index:100;
  background-color:rgba(10, 10, 15, 0.8);
  backdrop-filter:blur(12px);
  border-bottom:1px solid rgba(255, 255, 255, 0.06)
}
.chain-nav-cta {
  background-color:#6366f1;
  color:#fff;
  padding:8px 20px;
  border-radius:8px;
  font-size:14px;
  font-weight:600;
  cursor:pointer;
  border:none;
  transition:background 0.15s ease
}
.chain-nav-cta:hover {
  background-color:#4f46e5
}
.chain-nav-inner {
  max-width:1200px;
  margin:0 auto;
  padding:0 24px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  height:64px
}
.chain-nav-link {
  font-size:14px;
  font-weight:500;
  color:#a1a1aa;
  cursor:pointer;
  transition:color 0.15s ease
}
.chain-nav-link:hover {
  color:#ffffff
}
.chain-nav-links {
  display:flex;
  gap:32px;
  align-items:center
}

/* playground.css */
.chain-pg-container {
  padding:100px 24px 60px;
  max-width:1400px;
  margin:0 auto
}
.chain-pg-copy-btn {
  background-color:transparent;
  color:#71717a;
  padding:6px 12px;
  border-radius:6px;
  font-size:12px;
  cursor:pointer;
  border:1px solid rgba(255,255,255,0.1);
  transition:all 0.15s ease
}
.chain-pg-copy-btn:hover {
  color:#e4e4e7;
  border-color:rgba(255,255,255,0.2)
}
.chain-pg-desc {
  font-size:16px;
  color:#71717a
}
.chain-pg-editor {
  padding:20px;
  min-height:350px;
  font-family:'JetBrains Mono', monospace;
  font-size:14px;
  line-height:1.7;
  color:#e4e4e7;
  outline:none;
  border:none;
  background-color:transparent;
  width:100%;
  resize:none
}
.chain-pg-grid {
  display:grid;
  grid-template-columns:1fr 1fr 1fr;
  gap:24px
}
.chain-pg-header {
  text-align:center;
  margin-bottom:48px
}
.chain-pg-output {
  padding:20px;
  min-height:350px;
  font-family:'JetBrains Mono', monospace;
  font-size:14px;
  line-height:1.7;
  color:#22c55e;
  white-space:pre-wrap;
  overflow:auto;
  display:flex
}
.chain-pg-panel {
  background-color:rgba(0,0,0,0.3);
  border:1px solid rgba(255,255,255,0.06);
  border-radius:16px;
  overflow:hidden;
  display:flex;
  flex-direction:column
}
.chain-pg-panel-header {
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:14px 20px;
  border-bottom:1px solid rgba(255,255,255,0.06);
  flex-shrink:0
}
.chain-pg-panel-title {
  font-size:13px;
  font-weight:600;
  color:#71717a;
  text-transform:uppercase;
  letter-spacing:.5px
}
.chain-pg-preview {
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:350px;
  border:none;
  width:100%;
  background-color:transparent
}
.chain-pg-run-btn {
  background-color:#6366f1;
  color:#fff;
  padding:8px 18px;
  border-radius:8px;
  font-size:13px;
  font-weight:600;
  cursor:pointer;
  border:none;
  transition:background 0.15s ease
}
.chain-pg-run-btn:hover {
  background-color:#4f46e5
}
.chain-pg-title {
  font-size:40px;
  font-weight:700;
  color:#fff;
  margin-bottom:12px
}

