body { overflow-x: hidden; }
.skill-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.skill-card { min-width: 0; }
.catalog-title { display: flex; align-items: baseline; gap: 14px; }
.skill-total { color: #aaa8b5; font-size: 12px; }
.skill-card > p { display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 3; line-clamp: 3; }
.copy-row { display: flex; align-items: stretch; gap: 8px; min-width: 0; }
.skill-card > .copy-row { margin-top: auto; }
.copy-row code { flex: 1; min-width: 0; margin-top: 0; }
.copy-button { flex: none; width: 34px; height: 34px; display: inline-grid; place-items: center; border: 1px solid #f7f3ea; border-radius: 8px; background: #aa8cff; color: #100d18; padding: 7px; cursor: pointer; }
.copy-button svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.copy-button:hover { background: #ffd86b; }
.copy-button:focus-visible { outline: 3px solid #83c9ff; outline-offset: 2px; }
.copy-button[data-copy-state="copied"] { background: #a9f7b6; }
.copy-button[data-copy-state="failed"] { background: #ff8b9b; }
.copy-button-dark { background: #101512; color: #f7f3ea; }
.agent-guide { max-width: 1180px; margin: 84px auto 0; padding: 42px; background: #171923; display: grid; grid-template-columns: 1fr 1fr; gap: 30px; }
.agent-guide h2 { font-size: clamp(28px, 3vw, 40px); letter-spacing: -.04em; margin: 0; }
.agent-guide > div > p:not(.eyebrow), .agent-prompt p { color: #aaa8b5; line-height: 1.5; }
.agent-prompt { background: #0d0e14; border: 1px solid #3c4052; border-radius: 10px; padding: 18px; font-size: 12px; }
.agent-prompt span { color: #a9f7b6; font-weight: 500; }
.agent-prompt p { margin: 5px 0 14px; }
.agent-links { grid-column: 1 / -1; display: flex; gap: 22px; font-weight: 800; }
.agent-links a { text-decoration: underline; text-decoration-color: #aa8cff; text-decoration-thickness: 3px; text-underline-offset: 5px; }
@media (max-width: 850px) { .agent-guide { margin: 55px 18px 0; grid-template-columns: 1fr; padding: 28px; } .agent-links { grid-column: auto; flex-direction: column; } }
@media (max-width: 850px) { .skill-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 600px) { .skill-grid { grid-template-columns: minmax(0, 1fr); } }
.detail-shell { max-width: 1180px; margin: auto; padding: 64px 24px 90px; }
.back-link { display: inline-block; margin-bottom: 25px; font-weight: 800; }
.detail-hero { background: #202331; padding: 38px; display: grid; grid-template-columns: 1.3fr .7fr; gap: 40px; }
.detail-hero h1 { font-size: clamp(34px, 4vw, 48px); line-height: 1.08; margin: 0 0 20px; }
.detail-description { color: #aaa8b5; font-size: 21px; line-height: 1.5; }
.install-panel { background: #0d0e14; border: 1px solid #3c4052; border-radius: 12px; padding: 22px; display: flex; flex-direction: column; gap: 16px; align-self: start; }
.install-panel code { color: #a9f7b6; overflow-wrap: anywhere; }
.source-note,.readme { background:#171923; padding:28px; margin-top:28px; display:flex; flex-direction:column; gap:10px; }
.source-note a { color:#83c9ff; overflow-wrap:anywhere; }.source-note span{color:#aaa8b5}.readme pre{white-space:pre-wrap;color:#aaa8b5;font-family:"DM Mono",monospace}
.file-browser{background:#171923;padding:28px;margin-top:28px}.file-browser-heading{display:flex;justify-content:space-between;align-items:end;margin-bottom:18px}.file-browser-heading h2{margin:0;font-size:30px}.file-browser-heading .eyebrow{margin-bottom:6px}.file-browser-heading>span{color:#aaa8b5;font-size:12px}.file-list{border:1px solid #3c4052;border-radius:10px;overflow:hidden}.file-list a{display:grid;grid-template-columns:22px 1fr auto;gap:10px;align-items:center;padding:12px 14px;border-bottom:1px solid #3c4052}.file-list a:last-child{border-bottom:0}.file-list a:hover{background:#202331}.file-icon{color:#83c9ff}.file-path{font-size:13px;overflow-wrap:anywhere}.file-size{color:#777687;font-size:11px}
@media(max-width:700px){.detail-hero{grid-template-columns:1fr;padding:25px}.detail-shell{padding:38px 18px 70px}}
.site-header nav form { margin: 0; }
.nav-button { border: 0; background: transparent; color: inherit; font: inherit; font-weight: 700; padding: 0; cursor: pointer; }
.nav-button:hover { text-decoration: underline; text-decoration-thickness: 3px; text-underline-offset: 5px; }
.star-form,.signin-note { margin-top: 24px; }
.signin-note a { color: #a9f7b6; text-decoration: underline; }
.profile-shell { max-width: 1180px; margin: auto; padding: 72px 24px; }
.profile-shell > h1 { font-size: clamp(34px,4vw,48px); margin: 0; }
.profile-hero { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 28px; background: #171923; padding: 32px; margin-bottom: 28px; }
.profile-hero img { width: 92px; height: 92px; object-fit: cover; border: 1.5px solid #f7f3ea; border-radius: 16px; }
.profile-hero h1 { font-size: 36px; margin: 0; }
.profile-hero p:not(.eyebrow) { color: #aaa8b5; }
.impact { display: grid; grid-template-columns: auto auto; gap: 5px 12px; align-items: baseline; }
.impact strong { font-size: 24px; color: #ffd86b; }
.impact span { color: #aaa8b5; font-size: 13px; }
.badges { display: flex; gap: 10px; flex-wrap: wrap; margin: 0 0 52px; }
.badges span { background: #aa8cff; color: #100d18; border: 1.5px solid #f7f3ea; border-radius: 999px; padding: 8px 12px; font: 700 12px "DM Mono",monospace; }
@media(max-width:700px){.profile-hero{grid-template-columns:1fr}}
.publish-shell { max-width: 920px; margin: auto; padding: 72px 24px 90px; }
.publish-shell h1 { font-size: clamp(34px,4vw,48px); line-height: 1.08; margin: 0; }
.publish-form { background: #171923; padding: 32px; display: grid; gap: 20px; }
.publish-form label { display: grid; gap: 8px; font-weight: 700; }
.publish-form input,.publish-form textarea { width: 100%; background: #202331; color: #f7f3ea; border: 1.5px solid #f7f3ea; border-radius: 8px; padding: 12px; font: inherit; }
.publish-form small { color: #aaa8b5; font-weight: 500; }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.publish-form fieldset { border: 1px solid #55586a; border-radius: 10px; display: grid; gap: 12px; }
.publish-form .radio { display: flex; align-items: center; }
.publish-form .radio input { width: auto; }
.git-fields { display: grid; gap: 14px; background: #0d0e14; padding: 18px; border-radius: 10px; }
@media(max-width:650px){.form-row{grid-template-columns:1fr}.publish-form{padding:22px}}

.skill-card { position: relative; }
.skill-card .card-link::after { content: ""; position: absolute; inset: 0; border-radius: 14px; }
.skill-card .card-link:focus-visible { outline: none; }
.skill-card:has(.card-link:focus-visible) { outline: 4px solid #aa8cff; outline-offset: 4px; }
.skill-card .copy-button,.skill-card .card-meta { position: relative; z-index: 2; }
.hero { padding-top: 52px; padding-bottom: 46px; }
.hero h1 { font-size: clamp(36px,4vw,52px); max-width: none; }
.hero .lede { margin: 12px 0 26px; font-size: 19px; }
.catalog { padding-top: 48px; }
.agent-strip { max-width: 1180px; margin: 48px auto; padding: 20px 24px; background: #171923; display: flex; align-items: center; gap: 18px; }
.agent-strip span { color: #aaa8b5; }
.agent-strip code { color: #a9f7b6; }
.agent-strip a { margin-left: auto; font-weight: 800; text-decoration: underline; text-underline-offset: 4px; }
@media(max-width:700px){.agent-strip{margin:32px 18px;align-items:flex-start;flex-direction:column}.agent-strip a{margin-left:0}}
.token-once { background: #a9f7b6; color: #101512; padding: 20px; margin: 24px 0; display: grid; gap: 10px; }
.token-once code { overflow-wrap: anywhere; }
.token-list { margin-top: 32px; }
.token-list>div { display: flex; justify-content: space-between; padding: 14px 0; border-bottom: 1px solid #3c4052; }
.token-list span { color: #aaa8b5; font-size: 12px; }
