/* 资产管理页（规则 / 技能 / Dockerfile / 环境安装脚本 / 沙箱）· Harness UI 设计语言
 * （MIT，见 harness-ui-LICENSE.txt）。令牌、按钮与 ⋯ 菜单来自 app/harness-ui.css，
 * 外层 1200px 居中容器由其设置区规则统一提供。Every rule stays inside #assetsView.
 */
#assetsView.page-view.active { background: var(--hui-surface); }
#assetsView [hidden] { display: none !important; }
#assetsView .harness-icon { flex: none; }
#assetsView > .asset-list-pane,
#assetsView > .asset-detail-pane { box-sizing: border-box; width: 100%; animation: assetViewIn .32s var(--hui-ease-flow); }
@keyframes assetViewIn { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }

/* ---------- Buttons: app/harness-ui.css ---------- */
#assetsView .button:disabled:hover { background: var(--hui-surface); color: var(--hui-secondary); }
#assetsView .button .harness-icon { width: 14px; height: 14px; }

/* ---------- List: heading ---------- */
#assetsView .asset-heading {
  display: flex;
  flex-wrap: nowrap;
  align-items: flex-end;
  justify-content: space-between;
  gap: 20px;
  margin: 0 0 24px;
  padding: 0;
  border: 0;
  background: none;
}
#assetsView .asset-heading > div:first-child { min-width: 0; max-width: none; }
#assetsView .asset-heading .eyebrow { display: none; }
#assetsView .asset-heading h1 { margin: 0; }
#assetsView .asset-heading h1 + p { margin: 6px 0 0; }
#assetsView .asset-heading .heading-actions { flex: none; display: flex; gap: 8px; width: auto; }

/* ---------- List: toolbar ---------- */
#assetsView .asset-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin: 0;
  padding: 0 0 12px;
  border: 0;
  border-bottom: 1px solid var(--hui-border);
  border-radius: 0;
  background: none;
  box-shadow: none;
}
#assetsView .asset-scope-tabs,
#assetsView .asset-scope-tabs.sliding-tabs[data-sliding-tabs] {
  flex: none;
  height: 28px !important;
  min-height: 28px !important;
  padding: 0 !important;
  gap: 2px !important;
  border: 0 !important;
  border-radius: 6px !important;
  background: transparent !important;
  overflow: visible;
  --sliding-surface: var(--hui-accent-soft);
  --sliding-text: var(--hui-accent);
  --sliding-muted: var(--hui-muted);
}
#assetsView .asset-scope-tabs.sliding-tabs[data-sliding-tabs] > [data-sliding-indicator] { border: 0; border-radius: 6px; background: var(--hui-accent-soft); box-shadow: none; }
#assetsView .asset-scope-tabs > button,
#assetsView .asset-scope-tabs.sliding-tabs[data-sliding-tabs] > [data-sliding-tab] {
  flex: none;
  height: 28px !important;
  min-height: 28px !important;
  padding: 0 11px !important;
  gap: 6px !important;
  border: 0 !important;
  border-radius: 6px !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--hui-muted) !important;
  font: 400 13px/1 var(--hui-sans) !important;
}
#assetsView .asset-scope-tabs > button.active { color: var(--hui-accent) !important; font-weight: 500 !important; }
#assetsView .asset-scope-tabs:not([data-sliding-tabs]) > button.active { background: var(--hui-accent-soft) !important; }
#assetsView .asset-scope-tabs.sliding-tabs[data-sliding-tabs] > [data-sliding-tab]:not(.active):hover { color: var(--hui-text) !important; }
#assetsView .asset-scope-tabs .sliding-tab-count { opacity: 1; color: var(--hui-tertiary); font-size: 11.5px; }
#assetsView .asset-scope-tabs > button.active .sliding-tab-count { color: var(--hui-accent); }

#assetsView .asset-search {
  box-sizing: border-box;
  display: flex;
  align-items: center;
  gap: 7px;
  width: 260px;
  height: 32px;
  margin: 0;
  padding: 0 10px;
  border: 1px solid var(--hui-border-strong);
  border-radius: 7px;
  background: var(--hui-surface);
  color: var(--hui-tertiary);
  transition: border-color .18s var(--hui-ease-flow), box-shadow .18s var(--hui-ease-flow);
}
#assetsView .asset-search:focus-within { border-color: var(--hui-accent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--hui-accent) 14%, transparent); }
#assetsView .asset-search input { flex: 1; min-width: 0; height: 100%; margin: 0; padding: 0; border: 0; outline: 0; background: transparent; box-shadow: none; color: var(--hui-text); font: 400 13px/1 var(--hui-sans); }
#assetsView .asset-search input::placeholder { color: var(--hui-tertiary); }
#assetsView .asset-search input::-webkit-search-cancel-button { display: none; }
#assetsView .asset-countline { margin: 14px 0 12px; color: var(--hui-tertiary); font-size: 12px; }
#assetsView .asset-countline b { margin-left: 4px; color: var(--hui-muted); font-weight: 500; font-variant-numeric: tabular-nums; }

/* ---------- List: cards ---------- */
#assetsView .asset-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 256px), 1fr)); gap: 14px; }
#assetsView .asset-card {
  position: relative;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  min-width: 0;
  min-height: 178px;
  padding: 16px 16px 12px;
  border: 1px solid var(--hui-border);
  border-radius: 10px;
  background: var(--hui-surface);
  cursor: pointer;
  transition: border-color .2s var(--hui-ease-flow), box-shadow .2s var(--hui-ease-flow), transform .2s var(--hui-ease-flow);
}
#assetsView .asset-card:hover { border-color: var(--hui-border-strong); box-shadow: var(--hui-popover-shadow); transform: translateY(-1px); }
#assetsView .asset-card:focus-visible { outline: 2px solid color-mix(in srgb, var(--hui-accent) 55%, transparent); outline-offset: 1px; }
#assetsView .asset-card-top { display: flex; align-items: flex-start; gap: 11px; min-width: 0; }
#assetsView .asset-tile {
  flex: none;
  box-sizing: border-box;
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  border: 1px solid var(--hui-border-soft);
  border-radius: 8px;
  background: var(--hui-soft);
  color: var(--hui-secondary);
  transition: background .2s var(--hui-ease-flow), color .2s var(--hui-ease-flow), border-color .2s var(--hui-ease-flow);
}
#assetsView .asset-tile .harness-icon { width: 16px; height: 16px; }
#assetsView .asset-card:hover .asset-tile { border-color: transparent; background: var(--hui-accent-soft); color: var(--hui-accent); }
#assetsView .asset-card-name { min-width: 0; }
#assetsView .asset-card h3 { margin: 0; overflow: hidden; color: var(--hui-text); font: 600 14px/1.35 var(--hui-sans); text-overflow: ellipsis; white-space: nowrap; }
#assetsView .asset-mono { display: block; overflow: hidden; padding: 0; background: none; color: var(--hui-tertiary); font: 400 12px/1.5 var(--hui-mono); text-overflow: ellipsis; white-space: nowrap; }
#assetsView .asset-card-desc {
  flex: 1;
  margin: 12px 0 0;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  color: var(--hui-muted);
  font-size: 13px;
  line-height: 1.55;
  overflow-wrap: anywhere;
}
#assetsView .asset-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; margin-top: 12px; color: var(--hui-secondary); font-size: 12px; }
#assetsView .asset-meta > span { display: inline-flex; align-items: center; gap: 5px; }
#assetsView .asset-meta .harness-icon { width: 13px; height: 13px; color: var(--hui-tertiary); }
#assetsView .asset-card-foot { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 12px; padding-top: 10px; border-top: 1px solid var(--hui-border-soft); }
#assetsView .asset-status { display: inline-flex; align-items: center; gap: 6px; min-width: 0; color: var(--hui-muted); font-size: 12px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#assetsView .asset-status i { flex: none; width: 6px; height: 6px; border-radius: 50%; background: var(--hui-tertiary); }
#assetsView .asset-status.is-on { color: var(--hui-success); }
#assetsView .asset-status.is-on i { background: var(--hui-success); box-shadow: 0 0 0 3px color-mix(in srgb, var(--hui-success) 16%, transparent); }
#assetsView .asset-status.is-from { color: var(--hui-info); }
#assetsView .asset-status.is-from i { background: var(--hui-info); }
#assetsView .asset-card-go { flex: none; display: inline-flex; align-items: center; gap: 2px; color: var(--hui-tertiary); font-size: 12px; transition: color .18s var(--hui-ease-flow), transform .2s var(--hui-ease-flow); }
#assetsView .asset-card-go .harness-icon { width: 13px; height: 13px; }
#assetsView .asset-card:hover .asset-card-go { color: var(--hui-accent); transform: translateX(2px); }

#assetsView .asset-empty {
  grid-column: 1 / -1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0;
  padding: 56px 20px;
  border: 1px dashed var(--hui-border-strong);
  border-radius: 10px;
  background: var(--hui-surface);
  box-shadow: none;
  color: var(--hui-muted);
  text-align: center;
}
#assetsView .asset-empty b { display: block; margin-bottom: 6px; color: var(--hui-text); font-size: 14px; font-weight: 600; }
#assetsView .asset-empty p { max-width: 460px; margin: 0 auto 16px; color: var(--hui-muted); font-size: 13px; line-height: 1.6; }
#assetsView .asset-empty p:last-child { margin-bottom: 0; }
#assetsView .asset-empty.is-inline { padding: 40px 20px; }
#assetsView > .asset-list-pane:has(> #assetList > .asset-empty) { flex: 1 1 auto; display: flex; flex-direction: column; }
#assetsView #assetList:has(> .asset-empty) { flex: 1 1 auto; display: flex; flex-direction: column; }
#assetsView #assetList > .asset-empty { flex: 1 1 auto; justify-content: center; }

/* ---------- Detail: breadcrumbs + sticky title row ---------- */
#assetsView .asset-crumbs { display: flex; align-items: center; gap: 6px; margin: 0 0 12px; color: var(--hui-tertiary); font-size: 12px; }
#assetsView .asset-crumbs a { color: var(--hui-muted); text-decoration: none; transition: color .18s var(--hui-ease-flow); }
#assetsView .asset-crumbs a:hover { color: var(--hui-accent); }
#assetsView .asset-crumbs a:focus-visible { outline: 2px solid color-mix(in srgb, var(--hui-accent) 55%, transparent); outline-offset: 2px; border-radius: 3px; }
#assetsView .asset-crumbs .harness-icon { width: 12px; height: 12px; }
#assetsView .asset-crumbs .is-current { min-width: 0; overflow: hidden; color: var(--hui-secondary); text-overflow: ellipsis; white-space: nowrap; }
#assetsView .asset-stick-sentinel { height: 0; }
#assetsView .asset-dhead {
  position: sticky;
  top: 0;
  z-index: 20;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
  margin: 0 0 4px;
  padding: 4px 0 18px;
  border-bottom: 1px solid transparent;
  background: var(--hui-surface);
  transition: border-color .18s var(--hui-ease-flow);
}
#assetsView .asset-dhead.is-stuck { border-bottom-color: var(--hui-border); }
#assetsView .asset-dtitle { display: flex; align-items: flex-start; gap: 12px; min-width: 0; }
#assetsView .asset-back { flex: none; margin-top: 2px; border-color: transparent; background: transparent; color: var(--hui-muted); }
#assetsView .asset-back:hover { border-color: transparent; background: var(--hui-soft); color: var(--hui-text); }
#assetsView .asset-dtitle-text { min-width: 0; }
#assetsView .asset-dtitle h1 { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; margin: 0; color: var(--hui-text); font: 600 28px/1.2 var(--hui-sans); letter-spacing: -.02em; }
#assetsView .asset-dname { min-width: 0; overflow-wrap: anywhere; }
#assetsView .asset-dtitle p { margin: 6px 0 0; color: var(--hui-muted); font-size: 14px; line-height: 1.5; overflow-wrap: anywhere; }
#assetsView .asset-badge {
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  height: 22px;
  padding: 0 8px;
  border: 1px solid var(--hui-border);
  border-radius: 999px;
  background: var(--hui-soft);
  color: var(--hui-muted);
  font: 500 12px/1 var(--hui-sans);
  letter-spacing: 0;
  white-space: nowrap;
}
#assetsView .asset-badge .harness-icon { width: 12px; height: 12px; }
#assetsView .asset-badge.is-on { border-color: transparent; background: color-mix(in srgb, var(--hui-success) 10%, var(--hui-surface)); color: var(--hui-success); }
#assetsView .asset-badge:is(.is-from, .is-ro) { border-color: transparent; background: color-mix(in srgb, var(--hui-info) 10%, var(--hui-surface)); color: var(--hui-info); }
#assetsView .asset-acts .asset-badge.is-ro { height: 28px; padding: 0 10px; }
#assetsView .asset-acts { flex: none; display: flex; align-items: center; gap: 8px; }
#assetsView .asset-dirty { display: inline-flex; align-items: center; gap: 6px; margin-right: 4px; color: var(--hui-warn); font-size: 12px; white-space: nowrap; }
#assetsView .asset-dirty i { width: 6px; height: 6px; border-radius: 50%; background: var(--hui-warn); }

/* 「⋯」menu: panel, items and motion come from the shared .hui-menu in app/harness-ui.css. */
#assetsView .asset-more { position: relative; display: inline-flex; }
#assetsView .hui-menu { min-width: 220px; max-width: 300px; }
#assetsView .asset-menu-reason { margin: 0; padding: 2px 10px 8px 32px; color: var(--hui-tertiary); font-size: 11.5px; line-height: 1.45; white-space: normal; }

/* ---------- Detail: body ---------- */
#assetsView .asset-dbody { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 20px; align-items: start; margin: 0; padding: 0; border: 0; background: none; box-shadow: none; }
#assetsView .asset-panel { min-width: 0; overflow: hidden; border: 1px solid var(--hui-border); border-radius: 10px; background: var(--hui-surface); }
#assetsView .asset-panel-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 46px; padding: 0 12px 0 8px; border-bottom: 1px solid var(--hui-border); }
#assetsView .asset-panel-hint { min-width: 0; overflow: hidden; color: var(--hui-tertiary); font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
#assetsView .asset-panel-hint .chip { padding: 0; border: 0; background: none; color: var(--hui-tertiary); font: 400 12px/1 var(--hui-sans); }
#assetsView .asset-pane-tabs,
#assetsView .asset-pane-tabs.sliding-tabs[data-sliding-tabs] {
  flex: none;
  display: inline-flex !important;
  height: 28px !important;
  min-height: 28px !important;
  padding: 0 !important;
  gap: 2px !important;
  border: 0 !important;
  border-radius: 6px !important;
  background: transparent !important;
  overflow: visible;
  --sliding-surface: var(--hui-soft);
  --sliding-text: var(--hui-text);
  --sliding-muted: var(--hui-muted);
}
#assetsView .asset-pane-tabs.sliding-tabs[data-sliding-tabs] > [data-sliding-indicator] { border: 0; border-radius: 6px; background: var(--hui-soft); box-shadow: inset 0 0 0 1px var(--hui-border); }
#assetsView .asset-pane-tabs > button,
#assetsView .asset-pane-tabs.sliding-tabs[data-sliding-tabs] > [data-sliding-tab] {
  flex: none;
  height: 28px !important;
  min-height: 28px !important;
  padding: 0 11px !important;
  border: 0 !important;
  border-radius: 6px !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--hui-muted) !important;
  font: 400 13px/1 var(--hui-sans) !important;
  cursor: pointer;
}
#assetsView .asset-pane-tabs > button.active { color: var(--hui-text) !important; font-weight: 500 !important; }
#assetsView .asset-pane-tabs:not([data-sliding-tabs]) > button.active { background: var(--hui-soft) !important; box-shadow: inset 0 0 0 1px var(--hui-border) !important; }
#assetsView .asset-stage { padding: 18px; background: var(--hui-stage); }
#assetsView .asset-tabpanel > * + * { margin-top: 10px; }
#assetsView .asset-panel-foot { display: flex; justify-content: flex-end; gap: 8px; padding: 12px 16px; border-top: 1px solid var(--hui-border); background: var(--hui-surface); }

#assetsView .asset-editor {
  box-sizing: border-box;
  display: block;
  width: 100%;
  min-height: 420px;
  margin: 0;
  padding: 14px 16px;
  border: 1px solid var(--hui-border);
  border-radius: 8px;
  background: var(--hui-surface);
  box-shadow: none;
  color: var(--hui-text);
  font: 400 13px/1.75 var(--hui-mono);
  resize: vertical;
  outline: 0;
  transition: border-color .18s var(--hui-ease-flow), box-shadow .18s var(--hui-ease-flow);
}
#assetsView .asset-editor.is-short { min-height: 200px; }
#assetsView .asset-editor:focus { border-color: var(--hui-accent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--hui-accent) 14%, transparent); }
#assetsView .asset-editor:disabled { color: var(--hui-secondary); opacity: 1; cursor: default; }
#assetsView .asset-md { box-sizing: border-box; min-height: 420px; padding: 16px 22px; border: 1px solid var(--hui-border); border-radius: 8px; background: var(--hui-surface); color: var(--hui-text); font-size: 14px; line-height: 1.75; overflow-wrap: anywhere; }
#assetsView .asset-md > :first-child { margin-top: 0; }
#assetsView .asset-md :is(ol, ul) { padding-left: 20px; }
#assetsView .asset-md-empty { margin: 0; color: var(--hui-tertiary); }
#assetsView .json-help { margin: 8px 0 0; color: var(--hui-tertiary); font-size: 12px; line-height: 1.6; }
#assetsView .json-help code { padding: 0 4px; border-radius: 4px; background: var(--hui-soft); color: var(--hui-secondary); font: 400 11.5px/1.6 var(--hui-mono); }

/* Skill files */
#assetsView .skill-upload-block { margin: 0; padding: 0; border: 0; background: none; }
#assetsView .skill-upload-actions { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 12px; }
#assetsView .skill-upload-status:empty { display: none; }
#assetsView .skill-upload-status { margin: 0 0 12px; font-size: 12.5px; }
#assetsView .skill-file-tree { margin: 0; overflow: hidden; border: 1px solid var(--hui-border); border-radius: 8px; background: var(--hui-surface); }
#assetsView .skill-file-tree :is(.skill-file-row, .skill-tree-row) { min-height: 38px; border-bottom: 1px solid var(--hui-border-soft); color: var(--hui-secondary); font-size: 13px; }
#assetsView .skill-file-tree > :last-child { border-bottom: 0; }
#assetsView .skill-file-tree :is(.skill-file-path, .skill-tree-dirname) { background: none; color: var(--hui-text); font: 400 12.5px/1.4 var(--hui-mono); }
#assetsView .skill-file-tree .chip { border: 0; background: var(--hui-soft); color: var(--hui-tertiary); font-size: 11.5px; }
#assetsView .skill-file-tree :is(.skill-file-preview, a) { border: 0; background: none; color: var(--hui-accent); font-size: 12px; text-decoration: none; cursor: pointer; }
#assetsView .skill-file-tree .skill-file-preview:disabled { color: var(--hui-tertiary); cursor: not-allowed; }
#assetsView .empty-inline { margin: 0; padding: 28px 16px; border: 1px dashed var(--hui-border-strong); border-radius: 8px; background: var(--hui-surface); color: var(--hui-muted); font-size: 13px; text-align: center; }

/* ---------- Detail: aside ---------- */
#assetsView .asset-aside { display: flex; flex-direction: column; gap: 14px; min-width: 0; }
#assetsView .asset-side-card { box-sizing: border-box; padding: 14px 16px 16px; border: 1px solid var(--hui-border); border-radius: 10px; background: var(--hui-surface); }
#assetsView .asset-side-card h4 { display: flex; align-items: center; gap: 6px; margin: 0 0 2px; color: var(--hui-text); font: 600 13px/1.4 var(--hui-sans); }
#assetsView .asset-side-count { color: var(--hui-tertiary); font-size: 12px; font-weight: 400; }
#assetsView .asset-field-label,
#assetsView .asset-side-card .rule-global-sops > label { display: block; margin: 12px 0 6px; color: var(--hui-muted); font: 500 12px/1.4 var(--hui-sans); }
#assetsView .asset-stage .asset-field-label { margin-top: 0; }
#assetsView .asset-field-label small { margin-left: 4px; color: var(--hui-tertiary); font-weight: 400; }
#assetsView .asset-input {
  box-sizing: border-box;
  width: 100%;
  height: 32px;
  margin: 0;
  padding: 0 10px;
  border: 1px solid var(--hui-border-strong);
  border-radius: 7px;
  background: var(--hui-surface);
  box-shadow: none;
  color: var(--hui-text);
  font: 400 13px/1 var(--hui-sans);
  outline: 0;
  transition: border-color .18s var(--hui-ease-flow), box-shadow .18s var(--hui-ease-flow);
}
#assetsView .asset-input:focus { border-color: var(--hui-accent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--hui-accent) 14%, transparent); }
#assetsView .asset-input:is([readonly], :disabled) { background: var(--hui-soft); color: var(--hui-muted); opacity: 1; }
#assetsView .asset-input[readonly]:focus { border-color: var(--hui-border-strong); box-shadow: none; }
#assetsView .asset-input.is-mono { font: 400 12.5px/1 var(--hui-mono); }
#assetsView .asset-field-hint { margin: 5px 0 0; color: var(--hui-tertiary); font-size: 11.5px; line-height: 1.45; }
#assetsView .asset-side-card .json-help { font-size: 11.5px; }
#assetsView select.asset-select { box-sizing: border-box; width: 100%; height: 32px; padding: 0 8px; border: 1px solid var(--hui-border-strong); border-radius: 7px; background: var(--hui-surface); color: var(--hui-text); font: 400 13px/1 var(--hui-sans); }
#assetsView .hui-select-trigger { display: flex; width: 100%; height: 32px; padding: 0 10px; border-radius: 7px; transition: border-color .18s var(--hui-ease-flow), box-shadow .18s var(--hui-ease-flow); }
#assetsView .hui-select-trigger:hover { border-color: var(--hui-border-strong); }
#assetsView .hui-select-trigger:focus-visible,
#assetsView .hui-select-trigger[aria-expanded="true"] { border-color: var(--hui-accent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--hui-accent) 14%, transparent); outline: 0; }
#assetsView .hui-select-trigger:disabled { opacity: 1; background: var(--hui-soft); color: var(--hui-muted); }

/* Switches: the platform checkboxes (name="global" / name="readOnlyRootFS") drawn as Harness switches. */
#assetsView .rule-global-block { margin: 14px 0 0; padding: 14px 0 0; border: 0; border-top: 1px solid var(--hui-border-soft); border-radius: 0; background: none; }
#assetsView :is(.rule-global-row, .asset-switch-row) { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin: 0; padding: 0; border: 0; background: none; cursor: pointer; }
#assetsView .asset-switch-row { margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--hui-border-soft); }
#assetsView :is(.rule-global-row, .asset-switch-row) b { display: block; color: var(--hui-text); font: 500 13px/1.4 var(--hui-sans); }
#assetsView :is(.rule-global-row, .asset-switch-row) small { display: block; margin-top: 2px; color: var(--hui-tertiary); font-size: 12px; font-weight: 400; line-height: 1.45; }
#assetsView :is(.rule-global-input, .asset-switch) { margin: 2px 0 0; }
#assetsView .rule-global-sops { margin: 0; padding: 0; border: 0; background: none; }
#assetsView .repo-picker-field { display: flex; flex-wrap: wrap; gap: 6px; min-height: 0; padding: 0; border: 0; background: none; box-shadow: none; }
#assetsView .repo-picker-tag { display: inline-flex; align-items: center; gap: 5px; height: 24px; padding: 0 8px; border: 0; border-radius: 6px; background: var(--hui-accent-soft); color: var(--hui-accent); font: 400 12px/1 var(--hui-sans); cursor: pointer; }
#assetsView .repo-picker-tag:disabled { cursor: default; }
#assetsView .repo-picker-select { box-sizing: border-box; height: 24px; max-width: 100%; padding: 0 8px; border: 1px dashed var(--hui-border-strong); border-radius: 6px; background: transparent; color: var(--hui-muted); font: 400 12px/1 var(--hui-sans); cursor: pointer; }

#assetsView .asset-refs { margin: 10px 0 0; padding: 0; list-style: none; }
#assetsView .asset-refs li { display: flex; align-items: center; gap: 8px; min-height: 32px; margin: 0 -8px; padding: 0 8px; border-radius: 6px; color: var(--hui-secondary); font-size: 13px; }
#assetsView .asset-refs li > span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#assetsView .asset-refs .harness-icon { color: var(--hui-tertiary); }
#assetsView .asset-refs li.is-none { color: var(--hui-tertiary); }
#assetsView .asset-kv { display: grid; grid-template-columns: auto 1fr; gap: 8px 14px; margin: 10px 0 0; font-size: 12.5px; }
#assetsView .asset-kv dt { color: var(--hui-tertiary); }
#assetsView .asset-kv dd { margin: 0; color: var(--hui-secondary); text-align: right; overflow-wrap: anywhere; }

/* ---------- SkillHub source on project skills ---------- */
#assetsView .asset-meta .hui-badge { height: 22px; }
#assetsView .asset-kv dd a { color: var(--hui-accent); text-decoration: none; }
#assetsView .asset-kv dd a:hover { text-decoration: underline; }
#assetsView .asset-source-btn { width: 100%; margin-top: 12px; }
#assetsView .asset-source-note { display: flex; align-items: center; gap: 8px; margin: 0 0 12px; padding: 9px 12px; border: 1px solid color-mix(in srgb, var(--hui-accent) 23%, transparent); border-radius: 8px; background: color-mix(in srgb, var(--hui-accent) 6%, var(--hui-surface)); color: var(--hui-accent); font-size: 12.5px; }

/* ---------- SkillHub market (scope tab) ---------- */
#assetsView .skillhub-filters { display: flex; align-items: center; gap: 8px; margin-top: 14px; }
#assetsView .skillhub-filters .skillhub-search { flex: 1; width: auto; }
#assetsView .skillhub-filters .hui-select-trigger { flex: none; width: auto; min-width: 132px; border-color: var(--hui-border); border-radius: 8px; }
#assetsView .skillhub-filters .hui-select-trigger .hui-select-lead { color: var(--hui-tertiary); }
#assetsView #skillhubCategory + .hui-select-trigger.is-filtered { border-color: color-mix(in srgb, var(--hui-accent) 40%, var(--hui-border)); background: var(--hui-accent-soft); color: var(--hui-accent); }
#assetsView #skillhubCategory + .hui-select-trigger.is-filtered :is(.hui-select-lead, .hui-select-chevron) { color: currentColor; }
#assetsView .skillhub-note { display: flex; align-items: center; gap: 6px; margin: 10px 0 0; color: var(--hui-tertiary); font-size: 12px; }
#assetsView .skillhub-note a { color: var(--hui-accent); text-decoration: none; }
#assetsView .skillhub-market .asset-countline { margin-top: 16px; }
#assetsView .skillhub-card { min-height: 186px; }
#assetsView .skillhub-tile { font: 600 14px/1 var(--hui-sans); }
#assetsView .skillhub-card .asset-card-desc { min-height: 40px; }
#assetsView .skillhub-card .asset-meta .hui-badge { height: 20px; padding: 0 7px; font-size: 11.5px; }
#assetsView .skillhub-card .asset-card-foot { margin-top: auto; padding-top: 12px; }
#assetsView .skillhub-card .asset-card-desc + .asset-meta { margin-bottom: 12px; }
#assetsView .skillhub-skel { min-height: 186px; border: 1px solid var(--hui-border-soft); border-radius: 10px; background: linear-gradient(90deg, var(--hui-soft) 25%, var(--hui-border-soft) 37%, var(--hui-soft) 63%); background-size: 400% 100%; animation: skillhubSkel 1.4s ease infinite; }
@keyframes skillhubSkel { from { background-position: 100% 50%; } to { background-position: 0 50%; } }
#assetsView .skillhub-pager { display: flex; align-items: center; justify-content: space-between; margin-top: 20px; color: var(--hui-tertiary); font-size: 12px; }
#assetsView .skillhub-pages { display: flex; gap: 4px; }
#assetsView .skillhub-pages button { display: inline-grid; place-items: center; min-width: 28px; height: 28px; padding: 0 6px; border: 0; border-radius: 6px; background: transparent; color: var(--hui-muted); font: 400 12.5px/1 var(--hui-sans); font-variant-numeric: tabular-nums; cursor: pointer; }
#assetsView .skillhub-pages button:hover:not(:disabled) { background: color-mix(in srgb, var(--hui-text) 5%, transparent); color: var(--hui-text); }
#assetsView .skillhub-pages button.active { background: var(--hui-accent-soft); color: var(--hui-accent); font-weight: 500; }
#assetsView .skillhub-pages button:disabled { cursor: default; opacity: .5; }

/* ---------- SkillHub drawer ---------- */
#assetsView .skillhub-layer { width: 0; height: 0; margin: 0; padding: 0; }
#assetsView .skillhub-scrim { position: fixed; inset: 0; z-index: 4000; background: var(--hui-scrim); opacity: 0; pointer-events: none; transition: opacity .24s ease; }
#assetsView .skillhub-scrim.is-open { opacity: 1; pointer-events: auto; }
#assetsView .skillhub-drawer { position: fixed; z-index: 4001; top: 8px; right: 8px; bottom: 8px; box-sizing: border-box; width: min(720px, calc(100vw - 16px)); max-width: none; display: flex; flex-direction: column; overflow: hidden; border: 1px solid var(--hui-border); border-radius: 14px; background: var(--hui-surface); box-shadow: var(--hui-popover-shadow); visibility: hidden; transform: translateX(calc(100% + 16px)); transition: transform .4s var(--hui-ease-flow), visibility 0s linear .4s; }
#assetsView .skillhub-drawer.is-open { visibility: visible; transform: none; transition: transform .4s var(--hui-ease-flow), visibility 0s; }
#assetsView .skillhub-dhead { padding: 20px 20px 14px 24px; }
#assetsView .skillhub-drow { display: flex; align-items: flex-start; gap: 14px; }
#assetsView .skillhub-tile.is-large { width: 44px; height: 44px; border-radius: 10px; font-size: 17px; }
#assetsView .skillhub-dtitle { flex: 1; min-width: 0; }
#assetsView .skillhub-dtitle h2 { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0; color: var(--hui-text); font: 600 18px/1.3 var(--hui-sans); letter-spacing: -.01em; overflow-wrap: anywhere; }
#assetsView .skillhub-dmeta { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 12px; margin-top: 4px; color: var(--hui-tertiary); font-size: 12px; }
#assetsView .skillhub-dmeta code { padding: 0; background: none; color: var(--hui-tertiary); font: 400 11.5px/1.5 var(--hui-mono); }
#assetsView .skillhub-dmeta b { color: var(--hui-secondary); font-weight: 400; }
#assetsView .skillhub-dmeta a { display: inline-flex; align-items: center; gap: 3px; color: var(--hui-accent); text-decoration: none; }
#assetsView .skillhub-dmeta a .harness-icon { width: 12px; height: 12px; }
#assetsView .skillhub-dacts { display: flex; align-items: center; gap: 8px; margin-top: 16px; }
#assetsView .skillhub-sp { flex: 1; }
#assetsView .skillhub-ghost-select .hui-select-trigger { width: auto; height: 30px; padding: 0 8px; border-color: transparent; background: transparent; color: var(--hui-muted); }
#assetsView .skillhub-ghost-select .hui-select-trigger:hover { border-color: var(--hui-border); background: color-mix(in srgb, var(--hui-text) 5%, var(--hui-surface)); color: var(--hui-text); }
#assetsView .skillhub-ghost-select .hui-select-trigger.is-filtered { color: var(--hui-muted); }
#assetsView .asset-pane-tabs.skillhub-dtabs,
#assetsView .asset-pane-tabs.skillhub-dtabs.sliding-tabs[data-sliding-tabs] { align-self: flex-start; height: auto !important; min-height: 0 !important; margin: 0 24px; padding: 4px !important; border-radius: 11px !important; background: color-mix(in srgb, var(--hui-text) 5%, var(--hui-surface)) !important; --sliding-surface: var(--hui-surface); }
#assetsView .asset-pane-tabs.skillhub-dtabs.sliding-tabs[data-sliding-tabs] > [data-sliding-indicator] { border: 1px solid color-mix(in srgb, var(--hui-text) 3%, transparent); border-radius: 8px; background: var(--hui-surface); box-shadow: var(--hui-ind-shadow); }
#assetsView .asset-pane-tabs.skillhub-dtabs > button { display: inline-flex; align-items: center; gap: 6px; height: 32px !important; min-height: 32px !important; padding: 0 14px !important; border-radius: 7px !important; }
#assetsView .asset-pane-tabs.skillhub-dtabs:not([data-sliding-tabs]) > button.active { background: var(--hui-surface) !important; box-shadow: var(--hui-ind-shadow) !important; }
#assetsView .skillhub-dtabs .sliding-tab-count { font-size: 12px; opacity: .65; font-variant-numeric: tabular-nums; }
#assetsView .skillhub-dbody { flex: 1; min-height: 0; overflow: auto; padding: 18px 24px 28px; }
#assetsView .skillhub-panel { border: 1px solid var(--hui-border); border-radius: 14px; background: var(--hui-surface); box-shadow: var(--hui-panel-shadow); }
#assetsView .skillhub-sec { margin-bottom: 18px; }
#assetsView .skillhub-sec-title { display: flex; align-items: center; gap: 7px; margin: 0 0 10px; color: var(--hui-text); font: 500 13px/1.4 var(--hui-sans); }
#assetsView .skillhub-sec-title > span { margin-left: auto; color: var(--hui-tertiary); font-size: 12px; font-weight: 400; }
#assetsView .skillhub-lead { margin: 0; color: var(--hui-secondary); font-size: 13px; line-height: 1.7; overflow-wrap: anywhere; }
#assetsView .skillhub-none,
#assetsView .skillhub-loading { margin: 0; padding: 22px 16px; border: 1px dashed var(--hui-border-strong); border-radius: 10px; color: var(--hui-tertiary); font-size: 12.5px; text-align: center; }
#assetsView .skillhub-stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); }
#assetsView .skillhub-stats > div { padding: 14px 16px; border-right: 1px solid var(--hui-border-soft); }
#assetsView .skillhub-stats > div:last-child { border-right: 0; }
#assetsView .skillhub-stats small { display: block; color: var(--hui-tertiary); font-size: 12px; }
#assetsView .skillhub-stats b { display: flex; align-items: center; gap: 6px; min-height: 24px; margin-top: 4px; color: var(--hui-text); font: 600 16px/1.3 var(--hui-sans); font-variant-numeric: tabular-nums; }
#assetsView .skillhub-stats b.is-accent { color: var(--hui-accent); }
#assetsView .skillhub-stats b em { color: var(--hui-tertiary); font-size: 12px; font-style: normal; font-weight: 400; }
#assetsView .skillhub-md { max-height: 320px; overflow: auto; padding: 16px 18px; color: var(--hui-secondary); font-size: 12.5px; line-height: 1.7; overflow-wrap: anywhere; }
#assetsView .skillhub-md > :first-child { margin-top: 0; }
#assetsView .skillhub-md :is(h1, h2, h3) { color: var(--hui-text); }
#assetsView .skillhub-md h1 { margin: 0 0 8px; font-size: 16px; }
#assetsView .skillhub-md h2 { margin: 14px 0 6px; font-size: 13.5px; }
#assetsView .skillhub-md :is(ol, ul) { padding-left: 18px; }
#assetsView .skillhub-tags { display: flex; flex-wrap: wrap; gap: 6px; }

#assetsView .skillhub-files { display: grid; grid-template-columns: 210px minmax(0, 1fr); min-height: 360px; overflow: hidden; }
#assetsView .skillhub-ftree { max-height: 560px; overflow: auto; padding: 6px; border-right: 1px solid var(--hui-border-soft); background: var(--hui-canvas); }
#assetsView .skillhub-frow { box-sizing: border-box; display: flex; align-items: center; gap: 7px; width: 100%; min-height: 30px; padding: 0 8px; border: 0; border-radius: 6px; background: transparent; color: var(--hui-muted); font: 400 12.5px/1.3 var(--hui-sans); text-align: left; cursor: pointer; transition: background .16s ease, color .16s ease; }
#assetsView .skillhub-frow > span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#assetsView .skillhub-frow small { margin-left: auto; color: var(--hui-tertiary); font-size: 11px; font-variant-numeric: tabular-nums; }
#assetsView button.skillhub-frow:hover { background: color-mix(in srgb, var(--hui-text) 5%, transparent); color: var(--hui-text); }
#assetsView .skillhub-frow.is-active { background: var(--hui-accent-soft); color: var(--hui-accent); }
#assetsView .skillhub-frow.is-dir { color: var(--hui-text); cursor: default; }
#assetsView .skillhub-frow.is-off { opacity: .55; }
#assetsView .skillhub-fview { min-width: 0; display: flex; flex-direction: column; }
#assetsView .skillhub-fbar { display: flex; align-items: center; gap: 8px; height: 40px; padding: 0 14px; border-bottom: 1px solid var(--hui-border-soft); color: var(--hui-muted); font-size: 12px; }
#assetsView .skillhub-fbar code { min-width: 0; overflow: hidden; padding: 0; background: none; color: var(--hui-text); font: 400 12px/1 var(--hui-mono); text-overflow: ellipsis; white-space: nowrap; }
#assetsView .skillhub-seg { display: flex; padding: 2px; border-radius: 7px; background: color-mix(in srgb, var(--hui-text) 5%, var(--hui-surface)); }
#assetsView .skillhub-seg button { height: 22px; padding: 0 8px; border: 0; border-radius: 5px; background: transparent; color: var(--hui-muted); font-size: 11.5px; cursor: pointer; }
#assetsView .skillhub-seg button.is-on { background: var(--hui-surface); color: var(--hui-text); box-shadow: var(--hui-ind-shadow); }
#assetsView .skillhub-fbody { flex: 1; min-height: 0; max-height: 520px; overflow: auto; }
#assetsView .skillhub-fbody .skillhub-md { max-height: none; }
#assetsView .skillhub-fbody :is(.skillhub-none, .skillhub-loading) { margin: 16px; }
#assetsView .skillhub-front { margin: 0 0 12px; padding: 10px 12px; border-radius: 8px; background: var(--hui-canvas); color: var(--hui-muted); font: 400 12px/1.7 var(--hui-mono); white-space: pre-wrap; }
#assetsView .skillhub-code { margin: 0; padding: 14px 16px; background: none; color: var(--hui-text); font: 400 12px/1.7 var(--hui-mono); white-space: pre-wrap; overflow-wrap: anywhere; }
#assetsView .skillhub-callout { display: flex; align-items: center; gap: 8px; margin-top: 10px; padding: 9px 12px; border: 1px solid color-mix(in srgb, var(--hui-warn) 23%, transparent); border-radius: 8px; background: color-mix(in srgb, var(--hui-warn) 6%, var(--hui-surface)); color: var(--hui-warn); font-size: 12px; line-height: 1.5; }
#assetsView .skillhub-callout.is-error { border-color: color-mix(in srgb, var(--hui-error) 23%, transparent); background: color-mix(in srgb, var(--hui-error) 6%, var(--hui-surface)); color: var(--hui-error); }

/* TRACE: Harness Activity Timeline segments */
#assetsView .skillhub-tl { padding: 18px 20px 10px; }
#assetsView .skillhub-tl-head { display: flex; align-items: center; justify-content: space-between; padding: 0 1px 14px; color: var(--hui-muted); }
#assetsView .skillhub-tl-head > span:first-child { display: flex; align-items: center; gap: 7px; color: var(--hui-text); font-size: 14px; font-weight: 500; }
#assetsView .skillhub-score { display: flex; align-items: baseline; gap: 4px; }
#assetsView .skillhub-score b { color: var(--hui-accent); font: 600 22px/1 var(--hui-sans); font-variant-numeric: tabular-nums; }
#assetsView .skillhub-score small { color: var(--hui-tertiary); font-size: 12px; }
#assetsView .skillhub-tl-summary { margin: -4px 0 12px; color: var(--hui-secondary); font-size: 12.5px; line-height: 1.7; }
#assetsView .skillhub-tl-sec { border-top: 1px solid var(--hui-border); }
#assetsView .skillhub-tl-toggle { display: flex; align-items: center; gap: 9px; width: 100%; min-height: 44px; padding: 0 2px; border: 0; border-radius: 4px; background: transparent; color: var(--hui-warn); text-align: left; cursor: pointer; transition: background-color .16s ease; }
#assetsView .skillhub-tl-toggle:hover { background: color-mix(in srgb, var(--hui-muted) 8%, transparent); }
#assetsView .skillhub-tl-toggle > .harness-icon[data-icon="check"] { color: var(--hui-success); }
#assetsView .skillhub-tl-toggle strong { color: var(--hui-text); font-size: 13.5px; font-weight: 500; }
#assetsView .skillhub-tl-en { color: var(--hui-tertiary); font-size: 12px; }
#assetsView .skillhub-bar { display: block; width: 96px; height: 4px; margin-left: auto; overflow: hidden; border-radius: 99px; background: var(--hui-border-soft); }
#assetsView .skillhub-bar i { display: block; height: 100%; border-radius: 99px; background: var(--hui-accent); }
#assetsView .skillhub-bar.is-thin { width: auto; height: 3px; margin: 0; }
#assetsView .skillhub-bar.is-thin i { background: color-mix(in srgb, var(--hui-accent) 55%, transparent); }
#assetsView .skillhub-tl-val { min-width: 28px; color: var(--hui-text); font-size: 12.5px; font-weight: 500; text-align: right; font-variant-numeric: tabular-nums; }
#assetsView .skillhub-tl-toggle > .harness-icon[data-icon="chevron-down"] { color: var(--hui-tertiary); transition: transform .3s var(--hui-ease-flow); }
#assetsView .skillhub-tl-sec.is-open .skillhub-tl-toggle > .harness-icon[data-icon="chevron-down"] { transform: rotate(180deg); }
#assetsView .skillhub-tl-fold { display: grid; grid-template-rows: 0fr; transition: grid-template-rows .34s var(--hui-ease-flow); }
#assetsView .skillhub-tl-sec.is-open .skillhub-tl-fold { grid-template-rows: 1fr; }
#assetsView .skillhub-tl-fold > div { overflow: hidden; }
#assetsView .skillhub-tl-reason { margin: 0 0 8px 24px; color: var(--hui-muted); font-size: 12.5px; line-height: 1.7; }
#assetsView .skillhub-tl-items { margin: 0 0 12px 8px; padding: 0 0 0 15px; border-left: 1px solid var(--hui-border); list-style: none; }
#assetsView .skillhub-tl-items li { display: grid; grid-template-columns: 150px 32px minmax(0, 1fr); align-items: center; gap: 4px 10px; min-height: 32px; color: var(--hui-muted); font-size: 12.5px; }
#assetsView .skillhub-tl-items li small { color: var(--hui-tertiary); font-size: 11.5px; }
#assetsView .skillhub-tl-items li b { color: var(--hui-text); font-weight: 500; font-variant-numeric: tabular-nums; }
#assetsView .skillhub-tl-items li p { grid-column: 1 / -1; margin: 0 0 6px; color: var(--hui-tertiary); font-size: 12px; line-height: 1.6; }
#assetsView .skillhub-sec-list { padding: 6px 16px; }
#assetsView .skillhub-sec-row { display: flex; align-items: center; gap: 10px; min-height: 46px; border-top: 1px solid var(--hui-border-soft); }
#assetsView .skillhub-sec-row:first-child { border-top: 0; }
#assetsView .skillhub-sec-who { min-width: 80px; color: var(--hui-text); font-weight: 500; }
#assetsView .skillhub-sec-row a { display: inline-flex; align-items: center; gap: 3px; margin-left: auto; color: var(--hui-muted); font-size: 12px; text-decoration: none; }
#assetsView .skillhub-sec-row a:hover { color: var(--hui-accent); }
#assetsView .skillhub-sec-row a .harness-icon { width: 12px; height: 12px; }

#assetsView .skillhub-versions { overflow: hidden; }
#assetsView .skillhub-vrow { box-sizing: border-box; display: grid; grid-template-columns: 18px 72px minmax(0, 1fr) auto; align-items: start; gap: 10px; width: 100%; padding: 12px 16px; border: 0; border-top: 1px solid var(--hui-border-soft); background: transparent; color: inherit; font: inherit; text-align: left; cursor: pointer; transition: background .16s ease; }
#assetsView .skillhub-vrow:first-child { border-top: 0; }
#assetsView .skillhub-vrow:hover { background: color-mix(in srgb, var(--hui-text) 3%, transparent); }
#assetsView .skillhub-vrow.is-current { background: color-mix(in srgb, var(--hui-accent) 5%, var(--hui-surface)); }
#assetsView .skillhub-dot { width: 9px; height: 9px; margin-top: 4px; border: 1.5px solid var(--hui-border-strong); border-radius: 50%; background: var(--hui-surface); }
#assetsView .skillhub-vrow.is-latest .skillhub-dot { border-color: var(--hui-accent); background: var(--hui-accent); }
#assetsView .skillhub-v { color: var(--hui-text); font: 600 12.5px/1.5 var(--hui-mono); }
#assetsView .skillhub-c { color: var(--hui-secondary); font-size: 12.5px; line-height: 1.6; overflow-wrap: anywhere; white-space: pre-line; }
#assetsView .skillhub-c small { display: block; color: var(--hui-tertiary); font-size: 11.5px; }
#assetsView .skillhub-marks { display: flex; gap: 6px; }

/* ---------- SkillHub install / update dialog ---------- */
#assetsView .skillhub-modal { position: fixed; inset: 0; z-index: 4050; display: grid; place-items: center; max-width: none; background: var(--hui-scrim); }
#assetsView .skillhub-mcard { box-sizing: border-box; width: min(460px, 92vw); max-height: calc(100vh - 32px); overflow: auto; padding: 22px 24px 20px; border: 1px solid var(--hui-border); border-radius: 14px; background: var(--hui-surface); box-shadow: var(--hui-popover-shadow); animation: skillhubModalIn .32s var(--hui-ease-flow); }
@keyframes skillhubModalIn { from { opacity: 0; transform: translateY(6px) scale(.985); } to { opacity: 1; transform: none; } }
#assetsView .skillhub-mcard h3 { margin: 0; color: var(--hui-text); font: 600 16px/1.35 var(--hui-sans); }
#assetsView .skillhub-msub { margin: 4px 0 18px; color: var(--hui-secondary); font-size: 12.5px; line-height: 1.6; }
#assetsView .skillhub-field { margin-bottom: 14px; }
#assetsView .skillhub-field > label { display: block; margin-bottom: 6px; color: var(--hui-secondary); font-size: 12px; }
#assetsView .skillhub-field .asset-input { height: 36px; border-radius: 8px; }
#assetsView .skillhub-field .asset-input.is-bad { border-color: var(--hui-error); box-shadow: none; }
#assetsView .skillhub-full-select .hui-select-trigger { width: 100%; height: 36px; border-radius: 8px; }
#assetsView .skillhub-full-select .hui-select-trigger.is-filtered { border-color: var(--hui-border-strong); background: var(--hui-surface); color: var(--hui-text); }
#assetsView .skillhub-field-err { display: flex; align-items: center; gap: 5px; margin-top: 6px; color: var(--hui-error); font-size: 12px; }
#assetsView .skillhub-field-help { margin-top: 6px; color: var(--hui-tertiary); font-size: 12px; }
#assetsView .skillhub-changelog { padding: 10px 12px; border-radius: 8px; background: var(--hui-canvas); color: var(--hui-secondary); font-size: 12.5px; line-height: 1.7; white-space: pre-line; overflow-wrap: anywhere; }
#assetsView .skillhub-changelog small { display: block; margin-top: 4px; color: var(--hui-tertiary); font-size: 12px; white-space: normal; }
#assetsView .skillhub-mact { display: flex; justify-content: flex-end; gap: 8px; margin-top: 20px; }

/* ---------- Responsive ---------- */
@media (min-width: 1101px) and (min-height: 820px) {
  #assetsView .asset-aside { position: sticky; top: 96px; }
}
@media (max-width: 1100px) {
  #assetsView .asset-dbody { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 820px) {
  #assetsView .asset-heading,
  #assetsView .asset-toolbar,
  #assetsView .asset-dhead { flex-wrap: wrap; }
  #assetsView .asset-heading { align-items: flex-start; }
  #assetsView .asset-search { width: 100%; }
  #assetsView .asset-dhead { position: static; }
  #assetsView .asset-acts { flex-wrap: wrap; }
  #assetsView .asset-grid { grid-template-columns: minmax(0, 1fr); }
  #assetsView .skillhub-filters { flex-wrap: wrap; }
  #assetsView .skillhub-filters .skillhub-search { flex-basis: 100%; }
  #assetsView .skillhub-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #assetsView .skillhub-files { grid-template-columns: minmax(0, 1fr); }
  #assetsView .skillhub-ftree { max-height: 200px; border-right: 0; border-bottom: 1px solid var(--hui-border-soft); }
}

@media (prefers-reduced-motion: reduce) {
  #assetsView *,
  #assetsView *::after { transition: none !important; animation: none !important; }
  #assetsView .asset-card:hover,
  #assetsView .asset-card:hover .asset-card-go { transform: none; }
  #assetsView .skillhub-drawer,
  #assetsView .skillhub-drawer.is-open { transition: none; }
}