.accessory-page { padding-top: 28px; padding-bottom: 48px; }
.collection-scope { max-width: 850px; color: #b9becb; line-height: 1.7; }
.accessory-inline { background: none; border: 0; padding: 0; color: #ffb12b; text-decoration: underline; cursor: pointer; }
#accessory-bar { width: 100%; height: 12px; accent-color: #ffb12b; margin-bottom: 24px; }
.accessory-filters { display: grid; grid-template-columns: 2fr 1fr 1fr; gap: 16px; margin: 24px 0; }
.accessory-filters label { min-width: 0; color: #b9becb; }
.accessory-filters .form-control { margin-top: 8px; background: #141421; color: #eee; border-color: #363644; }
.accessory-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.accessory-card { display: grid; grid-template-columns: 32px minmax(0, 1fr); align-content: start; gap: 8px 12px; padding: 20px; border: 1px solid #30303d; border-radius: 12px; background: #141421; color: #eee; text-align: left; cursor: pointer; }
.accessory-card:hover, .accessory-card:focus-visible { border-color: #ffb12b; background: #1d1c2a; }
.accessory-card img { width: 32px; height: 32px; object-fit: contain; grid-row: 1 / span 5; }
.accessory-card strong { color: #ffc15b; overflow-wrap: anywhere; }
.accessory-card span, .accessory-card small { grid-column: 2; color: #aab1c1; }
.accessory-card.discovered small { color: #73d7a3; }
.accessory-pages { display: flex; justify-content: center; align-items: center; gap: 20px; margin-top: 28px; }
@media (max-width: 991px) { .accessory-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 575px) { .accessory-grid, .accessory-filters { grid-template-columns: 1fr; } .accessory-pages { gap: 10px; } }

#panel-header.theme-accessories { background: linear-gradient(135deg, #0d1117, #0d3037 50%, #10434b); border-bottom: 2px solid #45c5ce; }
#panel-header.theme-accessories h1 { color: #72dce2; }
#cd-mobile-sort, #hg-mobile-sort { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; margin-bottom: 20px; }
#cd-mobile-sort select, #hg-mobile-sort select, #cd-mobile-sort button, #hg-mobile-sort button { background: #141421; color: #eee; border: 1px solid #363644; border-radius: 6px; padding: 8px 12px; }
.accessory-card strong { grid-column: 2; }

.accessory-summary .cd-summary-card { border-color: rgba(69,197,206,.15); height: 100%; }
.accessory-summary .cd-summary-card:hover { border-color: rgba(69,197,206,.4); }
.accessory-summary .cd-summary-card > i { color: #45c5ce; }
