.library-item {
    border: 1px solid var(--line);
    border-radius: 12px;
    padding: 16px;
    margin-top: 14px;
    background: #fcfdff;
}

.library-item > summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
}

.library-cover {
    width: 180px;
    aspect-ratio: 1 / 1;
    object-fit: contain;
    background: #fff;
    border-radius: 10px;
    margin: 10px 0 18px;
}

.library-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
}

.library-toolbar h2 { margin-bottom: 6px; }

.library-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    gap: 18px;
    margin-bottom: 24px;
}

.library-card {
    min-width: 0;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: #fff;
    overflow: hidden;
    box-shadow: 0 4px 14px #20353e0a;
}

.library-card[open] { grid-column: 1 / -1; }
.library-card-summary { display: block; cursor: pointer; list-style: none; }
.library-card-summary::-webkit-details-marker { display: none; }

.library-card-cover {
    width: 100%;
    height: auto;
    aspect-ratio: 1 / 1;
    display: block;
    object-fit: contain;
    background: #fff;
}

.library-card-placeholder {
    display: grid;
    place-items: center;
    color: #5e8179;
    font-size: 21px;
    font-weight: 800;
    letter-spacing: 4px;
    background: linear-gradient(135deg, #edf3fb, #cfe0da);
}

.library-card-body { padding: 17px; }
.library-card-body h3 { margin: 14px 0 4px; font-size: 17px; }
.library-card-body > p { margin: 3px 0; }
.library-description { min-height: 38px; color: var(--muted); font-size: 12px; }
.library-card-stats { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 15px; }
.library-card-stats span { padding: 9px; border-radius: 8px; background: #f5f8fc; font-size: 11px; }
.library-card-stats b { display: block; color: var(--green); font-size: 17px; }
.library-edit-hint { display: block; margin-top: 14px; color: var(--green); font-size: 11px; font-weight: 700; }
.library-card-editor { padding: 22px; border-top: 1px solid var(--line); background: #fcfdff; }

.library-modal {
    width: min(1050px, calc(100vw - 32px));
    max-height: calc(100vh - 32px);
    overflow: auto;
    padding: 0;
    border: 0;
    border-radius: 16px;
    color: var(--ink);
    box-shadow: 0 24px 80px #10272455;
}

.library-modal::backdrop { background: #10272499; backdrop-filter: blur(3px); }
.library-modal-head { position: sticky; top: 0; z-index: 2; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 20px 24px; border-bottom: 1px solid var(--line); background: #fff; }
.library-modal-head h2 { margin: 0 0 4px; }
.library-modal-content { padding: 24px; }
.modal-close { width: 42px; height: 42px; padding: 0; font-size: 25px; }
.compact-modal { width: min(700px, calc(100vw - 32px)); }

.trainer-photo {
    width: 80px;
    height: 80px;
    object-fit: cover;
    border-radius: 50%;
    margin: 10px 0;
}

.choice-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
    gap: 10px;
    margin: 12px 0;
}

.choice-grid label {
    border: 1px solid var(--line);
    border-radius: 8px;
    padding: 10px;
    background: white;
}
.position-input { width: 64px; min-height: 30px; margin-right: 8px; padding: 4px; }

.program-training-picker { margin: 18px 0 20px; padding-top: 16px; border-top: 1px solid var(--line); }
.training-picker-toolbar { margin-bottom: 10px; }
.training-picker-toolbar p { margin: 4px 0 0; }
.selected-training-list { display: grid; gap: 9px; padding: 0; margin: 0; list-style: none; }
.selected-training-item { display: grid; grid-template-columns: 30px 30px minmax(0, 1fr) auto; gap: 10px; align-items: center; min-height: 58px; padding: 9px 12px; border: 1px solid var(--line); border-radius: 10px; background: #fff; transition: border-color .15s, box-shadow .15s, opacity .15s; }
.selected-training-item:hover { border-color: #a8c9c1; box-shadow: 0 4px 12px #20353e0b; }
.selected-training-item.is-dragging { opacity: .45; border-color: var(--green); }
.drag-handle { color: var(--muted); font-size: 24px; line-height: 1; cursor: grab; text-align: center; user-select: none; }
.selected-training-item:active .drag-handle { cursor: grabbing; }
.training-order { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; color: var(--green); background: #e4f3ed; font-weight: 800; font-size: 12px; }
.selected-training-title { min-width: 0; }
.training-item-actions { display: flex; gap: 5px; }
.training-item-actions button { min-width: 34px; }
.training-item-actions button:disabled { opacity: .35; cursor: default; }
.training-remove { background: #fae9e5; color: #9e4135; }
.training-picker-empty { padding: 24px; border: 1px dashed var(--line); border-radius: 10px; }
.training-picker-dialog { width: min(980px, calc(100vw - 32px)); }
.training-card-picker { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 14px; }
.training-pick-card { position: relative; display: block; padding: 0; overflow: hidden; text-align: right; color: var(--ink); background: #fff; border: 2px solid var(--line); border-radius: 13px; box-shadow: 0 3px 12px #20353e0a; transition: border-color .15s, box-shadow .15s, transform .15s; }
.training-pick-card:hover { filter: none; border-color: #91bcb1; transform: translateY(-2px); }
.training-pick-card.is-selected { border-color: var(--green); box-shadow: 0 0 0 3px #087e7320; }
.training-pick-card img, .training-pick-placeholder { display: grid; place-items: center; width: 100%; height: auto; aspect-ratio: 1 / 1; object-fit: contain; background: linear-gradient(135deg, #edf3fb, #cfe0da); color: #5e8179; font-weight: 800; letter-spacing: 3px; }
.training-pick-body { display: block; padding: 13px; }
.training-pick-body b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.training-pick-body small { display: block; margin-top: 6px; color: var(--muted); }
.training-pick-check { display: grid; place-items: center; width: 25px; height: 25px; flex: 0 0 25px; border-radius: 50%; color: transparent; background: #edf2f0; }
.training-pick-card.is-selected .training-pick-check { color: #fff; background: var(--green); }
.training-picker-footer { position: sticky; bottom: 0; z-index: 2; display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 16px 24px; border-top: 1px solid var(--line); background: #fff; }
.program-library-list { margin-bottom: 24px; }
.plan-training-card-choices label { position: relative; padding: 0; border: 0; cursor: pointer; }
.plan-training-card-choices input { position: absolute; opacity: 0; pointer-events: none; }
.plan-training-card-choices span { display: block; min-height: 70px; padding: 18px; border: 2px solid var(--line); border-radius: 11px; background: #fff; font-weight: 700; transition: border-color .15s, background .15s; }
.plan-training-card-choices input:checked + span { color: var(--green); border-color: var(--green); background: #e9f5f1; }

.definition-policy-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 14px;
    margin: 12px 0 18px;
}

.definition-builder,
.definition-policy-grid section,
.definition-assessment-builder,
.definition-certificate-builder {
    border: 1px solid var(--line);
    border-radius: 8px;
    padding: 14px;
    margin-top: 14px;
    background: #fff;
}

.definition-policy-grid h4,
.definition-assessment-builder h3,
.definition-certificate-builder h3 {
    margin: 0 0 12px;
    font-size: 15px;
}

.inline-choice {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    margin: 0 0 10px 12px;
    font-weight: 700;
}

.certificate-layer-mini {
    display: grid;
    gap: 9px;
    margin-top: 12px;
}

.certificate-layer-mini-row {
    display: grid;
    grid-template-columns: minmax(180px, 1fr) 76px 76px 76px 58px 84px 42px;
    gap: 8px;
    align-items: center;
}

.certificate-layer-mini-row input,
.certificate-layer-mini-row select { min-height: 38px; }

.outline-builder-card {
    border: 1px solid var(--line);
    border-radius: 8px;
    padding: 12px;
    margin-top: 10px;
    background: #fcfdff;
}

.outline-main-row,
.outline-topic-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 10px;
    align-items: center;
}

.outline-topic-list {
    display: grid;
    gap: 8px;
    margin-top: 10px;
    padding-right: 16px;
    border-right: 3px solid #e4f3ed;
}

.definition-task-table input,
.definition-task-table select { min-height: 38px; }

.eligibility-definition .table-wrap { margin-top: 12px; }

.plan-grid,
.trainer-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(290px, 1fr));
    gap: 14px;
    margin-top: 18px;
}

.plan-card {
    border: 1px solid var(--line);
    border-radius: 12px;
    padding: 18px;
    background: #fcfdff;
}

.plan-card h3 { margin: 0; }
.trainer-chips { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 16px; }
.training-context { display: grid; grid-template-columns: auto 1fr; gap: 20px; align-items: start; }
@media (max-width: 650px) {
    .training-context { grid-template-columns: 1fr; }
    .library-toolbar { align-items: flex-start; }
    .library-toolbar > .row { justify-content: flex-end; }
    .library-grid { grid-template-columns: 1fr; }
    .library-card[open] { grid-column: auto; }
    .library-card-editor, .library-modal-content { padding: 16px; }
    .training-picker-toolbar { align-items: flex-start; }
    .training-card-picker { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
    .training-pick-card img, .training-pick-placeholder { height: auto; }
    .training-picker-footer { align-items: flex-start; padding: 13px 16px; }
    .selected-training-item { grid-template-columns: 25px 28px minmax(0, 1fr); }
    .training-item-actions { grid-column: 2 / -1; justify-content: flex-end; }
    .outline-main-row,
    .outline-topic-row { grid-template-columns: 1fr; }
    .certificate-layer-mini-row { grid-template-columns: 1fr 1fr; }
    .certificate-layer-mini-row input:first-child,
    .certificate-layer-mini-row select { grid-column: 1 / -1; }
}
