/* 沿用技能模块布局，交互配色与系统蓝紫主题一致，仅作用于技能中心和专用弹窗。 */
#toolsPage .skill-center { padding: 12px 24px 16px; background: #fafafb; color: #262a34; }
.skill-center [hidden], .skill-upload-dialog [hidden] { display: none !important; }
.skill-center button, .skill-upload-dialog button { font: inherit; cursor: pointer; }
.skill-center button:disabled, .skill-upload-dialog button:disabled { cursor: not-allowed; opacity: .5; }
.skill-center button:focus-visible, .skill-center summary:focus-visible, .skill-upload-dialog button:focus-visible, .skill-upload-dialog a:focus-visible { outline: 2px solid var(--theme-blue); outline-offset: 3px; }
.skill-center-header { flex: none; gap: 30px; margin: 0 0 20px; border-bottom-color: #dedff7; }
.skill-center-header-actions { display: flex; flex: none; align-items: center; justify-content: flex-end; gap: 8px; margin-bottom: 14px; }
.skill-center-header-actions button, .skill-center-filter-popover button[type="submit"], .skill-center-filter-popover button[type="reset"], .skill-upload-dialog footer button { min-height: 32px; padding: 6px 14px; border: 1px solid var(--theme-border); border-radius: 7px; background: #fff; color: var(--theme-blue); font-size: 12px; }
.skill-center-header-actions button:not(.skill-center-primary):hover:not(:disabled), .skill-center-filter-popover button[type="reset"]:hover, .skill-upload-dialog footer button:not(.skill-center-primary):hover { border-color: #c7baf8; background: #f4f1ff; }
.skill-center .skill-center-primary, .skill-center-filter-popover .skill-center-primary[type="submit"], .skill-upload-dialog .skill-center-primary { border: 1px solid transparent; border-radius: 7px; background: linear-gradient(180deg, #9884f7, #6947ee); box-shadow: inset 0 1px 0 #ffffff35, 0 4px 10px #7356e812; color: #fff; }
.skill-center .skill-center-primary:hover:not(:disabled), .skill-upload-dialog .skill-center-primary:hover:not(:disabled) { background: linear-gradient(180deg, #8b75ed, #5d3cdd); }
.skill-center svg, .skill-upload-dialog svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.skill-center .personal-skill-workspace { display: flex; flex: 1; min-height: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
.skill-center .personal-skill-content { width: 100%; padding: 0; }
.skill-center-views button { padding: 10px 2px 12px; color: #647294; font-size: 12px; }
.skill-center-views button.active { color: #6245ed; border-bottom: 3px solid #6245ed; }
.skill-center-views span { padding: 2px 6px; background: #eceaff; color: #6245ed; font-size: 10px; }
.skill-center-searchbar { position: relative; display: flex; flex: none; align-items: center; gap: 8px; margin: 0 0 14px; }
.skill-center-search { display: flex; flex: 1 1 250px; align-items: center; gap: 8px; min-width: 150px; max-width: 360px; height: 34px; padding: 0 10px; border: 1px solid #e5e6eb; border-radius: 8px; background: #fff; color: #a0a5b0; }
.skill-center-search:focus-within { border-color: #aa9bea; box-shadow: 0 0 0 3px #8b7de812; }
.skill-center-search input { width: 100%; min-width: 0; padding: 0; border: 0; outline: none; background: transparent; color: #333943; font: inherit; font-size: 12px; }
.skill-center-search input::placeholder { color: #9a9faa; }
.skill-center-categories { display: flex; gap: 6px; min-width: 0; overflow: auto; scrollbar-width: none; }
.skill-center-categories::-webkit-scrollbar { display: none; }
.skill-center-categories button, .skill-center-more > summary { flex: none; min-height: 32px; padding: 6px 11px; border: 1px solid #e9eaee; border-radius: 7px; background: #fff; color: #6e7583; font-size: 12px; white-space: nowrap; }
.skill-center-categories button:hover { border-color: #d8d0fb; background: #f7f4ff; color: var(--theme-blue); }
.skill-center-categories button.active { border-color: #d8d0fb; background: #f1edff; color: var(--theme-blue); font-weight: 500; }
.skill-center-more { flex: none; }
.skill-center-more > summary { display: flex; align-items: center; gap: 6px; list-style: none; cursor: pointer; }
.skill-center-more > summary::-webkit-details-marker { display: none; }
.skill-center-more[open] > summary { border-color: #d8d0fb; background: #f1edff; color: var(--theme-blue); }
.skill-center-filter-popover { position: absolute; top: calc(100% + 7px); right: 0; z-index: 8; width: 340px; max-width: 100%; padding: 16px; border: 1px solid #e6e7ec; border-radius: 12px; background: #fff; box-shadow: 0 12px 32px #2529331a; }
.skill-center-filter-popover .personal-skill-filters { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.skill-center-filter-popover .personal-panel-heading { padding: 0 0 10px; }
.skill-center-filter-popover .search-field { width: 100%; min-width: 0; }
.skill-center-filter-popover .personal-category-tree { max-height: 180px; }
.skill-center-filter-popover .personal-skill-filter-actions { justify-content: flex-end; padding-top: 14px; }
.skill-center-list-panel { flex: 1; min-height: 0; overflow: auto; padding: 2px 3px 6px; margin: 0 -3px; }
.skill-center .personal-skill-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; min-height: auto; overflow: visible; padding: 0; }
.skill-center .personal-skill-card { position: relative; min-height: 164px; padding: 18px 20px; border: 1px solid #e8e9f1; border-radius: 14px; background: #fff; box-shadow: 0 2px 6px #35334d05; cursor: pointer; }
.skill-center .personal-skill-card:hover { transform: none; border-color: #cfc7f4; background: #fdfcff; box-shadow: 0 6px 18px #6958df10; }
.skill-center .personal-skill-card:has(.personal-skill-name-link:focus-visible) { outline: 2px solid var(--theme-blue); outline-offset: 1px; }
.skill-center .personal-skill-name-link:focus-visible { outline: none; }
.skill-center .personal-skill-card-head { align-items: center; gap: 12px; }
.skill-center [data-skill-icon-tone="blue"] { --skill-icon-background: #4265ff; }
.skill-center [data-skill-icon-tone="teal"] { --skill-icon-background: #26a0b3; }
.skill-center [data-skill-icon-tone="violet"] { --skill-icon-background: #ad7beb; }
.skill-center [data-skill-icon-tone="amber"] { --skill-icon-background: #e69538; }
.skill-center [data-skill-icon-tone="green"] { --skill-icon-background: #40b97c; }
.skill-center [data-skill-icon-tone="rose"] { --skill-icon-background: #ce65a0; }
.skill-center [data-skill-icon-tone="builtin-blue"] { --skill-icon-background: #4265ff; }
.skill-center [data-skill-icon-tone="builtin-green"] { --skill-icon-background: #40b97c; }
.skill-center [data-skill-icon-tone="builtin-violet"] { --skill-icon-background: #ad7beb; }
.skill-center [data-skill-icon-tone="builtin-amber"] { --skill-icon-background: #e69538; }
.skill-center [data-skill-icon-tone="builtin-rose"] { --skill-icon-background: #ce65a0; }
.skill-center [data-skill-icon-tone="builtin-teal"] { --skill-icon-background: #26a0b3; }
.skill-center .personal-skill-card-icon { width: 40px; height: 40px; border: 0; border-radius: 11px; background: var(--skill-icon-background, #5b7bce); color: #fff; }
.skill-center .personal-skill-card-icon svg { width: 21px; height: 21px; }
.skill-center .personal-skill-card-title { display: grid; gap: 3px; }
.skill-center .personal-skill-card-title button { overflow: hidden; color: #272c36; font-size: 14px; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
.skill-center .personal-skill-card-title button:hover { color: var(--theme-blue); text-decoration: none; }
.skill-center .personal-skill-card-desc { min-height: 42px; margin: 12px 0 0; color: #7c8496; font-size: 12px; line-height: 1.75; overflow-wrap: anywhere; }
.skill-center .personal-skill-card-meta { gap: 6px; margin-top: auto; padding-top: 12px; }
.skill-center .personal-skill-card-meta .personal-tag { max-width: 100%; padding: 2px 8px; border: 1px solid #eee8ff; border-radius: 6px; background: #f0eaff; color: #8052e8; font-size: 11px; line-height: 18px; white-space: normal; overflow-wrap: anywhere; }
.skill-center .builtin-skill-card { display: grid; grid-template-columns: 40px minmax(0, 1fr); grid-template-rows: auto 1fr auto; gap: 6px 16px; aspect-ratio: 3.6 / 1; min-height: 0; }
.skill-center .builtin-skill-card .personal-skill-card-head { display: contents; }
.skill-center .builtin-skill-card .personal-skill-card-icon { grid-area: 1 / 1 / 3 / 2; }
.skill-center .builtin-skill-card .personal-skill-card-title { grid-area: 1 / 2; align-self: center; min-height: 24px; }
.skill-center .builtin-skill-card .personal-skill-card-desc { grid-area: 2 / 2; min-height: 0; margin: 0; }
.skill-center .builtin-skill-card .personal-skill-card-meta { grid-area: 3 / 2; justify-content: flex-end; align-self: end; margin: 0; padding: 0; }
.skill-center .builtin-skill-card .personal-tag { border-color: #eee8ff; background: #f0eaff; color: #8052e8; }
.skill-center .personal-skill-detail .skill-detail-tags > span { background: #f0eaff; color: #8052e8; }
.skill-center .user-skill-card { display: grid; grid-template-columns: 40px minmax(0, 1fr); grid-template-rows: 40px minmax(0, 1fr) auto; gap: 4px 16px; aspect-ratio: 3.6 / 1; min-height: 0; padding-block: 16px; }
.skill-center .user-skill-card .personal-skill-card-head { display: contents; }
.skill-center .user-skill-card .personal-skill-card-icon { grid-area: 1 / 1; }
.skill-center .user-skill-card .personal-skill-card-title { grid-area: 1 / 2; align-self: center; justify-items: start; gap: 2px; padding-right: 22px; }
.skill-center .user-skill-card .personal-skill-card-desc { grid-area: 2 / 2; min-height: 0; margin: 0; -webkit-line-clamp: 1; }
.skill-center .user-skill-card .personal-skill-card-meta { grid-area: 3 / 2; justify-content: flex-end; margin: 0; padding: 0; }
.skill-center .user-skill-card:has(.personal-skill-card-select:checked) { border-color: #b8a8f4; background: #fcfbff; }
.skill-card-state { color: #8d929e; font-size: 11px; line-height: 16px; }
.skill-card-state.enabled { color: #438f89; }
.skill-center .skill-card-more { position: absolute; top: 12px; right: 12px; display: grid; place-items: center; width: 28px; height: 28px; padding: 0; border: 0; border-radius: 6px; background: transparent; color: #8790a2; opacity: 0; }
.user-skill-card:hover .skill-card-more, .user-skill-card:focus-within .skill-card-more, .skill-center .skill-card-more[aria-expanded="true"] { opacity: 1; }
.skill-center .skill-card-more:hover, .skill-center .skill-card-more[aria-expanded="true"] { background: #f0eaff; color: var(--theme-blue); }
.skill-center .skill-card-more svg { width: 18px; height: 18px; }
.skill-center .personal-skill-card-menu { position: fixed; inset: auto; width: 172px; min-width: 0; max-height: calc(100dvh - 24px); margin: 0; padding: 6px; overflow: auto; border: 1px solid #e8e5f0; border-radius: 10px; background: #fff; box-shadow: 0 8px 28px #2924431a, 0 2px 6px #29244308; color: #596273; }
.skill-center .personal-skill-card-menu:not(:popover-open) { display: none; }
.skill-center .personal-skill-card-menu:popover-open { display: grid; }
.skill-center .personal-skill-card-menu button, .skill-center .personal-skill-card-menu label { display: flex; align-items: center; gap: 8px; min-height: 34px; padding: 7px 10px; border: 0; border-radius: 6px; background: transparent; color: #596273; font: inherit; font-size: 12px; line-height: 20px; text-align: left; white-space: nowrap; cursor: pointer; }
.skill-center .personal-skill-card-menu svg { flex: none; width: 15px; height: 15px; }
.skill-center .personal-skill-card-menu .personal-skill-card-select { position: static; width: 15px; height: 15px; margin: 0; border-radius: 4px; }
.skill-center .personal-skill-card-menu .personal-skill-card-select:checked::after { margin: 3px 0 0 2px; }
.skill-center .personal-skill-card-menu button:hover:not(:disabled), .skill-center .personal-skill-card-menu label:hover { background: #f5f2ff; color: var(--theme-blue); }
.skill-center .personal-skill-card-menu button.danger { color: #c45b64; }
.skill-center .personal-skill-card-menu button.danger:hover { background: #fff2f3; color: #b94450; }
.skill-card-menu-divider { height: 1px; margin: 5px 4px; background: #f0edf5; }
@media (hover: none), (pointer: coarse) {
  .skill-center .skill-card-more { opacity: 1; }
}
.skill-center .personal-skill-list-toolbar { min-height: 32px; margin: 0 0 10px; color: #838996; font-size: 12px; }
.skill-center .personal-skill-list-footer { flex: none; min-height: 52px; gap: 16px; padding: 14px 56px 0 0; border-top: 1px solid #eceef5; color: #7c87a0; font-size: 12px; }
.skill-center .personal-skill-list-footer > label { white-space: nowrap; }
.skill-center .personal-pagination { flex: 1; min-width: 0; margin: 0; color: inherit; font-size: 12px; }
.skill-center .personal-pagination > span { flex: none; white-space: nowrap; }
.skill-center .personal-pagination > div { flex-wrap: wrap; justify-content: flex-end; gap: 8px; }
.skill-center .personal-pagination button { flex: none; min-width: 32px; height: 32px; padding: 0 10px; border-color: #e4e7f0; border-radius: 6px; color: #66728d; white-space: nowrap; }
.skill-center .personal-pagination button:not(:disabled):hover { border-color: #c7baf8; background: #f7f5ff; color: var(--theme-blue); }
.skill-center .personal-pagination button.active { font-weight: 600; }
.skill-center .personal-pagination label { display: inline-flex; flex: none; align-items: center; gap: 6px; white-space: nowrap; }
.skill-center .personal-skill-list-footer .personal-pagination input { width: 44px; height: 32px; padding: 0 6px; text-align: center; }
.skill-center .personal-skill-list-footer .personal-pagination select { flex: none; align-items: center; width: 104px; min-width: 104px; height: 32px; padding-block: 0; white-space: nowrap; }
.skill-center-note { flex: none; margin: 6px 0 0; color: #a1a6af; font-size: 10px; line-height: 1.6; }
.skill-center-note:empty { display: none; }
.skill-center-empty { display: grid; place-items: center; align-content: center; min-height: 280px; color: #969eac; text-align: center; }
.skill-center-empty > svg { width: 36px; height: 36px; color: #b8bdc8; }
.skill-center-empty h2 { margin: 18px 0 6px; color: #515b6c; font-size: 15px; font-weight: 500; }
.skill-center-empty p { max-width: 300px; margin: 0 0 14px; font-size: 12px; line-height: 1.8; }
.skill-center-empty button { border: 0; background: transparent; color: var(--theme-blue); font-size: 12px; }
.skill-center:has(> .personal-skill-detail:not([hidden])) > .skill-center-header { display: none; }
.skill-center .personal-skill-detail { overflow: hidden; border: 0; border-radius: 0; background: #f5f7f8; box-shadow: none; color: #365755; }
.skill-center .personal-skill-detail-heading { display: flex; gap: 24px; padding: 26px 32px; border: 0; border-bottom: 1px solid #f0f2f3; }
.skill-center .personal-skill-detail-heading-copy { display: flex; align-items: center; gap: 16px; min-width: 0; }
.skill-detail-heading-text { min-width: 0; }
.skill-center #skillDetailExport { display: inline-flex; align-items: center; gap: 6px; min-height: 32px; padding: 6px 16px; border-color: #e5ecec; border-radius: 4px; color: #426563; font-size: 12px; white-space: nowrap; }
.skill-center #skillDetailExport:hover { border-color: #cfc7f4; background: #f8f6ff; color: var(--theme-blue); }
.skill-detail-name { display: flex; align-items: center; gap: 8px; min-width: 0; max-width: 100%; }
.skill-detail-back { display: grid; flex: none; place-items: center; width: 32px; height: 32px; padding: 0; border: 0; border-radius: 6px; background: transparent; color: #536b70; cursor: pointer; }
.skill-detail-back svg { width: 18px; height: 18px; }
.skill-detail-back:hover { background: #f4f1ff; color: var(--theme-blue); }
.skill-detail-back:focus-visible { outline: 2px solid var(--theme-blue); outline-offset: 2px; }
.skill-center .personal-skill-title { flex-wrap: wrap; gap: 8px 12px; }
.skill-center .personal-skill-detail-icon { flex: none; width: 60px; height: 60px; border: 0; border-radius: 14px; background: var(--skill-icon-background, #5b7bce); color: #fff; }
.skill-center [data-skill-icon-tone] { background-image: linear-gradient(135deg, #ffffff12, #ffffff00); box-shadow: inset 0 1px 2px #ffffff30, 0 8px 18px color-mix(in srgb, var(--skill-icon-background) 20%, transparent); }
.skill-center .personal-skill-detail-icon svg { width: 25px; height: 25px; }
.skill-center .personal-skill-title h2 { min-width: 0; color: #203f3d; font-size: 20px; font-weight: 600; line-height: 1.45; overflow-wrap: anywhere; }
.skill-center .personal-skill-title .table-status { flex: none; padding: 3px 10px; border-radius: 16px; font-size: 12px; }
.skill-detail-tags { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; }
.skill-detail-tags:empty { display: none; }
.skill-detail-tags > span { padding: 4px 10px; border-radius: 20px; background: #eef1ff; color: #637cff; font-size: 11px; line-height: 1.5; overflow-wrap: anywhere; }
.skill-center #skillDetailName:focus { outline: none; }
.skill-center .personal-skill-detail-tabs { gap: 48px; margin: 0; padding: 0 32px; border-color: #eaf0f1; }
.skill-center .personal-skill-detail-tabs button { gap: 6px; min-height: 56px; padding: 0; border-bottom-width: 3px; color: #607d7b; font-size: 14px; font-weight: 600; }
.skill-center .personal-skill-detail-tabs button.active { color: var(--theme-blue); font-weight: 600; }
.skill-center .personal-skill-detail-tabs button span { padding: 0; background: none; color: inherit; font-size: inherit; }
.skill-center .personal-skill-detail-panel { display: flex; flex-direction: column; gap: 18px; padding: 18px 20px; background: #fff; }
.skill-center .personal-skill-detail-card { min-width: 0; min-height: 0; padding: 24px 26px; border: 1px solid #e5eded; border-radius: 12px; background: #fff; }
.skill-center .personal-skill-detail-card h3 { margin: 0; color: #284c49; font-size: 15px; font-weight: 600; }
.skill-center .personal-skill-detail-card > p { margin: 6px 0 20px; color: #819b99; font-size: 12px; line-height: 1.6; }
.skill-center .personal-skill-properties { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0; border: 1px solid #e8eeee; border-radius: 0; overflow: hidden; }
.skill-center .personal-skill-property { display: grid; grid-template-columns: 144px minmax(0, 1fr); gap: 0; min-height: 50px; border: 0; border-bottom: 1px solid #e8eeee; font-size: 12px; }
.skill-center .personal-skill-property:nth-child(odd):not(.skill-property-wide) { border-right: 1px solid #e8eeee; }
.skill-center .skill-property-wide { grid-column: 1 / -1; }
.skill-center .personal-skill-property:last-child { border-bottom: 0; }
.skill-center .personal-skill-property > span,
.skill-center .personal-skill-property > strong { display: flex; align-items: center; padding: 10px 16px; }
.skill-center .personal-skill-property > span { background: #f8fafa; color: #64817f; font-weight: 600; }
.skill-center .personal-skill-property > strong { color: #426663; font-weight: 400; line-height: 1.75; }
.skill-center .skill-detail-scenarios { min-height: 190px; }
.skill-center .skill-detail-scenarios ul { display: grid; gap: 12px; padding: 0; list-style: none; }
.skill-center .skill-detail-scenarios li { display: flex; align-items: baseline; gap: 10px; padding: 0; color: #426663; font-size: 13px; line-height: 1.8; overflow-wrap: anywhere; }
.skill-center .skill-detail-scenarios li::before { content: "✓"; flex: none; display: grid; place-items: center; width: 15px; height: 15px; border: 1px solid #a9bfbc; border-radius: 50%; color: #73928e; font-size: 11px; line-height: 1; }
.skill-center .skill-detail-abilities ol { display: grid; gap: 0; font-size: 12px; line-height: 1.8; }
.skill-center .skill-detail-abilities ol li { gap: 20px; padding: 10px 0; border-bottom: 1px solid #edf2f2; color: #426663; overflow-wrap: anywhere; }
.skill-center .skill-detail-abilities ol li:last-child { border-bottom: 0; }
.skill-center .skill-detail-abilities ol li::before { flex: none; min-width: 20px; color: #819b99; font-size: inherit; line-height: inherit; }
.skill-center .personal-skill-detail-files { margin: 18px 20px; border: 1px solid #e5eded; border-radius: 12px; grid-template-columns: 200px minmax(0, 1fr); }
.skill-center .personal-skill-detail-files > aside { padding: 18px 12px; border-color: #e8eeee; }
.skill-center .personal-skill-detail-files > aside > strong { overflow-wrap: anywhere; font-size: 11px; }
.skill-center .personal-skill-detail-files > aside button { min-height: 36px; font-size: 12px; }
.skill-center .personal-skill-markdown-preview { padding: 18px 24px; font-size: 12px; line-height: 1.9; }
.skill-center .skill-file-metadata { font-size: 12px; }
@media (max-width: 700px) {
  .skill-center .personal-skill-detail-heading { flex-wrap: wrap; gap: 14px; padding: 20px 16px; }
  .skill-center .personal-skill-detail-heading-copy { align-items: flex-start; gap: 12px; width: 100%; }
  .skill-center .personal-skill-detail-icon { width: 44px; height: 44px; border-radius: 10px; }
  .skill-center .personal-skill-title h2 { min-width: 0; font-size: 18px; }
  .skill-center .skill-detail-export { margin-left: auto; }
  .skill-center .personal-skill-detail-tabs { gap: 24px; padding: 0 16px; }
  .skill-center .personal-skill-detail-tabs button { min-height: 48px; font-size: 13px; }
  .skill-center .personal-skill-detail-panel { gap: 12px; padding: 12px; }
  .skill-center .personal-skill-detail-card { padding: 18px 14px; }
  .skill-center .personal-skill-detail-card h3 { font-size: 14px; }
  .skill-center .personal-skill-detail-card > p { font-size: 12px; }
  .skill-center .personal-skill-properties { grid-template-columns: minmax(0, 1fr); }
  .skill-center .personal-skill-property { grid-template-columns: 80px minmax(0, 1fr); font-size: 12px; }
  .skill-center .personal-skill-property:nth-child(odd):not(.skill-property-wide) { border-right: 0; }
  .skill-center .personal-skill-property > span, .skill-center .personal-skill-property > strong { padding: 9px; }
  .skill-center .skill-detail-scenarios { min-height: 0; }
  .skill-center .skill-detail-scenarios li, .skill-center .skill-detail-abilities ol { font-size: 12px; }
  .skill-center .personal-skill-detail-files { grid-template-columns: minmax(0, 1fr); grid-template-rows: auto minmax(0, 1fr); margin: 12px; }
  .skill-center .personal-skill-detail-files > aside { max-height: 130px; padding: 12px; border-right: 0; border-bottom: 1px solid #e8eeee; }
  .skill-center .personal-skill-markdown-preview { padding: 16px; }
}
.skill-guided-view { position: relative; flex: 1; min-height: 0; overflow: auto; }
.skill-center .skill-guided-back { display: inline-flex; align-items: center; gap: 6px; height: 32px; padding: 0; border: 0; border-radius: 4px; background: transparent; color: #7c8494; font-size: 12px; font-weight: 400; line-height: 20px; white-space: nowrap; }
.skill-guided-back svg { flex: none; width: 14px; height: 14px; transform: rotate(180deg); }
.skill-center .skill-guided-back:hover { color: var(--theme-blue); }
.skill-guided-back:hover span { text-decoration: underline; text-underline-offset: 4px; }
.skill-guided-body { width: min(720px, 100%); margin: 70px auto 20px; }
.skill-guided-brand { display: grid; place-items: center; width: 54px; height: 54px; margin: auto; border-radius: 15px; background: linear-gradient(105deg, #2eabf5 0%, #7952ed 100%); color: #fff; }
.skill-guided-brand svg { width: 29px; height: 29px; }
.skill-guided-body > h2 { margin: 18px 0 8px; color: #292e38; font-size: 22px; text-align: center; }
.skill-guided-intro { margin: 0 0 28px; color: #949aa5; font-size: 12px; text-align: center; line-height: 1.8; }
.skill-guided-messages { display: grid; gap: 12px; max-height: 280px; margin: 0 0 18px; overflow: auto; }
.skill-guided-message { padding: 12px 15px; border-radius: 12px; background: #f0f1f5; color: #596271; font-size: 13px; line-height: 1.8; white-space: pre-wrap; overflow-wrap: anywhere; }
.skill-guided-message.user { justify-self: end; max-width: 90%; background: #f1edff; color: #555a65; }
.skill-guided-composer { padding: 14px 16px; border: 1px solid #e7e7ed; border-radius: 17px; background: #f0f0f5; box-shadow: 0 0 0 7px #ebebef66; }
.skill-guided-composer:focus-within { border-color: #aa9bea; box-shadow: 0 0 0 3px #8b7de812, 0 4px 16px #30344408; }
.skill-guided-composer-label { display: flex; align-items: center; gap: 7px; color: #575d6a; font-size: 12px; }
.skill-guided-composer-label strong { font-weight: 500; }
.skill-guided-composer-label span { margin-left: auto; color: #a1a6af; font-size: 11px; }
.skill-guided-composer textarea { width: 100%; min-height: 90px; margin-top: 12px; padding: 0; resize: vertical; border: 0; outline: 0; background: none; color: #333b49; font: inherit; font-size: 13px; line-height: 1.8; }
.skill-guided-composer textarea::placeholder { color: #a5a8b2; }
.skill-guided-composer footer { display: flex; align-items: center; justify-content: space-between; gap: 8px; color: #a5a9b3; font-size: 10px; }
.skill-guided-composer footer > .is-error { color: #b54755; font-size: 12px; line-height: 1.6; }
.skill-guided-composer footer button { display: grid; place-items: center; width: 31px; height: 31px; padding: 0; border-radius: 50%; }
.skill-center .sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.skill-upload-dialog { width: min(570px, calc(100vw - 28px)); max-height: calc(100dvh - 40px); padding: 0; border: 1px solid #e5e6eb; border-radius: 13px; background: #fff; color: #303744; box-shadow: 0 18px 80px #25293324; font-size: 12px; }
.skill-upload-dialog::backdrop { background: #20263455; }
.skill-upload-dialog > header { display: flex; justify-content: space-between; align-items: center; padding: 18px 22px; border-bottom: 1px solid #eeeef2; }
.skill-upload-dialog h2 { margin: 0; font-size: 15px; font-weight: 600; }
.skill-upload-dialog > header button { padding: 0 3px; border: 0; background: none; color: #9299a5; font-size: 22px; }
.skill-upload-body { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; padding: 20px 22px; }
.skill-upload-dropzone { display: grid; place-items: center; gap: 10px; padding: 25px 16px; border: 1px dashed #d9dce3; border-radius: 10px; background: #fafafb; color: #89919e; text-align: center; }
.skill-upload-dropzone.dragging { border-color: var(--theme-blue); background: #f7f4ff; }
.skill-upload-dropzone > svg { width: 30px; height: 30px; color: #a9b1bf; }
.skill-upload-dropzone strong { min-width: 0; color: #4a5363; font-size: 13px; font-weight: 500; overflow-wrap: anywhere; }
.skill-upload-dropzone p { margin: 0; color: #a0a6b1; font-size: 11px; }
.skill-upload-choose { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin-top: 4px; }
.skill-upload-sample-download { display: inline-flex; align-items: center; gap: 6px; min-height: 30px; padding: 6px 12px; border: 1px solid #e8e2f8; border-radius: 6px; background: #fff; color: var(--theme-blue); font-size: 11px; text-decoration: none; }
.skill-upload-sample-download:hover { border-color: #c7baf8; background: #f4f1ff; }
.skill-upload-sample-download svg { width: 14px; height: 14px; }
.skill-upload-choose button { padding: 6px 12px; border: 1px solid var(--theme-border); border-radius: 6px; background: #fff; color: var(--theme-blue); font-size: 12px; }
.skill-upload-choose button:hover { border-color: #c7baf8; background: #f4f1ff; }
.skill-upload-rules { margin: 0; padding-left: 18px; color: #969daa; font-size: 11px; line-height: 1.9; }
.skill-upload-body > label { display: grid; gap: 7px; color: #667181; }
.skill-upload-body input[type="text"] { width: 100%; padding: 9px 11px; border: 1px solid #e1e4eb; border-radius: 7px; font: inherit; }
.skill-upload-body input[type="text"]:focus { border-color: #aa9bea; outline: none; box-shadow: 0 0 0 3px #8b7de812; }
.skill-upload-body .skill-upload-enabled { display: flex; align-items: center; gap: 7px; }
.skill-upload-enabled input, .skill-upload-trust input { accent-color: var(--theme-blue); }
.skill-upload-review { min-width: 0; padding: 14px; border: 1px solid #e7e9ee; border-radius: 9px; background: #fafafb; }
.skill-upload-review h3 { margin: 0 0 9px; color: #4d5665; font-size: 12px; }
.skill-upload-review p { margin: 6px 0; color: #808a99; font-size: 11px; line-height: 1.8; overflow-wrap: anywhere; }
.skill-upload-review pre { max-height: 160px; margin: 12px 0 0; padding: 10px; overflow: auto; border-radius: 6px; background: #fff; color: #7c8595; font-size: 10px; line-height: 1.8; }
.skill-upload-warning { color: #b67b22 !important; }
.skill-upload-trust { display: flex; align-items: flex-start; gap: 6px; margin-top: 10px; color: #997025; font-size: 11px; line-height: 1.7; }
.skill-upload-message { min-height: 17px; margin: 0; color: #cc4449; line-height: 1.7; }
.skill-upload-dialog > footer { display: flex; justify-content: flex-end; gap: 9px; padding: 13px 22px; border-top: 1px solid #eeeef2; }
@media (min-width: 1600px) {
  .skill-center .personal-skill-card { min-height: 176px; }
  .skill-center .builtin-skill-card { min-height: 0; }
  .skill-center .user-skill-card { min-height: 0; }
  .skill-center-search { max-width: 400px; }
}
@media (max-width: 1279px) {
  .skill-center .builtin-skill-card { aspect-ratio: auto; min-height: 150px; }
  .skill-center .user-skill-card { aspect-ratio: auto; min-height: 150px; }
  .skill-center .user-skill-card .personal-skill-card-desc { -webkit-line-clamp: 2; }
}
@media (max-width: 1000px) {
  .skill-center-searchbar { flex-wrap: wrap; }
  .skill-center-search { flex-basis: 100%; max-width: none; }
  .skill-center-categories { flex: 1 1 0; order: 2; }
  .skill-center-more { order: 3; }
}
@media (max-width: 600px) {
  .skill-upload-choose { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); width: 100%; gap: 6px; }
  .skill-upload-choose button { width: 100%; min-height: 32px; padding: 6px 4px; font-size: 11px; }
  #toolsPage .skill-center { padding: 12px 14px; }
  .skill-center-header { gap: 20px; }
  .skill-center-header-actions { gap: 5px; }
  .skill-center-header-actions button { padding: 6px 9px; font-size: 11px; }
  .skill-center .personal-skill-grid { grid-template-columns: minmax(0, 1fr); gap: 11px; }
  .skill-center .personal-skill-card { padding: 14px; border-radius: 12px; }
  .skill-center .personal-skill-list-footer { flex-wrap: wrap; gap: 10px; padding: 12px 0 52px; }
  .skill-center .personal-pagination { flex-basis: 100%; flex-wrap: wrap; gap: 10px; }
  .skill-center .personal-pagination > div { flex-basis: 100%; justify-content: flex-start; gap: 6px; }
  .skill-center .personal-pagination label { display: none; }
  .skill-center .personal-skill-detail { padding: 0; }
  .skill-guided-body { margin-top: 35px; }
  .skill-guided-body > h2 { font-size: 18px; }
  .skill-guided-composer footer > span { max-width: 150px; }
  .skill-upload-body { padding: 16px; }
}