.people-workspace .planner { grid-template-columns: var(--workspace-sidebar-width) minmax(0, 1fr); }
.people-workspace.sidebar-collapsed .planner { grid-template-columns: var(--workspace-sidebar-collapsed-width) minmax(0, 1fr); }
.people-page-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }
.people-page-actions .button-secondary { display: inline-flex; align-items: center; gap: 6px; }
.people-page-actions .icon { width: 15px; height: 15px; }
.people-directory { min-width: 0; }
.people-group-heading .people-group-label { flex: 0 1 auto; min-width: 0; font-size: 11px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.people-group-actions { display: flex; align-items: center; gap: 4px; margin-left: auto; flex-shrink: 0; }
.people-group-actions .text-button { width: 22px; height: 22px; padding: 3px; border-radius: 4px; }
.people-group-actions .icon { width: 13px; height: 13px; }
.people-group-actions .text-button:hover { background: var(--soft); }
.people-group-toggle .people-chevron { transition: transform 160ms ease; }
.people-group-toggle[aria-expanded="false"] .people-chevron { transform: rotate(-90deg); }
.people-members[hidden] { display: none; }
.people-directory-person { width: 100%; text-align: left; border-top: 0; border-left: 0; border-right: 0; background: transparent; color: var(--ink); font: inherit; }
.people-avatar { width: 36px; height: 36px; margin: 0 3px; flex-shrink: 0; border: 1px solid var(--line); border-radius: 50%; background:var(--bg); display: inline-flex; align-items: center; justify-content: center; font-size: 15px; }
.people-person-copy { flex: 1; min-width: 0; }
.people-person-note { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.person-detail-body { margin-top: 24px; }
.people-page-actions[hidden] { display: none; }
.person-detail-tabs { display: flex; gap: 24px; border-bottom: 1px solid var(--line); flex-shrink: 0; overflow-x: auto; scrollbar-width: thin; }
.person-detail-tabs [role="tab"] { position: relative; flex-shrink: 0; border: 0; background: transparent; padding: 12px 2px 14px; color: var(--muted); font-size: 12px; line-height: 1.5; }
.person-detail-tabs [role="tab"]:hover { color: var(--ink); }
.person-detail-tabs [aria-selected="true"] { color: var(--ink); font-weight: 500; }
.person-detail-tabs [aria-selected="true"]::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 2px; background: var(--ink); }
.person-detail-tabs [role="tab"]:focus-visible { outline-offset: -3px; border-radius: 3px; }
.person-tab-empty { min-height: 320px; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; padding: 40px 20px; }
.person-tab-empty-icon { display: grid; place-items: center; width: 48px; height: 48px; border: 1px solid var(--line); border-radius: 12px; color: var(--muted); }
.person-tab-empty h2 { margin: 20px 0 10px; font-size: 15px; font-weight: 400; }
.person-tab-empty p { margin: 0; max-width: 320px; font-size: 12px; line-height: 1.9; color: var(--muted); }
.person-tab-coming { margin-top: 16px; font-size: 11px; color: var(--muted); }
.person-profile-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; }
.person-detail-body .person-profile-grid .person-info-section { min-width: 0; margin: 0; }
.person-info-section { border: 1px solid var(--line); border-radius: 8px; padding: 20px; }
.person-field-long { grid-column: 1 / -1; }
.person-field-empty { color: var(--muted); }
.person-info-fields dd { white-space: pre-wrap; }
.person-profile-grid > .person-inline-form { border: 1px solid var(--line); border-radius: 8px; padding: 20px; min-width: 0; }
.person-profile-grid > .person-inline-form > .person-info-section { border: 0; padding: 0; }
.person-card-actions { display: flex; justify-content: flex-end; gap: 8px; padding-top: 16px; margin-top: 20px; border-top: 1px solid var(--line); }
.person-card-edit { display: inline-flex; align-items: center; gap: 6px; flex-shrink: 0; }
.person-card-edit .icon { width: 14px; height: 14px; }
.person-back-row { display: flex; margin-bottom: 16px; flex-shrink: 0; }
.person-back { width: 28px; height: 28px; padding: 5px; border-radius: 4px; flex-shrink: 0; }
.person-back:hover { background: var(--soft); }
.person-back .icon { width: 18px; height: 18px; transform: rotate(180deg); }
.person-info-section h2 { margin: 0 0 18px; font-size: 13px; line-height: 1.5; font-weight: 500; }
.person-info-fields { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px 24px; margin: 0; }
.person-info-fields.person-basic-fields { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.person-basic-fields dd { overflow-wrap: anywhere; }
.person-info-fields > div { min-width: 0; font-size: 13px; }
.person-info-fields dt { color: var(--muted); font-size: 11px; margin-bottom: 7px; line-height: 1.5; }
.person-info-fields dd { margin: 0; line-height: 1.7; overflow-wrap: anywhere; }
.person-note { margin: 0; font-size: 13px; line-height: 1.9; white-space: pre-wrap; overflow-wrap: anywhere; }
.person-section-empty { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.person-section-empty p, .person-section-hint { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.8; }
.person-section-empty .text-button { flex-shrink: 0; }
.milestones-section .button-secondary { display: inline-flex; align-items: center; gap: 6px; }
.milestones-section .button-secondary .icon { width: 14px; height: 14px; }
.person-timeline { list-style: none; margin: 0; padding: 0 0 0 7px; }
.person-timeline li { position: relative; padding: 0 0 24px 24px; border-left: 1px solid var(--line); }
.person-timeline li:last-child { padding-bottom: 0; border-left-color: transparent; }
.timeline-dot { position: absolute; left: -4px; top: 4px; width: 7px; height: 7px; border: 1px solid var(--art-edge); border-radius: 50%; background: var(--surface); }
.person-timeline time { display: block; color: var(--muted); font-size: 11px; }
.person-timeline h3 { margin: 8px 0 0; font-size: 13px; font-weight: 500; line-height: 1.7; overflow-wrap: anywhere; }
.person-timeline p { margin: 6px 0 0; font-size: 12px; color: var(--muted); line-height: 1.8; white-space: pre-wrap; overflow-wrap: anywhere; }
.milestone-edit-list { display: grid; gap: 14px; }
.milestone-anniversary { border-top: 1px solid var(--line); padding-top: 12px; }
.milestone-anniversary .anniversary-toggle { display: flex; align-items: center; gap: 8px; color: var(--ink); }
.milestone-anniversary input[type="checkbox"] { width: 14px; height: 14px; padding: 0; accent-color: var(--ink); }
.anniversary-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-top: 12px; }
.anniversary-options[hidden], .anniversary-options [hidden] { display: none; }
.anniversary-options p { grid-column: 1 / -1; margin: 0; color: var(--muted); font-size: 11px; line-height: 1.8; }
.anniversary-badge { display: inline-block; margin-top: 6px; padding: 2px 7px; border-radius: 4px; background: var(--soft); color: var(--muted); font-size: 11px; }
.milestone-edit-row { border: 1px solid var(--line); border-radius: 6px; padding: 16px; display: grid; gap: 12px; }
.milestone-edit-row label { display: grid; gap: 7px; min-width: 0; font-size: 11px; color: var(--muted); }
.milestone-edit-top { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) 28px; align-items: end; gap: 12px; }
.milestone-edit-top > button { height: 38px; }
.milestone-edit-row input { width: 100%; min-width: 0; border: 1px solid var(--line); border-radius: 5px; padding: 10px 11px; background: var(--bg); color: var(--ink); font: inherit; font-size: 13px; }
.milestone-edit-row .date-display, .milestone-edit-row [data-time] { padding-right: 35px; }
.person-section-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 18px; }
.person-section-heading h2 { margin-bottom: 0; margin-right: auto; }
.contact-add-menu { position: relative; flex-shrink: 0; }
.contact-add-menu summary { display: flex; align-items: center; gap: 6px; cursor: pointer; list-style: none; }
.contact-add-menu summary::-webkit-details-marker { display: none; }
.contact-add-menu summary .icon { width: 14px; height: 14px; }
.contact-type-options { position: absolute; right: 0; top: calc(100% + 6px); z-index: 7; display: grid; min-width: 140px; padding: 5px; border: 1px solid var(--line); border-radius: 6px; background: var(--surface); box-shadow: 0 5px 20px #0000000a; }
.contact-type-options button { text-align: left; border: 0; background: transparent; padding: 9px 12px; font-size: 12px; border-radius: 4px; }
.contact-type-options button:hover { background: var(--soft); }
.contact-edit-list { display: grid; gap: 12px; }
.contact-edit-row { display: grid; grid-template-columns: 48px minmax(0, 1fr) minmax(0, .7fr) 28px; align-items: center; gap: 12px; }
.contact-edit-row input { width: 100%; min-width: 0; padding: 11px; border: 1px solid var(--line); border-radius: 5px; background: var(--bg); color: var(--ink); font: inherit; font-size: 13px; }
.contact-type-label { color: var(--muted); font-size: 11px; }
.contact-empty-hint { margin: 12px 0 0; font-size: 11px; color: var(--muted); line-height: 1.8; }
.contact-view-row { display: flex; align-items: baseline; gap: 16px; padding-block: 10px; }
.contact-view-row + .contact-view-row { border-top: 1px solid var(--line); }
.contact-view-row .contact-type-label { width: 48px; flex-shrink: 0; }
.contact-view-value { font-size: 13px; overflow-wrap: anywhere; min-width: 0; }
.contact-view-label { color: var(--muted); font-size: 11px; margin-left: auto; overflow-wrap: anywhere; }
.person-edit-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px 20px; }
.person-edit-field { display: grid; align-content: start; gap: 8px; min-width: 0; }
.person-edit-field > label { color: var(--muted); font-size: 11px; }
.birthday-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.birthday-field-heading { display: flex; align-items: center; justify-content: space-between; min-height: 18px; gap: 8px; color: var(--muted); font-size: 11px; }
.birthday-reminder-options { color: var(--muted); font-size: 11px; }
.birthday-shared-hint { grid-column: 1 / -1; margin-top: -10px; line-height: 1.6; }
.birthday-extra { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; font-size: 11px; color: var(--muted); }
.birthday-leap-option { display: inline-flex; align-items: center; gap: 5px; cursor: pointer; }
.birthday-leap-option[hidden] { display: none; }
.person-edit-fields .birthday-leap-option input { width: 13px; height: 13px; padding: 0; margin: 0; accent-color: var(--ink); }
.person-edit-fields input { width: 100%; min-width: 0; border: 1px solid var(--line); border-radius: 5px; padding: 11px; background: var(--bg); color: var(--ink); font: inherit; font-size: 13px; }
.person-edit-fields .date-display { padding-right: 35px; }
.person-edit-fields textarea { margin-top: 0; }
.person-inline-form textarea { margin-top: 0; resize: vertical; }
.person-form-error { color: #c04444; font-size: 12px; }
.person-form-error:empty { display: none; }
.person-edit-footer { margin-top: 24px; padding-top: 16px; border-top: 1px solid var(--line); }
.people-notice { font-size: 12px; color: var(--muted); }
.people-notice:empty { display: none; }
.people-form select, .people-form textarea { width: 100%; padding: 10px 12px; border: 1px solid var(--line); border-radius: 5px; background: var(--surface); color: var(--ink); font: inherit; font-size: 13px; }
.people-form .select-trigger { padding: 11px; font-size: 13px; border-radius: 5px; background: var(--bg); }
.people-form > label { display: block; margin: 5px 0 0; font-size: 12px; }
.people-dialog { max-height: calc(100dvh - 32px); overflow-y: auto; }
.people-form textarea { resize: vertical; }
@media (max-width: 760px) {
  .milestone-edit-row { padding: 12px; }
  .milestone-edit-top { grid-template-columns: minmax(0, 1fr) 28px; }
  .milestone-edit-top > label:nth-child(2) { grid-column: 1; grid-row: 2; }
  .milestone-edit-top > button { grid-column: 2; grid-row: 1; }
  .person-detail-tabs { gap: 18px; }
  .contact-edit-row { grid-template-columns: 36px minmax(0, 1fr) 28px; gap: 8px; }
  .contact-edit-row [data-contact-label] { grid-column: 2; grid-row: 2; }
  .contact-edit-row [data-remove-contact] { grid-column: 3; grid-row: 1; }
  .contact-view-row { flex-wrap: wrap; gap: 8px; }
  .person-info-section { padding: 16px; }
  .person-info-fields { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px 16px; }
  .person-edit-fields { grid-template-columns: minmax(0, 1fr); }
  .birthday-fields { grid-template-columns: minmax(0, 1fr); gap: 18px; }
  .person-section-empty { align-items: flex-start; flex-direction: column; gap: 8px; }
  .people-workspace .planner, .people-workspace.sidebar-collapsed .planner { grid-template-columns: var(--workspace-sidebar-mobile-width) minmax(0, 1fr); }
  .people-workspace .plan-list-heading { align-items: flex-start; flex-wrap: wrap; }
  .people-workspace .plan-heading-actions { width: 100%; align-items: flex-start; }
  .people-page-actions { justify-content: flex-start; }
}
.people-bulk-row { display: flex; align-items: center; border-bottom: 1px solid var(--line); }
.people-bulk-row .people-directory-person { flex: 1; min-width: 0; border-bottom: 0; }
.people-bulk-row .people-avatar { display: none; }
.people-bulk-row.bulk-selected { background: var(--soft); }
.bulk-person-check, [data-people-bulk-all] { width: 15px; height: 15px; margin: 0 10px; flex-shrink: 0; accent-color: var(--ink); cursor: pointer; }
.integration-form { display: grid; gap: 16px; }
.integration-form > label, .integration-form .person-edit-fields > label { display: grid; gap: 8px; color: var(--muted); font-size: 12px; }
.integration-form input:not([type="checkbox"]) { width: 100%; min-width: 0; padding: 11px; border: 1px solid var(--line); border-radius: 5px; background: var(--bg); color: var(--ink); font: inherit; font-size: 13px; }
.integration-form .integration-check { display: flex; align-items: center; gap: 8px; }
.integration-check input, .chat-contact-row input { accent-color: var(--ink); }
.integration-actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.chat-format { font-size: 12px; margin-top: 16px; color: var(--muted); }
.chat-format p { line-height: 1.8; }
.chat-format pre { overflow: auto; max-height: 350px; padding: 12px; background: var(--bg); border-radius: 5px; }
.plan-content > .person-info-section { margin-bottom: 16px; }
.plan-content > .person-info-section[hidden] { display: none; }
.chat-contact-row { display: flex; align-items: center; gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--line); font-size: 12px; }
.chat-contact-row > span:first-of-type { flex: 1; }
.chat-contact-row strong { display: block; font-weight: 500; }
.chat-contact-row small { display: block; margin-top: 5px; color: var(--muted); }
[data-contact-list] { margin: 12px 0 20px; }
.chat-job-row { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; padding: 12px 0; border-bottom: 1px solid var(--line); font-size: 12px; }
.chat-job-row > span:nth-child(2) { color: var(--muted); flex: 1; }
[data-job-section] progress { width: 100%; accent-color: var(--ink); }
.person-chat-list { display: grid; gap: 12px; margin-top: 20px; }
.person-chat-message { border: 1px solid var(--line); border-radius: 6px; padding: 14px; }
.person-chat-message > div { display: flex; justify-content: space-between; gap: 12px; font-size: 11px; }
.person-chat-message strong { font-weight: 500; }
.person-chat-message time { color: var(--muted); }
.person-chat-message p { margin: 10px 0 0; font-size: 13px; line-height: 1.8; white-space: pre-wrap; overflow-wrap: anywhere; }
.ai-config-directory { margin-bottom: 24px; }
.ai-directory-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 14px; }
.ai-directory-heading h2 { margin: 0; font-size: 12px; font-weight: 500; color: var(--muted); }
.ai-directory-heading > span { font-size: 11px; color: var(--muted); }
.ai-profiles-list { display: grid; gap: 12px; }
.ai-config-card { display: flex; align-items: center; gap: 16px; padding: 20px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); }
.ai-config-card.is-current { border-color: var(--art-edge); }
.ai-config-card.is-editing { background: var(--bg); }
.ai-config-symbol { display: grid; place-items: center; width: 42px; height: 42px; flex-shrink: 0; border-radius: 10px; background: var(--soft); color: var(--muted); }
.ai-config-symbol .icon { width: 20px; height: 20px; }
.ai-config-copy { flex: 1; min-width: 0; }
.ai-config-title { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.ai-config-title h3 { margin: 0; font-size: 15px; font-weight: 500; overflow-wrap: anywhere; }
.ai-active-badge { font-size: 10px; padding: 3px 7px; border-radius: 4px; background: var(--soft); color: var(--ink); }
.ai-active-badge::before { content: ''; display: inline-block; width: 5px; height: 5px; border-radius: 50%; background: #2e9c63; margin-right: 5px; vertical-align: middle; }
.ai-config-model { margin: 8px 0 0; font-size: 12px; overflow-wrap: anywhere; }
.ai-config-model span { color: var(--muted); }
.ai-config-endpoint { margin: 5px 0 0; color: var(--muted); font-size: 11px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; }
.ai-config-actions { display: flex; align-items: center; gap: 8px; flex-shrink: 0; }
.ai-config-actions .button-secondary { display: inline-flex; align-items: center; gap: 6px; }
.ai-config-actions .icon { width: 14px; height: 14px; }
.ai-config-actions .text-button { padding: 9px 10px; border-radius: 5px; }
.ai-config-actions .text-button:hover { background: var(--soft); }
.ai-config-empty { padding: 44px 20px; border: 1px dashed var(--line); border-radius: 8px; text-align: center; }
.ai-config-empty > .icon { width: 28px; height: 28px; color: var(--muted); }
.ai-config-empty h3 { margin: 16px 0 8px; font-size: 14px; font-weight: 500; }
.ai-config-empty p { color: var(--muted); font-size: 12px; }
.ai-editor-form { grid-template-columns: repeat(2, minmax(0, 1fr)); scroll-margin-top: 20px; }
.ai-editor-form > * { grid-column: 1 / -1; }
.ai-editor-form > label:has([name="name"]), .ai-editor-form > label:has([name="model"]), .ai-editor-form > label:has([name="timeout"]) { grid-column: auto; }
.ai-editor-heading { padding-bottom: 16px; border-bottom: 1px solid var(--line); margin-bottom: 0; }
.ai-editor-dialog .ai-editor-form { margin: 0; }
.ai-editor-dialog .editor-heading { margin-bottom: 0; }
.ai-editor-dialog .editor-heading h2 { margin: 0; font-size: 13px; font-weight: 500; }
.ai-editor-dialog .person-card-actions { margin-top: 4px; }
@media (max-width: 600px) {
  .ai-config-card { align-items: flex-start; flex-wrap: wrap; gap: 12px; padding: 16px; }
  .ai-config-copy { flex-basis: calc(100% - 60px); }
  .ai-config-actions { width: 100%; justify-content: flex-end; }
  .ai-editor-form { grid-template-columns: minmax(0, 1fr); }
}
.ai-key-control { position: relative; display: block; }
.integration-form .ai-key-control input { padding-right: 44px; }
.ai-key-control input.ai-key-hidden { -webkit-text-security: disc; }
.ai-key-control > button { position: absolute; top: 50%; right: 6px; transform: translateY(-50%); width: 32px; height: 32px; padding: 7px; border-radius: 4px; }
.ai-key-control > button:hover { background: var(--soft); }
.ai-key-control .icon { width: 18px; height: 18px; }

.ai-plan-drafts { display:grid; gap:14px; margin-top:16px; }
.ai-draft-actions { display:flex; align-items:center; gap:6px; flex-shrink:0; }
.ai-draft-actions .text-button { display:inline-flex; align-items:center; gap:5px; padding:5px; }
.ai-draft-actions .icon { width:14px; height:14px; }
.ai-draft-description { font-size:12px; line-height:1.8; white-space:pre-wrap; overflow-wrap:anywhere; max-height:160px; overflow:auto; }
.ai-draft-warnings { margin-top:12px; padding:12px; background:var(--bg); border-radius:5px; color:var(--muted); font-size:11px; line-height:1.8; }
.ai-draft-warnings ul { margin:6px 0 10px; padding-left:18px; }
.ai-plans-input .person-card-actions { justify-content:space-between; }

.ai-plans-composer { padding:0; border-radius:10px; }
.ai-plans-input { gap:0; }
.ai-plans-input .ai-composer-field { padding:18px 20px 16px; gap:12px; }
.ai-composer-heading { display:flex; align-items:baseline; justify-content:space-between; flex-wrap:wrap; gap:6px 14px; color:var(--ink); font-size:12px; }
.ai-composer-heading .person-mention-hint { margin:0; font-size:10px; }
.ai-plans-input textarea[name="text"] { border:0; border-radius:0; padding:0; min-height:132px; height:132px; font-size:14px; line-height:1.85; background:transparent; }
.ai-plans-input textarea[name="text"]:focus-visible { outline:none; box-shadow:none; }
.ai-plans-input .person-mention-textarea { border-radius:0; }
.ai-plans-input .person-mention-highlight { top:0; left:0; }
.ai-plans-input .person-mention-links:empty { display:none; }
.ai-composer-footer { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:14px 20px; border-top:1px solid var(--line); background:var(--bg); border-radius:0 0 10px 10px; }
.ai-composer-note { display:grid; gap:5px; color:var(--muted); font-size:10px; line-height:1.6; }
.ai-composer-note .text-button { display:inline-flex; align-items:center; gap:4px; justify-self:start; padding:0; font-size:10px; }
.ai-composer-note .icon { width:12px; height:12px; }
.ai-composer-footer > .button-primary { display:inline-flex; align-items:center; gap:8px; flex-shrink:0; padding:10px 14px; font-size:12px; }
.ai-composer-footer > .button-primary .icon { width:14px; height:14px; }
@media(max-width:540px) { .ai-plans-input .ai-composer-field { padding:16px; } .ai-composer-footer { padding:12px 16px; gap:10px; flex-wrap:wrap; } .ai-composer-footer > .button-primary { margin-left:auto; } }
