/* live-v1/css/k-tools.css：在线工具 /tools（2026-11-08，固件站-开发子任务 D）。只用设计令牌 --ds-* */
.k-tl { padding-bottom: var(--ds-sp-10); }
.k-tl__privacy, .k-tl__unsup { margin: var(--ds-sp-4) 0; }
.k-tl__privacy p { margin: 0; }
.k-tl__nav ul { list-style: none; margin: 0 0 var(--ds-sp-2); padding: 0; display: flex; flex-wrap: wrap; gap: var(--ds-sp-2); }
.k-tl__nav a { display: inline-flex; align-items: center; gap: 6px; min-height: 36px; padding: 0 var(--ds-sp-3); border: 1px solid var(--ds-border); border-radius: var(--ds-r-pill);
  color: var(--ds-text-2); text-decoration: none; font-size: var(--ds-fs-sm); background: var(--ds-surface); }
.k-tl__nav a:hover { color: var(--ds-text); border-color: var(--ds-border-strong); }
.k-tl__nav a[aria-current="page"] { color: var(--ds-on-primary); background: var(--ds-primary); border-color: var(--ds-primary); }

/* 首页卡片 */
.k-tl__cards { list-style: none; margin: var(--ds-sp-6) 0 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: var(--ds-sp-4); }
.k-tl__card h2 { display: flex; align-items: center; gap: 6px; margin: 0 0 var(--ds-sp-2); font-size: var(--ds-fs-lg); }
.k-tl__card p { margin: 0 0 var(--ds-sp-2); color: var(--ds-text-2); }

/* 串口参数条 */
.k-tl__port { margin: var(--ds-sp-4) 0; }
.k-tl__pgrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(130px, 1fr)); gap: var(--ds-sp-3); }
.k-tl__prow { margin-top: var(--ds-sp-3); }
.k-tl__perr { margin: var(--ds-sp-2) 0 0; }
.k-tl__pst { font-size: var(--ds-fs-sm); }

/* 单选组 / 复选 */
.k-tl__radios { border: 0; margin: 0; padding: 0; min-width: 0; display: flex; flex-wrap: wrap; gap: 4px var(--ds-sp-4); align-items: center; }
.k-tl__radios legend { padding: 0; margin-bottom: 6px; width: 100%; }
.k-tl__checks { display: flex; flex-direction: column; gap: 2px; }

/* 串口助手：终端 + 侧栏选项 */
.k-tl__sgrid { display: grid; grid-template-columns: minmax(0, 1fr) 240px; gap: var(--ds-sp-4); align-items: start; }
.k-tl__opts { display: flex; flex-direction: column; gap: var(--ds-sp-4); padding: var(--ds-sp-4); border: 1px solid var(--ds-border); border-radius: var(--ds-r-md); background: var(--ds-surface); }
.k-tl__term { --ds-term-h: 420px; }
.k-tl__log .k-tl__dir { color: var(--ds-term-dim); user-select: none; }
.k-tl__ph { margin: 0; color: var(--ds-term-dim); font-family: var(--ds-font); }
.k-tl__send { display: flex; gap: var(--ds-sp-2); padding: 6px var(--ds-sp-2); border-top: 1px solid var(--ds-border); background: var(--ds-surface-2); align-items: stretch; }
.k-tl__in { flex: 1; min-height: 44px; resize: vertical; }
.k-tl__term > .ds-field-error { margin: 0; padding: 4px var(--ds-sp-3); background: var(--ds-surface-2); }
.k-tl__timer { padding: 6px var(--ds-sp-3); background: var(--ds-surface-2); border-top: 1px solid var(--ds-divider); color: var(--ds-text); }
.k-tl__inl { font-weight: var(--ds-fw-regular); color: var(--ds-text-2); }
.k-tl__ms { width: 110px; }
.k-tl__cnt { margin-left: var(--ds-sp-2); }
.k-tl__steps { margin: 0; padding-left: 1.4em; display: grid; gap: 6px; color: var(--ds-text-2); max-width: 80ch; }

/* 结果区 */
.k-tl__out { margin-top: var(--ds-sp-3); min-height: 1.5em; }
.k-tl__kv { grid-template-columns: max-content minmax(0, 1fr); }
.k-tl__kv dd { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.k-tl__big { font-size: var(--ds-fs-lg); font-weight: var(--ds-fw-semibold); }
.k-tl__copy { min-height: 28px; }
.k-tl__cap { caption-side: top; text-align: left; padding: 0 0 6px; font-size: var(--ds-fs-sm); color: var(--ds-text-2); }
.k-tl__cur { background: var(--ds-row-current); }

/* 计算器 */
.k-tl__bgrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: var(--ds-sp-4); align-items: start; }
.k-tl__brt { margin-top: var(--ds-sp-4); max-width: 640px; }
.k-tl__crc .ds-input, .k-tl__dec .ds-textarea { max-width: 640px; }

/* Modbus */
.k-tl__mgrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: var(--ds-sp-4); align-items: start; }
.k-tl__mgrid .k-tl__wide { grid-column: span 2; }
.k-tl__reqrow { display: flex; flex-wrap: wrap; align-items: center; gap: var(--ds-sp-2); margin: var(--ds-sp-4) 0 var(--ds-sp-3); }
.k-tl__frame { font: var(--ds-fs-md)/1.4 var(--ds-mono); padding: 6px 10px; background: var(--ds-surface-2); border: 1px solid var(--ds-border); border-radius: var(--ds-r-sm); overflow-wrap: anywhere; }
.k-tl__resp { margin-top: var(--ds-sp-4); }
.k-tl__res { margin-top: var(--ds-sp-2); display: grid; gap: var(--ds-sp-3); }
.k-tl__verdict { margin: 0; }
.k-tl__probs { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; color: var(--ds-warn); font-size: var(--ds-fs-sm); }
.k-tl__regs { max-width: 560px; max-height: 420px; overflow: auto; }
.k-tl__bits { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(44px, 1fr)); gap: 4px; max-width: 640px; }
.k-tl__bits li { display: flex; flex-direction: column; align-items: center; padding: 4px 0; border: 1px solid var(--ds-border); border-radius: var(--ds-r-xs); font: var(--ds-fs-sm)/1.2 var(--ds-mono); }
.k-tl__bits li.is-on { background: var(--ds-success-soft); border-color: var(--ds-success-border); color: var(--ds-success); font-weight: var(--ds-fw-bold); }
.k-tl__bitn { font-size: var(--ds-fs-xs); color: var(--ds-text-3); font-weight: var(--ds-fw-regular); }
.k-tl__hterm { --ds-term-h: 160px; margin-top: var(--ds-sp-6); }
.k-tl__dec .k-tl__radios { margin-top: var(--ds-sp-3); }

/* Modbus RTU / TCP 标签 + TCP 面板（11-08 子任务 F） */
.k-tl__tabs { margin-top: var(--ds-sp-4); }
.k-tl__ptabs { margin-bottom: 0; }
.k-tl__tabs > .ds-tabpanel { padding-top: 0; }
.k-tl__conv { display: grid; gap: var(--ds-sp-3); }
.k-tl__convin .ds-textarea { max-width: 640px; }

/* IP / 子网 */
.k-tl__h3 { margin: var(--ds-sp-6) 0 var(--ds-sp-3); font-size: var(--ds-fs-md); font-weight: var(--ds-fw-semibold); }
.k-tl__ip code { overflow-wrap: anywhere; }
.k-tl__ipv { max-width: 760px; }
.k-tl__ip .ds-alert { margin: 0; }

@media (max-width: 900px) {
  .k-tl__sgrid { grid-template-columns: minmax(0, 1fr); }
  .k-tl__opts { flex-direction: row; flex-wrap: wrap; }
  .k-tl__opts > * { flex: 1 1 160px; }
}
@media (max-width: 560px) {
  .k-tl__pgrid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .k-tl__mgrid { grid-template-columns: minmax(0, 1fr); }
  .k-tl__mgrid .k-tl__wide { grid-column: auto; }
  .k-tl__term { --ds-term-h: 300px; }
  .k-tl__send { flex-direction: column; }
  .k-tl__kv { grid-template-columns: minmax(0, 1fr); gap: 2px; }
  .k-tl__kv dd { margin-bottom: var(--ds-sp-2); }
}
