/* 控件：一种基础样式，主操作和选中状态是明确的变体。 */
body :is(.tool-button, .filter-state-btn, .updates-toggle, .guide-button, .back-home-btn,
  .platform-comparison-secondary-btn, .platform-comparison-primary-btn, .platform-detail-action,
  .platform-detail-jump-plans, .guide-options > button) {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  min-height: var(--control-height); padding: 8px 14px; border: 1px solid var(--border-color);
  border-radius: var(--radius-md); background: var(--bg-secondary); color: var(--text-primary);
  font-size: 14px; line-height: 1.5; font-weight: 400; text-decoration: none;
  box-shadow: none; cursor: pointer; transition: background .15s, border-color .15s;
}
body :is(.tool-button, .filter-state-btn, .updates-toggle, .guide-button, .back-home-btn,
  .platform-comparison-secondary-btn, .platform-comparison-primary-btn, .platform-detail-action,
  .platform-detail-jump-plans, .guide-options > button):hover {
  background: var(--bg-tertiary); border-color: var(--border-strong); color: var(--text-primary); text-decoration: none; transform: none; box-shadow: none;
}
body :is(.tool-button.primary, .filter-state-btn.primary, .guide-button:not(.secondary), .platform-comparison-primary-btn) {
  color: white; background: var(--accent-primary); border-color: var(--accent-primary); font-weight: 600;
}
body :is(.tool-button.primary, .filter-state-btn.primary, .guide-button:not(.secondary), .platform-comparison-primary-btn):hover {
  color: white; background: var(--accent-hover); border-color: var(--accent-hover);
}
body :is(button, .tool-button):disabled { opacity: .5; cursor: not-allowed; }
body :is(input[type="search"], input[type="text"], input[type="number"], select, textarea) {
  min-height: var(--control-height); padding: 8px 12px; border: 1px solid var(--border-color);
  border-radius: var(--radius-md); background-color: var(--bg-secondary); color: var(--text-primary);
  font-size: 14px; line-height: 1.5; box-shadow: none;
}
body select, body :is(.model-browser-controls, .platform-hub-tools, .filter-inline, .platform-comparison-select-card) select,
body:is(.homepage-unified-active, .tool-unified-active) .filter-choice select {
  appearance: none; padding-right: 32px; cursor: pointer;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' stroke='%23596678' stroke-width='1.5' viewBox='0 0 16 16'%3E%3Cpath d='m4 6 4 4 4-4'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 10px center; background-size: 16px;
  min-height: var(--control-height); border-radius: var(--radius-md); font-size: 14px;
}
body :is(input, textarea)::placeholder { color: var(--text-secondary); opacity: .8; }
body :is(input[type="checkbox"], input[type="radio"]) { accent-color: var(--accent-primary); width: 16px; height: 16px; flex: 0 0 auto; }
body .toggle-switch input { width: 1px; height: 1px; }
.toggle-switch:has(input:focus-visible) { outline: 2px solid var(--accent-primary); outline-offset: 4px; border-radius: 12px; }
body .usage-segments { padding: 3px; gap: 2px; border: 1px solid var(--border-color); border-radius: 8px; background: var(--bg-tertiary); }
body .usage-segments button { min-height: 32px; padding: 5px 12px; border: 0; border-radius: 5px; font-size: 13px; font-weight: 400; color: var(--text-secondary); background: transparent; box-shadow: none; }
body .usage-segments button:hover { background: var(--bg-secondary); color: var(--text-primary); }
body .usage-segments :is(.is-active, [aria-pressed="true"]) { background: var(--bg-secondary); color: var(--accent-primary); font-weight: 600; box-shadow: none; }


/* 公共小组件的视觉归属；页面 CSS 只安排位置和间距。 */
body .ui-model-tags { display: flex; flex-wrap: wrap; gap: 5px; min-width: 0; max-width: 100%; }
body .ui-model-tags .model-tag { display: inline-flex; align-items: center; justify-content: center; min-width: 0; max-width: 100%; min-height: 27px; box-sizing: border-box; padding: 3px 6px; margin: 0; border: 1px solid var(--border-light); border-radius: 5px; background: var(--bg-tertiary); color: var(--text-secondary); font: 400 12px/1.6 var(--font-ui); white-space: normal; overflow-wrap: anywhere; }
body .ui-model-tags [hidden] { display: none; }
body .ui-model-tags button.model-tag-more { cursor: pointer; transition: background .16s, color .16s; }
body .ui-model-tags button.model-tag-more:hover { background: color-mix(in srgb, var(--bg-tertiary), var(--border-color) 35%); color: var(--text-primary); }
body .ui-model-tags button.model-tag-more:focus-visible { outline: 2px solid var(--text-secondary); outline-offset: 2px; }
body .section-toc a[aria-current="location"] { background: var(--bg-tertiary); color: var(--text-primary); }
@media (pointer: coarse) { body .ui-model-tags .model-tag { min-height: 44px; } body .ui-model-tags button.model-tag-more { min-width: 44px; } }

body .link-icon { width: 12px; height: 12px; flex-shrink: 0; vertical-align: middle; }

.tool-filter-loading { min-height: 148px; display: grid; place-items: center; margin-bottom: 20px; color: var(--text-secondary); font-size: 13px; }
@media(max-width:600px) { .tool-filter-loading { min-height: 220px; } }
