/* =========================================================
   Keyword-Dichte Analyse – Styles (Basis: assets/css/tool-ui.css)
   ========================================================= */
.kd .tu-card__head { flex-wrap: wrap; }
.kd-meta { font-size: 12.5px; color: var(--muted); font-variant-numeric: tabular-nums; }
.kd-area {
  display: block; width: 100%; height: 260px; padding: 14px 16px; border-radius: 14px; resize: vertical;
  font-family: inherit; font-size: 15px; line-height: 1.6; color: var(--ink); background: #fff; border: 1.5px solid rgba(15,19,48,.12); outline: 0;
}
.kd-area:focus { border-color: var(--blue); box-shadow: 0 0 0 4px rgba(91,140,255,.15); }
.kd-html { margin-top: 10px; }
.kd-html[hidden] { display: none; }
.kd-opts { margin-top: 14px; align-items: end; }
.kd-switches { padding-bottom: 10px; }
.kd-switches small { color: var(--muted); }
.kd-tabs { margin: 0; padding: 0; border: 0; }

/* Tabelle */
.kd-table { width: 100%; border-collapse: collapse; font-size: 14px; font-variant-numeric: tabular-nums; }
.kd-table th { padding: 8px 10px; text-align: left; font-size: 11.5px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--muted); border-bottom: 1px solid rgba(15,19,48,.08); }
.kd-table th:nth-child(n+3), .kd-table td:nth-child(n+3) { text-align: right; white-space: nowrap; }
.kd-table td { padding: 7px 10px; border-bottom: 1px solid rgba(15,19,48,.05); vertical-align: middle; }
.kd-table td:first-child { width: 36px; color: var(--muted); font-size: 12px; }
.kd-table td:nth-child(2) { position: relative; }
.kd-table tr.is-marked td { background: rgba(255,214,102,.18); }
.kd-term { position: relative; z-index: 1; font-weight: 600; color: var(--ink); text-align: left; overflow-wrap: anywhere; }
.kd-term:hover { color: var(--blue); text-decoration: underline; text-underline-offset: 2px; }
.kd-bar { position: absolute; left: 10px; right: 10px; bottom: 3px; height: 3px; border-radius: 3px; background: linear-gradient(90deg, rgba(91,140,255,.55) var(--w), transparent var(--w)); }
.kd-empty { padding: 14px 0; font-size: 14px; color: var(--muted); }
.kd-empty[hidden], .kd-more[hidden] { display: none; }
.kd-more { margin-top: 12px; }

/* Markierter Text */
#kdMarkCard[hidden] { display: none; }
.kd-marked { max-height: 420px; overflow: auto; padding: 14px 16px; border-radius: 14px; font-size: 15px; line-height: 1.7; color: var(--text); background: #fff; border: 1px solid rgba(15,19,48,.08); overflow-wrap: anywhere; }
.kd-marked mark { padding: 0 2px; border-radius: 4px; background: #ffe58a; color: var(--ink); }

/* Überblick */
.kd-stats { margin: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.kd-stats div { padding: 10px 12px; border-radius: 12px; background: rgba(15,19,48,.035); }
.kd-stats dt { font-size: 11.5px; font-weight: 600; color: var(--muted); }
.kd-stats dd { margin: 2px 0 0; font-size: 18px; font-weight: 700; color: var(--ink); font-variant-numeric: tabular-nums; }
.kd-read { margin-top: 14px; display: grid; gap: 8px; }
.kd-score { display: flex; align-items: center; gap: 14px; }
.kd-score b {
  display: grid; place-items: center; width: 64px; height: 64px; border-radius: 50%; font-size: 22px; color: var(--ink);
  background: radial-gradient(closest-side, #fff 78%, transparent 80% 100%), conic-gradient(var(--blue) calc(var(--p) * 1%), rgba(15,19,48,.08) 0);
}
.kd-score span { font-size: 13px; color: var(--muted); }
.kd-score strong { color: var(--ink); font-size: 14px; }

/* Fokus-Keyword */
.kd-kwhead { display: flex; align-items: center; gap: 14px; --c: var(--ok); }
.kd-kwhead[data-level="warn"] { --c: #e89648; } .kd-kwhead[data-level="err"] { --c: var(--err); }
.kd-kwhead b { font-size: 30px; font-weight: 800; color: var(--c); font-variant-numeric: tabular-nums; letter-spacing: -.02em; }
.kd-kwhead span { font-size: 13px; color: var(--muted); }
.kd-kwhead strong { color: var(--c); font-size: 14px; }
.kd-range { position: relative; height: 26px; margin: 14px 0 12px; font-size: 11px; color: var(--muted); }
.kd-range span { position: absolute; top: 12px; transform: translateX(-50%); white-space: nowrap; }
.kd-range span:first-of-type { transform: none; }
.kd-range span:last-of-type { transform: translateX(-100%); }
.kd-range::before { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 6px; border-radius: 6px; background: linear-gradient(90deg, #f3b37a 0 10%, #3fbf8a 10% 50%, #f3b37a 50% 80%, #e57373 80%); }
.kd-range i { position: absolute; top: -4px; width: 4px; height: 14px; margin-left: -2px; border-radius: 2px; background: var(--ink); transition: left .3s var(--ease); }
.kd-showkw { margin-top: 12px; }

@media (max-width: 560px) {
  .kd-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}