:root {
  --page: 1440px;
  --content: 1200px;
  --purple: #6c26eb;
  --purple-pale: #f3edff;
  --purple-line: #cbb6f7;
  --text: #111111;
  --ink: #3a3a40;
  --mute: #9a9aa3;
  --body: #6b6b73;
  --line: #e8e8e8;
  --fill: #ececee;
  --white: #fff;
}

* { box-sizing: border-box; margin: 0; padding: 0; }

html, body {
  background: #fff;
  font-family: Onest, sans-serif;
  color: var(--text);
  overflow-x: clip;
}

a { color: inherit; text-decoration: none; }

.page {
  width: 100%;
  margin: 0;
  background: #fff;
}

.sec { padding: 120px 0 0; }
.hero { padding-top: 24px; }

.content { width: var(--content); margin: 0 auto; }
.center { text-align: center; }

.header { width: var(--content); margin: 0 auto; padding: 0; }
.header-bar {
  height: 56px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding: 0 12px 0 18px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.8);
}

.brand {
  display: flex;
  align-items: center;
  gap: 8px;
  font-weight: 600;
  font-size: 16px;
  white-space: nowrap;
}
.brand img { width: 22px; height: 22px; }

.brand em {
  margin-left: 4px;
  padding: 4px 10px;
  border-radius: 999px;
  background: var(--purple-pale);
  color: var(--purple);
  font-style: normal;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.02em;
}
.nav-grey {
  display: flex;
  gap: 22px;
  color: var(--ink);
  font-size: 14px;
}
.nav-grey a:hover { color: var(--purple); }
.nav-burger {
  display: none;
  width: 40px;
  height: 40px;
  flex: none;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fff;
  cursor: pointer;
}
.nav-burger span,
.nav-burger span::before,
.nav-burger span::after {
  display: block;
  width: 16px;
  height: 1.5px;
  background: var(--text);
  border-radius: 2px;
  position: relative;
}
.nav-burger span::before,
.nav-burger span::after {
  content: "";
  position: absolute;
  left: 0;
}
.nav-burger span::before { top: -5px; }
.nav-burger span::after { top: 5px; }

.btn-fill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 40px;
  padding: 0 18px;
  border-radius: 12px;
  font-size: 15px;
  font-weight: 500;
  background: var(--purple);
  color: #fff;
}
.btn-fill.lg { height: 48px; padding: 0 28px; margin-top: 28px; }

.hero-inner { text-align: center; }
.kicker {
  margin-top: 56px;
  letter-spacing: 0.16em;
  font-size: 14px;
  color: var(--purple);
}

h1 {
  margin: 14px 0 0;
  font-size: 56px;
  font-weight: 600;
  line-height: 1.1;
  letter-spacing: -0.03em;
}

h2 {
  margin: 0 0 16px;
  font-size: 40px;
  font-weight: 600;
  line-height: 1.18;
  letter-spacing: -0.03em;
  text-align: left;
}

h3 {
  font-size: 18px;
  font-weight: 600;
  line-height: 1.3;
  margin-bottom: 8px;
}

.lead {
  margin: 0 0 28px;
  max-width: none;
  color: var(--body);
  font-size: 18px;
  line-height: 1.5;
  text-align: left;
}
.lead.left { margin-left: 0; margin-right: 0; }
.lead.strong { color: var(--text); font-weight: 500; }

.hero-inner .lead {
  margin: 18px auto 0;
  max-width: 720px;
  text-align: center;
}

.hero-inner .btn-fill { margin: 28px 0 40px; }

.hero-shot {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 24px;
  border: 1px solid var(--line);
  box-shadow: 0 16px 48px rgba(108, 38, 235, 0.12);
}

.hero-app {
  display: grid;
  grid-template-columns: 52px 248px minmax(0, 1fr) 248px;
  height: 640px;
  margin: 0;
  text-align: left;
  border: 1px solid var(--line);
  border-radius: 24px;
  overflow: auto;
  background: #fff;
  box-shadow: 0 16px 48px rgba(108, 38, 235, 0.12);
  font-size: 13px;
  color: var(--ink);
}
.app-rail {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  padding: 12px 0 10px;
  background: #f7f7f9;
  border-right: 1px solid #ececf0;
}
.rail-logo {
  width: 28px;
  height: 28px;
  margin-bottom: 8px;
  border-radius: 8px;
  background: var(--purple);
  color: #fff;
  font-weight: 600;
  font-size: 14px;
  display: grid;
  place-items: center;
}
.rail-ico {
  position: relative;
  width: 32px;
  height: 32px;
  border-radius: 10px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 16px;
}
.rail-ico.is-on { background-color: #e8e8ec; }
.rail-ico i {
  position: absolute;
  top: -2px;
  right: -2px;
  min-width: 14px;
  height: 14px;
  padding: 0 3px;
  border-radius: 999px;
  background: var(--purple);
  color: #fff;
  font-size: 8px;
  font-style: normal;
  font-weight: 600;
  display: grid;
  place-items: center;
}
.rail-ico.mail { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none'%3E%3Crect x='2' y='4' width='12' height='8.5' rx='1.6' stroke='%236b6b73' stroke-width='1.3'/%3E%3Cpath d='M3 5.2 8 8.4 13 5.2' stroke='%236b6b73' stroke-width='1.3' stroke-linecap='round'/%3E%3C/svg%3E"); }
.rail-ico.key { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none'%3E%3Ccircle cx='6' cy='8' r='2.6' stroke='%236b6b73' stroke-width='1.3'/%3E%3Cpath d='M8.3 8h5.2v2.2M11.2 8v1.6' stroke='%236b6b73' stroke-width='1.3' stroke-linecap='round'/%3E%3C/svg%3E"); }
.rail-ico.chat { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none'%3E%3Cpath d='M3.2 4.2A1.6 1.6 0 0 1 4.8 2.6h6.4A1.6 1.6 0 0 1 12.8 4.2v5.2A1.6 1.6 0 0 1 11.2 11H7.4L4 13.2V11H4.8A1.6 1.6 0 0 1 3.2 9.4V4.2Z' stroke='%236b6b73' stroke-width='1.3'/%3E%3C/svg%3E"); }
.rail-ico.book { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none'%3E%3Cpath d='M3.2 3.2A1.4 1.4 0 0 1 4.6 1.8h8.2v11.6H4.8A1.6 1.6 0 0 0 3.2 15V3.2Z' stroke='%236b6b73' stroke-width='1.3'/%3E%3Cpath d='M3.2 12.2h8.6' stroke='%236b6b73' stroke-width='1.3'/%3E%3C/svg%3E"); }
.rail-ico.home { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none'%3E%3Cpath d='M3 7.2 8 3.2l5 4V13a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1V7.2Z' stroke='%236b6b73' stroke-width='1.3' stroke-linejoin='round'/%3E%3C/svg%3E"); }
.rail-ico.edu { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none'%3E%3Cpath d='M2.4 6.6 8 4l5.6 2.6L8 9.2 2.4 6.6Z' stroke='%236b6b73' stroke-width='1.3' stroke-linejoin='round'/%3E%3Cpath d='M4.4 8v2.6c0 .7 1.5 1.6 3.6 1.6s3.6-.9 3.6-1.6V8' stroke='%236b6b73' stroke-width='1.3'/%3E%3C/svg%3E"); }
.rail-ico.chart { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none'%3E%3Cpath d='M3 12.5V8.2M7 12.5V4.5M11 12.5V6.8M13.5 12.5h-12' stroke='%236b6b73' stroke-width='1.4' stroke-linecap='round'/%3E%3C/svg%3E"); }
.rail-ico.copy { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none'%3E%3Crect x='5' y='4' width='8' height='9' rx='1.4' stroke='%236b6b73' stroke-width='1.3'/%3E%3Cpath d='M3.5 11.5V3.8A1.3 1.3 0 0 1 4.8 2.5h6.2' stroke='%236b6b73' stroke-width='1.3'/%3E%3C/svg%3E"); }
.rail-ico.gear { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none'%3E%3Ccircle cx='8' cy='8' r='2' stroke='%236b6b73' stroke-width='1.3'/%3E%3Cpath d='M8 2.6v1.4M8 12v1.4M2.6 8h1.4M12 8h1.4M4.1 4.1l1 1M10.9 10.9l1 1M11.9 4.1l-1 1M5.1 10.9l-1 1' stroke='%236b6b73' stroke-width='1.3' stroke-linecap='round'/%3E%3C/svg%3E"); }
.rail-spacer { flex: 1; }
.rail-user {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  border: 1px solid #d8d8de;
  display: grid;
  place-items: center;
  font-size: 11px;
  color: var(--body);
}

.hero-app .kb-nav {
  padding: 12px 10px 8px;
  overflow: auto;
}
.hero-app .kb-search { height: 36px; margin-bottom: 8px; }
.hero-app .kb-filters { margin-bottom: 8px; }
.hero-app .kb-filters span { height: 30px; font-size: 12px; padding: 0 10px; }
.hero-app .kb-space { height: 40px; margin-bottom: 8px; font-size: 13px; }
.hero-app .kb-gloss { height: 32px; margin-bottom: 2px; }
.hero-app .kb-row {
  height: 28px;
  font-size: 12.5px;
  padding: 0 8px 0 4px;
  gap: 6px;
  border-radius: 8px;
}
.hero-app .kb-item.nest { padding-left: 16px; }
.kb-caret {
  width: 8px;
  height: 8px;
  margin-left: auto;
  flex: none;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8' fill='none'%3E%3Cpath d='M1.5 2.6 4 5.4 6.5 2.6' stroke='%239a9aa3' stroke-width='1.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
}

.app-main {
  display: flex;
  flex-direction: column;
  min-width: 0;
  border-right: 1px solid var(--line);
  background: #fff;
}
.app-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  height: 44px;
  padding: 0 18px;
  border-bottom: 1px solid #f0f0f3;
  color: var(--mute);
  font-size: 12px;
}
.app-crumb {
  min-width: 0;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.app-crumb span { margin: 0 4px; color: var(--mute); }
.app-meta {
  display: flex;
  align-items: center;
  gap: 10px;
  flex: none;
  color: var(--body);
}
.app-meta b {
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: #ececee;
  color: var(--body);
  font-size: 10px;
  font-weight: 600;
  display: grid;
  place-items: center;
}
.app-today {
  width: 14px;
  height: 14px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none'%3E%3Crect x='2' y='3' width='10' height='9' rx='1.4' stroke='%239a9aa3' stroke-width='1.2'/%3E%3Cpath d='M2 6h10M5 2v2M9 2v2' stroke='%239a9aa3' stroke-width='1.2' stroke-linecap='round'/%3E%3C/svg%3E") center / contain no-repeat;
}
.app-ico {
  width: 14px;
  height: 14px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}
.app-ico.star { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none'%3E%3Cpath d='M7 2.2 8.4 5l3.1.4-2.3 2.2.6 3.1L7 9.2 4.2 10.7l.6-3.1L2.5 5.4 5.6 5 7 2.2Z' stroke='%239a9aa3' stroke-width='1.2'/%3E%3C/svg%3E"); }
.app-ico.share { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none'%3E%3Ccircle cx='10.2' cy='3.4' r='1.6' stroke='%239a9aa3' stroke-width='1.2'/%3E%3Ccircle cx='3.8' cy='7' r='1.6' stroke='%239a9aa3' stroke-width='1.2'/%3E%3Ccircle cx='10.2' cy='10.6' r='1.6' stroke='%239a9aa3' stroke-width='1.2'/%3E%3Cpath d='M5.2 6.3 8.8 4.2M5.2 7.7l3.6 2.1' stroke='%239a9aa3' stroke-width='1.2'/%3E%3C/svg%3E"); }
.app-ico.pen { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none'%3E%3Cpath d='M8.4 3.2 10.8 5.6 5 11.4H2.6V9Z' stroke='%239a9aa3' stroke-width='1.2' stroke-linejoin='round'/%3E%3C/svg%3E"); }

.app-article {
  padding: 18px 28px 24px;
  overflow: auto;
}
.app-article h3 {
  font-size: 28px;
  letter-spacing: -0.03em;
  margin: 4px 0 12px;
  color: var(--text);
}
.kb-tags.mint span {
  background: #fff;
  color: #2ec8c0;
  border: 1px solid #b7ece8;
}
.hero-app .kb-toc {
  display: flex;
  align-items: center;
  height: 36px;
  margin: 4px 0 18px;
  padding: 0 12px;
  border: 1px solid #ececf0;
  background: #fff;
  color: var(--body);
}
.hero-app .kb-toc::after {
  content: "";
  margin-left: auto;
  width: 8px;
  height: 8px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8' fill='none'%3E%3Cpath d='M2.4 1.5 5.2 4 2.4 6.5' stroke='%239a9aa3' stroke-width='1.2' stroke-linecap='round'/%3E%3C/svg%3E") center / contain no-repeat;
}
.hero-app .kb-toc em {
  margin-left: 8px;
  font-style: normal;
  color: var(--mute);
}
.app-article h4 {
  font-size: 16px;
  font-weight: 600;
  color: var(--text);
  margin: 16px 0 8px;
}
.app-article h5 {
  font-size: 14px;
  font-weight: 600;
  color: var(--text);
  margin: 0 0 8px;
}
.app-article p {
  font-size: 13.5px;
  line-height: 1.55;
  color: var(--ink);
  margin-bottom: 12px;
}
.app-article ul {
  list-style: none;
  padding: 0;
  margin: 0 0 8px;
  display: grid;
  gap: 8px;
}
.app-article li {
  position: relative;
  padding-left: 18px;
  font-size: 13.5px;
  line-height: 1.45;
  color: var(--ink);
}
.app-article li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 6px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--purple);
}

.app-ai {
  display: flex;
  flex-direction: column;
  min-width: 0;
  background: #fff;
}
.app-ai-h {
  display: flex;
  align-items: center;
  height: 44px;
  padding: 0 14px;
  border-bottom: 1px solid #f0f0f3;
  font-size: 14px;
  font-weight: 600;
  color: var(--text);
}
.app-ai-h span {
  margin-left: auto;
  width: 16px;
  height: 16px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none'%3E%3Cpath d='M8 3v10M3 8h10' stroke='%236b6b73' stroke-width='1.4' stroke-linecap='round'/%3E%3C/svg%3E") center / contain no-repeat;
}
.app-ai-body {
  flex: 1;
  padding: 12px 16px 8px;
  overflow: hidden;
}
.app-ai-body p {
  font-size: 12.5px;
  line-height: 1.45;
  color: var(--ink);
  margin-bottom: 10px;
}
.app-ai-foot {
  padding: 8px 12px 12px;
  border-top: 1px solid #f0f0f3;
}
.app-ai-chip {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 8px;
  padding: 8px 10px;
  border: 1px solid #ececf0;
  border-radius: 12px;
  background: #fafafa;
  font-size: 12px;
  color: var(--ink);
}
.app-ai-chip i {
  width: 22px;
  height: 22px;
  margin-left: auto;
  border-radius: 6px;
  background: var(--purple-pale) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none'%3E%3Crect x='2' y='1.5' width='8' height='9' rx='1.2' stroke='%236c26eb' stroke-width='1.2'/%3E%3C/svg%3E") 50% 50% no-repeat;
}
.app-ai-chip i.spark {
  margin-left: 0;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none'%3E%3Cpath d='M6 1.5 6.8 5.2 10.5 6 6.8 6.8 6 10.5 5.2 6.8 1.5 6l3.7-.8L6 1.5Z' stroke='%236c26eb' stroke-width='1.1'/%3E%3C/svg%3E");
}
.app-ai-ask {
  height: 36px;
  margin-bottom: 8px;
  padding: 0 10px;
  color: var(--mute);
  font-size: 12.5px;
  display: flex;
  align-items: center;
}
.app-ai-tools {
  display: flex;
  align-items: center;
  gap: 6px;
}
.app-ai-tools span {
  height: 26px;
  padding: 0 8px 0 10px;
  border-radius: 8px;
  border: 1px solid #ececf0;
  color: var(--body);
  font-size: 12px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.app-ai-tools span::after {
  content: "";
  width: 7px;
  height: 7px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='7' height='7' fill='none'%3E%3Cpath d='M1 2.2 3.5 4.8 6 2.2' stroke='%239a9aa3' stroke-width='1.1' stroke-linecap='round'/%3E%3C/svg%3E") center / contain no-repeat;
}
.app-ai-tools em,
.app-ai-tools b {
  font-style: normal;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  margin-left: auto;
  background: #f3f3f6 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none'%3E%3Cpath d='M8.2 3.2 10.6 5.6 5 11.2H2.6V8.8Z' stroke='%236b6b73' stroke-width='1.2'/%3E%3C/svg%3E") 50% 50% no-repeat;
}
.app-ai-tools b {
  margin-left: 0;
  background: var(--purple) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none'%3E%3Cpath d='M3 7.2 11 3.6 8.2 12 7 8Z' stroke='%23fff' stroke-width='1.3' stroke-linejoin='round'/%3E%3C/svg%3E") 50% 50% no-repeat;
}

.card {
  border: 1px solid var(--line);
  border-radius: 24px;
  padding: 24px;
  background: #fff;
}
.card p { color: var(--body); font-size: 14px; line-height: 1.45; }

.ico {
  width: 40px;
  height: 40px;
  border-radius: 12px;
  background: var(--purple-pale);
  color: var(--purple);
  display: grid;
  place-items: center;
  font-weight: 600;
  font-size: 14px;
  margin-bottom: 16px;
}

.num { font-size: 13px; color: var(--mute); margin-bottom: 8px; }

.cards-5 {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 16px;
}
.cards-5 .card:nth-child(4),
.cards-5 .card:nth-child(5) { grid-column: span 1; }
.cards-5 { grid-template-columns: repeat(6, 1fr); }
.cards-5 .card { grid-column: span 2; }
.cards-5 .card:nth-child(4),
.cards-5 .card:nth-child(5) { grid-column: span 3; }

.g3, .g4, .g2 {
  display: grid;
  gap: 16px;
}
.g3 { grid-template-columns: 1fr 1fr 1fr; }
.g4 { grid-template-columns: 1fr 1fr 1fr 1fr; margin: 28px 0 32px; }
.g3.tight { margin: 28px 0; }

.feats {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px 24px;
  margin: 28px 0 32px;
  list-style: none;
}
.feats li {
  padding: 12px 16px;
  border: 1px solid var(--line);
  border-radius: 999px;
  font-size: 14px;
  color: var(--body);
}

.steps-4 {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  gap: 16px;
}
.steps-4 article {
  display: flex;
  flex-direction: column;
  border: 1px solid var(--line);
  border-radius: 24px;
  padding: 22px;
}
.steps-4 p { color: var(--body); font-size: 14px; line-height: 1.45; margin: 8px 0 0; }
.step-art {
  margin: 2px 0 10px;
  height: 76px;
  display: grid;
  place-items: center;
}
.step-art svg {
  width: 108px;
  height: 76px;
}

.split {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 48px;
  align-items: start;
}

.merge {
  margin-top: 40px;
  display: grid;
  grid-template-columns: 1fr 48px 1fr;
  gap: 20px;
  align-items: stretch;
}
.merge-src,
.merge-core {
  border: 1px solid var(--line);
  border-radius: 24px;
  background: #fff;
  box-shadow: 0 16px 48px rgba(108, 38, 235, 0.08);
  padding: 16px 16px 14px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.merge-kicker {
  margin: 0;
  min-height: 38px;
  display: flex;
  align-items: center;
  font-size: 13px;
  font-weight: 500;
  color: var(--mute);
}
.merge-list {
  display: grid;
  gap: 8px;
  flex: 1;
}
.merge-item {
  position: relative;
  border-radius: 14px;
  border: 1.5px solid var(--line);
  padding: 10px 14px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 2px;
  min-height: 64px;
}
.merge-item b {
  font-size: 14px;
  font-weight: 600;
  letter-spacing: -0.02em;
}
.merge-item span {
  font-size: 12px;
  font-weight: 400;
  line-height: 1.35;
  color: inherit;
  opacity: 0.82;
}
.merge-core .merge-item {
  background: #f6f6f8;
  border-color: transparent;
  color: var(--ink);
  padding-left: 16px;
}
.merge-core .merge-item span { color: var(--mute); opacity: 1; }
.merge-core .merge-item.is-on {
  background: var(--purple-pale);
  color: var(--purple);
}
.merge-core .merge-item.is-on span { color: var(--purple); opacity: 0.78; }
.merge-core .merge-item.is-on::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 3px;
  border-radius: 3px 0 0 3px;
  background: var(--purple);
}
.merge-arrow {
  align-self: center;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: var(--purple-pale);
  color: var(--purple);
  display: grid;
  place-items: center;
}
.merge-arrow svg { width: 22px; height: 22px; }
.merge-core-bar {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 38px;
}
.merge-dot {
  width: 28px;
  height: 28px;
  border-radius: 9px;
  background: var(--purple);
  flex-shrink: 0;
}
.merge-core-bar b {
  display: block;
  font-size: 15px;
  font-weight: 600;
  color: var(--ink);
  letter-spacing: -0.02em;
}
.merge-core-bar span {
  display: block;
  margin-top: 1px;
  font-size: 12px;
  color: var(--mute);
}
.t-blue { background: #eef6ff; border-color: #a8d4ff; color: #2b6cb0; }
.t-pink { background: #fdeef6; border-color: #f5b5d4; color: #c43d86; }
.t-mint { background: #e7fbf6; border-color: #9be8dc; color: #178a7c; }
.t-yellow { background: #fff6e0; border-color: #f3d48a; color: #b07a10; }
.t-lilac { background: #f3edff; border-color: #cbb6f7; color: var(--purple); }

.ui {
  background: #f6f6f8;
  border: 1px solid var(--line);
  border-radius: 24px;
  overflow: auto;
  display: grid;
  text-align: left;
}
.ui-hero {
  grid-template-columns: 220px 1fr 220px;
  min-height: 420px;
  margin-top: 8px;
}
.ui-wide { grid-template-columns: 240px 1fr; min-height: 380px; }
.ui-compact { min-height: 220px; padding: 16px; display: block; }
.ui-editor { min-height: 360px; padding: 16px; display: block; }

.ui-side, .ui-ai { padding: 16px; border-right: 1px solid var(--line); background: #fff; }
.ui-ai { border-right: 0; border-left: 1px solid var(--line); }
.ui-main { padding: 16px; }
.ui-search {
  height: 36px;
  border-radius: 10px;
  background: var(--fill);
  color: var(--mute);
  font-size: 13px;
  display: flex;
  align-items: center;
  padding: 0 12px;
  margin-bottom: 12px;
}
.ui-nav {
  height: 34px;
  border-radius: 10px;
  display: flex;
  align-items: center;
  padding: 0 10px;
  font-size: 13px;
  color: var(--body);
}
.ui-nav.on { background: var(--purple-pale); color: var(--purple); }

.kb-wrap {
  display: grid;
  grid-template-columns: 300px minmax(0, 1fr);
  gap: 24px;
  margin-top: 28px;
  align-items: start;
}
.kb-feats {
  padding: 0;
  background: none;
}
.kb-feat {
  position: relative;
  margin-bottom: 8px;
  border-radius: 16px;
  background: #fff;
  border: 1px solid var(--line);
  overflow: hidden;
}
.kb-feat summary {
  list-style: none;
  display: flex;
  align-items: center;
  min-height: 44px;
  padding: 8px 36px 8px 16px;
  cursor: pointer;
  font-size: 14px;
  font-weight: 500;
  color: var(--text);
}
.kb-feat summary::-webkit-details-marker { display: none; }
.kb-feat summary::after {
  content: "";
  position: absolute;
  right: 14px;
  top: 18px;
  width: 8px;
  height: 8px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8' fill='none'%3E%3Cpath d='M1.4 2.4 4 5.2 6.6 2.4' stroke='%239a9aa3' stroke-width='1.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
}
.kb-feat[open] {
  background: var(--purple-pale);
  border-color: var(--purple-line);
}
.kb-feat[open]::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 3px;
  border-radius: 16px 0 0 16px;
  background: var(--purple);
}
.kb-feat[open] summary::after { transform: rotate(180deg); }
.kb-feat p {
  padding: 0 16px 14px;
  font-size: 13px;
  line-height: 1.45;
  color: var(--body);
}

.kb-screen {
  min-height: 560px;
  border: 1px solid var(--line);
  border-radius: 24px;
  overflow: auto;
  background: #fff;
  box-shadow: 0 16px 48px rgba(108, 38, 235, 0.12);
}
.kb-view {
  display: none;
  grid-template-columns: 280px 1fr;
  min-height: 560px;
}
.kb-view.is-on { display: grid; }
.kb-view[data-view="ai"] {
  grid-template-columns: minmax(0, 1fr) 268px;
}
.kb-view[data-view="ai"] .app-ai {
  border-left: 1px solid var(--line);
  min-height: 560px;
}
.kb-view[data-view="ai"] .app-ai-body {
  border-left: 3px solid #cbb6f7;
  margin: 10px 12px 0 16px;
  padding: 4px 8px 8px 12px;
}
.kb-view[data-view="versions"] {
  grid-template-columns: 1fr;
}
.kb-view[data-view="versions"] .ed-log {
  min-height: 560px;
}
.ed-log-cards-6 {
  grid-template-columns: repeat(6, 1fr);
}
.ed-log-cards em {
  display: block;
  margin-top: 4px;
  font-style: normal;
  font-size: 10px;
  color: var(--mute);
}
.kb-view[data-view="stats"] { grid-template-columns: 1fr; }
.st-main {
  padding: 20px 24px 22px;
  text-align: left;
  min-height: 560px;
}
.st-h {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 16px;
}
.st-h b {
  font-size: 18px;
  font-weight: 600;
}
.st-periods {
  display: flex;
  gap: 6px;
}
.st-periods button {
  height: 32px;
  padding: 0 12px;
  border: 1px solid #e4e4e8;
  border-radius: 10px;
  background: #fff;
  font: inherit;
  font-size: 13px;
  color: var(--body);
  cursor: pointer;
}
.st-periods .is-on {
  background: var(--purple);
  border-color: var(--purple);
  color: #fff;
  font-weight: 500;
}
.st-main h4 {
  font-size: 15px;
  font-weight: 600;
  margin-bottom: 12px;
}
.st-lab {
  margin: 14px 0 8px;
  font-size: 13px;
  color: var(--mute);
}
.st-cards {
  display: grid;
  gap: 10px;
}
.st-3 { grid-template-columns: 1fr 1fr 1fr; }
.st-2 { grid-template-columns: 1fr 1fr; }
.st-cards div {
  padding: 12px 14px 14px;
  border: 1px solid var(--line);
  border-radius: 12px;
  font-size: 13px;
  color: var(--body);
}
.st-cards strong {
  display: block;
  margin-top: 6px;
  font-size: 26px;
  font-weight: 600;
  color: var(--text);
  line-height: 1;
}
.st-table { margin-bottom: 4px; }
.st-th, .st-tr {
  display: grid;
  grid-template-columns: 36px 1fr 72px;
  gap: 8px;
  align-items: center;
  min-height: 36px;
  font-size: 13px;
  border-bottom: 1px solid #f0f0f3;
}
.st-th {
  color: var(--mute);
  font-size: 12px;
}
.st-tr span:last-child, .st-th span:last-child { text-align: right; }
.kb-search.is-on {
  border-color: #cbb6f7;
  box-shadow: 0 0 0 3px rgba(108, 38, 235, 0.12);
}

#editor .kb-wrap {
  grid-template-columns: 1fr 1fr;
  align-items: stretch;
  gap: 16px;
}
#editor .ed-screen { order: -1; }
#editor .kb-feats {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: repeat(3, 1fr);
  gap: 6px 8px;
  align-content: stretch;
}
#editor .kb-feat {
  margin-bottom: 0;
  border-radius: 12px;
  display: flex;
  flex-direction: column;
  min-height: 0;
}
#editor .kb-feat[open]::before { border-radius: 12px 0 0 12px; }
#editor .kb-feat summary {
  min-height: 34px;
  font-size: 13px;
  padding: 6px 28px 6px 12px;
}
#editor .kb-feat summary::after { top: 13px; right: 10px; }
#editor .kb-feat p {
  padding: 0 12px 8px;
  font-size: 12px;
  line-height: 1.35;
}
.ed-screen {
  min-height: 0;
  height: 100%;
  display: flex;
  flex-direction: column;
  border: 1px solid var(--line);
  border-radius: 20px;
  overflow: auto;
  background: #fff;
  box-shadow: 0 10px 32px rgba(108, 38, 235, 0.1);
  text-align: left;
}
.ed-view { display: none; flex: 1; min-height: 0; }
.ed-view.is-on { display: flex; flex-direction: column; flex: 1; }
.ed-bar {
  display: flex;
  align-items: center;
  gap: 2px;
  height: 38px;
  width: max-content;
  max-width: calc(100% - 20px);
  margin: 10px auto 0;
  padding: 0 8px;
  border: 1px solid #ececf0;
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 6px 16px rgba(17, 17, 17, 0.08);
  flex: none;
  overflow-x: auto;
}
.ed-para {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 28px;
  padding: 0 8px 0 6px;
  margin-right: 4px;
  font-size: 13px;
  color: var(--ink);
  white-space: nowrap;
}
.ed-para::after {
  content: "";
  width: 8px;
  height: 8px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8' fill='none'%3E%3Cpath d='M1.4 2.6 4 5.4 6.6 2.6' stroke='%236b6b73' stroke-width='1.2' stroke-linecap='round'/%3E%3C/svg%3E") center / contain no-repeat;
}
.ed-t.u { text-decoration: underline; font-weight: 500; }
.ed-t.s { text-decoration: line-through; font-weight: 500; }
.ed-t.a { text-decoration: underline; font-weight: 600; }
.ed-ico.al { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none'%3E%3Cpath d='M3 4h8M3 7h6M3 10h8' stroke='%236b6b73' stroke-width='1.4' stroke-linecap='round'/%3E%3C/svg%3E"); }
.ed-ico.al.on { background-color: var(--purple); background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none'%3E%3Cpath d='M3 4h8M3 7h6M3 10h8' stroke='%23fff' stroke-width='1.4' stroke-linecap='round'/%3E%3C/svg%3E"); }
.ed-ico.ac { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none'%3E%3Cpath d='M3 4h8M4.5 7h5M3 10h8' stroke='%236b6b73' stroke-width='1.4' stroke-linecap='round'/%3E%3C/svg%3E"); }
.ed-ico.ar { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none'%3E%3Cpath d='M3 4h8M5 7h6M3 10h8' stroke='%236b6b73' stroke-width='1.4' stroke-linecap='round'/%3E%3C/svg%3E"); }
.ed-ico.aj { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none'%3E%3Cpath d='M3 4h8M3 7h8M3 10h8' stroke='%236b6b73' stroke-width='1.4' stroke-linecap='round'/%3E%3C/svg%3E"); }
.ed-mark {
  background: #ececee;
  color: var(--text);
  padding: 1px 2px;
  border-radius: 2px;
}
.ed-bar i {
  width: 1px;
  height: 16px;
  margin: 0 6px;
  background: #ececf0;
}
.ed-bar em {
  margin-left: auto;
  font-style: normal;
  font-size: 12px;
  color: var(--purple);
  font-weight: 500;
}
.ed-t {
  min-width: 26px;
  height: 26px;
  padding: 0 6px;
  border-radius: 8px;
  display: grid;
  place-items: center;
  font-size: 12px;
  font-weight: 600;
  color: var(--body);
}
.ed-t.on, .ed-ico.on {
  background: var(--purple);
  color: #fff;
}
.ed-ico {
  width: 26px;
  height: 26px;
  border-radius: 8px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 14px;
}
.ed-ico.list { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none'%3E%3Cpath d='M4 3.5h8M4 7h8M4 10.5h6' stroke='%236b6b73' stroke-width='1.3' stroke-linecap='round'/%3E%3Ccircle cx='2' cy='3.5' r='.8' fill='%236b6b73'/%3E%3Ccircle cx='2' cy='7' r='.8' fill='%236b6b73'/%3E%3Ccircle cx='2' cy='10.5' r='.8' fill='%236b6b73'/%3E%3C/svg%3E"); }
.ed-ico.nlist { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none'%3E%3Cpath d='M6 3.5h6.5M6 7h6.5M6 10.5h5' stroke='%236b6b73' stroke-width='1.3' stroke-linecap='round'/%3E%3Cpath d='M2.2 2.6h1.2V5M2 5h1.8M2.2 8.4h1.5M2.2 10.8h1.6v-1.2' stroke='%236b6b73' stroke-width='1.15' stroke-linecap='round'/%3E%3C/svg%3E"); }
.ed-ico.imgplus {
  background-color: var(--purple);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none'%3E%3Crect x='1.8' y='3.2' width='8.4' height='6.6' rx='1.2' stroke='%23fff' stroke-width='1.2'/%3E%3Cpath d='M11.2 8.2v3.4M9.5 9.9h3.4' stroke='%23fff' stroke-width='1.3' stroke-linecap='round'/%3E%3C/svg%3E");
}
.ed-ico.quote { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none'%3E%3Cpath d='M3 8.5c0-2.4 1.4-4 3.2-4.6M8 8.5c0-2.4 1.4-4 3.2-4.6' stroke='%236b6b73' stroke-width='1.3' stroke-linecap='round'/%3E%3Cpath d='M3 8.5h2.4V12H3V8.5Zm5 0h2.4V12H8V8.5Z' stroke='%236b6b73' stroke-width='1.2'/%3E%3C/svg%3E"); }
.ed-ico.img { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none'%3E%3Crect x='2' y='3' width='10' height='8' rx='1.4' stroke='%236b6b73' stroke-width='1.3'/%3E%3Ccircle cx='5.2' cy='6' r='1' stroke='%236b6b73' stroke-width='1.1'/%3E%3Cpath d='M4 10 6.2 7.6 8 9.2l1.4-1.5L12 10' stroke='%236b6b73' stroke-width='1.2' stroke-linejoin='round'/%3E%3C/svg%3E"); }
.ed-ico.img.on { background-color: var(--purple); background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none'%3E%3Crect x='2' y='3' width='10' height='8' rx='1.4' stroke='%23fff' stroke-width='1.3'/%3E%3Ccircle cx='5.2' cy='6' r='1' stroke='%23fff' stroke-width='1.1'/%3E%3Cpath d='M4 10 6.2 7.6 8 9.2l1.4-1.5L12 10' stroke='%23fff' stroke-width='1.2' stroke-linejoin='round'/%3E%3C/svg%3E"); }
.ed-ico.trash { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none'%3E%3Cpath d='M4 5h6M5 5V4h4v1M5.3 6.2l.3 5h3l.3-5' stroke='%236b6b73' stroke-width='1.2' stroke-linecap='round'/%3E%3C/svg%3E"); }
.ed-ico.down { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none'%3E%3Cpath d='M7 3v6.5M4.5 7.2 7 9.8l2.5-2.6M3.2 11.4h7.6' stroke='%236b6b73' stroke-width='1.3' stroke-linecap='round'/%3E%3C/svg%3E"); }
.ed-ico.warn { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none'%3E%3Cpath d='M7 2.6 12.2 12H1.8L7 2.6Z' stroke='%236b6b73' stroke-width='1.3' stroke-linejoin='round'/%3E%3Cpath d='M7 6.2v3M7 10.6h.01' stroke='%236b6b73' stroke-width='1.3' stroke-linecap='round'/%3E%3C/svg%3E"); }
.ed-ico.align { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none'%3E%3Cpath d='M3 4h8M3 7h8M3 10h5' stroke='%236b6b73' stroke-width='1.3' stroke-linecap='round'/%3E%3C/svg%3E"); }
.ed-ico.align.on { background-color: var(--purple); background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none'%3E%3Cpath d='M3 4h8M3 7h8M3 10h5' stroke='%23fff' stroke-width='1.3' stroke-linecap='round'/%3E%3C/svg%3E"); }
.ed-ico.link { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none'%3E%3Cpath d='M6 8.2 5.2 9A2.2 2.2 0 1 1 2.1 5.9L4 4' stroke='%236b6b73' stroke-width='1.3' stroke-linecap='round'/%3E%3Cpath d='M8 5.8 8.8 5A2.2 2.2 0 1 1 11.9 8.1L10 10' stroke='%236b6b73' stroke-width='1.3' stroke-linecap='round'/%3E%3C/svg%3E"); }
.ed-ico.link.on, .ed-ico.grid.on { background-color: var(--purple-pale); }
.ed-ico.grid { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none'%3E%3Cpath d='M3 3.5h8v8H3v-8Z' stroke='%236b6b73' stroke-width='1.3'/%3E%3Cpath d='M3 6.2h8M3 8.8h8M6.2 3.5v8M8.8 3.5v8' stroke='%236b6b73' stroke-width='1.2'/%3E%3C/svg%3E"); }
.ed-doc {
  padding: 14px 18px 16px;
  overflow: auto;
}
.ed-doc h3 {
  font-size: 16px;
  margin-bottom: 8px;
  color: var(--text);
}
.ed-doc h4 {
  font-size: 13px;
  margin: 8px 0 4px;
}
.ed-doc p, .ed-doc li {
  font-size: 13px;
  line-height: 1.4;
  color: var(--ink);
}
.ed-doc p { margin-bottom: 8px; }
.ed-doc ul { padding-left: 18px; display: grid; gap: 4px; margin-bottom: 10px; }
.ed-doc a { color: var(--purple); text-decoration: underline; }
.ed-caret span {
  display: inline-block;
  width: 1.5px;
  height: 14px;
  margin-left: 2px;
  background: var(--purple);
  vertical-align: -2px;
  animation: edBlink 1s steps(2) infinite;
}
@keyframes edBlink { 50% { opacity: 0; } }
.ed-img-doc { position: relative; padding: 14px 14px 14px; }
.ed-add {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 2px;
  margin-bottom: 14px;
  padding: 2px 0 8px 28px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' fill='none'%3E%3Crect x='2' y='4' width='14' height='11' rx='2' stroke='%236b6b73' stroke-width='1.3'/%3E%3Ccircle cx='6.5' cy='8' r='1.2' stroke='%236b6b73'/%3E%3Cpath d='M4 13.5 7 10l2.2 2 2-2.2 4.3 3.7' stroke='%236b6b73' stroke-width='1.2'/%3E%3C/svg%3E") 0 4px no-repeat;
}
.ed-add b { font-size: 14px; font-weight: 500; color: var(--text); }
.ed-add span { font-size: 13px; color: var(--mute); font-style: italic; }
.ed-pop {
  position: absolute;
  left: 148px;
  top: 18px;
  width: 240px;
  padding: 10px 12px 12px;
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 10px 32px rgba(17, 17, 17, 0.16);
  border: 1px solid #ececf0;
  z-index: 2;
}
.ed-pop-tabs {
  display: flex;
  gap: 16px;
  margin-bottom: 10px;
  padding-bottom: 8px;
  border-bottom: 1px solid #ececf0;
  font-size: 13px;
  color: var(--body);
}
.ed-pop-tabs .is-on {
  color: var(--text);
  font-weight: 500;
  box-shadow: inset 0 -2px 0 #111;
  padding-bottom: 8px;
  margin-bottom: -9px;
}
.ed-pop-btn {
  height: 34px;
  border: 1px solid #e4e4e8;
  border-radius: 8px;
  display: grid;
  place-items: center;
  font-size: 13px;
  color: var(--ink);
}
.ed-photo {
  display: block;
  width: 100%;
  max-height: 280px;
  object-fit: contain;
  object-position: top center;
  background: #f7f7f9;
  border: 2px solid #4B8CFF;
  border-radius: 8px;
}
.ed-table-wrap {
  position: relative;
  margin: 16px 12px 28px 20px;
}
.ed-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 12px;
}
.ed-table td {
  border: 1px solid #d8d8de;
  padding: 8px 10px;
  color: var(--text);
}
.ed-handle {
  position: absolute;
  width: 22px;
  height: 16px;
  border: 1px solid #d8d8de;
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 1px 4px rgba(0,0,0,.06);
  background-image: radial-gradient(circle, #c5c5cc 1.1px, transparent 1.2px);
  background-size: 5px 5px;
}
.ed-handle.left { left: -28px; top: 50%; transform: translateY(-50%); height: 22px; width: 16px; }
.ed-handle.top { top: -22px; right: 40px; }
.ed-plus {
  position: absolute;
  display: grid;
  place-items: center;
  background: #ececee;
  color: var(--mute);
  font-size: 16px;
  border-radius: 10px;
}
.ed-plus.col { right: -28px; top: 0; bottom: 0; width: 22px; }
.ed-plus.row { left: 0; right: 0; bottom: -28px; height: 22px; }
.ed-toc-mini {
  height: 30px;
  margin-bottom: 10px;
  padding: 0 10px;
  border: 1px solid #ececf0;
  border-radius: 8px;
  display: flex;
  align-items: center;
  font-size: 12px;
  color: var(--body);
}
.ed-edit-h {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 15px;
  font-weight: 600;
  margin-bottom: 10px;
}
.ed-edit-h span {
  height: 22px;
  padding: 0 8px;
  border-radius: 999px;
  background: var(--purple-pale);
  color: var(--purple);
  font-size: 11px;
  font-weight: 500;
  display: inline-flex;
  align-items: center;
}
.ed-mute { color: var(--mute); }
.ed-log {
  padding: 16px 16px 12px;
}
.ed-log-h {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 12px;
}
.ed-log-h b {
  display: block;
  font-size: 16px;
  margin-bottom: 4px;
}
.ed-log-h p {
  font-size: 12px;
  line-height: 1.35;
  color: var(--body);
  margin: 0;
}
.ed-log-h > span {
  flex: none;
  font-size: 12px;
  color: #c45c5c;
  white-space: nowrap;
}
.ed-log-cards {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 8px;
  margin-bottom: 12px;
}
.ed-log-cards div {
  padding: 8px 10px 10px;
  border: 1px solid #ececf0;
  border-radius: 12px;
  font-size: 11px;
  color: var(--body);
}
.ed-log-cards strong {
  display: block;
  margin-top: 4px;
  font-size: 22px;
  font-weight: 600;
  color: var(--text);
  line-height: 1;
}
.ed-log-cards .warn strong { color: #c45c5c; }
.ed-log-feed {
  border: 1px solid #ececf0;
  border-radius: 14px;
  padding: 10px 12px 12px;
}
.ed-log-sec {
  font-size: 13px;
  font-weight: 600;
  margin-bottom: 10px;
}
.ed-log-sec::before {
  content: "▾ ";
  color: var(--mute);
  font-weight: 400;
}
.ed-log-sec span {
  display: block;
  font-size: 11px;
  font-weight: 400;
  color: var(--mute);
  margin-top: 2px;
}
.ed-log-day {
  font-size: 10px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--mute);
  margin: 8px 0 6px;
}
.ed-log-row {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 26px;
  font-size: 12px;
  color: var(--ink);
}
.ed-log-row time {
  width: 38px;
  flex: none;
  color: var(--mute);
  font-variant-numeric: tabular-nums;
}
.ed-log-row i {
  font-style: normal;
  height: 22px;
  padding: 0 8px;
  border-radius: 999px;
  background: #f3f3f6;
  display: inline-flex;
  align-items: center;
  font-size: 11px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 46%;
}
.ed-log-row em { font-style: normal; color: var(--body); }
.kb-nav {
  padding: 14px 12px 16px;
  border-right: 1px solid var(--line);
  background: #fff;
  overflow: hidden;
}
.kb-search {
  height: 38px;
  margin-bottom: 10px;
  padding: 0 12px 0 34px;
  border-radius: 12px;
  border: 1px solid #e4e4e8;
  background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none'%3E%3Ccircle cx='7' cy='7' r='5.2' stroke='%239a9aa3' stroke-width='1.6'/%3E%3Cpath d='M11 11.5 14 14.5' stroke='%239a9aa3' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E") 12px 50% no-repeat;
  color: var(--mute);
  font-size: 13px;
  display: flex;
  align-items: center;
}
.kb-filters {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-bottom: 10px;
}
.kb-filters span {
  height: 32px;
  padding: 0 12px;
  border-radius: 10px;
  border: 1px solid #e4e4e8;
  background: #fff;
  font-size: 13px;
  color: var(--body);
  display: inline-flex;
  align-items: center;
}
.kb-filters .is-on {
  background: #fff;
  color: var(--text);
  border-color: #d8d8de;
  font-weight: 500;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
}
.kb-trash {
  width: 32px;
  height: 32px;
  padding: 0;
  margin-left: auto;
  border: 1px solid #e4e4e8;
  border-radius: 10px;
  background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none'%3E%3Cpath d='M5 5.5h6M6.2 5.5V4.6A1.1 1.1 0 0 1 7.3 3.5h1.4a1.1 1.1 0 0 1 1.1 1.1v.9M6 6.8l.3 5.2h3.4l.3-5.2' stroke='%239a9aa3' stroke-width='1.4' stroke-linecap='round'/%3E%3C/svg%3E") 50% 50% no-repeat;
}
.kb-space {
  height: 42px;
  margin-bottom: 12px;
  padding: 0 12px 0 14px;
  border: 1px solid #e4e4e8;
  border-radius: 12px;
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  font-weight: 600;
  background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='16' fill='none'%3E%3Cpath d='M6 4.5 3.2 7.2M6 4.5l2.8 2.7M6 11.5 3.2 8.8M6 11.5l2.8-2.7' stroke='%239a9aa3' stroke-width='1.4' stroke-linecap='round'/%3E%3C/svg%3E") right 12px center no-repeat;
}
.kb-space::before {
  content: "";
  width: 18px;
  height: 18px;
  border-radius: 4px;
  background: linear-gradient(135deg, #2ec8c0 0 50%, #6c26eb 50%);
  flex: none;
}
.kb-gloss {
  display: flex;
  align-items: center;
  gap: 8px;
  height: 36px;
  padding: 0 8px;
  margin-bottom: 4px;
  font-size: 13px;
  color: var(--ink);
}
.kb-gloss::before {
  content: "";
  width: 14px;
  height: 16px;
  flex: none;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='16' fill='none'%3E%3Crect x='2' y='1.5' width='10' height='13' rx='1.6' stroke='%239a9aa3' stroke-width='1.3'/%3E%3Cpath d='M5 6h4M5 9h3' stroke='%239a9aa3' stroke-width='1.2' stroke-linecap='round'/%3E%3C/svg%3E") center / contain no-repeat;
}
.kb-gloss.is-on {
  height: 40px;
  padding: 0 12px;
  border-radius: 12px;
  background: #6ee8d8;
  color: var(--text);
  font-weight: 500;
}
.kb-gloss.is-on::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='16' fill='none'%3E%3Crect x='2' y='1.5' width='10' height='13' rx='1.6' stroke='%23111' stroke-width='1.3'/%3E%3Cpath d='M5 6h4M5 9h3' stroke='%23111' stroke-width='1.2' stroke-linecap='round'/%3E%3C/svg%3E");
}
.kb-row {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  height: 34px;
  padding: 0 10px 0 6px;
  border: 0;
  border-radius: 10px;
  background: none;
  font: inherit;
  font-size: 13px;
  color: var(--ink);
  text-align: left;
  cursor: default;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.kb-folder { font-weight: 400; }
.kb-item.nest { padding-left: 18px; }
.kb-dots {
  width: 8px;
  height: 12px;
  flex: none;
  background-image: radial-gradient(circle, #c5c5cc 1.05px, transparent 1.15px);
  background-size: 4px 4px;
  background-repeat: repeat;
}
.kb-ico {
  width: 14px;
  height: 14px;
  flex: none;
  opacity: 0.55;
}
.kb-ico.folder {
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none'%3E%3Cpath d='M2 4.2A1.2 1.2 0 0 1 3.2 3h2.3l1.2 1.4H11A1.2 1.2 0 0 1 12.2 5.6v5.2A1.2 1.2 0 0 1 11 12H3.2A1.2 1.2 0 0 1 2 10.8V4.2Z' stroke='%23555' stroke-width='1.2'/%3E%3C/svg%3E") center / contain no-repeat;
}
.kb-ico.doc {
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='16' fill='none'%3E%3Crect x='2.5' y='1.5' width='9' height='13' rx='1.4' stroke='%23555' stroke-width='1.2'/%3E%3Cpath d='M5 6h4M5 8.5h3' stroke='%23555' stroke-width='1.1' stroke-linecap='round'/%3E%3C/svg%3E") center / contain no-repeat;
}
.kb-item.is-on {
  position: relative;
  background: #ececee;
  color: var(--text);
  overflow: hidden;
}
.kb-item.is-on::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 3px;
  border-radius: 10px 0 0 10px;
  background: #6c26eb;
}
.kb-add {
  margin-top: 8px;
  height: 34px;
  padding: 0 10px;
  border-radius: 10px;
  color: var(--mute);
  font-size: 13px;
  display: flex;
  align-items: center;
}
.bases-nav {
  display: flex;
  flex-direction: column;
  padding-bottom: 12px;
  min-height: 560px;
}
.bases-search {
  position: relative;
  padding-right: 36px;
}
.bases-search::after {
  content: "";
  position: absolute;
  right: 12px;
  top: 50%;
  width: 14px;
  height: 14px;
  transform: translateY(-50%);
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none'%3E%3Cpath d='M3.5 3.5 10.5 10.5M10.5 3.5 3.5 10.5' stroke='%239a9aa3' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E") center / contain no-repeat;
}
.base-gh {
  display: flex;
  align-items: center;
  gap: 8px;
  height: 40px;
  padding: 0 6px 0 4px;
  font-size: 14px;
  font-weight: 500;
  color: var(--text);
}
.base-gh em {
  margin-left: auto;
  font-style: normal;
  font-size: 13px;
  font-weight: 400;
  color: var(--mute);
}
.base-chev {
  width: 10px;
  height: 10px;
  flex: none;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' fill='none'%3E%3Cpath d='M3.2 1.8 6.6 5 3.2 8.2' stroke='%239a9aa3' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
}
.base-gh.is-open .base-chev { transform: rotate(90deg); }
.base-book {
  width: 22px;
  height: 22px;
  flex: none;
  border-radius: 50%;
  background: var(--purple) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none'%3E%3Cpath d='M3 2.2h5.4A1.4 1.4 0 0 1 9.8 3.6v6.2H4.2A1.2 1.2 0 0 0 3 11V2.2Z' stroke='%23fff' stroke-width='1.2'/%3E%3Cpath d='M3 9.6h6.8' stroke='%23fff' stroke-width='1.2'/%3E%3C/svg%3E") center / 12px no-repeat;
}
.base-row {
  display: flex;
  align-items: center;
  gap: 8px;
  height: 36px;
  margin-left: 22px;
  padding: 0 8px;
  border-radius: 10px;
  font-size: 14px;
  color: var(--ink);
}
.base-row.is-on {
  background: #ececee;
  color: var(--text);
}
.base-row .kb-ico { opacity: 0.7; }
.base-fav {
  width: 14px;
  height: 14px;
  flex: none;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none'%3E%3Cpath d='M7 12.2 5.8 11.1C3.1 8.6 1.4 7.1 1.4 5.2A2.7 2.7 0 0 1 4.2 2.4c.9 0 1.8.4 2.4 1.1A3 3 0 0 1 9 2.4a2.7 2.7 0 0 1 2.8 2.8c0 1.9-1.7 3.4-4.4 5.9L7 12.2Z' fill='%236c26eb'/%3E%3C/svg%3E") center / contain no-repeat;
}
.base-pen {
  width: 14px;
  height: 14px;
  margin-left: auto;
  flex: none;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none'%3E%3Cpath d='M8.6 3.2 10.8 5.4 5 11.2H2.8V9Z' stroke='%23c5c5cc' stroke-width='1.3' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
}
.base-add {
  margin-top: auto;
  height: 44px;
  border-radius: 12px;
  background: var(--purple);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  font-weight: 500;
}
#kb .acc-person {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 2px 10px;
  padding: 10px;
  margin-bottom: 6px;
  border-radius: 12px;
  font-size: 14px;
  font-weight: 500;
  color: var(--text);
}
#kb .acc-person span:last-child {
  width: 100%;
  padding-left: 38px;
  font-size: 12px;
  font-weight: 400;
  color: var(--mute);
}
#kb .acc-person.is-on {
  background: var(--purple-pale);
  color: var(--purple);
}
#kb .acc-person.is-on span:last-child { color: var(--purple); opacity: 0.75; }
#kb .acc-person.is-off { opacity: 0.55; }
#kb .acc-ava {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: var(--purple);
  color: #fff;
  display: grid;
  place-items: center;
  font-size: 12px;
  font-weight: 600;
  flex: none;
}
#kb .acc-person.is-off .acc-ava { background: #c5c5cc; }
.kb-add::before {
  content: "+";
  margin-right: 8px;
  font-size: 16px;
  line-height: 1;
}
.kb-article {
  padding: 22px 28px 28px;
}
.gloss-main {
  padding: 22px 28px 28px;
  text-align: left;
  min-width: 0;
}
.gloss-main > p {
  margin: 0 0 14px;
  font-size: 14px;
  line-height: 1.5;
  color: var(--body);
}
.gloss-hash {
  display: inline-flex;
  width: 18px;
  height: 18px;
  margin: 0 2px;
  border-radius: 50%;
  border: 1px solid #d8d8de;
  font-style: normal;
  font-size: 11px;
  font-weight: 600;
  align-items: center;
  justify-content: center;
  vertical-align: -3px;
  color: var(--ink);
}
.gloss-find {
  max-width: 280px;
  margin-bottom: 16px;
  background-color: #f3f3f6;
}
.gloss-list {
  border: 1px solid var(--line);
  border-radius: 16px;
  overflow: hidden;
}
.gloss-card {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 14px 16px;
  border-bottom: 1px solid var(--line);
}
.gloss-card:last-child { border-bottom: 0; }
.gloss-card b {
  display: block;
  margin-bottom: 4px;
  font-size: 15px;
  font-weight: 600;
  color: var(--text);
}
.gloss-card span {
  display: block;
  font-size: 13px;
  line-height: 1.4;
  color: var(--mute);
}
.gloss-acts {
  width: 48px;
  height: 18px;
  margin-left: auto;
  flex: none;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none'%3E%3Cpath d='M8.6 3.2 10.8 5.4 5 11.2H2.8V9Z' stroke='%239a9aa3' stroke-width='1.3' stroke-linejoin='round'/%3E%3C/svg%3E") left center / 14px no-repeat,
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none'%3E%3Cpath d='M4 4.5h6M5.2 4.5V3.6A1 1 0 0 1 6.2 2.6h1.6a1 1 0 0 1 1 1v.9M5.2 6l.25 5h3.1l.25-5' stroke='%23e07a7a' stroke-width='1.3' stroke-linecap='round'/%3E%3C/svg%3E") right center / 14px no-repeat;
}
.kb-article h3 {
  font-size: 22px;
  margin-bottom: 10px;
}
.kb-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 14px;
}
.kb-tags span {
  height: 24px;
  padding: 0 10px;
  border-radius: 999px;
  background: var(--purple-pale);
  color: var(--purple);
  font-size: 12px;
  display: inline-flex;
  align-items: center;
}
.kb-toc {
  margin-bottom: 14px;
  padding: 8px 12px;
  border-radius: 10px;
  background: #f6f6f8;
  font-size: 13px;
  color: var(--body);
}
.kb-article p {
  font-size: 14px;
  line-height: 1.5;
  color: var(--body);
  margin-bottom: 14px;
}
.kb-article h4 {
  font-size: 15px;
  margin-bottom: 8px;
}
.kb-article ul {
  padding-left: 18px;
  display: grid;
  gap: 6px;
  font-size: 14px;
  color: var(--body);
  line-height: 1.4;
}
.kb-article li::marker { color: var(--purple); }
.ui-row {
  display: flex;
  justify-content: space-between;
  margin-bottom: 12px;
  font-size: 14px;
}
.ui-row span { color: var(--mute); }
.ui-list { display: grid; gap: 8px; }
.ui-list div {
  height: 36px;
  border-radius: 10px;
  background: #fff;
  border: 1px solid var(--line);
}
.ui-ai-h { font-size: 13px; font-weight: 600; margin-bottom: 12px; }
.bubble {
  border-radius: 12px;
  padding: 10px 12px;
  font-size: 12px;
  margin-bottom: 8px;
  line-height: 1.4;
}
.bubble.in { background: var(--fill); }
.bubble.out { background: var(--purple-pale); color: var(--text); }

.ui-mini {
  height: 88px;
  border-radius: 16px;
  background: var(--fill);
  display: grid;
  place-items: center;
  overflow: hidden;
}
.ui-mini svg {
  width: 120px;
  height: 64px;
}

.toolbar {
  height: 36px;
  border-radius: 10px;
  background: var(--fill);
  color: var(--mute);
  font-size: 12px;
  display: flex;
  align-items: center;
  padding: 0 12px;
  margin-bottom: 12px;
}

.chat-ui {
  max-width: 720px;
  margin: 0 auto;
  display: grid;
  gap: 12px;
  text-align: left;
}
.msg {
  border-radius: 18px;
  padding: 16px 18px;
  font-size: 15px;
  line-height: 1.45;
}
.msg span { display: block; font-size: 12px; color: var(--mute); margin-bottom: 6px; }
.msg.user { background: var(--fill); max-width: 80%; }
.msg.bot { background: var(--purple-pale); border: 1px solid var(--purple-line); }
.src {
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid var(--purple-line);
  font-size: 13px;
  color: var(--purple);
}

.sc {
  padding: 0;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  background: #fff;
  border: 1px solid var(--line);
}
.sc-shot {
  height: 152px;
  margin: 16px 16px 0;
  padding: 12px;
  border-radius: 16px;
  background: var(--purple-pale);
  overflow: auto;
}
.sc-body {
  flex: 1;
  padding: 16px 22px 22px;
  background: #fff;
}
.sc-meta {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 8px;
}
.sc-meta span {
  height: 28px;
  padding: 0 10px;
  border-radius: 999px;
  background: var(--purple);
  color: #fff;
  font-size: 13px;
  font-weight: 500;
  display: inline-flex;
  align-items: center;
}
.sc h3 {
  margin: 0;
  font-size: 18px;
  font-weight: 600;
  color: var(--text);
}
.sc-body p {
  padding: 0;
  margin: 0;
  color: var(--body);
  font-size: 14px;
  line-height: 1.45;
}
.sc-list, .sc-course, .sc-sales, .sc-sup, .sc-reg, .sc-exp {
  height: 100%;
  padding: 10px 12px;
  border-radius: 12px;
  background: #fff;
  border: 1px solid var(--purple-line);
  box-shadow: none;
}
.sc-list b, .sc-course b, .sc-reg-h b {
  display: block;
  font-size: 12px;
  font-weight: 600;
  margin-bottom: 8px;
}
.sc-list i, .sc-course i {
  display: flex;
  align-items: center;
  gap: 8px;
  font-style: normal;
  font-size: 11px;
  color: var(--body);
  margin-bottom: 5px;
}
.sc-list i::before {
  content: "";
  width: 12px;
  height: 12px;
  border-radius: 4px;
  border: 1.5px solid var(--line);
  flex-shrink: 0;
}
.sc-list i.on { color: var(--text); }
.sc-list i.on::before {
  border-color: var(--purple);
  background: var(--purple) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8' fill='none'%3E%3Cpath d='M1.5 4.2 3.2 6 6.5 2.2' stroke='%23fff' stroke-width='1.4' stroke-linecap='round'/%3E%3C/svg%3E") 50% 50% no-repeat;
}
.sc-course span {
  display: block;
  height: 6px;
  border-radius: 99px;
  background: var(--fill);
  margin-bottom: 8px;
  overflow: hidden;
}
.sc-course span em {
  display: block;
  height: 100%;
  width: 72%;
  background: var(--purple);
  border-radius: 99px;
}
.sc-course i.muted { color: var(--mute); }
.sc-find {
  height: 26px;
  border-radius: 8px;
  background: #f6f6f8;
  color: var(--mute);
  font-size: 11px;
  display: flex;
  align-items: center;
  padding: 0 10px;
  margin-bottom: 8px;
}
.sc-pills { display: flex; gap: 6px; margin-bottom: 8px; }
.sc-pills em {
  font-style: normal;
  height: 22px;
  padding: 0 8px;
  border-radius: 999px;
  background: var(--purple-pale);
  color: var(--purple);
  font-size: 11px;
  font-weight: 500;
  display: inline-flex;
  align-items: center;
}
.sc-hint {
  height: 26px;
  border-radius: 8px;
  background: var(--purple);
  color: #fff;
  font-size: 11px;
  font-weight: 500;
  display: flex;
  align-items: center;
  padding: 0 10px;
}
.sc-sup .q, .sc-sup .a {
  margin: 0 0 6px;
  font-size: 11px;
  line-height: 1.35;
  padding: 6px 8px;
  border-radius: 8px;
}
.sc-sup .q { background: #f6f6f8; color: var(--text); }
.sc-sup .a { background: var(--purple-pale); color: var(--text); }
.sc-sup span {
  font-size: 10px;
  color: var(--purple);
  font-weight: 500;
}
.sc-reg-h {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 8px;
}
.sc-reg-h em {
  font-style: normal;
  height: 20px;
  padding: 0 8px;
  border-radius: 999px;
  background: #e8faf8;
  color: #1a9e97;
  font-size: 10px;
  font-weight: 500;
  display: inline-flex;
  align-items: center;
}
.sc-reg i {
  display: block;
  height: 6px;
  border-radius: 99px;
  background: var(--fill);
  margin-bottom: 6px;
}
.sc-reg i.short { width: 56%; }
.sc-reg span {
  font-size: 10px;
  color: var(--mute);
}
.sc-avs { display: flex; gap: 6px; margin-bottom: 8px; }
.sc-avs i {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: var(--purple-pale);
  color: var(--purple);
  font-style: normal;
  font-size: 10px;
  font-weight: 600;
  display: grid;
  place-items: center;
}
.sc-avs i:nth-child(2) { background: #e8faf8; color: #1a9e97; }
.sc-avs i:nth-child(3) { background: #eef4ff; color: #3b9dff; }
.sc-exp p {
  padding: 0;
  margin: 0 0 6px;
  font-size: 11px;
  line-height: 1.4;
  color: var(--text);
}
.sc-exp span {
  font-size: 10px;
  color: var(--purple);
  font-weight: 500;
}

.access { margin-top: 28px; display: grid; gap: 20px; }
.access-shot {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 24px;
  border: 1px solid var(--line);
  box-shadow: 0 16px 48px rgba(108, 38, 235, 0.12);
}
.acc-points {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 0;
  margin: 28px 0 16px;
  border: 1px solid var(--line);
  border-radius: 24px;
  background: #fff;
  overflow: hidden;
}
.acc-points article {
  padding: 22px 24px;
  border-right: 1px solid var(--line);
}
.acc-points article:last-child { border-right: 0; }
.acc-points h3 {
  margin-bottom: 8px;
  font-size: 18px;
}
.acc-points p {
  margin: 0;
  font-size: 14px;
  line-height: 1.45;
  color: var(--body);
}
.acc-app {
  display: block;
  width: 100%;
  max-width: 100%;
  border: 1px solid var(--line);
  border-radius: 24px;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior-x: contain;
  background: #fff;
  box-shadow: 0 16px 48px rgba(108, 38, 235, 0.12);
  text-align: left;
}
.acc-frame {
  display: grid;
  grid-template-columns: 220px minmax(680px, 1fr);
  grid-template-rows: auto 1fr;
  min-width: 920px;
}
.acc-path {
  grid-column: 1 / -1;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  padding: 12px 16px;
  border-bottom: 1px solid var(--line);
  background: var(--purple-pale);
}
.acc-path span {
  height: 32px;
  padding: 0 12px;
  border-radius: 999px;
  background: #fff;
  color: var(--purple);
  display: inline-flex;
  align-items: center;
  font-size: 13px;
  font-weight: 500;
}
.acc-path span:not(:last-child)::after {
  content: "";
  width: 12px;
  height: 12px;
  margin-left: 8px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none'%3E%3Cpath d='M4.2 2.8 8 6 4.2 9.2' stroke='%23cbb6f7' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
}
.acc-nav {
  padding: 18px 12px 20px;
  border-right: 1px solid var(--line);
  background: #fff;
}
.acc-nav-h {
  padding: 0 10px 10px;
  font-size: 13px;
  color: var(--mute);
}
.acc-nav-item {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  height: 36px;
  margin-bottom: 2px;
  padding: 0 12px;
  border: 0;
  border-radius: 12px;
  background: none;
  font: inherit;
  font-size: 14px;
  color: var(--ink);
  text-align: left;
  cursor: default;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.acc-nav-item.is-on {
  background: var(--purple-pale);
  color: var(--purple);
  font-weight: 500;
}
.acc-ico {
  width: 16px;
  height: 16px;
  flex: none;
  opacity: 0.7;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 16px;
}
.acc-nav-item.is-on .acc-ico { opacity: 1; }
.acc-ico.all { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none'%3E%3Ccircle cx='5.2' cy='5.6' r='2' stroke='%236c26eb' stroke-width='1.3'/%3E%3Ccircle cx='10.8' cy='5.6' r='2' stroke='%236c26eb' stroke-width='1.3'/%3E%3Cpath d='M2.4 12.4c.4-2 2-3 2.8-3.2M13.6 12.4c-.4-2-2-3-2.8-3.2M8 12.4c.3-2 1.6-3.2 3-3.4M8 12.4c-.3-2-1.6-3.2-3-3.4' stroke='%236c26eb' stroke-width='1.3' stroke-linecap='round'/%3E%3C/svg%3E"); }
.acc-ico.arts { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none'%3E%3Cpath d='M4 3.2h6.2L12.4 5.4V13a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1V4.2A1 1 0 0 1 4 3.2Z' stroke='%236b6b73' stroke-width='1.3'/%3E%3Cpath d='M10 3.4V6h2.4M5.4 8.5h5M5.4 11h3.6' stroke='%236b6b73' stroke-width='1.2' stroke-linecap='round'/%3E%3C/svg%3E"); }
.acc-ico.kb { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none'%3E%3Cpath d='M3.2 4.2A1.2 1.2 0 0 1 4.4 3h2.4l1.2 1.5H12A1.2 1.2 0 0 1 13.2 5.7v6.1A1.2 1.2 0 0 1 12 13H4.4A1.2 1.2 0 0 1 3.2 11.8V4.2Z' stroke='%236b6b73' stroke-width='1.3'/%3E%3C/svg%3E"); }
.acc-ico.users { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none'%3E%3Ccircle cx='8' cy='5.4' r='2.2' stroke='%236b6b73' stroke-width='1.3'/%3E%3Cpath d='M3.4 13c.5-2.4 2.4-3.6 4.6-3.6s4.1 1.2 4.6 3.6' stroke='%236b6b73' stroke-width='1.3' stroke-linecap='round'/%3E%3C/svg%3E"); }
.acc-ico.roles { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none'%3E%3Ccircle cx='6.4' cy='6' r='2.1' stroke='%236b6b73' stroke-width='1.3'/%3E%3Cpath d='M2.6 13c.4-2.1 2-3.2 3.8-3.2M11.2 7.2h3M12.7 5.7v3M9.6 12.2h4.2' stroke='%236b6b73' stroke-width='1.3' stroke-linecap='round'/%3E%3C/svg%3E"); }
.acc-ico.set { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none'%3E%3Ccircle cx='8' cy='8' r='2' stroke='%236b6b73' stroke-width='1.3'/%3E%3Cpath d='M8 2.6v1.4M8 12v1.4M2.6 8h1.4M12 8h1.4M4.1 4.1l1 1M10.9 10.9l1 1M11.9 4.1l-1 1M5.1 10.9l-1 1' stroke='%236b6b73' stroke-width='1.3' stroke-linecap='round'/%3E%3C/svg%3E"); }
.acc-ico.crm { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none'%3E%3Crect x='2.6' y='3.2' width='10.8' height='9.6' rx='1.6' stroke='%236b6b73' stroke-width='1.3'/%3E%3Cpath d='M5 8.2h6M5 10.6h4' stroke='%236b6b73' stroke-width='1.2' stroke-linecap='round'/%3E%3C/svg%3E"); }
.acc-ico.ai { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none'%3E%3Crect x='4.2' y='5.2' width='7.6' height='7.2' rx='2' stroke='%236b6b73' stroke-width='1.3'/%3E%3Cpath d='M8 5.2V3.6M6.2 12.4v1.2M9.8 12.4v1.2M4.2 8.4H2.8M13.2 8.4h-1.4' stroke='%236b6b73' stroke-width='1.2' stroke-linecap='round'/%3E%3C/svg%3E"); }
.acc-main { padding: 22px 24px 20px; min-width: 0; }
.acc-main h3 {
  font-size: 22px;
  margin-bottom: 6px;
  color: var(--text);
}
.acc-main > p {
  margin-bottom: 18px;
  font-size: 14px;
  color: var(--body);
}
.acc-grid {
  display: grid;
  grid-template-columns: minmax(140px, 1.1fr) repeat(4, minmax(120px, 1fr));
  column-gap: 8px;
  align-items: start;
}
.acc-th {
  font-size: 13px;
  color: var(--body);
  padding: 0 0 12px;
}
.acc-role {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 16px;
  column-gap: 4px;
  align-items: start;
  padding: 0 4px 12px 0;
  font-size: 14px;
  color: var(--text);
}
.acc-role b {
  font-weight: 600;
  font-size: 13px;
  line-height: 1.25;
  overflow-wrap: anywhere;
}
.acc-role::after {
  content: "";
  width: 14px;
  height: 14px;
  margin-top: 2px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none'%3E%3Ccircle cx='5' cy='5' r='1.7' stroke='%239a9aa3' stroke-width='1.2'/%3E%3Ccircle cx='9.2' cy='5' r='1.7' stroke='%239a9aa3' stroke-width='1.2'/%3E%3Cpath d='M2.4 11.2c.3-1.6 1.6-2.4 2.6-2.5M11.6 11.2c-.3-1.6-1.6-2.4-2.6-2.5M7 11.2c.2-1.5 1.3-2.5 2.4-2.6M7 11.2c-.2-1.5-1.3-2.5-2.4-2.6' stroke='%239a9aa3' stroke-width='1.2' stroke-linecap='round'/%3E%3C/svg%3E") center / contain no-repeat;
}
.acc-role span {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 12px;
  font-weight: 400;
  color: var(--mute);
  white-space: nowrap;
}
.acc-role span::before {
  content: "";
  width: 12px;
  height: 12px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none'%3E%3Ccircle cx='6' cy='4.2' r='1.7' stroke='%239a9aa3' stroke-width='1.15'/%3E%3Cpath d='M2.6 10c.3-1.5 1.6-2.3 3.4-2.3s3.1.8 3.4 2.3' stroke='%239a9aa3' stroke-width='1.15' stroke-linecap='round'/%3E%3C/svg%3E") center / contain no-repeat;
}
.acc-th,
.acc-role {
  border-bottom: 1px solid #ececf0;
}
.acc-sec {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 12px 0 8px;
  font-size: 14px;
  font-weight: 600;
  color: var(--text);
}
.acc-sec::before {
  content: "";
  width: 8px;
  height: 8px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8' fill='none'%3E%3Cpath d='M1.4 2.4 4 5.2 6.6 2.4' stroke='%236b6b73' stroke-width='1.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
}
.acc-right {
  height: 36px;
  display: flex;
  align-items: center;
  font-size: 14px;
  color: var(--ink);
  white-space: nowrap;
}
.acc-cell {
  height: 36px;
  padding-right: 14px;
  display: flex;
  align-items: center;
  font-size: 14px;
  color: var(--ink);
  white-space: nowrap;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8' fill='none'%3E%3Cpath d='M1.4 2.4 4 5.2 6.6 2.4' stroke='%23c5c5cc' stroke-width='1.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") right 8px center no-repeat;
}
.flow-pills {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
}
.flow-pills span {
  height: 40px;
  padding: 0 16px;
  border-radius: 999px;
  border: 1px solid var(--purple-line);
  background: var(--purple-pale);
  color: var(--purple);
  display: inline-flex;
  align-items: center;
  font-size: 14px;
}
.flow-pills i {
  width: 16px;
  height: 2px;
  background: var(--purple-line);
}

.integ-tiles {
  margin-top: 40px;
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 16px;
}
.integ-tile {
  position: relative;
  grid-column: span 2;
  min-height: 220px;
  overflow: hidden;
  border: 0;
  border-radius: 24px;
  padding: 24px 22px 16px;
}
.integ-tile:nth-child(4),
.integ-tile:nth-child(5) { grid-column: span 3; }
.integ-tile h3 {
  max-width: 70%;
  margin-bottom: 8px;
  font-size: 18px;
  line-height: 1.2;
}
.integ-tile p {
  max-width: 62%;
  margin: 0;
  font-size: 14px;
  line-height: 1.4;
  color: var(--body);
}
.integ-art {
  position: absolute;
  right: 4px;
  bottom: 0;
  width: 180px;
  height: 120px;
  pointer-events: none;
}
.t-crm { background: #e7f1ff; }
.t-corp { background: var(--purple-pale); }
.t-docs { background: #fff1e3; }
.t-ext { background: #e6faf8; }
.t-api { background: #ffe8f2; }

.hub {
  position: relative;
  height: 280px;
  margin: 36px 0 28px;
}
.hub-core {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 160px;
  height: 64px;
  border-radius: 16px;
  background: var(--purple);
  color: #fff;
  display: grid;
  place-items: center;
  font-weight: 600;
}
.hub-node {
  position: absolute;
  height: 40px;
  padding: 0 14px;
  border-radius: 999px;
  border: 1px solid var(--line);
  background: #fff;
  display: flex;
  align-items: center;
  font-size: 13px;
  color: var(--body);
}
.n1 { left: 8%; top: 20px; }
.n2 { right: 6%; top: 20px; }
.n3 { left: 4%; bottom: 36px; }
.n4 { right: 8%; bottom: 36px; }
.n5 { left: 50%; bottom: 8px; transform: translateX(-50%); }

.result {
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  gap: 16px;
  align-items: start;
}
.result-ui { margin: 0; min-height: 360px; grid-template-columns: 160px 1fr; }
.metrics { display: grid; gap: 12px; }

.who-grid {
  margin-top: 28px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}
.who-card {
  display: grid;
  grid-template-columns: 52px 1fr;
  grid-template-rows: auto auto;
  column-gap: 14px;
  padding: 16px 18px;
  border: 1px solid var(--line);
  border-radius: 20px;
  background: #fff;
  color: var(--text);
}
.who-card h3 {
  grid-column: 2;
  margin: 0 0 4px;
  font-size: 18px;
  line-height: 1.3;
  color: var(--text);
}
.who-card p {
  grid-column: 2;
  margin: 0;
  font-size: 14px;
  line-height: 1.45;
  color: var(--body);
}
.who-ico {
  grid-row: 1 / 3;
  display: block;
  width: 52px;
  height: 52px;
  margin: 0;
  border-radius: 50%;
  background-color: #E7D3FF;
  position: relative;
}
.who-ico::after {
  content: "";
  position: absolute;
  inset: 0;
  background-color: #7125CE;
  -webkit-mask: var(--ico) center / 26px no-repeat;
  mask: var(--ico) center / 26px no-repeat;
}
.who-card:nth-child(3n+2) .who-ico { background-color: #D5FFF8; }
.who-card:nth-child(3n+2) .who-ico::after { background-color: #3EB8A4; }
.who-card:nth-child(3n) .who-ico { background-color: #D6E8FC; }
.who-card:nth-child(3n) .who-ico::after { background-color: #3B7DD8; }
.w-home { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none'%3E%3Cpath d='M4 11.2 12 4.2 20 11.2V19a1.2 1.2 0 0 1-1.2 1.2h-4.6v-5.2H9.8v5.2H5.2A1.2 1.2 0 0 1 4 19v-7.8Z' stroke='%23000' stroke-width='2' stroke-linejoin='round'/%3E%3C/svg%3E"); }
.w-school { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none'%3E%3Cpath d='M3.5 10.2 12 6l8.5 4.2L12 14.4 3.5 10.2Z' stroke='%23000' stroke-width='2' stroke-linejoin='round'/%3E%3Cpath d='M7 12.2V16.2c1.6 1 3.2 1.5 5 1.5s3.4-.5 5-1.5v-4' stroke='%23000' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E"); }
.w-plant { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none'%3E%3Cpath d='M4.5 19V9.5h5V19M9.5 19V6.5h5V19M14.5 19v-7h5v7M4.5 19h15' stroke='%23000' stroke-width='2' stroke-linejoin='round' stroke-linecap='round'/%3E%3C/svg%3E"); }
.w-shop { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none'%3E%3Cpath d='M5 7.2h14l-1.3 9A1.7 1.7 0 0 1 16 17.8H8.5A1.7 1.7 0 0 1 6.8 16.2L5 7.2Z' stroke='%23000' stroke-width='2' stroke-linejoin='round'/%3E%3Ccircle cx='9' cy='19.4' r='1.2' fill='%23000'/%3E%3Ccircle cx='15.6' cy='19.4' r='1.2' fill='%23000'/%3E%3C/svg%3E"); }
.w-net { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none'%3E%3Ccircle cx='12' cy='12' r='2.4' stroke='%23000' stroke-width='2'/%3E%3Ccircle cx='5' cy='6.4' r='1.7' stroke='%23000' stroke-width='2'/%3E%3Ccircle cx='19' cy='6.4' r='1.7' stroke='%23000' stroke-width='2'/%3E%3Ccircle cx='5.4' cy='17.8' r='1.7' stroke='%23000' stroke-width='2'/%3E%3Ccircle cx='18.6' cy='17.8' r='1.7' stroke='%23000' stroke-width='2'/%3E%3Cpath d='M6.6 7.6 10 10.4M17.4 7.6 14 10.4M6.9 16.5 9.8 13.6M17.1 16.5 14.2 13.6' stroke='%23000' stroke-width='1.8'/%3E%3C/svg%3E"); }
.w-people { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none'%3E%3Ccircle cx='9' cy='8.2' r='2.4' stroke='%23000' stroke-width='2'/%3E%3Cpath d='M4.2 17.6c.5-2.6 2.4-4 4.8-4s4.3 1.4 4.8 4' stroke='%23000' stroke-width='2' stroke-linecap='round'/%3E%3Ccircle cx='16.4' cy='8.6' r='2' stroke='%23000' stroke-width='2'/%3E%3Cpath d='M14.4 17.4c.4-1.8 1.7-2.8 3.2-2.8 1.3 0 2.4.8 2.9 2.2' stroke='%23000' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E"); }
.w-code { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none'%3E%3Cpath d='M8.5 7 4.2 12 8.5 17M15.5 7 19.8 12 15.5 17M13.4 6.4 10.6 17.6' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); }
.w-book { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none'%3E%3Cpath d='M5 5.4h5.8c1.8 0 3.1 1.1 3.1 2.9V18.2H6.4A1.4 1.4 0 0 1 5 16.8V5.4Z' stroke='%23000' stroke-width='2' stroke-linejoin='round'/%3E%3Cpath d='M13.9 8.6H19v9.2a1.4 1.4 0 0 1-1.4 1.4h-3.7' stroke='%23000' stroke-width='2' stroke-linejoin='round'/%3E%3C/svg%3E"); }
.w-legal { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none'%3E%3Cpath d='M12 4.2v2.4M7.2 8.4h9.6M8.6 8.4 6 15.6h4.6L12 13l1.4 2.6H18L15.4 8.4M6.2 18.4h11.6' stroke='%23000' stroke-width='2' stroke-linejoin='round' stroke-linecap='round'/%3E%3C/svg%3E"); }
.w-sme { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none'%3E%3Crect x='4' y='6' width='16' height='12.5' rx='2.2' stroke='%23000' stroke-width='2'/%3E%3Cpath d='M8 10.4h8M8 13.8h5' stroke='%23000' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E"); }

.aud-tabs {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  gap: 8px;
  margin: 8px 0 20px;
}
.aud-tab {
  height: 36px;
  padding: 0 16px;
  border-radius: 999px;
  border: 1px solid var(--purple-line);
  background: var(--purple-pale);
  color: var(--purple);
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
  font-family: inherit;
}
.aud-tab.is-on {
  background: var(--purple);
  color: #fff;
}
.aud-panel {
  border: 1px solid var(--line);
  border-radius: 24px;
  padding: 24px;
  background: #fff;
}
.aud-view { display: none; grid-template-columns: 1.15fr 0.85fr; gap: 28px; align-items: start; }
.aud-view.is-on { display: grid; }
.aud-h { font-size: 16px; margin-bottom: 12px; color: var(--ink); font-weight: 600; }
.aud-feats {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}
.aud-feats span {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 52px;
  height: 52px;
  padding: 0 12px 0 14px;
  border-radius: 12px;
  background: var(--purple-pale);
  border: 1px solid var(--purple-line);
  font-size: 14px;
  line-height: 1.25;
  color: var(--text);
  overflow: hidden;
}
.aud-feats span::before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--purple);
  flex-shrink: 0;
}
.aud-rings {
  display: grid;
  gap: 8px;
}
.ring {
  display: grid;
  grid-template-columns: 40px 1fr;
  grid-template-rows: auto auto;
  column-gap: 12px;
  align-items: center;
  text-align: left;
  padding: 10px 12px;
  border-radius: 12px;
  background: #f6f6f8;
}
.ring::before {
  content: "";
  width: 40px;
  height: 40px;
  grid-row: 1 / 3;
  margin: 0;
  display: block;
  border-radius: 50%;
  background: conic-gradient(var(--ring) 72%, #ececee 0);
  mask: radial-gradient(farthest-side, transparent 62%, #000 63%);
  -webkit-mask: radial-gradient(farthest-side, transparent 62%, #000 63%);
}
.r-a { --ring: #6c26eb; }
.r-b { --ring: #2ec8c0; }
.r-c { --ring: #3b9dff; }
.ring b {
  display: block;
  font-size: 16px;
  margin: 0;
  line-height: 1.2;
  color: var(--text);
}
.ring span {
  font-size: 12px;
  color: var(--body);
  line-height: 1.3;
}

.ai-sec {
  margin-top: 48px;
  padding: 72px 0 88px;
  background:
    radial-gradient(1200px 420px at 50% -40px, rgba(108, 38, 235, 0.16), transparent 70%),
    linear-gradient(180deg, #f3edff 0%, #fff 42%);
}
.ai-kicker {
  margin: 0 0 12px;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--purple);
}
#ai h2 {
  font-size: 40px;
  max-width: 16ch;
}
.ai-ways {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 24px 0 28px;
}
.ai-ways button {
  height: 44px;
  padding: 0 18px;
  border-radius: 999px;
  border: 1px solid var(--purple-line);
  background: #fff;
  color: var(--purple);
  display: inline-flex;
  align-items: center;
  font-family: inherit;
  font-size: 15px;
  font-weight: 500;
  cursor: pointer;
}
.ai-ways button.is-on {
  background: var(--purple);
  border-color: var(--purple);
  color: #fff;
}
.ai-stage { margin-bottom: 28px; }
.ai-editor {
  display: none;
  grid-template-columns: minmax(0, 1fr) 268px;
  min-height: 500px;
  border: 1px solid var(--purple-line);
  border-radius: 24px;
  overflow: auto;
  background: #fff;
  box-shadow: 0 24px 64px rgba(108, 38, 235, 0.18);
  text-align: left;
}
.ai-editor.is-on { display: grid; }
.ai-ed-art {
  padding: 22px 26px 24px;
  border-right: 1px solid var(--line);
  min-width: 0;
}
.ai-ed-art h3 {
  font-size: 22px;
  margin-bottom: 10px;
}
.ai-ed-art p {
  font-size: 15px;
  line-height: 1.55;
  color: var(--body);
  margin-bottom: 12px;
}
.ai-ed-mute { color: var(--mute); }
.ai-suggest {
  margin: 8px 0 16px;
  padding: 12px 14px;
  border: 1px dashed #cbb6f7;
  border-radius: 14px;
  background: var(--purple-pale);
}
.ai-suggest em {
  display: block;
  margin-bottom: 6px;
  font-style: normal;
  font-size: 12px;
  font-weight: 500;
  color: var(--purple);
}
.ai-suggest p {
  margin: 0 0 10px;
  color: var(--text);
  font-size: 14px;
}
.ai-suggest span {
  display: inline-flex;
  height: 32px;
  padding: 0 12px;
  border-radius: 10px;
  background: var(--purple);
  color: #fff;
  font-size: 13px;
  font-weight: 500;
  align-items: center;
}
.ai-editor .app-ai { min-height: 480px; }
.ai-editor .app-ai-body {
  border-left: 3px solid #cbb6f7;
  margin: 10px 12px 0 16px;
  padding: 4px 8px 8px 12px;
}
.ai-msg-user {
  padding: 8px 10px;
  border-radius: 10px;
  background: #f3f3f6;
  color: var(--text) !important;
}
.ai-feats { margin-top: 8px; }
.ai-steps, .ai-outline {
  margin: 0 0 16px 18px;
  color: var(--body);
  font-size: 15px;
  line-height: 1.55;
}
.ai-steps li, .ai-outline li { margin-bottom: 6px; }
.ai-src {
  margin: 0;
  font-size: 13px;
  color: var(--purple);
  font-weight: 500;
}
.ai-draft-label {
  margin-bottom: 8px;
  font-size: 12px;
  font-weight: 500;
  color: var(--purple);
}
.ai-cta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  margin-top: 8px;
  padding: 22px 28px;
  border-radius: 20px;
  background: var(--purple);
  color: #fff;
}
.ai-cta p {
  margin: 0;
  font-size: 18px;
  font-weight: 500;
  line-height: 1.35;
  max-width: 52ch;
}
.ai-cta .btn-fill {
  background: #fff;
  color: var(--purple);
  flex-shrink: 0;
}

.deploy {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: auto auto auto auto auto 1fr auto;
  column-gap: 16px;
  align-items: stretch;
}
.deploy-card {
  border: 1px solid var(--line);
  border-radius: 24px;
  padding: 28px;
  background: #fff;
  display: grid;
  grid-template-rows: subgrid;
  grid-row: span 7;
  row-gap: 8px;
}
.deploy-card-box {
  background: linear-gradient(#fff, #faf8ff);
  border-color: var(--purple-line);
}
.deploy-ico {
  width: 48px;
  height: 48px;
  border-radius: 14px;
  background: var(--purple-pale);
  display: grid;
  place-items: center;
  margin-bottom: 8px;
}
.deploy-card h3 {
  font-size: 18px;
  margin-bottom: 0;
}
.deploy-tag {
  color: var(--body);
  font-size: 14px;
  line-height: 1.4;
  margin-bottom: 12px;
}
.deploy-card ul {
  list-style: none;
  display: grid;
  gap: 10px;
  margin-bottom: 8px;
}
.deploy-card li {
  position: relative;
  padding-left: 22px;
  font-size: 15px;
  color: var(--text);
  line-height: 1.4;
}
.deploy-card li::before {
  content: "✓";
  position: absolute;
  left: 0;
  top: 0;
  color: var(--purple);
  font-size: 14px;
  font-weight: 600;
}
.deploy-place {
  margin: 8px 0 0;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.04em;
  color: var(--purple);
  text-transform: uppercase;
  align-self: end;
}
.deploy-opts {
  display: grid;
  gap: 10px;
  margin-top: 6px;
}
.deploy-opts div {
  border-radius: 16px;
  border: 1px solid var(--purple-line);
  background: #fff;
  padding: 14px 16px;
}
.deploy-opts b {
  display: block;
  font-size: 15px;
  margin-bottom: 4px;
}
.deploy-opts span {
  font-size: 14px;
  color: var(--body);
  line-height: 1.4;
}
.deploy-card .btn-fill {
  margin-top: 12px;
  align-self: start;
  border: 0;
  cursor: pointer;
  font: inherit;
}

.price-ctrls {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  margin: 28px 0 20px;
}
.price-ctrls label {
  padding: 18px 20px;
  border: 1px solid var(--line);
  border-radius: 20px;
  background: #fff;
}
.price-ctrls span {
  display: block;
  margin-bottom: 12px;
  font-size: 14px;
  font-weight: 500;
  color: var(--ink);
}
.price-row {
  display: grid;
  grid-template-columns: 1fr 48px;
  gap: 12px;
  align-items: center;
}
.price-row input[type="range"] {
  width: 100%;
  accent-color: var(--purple);
}
.price-row b {
  font-size: 18px;
  font-weight: 600;
  text-align: right;
  color: var(--text);
}
.price-grid {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 16px;
}
.price-card {
  display: flex;
  flex-direction: column;
  padding: 28px 24px;
  border: 1px solid var(--line);
  border-radius: 24px;
  background: #fff;
}
.price-card.is-main {
  border-color: var(--purple-line);
  background: var(--purple-pale);
}
.price-card h3 { margin-bottom: 12px; }
.price-sum {
  margin: 0 0 12px;
  font-size: 28px;
  font-weight: 600;
  letter-spacing: -0.03em;
  color: var(--text);
}
.price-hint {
  margin: 0 0 16px;
  font-size: 14px;
  line-height: 1.45;
  color: var(--body);
}
.price-list {
  list-style: none;
  display: grid;
  gap: 8px;
  margin: 0 0 24px;
}
.price-list li {
  position: relative;
  padding-left: 16px;
  font-size: 14px;
  line-height: 1.4;
  color: var(--ink);
}
.price-list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 7px;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--purple);
}
.price-card .btn-fill { margin-top: auto; align-self: flex-start; }

.cta {
  width: var(--content);
  max-width: calc(100% - 40px);
  margin: 80px auto 0;
  padding: 0 0 72px;
  background: transparent;
}
.cta-panel {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 40px 48px;
  align-items: start;
  justify-items: stretch;
  min-height: 620px;
  border-radius: 48px;
  padding: 44px 44px 44px 56px;
  background: linear-gradient(105deg, #7b4dff 0%, #6c5ef2 42%, #5aa8f5 72%, #4fd6c8 100%);
}
.cta-copy {
  padding-top: 8px;
  justify-self: start;
  align-self: start;
}
.cta-kicker {
  display: inline-flex;
  align-items: center;
  height: 34px;
  margin-bottom: 22px;
  padding: 0 16px;
  border-radius: 999px;
  background: #fff;
  color: var(--purple);
  font-size: 14px;
  font-weight: 500;
}
.cta-copy h2 {
  max-width: none;
  margin: 0;
  color: #fff;
  font-size: 56px;
  font-weight: 600;
  line-height: 1.08;
  letter-spacing: -0.03em;
}
.cta-form {
  width: 100%;
  background: #fff;
  border-radius: 32px;
  padding: 36px 40px 32px;
  display: grid;
  gap: 16px;
  align-self: start;
}
.cta-form label {
  display: flex;
  flex-direction: column;
  gap: 6px;
  font-size: 14px;
  font-weight: 400;
  color: var(--ink);
}
.cta-form .lbl { display: block; }
.cta-form .req {
  display: inline;
  color: var(--purple);
}
.cta-form input,
.cta-form select,
.cta-form textarea {
  width: 100%;
  height: 44px;
  border: 0;
  border-radius: 16px;
  background: #f3f3f5;
  padding: 0 16px;
  font: inherit;
  font-weight: 400;
  color: var(--text);
  outline: none;
}
.cta-form textarea {
  height: auto;
  min-height: 72px;
  padding: 12px 16px;
  resize: none;
}
.cta-form input::placeholder,
.cta-form textarea::placeholder {
  color: var(--mute);
}
.cta-form select {
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpath fill='%23111' d='M4 6l4 4 4-4'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 16px center;
  padding-right: 40px;
}
.cta-form input:focus,
.cta-form select:focus,
.cta-form textarea:focus {
  box-shadow: 0 0 0 2px rgba(108, 38, 235, 0.22);
}
.phone-row {
  display: flex;
  align-items: center;
  height: 44px;
  border-radius: 16px;
  background: #f3f3f5;
  padding-left: 16px;
}
.phone-row span {
  color: var(--mute);
  font-weight: 400;
  margin-right: 8px;
  flex: none;
}
.phone-row input {
  height: 44px;
  padding-left: 0;
  background: transparent;
}
.phone-row input:focus { box-shadow: none; }
.check {
  display: grid;
  grid-template-columns: 18px 1fr;
  align-items: start;
  gap: 10px;
  font-weight: 400;
  font-size: 12px;
  color: var(--body);
  line-height: 1.4;
}
.check span { color: var(--body); }
.check input {
  width: 16px;
  height: 16px;
  margin-top: 2px;
  accent-color: var(--purple);
  padding: 0;
}
.check a { color: var(--purple); }
.cta-form .btn-fill {
  justify-self: center;
  width: 280px;
  height: 52px;
  margin-top: 8px;
  border: 0;
  border-radius: 999px;
  cursor: pointer;
  text-transform: lowercase;
  font-size: 16px;
}
.cta-form .btn-fill:disabled {
  opacity: 0.55;
  cursor: default;
}
.form-ok {
  margin: 0;
  font-size: 14px;
  color: var(--purple);
  font-weight: 500;
}
.site-foot {
  padding: 28px 0 40px;
  background: #fff;
}
.foot-bar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  font-size: 14px;
  color: var(--mute);
}
.foot-bar button {
  border: 0;
  background: none;
  font: inherit;
  color: var(--mute);
  cursor: pointer;
}
.foot-bar button:hover { color: var(--purple); }
.policy-dlg {
  width: min(560px, calc(100% - 40px));
  border: 0;
  border-radius: 24px;
  padding: 28px;
}
.policy-dlg::backdrop { background: rgba(17, 17, 17, 0.45); }
.policy-dlg h3 { margin-bottom: 12px; }
.policy-dlg p {
  color: var(--body);
  font-size: 14px;
  line-height: 1.5;
  margin-bottom: 12px;
}
.policy-dlg a { color: var(--purple); }
.policy-dlg .btn-fill {
  margin-top: 8px;
  border: 0;
  cursor: pointer;
}

.lead-dlg {
  width: min(480px, calc(100% - 32px));
  max-height: calc(100vh - 24px);
  overflow: auto;
  border: 0;
  border-radius: 28px;
  padding: 28px 28px 24px;
  background: #fff;
  box-shadow: 0 24px 70px rgba(17, 17, 17, 0.18);
  margin: auto;
}
.lead-dlg::backdrop { background: rgba(17, 17, 17, 0.45); }
.lead-dlg:focus { outline: none; }
.lead-kicker {
  display: inline-flex;
  align-items: center;
  height: 28px;
  margin: 0 40px 10px 0;
  padding: 0 12px;
  border-radius: 999px;
  background: var(--purple-pale);
  color: var(--purple);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.lead-dlg h3 {
  margin: 0 40px 8px 0;
  font-size: 28px;
  letter-spacing: -0.03em;
  line-height: 1.2;
}
.lead-dlg-note {
  margin: 0 0 20px;
  font-size: 14px;
  line-height: 1.45;
  color: var(--body);
}
.lead-close {
  position: absolute;
  top: 16px;
  right: 16px;
  width: 40px;
  height: 40px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none'%3E%3Cpath d='M3 3l8 8M11 3 3 11' stroke='%233a3a40' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E") center / 14px no-repeat;
  cursor: pointer;
}
.lead-dlg .cta-form {
  padding: 0;
  border-radius: 0;
}
.lead-dlg .cta-form .btn-fill {
  width: 100%;
  border: 0;
  cursor: pointer;
}

@media (max-width: 1100px) {
  .content, .header { width: min(1200px, calc(100% - 32px)); }
  .cta { width: min(1200px, calc(100% - 32px)); max-width: none; }
  .header { position: relative; z-index: 40; }
  .header-bar { gap: 10px; position: relative; }
  .header-bar > .btn-fill { margin-left: auto; }
  .nav-burger { display: flex; }
  .nav-grey {
    display: none;
    position: absolute;
    top: calc(100% + 8px);
    left: 0;
    right: 0;
    flex-direction: column;
    gap: 0;
    padding: 8px;
    border: 1px solid var(--line);
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 16px 40px rgba(17, 17, 17, 0.08);
    z-index: 50;
  }
  .nav-grey a {
    padding: 12px 14px;
    border-radius: 12px;
  }
  .nav-grey a:hover { background: var(--purple-pale); }
  .header.is-open .nav-grey { display: flex; }
  .g4, .steps-4, .ed-log-cards, .st-3 { grid-template-columns: 1fr 1fr; }
  .cards-5 { grid-template-columns: 1fr 1fr; }
  .cards-5 .card,
  .cards-5 .card:nth-child(4),
  .cards-5 .card:nth-child(5) { grid-column: auto; }
  .integ-tiles { grid-template-columns: 1fr 1fr; }
  .integ-tile,
  .integ-tile:nth-child(4),
  .integ-tile:nth-child(5) { grid-column: auto; }
  .ui-hero { grid-template-columns: 180px minmax(0, 1fr) 180px; }
  .hero-app { height: 520px; }
}

@media (max-width: 900px) {
  .sec { padding: 80px 0 0; }
  h1 { font-size: 40px; }
  h2, #ai h2 { font-size: 32px; max-width: none; }
  .lead { font-size: 16px; }
  .g3, .split, .result, .feats, .price-ctrls, .price-grid, .who-grid, .st-2 { grid-template-columns: 1fr 1fr; }
  .aud-view.is-on, .aud-feats, .aud-rings, .deploy, .acc-points, .ui-wide {
    grid-template-columns: 1fr;
  }
  .hero-app {
    grid-template-columns: 52px 220px minmax(360px, 1fr) 220px;
    height: 480px;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
  }
  .hero-app .kb-nav,
  .hero-app .app-ai { display: block; }
  .hub { height: auto; display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; }
  .hub-core, .hub-node { position: static; transform: none; }
  .deploy {
    grid-template-columns: 1fr;
    grid-template-rows: none;
  }
  .deploy-card {
    grid-row: auto;
    display: flex;
    flex-direction: column;
  }
  .merge { grid-template-columns: 1fr; }
  .merge-arrow { transform: rotate(90deg); justify-self: center; }
  .kb-wrap { grid-template-columns: 1fr; }
  #editor .kb-wrap {
    grid-template-columns: 1fr;
  }
  #editor .kb-feats {
    grid-template-columns: 1fr;
    grid-template-rows: none;
  }
  #editor .ed-screen {
    order: 0;
    min-height: 380px;
    overflow: auto;
  }
  .kb-view.is-on,
  .kb-view[data-view="ai"] {
    min-width: 760px;
    min-height: 480px;
  }
  .ai-stage { overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .ai-editor,
  .ai-editor.is-on {
    grid-template-columns: minmax(360px, 1fr) 268px;
    min-width: 720px;
    min-height: 420px;
  }
  .ai-ed-art { border-right: 1px solid var(--line); border-bottom: 0; }
  .ai-cta { flex-direction: column; align-items: flex-start; }
  .acc-points article { border-right: 0; border-bottom: 1px solid var(--line); }
  .acc-points article:last-child { border-bottom: 0; }
  .acc-app {
    min-width: 0;
    max-width: 100%;
    overflow-x: auto;
  }
  .acc-frame { min-width: 920px; }
  .acc-nav { border-right: 1px solid var(--line); border-bottom: 0; }
  .acc-main { overflow: visible; min-width: 0; }
  .acc-grid { min-width: 640px; }
  .ui-hero {
    grid-template-columns: 180px minmax(280px, 1fr) 180px;
    min-width: 720px;
    overflow: auto;
  }
  .ui-hero .ui-side, .ui-hero .ui-ai { display: block; }
  .result-ui {
    grid-template-columns: 160px minmax(280px, 1fr);
    min-width: 560px;
    overflow: auto;
  }
  .cta-panel { grid-template-columns: 1fr; padding: 28px 20px; min-height: 0; border-radius: 28px; }
  .cta-copy h2 { font-size: 32px; }
}

@media (max-width: 640px) {
  .content, .header, .cta { width: calc(100% - 24px); }
  .sec { padding: 56px 0 0; }
  .hero { padding-top: 16px; }
  .kicker { margin-top: 28px; }
  h1 { font-size: 32px; }
  h2, #ai h2, .cta-copy h2 { font-size: 26px; }
  .g3, .g4, .steps-4, .split, .feats, .ed-log-cards, .st-3, .st-2,
  .cards-5, .price-ctrls, .price-grid, .who-grid { grid-template-columns: 1fr; }
  .integ-tiles { grid-template-columns: 1fr; }
  .hero-app { height: 420px; border-radius: 18px; overflow: auto; }
  .brand em { display: none; }
  .cta { margin-top: 48px; padding-bottom: 40px; }
  .cta-panel { padding: 24px 16px; border-radius: 22px; }
  .foot-bar { flex-wrap: wrap; gap: 8px 16px; }
  .ai-cta p { font-size: 16px; }
  .aud-panel { padding: 16px; }
  .price-card, .who-card, .deploy-card { padding: 20px 16px; }
}