/* ============================================================================
   S14.5 第一部分 · 全站唯一按钮类库（1-3-5 收敛）
   ----------------------------------------------------------------------------
   引入铁律：本文件必须放在各页内联 <style> 之后的 <link>，靠「同特异性后加载胜出」
             覆盖各页历史遗留的 button{} / button.mini / .btn-main 等旧样式。
   语义四档：.btn-primary 主操作 / .btn-secondary 次要 / .btn-danger 危险（须二次确认）/ .btn-ghost 中性
   规格三档：.btn-sm 28 / .btn-md 32（默认，可省略）/ .btn-lg 40；.btn-block 弹窗与移动端全宽
   铁律：每个视觉区域 Primary ≤ 1。
   ========================================================================== */

/* ---------- 1. 基础结构（btn 为容器，规格类负责尺寸） ---------- */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  font: inherit;
  font-weight: 600;
  line-height: 1.2;
  white-space: nowrap;
  text-decoration: none;
  cursor: pointer;
  box-sizing: border-box; /* D 批（2026-09-22）：补齐——部分页（competitor/attribution 等）无 `*{box-sizing}` reset */
  border-style: solid;
  border-width: 1px;
  border-radius: 8px;
  padding: 8px 14px;
  font-size: 13px;
  transition: background-color .15s, border-color .15s, color .15s, filter .15s, opacity .15s;
}

/* ---------- 2. 规格三档 ---------- */
/* D 批（2026-09-22）：三档由 min-height 改 height——原先内容高（font-size×1.2+padding+border）大于 min-height 时高度会漂移
   （实测 .btn-md 在 13px 字号页为 33.6px，在其它页为 32px），同行控件因此对不齐。固定高度后档位恒定：22 / 28 / 32 / 40。 */
.btn.btn-xs { padding: 1px 5px; font-size: 12px; border-radius: 6px; height: 22px; gap: 0; }
.btn.btn-sm { padding: 4px 10px; font-size: 12px; border-radius: 7px; height: 28px; }
.btn.btn-md { padding: 8px 14px; font-size: 13px; border-radius: 8px; height: 32px; }
.btn.btn-lg { padding: 10px 18px; font-size: 15px; border-radius: 9px; height: 40px; }
.btn.btn-block { width: 100%; }

/* ---------- 3. 语义四档（双类写法提高特异性，稳压历史 button.mini / .btn-main） ---------- */
.btn.btn-primary {
  background: var(--accent, #534AB7);
  border-color: var(--accent, #534AB7);
  color: #fff;
}
.btn.btn-primary:hover { filter: brightness(.92); }

.btn.btn-secondary {
  background: #fff;
  border-color: var(--accent, #534AB7);
  color: var(--accent, #534AB7);
}
.btn.btn-secondary:hover { background: var(--accent-soft, #f7f6fd); }

.btn.btn-danger {
  background: #fff;
  border-color: var(--danger, #B3261E);
  color: var(--danger, #B3261E);
}
.btn.btn-danger:hover { background: #fdeceb; }

.btn.btn-ghost {
  background: transparent;
  border-color: transparent;
  color: var(--muted, #6b6880);
}
.btn.btn-ghost:hover { background: rgba(15, 18, 40, .06); color: var(--text, #2b2840); }

/* 文字链式按钮（U9：跳转=带箭头文字链） */
.btn.btn-link {
  background: none; border-color: transparent; color: var(--accent, #534AB7);
  padding-left: 4px; padding-right: 4px; text-decoration: underline; text-underline-offset: 3px;
}
.btn.btn-link:hover { filter: brightness(.9); }

/* ---------- 4. 交互状态一套 ---------- */
.btn:hover { text-decoration: none; }
.btn:disabled,
.btn.disabled {
  opacity: .4;
  cursor: not-allowed;
  filter: none;
}
.btn:focus-visible {
  outline: 2px solid var(--accent, #534AB7);
  outline-offset: 2px;
}
.btn.loading { pointer-events: none; opacity: .8; }
.btn.loading::before {
  content: "";
  width: 12px; height: 12px;
  border: 2px solid currentColor;
  border-top-color: transparent;
  border-radius: 50%;
  animation: geo-btn-spin .7s linear infinite;
  flex: none;
}
@keyframes geo-btn-spin { to { transform: rotate(360deg); } }

/* 键盘可见焦点（全站此前缺失）——只对键盘用户生效，鼠标点击不显示描边 */
a.btn:focus-visible,
button.btn:focus-visible { outline: 2px solid var(--accent, #534AB7); outline-offset: 2px; }

/* ---------- 5. 同行等高（D 批 · 2026-09-22） ---------- */
/* 问题：同一 flex 行内混排时，按钮 28/32px、胶囊 20-28px、输入框 30-39px、
   文字链钮 20-38px 各走各的高度，渲染出来参差不齐（用户 0922 截图反馈）。
   口径：一行只允许一个控件高度——紧凑档 30px（--ctl-h，与 select.gsel 同档）、
        表单档 34px（--ctl-h-lg，与 select.gsel-lg 同档）。
   用法：给筛选行 / 工具行 / 操作条容器挂 .ctl-row（紧凑档）或 .ctl-row-lg（表单档），
        行内【直接子控件】自动等高；嵌套复合控件（.seg-ctl 内的 .seg-btn、
        .num-step 内的步进钮等）不被压缩，保持自身设计尺寸。
   注：.btn 系规则用 `.ctl-row > .btn.btn` 双类写法（0,2,1）——必须压过
       geo-btn.css 自身的 `.btn.btn-md`（0,2,0）min-height:32px，单类写法压不住。 */
.ctl-row { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.ctl-row-lg { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }

.ctl-row > .btn.btn,
.ctl-row > button,
.ctl-row > input,
.ctl-row > select,
.ctl-row > .fclear,
.ctl-row > .oplink,
.ctl-row > .tag,
.ctl-row > .chip { box-sizing: border-box; height: var(--ctl-h, 30px); min-height: 0; }

.ctl-row-lg > .btn.btn,
.ctl-row-lg > button,
.ctl-row-lg > input,
.ctl-row-lg > select,
.ctl-row-lg > .fclear,
.ctl-row-lg > .oplink { box-sizing: border-box; height: var(--ctl-h-lg, 34px); min-height: 0; }

/* 行内除 input/select 外的控件统一走 inline-flex 居中（胶囊/文字链钮原为 inline-block，
   定高后文字会贴顶）；竖直 padding 归零，左右留白保持各自原值 */
.ctl-row > .btn.btn,
.ctl-row > button,
.ctl-row > .fclear,
.ctl-row > .oplink,
.ctl-row > .tag,
.ctl-row > .chip,
.ctl-row-lg > .btn.btn,
.ctl-row-lg > button,
.ctl-row-lg > .fclear,
.ctl-row-lg > .oplink { display: inline-flex; align-items: center; justify-content: center; padding-top: 0; padding-bottom: 0; }

.ctl-row > input,
.ctl-row > select,
.ctl-row-lg > input,
.ctl-row-lg > select { padding-top: 0; padding-bottom: 0; }