.address-book-scope-list { display: grid; gap: 10px; } .address-book-scope-card { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; border: var(--border-line); border-radius: 6px; background: var(--panel-soft); padding: 14px; } .address-book-scope-card strong { display: block; color: var(--text-strong); } .address-book-scope-card p { margin: 5px 0 0; color: var(--muted); } .address-error { left: 14px; margin: 0; position: absolute; right: 14px; top: 10px; z-index: 2; } .address-book-page.address-book-fullscreen { display: grid; grid-template-rows: 1fr; height: calc(100vh - 115px); overflow: hidden; padding: 0; position: relative; } .address-workspace-frame { height: 100%; min-height: 0; } .address-book-workspace { background: var(--panel); border: var(--border-line); border-radius: 0; display: grid; grid-template-columns: minmax(250px, 310px) minmax(280px, 360px) minmax(0, 1fr); height: 100%; min-height: 0; overflow: hidden; } .address-tree-panel, .address-list-panel, .address-detail-panel { min-height: 0; min-width: 0; } .address-tree-panel { border-right: var(--border-line); } .address-tree-header { background: var(--panel-header); } .address-tree-header .button-row { flex-wrap: wrap; } .address-icon-actions { max-width: 150px; } .address-icon-actions .btn { align-items: center; aspect-ratio: 1; display: inline-flex; justify-content: center; min-height: 30px; padding: 0; width: 30px; } .address-tree-filter-row { border-bottom: var(--border-line); padding: 10px 12px; } .address-tree-filter-row .toggle-switch-row { margin: 0; } .address-tree-list { padding: 6px 0 10px; } .address-book-page .explorer-tree-node .address-tree-node-content { display: grid; gap: 1px; min-width: 0; } .address-tree-node-content strong, .address-tree-node-content small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .address-tree-node-content small { color: var(--muted); font-size: 0.78rem; } .address-tree-summary { border-top: var(--border-line); flex: 0 0 auto; padding: 12px; } .address-source-summary { display: grid; gap: 10px; } .address-source-subsummary { border-top: var(--border-line); display: grid; gap: 8px; padding-top: 10px; } .address-source-summary p { color: var(--muted); margin: 4px 0 0; } .address-sync-dialog { max-width: min(960px, calc(100vw - 36px)); width: min(960px, calc(100vw - 36px)); } .address-sync-result-list, .address-sync-record-list, .address-sync-plan-grid { border: var(--border-line); display: grid; max-height: 260px; overflow: auto; } .address-sync-result-row, .address-sync-record-row, .address-sync-plan-row { align-items: center; background: transparent; border: 0; border-bottom: var(--border-line); color: var(--text); display: grid; gap: 10px; grid-template-columns: minmax(0, 1fr) auto; padding: 9px 10px; text-align: left; } .address-sync-result-row { cursor: pointer; } .address-sync-result-row:hover, .address-sync-result-row:focus-visible { background: var(--line); outline: none; } .address-sync-result-row strong, .address-sync-result-row small, .address-sync-record-row strong, .address-sync-record-row small, .address-sync-plan-row span, .address-sync-plan-row small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .address-sync-result-row small, .address-sync-record-row small, .address-sync-plan-row small { color: var(--muted); display: block; } .address-sync-plan-row { grid-template-columns: auto minmax(0, 1fr); } .address-sync-source-card, .address-sync-inspector { display: grid; gap: 12px; } .address-conflict-review { display: grid; gap: 14px; } .address-conflict-grid { border: var(--border-line); display: grid; grid-template-columns: minmax(120px, 0.7fr) minmax(0, 1fr) minmax(0, 1fr) auto; max-height: min(52vh, 520px); overflow: auto; } .address-conflict-grid-header, .address-conflict-row > * { border-bottom: var(--border-line); min-width: 0; padding: 9px 10px; } .address-conflict-grid-header { background: var(--line); color: var(--muted); font-size: 0.78rem; font-weight: 700; position: sticky; text-transform: uppercase; top: 0; z-index: 1; } .address-conflict-row { display: contents; } .address-conflict-row.has-difference > * { background: var(--surface-subtle); } .address-conflict-row span { overflow-wrap: anywhere; } .address-conflict-choice { align-items: center; display: inline-flex; gap: 0; white-space: nowrap; } .address-conflict-choice button { background: var(--panel); border: var(--border-line); color: var(--text); cursor: pointer; font: inherit; min-height: 28px; padding: 3px 8px; } .address-conflict-choice button:first-child { border-radius: var(--radius-sm) 0 0 var(--radius-sm); } .address-conflict-choice button:last-child { border-left: 0; border-radius: 0 var(--radius-sm) var(--radius-sm) 0; } .address-conflict-choice button.is-selected { background: var(--line); box-shadow: inset 0 1px 2px rgba(var(--shadow-color-rgb), .12); } .address-list-panel, .address-detail-panel { display: flex; flex-direction: column; } .address-list-panel { border-right: var(--border-line); } .address-panel-header { align-items: flex-start; border-bottom: var(--border-line); display: flex; gap: 12px; justify-content: space-between; padding: 13px 14px; } .address-panel-header h2, .address-detail-header h2 { font-size: 1.05rem; margin: 0; } .address-panel-header p, .address-detail-header p { color: var(--muted); margin: 4px 0 0; } .address-contact-toolbar { align-items: center; display: flex; gap: 10px; border-bottom: var(--border-line); padding: 10px 12px; } .address-contact-toolbar input { flex: 1 1 auto; } .address-contact-list { display: grid; flex: 1 1 auto; min-height: 0; overflow: auto; padding: 8px; align-content: start; } .address-contact-row { align-items: center; background: transparent; border: 0; border-radius: 6px; color: var(--text); cursor: pointer; display: grid; gap: 10px; grid-template-columns: minmax(0, 1fr) auto; min-width: 0; padding: 10px; text-align: left; } .address-contact-row[draggable="true"] { cursor: grab; } .address-contact-row[draggable="true"]:active { cursor: grabbing; } .address-contact-row:hover, .address-contact-row:focus-visible, .address-contact-row.is-selected { background: var(--line); outline: none; } .address-contact-row-main { display: grid; gap: 2px; min-width: 0; } .address-contact-row-main strong, .address-contact-row-main small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .address-contact-row-main small { color: var(--muted); } .address-contact-row-meta { align-items: center; display: inline-flex; gap: 6px; justify-content: flex-end; min-width: 0; } .address-tag { background: var(--panel-soft); border: var(--border-line); border-radius: 999px; color: var(--muted); display: inline-flex; font-size: 0.75rem; font-weight: 700; line-height: 1; max-width: 110px; overflow: hidden; padding: 4px 7px; text-overflow: ellipsis; white-space: nowrap; } .address-detail-panel { overflow: auto; padding: 16px; } .address-contact-detail { display: grid; gap: 16px; } .address-detail-header { align-items: flex-start; display: flex; gap: 14px; justify-content: space-between; } .address-detail-section { border-top: var(--border-line); display: grid; gap: 8px; padding-top: 12px; } .address-detail-section h3 { color: var(--muted); font-size: 0.78rem; font-weight: 800; letter-spacing: 0.05em; margin: 0; text-transform: uppercase; } .address-detail-list { display: grid; gap: 8px; margin: 0; } .address-detail-list div { display: grid; gap: 2px; } .address-detail-list dt { color: var(--muted); font-size: 0.78rem; font-weight: 800; } .address-detail-list dd { margin: 0; overflow-wrap: anywhere; } .address-membership-row { align-items: center; display: flex; gap: 12px; justify-content: space-between; } .address-membership-list { display: grid; gap: 8px; } .address-membership-row p { margin: 0; } .address-detail-empty, .address-empty-note { color: var(--muted); } .address-detail-empty { align-content: center; display: grid; height: 100%; justify-items: center; padding: 24px; text-align: center; } .address-detail-empty p, .address-empty-note { margin: 6px 0 0; } .address-dialog-form { display: grid; gap: 14px; } .dialog-panel.address-contact-dialog { width: min(1120px, calc(100vw - 40px)); max-width: calc(100vw - 40px); } .dialog-panel.address-member-dialog { width: min(720px, calc(100vw - 40px)); max-width: calc(100vw - 40px); } .address-member-picker { display: grid; gap: 12px; } .address-member-search { border-bottom: 0; padding: 0; } .address-member-candidate-list { border: var(--border-line); border-radius: 6px; display: grid; max-height: min(460px, calc(100vh - 300px)); overflow: auto; } .address-member-candidate { align-items: center; border-bottom: var(--border-line); display: grid; gap: 12px; grid-template-columns: minmax(0, 1fr) minmax(180px, 0.7fr) auto; min-width: 0; padding: 10px 12px; } .address-member-candidate select { min-width: 0; } .address-member-candidate:last-child { border-bottom: 0; } .address-member-candidate:hover { background: var(--panel-soft); } .address-vcard-textarea { font-family: var(--font-mono, ui-monospace, SFMono-Regular, Consolas, monospace); min-height: 280px; } .address-form-section { border: var(--border-line); border-radius: 6px; display: grid; gap: 10px; padding: 12px; } .address-form-section-heading, .address-form-row { align-items: center; display: grid; gap: 8px; } .address-form-section-heading { grid-template-columns: minmax(0, 1fr) auto; } .address-form-list { display: grid; gap: 8px; } .address-form-row-email, .address-form-row-phone { grid-template-columns: 92px minmax(88px, 0.3fr) minmax(220px, 1fr) 34px; } .address-form-row-postal { grid-template-columns: 92px minmax(80px, 0.2fr) minmax(180px, 1fr) minmax(90px, 0.35fr) minmax(120px, 0.45fr) minmax(110px, 0.4fr) minmax(120px, 0.45fr) 34px; } .address-form-row > *, .address-form-row input, .address-form-row select, .address-form-row textarea { min-width: 0; } .address-primary-choice { align-items: center; color: var(--muted); display: inline-flex; font-size: 0.86rem; gap: 6px; } .address-form-row .btn { align-items: center; aspect-ratio: 1; display: inline-flex; justify-content: center; min-height: 30px; padding: 0; width: 30px; } .form-grid { display: grid; gap: 12px; } .form-grid.two { grid-template-columns: repeat(2, minmax(0, 1fr)); } .form-grid.three { grid-template-columns: repeat(3, minmax(0, 1fr)); } .form-grid.four { grid-template-columns: repeat(4, minmax(0, 1fr)); } .inline-actions { justify-content: flex-end; } .inline-actions .btn { align-items: center; aspect-ratio: 1; display: inline-flex; justify-content: center; min-height: 30px; padding: 0; width: 30px; } .strong-link { font-weight: 700; } .link-button { background: transparent; border: 0; color: var(--text-strong); cursor: pointer; font: inherit; padding: 0; text-align: left; } .link-button:hover { color: var(--accent); text-decoration: underline; } .is-selected-row { background: var(--panel-soft); } .address-book-page .is-archived-row { opacity: 0.72; } @media (max-width: 980px) { .address-book-workspace, .form-grid.two, .form-grid.three, .form-grid.four, .address-form-row-email, .address-form-row-phone, .address-form-row-postal { grid-template-columns: 1fr; } }