.yk-kt200-product-support,
.yk-kt200-brand-support,
.yk-kt200-dialog { --kt-red: #e31b35; --kt-ink: #101a28; --kt-teal: #087f83; --kt-line: #d4e0ec; }
.yk-kt200-product-support { margin-top: 12px; padding: 14px; border: 1px solid #cbdbea; border-radius: 15px; background: linear-gradient(145deg,#fff 0%,#f7fbff 58%,#fff4f5 100%); }
.yk-kt200-product-support__head { display: flex; gap: 10px; align-items: center; margin-bottom: 11px; }
.yk-kt200-product-support__head>span { display: grid; width: 42px; height: 42px; place-items: center; border-radius: 12px; color: #fff; background: linear-gradient(135deg,var(--kt-red),#9f1025); box-shadow: 0 8px 20px rgba(227,27,53,.2); }
.yk-kt200-product-support__head small { display: block; color: var(--kt-red); font-size: 10px; font-weight: 900; letter-spacing: .09em; }
.yk-kt200-product-support__head b { display: block; margin-top: 2px; color: var(--kt-ink); font-size: 15px; line-height: 1.25; }
.yk-kt200-product-support__buttons { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
.yk-kt200-product-support__buttons button { min-width: 0; display: grid; grid-template-columns: 28px 1fr 14px; gap: 8px; align-items: center; padding: 10px; text-align: left; border: 1px solid var(--kt-line); border-radius: 12px; color: var(--kt-ink); background: #fff; cursor: pointer; }
.yk-kt200-product-support__buttons button:hover { border-color: #e88c99; box-shadow: 0 8px 22px rgba(18,42,67,.08); transform: translateY(-1px); }
.yk-kt200-product-support__buttons button>i:first-child { color: var(--kt-red); font-size: 16px; text-align: center; }
.yk-kt200-product-support__buttons button span { min-width: 0; font-weight: 900; font-size: 12px; }
.yk-kt200-product-support__buttons button b { display: block; margin-top: 2px; color: #62748a; font-size: 10px; font-weight: 800; }
.yk-kt200-product-support__buttons button>i:last-child { color: #718298; }
.yk-kt200-product-support__note { margin: 10px 2px 0; color: #5e6f83; font-size: 11px; line-height: 1.45; }
.yk-kt200-product-support__note b { color: var(--kt-red); }
.yk-kt200-brand-support { margin-top: 26px; margin-bottom: 30px; }
.yk-kt200-brand-support__intro { display: flex; justify-content: space-between; gap: 24px; padding: 26px; border-radius: 22px 22px 0 0; color: #fff; background: radial-gradient(circle at 92% 10%,rgba(227,27,53,.28),transparent 32%),linear-gradient(135deg,#111b29,#0c2932); }
.yk-kt200-brand-support__intro small { color: #ff9bac; font-weight: 900; letter-spacing: .1em; }
.yk-kt200-brand-support__intro h2 { max-width: 720px; margin: 7px 0; color: #fff; font-size: clamp(24px,3vw,38px); line-height: 1.08; }
.yk-kt200-brand-support__intro p { max-width: 760px; color: #cbd6e2; line-height: 1.55; }
.yk-kt200-brand-support__stats { display: grid; grid-template-columns: repeat(3,minmax(100px,1fr)); gap: 8px; align-self: center; }
.yk-kt200-brand-support__stats span { padding: 12px; border: 1px solid rgba(255,255,255,.14); border-radius: 13px; color: #ccd7e3; background: rgba(255,255,255,.06); font-size: 11px; font-weight: 800; }
.yk-kt200-brand-support__stats b { display: block; color: #fff; font-size: 19px; }
.yk-kt200-variant-matrix { padding: 20px; border: 1px solid var(--kt-line); border-top: 0; border-radius: 0 0 22px 22px; background: #fff; }
.yk-kt200-matrix-head { display: grid; grid-template-columns: 260px 1fr; gap: 18px; align-items: start; margin-bottom: 16px; padding: 14px; border-radius: 13px; background: #fff7f8; }
.yk-kt200-matrix-head b { color: var(--kt-red); font-size: 16px; }
.yk-kt200-matrix-head p { margin: 0; color: #4f6074; line-height: 1.5; }
.yk-kt200-brand-cards { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 12px; }
.yk-kt200-brand-cards article { display: flex; min-height: 210px; flex-direction: column; justify-content: space-between; padding: 16px; border: 1px solid var(--kt-line); border-radius: 15px; background: linear-gradient(180deg,#fff,#f8fbfd); }
.yk-kt200-brand-cards article small { color: var(--kt-teal); font-size: 9px; font-weight: 900; letter-spacing: .06em; }
.yk-kt200-brand-cards h3 { margin: 5px 0; color: var(--kt-ink); font-size: 21px; }
.yk-kt200-brand-cards p { color: #607188; font-size: 12px; line-height: 1.5; }
.yk-kt200-brand-cards article>div:last-child { display: grid; gap: 7px; }
.yk-kt200-brand-cards button,.yk-kt200-brand-cards a { display: flex; min-height: 40px; align-items: center; justify-content: center; gap: 7px; border-radius: 10px; font-size: 11px; font-weight: 900; text-decoration: none; cursor: pointer; }
.yk-kt200-brand-cards button { border: 0; color: #fff; background: var(--kt-red); }
.yk-kt200-brand-cards a { border: 1px solid var(--kt-line); color: var(--kt-ink); background: #fff; }
.yk-kt200-dialog-open { overflow: hidden; }
.yk-kt200-dialog { position: fixed; inset: 0; z-index: 2147483200; display: grid; place-items: center; padding: 22px; }
.yk-kt200-backdrop { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; background: rgba(8,16,27,.72); backdrop-filter: blur(7px); cursor: default; }
.yk-kt200-dialog__panel { position: relative; display: flex; width: min(1180px,100%); max-height: calc(100vh - 44px); flex-direction: column; overflow: hidden; border-radius: 22px; color: var(--kt-ink); background: #f5f8fb; box-shadow: 0 32px 90px rgba(0,0,0,.36); }
.yk-kt200-dialog__panel>header { display: flex; flex: 0 0 auto; justify-content: space-between; gap: 20px; padding: 20px 22px 15px; color: #fff; background: radial-gradient(circle at 85% 0,rgba(227,27,53,.32),transparent 34%),linear-gradient(135deg,#111b29,#0a2931); }
.yk-kt200-dialog__panel>header small { color: #ff9bac; font-size: 10px; font-weight: 900; letter-spacing: .1em; }
.yk-kt200-dialog__panel>header h2 { margin: 4px 0; color: #fff; font-size: clamp(23px,3vw,34px); }
.yk-kt200-dialog__panel>header p { margin: 0; color: #bdcbd9; }
.yk-kt200-dialog__panel>header button { display: grid; width: 44px; height: 44px; flex: 0 0 44px; place-items: center; border: 1px solid rgba(255,255,255,.2); border-radius: 50%; color: #fff; background: rgba(255,255,255,.08); cursor: pointer; }
.yk-kt200-variant-note { display: flex; flex: 0 0 auto; gap: 10px; align-items: center; margin: 12px 18px 0; padding: 10px 13px; border: 1px solid #b9e2d1; border-radius: 11px; color: #176b4d; background: #edf9f4; font-size: 12px; }
.yk-kt200-variant-note.is-car { border-color: #f2c7ce; color: #9f1c30; background: #fff4f6; }
.yk-kt200-tabs { display: grid; flex: 0 0 auto; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 8px; padding: 12px 18px 0; }
.yk-kt200-tabs button { display: flex; min-width: 0; min-height: 60px; gap: 10px; align-items: center; padding: 10px 13px; border: 1px solid var(--kt-line); border-radius: 12px; color: var(--kt-ink); background: #fff; cursor: pointer; }
.yk-kt200-tabs button>i { color: var(--kt-red); font-size: 19px; }
.yk-kt200-tabs button span { min-width: 0; text-align: left; font-size: 12px; font-weight: 900; }
.yk-kt200-tabs button b { display: block; margin-top: 2px; color: #687a90; font-size: 10px; }
.yk-kt200-tabs button.is-active { border-color: var(--kt-red); color: #fff; background: var(--kt-red); box-shadow: 0 8px 20px rgba(227,27,53,.2); }
.yk-kt200-tabs button.is-active i,.yk-kt200-tabs button.is-active b { color: #fff; }
.yk-kt200-toolbar { display: grid; flex: 0 0 auto; grid-template-columns: minmax(260px,1fr) 190px 170px; gap: 8px; padding: 12px 18px 8px; }
.yk-kt200-toolbar label { position: relative; display: flex; align-items: center; }
.yk-kt200-toolbar label i { position: absolute; left: 14px; color: var(--kt-red); }
.yk-kt200-toolbar input,.yk-kt200-toolbar select { width: 100%; height: 46px; border: 1px solid var(--kt-line); border-radius: 11px; color: var(--kt-ink); background: #fff; font: inherit; font-size: 12px; font-weight: 800; }
.yk-kt200-toolbar input { padding: 0 14px 0 40px; }
.yk-kt200-toolbar select { padding: 0 10px; }
.yk-kt200-result-meta { display: flex; flex: 0 0 auto; justify-content: space-between; padding: 0 20px 8px; color: #68798e; font-size: 11px; }
.yk-kt200-result-meta b { color: var(--kt-red); }
.yk-kt200-results { display: grid; min-height: 180px; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px; padding: 0 18px 12px; overflow: auto; overscroll-behavior: contain; }
.yk-kt200-result { min-width: 0; padding: 11px; border: 1px solid var(--kt-line); border-radius: 11px; background: #fff; }
.yk-kt200-result>div { display: flex; justify-content: space-between; gap: 8px; align-items: flex-start; }
.yk-kt200-result strong { color: var(--kt-ink); font-size: 12px; }
.yk-kt200-result span { flex: 0 0 auto; padding: 3px 6px; border-radius: 999px; color: #0b6d70; background: #e8f7f5; font-size: 9px; font-weight: 900; }
.yk-kt200-result p { margin: 7px 0 0; color: #5a6b7f; font-size: 10px; line-height: 1.45; overflow-wrap: anywhere; }
.yk-kt200-empty { grid-column: 1/-1; display: grid; place-items: center; align-content: center; gap: 7px; min-height: 190px; color: #697b90; text-align: center; }
.yk-kt200-empty i { color: var(--kt-red); font-size: 28px; }
.yk-kt200-empty b { color: var(--kt-ink); }
.yk-kt200-dialog__panel>footer { display: flex; flex: 0 0 auto; justify-content: center; gap: 18px; align-items: center; padding: 10px 18px; border-top: 1px solid var(--kt-line); background: #fff; }
.yk-kt200-dialog__panel>footer button { min-height: 38px; padding: 0 15px; border: 1px solid var(--kt-line); border-radius: 9px; color: var(--kt-ink); background: #fff; font-weight: 900; cursor: pointer; }
.yk-kt200-dialog__panel>footer button:disabled { opacity: .38; cursor: default; }
.yk-kt200-dialog__panel>footer span { min-width: 70px; text-align: center; font-size: 11px; font-weight: 900; }
.yk-kt200-source-note { flex: 0 0 auto; margin: 0; padding: 9px 18px 13px; color: #637489; background: #fff; font-size: 10px; text-align: center; }
.yk-kt200-source-note i { margin-right: 5px; color: var(--kt-teal); }
@media (max-width:900px) {
  .yk-kt200-brand-support__intro { display: grid; }
  .yk-kt200-brand-support__stats { width: 100%; }
  .yk-kt200-brand-cards { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .yk-kt200-matrix-head { grid-template-columns: 1fr; }
  .yk-kt200-results { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width:640px) {
  .yk-kt200-product-support { padding: 11px; }
  .yk-kt200-product-support__buttons { grid-template-columns: 1fr; }
  .yk-kt200-dialog { padding: 0; }
  .yk-kt200-dialog__panel { width: 100%; max-height: 100dvh; height: 100dvh; border-radius: 0; }
  .yk-kt200-dialog__panel>header { padding: 15px 14px 12px; }
  .yk-kt200-dialog__panel>header h2 { font-size: 22px; }
  .yk-kt200-dialog__panel>header p { font-size: 11px; }
  .yk-kt200-variant-note { margin: 9px 10px 0; padding: 8px 10px; font-size: 10px; }
  .yk-kt200-tabs { display: flex; gap: 6px; padding: 9px 10px 0; overflow-x: auto; scroll-snap-type: x proximity; }
  .yk-kt200-tabs button { min-width: 132px; min-height: 52px; flex: 1 0 132px; scroll-snap-align: start; }
  .yk-kt200-toolbar { grid-template-columns: 1fr 1fr; padding: 9px 10px 7px; }
  .yk-kt200-toolbar label { grid-column: 1/-1; }
  .yk-kt200-toolbar input,.yk-kt200-toolbar select { height: 42px; font-size: 11px; }
  .yk-kt200-result-meta { padding: 0 12px 7px; }
  .yk-kt200-result-meta span { display: none; }
  .yk-kt200-results { grid-template-columns: 1fr; gap: 7px; padding: 0 10px 9px; }
  .yk-kt200-result { padding: 10px; }
  .yk-kt200-dialog__panel>footer { padding: 8px 10px; }
  .yk-kt200-source-note { padding: 8px 10px 10px; }
  .yk-kt200-brand-support { margin-top: 18px; }
  .yk-kt200-brand-support__intro { padding: 20px 15px; border-radius: 17px 17px 0 0; }
  .yk-kt200-brand-support__stats { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .yk-kt200-brand-support__stats span { padding: 8px; font-size: 9px; }
  .yk-kt200-brand-support__stats b { font-size: 15px; }
  .yk-kt200-variant-matrix { padding: 12px; border-radius: 0 0 17px 17px; }
  .yk-kt200-brand-cards { grid-template-columns: 1fr; }
  .yk-kt200-brand-cards article { min-height: 0; }
}
.kt200-indexable-support-link a {
  display: grid;
  gap: 4px;
  margin: 12px 0 18px;
  padding: 15px 17px;
  border: 1px solid #d71936;
  border-radius: 13px;
  background: #fff4f6;
  color: #151e2b;
  text-decoration: none;
}
.kt200-indexable-support-link a:hover { background: #ffecef; }
.kt200-indexable-support-link strong { color: #c31630; font-size: 15px; }
.kt200-indexable-support-link span { color: #5d6a7c; font-size: 12px; line-height: 1.5; }
