.part-library {
    --part-border: #dce5ef;
    --part-muted: #5f7188;
    --part-primary: var(--app-primary, #1269da);
    background: #f5f8fc;
    color: #101828;
    min-height: 60vh;
}

.part-library__header {
    background:
        radial-gradient(circle at 86% 18%, rgba(20, 184, 166, .15), transparent 30%),
        linear-gradient(135deg, #eff6ff 0%, #f5fbff 56%, #edfffb 100%);
    border-bottom: 1px solid #dce7f2;
    overflow: hidden;
    padding: 2.35rem 0 2.7rem;
    position: relative;
}
.part-library__header .container { position: relative; z-index: 1; }
.part-library__decoration { inset: 0; overflow: hidden; pointer-events: none; position: absolute; }
.part-library__watermark {
    color: rgba(18, 105, 218, .065);
    font-size: 15rem;
    line-height: 1;
    position: absolute;
    right: max(2rem, calc((100vw - 1320px) / 2));
    top: -3.8rem;
    transform: rotate(-10deg);
}
.part-library__eyebrow {
    align-items: center;
    color: #075fba;
    display: flex;
    font-size: .78rem;
    font-weight: 800;
    gap: .5rem;
    letter-spacing: .075em;
    margin: 0 0 .6rem;
    text-transform: uppercase;
}
.part-library__header h1 {
    font-size: clamp(2rem, 4vw, 3.2rem);
    font-weight: 800;
    letter-spacing: -.04em;
    line-height: 1.04;
    margin: 0;
    max-width: 48rem;
}
.part-library__intro {
    color: #52657c;
    font-size: 1.05rem;
    line-height: 1.7;
    margin: .85rem 0 0;
    max-width: 49rem;
}

.part-search {
    align-items: stretch;
    display: grid;
    gap: .7rem;
    grid-template-columns: minmax(0, 40rem) auto;
    margin-top: 1.55rem;
    max-width: 51rem;
}
.part-search__input { position: relative; }
.part-search__input > i {
    color: #6b7d91;
    left: 1rem;
    pointer-events: none;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
}
.part-search__input input {
    background: rgba(255, 255, 255, .96);
    border: 1px solid #bfd0e2;
    border-radius: .82rem;
    box-shadow: 0 .55rem 1.5rem rgba(39, 71, 108, .08);
    color: #101828;
    height: 3.25rem;
    padding: 0 1rem 0 2.8rem;
    width: 100%;
}
.part-search__input input:focus {
    border-color: var(--part-primary);
    box-shadow: 0 0 0 .22rem rgba(18, 105, 218, .14);
    outline: 0;
}
.part-search__submit { border-radius: .82rem; font-weight: 750; padding-inline: 1.2rem; }
.part-search__help {
    color: #60738a;
    display: flex;
    flex-wrap: wrap;
    font-size: .82rem;
    gap: .45rem 1rem;
    grid-column: 1 / -1;
    line-height: 1.45;
}
.part-search__reset { font-weight: 700; text-decoration: none; }
.part-search__reset:hover { text-decoration: underline; }
.part-search__error {
    color: #a11919;
    font-size: .82rem;
    font-weight: 700;
    grid-column: 1 / -1;
}

.part-library__catalog { padding-bottom: 4rem; padding-top: 2.15rem; }
.part-library__results-heading {
    align-items: end;
    display: flex;
    gap: 1rem;
    justify-content: space-between;
    margin-bottom: 1.15rem;
}
.part-library__results-heading h2 { font-size: 1.55rem; font-weight: 800; letter-spacing: -.025em; margin: 0; }
.part-library__results-heading p { color: var(--part-muted); font-size: .9rem; margin: .3rem 0 0; }
.part-library__page {
    background: #e9f3ff;
    border: 1px solid #cfe1f5;
    border-radius: 999px;
    color: #315778;
    flex: 0 0 auto;
    font-size: .78rem;
    font-weight: 750;
    padding: .45rem .75rem;
}

.part-grid { display: grid; gap: 1rem; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.part-tile {
    background: #fff;
    border: 1px solid var(--part-border);
    border-radius: 1rem;
    box-shadow: 0 .7rem 1.9rem rgba(15, 23, 42, .045);
    display: flex;
    flex-direction: column;
    min-height: 13.5rem;
    padding: 1rem;
    position: relative;
    transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}
.part-tile:has(.part-tile__link:hover) { border-color: #aac8ea; box-shadow: 0 1rem 2.2rem rgba(15, 23, 42, .08); transform: translateY(-2px); }
.part-tile__top { align-items: flex-start; display: flex; gap: .9rem; }
.part-tile__visual,
.part-row__visual {
    align-items: center;
    background: #edf5ff;
    border: 1px solid #d9e7f6;
    border-radius: .78rem;
    color: var(--part-primary);
    display: inline-flex;
    flex: 0 0 auto;
    height: 4.5rem;
    justify-content: center;
    overflow: hidden;
    width: 4.5rem;
}
.part-tile__visual--image,
.part-row__visual--image { background: #fff; padding: .25rem; }
.part-tile__visual img,
.part-row__visual img { height: 100%; object-fit: contain; width: 100%; }
.part-tile__identity { min-width: 0; }
.part-tile__brand { color: #39719f; display: block; font-size: .72rem; font-weight: 800; letter-spacing: .055em; margin-bottom: .28rem; text-transform: uppercase; }
.part-tile__name { font-size: 1rem; font-weight: 800; line-height: 1.35; margin: 0; }
.part-tile__link,
.part-row__link { color: #111b2e; text-decoration: none; }
.part-tile__link::after,
.part-row__link::after { content: ''; inset: 0; position: absolute; }
.part-tile__link:hover,
.part-row__link:hover { color: var(--part-primary); }
.part-tile__link:focus-visible,
.part-row__link:focus-visible { border-radius: .25rem; outline: 3px solid rgba(18, 105, 218, .28); outline-offset: 3px; }
.part-tile__reference { align-items: center; color: #60738a; display: flex; font-size: .78rem; gap: .4rem; margin: .45rem 0 0; overflow-wrap: anywhere; }
.part-tile__description { color: #63758a; display: -webkit-box; font-size: .84rem; line-height: 1.52; margin: .9rem 0 0; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 3; }
.part-tile__footer { align-items: center; color: var(--part-primary); display: flex; font-size: .8rem; font-weight: 750; gap: .45rem; justify-content: flex-end; margin-top: auto; padding-top: .85rem; }

.part-list {
    background: #fff;
    border: 1px solid var(--part-border);
    border-radius: 1rem;
    box-shadow: 0 .8rem 2.2rem rgba(15, 23, 42, .05);
    overflow: hidden;
}
.part-list__head {
    align-items: center;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(8.5rem, .25fr) minmax(8.5rem, .23fr) 7.2rem;
}
.part-row {
    align-items: center;
    display: grid;
    grid-template-columns: 4.1rem minmax(0, 1fr) minmax(8.5rem, .25fr) minmax(8.5rem, .23fr) 7.2rem;
}
.part-list__head {
    background: #f3f7fb;
    color: #53677d;
    font-size: .7rem;
    font-weight: 800;
    letter-spacing: .055em;
    padding: .72rem 1rem .72rem 5.85rem;
    text-transform: uppercase;
}
.part-row {
    gap: .9rem;
    min-height: 5.5rem;
    padding: .65rem 1rem;
    position: relative;
    transition: background .16s ease;
}
.part-row + .part-row { border-top: 1px solid #e7edf4; }
.part-row:has(.part-row__link:hover) { background: #f8fbff; }
.part-row__visual { height: 4.1rem; width: 4.1rem; }
.part-row__identity { align-self: center; }
.part-row__identity h3 { font-size: .94rem; font-weight: 800; line-height: 1.35; margin: 0; }
.part-row__identity p { color: #6a7b8f; font-size: .78rem; line-height: 1.4; margin: .22rem 0 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.part-row__meta { color: #53677d; font-size: .82rem; margin: 0; overflow-wrap: anywhere; }
.part-row__reference { font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace; }
.part-row__open { align-items: center; color: var(--part-primary); display: inline-flex; font-size: .78rem; font-weight: 750; gap: .4rem; justify-self: end; }

.part-library__empty {
    background: #fff;
    border: 1px solid var(--part-border);
    border-radius: 1rem;
    padding: 3.5rem 1.5rem;
    text-align: center;
}
.part-library__empty > i { color: #7d9cbb; font-size: 2rem; margin-bottom: .8rem; }
.part-library__empty h3 { font-size: 1.2rem; font-weight: 800; }
.part-library__empty p { color: var(--part-muted); margin: .4rem auto 1rem; max-width: 36rem; }
.part-library .subject-pagination { display: flex; justify-content: center; margin-top: 1.7rem; }

@media (max-width: 991.98px) {
    .part-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .part-list__head { display: none; }
    .part-list { background: transparent; border: 0; box-shadow: none; display: grid; gap: .85rem; grid-template-columns: repeat(2, minmax(0, 1fr)); overflow: visible; }
    .part-row { align-items: start; background: #fff; border: 1px solid var(--part-border); border-radius: .9rem; display: grid; gap: .25rem .75rem; grid-template-columns: 3.7rem minmax(0, 1fr); min-height: 0; padding: .8rem; }
    .part-row + .part-row { border-top: 1px solid var(--part-border); }
    .part-row__visual { grid-column: 1; grid-row: 1 / span 4; height: 3.7rem; width: 3.7rem; }
    .part-row__identity { grid-column: 2; margin: 0; padding: 0; }
    .part-row__identity p { display: -webkit-box; white-space: normal; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
    .part-row__meta { grid-column: 2; }
    .part-row__meta[data-label]::before { color: #74869a; content: attr(data-label) ': '; font-size: .66rem; font-weight: 800; letter-spacing: .035em; text-transform: uppercase; }
    .part-row__open { grid-column: 2; justify-self: start; padding-top: .25rem; }
}

@media (max-width: 767.98px) {
    .part-library__header { padding: 1.75rem 0 2rem; }
    .part-library__watermark { font-size: 10rem; right: -2rem; top: -1.5rem; }
    .part-library__header h1 { font-size: 2rem; }
    .part-library__intro { font-size: .94rem; }
    .part-search { grid-template-columns: minmax(0, 1fr); }
    .part-search__submit { height: 3rem; }
    .part-search__help { grid-column: 1; }
    .part-library__catalog { padding-bottom: 3rem; padding-top: 1.55rem; }
    .part-library__results-heading { align-items: flex-start; flex-direction: column; gap: .65rem; }
    .part-library__page { align-self: flex-start; }
    .part-grid,
    .part-list { grid-template-columns: minmax(0, 1fr); }
    .part-tile { min-height: 0; }
}

@media (prefers-reduced-motion: reduce) {
    .part-tile,
    .part-row { transition: none; }
}