.sds-demo, .sds-demo * { box-sizing: border-box !important; }
.sds-demo {
  max-width: 1120px;
  margin: 40px auto;
  display: grid;
  grid-template-columns: minmax(280px, 0.9fr) minmax(320px, 1.1fr);
  gap: 28px;
  font-family: var(--sds-font-body) !important;
  color: var(--sds-main-text) !important;
}
.sds-card {
  border: 1px solid var(--sds-border) !important;
  border-radius: 24px !important;
  padding: 28px !important;
  box-shadow: 0 18px 45px rgba(0,0,0,.08) !important;
  overflow: hidden !important;
}
.sds-profile {
  background: #fff !important;
  color: var(--sds-main-text) !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 22px !important;
}
.sds-profile-top { text-align: left !important; }
.sds-profile-avatar {
  width: 150px !important;
  height: 150px !important;
  min-width:150px !important;
  min-height:150px !important;
  border-radius: 50% !important;
  object-fit: cover !important;
  display: block !important;
  margin: 0 0 22px 0 !important;
  border: 3px solid var(--sds-accent) !important;
  box-shadow: 0 12px 28px rgba(0,0,0,.12) !important;
}
.sds-kicker {
  margin: 0 0 8px !important;
  text-transform: uppercase !important;
  letter-spacing: .14em !important;
  font-size: 12px !important;
  color: var(--sds-secondary-text) !important;
  font-family: var(--sds-font-body) !important;
}
.sds-profile h2 {
  margin: 0 !important;
  font-size: clamp(30px, 4vw, 48px) !important;
  color: var(--sds-primary) !important;
  line-height: 1.05 !important;
  font-family: var(--sds-font-heading) !important;
  font-weight: 700 !important;
}
.sds-company {
  margin: 12px 0 0 !important;
  font-size: 17px !important;
  color: var(--sds-main-text) !important;
  font-family: var(--sds-font-body) !important;
}
.sds-info-grid { display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 14px !important; }
.sds-info-grid div { background: rgba(0,0,0,.045) !important; border-radius: 16px !important; padding: 14px !important; }
.sds-info-grid span { display:block !important; font-size:12px !important; text-transform: uppercase !important; letter-spacing:.08em !important; color: var(--sds-secondary-text) !important; margin-bottom: 7px !important; font-family: var(--sds-font-body) !important; }
.sds-info-grid strong, .sds-info-grid p { margin:0 !important; color: var(--sds-main-text) !important; line-height:1.4 !important; font-family: var(--sds-font-body) !important; }
.sds-wide { grid-column: 1 / -1 !important; }

.sds-chat-card {
  background: var(--sds-chat-bg) !important;
  color: var(--sds-main-text) !important;
  display:flex !important;
  flex-direction:column !important;
  min-height: 580px !important;
  padding: 0 !important;
  font-family: var(--sds-font-chat) !important;
}
.sds-chat-header {
  background: var(--sds-header-bg) !important;
  color: var(--sds-main-text) !important;
  display:flex !important;
  align-items:center !important;
  gap:14px !important;
  padding: 22px 26px !important;
  border-bottom:1px solid color-mix(in srgb, var(--sds-border) 45%, transparent) !important;
  margin: 0 !important;
  min-height: 96px !important;
}
.sds-chat-avatar {
  width: 58px !important;
  height: 58px !important;
  min-width:58px !important;
  min-height:58px !important;
  border-radius: 50% !important;
  object-fit: cover !important;
  display:block !important;
  border:2px solid var(--sds-accent) !important;
}
.sds-chat-header strong {
  display:block !important;
  color: var(--sds-primary) !important;
  font-size:20px !important;
  font-family: var(--sds-font-heading) !important;
  line-height: 1.15 !important;
}
.sds-chat-header span {
  display:block !important;
  font-size:13px !important;
  color: var(--sds-secondary-text) !important;
  font-family: var(--sds-font-body) !important;
  margin-top: 3px !important;
}
.sds-chat-body {
  background: var(--sds-chat-bg) !important;
  flex: 1 !important;
  display:flex !important;
  flex-direction:column !important;
  padding: 24px !important;
}
.sds-chat-messages { flex:1 !important; display:flex !important; flex-direction:column !important; gap:12px !important; overflow-y:auto !important; padding: 4px 4px 18px !important; }
.sds-message {
  max-width: 82% !important;
  padding: 13px 15px !important;
  border-radius: 18px !important;
  line-height:1.45 !important;
  white-space: pre-wrap !important;
  font-family: var(--sds-font-chat) !important;
  font-size: 15px !important;
}
.sds-message-bot { align-self:flex-start !important; background: var(--sds-bot-bg) !important; color: var(--sds-bot-text) !important; border-bottom-left-radius: 6px !important; }
.sds-message-user { align-self:flex-end !important; background: var(--sds-user-bg) !important; color: var(--sds-user-text) !important; border-bottom-right-radius: 6px !important; }
.sds-typing { font-size: 13px !important; color: var(--sds-secondary-text) !important; margin-bottom:10px !important; font-family: var(--sds-font-chat) !important; }
.sds-chat-form { display:flex !important; gap:10px !important; padding-top:16px !important; border-top:1px solid color-mix(in srgb, var(--sds-border) 32%, transparent) !important; }
.sds-chat-input {
  flex:1 !important;
  min-width:0 !important;
  border:1px solid color-mix(in srgb, var(--sds-border) 55%, transparent) !important;
  border-radius: 999px !important;
  padding: 13px 16px !important;
  background:#fff !important;
  color:#222 !important;
  font-family: var(--sds-font-chat) !important;
  font-size: 15px !important;
}
.sds-chat-input::placeholder { color: rgba(30,30,30,.45) !important; }
.sds-chat-button {
  border:0 !important;
  border-radius:999px !important;
  background: var(--sds-button-bg) !important;
  color: var(--sds-button-text) !important;
  padding: 12px 22px !important;
  cursor:pointer !important;
  font-weight:700 !important;
  font-family: var(--sds-font-chat) !important;
}
.sds-chat-button:disabled { opacity:.55 !important; cursor:not-allowed !important; }
.sds-error { max-width: 760px; margin: 40px auto; padding: 22px; border-radius: 16px; background:#fff3f3; color:#8a1f1f; border:1px solid #f0c7c7; }
@media (max-width: 820px) {
  .sds-demo { grid-template-columns: 1fr !important; margin:24px auto !important; }
  .sds-card { padding:22px !important; }
  .sds-chat-card { padding:0 !important; min-height: 540px !important; }
  .sds-info-grid { grid-template-columns:1fr !important; }
  .sds-chat-form { flex-direction: column !important; }
  .sds-chat-button { width: 100% !important; }
}
