.splitPane { display: grid; grid-template-columns: 52fr 48fr; gap: 1px; background: var(--border-subtle); border: 1px solid var(--border-subtle); border-radius: var(--radius-md); min-height: 500px; } .listPane { background: var(--bg-base); display: flex; flex-direction: column; border-radius: var(--radius-md) 0 0 var(--radius-md); } .detailPane { background: var(--bg-base); overflow-y: auto; padding: 20px; border-radius: 0 var(--radius-md) var(--radius-md) 0; } .listHeader { display: flex; align-items: center; gap: 8px; padding: 12px; border-bottom: 1px solid var(--border-subtle); } .listHeaderSearch { flex: 1; } .entityList { flex: 1; overflow-y: auto; } .entityItem { display: flex; align-items: flex-start; gap: 10px; padding: 10px 12px; cursor: pointer; transition: background 0.1s; border-bottom: 1px solid var(--border-subtle); } .entityItem:hover { background: var(--bg-hover); } .entityItemSelected { background: var(--bg-raised); } .entityInfo { flex: 1; min-width: 0; } .entityName { font-size: 13px; font-weight: 500; color: var(--text-primary); font-family: var(--font-body); } .entityMeta { font-size: 11px; color: var(--text-muted); font-family: var(--font-body); margin-top: 2px; } .entityTags { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 4px; } .detailHeader { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; } .detailHeaderInfo { flex: 1; min-width: 0; } .detailName { font-size: 16px; font-weight: 600; color: var(--text-primary); font-family: var(--font-body); } .detailEmail { font-size: 12px; color: var(--text-muted); font-family: var(--font-body); } .metaGrid { display: grid; grid-template-columns: auto 1fr; gap: 6px 16px; margin-bottom: 16px; font-size: 12px; font-family: var(--font-body); } .metaLabel { color: var(--text-muted); font-weight: 500; } .metaValue { color: var(--text-primary); } .sectionTags { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; margin-bottom: 8px; } .selectWrap { margin-top: 8px; max-width: 240px; } .emptyDetail { display: flex; align-items: center; justify-content: center; height: 100%; color: var(--text-faint); font-size: 13px; font-family: var(--font-body); } .createForm { padding: 12px; border-bottom: 1px solid var(--border-subtle); background: var(--bg-raised); display: flex; flex-direction: column; gap: 8px; } .createFormRow { display: flex; gap: 8px; } .createFormActions { display: flex; gap: 8px; justify-content: flex-end; } .inheritedNote { font-size: 11px; color: var(--text-muted); font-style: italic; font-family: var(--font-body); margin-top: 4px; } .providerBadge { margin-left: 6px; }