/* Skill catalogue styles, scoped to the secondary page. */
.skills-page{--ink:#272335;--muted:#756e80;--purple:#6750a6;--line:#e4ddef;--lavender:#f3eef9}
.skills-page nav a[aria-current=page]{color:#574187;font-weight:650;position:relative}
.skills-page nav a[aria-current=page]:after{content:"";position:absolute;bottom:2px;left:0;right:0;height:2px;background:#8062a6;border-radius:2px}
.library-main{padding-top:27px}
.library-path{display:flex;align-items:center;gap:12px;font-size:12px;color:#8a8194}
.library-path a{color:#84778f;text-decoration:none}
.library-path a:hover{text-decoration:underline}
.preview-tag{margin-left:auto;font-size:11px;color:#7b6c8a;background:#eee9f2;padding:3px 10px;border-radius:5px}
.library-hero{text-align:center;padding:37px 0 38px}
.library-hero .eyebrow{font-size:11px;letter-spacing:3px}
.library-hero h1{font-size:clamp(28px,3.3vw,40px);letter-spacing:-1px;margin:13px 0 12px}
.library-hero .lead{font-size:15px;margin:0;color:#7b7185}
.library-search{width:min(560px,100%);margin:27px auto 0;display:flex;align-items:center;gap:12px;padding:0 17px;background:#fff;border:1px solid #ddd3e8;border-radius:12px;box-shadow:0 8px 25px #45335e04;transition:border-color .15s,box-shadow .15s}
.library-search:focus-within{border-color:#9577bb;box-shadow:0 0 0 3px #8062a612}
.library-search svg{width:20px;height:20px;fill:none;stroke:#8b799f;stroke-width:1.7;flex-shrink:0;stroke-linecap:round}
.library-search input{width:100%;min-width:0;height:54px;border:0;outline:none;background:transparent;font:inherit;font-size:14px;color:#40364f}
.library-search input::placeholder{color:#a096a9}
.library-search kbd{font:12px inherit;color:#a296ad;border:1px solid #eee8f3;border-radius:4px;padding:0 7px}
.catalogue-toolbar{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:0 0 17px;border-bottom:1px solid #e6e0eb}
.category-tabs{display:flex;gap:7px;flex-wrap:wrap}
.category-tabs button{border:1px solid transparent;border-radius:8px;background:transparent;padding:8px 17px;color:#82758e;font-size:13px;line-height:1.7;min-height:40px}
.category-tabs button:hover{background:#eee8f4;color:#5d477d}
.category-tabs button[aria-pressed=true]{background:#6750a6;border-color:#6750a6;color:#fff}
.result-count{color:#96899f;font-size:12px;white-space:nowrap;font-variant-numeric:tabular-nums}
.catalogue-note{font-size:12px;color:#918599;margin:16px 0 19px;display:flex;gap:7px;align-items:center}
.catalogue-note>span{font-size:17px;line-height:1;color:#9883af}
.skill-grid{margin-top:20px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:19px}
.skill-card{display:flex;flex-direction:column;position:relative;padding:24px 25px 18px;min-width:0;background:#fff;border:1px solid var(--line);border-radius:17px;box-shadow:0 12px 30px #45335e03;transition:border-color .18s,transform .18s,box-shadow .18s}
.skill-card:hover{transform:translateY(-3px);border-color:#b9a3d0;box-shadow:0 12px 30px #45335e09}
.skill-card-top{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:20px}
.skill-icon{display:grid;place-items:center;width:45px;height:45px;border:1px solid #e5dcee;border-radius:12px;background:#f6f2fb;color:#8363ad}
.skill-icon svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.skill-category{font-size:11px;letter-spacing:.3px;color:#95869f}
.skill-card h2{font-size:19px;font-weight:650;letter-spacing:0;margin:0 0 9px;color:#3a2e4a}
.skill-card p{font-size:13px;line-height:1.9;color:#83768e;margin:0 0 23px;flex:1}
.skill-card-bottom{border-top:1px solid #eee8f3;padding-top:12px;display:flex;align-items:center;justify-content:space-between}
.skill-type{font-size:11px;color:#a093a9}
.skill-open{border:0;padding:4px 0;background:transparent;color:#72558e;display:flex;align-items:center;gap:10px;font-size:12px}
.skill-open:after{content:"";position:absolute;inset:0;border-radius:17px}
.skill-open:focus-visible{outline:none}
.skill-card:has(.skill-open:focus-visible){outline:3px solid #8164cd;outline-offset:4px}
.skill-open svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.library-bottom{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:26px 29px;margin-top:30px;margin-bottom:45px;border:1px solid #e3daec;background:#f1ecf6;border-radius:14px}
.library-bottom h2{font-size:16px;letter-spacing:0;margin:0 0 4px;color:#5b456f}
.library-bottom p{font-size:12px;color:#8b7a98;margin:0}
.library-bottom a{font-size:13px;text-decoration:none;color:#6c4e8c;white-space:nowrap}
.library-bottom a:hover{text-decoration:underline}
.skills-page footer{border-top:1px solid #e6e2e9}
.library-empty{text-align:center;padding:65px 20px;background:#fff;border:1px dashed #d9cce8;border-radius:16px}
.library-empty h2{font-size:20px;margin:0 0 9px}.library-empty p{font-size:14px}
.library-empty button{border:1px solid #d8cbe8;background:#f4eff9;color:#674c8b;border-radius:8px;padding:9px 17px;font-size:13px}
.skill-dialog{width:min(520px,calc(100% - 32px));max-height:calc(100dvh - 48px);border:1px solid #ded2e9;border-radius:22px;padding:27px 32px 22px;background:#fffefa;color:#3c304a;box-shadow:0 25px 80px #30233c20;overflow-y:auto;box-sizing:border-box}
.skill-dialog::backdrop{background:#30233b66;backdrop-filter:blur(4px)}
.detail-top{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:15px}.detail-eyebrow{font-size:11px;color:#9b89a9;letter-spacing:.5px}
.close-dialog{display:grid;place-items:center;padding:9px;border:0;border-radius:50%;background:#f0ebf5;color:#7d668f}
.close-dialog svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round}
.skill-dialog .skill-icon{width:52px;height:52px;margin-bottom:15px}
.detail-category{font-size:12px;color:#92799f}
.skill-dialog h2{font-size:26px;margin:4px 0 9px}
#detail-description{font-size:14px;line-height:1.9;margin-bottom:23px}
.detail-section{padding-top:20px;border-top:1px solid #eae3ef}.detail-section h3,.prompt-box h3{font-size:13px;color:#6a507e;font-weight:600;margin:0 0 10px}
.detail-section ul{font-size:13px;line-height:1.9;padding-left:18px;color:#84718f;margin:0 0 23px}.detail-section li{padding:3px 0}.detail-section li::marker{color:#b099c2}
.prompt-box{padding:18px 20px;background:#f3edf8;border:1px solid #e5daee;border-radius:12px}
.prompt-box p{font-size:14px;line-height:1.9;color:#6e587f;margin:0 0 16px}
.prompt-box button{display:inline-flex;gap:9px;align-items:center;border:1px solid #d8c8e5;background:#fffefa;color:#77538f;border-radius:7px;padding:8px 12px;font-size:12px}
.prompt-box button svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
#copy-feedback{font-size:12px;color:#705884;margin-left:10px}
.detail-disclaimer{font-size:11px;color:#a392ad;margin:17px 0 0}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(max-width:900px){.skill-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.library-hero h1{font-size:34px}.library-bottom{align-items:flex-start}.library-bottom a{padding-top:3px}}
@media(max-width:600px){.library-main{padding-top:18px}.library-hero{text-align:left;padding:30px 0}.library-hero h1{font-size:30px;line-height:1.5;margin-top:10px}.library-hero h1 em{display:block}.library-hero .lead{font-size:13px;max-width:270px}.library-search{margin-top:23px}.library-search kbd{display:none}.library-search input{height:51px}.catalogue-toolbar{gap:9px;align-items:flex-start;flex-direction:column;padding-bottom:13px}.category-tabs{gap:3px;width:100%;justify-content:space-between;flex-wrap:nowrap}.category-tabs button{font-size:12px;padding:8px 9px;white-space:nowrap}.result-count{align-self:flex-end}.catalogue-note{font-size:11px;align-items:flex-start;line-height:1.8;margin:13px 0 17px}.catalogue-note>span{margin-top:4px}.skill-grid{grid-template-columns:1fr;gap:13px}.skill-card{padding:20px 22px 15px}.skill-card-top{margin-bottom:15px}.skill-card p{margin-bottom:17px}.library-bottom{flex-direction:column;gap:15px;padding:21px 23px;margin-top:23px;margin-bottom:30px}.library-bottom p{line-height:1.9}.skill-dialog{padding:20px 23px}.skills-page .top nav{gap:13px}.skills-page .brand{font-size:18px}.skills-page .brand img{width:27px;height:27px}.skills-page .top{min-height:77px}.skills-page footer{padding-top:25px;padding-bottom:25px;font-size:12px}}
@media(prefers-reduced-motion:reduce){.skill-card:hover{transform:none}}

/* The catalogue now shows actual project skill names and source references. */
.skill-type{font-size:10px;overflow-wrap:anywhere;padding-right:8px}.skill-open{white-space:nowrap;flex-shrink:0}
.detail-category{overflow-wrap:anywhere}.detail-disclaimer{font-size:12px;line-height:1.9;color:#8d7b99;margin:0 0 18px}.detail-source{display:inline-block;font-size:12px;margin-top:9px;color:#775d91}

.detail-package{margin-bottom:22px}.skill-download{display:block;text-align:center;padding:12px 14px;background:#6750a6;border:1px solid #6750a6;border-radius:9px;color:#fff;font-size:14px;font-weight:600;text-decoration:none}.skill-download:hover{background:#55408d}.package-info{font-size:11px;text-align:center;margin:8px 0;color:#8d7b99}.skill-install{border-bottom:0}.skill-install summary{font-size:12px;color:#7a618e;padding:8px 0}.skill-install ol{padding-left:20px;font-size:12px;color:#7c6989;line-height:1.9}.skill-install li{margin:7px 0}.skill-install p,.skill-install a{font-size:12px}.skill-install code{overflow-wrap:anywhere;font-size:11px}.hash-label{margin:14px 0 4px;font-size:10px!important;color:#9a89a5}.package-hash{display:block;word-break:break-all;color:#8b7897;line-height:1.7}.install-guide{display:inline-block;margin-top:12px}

.skill-download[aria-busy=true]{opacity:.65;cursor:wait}@media(max-width:600px){.catalogue-note>span:last-child{font-size:12px;line-height:1.8}}
