.src-choice { max-width: 820px; margin: var(--ds-space-2) auto 0; }
.src-choice-head { margin-bottom: var(--ds-space-5); }
.src-choice-head h2 { margin: var(--ds-space-1) 0 var(--ds-space-2); font-weight: 800; letter-spacing: -.035em; }
.src-choice-head p { margin: 0; color: var(--ds-text-2); line-height: 1.55; }
.src-choice-eyebrow { display: block; color: var(--ds-text-3); font-size: var(--ds-font-size-caption); font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.src-choice-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--ds-space-4); }
.src-choice-card { appearance: none; width: 100%; display: grid; grid-template-columns: 48px 1fr auto; gap: var(--ds-space-4); align-items: center; padding: var(--ds-space-5); border: 1px solid var(--ds-border); border-radius: var(--ds-radius-card); background: var(--ds-surface); color: var(--ds-text); text-align: left; text-decoration: none; cursor: pointer; transition: border-color var(--ds-transition), box-shadow var(--ds-transition), transform var(--ds-transition); }
.src-choice-card:hover { color: var(--ds-text); border-color: var(--ds-text-2); box-shadow: var(--ds-shadow-card); transform: translateY(-1px); text-decoration: none; }
.src-choice-icon,
.src-row-icon { display: grid; place-items: center; width: 44px; height: 44px; border-radius: var(--ds-radius-control); background: var(--ds-surface-2); color: var(--ds-text); }
.src-choice-card strong,
.src-choice-card small { display: block; }
.src-choice-card strong { margin-bottom: var(--ds-space-1); font-size: 16px; }
.src-choice-card small { color: var(--ds-text-2); font-size: var(--ds-font-size-secondary); line-height: 1.4; }
.src-choice-note { margin: var(--ds-space-4) 0 0; padding: var(--ds-space-3) var(--ds-space-4); border-radius: var(--ds-radius-control); background: var(--ds-surface-2); color: var(--ds-text-2); font-size: var(--ds-font-size-secondary); }
.src-back { margin-bottom: var(--ds-space-4); }
.src-back a { color: var(--ds-text-2); font-weight: 600; text-decoration: none; }
.src-search { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: var(--ds-space-3); padding: var(--ds-space-2) var(--ds-space-3) var(--ds-space-2) var(--ds-space-4); border: 1px solid var(--ds-border); border-radius: var(--ds-radius-control); background: var(--ds-surface); margin-bottom: var(--ds-space-5); }
.src-search i { color: var(--ds-text-3); }
.src-search input { min-width: 0; padding: var(--ds-space-2) 0; border: 0; outline: 0; background: transparent; }
.src-search button { padding: var(--ds-space-3) var(--ds-space-4); border: 0; border-radius: var(--ds-radius-control); background: var(--ds-black); color: var(--ds-white); font-weight: 700; }
.src-catalog-list { display: grid; gap: var(--ds-space-2); }
.src-catalog-row { display: grid; grid-template-columns: 44px minmax(220px, 1fr) auto auto auto; align-items: center; gap: var(--ds-space-4); padding: var(--ds-space-4); background: var(--ds-surface); border: 1px solid var(--ds-border); border-radius: var(--ds-radius-control); }
.src-row-copy strong,
.src-row-copy span { display: block; }
.src-row-copy span { margin-top: var(--ds-space-1); color: var(--ds-text-2); font-size: var(--ds-font-size-secondary); }
.src-row-ref { color: var(--ds-text-3); font-size: var(--ds-font-size-caption); font-weight: 700; }
.src-row-state { padding: var(--ds-space-2) var(--ds-space-3); border-radius: var(--ds-radius-pill); background: var(--ds-surface-2); color: var(--ds-text-2); font-size: var(--ds-font-size-caption); font-weight: 700; white-space: nowrap; }
.src-row-state.is-synced { color: var(--ds-status-success); }
.src-empty { padding: var(--ds-space-10) var(--ds-space-6); text-align: center; border: 1px dashed var(--ds-border); border-radius: var(--ds-radius-card); background: var(--ds-surface); }
.src-empty > i,
.src-empty strong,
.src-empty span,
.src-empty a { display: block; }
.src-empty > i { margin-bottom: var(--ds-space-3); color: var(--ds-text-3); font-size: var(--ds-space-6); }
.src-empty span { max-width: 620px; margin: var(--ds-space-2) auto var(--ds-space-4); color: var(--ds-text-2); }
.src-empty a { color: var(--ds-text); font-weight: 700; }

@media (max-width: 800px) {
    .src-choice-grid { grid-template-columns: 1fr; }
    .src-catalog-row { grid-template-columns: 40px 1fr; }
    .src-row-ref,
    .src-row-state,
    .src-catalog-row > .btn { grid-column: 2; }
    .src-catalog-row > .btn { justify-self: start; }
    .src-search { grid-template-columns: auto 1fr; }
    .src-search button { grid-column: 1 / -1; }
}
