/* ============================================================
   星轨 · 新增工具样式（tools.css）
   说明：复用站点通用类 .card/.field/.row/.btn/.drop/.progress/.result/.note
   本文件仅补充工具专属布局类。
   ============================================================ */

/* 工具内选项卡（仿 .seg，但独立命名避免冲突） */
.utabs{display:flex;gap:8px;margin:18px 0 14px;flex-wrap:wrap}
.utab{font-family:inherit;cursor:pointer;font-size:13.5px;font-weight:600;padding:8px 18px;border-radius:999px;color:var(--text-2);background:var(--surface);border:1.5px solid var(--border);transition:.18s}
.utab:hover{border-color:var(--border-2)}
.utab.active{color:#fff;border-color:transparent;background:linear-gradient(135deg,var(--b2),var(--cyan));box-shadow:0 4px 14px var(--accent-soft)}
.utab-pane{margin-top:6px}

/* Markdown 双栏编辑/预览 */
.md-wrap{display:flex;gap:16px;margin-top:14px;flex-wrap:wrap}
.md-col{flex:1 1 360px;min-width:280px;display:flex;flex-direction:column}
.md-wrap .md-col{height:auto}
#mdEditor,#mdPreview{width:100%;flex:1;min-height:420px;font-size:14px;border-radius:10px;border:1px solid var(--border-2);background:var(--surface);color:var(--text);padding:14px;outline:none;resize:vertical;line-height:1.7;font-family:var(--mono)}
#mdEditor{font-family:var(--mono)}
.md-preview{padding:14px;overflow:auto;line-height:1.75}
.md-preview h1,.md-preview h2,.md-preview h3{margin:.6em 0 .35em;line-height:1.3}
.md-preview h1{font-size:1.6em;border-bottom:1px solid var(--border);padding-bottom:.2em}
.md-preview h2{font-size:1.3em}
.md-preview code{background:var(--surface-3);padding:1px 6px;border-radius:5px;font-family:var(--mono);font-size:.9em}
.md-preview pre{background:var(--surface-2);border:1px solid var(--border);border-radius:8px;padding:12px;overflow:auto}
.md-preview pre code{background:none;padding:0}
.md-preview blockquote{border-left:3px solid var(--b3);margin:0;padding:.2em 12px;color:var(--text-2)}
.md-preview table{border-collapse:collapse;width:100%}
.md-preview th,.md-preview td{border:1px solid var(--border-2);padding:6px 10px}
.md-preview a{color:var(--b3)}
.md-status{font-size:12.5px;color:var(--text-3);align-self:center;margin-left:auto}

/* 图表 / 流程图容器 */
.chart-box,.mind-box{flex:1;min-height:300px;border:1px solid var(--border-2);border-radius:10px;background:var(--surface);display:flex;align-items:center;justify-content:center;color:var(--text-3);padding:12px;overflow:auto}
.chart-box canvas{max-width:100%}
.mind-box svg{max-width:100%;height:auto}

/* 草稿箱列表 */
.draft-list{display:flex;flex-direction:column;gap:10px;margin-top:6px}
.draft-item{border:1px solid var(--border-2);border-radius:10px;padding:12px 14px;background:var(--surface);display:flex;flex-direction:column;gap:6px}
.draft-item .di-top{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.draft-item .di-name{font-weight:700;color:var(--text)}
.draft-item .di-meta{font-size:12px;color:var(--text-3)}
.draft-item .di-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:4px}
.ver-item{font-size:12px;color:var(--text-2);background:var(--surface-2);border:1px solid var(--border);border-radius:6px;padding:4px 8px;display:inline-flex;gap:6px;align-items:center}

/* 字体预览 */
.font-preview{border:1px solid var(--border-2);border-radius:10px;margin-top:12px;min-height:140px;display:flex;align-items:center;justify-content:center;padding:20px;overflow:auto;word-break:break-all;text-align:center;font-family:'MyPreviewFont','Microsoft YaHei',sans-serif;line-height:1.2}
.kv{font-family:var(--mono);font-size:13px;background:var(--surface-2);border:1px solid var(--border);border-radius:8px;padding:10px 12px;white-space:pre-wrap;line-height:1.7;color:var(--text-2)}
.kv b{color:var(--text)}

/* 通用小屏 */
@media(max-width:640px){
  .md-wrap{flex-direction:column}
  .md-col{min-width:0}
}