/* ===================================================================
   Sistem Sunyi — KBDS Family Map Global Popup v1.1.2
   Semantic Home Explorer
   File: ss-kbds-family-map-global-v1.0.7.css
   Scope: .sskfm-modal and descendants only.
   Safe against Newspaper/tagDiv global styles.
=================================================================== */
body.sskfm-open  {
  overflow: hidden!important
}
.sskfm-modal, .sskfm-modal *  {
  box-sizing: border-box!important
}
.sskfm-modal  {
  --sskfm-bg: #f5efe4;
  --sskfm-bg-2: #fffbf2;
  --sskfm-panel: rgba(255, 255, 255, .88);
  --sskfm-panel-2: rgba(246, 239, 229, .86);
  --sskfm-card: rgba(255, 255, 255, .72);
  --sskfm-card-2: rgba(255, 255, 255, .94);
  --sskfm-card-soft: rgba(255, 255, 255, .58);
  --sskfm-text: #172235;
  --sskfm-muted: rgba(23, 34, 53, .72);
  --sskfm-soft: rgba(23, 34, 53, .52);
  --sskfm-line: rgba(22, 34, 53, .12);
  --sskfm-line-strong: rgba(126, 88, 35, .28);
  --sskfm-gold: #8e642a;
  --sskfm-gold-2: rgba(142, 100, 42, .12);
  --sskfm-gold-3: rgba(142, 100, 42, .22);
  --sskfm-red: #a9463f;
  --sskfm-blue: #31577c;
  --sskfm-green: #4c7d61;
  --sskfm-shadow: 0 30px 90px rgba(24, 34, 52, .20);
  --sskfm-shadow-soft: 0 18px 52px rgba(24, 34, 52, .10);
  --sskfm-radius-xl: 30px;
  --sskfm-radius-lg: 23px;
  --sskfm-radius-md: 17px;
  --sskfm-sans: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont,
  "Segoe UI",
  Arial,
  sans-serif;
  --sskfm-serif: Georgia, "Times New Roman", serif;
  position: fixed!important;
  inset: 0!important;
  z-index: 100000;
  display: none;
  font-family: var(--sskfm-sans)!important;
  color: var(--sskfm-text)!important;
  text-rendering: optimizeLegibility
}
.sskfm-modal[data-sskfm-theme="dark"], body.ss-dark-mode .sskfm-modal:not([data-sskfm-theme="light"]),
body[data-theme="dark"] .sskfm-modal:not([data-sskfm-theme="light"]),
html[data-theme="dark"] .sskfm-modal:not([data-sskfm-theme="light"])  {
  --sskfm-bg: #07111d;
  --sskfm-bg-2: #101d2c;
  --sskfm-panel: rgba(255, 255, 255, .070);
  --sskfm-panel-2: rgba(255, 255, 255, .050);
  --sskfm-card: rgba(255, 255, 255, .064);
  --sskfm-card-2: rgba(255, 255, 255, .090);
  --sskfm-card-soft: rgba(255, 255, 255, .046);
  --sskfm-text: #f4efe6;
  --sskfm-muted: rgba(244, 239, 230, .72);
  --sskfm-soft: rgba(244, 239, 230, .54);
  --sskfm-line: rgba(255, 255, 255, .11);
  --sskfm-line-strong: rgba(204, 169, 100, .34);
  --sskfm-gold: #caa766;
  --sskfm-gold-2: rgba(202, 167, 102, .125);
  --sskfm-gold-3: rgba(202, 167, 102, .22);
  --sskfm-red: #d16a62;
  --sskfm-blue: #76a5cc;
  --sskfm-green: #9ac8aa;
  --sskfm-shadow: 0 34px 110px rgba(0, 0, 0, .66);
  --sskfm-shadow-soft: 0 18px 52px rgba(0, 0, 0, .24)
}
.sskfm-modal.is-open  {
  display: block!important
}
.sskfm-modal button, .sskfm-modal input, .sskfm-modal textarea,
.sskfm-modal select  {
  font-family: var(--sskfm-sans)!important;
  color: inherit!important;
  box-shadow: none!important;
  text-shadow: none!important;
  text-transform: none!important
}
.sskfm-modal a  {
  color: inherit!important;
  text-decoration: none!important
}
.sskfm-modal button::before, .sskfm-modal button::after  {
  box-sizing: border-box!important
}
.sskfm-backdrop  {
  position: absolute!important;
  inset: 0!important;
  border: 0!important;
  padding: 0!important;
  margin: 0!important;
  background: radial-gradient(circle at 12% 8%, rgba(202, 167, 102, .18), transparent 31%), radial-gradient(circle at 86% 10%, rgba(76, 121,
  160, .22), transparent 38%), radial-gradient(circle at 50% 88%, rgba(202, 167, 102, .10), transparent 34%), rgba(2, 7, 13,
  .80)!important;
  backdrop-filter: blur(14px) saturate(118%)!important;
  -webkit-backdrop-filter: blur(14px) saturate(118%)!important;
  cursor: pointer!important
}
.sskfm-shell  {
  position: absolute!important;
  inset: 18px 12px!important;
  z-index: 1!important;
  width: min(1120px, calc(100vw - 24px))!important;
  height: calc(100dvh - 36px)!important;
  max-height: calc(100dvh - 36px)!important;
  margin: auto!important;
  display: flex!important;
  flex-direction: column!important;
  overflow: hidden!important;
  border: 1px solid var(--sskfm-line-strong)!important;
  border-radius: var(--sskfm-radius-xl)!important;
  background: radial-gradient(circle at 14% 0%, rgba(202, 167, 102, .135), transparent 32%), radial-gradient(circle at 92% 12%, rgba(49, 87,
  124, .12), transparent 38%), radial-gradient(circle at 50% 88%, rgba(142, 100, 42, .055), transparent 36%), linear-gradient(90deg,
  rgba(126, 88, 35, .018) 0 1px, transparent 1px 100%), linear-gradient(145deg, var(--sskfm-bg-2) 0%, var(--sskfm-bg) 52%, rgba(234, 242,
  247, .88) 100%)!important;
  background-size: auto, auto, auto, 56px 56px, auto!important;
  box-shadow: var(--sskfm-shadow)!important;
  color: var(--sskfm-text)!important
}
.sskfm-modal[data-sskfm-theme="dark"] .sskfm-shell,
body.ss-dark-mode .sskfm-modal:not([data-sskfm-theme="light"]) .sskfm-shell,
body[data-theme="dark"] .sskfm-modal:not([data-sskfm-theme="light"]) .sskfm-shell,
html[data-theme="dark"] .sskfm-modal:not([data-sskfm-theme="light"]) .sskfm-shell  {
  background: radial-gradient(circle at 14% 0%, rgba(202, 167, 102, .13), transparent 34%), radial-gradient(circle at 92% 0%, rgba(76, 121,
  160, .14), transparent 38%), radial-gradient(circle at 50% 88%, rgba(202, 167, 102, .08), transparent 36%), linear-gradient(90deg,
  rgba(202, 167, 102, .018) 0 1px, transparent 1px 100%), linear-gradient(145deg, #101d2c 0%, #07111d 52%, #0a1421 100%)!important
}
.sskfm-header  {
  position: relative!important;
  z-index: 5!important;
  flex: 0 0 auto!important;
  display: flex!important;
  align-items: flex-start!important;
  justify-content: space-between!important;
  gap: 18px!important;
  padding: 16px 22px 12px!important;
  border-bottom: 1px solid var(--sskfm-line)!important;
  background: radial-gradient(circle at 14% 0%, rgba(202, 167, 102, .135), transparent 34%), radial-gradient(circle at 92% 0%, rgba(76, 121,
  160, .115), transparent 38%), linear-gradient(180deg, rgba(255, 255, 255, .70), rgba(255, 255, 255, .30)), transparent!important;
  backdrop-filter: blur(16px) saturate(120%)!important;
  -webkit-backdrop-filter: blur(16px) saturate(120%)!important
}
.sskfm-modal[data-sskfm-theme="dark"] .sskfm-header  {
  background: radial-gradient(circle at 14% 0%, rgba(202, 167, 102, .12), transparent 34%), linear-gradient(180deg, rgba(11, 19, 29, .96),
  rgba(11, 19, 29, .88)), transparent!important
}
.sskfm-heading  {
  min-width: 0!important;
  flex: 1 1 auto!important
}
.sskfm-kicker, .sskfm-eyebrow  {
  display: block!important;
  color: var(--sskfm-gold)!important;
  font-size: 10.5px!important;
  line-height: 1.2!important;
  letter-spacing: .16em!important;
  text-transform: uppercase!important;
  font-weight: 800!important
}
.sskfm-title-row  {
  display: flex!important;
  align-items: center!important;
  gap: 10px!important;
  min-width: 0!important
}
.sskfm-title  {
  margin: 6px 0 5px!important;
  font-family: var(--sskfm-serif)!important;
  font-size: clamp(28px, 3.2vw, 42px)!important;
  line-height: 1!important;
  letter-spacing: -.045em!important;
  font-weight: 700!important;
  color: var(--sskfm-text)!important;
  overflow-wrap: anywhere!important
}
.sskfm-subtitle  {
  max-width: 790px!important;
  margin: 0!important;
  color: var(--sskfm-muted)!important;
  font-size: 14px!important;
  line-height: 1.55!important
}


/* ------------------------------------------------------
   HEADER MODE NOTE v1.0.9
------------------------------------------------------ */
.sskfm-mode-note {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
  max-width: 820px !important;
  margin-top: 9px !important;
  padding: 0 !important;
}

.sskfm-mode-note span {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 25px !important;
  padding: 5px 9px !important;
  border: 1px solid var(--sskfm-line) !important;
  border-radius: 999px !important;
  background: var(--sskfm-card) !important;
  color: var(--sskfm-muted) !important;
  font-size: 11px !important;
  line-height: 1 !important;
  font-weight: 720 !important;
  white-space: nowrap !important;
}

.sskfm-header-actions  {
  flex: 0 0 auto!important;
  display: flex!important;
  align-items: flex-start!important;
  gap: 8px!important;
  overflow: visible!important
}
.sskfm-heart, .sskfm-theme, .sskfm-close  {
  appearance: none!important;
  -webkit-appearance: none!important;
  width: 36px!important;
  min-width: 36px!important;
  height: 36px!important;
  min-height: 36px!important;
  display: inline-grid!important;
  place-items: center!important;
  padding: 0!important;
  margin: 0!important;
  border: 1px solid var(--sskfm-line)!important;
  border-radius: 999px!important;
  background: var(--sskfm-card)!important;
  color: var(--sskfm-text)!important;
  cursor: pointer!important;
  line-height: 1!important;
  font-size: 16px!important
}
.sskfm-close  {
  font-size: 21px!important
}
.sskfm-heart.is-active  {
  color: var(--sskfm-gold)!important;
  background: var(--sskfm-gold-3)!important;
  border-color: var(--sskfm-line-strong)!important
}
.sskfm-heart:hover,
.sskfm-theme:hover,
.sskfm-close:hover,
.sskfm-action:hover,
.sskfm-btn:hover,
.sskfm-term-chip:hover,
.sskfm-mini-compare:hover,
.sskfm-icon:hover,
.sskfm-card-fav:hover  {
  border-color: var(--sskfm-line-strong)!important;
  background: radial-gradient(circle at 50% 0%, rgba(202, 167, 102, .22), transparent 64%), linear-gradient(145deg, rgba(202, 167, 102, .18),
  rgba(255, 255, 255, .045))!important;
  color: var(--sskfm-text)!important;
  text-decoration: none!important
}
.sskfm-actions  {
  display: flex!important;
  align-items: center!important;
  gap: 7px!important;
  margin-top: 12px!important;
  overflow-x: auto!important;
  overflow-y: hidden!important;
  scrollbar-width: thin!important;
  scrollbar-color: var(--sskfm-gold) transparent!important;
  padding-bottom: 4px!important
}
.sskfm-action, .sskfm-btn  {
  appearance: none!important;
  -webkit-appearance: none!important;
  display: inline-flex!important;
  align-items: center!important;
  justify-content: center!important;
  width: auto!important;
  min-width: max-content!important;
  min-height: 30px!important;
  padding: 7px 12px!important;
  border: 1px solid var(--sskfm-line)!important;
  border-radius: 999px!important;
  background: var(--sskfm-gold-2)!important;
  color: var(--sskfm-text)!important;
  font-size: 12px!important;
  line-height: 1!important;
  font-weight: 760!important;
  letter-spacing: .01em!important;
  cursor: pointer!important;
  white-space: nowrap!important
}
.sskfm-action.is-family, .sskfm-action.is-map, .sskfm-action.is-kompas,
.sskfm-action.is-compare,
.sskfm-btn  {
  background: var(--sskfm-gold-2)!important;
  border-color: var(--sskfm-line-strong)!important
}
.sskfm-tabs  {
  flex: 0 0 auto!important;
  display: flex!important;
  gap: 8px!important;
  padding: 11px 18px!important;
  border-bottom: 1px solid var(--sskfm-line)!important;
  background: linear-gradient(180deg, var(--sskfm-panel), var(--sskfm-panel-2))!important;
  overflow-x: auto!important;
  scrollbar-width: thin!important
}
.sskfm-tabs button  {
  appearance: none!important;
  flex: 1 0 auto!important;
  min-width: 120px!important;
  min-height: 36px!important;
  border: 1px solid var(--sskfm-line)!important;
  border-radius: 999px!important;
  background: var(--sskfm-card)!important;
  color: var(--sskfm-muted)!important;
  cursor: pointer!important;
  font-size: 11.5px!important;
  font-weight: 820!important;
  text-transform: uppercase!important;
  letter-spacing: .11em!important
}
.sskfm-tabs button.is-active  {
  color: var(--sskfm-text)!important;
  border-color: var(--sskfm-line-strong)!important;
  background: linear-gradient(145deg, var(--sskfm-gold-2), var(--sskfm-card))!important;
  box-shadow: var(--sskfm-shadow-soft)!important
}
.sskfm-body  {
  flex: 1 1 auto!important;
  min-height: 0!important;
  overflow-y: auto!important;
  overflow-x: hidden!important;
  -webkit-overflow-scrolling: touch!important;
  overscroll-behavior: contain!important;
  padding: 18px clamp(16px, 2.2vw, 26px) 28px!important;
  color: var(--sskfm-text)!important;
  background: radial-gradient(circle at 12% 0%, var(--sskfm-gold-2), transparent 30%), linear-gradient(180deg, rgba(255, 255, 255, .12),
  transparent 160px), var(--sskfm-bg)!important
}
.sskfm-loading,
.sskfm-empty  {
  padding: 28px!important;
  border: 1px dashed var(--sskfm-line-strong)!important;
  border-radius: var(--sskfm-radius-lg)!important;
  background: var(--sskfm-card)!important;
  color: var(--sskfm-muted)!important;
  text-align: center!important
}
.sskfm-empty strong  {
  display: block!important;
  color: var(--sskfm-text)!important;
  font-size: 16px!important;
  margin-bottom: 5px!important
}
.sskfm-empty p  {
  margin: 0 0 12px!important;
  color: var(--sskfm-muted)!important
}
.sskfm-hero-card,
.sskfm-panel,
.sskfm-search-card,
.sskfm-search-hub-card,
.sskfm-results-card  {
  border: 1px solid var(--sskfm-line)!important;
  border-radius: var(--sskfm-radius-lg)!important;
  background: linear-gradient(145deg, var(--sskfm-card-2), var(--sskfm-card))!important;
  box-shadow: var(--sskfm-shadow-soft)!important;
  color: var(--sskfm-text)!important
}
.sskfm-hero-card  {
  display: grid!important;
  grid-template-columns: minmax(0, 1fr) minmax(220px, 300px)!important;
  gap: 18px!important;
  align-items: center!important;
  padding: 22px!important;
  margin: 0 0 16px!important
}
.sskfm-hero-card h3  {
  margin: 6px 0 8px!important;
  font-family: var(--sskfm-serif)!important;
  font-size: clamp(24px, 3vw, 36px)!important;
  line-height: 1.02!important;
  letter-spacing: -.035em!important;
  color: var(--sskfm-text)!important
}
.sskfm-hero-card p, .sskfm-panel p, .sskfm-search-copy p,
.sskfm-results-head p  {
  margin: 0!important;
  color: var(--sskfm-muted)!important;
  font-size: 13.5px!important;
  line-height: 1.55!important
}
.sskfm-hero-card aside  {
  padding: 18px!important;
  border: 1px solid var(--sskfm-line-strong)!important;
  border-radius: 22px!important;
  background: var(--sskfm-gold-2)!important
}
.sskfm-hero-card aside span  {
  display: block!important;
  color: var(--sskfm-gold)!important;
  text-transform: uppercase!important;
  letter-spacing: .14em!important;
  font-size: 10px!important;
  font-weight: 850!important;
  margin-bottom: 8px!important
}
.sskfm-hero-card aside strong  {
  display: block!important;
  color: var(--sskfm-text)!important;
  font-size: 20px!important;
  line-height: 1.15!important
}
.sskfm-hero-card aside em  {
  display: block!important;
  margin-top: 8px!important;
  color: var(--sskfm-soft)!important;
  font-style: normal!important;
  font-size: 12px!important
}
.sskfm-grid-two  {
  display: grid!important;
  grid-template-columns: repeat(2, minmax(0, 1fr))!important;
  gap: 14px!important;
  margin: 0 0 14px!important
}
.sskfm-panel  {
  padding: 18px!important;
  min-width: 0!important
}
.sskfm-panel.is-primary  {
  border-color: var(--sskfm-line-strong)!important;
  background: radial-gradient(circle at 0 0, var(--sskfm-gold-2), transparent 44%), var(--sskfm-card)!important
}
.sskfm-panel h4  {
  margin: 7px 0 9px!important;
  color: var(--sskfm-text)!important;
  font-size: 20px!important;
  line-height: 1.15!important;
  font-weight: 850!important
}
.sskfm-panel-head  {
  display: flex!important;
  align-items: flex-start!important;
  justify-content: space-between!important;
  gap: 14px!important;
  margin-bottom: 14px!important
}
.sskfm-chiplist  {
  display: flex!important;
  flex-wrap: wrap!important;
  gap: 8px!important;
  margin-top: 12px!important
}
.sskfm-family-pill, .sskfm-term-chip, .sskfm-mini-compare  {
  display: inline-flex!important;
  align-items: center!important;
  justify-content: center!important;
  min-height: 30px!important;
  border: 1px solid var(--sskfm-line)!important;
  border-radius: 999px!important;
  background: var(--sskfm-card)!important;
  color: var(--sskfm-text)!important;
  padding: 6px 10px!important;
  font-size: 12px!important;
  font-weight: 760!important;
  line-height: 1!important
}
.sskfm-term-chip  {
  cursor: pointer!important
}
.sskfm-mini-compare  {
  width: 30px!important;
  min-width: 30px!important;
  padding: 0!important;
  color: var(--sskfm-gold)!important;
  cursor: pointer!important
}
.sskfm-chiprow  {
  display: inline-flex!important;
  align-items: center!important;
  gap: 4px!important
}
.sskfm-muted  {
  color: var(--sskfm-muted)!important;
  font-style: normal!important;
  font-size: 13px!important
}
.sskfm-mini-guide  {
  display: grid!important;
  grid-template-columns: repeat(3, minmax(0, 1fr))!important;
  gap: 10px!important
}
.sskfm-mini-guide span  {
  display: block!important;
  padding: 12px!important;
  border: 1px solid var(--sskfm-line)!important;
  border-radius: 16px!important;
  background: var(--sskfm-card-soft)!important;
  color: var(--sskfm-muted)!important;
  font-size: 13px!important;
  line-height: 1.45!important
}
.sskfm-mini-guide strong  {
  display: block!important;
  color: var(--sskfm-text)!important;
  margin-bottom: 3px!important
}
.sskfm-search-card  {
  display: grid!important;
  grid-template-columns: minmax(260px, 1fr) minmax(360px, 1.35fr)!important;
  gap: 18px!important;
  align-items: end!important;
  padding: 18px!important;
  margin: 0 0 14px!important
}
.sskfm-search-copy h4, .sskfm-results-head h4  {
  margin: 7px 0 5px!important;
  font-size: 18px!important;
  line-height: 1.15!important;
  color: var(--sskfm-text)!important
}
.sskfm-scope  {
  display: flex!important;
  flex-wrap: wrap!important;
  gap: 8px!important;
  align-items: center!important;
  margin-top: 12px!important;
  color: var(--sskfm-soft)!important;
  text-transform: uppercase!important;
  font-size: 10.5px!important;
  font-weight: 850!important;
  letter-spacing: .08em!important
}
.sskfm-scope strong  {
  display: inline-flex!important;
  align-items: center!important;
  min-height: 28px!important;
  border: 1px solid var(--sskfm-line-strong)!important;
  border-radius: 999px!important;
  padding: 6px 10px!important;
  color: var(--sskfm-text)!important;
  background: var(--sskfm-gold-2)!important;
  text-transform: none!important;
  letter-spacing: 0!important;
  font-size: 12px!important
}
.sskfm-search-controls  {
  display: grid!important;
  grid-template-columns: minmax(180px, 260px) minmax(220px, 1fr) auto!important;
  gap: 10px!important;
  min-width: 0!important
}
.sskfm-search-controls select, .sskfm-search-controls input  {
  appearance: none!important;
  -webkit-appearance: none!important;
  width: 100%!important;
  min-width: 0!important;
  min-height: 42px!important;
  border: 1px solid var(--sskfm-line)!important;
  border-radius: 999px!important;
  background: var(--sskfm-card-2)!important;
  color: var(--sskfm-text)!important;
  padding: 10px 14px!important;
  font-size: 14px!important;
  outline: none!important
}
.sskfm-search-controls select  {
  padding-right: 30px!important;
  background-image: linear-gradient(45deg, transparent 50%, var(--sskfm-gold) 50%), linear-gradient(135deg, var(--sskfm-gold) 50%,
  transparent 50%)!important;
  background-position: calc(100% - 18px) 18px, calc(100% - 13px) 18px!important;
  background-size: 5px 5px, 5px 5px!important;
  background-repeat: no-repeat!important
}
.sskfm-search-controls input::placeholder  {
  color: var(--sskfm-soft)!important
}
.sskfm-search-controls select:focus, .sskfm-search-controls input:focus  {
  border-color: var(--sskfm-line-strong)!important;
  box-shadow: 0 0 0 3px var(--sskfm-gold-2)!important
}
.sskfm-search-controls select option  {
  background: #fffaf2!important;
  color: #172235!important
}
.sskfm-modal[data-sskfm-theme="dark"] .sskfm-search-controls select option  {
  background: #0d1b28!important;
  color: #eef4ff!important
}
.sskfm-search-controls button  {
  appearance: none!important;
  min-height: 42px!important;
  border: 1px solid var(--sskfm-line)!important;
  border-radius: 999px!important;
  background: var(--sskfm-card)!important;
  color: var(--sskfm-muted)!important;
  padding: 10px 14px!important;
  font-size: 11px!important;
  font-weight: 850!important;
  letter-spacing: .08em!important;
  text-transform: uppercase!important;
  cursor: pointer!important
}
.sskfm-results-card  {
  padding: 18px!important
}
.sskfm-results-head  {
  display: flex!important;
  justify-content: space-between!important;
  align-items: flex-start!important;
  gap: 14px!important;
  margin-bottom: 14px!important
}
.sskfm-result-tools  {
  display: flex!important;
  align-items: center!important;
  gap: 8px!important;
  color: var(--sskfm-muted)!important;
  font-size: 12px!important;
  white-space: nowrap!important
}
.sskfm-result-tools button  {
  appearance: none!important;
  min-height: 32px!important;
  border: 1px solid var(--sskfm-line-strong)!important;
  border-radius: 999px!important;
  background: var(--sskfm-gold-2)!important;
  color: var(--sskfm-text)!important;
  padding: 7px 12px!important;
  font-size: 11px!important;
  font-weight: 850!important;
  cursor: pointer!important
}
.sskfm-card-grid  {
  display: grid!important;
  grid-template-columns: repeat(3, minmax(0, 1fr))!important;
  gap: 12px!important
}
.sskfm-term-card  {
  position: relative!important;
  min-width: 0!important;
  min-height: 154px!important;
  padding: 16px!important;
  border: 1px solid var(--sskfm-line)!important;
  border-radius: 20px!important;
  background: linear-gradient(145deg, var(--sskfm-card-2), var(--sskfm-card))!important;
  box-shadow: 0 12px 28px rgba(0, 0, 0, .045)!important;
  cursor: pointer!important
}
.sskfm-term-card:hover  {
  border-color: var(--sskfm-line-strong)!important;
  transform: translateY(-1px)!important
}
.sskfm-term-card h5  {
  margin: 0 38px 9px 0!important;
  color: var(--sskfm-text)!important;
  font-size: 15px!important;
  line-height: 1.22!important;
  font-weight: 850!important;
  overflow-wrap: anywhere!important
}
.sskfm-term-card p  {
  margin: 8px 0 12px!important;
  color: var(--sskfm-muted)!important;
  font-size: 12px!important;
  line-height: 1.35!important
}
.sskfm-role  {
  display: inline-flex!important;
  align-items: center!important;
  min-height: 24px!important;
  border: 1px solid var(--sskfm-line)!important;
  border-radius: 999px!important;
  background: var(--sskfm-card-soft)!important;
  color: var(--sskfm-soft)!important;
  padding: 5px 9px!important;
  font-size: 10px!important;
  font-weight: 850!important;
  letter-spacing: .08em!important;
  text-transform: uppercase!important
}
.sskfm-card-fav  {
  position: absolute!important;
  right: 12px!important;
  top: 12px!important;
  width: 30px!important;
  height: 30px!important;
  border: 1px solid var(--sskfm-line)!important;
  border-radius: 999px!important;
  background: var(--sskfm-card)!important;
  color: var(--sskfm-soft)!important;
  display: grid!important;
  place-items: center!important;
  cursor: pointer!important;
  padding: 0!important
}
.sskfm-card-fav.is-active  {
  color: var(--sskfm-gold)!important;
  background: var(--sskfm-gold-2)!important;
  border-color: var(--sskfm-line-strong)!important
}
.sskfm-card-actions  {
  display: flex!important;
  align-items: center!important;
  gap: 7px!important;
  margin-top: 10px!important;
  padding-top: 10px!important;
  border-top: 1px solid var(--sskfm-line)!important
}
.sskfm-icon  {
  appearance: none!important;
  width: 31px!important;
  height: 31px!important;
  min-width: 31px!important;
  border: 1px solid var(--sskfm-line)!important;
  border-radius: 999px!important;
  background: var(--sskfm-card)!important;
  color: var(--sskfm-text)!important;
  display: inline-grid!important;
  place-items: center!important;
  padding: 0!important;
  cursor: pointer!important;
  font-size: 13px!important;
  line-height: 1!important
}
.sskfm-icon.is-compare  {
  color: var(--sskfm-gold)!important;
  border-color: var(--sskfm-line-strong)!important;
  background: var(--sskfm-gold-2)!important
}
.sskfm-more-wrap  {
  display: flex!important;
  justify-content: center!important;
  margin-top: 16px!important
}
.sskfm-modal mark  {
  border-radius: 5px!important;
  background: rgba(202, 167, 102, .24)!important;
  color: inherit!important;
  padding: 0 3px!important
}
.sskfm-compare-path  {
  margin-top: 14px!important
}
.sskfm-compare-grid  {
  display: grid!important;
  grid-template-columns: repeat(2, minmax(0, 1fr))!important;
  gap: 12px!important
}
.sskfm-compare-grid article  {
  padding: 14px!important;
  border: 1px solid var(--sskfm-line)!important;
  border-radius: 18px!important;
  background: var(--sskfm-card-soft)!important
}
.sskfm-compare-grid article p  {
  margin: 7px 0 10px!important
}
.sskfm-modal .ss-ds-kbd-card-action.is-family, .ss-ds-kbd-card-action.is-family  {
  color: #8e642a!important;
  background: rgba(142, 100, 42, .12)!important
}
.sskfm-modal[data-sskfm-theme="dark"] .ss-ds-kbd-card-action.is-family,
body.ss-dark-mode .ss-ds-kbd-card-action.is-family  {
  color: #caa766!important;
  background: rgba(202, 167, 102, .13)!important
}
.ss-ds-kbd-action-link.is-family,
.sskp-action.is-family,
.sskbds-map-head-link.is-family,
.sskc-action.is-family  {
  border-color: rgba(142, 100, 42, .28)!important;
  background: rgba(142, 100, 42, .12)!important;
  color: inherit!important
}
.ss-ds-kbd-action-link.is-family:hover, .sskp-action.is-family:hover,
.sskbds-map-head-link.is-family:hover,
.sskc-action.is-family:hover  {
  border-color: rgba(142, 100, 42, .42)!important;
  background: rgba(142, 100, 42, .20)!important
}
/* ------------------------------------------------------
   v1.0.4 — Trail / Favorite / Search Hub
------------------------------------------------------ */
.sskfm-search-hub  {
  display: grid !important;
  grid-template-columns: minmax(320px, 1.35fr) minmax(220px, 0.82fr) minmax(220px, 0.82fr) !important;
  gap: 12px !important;
  align-items: stretch !important;
  margin: 0 0 14px !important;
}
.sskfm-search-hub-card  {
  min-width: 0 !important;
  padding: 16px !important;
}
.sskfm-search-hub-card.is-search  {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 12px !important;
}
.sskfm-search-hub-card h4  {
  margin: 7px 0 7px !important;
  color: var(--sskfm-text) !important;
  font-size: 17px !important;
  line-height: 1.15 !important;
  font-weight: 850 !important;
}
.sskfm-search-hub-card .sskfm-muted  {
  display: block !important;
  margin: 10px 0 0 !important;
  padding: 12px !important;
  border: 1px dashed var(--sskfm-line) !important;
  border-radius: 14px !important;
  background: var(--sskfm-card-soft) !important;
  color: var(--sskfm-muted) !important;
  font-size: 12.5px !important;
  line-height: 1.45 !important;
}
.sskfm-quick-list  {
  display: grid !important;
  gap: 8px !important;
  margin-top: 10px !important;
}
.sskfm-quick-item  {
  appearance: none !important;
  -webkit-appearance: none !important;
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  padding: 10px 11px !important;
  border: 1px solid var(--sskfm-line) !important;
  border-radius: 14px !important;
  background: var(--sskfm-card-soft) !important;
  color: var(--sskfm-text) !important;
  cursor: pointer !important;
  text-align: left !important;
  line-height: 1.2 !important;
}
.sskfm-quick-item:hover,
.sskfm-quick-item:focus-visible  {
  border-color: var(--sskfm-line-strong) !important;
  background:
  radial-gradient(circle at 0% 0%, var(--sskfm-gold-2), transparent 70%),
  var(--sskfm-card) !important;
  outline: none !important;
}
.sskfm-quick-item strong  {
  display: block !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  color: var(--sskfm-text) !important;
  font-size: 13px !important;
  font-weight: 850 !important;
}
.sskfm-quick-item span  {
  display: block !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  margin-top: 3px !important;
  color: var(--sskfm-soft) !important;
  font-size: 10.5px !important;
}
@media(max-width: 980px)  {
  .sskfm-search-hub  {
    grid-template-columns: 1fr !important;
  }
}
@media(max-width: 920px)  {
  .sskfm-hero-card, .sskfm-search-card  {
    grid-template-columns: 1fr!important
  }
  .sskfm-card-grid  {
    grid-template-columns: repeat(2, minmax(0, 1fr))!important
  }
  .sskfm-grid-two, .sskfm-compare-grid  {
    grid-template-columns: 1fr!important
  }
  .sskfm-mini-guide  {
    grid-template-columns: 1fr!important
  }
  .sskfm-search-controls  {
    grid-template-columns: 1fr!important
  }
  .sskfm-results-head  {
    display: block!important
  }
  .sskfm-result-tools  {
    margin-top: 10px!important
  }
}
@media(max-width: 620px)  {
  .sskfm-shell  {
    inset: 0!important;
    width: 100vw!important;
    height: 100dvh!important;
    max-height: 100dvh!important;
    border-radius: 0!important;
    border-left: 0!important;
    border-right: 0!important
  }
  .sskfm-header  {
    padding: 14px 14px 11px!important
  }
  .sskfm-title  {
    font-size: 32px!important
  }
  .sskfm-subtitle  {
    font-size: 13px!important
  }
  .sskfm-header-actions  {
    gap: 6px!important
  }
  .sskfm-heart, .sskfm-theme, .sskfm-close  {
    width: 34px!important;
    height: 34px!important;
    min-width: 34px!important;
    min-height: 34px!important
  }
  .sskfm-tabs  {
    padding: 9px 10px!important
  }
  .sskfm-tabs button  {
    min-width: 96px!important;
    font-size: 10.5px!important
  }
  .sskfm-body  {
    padding: 14px!important
  }
  .sskfm-card-grid  {
    grid-template-columns: 1fr!important
  }
  .sskfm-hero-card  {
    padding: 16px!important
  }
  .sskfm-hero-card h3  {
    font-size: 28px!important
  }
  .sskfm-panel, .sskfm-results-card, .sskfm-search-card  {
    padding: 14px!important
  }
  .sskfm-actions  {
    gap: 6px!important
  }
  .sskfm-action  {
    font-size: 11px!important;
    padding: 7px 10px!important
  }
  .sskfm-chiplist  {
    gap: 6px!important
  }
  .sskfm-term-chip, .sskfm-family-pill  {
    font-size: 11.5px!important
  }
  .sskfm-card-actions  {
    gap: 6px!important
  }
  .sskfm-icon  {
    width: 30px!important;
    height: 30px!important;
    min-width: 30px!important
  }
}
/* ------------------------------------------------------
   v1.0.5 — Search Hub Scroll Polish
   - Follows the existing KBDS popup search/jejak/favorit grammar.
   - Keeps the Family Map Search Hub inside its card.
   - Adds bounded vertical scroll areas for Jejak and Favorit.
   - Polishes the main popup scrollbar.
------------------------------------------------------ */
.sskfm-body  {
  scrollbar-width: thin !important;
  scrollbar-color: var(--sskfm-gold) transparent !important;
}
.sskfm-body::-webkit-scrollbar  {
  width: 8px !important;
}
.sskfm-body::-webkit-scrollbar-track  {
  background: transparent !important;
}
.sskfm-body::-webkit-scrollbar-thumb  {
  min-height: 46px !important;
  border-radius: 999px !important;
  background: var(--sskfm-gold) !important;
}
.sskfm-body::-webkit-scrollbar-thumb:hover  {
  background: var(--sskfm-line-strong) !important;
}
.sskfm-tabs::-webkit-scrollbar,
.sskfm-actions::-webkit-scrollbar  {
  height: 7px !important;
}
.sskfm-tabs::-webkit-scrollbar-track,
.sskfm-actions::-webkit-scrollbar-track  {
  background: transparent !important;
}
.sskfm-tabs::-webkit-scrollbar-thumb,
.sskfm-actions::-webkit-scrollbar-thumb  {
  border-radius: 999px !important;
  background: var(--sskfm-gold) !important;
}
.sskfm-search-hub  {
  display: grid !important;
  grid-template-columns: minmax(0, 1.08fr) minmax(0, 0.96fr) minmax(0, 0.96fr) !important;
  gap: 12px !important;
  align-items: stretch !important;
  margin: 0 0 14px !important;
  min-width: 0 !important;
}
.sskfm-search-hub-card  {
  min-width: 0 !important;
  max-width: 100% !important;
  min-height: 0 !important;
  padding: 16px !important;
  overflow: hidden !important;
}
.sskfm-search-hub-card.is-search,
.sskfm-search-hub-card.is-trail,
.sskfm-search-hub-card.is-favorites  {
  display: flex !important;
  flex-direction: column !important;
}
.sskfm-search-hub-card.is-search  {
  justify-content: flex-start !important;
}
.sskfm-search-hub-card.is-trail,
.sskfm-search-hub-card.is-favorites  {
  max-height: clamp(238px, 28dvh, 320px) !important;
}
.sskfm-search-hub-card h4  {
  flex: 0 0 auto !important;
  margin: 7px 0 7px !important;
}
.sskfm-search-hub-card .sskfm-eyebrow  {
  flex: 0 0 auto !important;
}
.sskfm-search-hub-card .sskfm-muted  {
  flex: 0 0 auto !important;
}
.sskfm-search-hub .sskfm-search-copy  {
  min-width: 0 !important;
  max-width: 100% !important;
}
.sskfm-search-hub .sskfm-search-copy p  {
  max-width: 100% !important;
}
.sskfm-search-hub .sskfm-scope  {
  min-width: 0 !important;
  max-width: 100% !important;
}
.sskfm-search-hub .sskfm-scope strong  {
  max-width: 100% !important;
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}
.sskfm-search-hub .sskfm-search-controls  {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 9px !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  margin-top: 12px !important;
}
.sskfm-search-hub .sskfm-search-controls select,
.sskfm-search-hub .sskfm-search-controls input,
.sskfm-search-hub .sskfm-search-controls button  {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  min-height: 38px !important;
  box-sizing: border-box !important;
}
.sskfm-search-hub .sskfm-search-controls select,
.sskfm-search-hub .sskfm-search-controls input  {
  padding-top: 9px !important;
  padding-bottom: 9px !important;
  font-size: 13px !important;
}
.sskfm-search-hub .sskfm-search-controls select  {
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  background-position: calc(100% - 18px) 16px, calc(100% - 13px) 16px !important;
}
.sskfm-search-hub .sskfm-search-controls button  {
  justify-content: center !important;
  padding: 9px 12px !important;
}
.sskfm-quick-list  {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  max-height: clamp(158px, 20dvh, 232px) !important;
  margin-top: 10px !important;
  padding-right: 4px !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  overscroll-behavior: contain !important;
  scrollbar-width: thin !important;
  scrollbar-color: var(--sskfm-gold) transparent !important;
}
.sskfm-quick-list::-webkit-scrollbar  {
  width: 7px !important;
}
.sskfm-quick-list::-webkit-scrollbar-track  {
  background: transparent !important;
}
.sskfm-quick-list::-webkit-scrollbar-thumb  {
  min-height: 34px !important;
  border-radius: 999px !important;
  background: var(--sskfm-gold) !important;
}
.sskfm-quick-list::-webkit-scrollbar-thumb:hover  {
  background: var(--sskfm-line-strong) !important;
}
.sskfm-quick-item  {
  max-width: 100% !important;
  min-height: 54px !important;
}
.sskfm-quick-item strong,
.sskfm-quick-item span  {
  max-width: 100% !important;
}
.sskfm-results-card  {
  clear: both !important;
}
@media (min-width: 1180px)  {
  .sskfm-search-hub  {
    grid-template-columns: minmax(0, 1.18fr) minmax(0, 0.91fr) minmax(0, 0.91fr) !important;
  }
}
@media (max-width: 980px)  {
  .sskfm-search-hub  {
    grid-template-columns: 1fr !important;
  }
  .sskfm-search-hub-card.is-trail,
  .sskfm-search-hub-card.is-favorites  {
    max-height: none !important;
  }
  .sskfm-quick-list  {
    max-height: clamp(160px, 24dvh, 240px) !important;
  }
}
@media (max-width: 620px)  {
  .sskfm-search-hub  {
    gap: 10px !important;
  }
  .sskfm-search-hub-card  {
    padding: 14px !important;
  }
  .sskfm-search-hub .sskfm-search-controls  {
    gap: 8px !important;
  }
  .sskfm-quick-list  {
    max-height: 210px !important;
  }
}
/* ------------------------------------------------------
   INLINE SEARCH RESULT PARITY v1.0.6
------------------------------------------------------ */
.sskfm-inline-search  {
  flex: 0 0 auto !important;
  margin-top: 12px !important;
  padding-top: 12px !important;
  border-top: 1px solid var(--sskfm-line) !important;
}
.sskfm-inline-search[hidden]  {
  display: none !important;
}
.sskfm-inline-search-label  {
  display: block !important;
  margin: 0 0 7px !important;
  color: var(--sskfm-gold) !important;
  font-size: 10px !important;
  line-height: 1.2 !important;
  letter-spacing: 0.16em !important;
  text-transform: uppercase !important;
  font-weight: 800 !important;
}
.sskfm-inline-search.is-empty p  {
  margin: 0 !important;
  color: var(--sskfm-muted) !important;
  font-size: 12.5px !important;
  line-height: 1.45 !important;
}
.sskfm-inline-search-list  {
  display: grid !important;
  gap: 6px !important;
  max-height: clamp(138px, 18dvh, 214px) !important;
  min-height: 0 !important;
  padding-right: 4px !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  overscroll-behavior: contain !important;
  scrollbar-width: thin !important;
  scrollbar-color: var(--sskfm-gold) transparent !important;
}
.sskfm-inline-search-list::-webkit-scrollbar  {
  width: 7px !important;
}
.sskfm-inline-search-list::-webkit-scrollbar-track  {
  background: transparent !important;
}
.sskfm-inline-search-list::-webkit-scrollbar-thumb  {
  min-height: 34px !important;
  border-radius: 999px !important;
  background: var(--sskfm-gold) !important;
}
.sskfm-inline-search-item  {
  appearance: none !important;
  -webkit-appearance: none !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  gap: 12px !important;
  align-items: center !important;
  width: 100% !important;
  max-width: 100% !important;
  min-height: 42px !important;
  margin: 0 !important;
  padding: 9px 11px !important;
  border: 1px solid var(--sskfm-line) !important;
  border-radius: 14px !important;
  background: var(--sskfm-card-2) !important;
  color: var(--sskfm-text) !important;
  cursor: pointer !important;
  text-align: left !important;
  box-shadow: none !important;
}
.sskfm-inline-search-item:hover,
.sskfm-inline-search-item:focus-visible  {
  border-color: var(--sskfm-line-strong) !important;
  background: var(--sskfm-gold-2) !important;
  outline: none !important;
}
.sskfm-inline-search-item strong  {
  display: block !important;
  min-width: 0 !important;
  overflow: hidden !important;
  color: var(--sskfm-text) !important;
  font-size: 13.2px !important;
  line-height: 1.2 !important;
  font-weight: 800 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}
.sskfm-inline-search-item span  {
  display: block !important;
  max-width: 150px !important;
  overflow: hidden !important;
  color: var(--sskfm-soft) !important;
  font-size: 10.6px !important;
  line-height: 1.2 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}
.sskfm-inline-search-item mark  {
  padding: 0 2px !important;
  border-radius: 4px !important;
  background: var(--sskfm-gold-2) !important;
  color: var(--sskfm-text) !important;
}
@media (max-width: 620px)  {
  .sskfm-inline-search-list  {
    max-height: 190px !important;
  }
  .sskfm-inline-search-item  {
    grid-template-columns: minmax(0, 1fr) !important;
  }
  .sskfm-inline-search-item span  {
    max-width: 100% !important;
  }
}
/* ------------------------------------------------------
   INLINE SEARCH LAYOUT PARITY v1.0.7
------------------------------------------------------ */
.sskfm-search-hub  {
  align-items: stretch !important;
}
.sskfm-search-hub-card.is-search,
.sskfm-search-hub-card.is-trail,
.sskfm-search-hub-card.is-favorites  {
  height: clamp(332px, 38dvh, 430px) !important;
  min-height: 332px !important;
  max-height: 430px !important;
}
.sskfm-search-hub-card.is-trail,
.sskfm-search-hub-card.is-favorites  {
  justify-content: flex-start !important;
}
.sskfm-search-hub .sskfm-search-controls  {
  margin-top: 12px !important;
  gap: 8px !important;
}
.sskfm-search-hub .sskfm-search-controls button  {
  display: none !important;
}
.sskfm-inline-search  {
  margin-top: 8px !important;
  padding-top: 0 !important;
  border-top: 0 !important;
}
.sskfm-inline-search-label  {
  display: none !important;
}
.sskfm-inline-search-list  {
  max-height: clamp(128px, 15dvh, 190px) !important;
}
.sskfm-inline-search.is-empty  {
  padding: 11px 13px !important;
  border: 1px dashed var(--sskfm-line) !important;
  border-radius: 16px !important;
  background: rgba(255, 255, 255, 0.18) !important;
}
.sskfm-inline-search.is-empty p  {
  margin: 0 !important;
}
.sskfm-quick-list  {
  flex: 1 1 auto !important;
  max-height: none !important;
}
@media (max-width: 980px)  {
  .sskfm-search-hub-card.is-search,
  .sskfm-search-hub-card.is-trail,
  .sskfm-search-hub-card.is-favorites  {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
  }
  .sskfm-quick-list  {
    max-height: clamp(160px, 24dvh, 240px) !important;
  }
}
@media (max-width: 620px)  {
  .sskfm-inline-search-list  {
    max-height: 190px !important;
  }
}


/* ------------------------------------------------------
   INLINE SEARCH OVERFLOW FIX v1.0.8
   - Remove redundant scope badge from Search column.
   - Give inline results a real internal scroll lane.
   - Keep three-column desktop layout from v1.0.5–v1.0.7.
------------------------------------------------------ */
.sskfm-search-hub-card.is-search {
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;
}

.sskfm-search-hub-card.is-search .sskfm-search-copy {
  flex: 0 0 auto !important;
}

.sskfm-search-hub-card.is-search .sskfm-search-controls {
  flex: 0 0 auto !important;
}

.sskfm-search-hub .sskfm-scope {
  display: none !important;
}

.sskfm-inline-search {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  margin-top: 8px !important;
  padding-top: 0 !important;
  border-top: 0 !important;
  overflow: hidden !important;
}

.sskfm-inline-search[hidden] {
  display: none !important;
}

.sskfm-inline-search-list {
  height: 100% !important;
  max-height: none !important;
  min-height: 0 !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  overscroll-behavior: contain !important;
}

.sskfm-inline-search.is-empty {
  flex: 0 0 auto !important;
  padding: 11px 13px !important;
  border: 1px dashed var(--sskfm-line) !important;
  border-radius: 16px !important;
  background: rgba(255, 255, 255, 0.18) !important;
}

.sskfm-inline-search.is-empty p {
  margin: 0 !important;
}

@media (max-width: 980px) {
  .sskfm-search-hub-card.is-search {
    overflow: visible !important;
  }

  .sskfm-inline-search {
    flex: 0 0 auto !important;
    overflow: visible !important;
  }

  .sskfm-inline-search-list {
    max-height: 220px !important;
    overflow-y: auto !important;
  }
}


/* ------------------------------------------------------
   PRODUCTION POLISH v1.0.9
   - compact clear button for active search
   - editorial fallback states
   - focus-safe keyboard parity
------------------------------------------------------ */
.sskfm-search-input-wrap {
  position: relative !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
}

.sskfm-search-input-wrap input[data-sskfm-search-input] {
  padding-right: 42px !important;
}

.sskfm-search-clear {
  position: absolute !important;
  top: 50% !important;
  right: 8px !important;
  z-index: 3 !important;
  transform: translateY(-50%) !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  width: 26px !important;
  min-width: 26px !important;
  height: 26px !important;
  min-height: 26px !important;
  display: inline-grid !important;
  place-items: center !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 1px solid var(--sskfm-line) !important;
  border-radius: 999px !important;
  background: var(--sskfm-card) !important;
  color: var(--sskfm-muted) !important;
  cursor: pointer !important;
  font-size: 17px !important;
  line-height: 1 !important;
  font-weight: 760 !important;
}

.sskfm-search-clear:hover,
.sskfm-search-clear:focus-visible {
  border-color: var(--sskfm-line-strong) !important;
  background: var(--sskfm-gold-2) !important;
  color: var(--sskfm-text) !important;
  outline: none !important;
}

.sskfm-empty {
  text-align: left !important;
}

.sskfm-empty .sskfm-btn {
  margin-top: 12px !important;
}

@media (max-width: 680px) {
  .sskfm-mode-note {
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    padding-bottom: 4px !important;
    scrollbar-width: thin !important;
    scrollbar-color: var(--sskfm-gold) transparent !important;
  }

  .sskfm-mode-note::-webkit-scrollbar {
    height: 6px !important;
  }

  .sskfm-mode-note::-webkit-scrollbar-track {
    background: transparent !important;
  }

  .sskfm-mode-note::-webkit-scrollbar-thumb {
    border-radius: 999px !important;
    background: var(--sskfm-gold) !important;
  }
}

/* ------------------------------------------------------
   v1.1.2 — Related Meta + Family Navigation Fix
------------------------------------------------------ */
.sskfm-grid-two.is-home-profile {
  align-items: stretch !important;
}

.sskfm-family-profile {
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
}

.sskfm-family-profile h4 {
  margin-bottom: 4px !important;
}

.sskfm-profile-hint {
  padding: 12px 13px !important;
  border: 1px solid var(--sskfm-line) !important;
  border-radius: 16px !important;
  background: var(--sskfm-card-soft) !important;
}

.sskfm-example-terms {
  margin: 2px 0 4px !important;
}

.sskfm-example-terms .sskfm-eyebrow {
  margin-bottom: 8px !important;
}

.sskfm-corpus-panel {
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
}

.sskfm-corpus-badges {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 7px !important;
}

.sskfm-corpus-badges span {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 28px !important;
  padding: 6px 10px !important;
  border: 1px solid var(--sskfm-line) !important;
  border-radius: 999px !important;
  background: var(--sskfm-gold-2) !important;
  color: var(--sskfm-text) !important;
  font-size: 11px !important;
  font-weight: 780 !important;
  line-height: 1 !important;
}

.sskfm-corpus-numbers {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 8px !important;
}

.sskfm-corpus-numbers span {
  display: block !important;
  min-width: 0 !important;
  padding: 10px 11px !important;
  border: 1px solid var(--sskfm-line) !important;
  border-radius: 15px !important;
  background: var(--sskfm-card-soft) !important;
}

.sskfm-corpus-numbers strong {
  display: block !important;
  color: var(--sskfm-text) !important;
  font-size: 19px !important;
  line-height: 1.05 !important;
  font-weight: 880 !important;
  letter-spacing: -.02em !important;
}

.sskfm-corpus-numbers em {
  display: block !important;
  margin-top: 4px !important;
  color: var(--sskfm-soft) !important;
  font-size: 10.5px !important;
  line-height: 1.25 !important;
  font-style: normal !important;
}

.sskfm-corpus-bars {
  display: grid !important;
  gap: 9px !important;
}

.sskfm-corpus-bar {
  display: grid !important;
  gap: 5px !important;
}

.sskfm-corpus-bar > div {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
}

.sskfm-corpus-bar span {
  color: var(--sskfm-muted) !important;
  font-size: 11px !important;
  font-weight: 760 !important;
  line-height: 1.2 !important;
}

.sskfm-corpus-bar strong {
  color: var(--sskfm-text) !important;
  font-size: 11px !important;
  font-weight: 820 !important;
  line-height: 1.2 !important;
  white-space: nowrap !important;
}

.sskfm-corpus-bar i {
  display: block !important;
  height: 8px !important;
  overflow: hidden !important;
  border: 1px solid var(--sskfm-line) !important;
  border-radius: 999px !important;
  background: rgba(0, 0, 0, .045) !important;
}

.sskfm-corpus-bar b {
  display: block !important;
  height: 100% !important;
  border-radius: 999px !important;
  background: linear-gradient(90deg, var(--sskfm-gold), rgba(154, 113, 58, .42)) !important;
}

.sskfm-related-profile {
  margin: 0 0 14px !important;
}

.sskfm-related-family-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 10px !important;
  margin-top: 14px !important;
}

.sskfm-related-family-card {
  min-width: 0 !important;
  padding: 13px 14px !important;
  border: 1px solid var(--sskfm-line) !important;
  border-radius: 17px !important;
  background: var(--sskfm-card-soft) !important;
}

.sskfm-related-family-card strong {
  display: block !important;
  color: var(--sskfm-text) !important;
  font-size: 13px !important;
  line-height: 1.25 !important;
  font-weight: 850 !important;
  margin-bottom: 5px !important;
}

.sskfm-related-family-card p {
  margin: 0 !important;
  color: var(--sskfm-muted) !important;
  font-size: 12.5px !important;
  line-height: 1.48 !important;
}

@media (max-width: 760px) {
  .sskfm-corpus-numbers {
    grid-template-columns: 1fr !important;
  }

  .sskfm-related-family-grid {
    grid-template-columns: 1fr !important;
  }

  .sskfm-corpus-bar > div {
    align-items: flex-start !important;
    flex-direction: column !important;
    gap: 4px !important;
  }
}


/* v1.1.2 — Related Meta + Family Navigation Fix */
.sskfm-profile-risk {
  margin: 10px 0 0 !important;
  padding: 10px 12px !important;
  border: 1px solid var(--sskfm-line) !important;
  border-radius: 14px !important;
  background: var(--sskfm-card-soft) !important;
  color: var(--sskfm-muted) !important;
  font-size: 12.5px !important;
  line-height: 1.55 !important;
}