.skill-library-dialog {
  width: min(720px, calc(100vw - 32px));
  max-height: min(760px, calc(100vh - 32px));
  border: 1px solid #d9e2ed;
  border-radius: 20px;
  padding: 0;
  color: #082f60;
  background: #fffdf9;
  box-shadow: 0 28px 80px rgba(8, 47, 96, .27);
}

.skill-library-dialog::backdrop { background: rgba(5, 33, 70, .5); backdrop-filter: blur(3px); }
.skill-library-shell { padding: 28px; }
.skill-library-header { display: flex; gap: 20px; justify-content: space-between; align-items: flex-start; border-bottom: 1px solid #e6edf4; padding-bottom: 20px; }
.skill-library-header h2 { margin: 0; font-family: Georgia, serif; font-size: 30px; line-height: 1.05; }
.skill-library-header p { margin: 8px 0 0; max-width: 535px; color: #637793; line-height: 1.45; }
.skill-library-close { flex: 0 0 auto; width: 38px; height: 38px; border: 1px solid #c9d7e5; border-radius: 10px; background: #fff; color: #082f60; font-size: 25px; line-height: 1; cursor: pointer; }
.skill-library-close:hover { border-color: #fa5a1b; color: #fa5a1b; }
.skill-library-form { display: grid; grid-template-columns: 1fr 1.25fr auto; gap: 10px; align-items: end; padding: 22px 0 16px; }
.skill-library-field { display: grid; gap: 6px; color: #385573; font-size: 13px; font-weight: 700; }
.skill-library-field input, .skill-library-search { min-width: 0; box-sizing: border-box; width: 100%; min-height: 43px; padding: 10px 12px; border: 1px solid #cbd9e7; border-radius: 10px; color: #082f60; background: #fff; font: inherit; }
.skill-library-field input:focus, .skill-library-search:focus { outline: 3px solid rgba(250, 90, 27, .16); border-color: #fa5a1b; }
.skill-library-add { min-height: 43px; padding: 0 18px; border: 0; border-radius: 10px; color: #fff; background: #fa5a1b; font-weight: 800; cursor: pointer; }
.skill-library-add:hover { background: #df4810; }
.skill-library-toolbar { display: flex; gap: 12px; align-items: center; padding-bottom: 12px; }
.skill-library-toolbar small { color: #637793; white-space: nowrap; }
.skill-library-list { display: grid; gap: 8px; max-height: 345px; overflow: auto; padding-right: 4px; }
.skill-library-row { display: flex; gap: 15px; align-items: center; padding: 14px; border: 1px solid #e0e9f1; border-radius: 12px; background: #fff; }
.skill-library-row.is-retired { opacity: .65; background: #f7fafc; }
.skill-library-name { display: block; color: #082f60; font-size: 15px; font-weight: 800; }
.skill-library-description { display: block; margin-top: 3px; color: #637793; font-size: 13px; }
.skill-library-meta { display: block; margin-top: 5px; color: #8192a9; font-size: 12px; }
.skill-library-row-copy { flex: 1; min-width: 0; }
.skill-library-state { border-radius: 999px; padding: 5px 9px; color: #0e7466; background: #e8f7f2; font-size: 12px; font-weight: 700; }
.skill-library-row.is-retired .skill-library-state { color: #74614b; background: #f6ecdc; }
.skill-library-actions { display: flex; gap: 7px; flex-wrap: wrap; justify-content: flex-end; }
.skill-library-action { min-height: 32px; padding: 0 10px; border: 1px solid #cbd9e7; border-radius: 8px; color: #082f60; background: #fff; font-size: 12px; font-weight: 700; cursor: pointer; }
.skill-library-action:hover { border-color: #fa5a1b; color: #fa5a1b; }
.skill-library-action.danger:hover { border-color: #bf3030; color: #bf3030; }
.skill-library-empty { padding: 26px; border: 1px dashed #cbd9e7; border-radius: 12px; color: #637793; text-align: center; }
.skill-library-status { min-height: 20px; margin: 8px 0 0; color: #637793; font-size: 13px; }
.skill-library-status.is-error { color: #b8322c; }
@media (max-width: 620px) { .skill-library-shell { padding: 20px; } .skill-library-form { grid-template-columns: 1fr; } .skill-library-add { width: 100%; } .skill-library-row { align-items: flex-start; flex-wrap: wrap; } .skill-library-actions { width: 100%; justify-content: flex-start; } }
