/* Shared wide-dialog contract: content first, controls visible, theme-aware surfaces. */
#calendar-event-dialog {
  top: 20px; left: 50%; width: min(1480px, calc(100vw - 40px)); height: calc(100dvh - 40px);
  max-height: 1040px; transform: translateX(-50%); border-radius: 16px;
}
#calendar-event-dialog > .employee-dialog-head { padding: 18px 28px; }
#calendar-event-form { flex: 1; scroll-padding-bottom: 90px; }
#calendar-event-dialog .calendar-form-grid { grid-template-columns: minmax(0, 1fr) 310px; }
#calendar-event-dialog .calendar-form-main { padding: 22px 28px 18px; }
#calendar-event-description { min-height: 100px; }
#calendar-event-dialog .calendar-form-side { padding: 22px; }
#calendar-event-dialog .calendar-room-choices { max-height: 235px; margin: 10px 0 18px; }
#calendar-event-dialog .calendar-form-zone { margin: 8px 0 18px; }
#calendar-event-dialog .calendar-time-fields { grid-template-columns: minmax(0,1fr) 12px minmax(0,1fr); gap:10px; align-items:end; }
.calendar-time-group { min-width:0; margin:0; padding:0; border:0; position:relative; }
.calendar-time-group legend { padding:0; margin:0 0 6px; font-size:.8rem; color:var(--text-secondary); }
.calendar-date-time-pair { display:grid; grid-template-columns:minmax(0,1.35fr) minmax(84px,.9fr); gap:8px; }
html:root .calendar-date-time-pair input { min-width:0; width:100%; margin:0; padding-inline:10px; }
.calendar-time-separator { align-self:end; padding-bottom:13px; color:var(--text-secondary); }
.calendar-planner { --planner-selection:#32b582; --planner-selection-border:#239466; --planner-selection-overlap:#eb7799; --planner-selection-overlap-border:#ce5e80; }
.calendar-attendee-heading { display: flex; align-items: center; gap: 12px; margin-bottom: 10px; }
.calendar-attendee-heading h3 { margin: 0; font-size: .95rem; }
.calendar-selected-people { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 12px; }
.calendar-person-chip { display: inline-flex; align-items: center; gap: 9px; padding: 5px 10px; background: var(--theme-soft); border: 1px solid var(--orero-line); color: var(--orero-ink); border-radius: 8px; font-size: .86rem; max-width: 100%; }
.calendar-person-chip > span { overflow-wrap: anywhere; }
.calendar-person-chip small { color: var(--orero-muted); font-size: .68rem; }
#calendar-event-dialog .calendar-person-chip button { background: transparent; color: var(--theme-accent); border: 0; min-height: 32px; min-width: 32px; padding: 0; font-size: 1.2rem; }
.calendar-people-picker summary { cursor: pointer; color: var(--theme-accent); min-height: 38px; padding: 7px 0; font-size: .86rem; }
.calendar-people-picker > label { margin-top: 8px; }
.calendar-planner { margin: 0 28px 24px; padding: 20px; border: 1px solid var(--orero-line); border-radius: 12px; background: var(--orero-paper); }
.planner-heading { display: flex; align-items: start; justify-content: space-between; gap: 16px; }
.planner-heading h3 { margin: 0 0 6px; font-size: 1rem; }
.planner-heading p { margin: 0; }
.planner-heading button { flex-shrink: 0; }
.planner-toolbar { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin: 18px 0 10px; }
.planner-toolbar input { width: 155px; margin: 0; min-width: 0; }
.planner-toolbar button { min-width: 40px; }
.planner-zoom { display: flex; align-items: center; gap: 8px; margin: 0 0 0 10px; font-size: .8rem; color: var(--orero-muted); }
.planner-zoom select { width: 112px; margin: 0; }
.planner-legend { margin-left: auto; display: flex; align-items: center; gap: 7px; font-size: .75rem; color: var(--orero-muted); }
.planner-legend i, .planner-legend b { display: inline-block; width: 15px; height: 10px; border-radius: 3px; background: var(--planner-busy); }
.planner-legend b { background: var(--planner-selection); margin-left: 9px; }
.planner-status { margin: 10px 0; min-height: 20px; font-size: .8rem; color: var(--orero-muted); }
.planner-board { display: grid; grid-template-columns: 220px max-content; overflow: auto; max-height: 340px; min-height: 110px; border: 1px solid var(--orero-line); border-radius: 8px; overscroll-behavior: contain; scrollbar-color: var(--theme-accent) var(--theme-soft); }
.planner-board:empty { display: block; min-height: 70px; background: var(--theme-soft); }
.planner-names { position: sticky; left: 0; z-index: 2; background: var(--orero-paper); border-right: 1px solid var(--orero-line); }
.planner-name-header { display: flex; align-items: center; height: 64px; padding: 12px; color: var(--orero-muted); font-size: .76rem; border-bottom: 1px solid var(--orero-line); }
.planner-person-name { display: flex; align-items: center; gap: 8px; height: 44px; padding: 6px 10px; font-size: .78rem; border-bottom: 1px solid var(--orero-line); }
.planner-person-name > span:last-child { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.planner-room-symbol { width: 28px; text-align: center; flex-shrink: 0; color: var(--theme-accent); }
.planner-timeline { display: block; flex-shrink: 0; background: var(--orero-paper); user-select: none; }
.planner-lane { fill: var(--orero-paper); }
.planner-lane.alternate { fill: var(--theme-soft); }
.planner-night { fill: var(--orero-muted); opacity: .06; pointer-events: none; }
.planner-grid-line { stroke: var(--orero-line); stroke-width: 1; }
.planner-day-line { stroke: var(--theme-accent); stroke-opacity: .55; }
.planner-hour { font: 10px Arial, sans-serif; fill: var(--orero-muted); }
.planner-day-title { font: 12px Arial, sans-serif; fill: var(--orero-ink); }
.planner-busy { fill: var(--planner-busy); opacity: .8; }
.planner-busy.overlap { fill: var(--planner-conflict); opacity: 1; stroke: var(--planner-conflict-border); stroke-width: 1; }
.planner-selection { touch-action: none; stroke: var(--planner-selection-border); stroke-width: 1; }
.planner-timeline.has-conflict { --planner-selection:var(--planner-selection-overlap); --planner-selection-border:var(--planner-selection-overlap-border); }
.planner-selection-move { fill: var(--planner-selection); fill-opacity: .24; cursor: grab; }
.planner-selection-move:active { cursor: grabbing; }
.planner-selection-start, .planner-selection-end { fill: var(--planner-selection); fill-opacity: .45; cursor: ew-resize; }
.planner-selection:focus-visible { outline: none; stroke: var(--theme-accent); stroke-width: 2; }
.planner-selection-summary { display: grid; gap: 6px; padding-top: 14px; font-size: .83rem; line-height: 1.5; overflow-wrap: anywhere; }
.planner-selection-summary strong { font-weight: 500; }
#planner-conflicts { color: var(--orero-muted); }
#planner-conflicts.has-conflict { color: var(--theme-danger, #9a422e); }
#calendar-event-form > .calendar-form-footer { z-index: 4; box-shadow: 0 -8px 24px #00000008; }

/* Profile: compact identity above readable contact and work information. */
#profile-dialog { width: min(1280px, calc(100vw - 48px)); height: min(900px, calc(100dvh - 48px)); max-height: calc(100dvh - 48px); top: 50%; left: 50%; transform: translate(-50%, -50%); border-radius: 16px; }
html:root #profile-dialog .profile-dialog-head { padding: 14px 20px; flex-shrink: 0; align-items:center; }
html:root #profile-dialog .profile-dialog-body { display:flex;flex-direction:column;gap:16px;min-height:0;padding:20px;flex:1; background:var(--surface-active);scrollbar-gutter:stable; }
html:root #profile-dialog .profile-hero { position:static;display:flex;flex-direction:row;flex-shrink:0;text-align:left;align-items:center;gap:18px;padding:0 0 16px;margin:0;border:0;border-bottom:1px solid var(--border);border-radius:0;background:transparent; }
html:root #profile-dialog .profile-photo { width:80px;height:80px;font-size:1.8rem;border:3px solid var(--surface);box-shadow:0 0 0 1px var(--border); }
html:root #profile-dialog .profile-identity { min-width:0;flex:1; }
html:root #profile-dialog .profile-hero h3 { font-family:inherit;font-size:1.4rem;font-weight:650;line-height:1.35;overflow-wrap:anywhere;margin:0 0 4px; }
html:root #profile-dialog .profile-hero p { margin:0;overflow-wrap:anywhere;line-height:1.5; }
html:root #profile-dialog #profile-presence { margin-top:5px;font-size:.76rem; }
html:root #profile-dialog .profile-department-line { margin-top:4px;color:var(--text-secondary);font-size:.8rem; }
html:root #profile-dialog .profile-meta { display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;margin-top:10px; }
html:root #profile-dialog .profile-role-badge { display:inline-block;padding:3px 9px;margin:0;border-radius:999px;background:var(--accent-soft);color:var(--accent);font-size:.7rem;line-height:1.5; }
html:root #profile-dialog #profile-active-state { display:inline-flex;align-items:baseline;gap:6px;font-size:.7rem; }
html:root #profile-dialog #profile-active-state::before { content:'';width:6px;height:6px;flex:0 0 6px;border-radius:50%;background:var(--theme-success); }
html:root #profile-dialog #profile-active-state.is-inactive::before { background:var(--text-secondary); }
html:root #profile-dialog :is(#profile-view,#profile-form,#profile-status) { min-width:0;width:100%; }
html:root #profile-dialog .profile-information { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px; }
html:root #profile-dialog .profile-info-card { min-width:0;padding:16px;border:1px solid var(--border);border-radius:var(--radius-lg);background:var(--surface); }
html:root #profile-dialog .profile-info-card h3 { margin:0 0 12px;font-size:.9rem;font-weight:650; }
html:root #profile-dialog .profile-details { display:flex;flex-direction:column;margin:0; }
html:root #profile-dialog .profile-field { display:grid;grid-template-columns:105px minmax(0,1fr);align-items:baseline;gap:8px;padding:9px 0;border-bottom:1px solid var(--border); }
html:root #profile-dialog .profile-field:last-child { border-bottom:0;padding-bottom:0; }
html:root #profile-dialog .profile-field:first-child { padding-top:0; }
html:root #profile-dialog .profile-details dt { padding:0;border:0;color:var(--text-secondary);font-size:.76rem;line-height:1.5;overflow-wrap:anywhere; }
html:root #profile-dialog .profile-details dd { min-width:0;margin:0;padding:0;border:0;color:var(--text-primary);font-size:.85rem;font-weight:500;line-height:1.5;white-space:pre-wrap;overflow-wrap:anywhere; }
html:root #profile-dialog .profile-details dd.is-empty { color:var(--text-secondary);font-weight:400; }
html:root #profile-dialog .profile-details a { color:var(--accent);text-decoration:none; text-underline-offset:3px; }
html:root #profile-dialog .profile-details a:hover { text-decoration:underline; }
html:root #profile-dialog .profile-contacts-card .profile-field { grid-template-columns:105px minmax(0,1fr);align-items:center;gap:10px;min-height:44px; }
html:root #profile-dialog .profile-contacts-card dt { display:grid;grid-template-columns:30px minmax(0,1fr);align-items:center;gap:10px; }
html:root #profile-dialog .profile-contact-icon { display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--accent-soft);color:var(--accent); }
html:root #profile-dialog .profile-contact-icon svg { width:18px;height:18px; }
html:root #profile-dialog .profile-contact-icon img { display:block;width:30px;height:30px; }
html:root #profile-dialog .profile-contacts-card a { display:flex;align-items:center;min-height:32px; }
html:root #profile-dialog .profile-personal-card .profile-field { grid-template-columns:1fr;gap:6px; }
html:root #profile-dialog .profile-about-card p { margin:0;white-space:pre-wrap;overflow-wrap:anywhere;font-size:.85rem;line-height:1.65;color:var(--text-secondary); }
html:root #profile-dialog .profile-view-actions { position:sticky;bottom:-20px;display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin:16px -20px -20px;padding:12px 20px;background:var(--surface);border-top:1px solid var(--border);z-index:1; }
html:root #profile-dialog .profile-workspace-actions { flex:1;min-width:0;margin:0;gap:8px; }
html:root #profile-dialog #profile-edit { position:static;margin:0 0 0 auto;min-height:44px;box-shadow:none; }
html:root #profile-dialog #profile-form { padding:0;border:0;background:transparent; }
html:root #profile-dialog .profile-form-section { min-width:0;margin:0 0 16px;padding:16px;border:1px solid var(--border);border-radius:var(--radius-lg);background:var(--surface); }
html:root #profile-dialog .profile-form-section > h3 { margin:0 0 16px;font-size:.9rem;font-weight:650;line-height:1.4;color:var(--text-primary); }
html:root #profile-dialog .profile-social-label { display:flex;align-items:center;gap:8px; }
html:root #profile-dialog .profile-social-label img { width:20px;height:20px; }
html:root #profile-dialog .profile-form-actions { position:sticky;bottom:-20px;display:flex;gap:8px;margin:16px -20px -20px;padding:12px 20px;background:var(--surface);border-top:1px solid var(--border);z-index:1; }
@media(max-width:640px) {
  html:root #profile-dialog .profile-dialog-body { padding:16px;gap:14px; }
  html:root #profile-dialog .profile-hero { align-items:flex-start;gap:12px;padding-bottom:14px; }
  html:root #profile-dialog .profile-photo { width:60px;height:60px;font-size:1.3rem; }
  html:root #profile-dialog .profile-hero h3 { font-size:1.15rem; }
  html:root #profile-dialog .profile-information { grid-template-columns:1fr; }
  html:root #profile-dialog .profile-field { grid-template-columns:95px minmax(0,1fr); }
  html:root #profile-dialog .profile-info-card { padding:14px; }
  html:root #profile-dialog .profile-view-actions,html:root #profile-dialog .profile-form-actions { bottom:-16px;margin-inline:-16px;margin-bottom:-16px;padding:12px 16px; }
  html:root #profile-dialog .profile-workspace-actions { flex-basis:100%; }
  html:root #profile-dialog .profile-workspace-actions button { flex:1 1 120px;min-width:0;min-height:44px;padding-inline:8px; }
  html:root #profile-dialog .profile-contacts-card a { min-height:44px; }
  html:root #profile-dialog #profile-edit { width:100%;margin:0; }
}
@media (max-width: 800px) {
  #calendar-event-dialog { inset: 8px; transform: none; width: calc(100vw - 16px); height: calc(100dvh - 16px); max-height: none; }
  #calendar-event-dialog .calendar-form-grid { grid-template-columns: 1fr; }
  #calendar-event-dialog :is(.calendar-form-main, .calendar-form-side) { padding: 18px; }
  #calendar-event-dialog .calendar-form-side { border-left: 0; border-top: 1px solid var(--orero-line); }
  .calendar-planner { margin: 0 12px 16px; padding: 12px; }
  .planner-heading { flex-direction: column; gap: 12px; }
  .planner-board { grid-template-columns: 145px max-content; }
  .planner-person-name { gap: 5px; padding: 6px; font-size: .72rem; }
  .planner-person-name .person-avatar { width: 24px; height: 24px; }
  .planner-legend { margin-left: 0; }
  .planner-zoom { margin-left: 0; }
  .planner-toolbar :is(button, input, select) { min-height: max(42px, var(--control-height)); }
}
@media (max-width: 700px) {
  #profile-dialog { inset: 8px; width: calc(100vw - 16px); height: calc(100dvh - 16px); max-height: none; transform: none; border-radius: 12px; }
}
@media (max-width: 480px) {
  #calendar-event-dialog .calendar-time-fields { grid-template-columns: 1fr; }
  .calendar-time-separator { display:none; }
  .planner-zoom { flex-basis: 100%; }
  #profile-form { padding: 16px; }
}

/* Projects share the task workspace and its theme tokens. */
.tasks-tabs { display: flex; gap: 10px; margin: 0 0 18px; }
.tasks-tabs button[aria-pressed="true"], .task-project-strip button[aria-pressed="true"] { background: var(--orero-olive); color: var(--theme-on-accent); border-color: var(--orero-olive); }
.task-project-strip { display: flex; flex-wrap: wrap; gap: 9px; margin: 16px 0 22px; }
.task-project-strip .project-filter { display: inline-flex; align-items: center; gap: 8px; font-size: .82rem; min-height: 42px; max-width: 100%; overflow-wrap: anywhere; text-align: left; }
.project-avatar { display: grid; place-items: center; width: 56px; height: 56px; flex: 0 0 auto; overflow: hidden; border: 1px solid var(--orero-line); border-radius: 14px; background: var(--theme-soft); color: var(--theme-accent); font-size: 1.1rem; font-weight: 600; }
.project-avatar img { width: 100%; height: 100%; object-fit: cover; }
.task-project-strip .project-avatar { width: 26px; height: 26px; border-radius: 7px; font-size: .65rem; }
.task-project-label { display: block; font-size: .76rem; color: var(--theme-accent); margin-top: 8px; overflow-wrap: anywhere; }
.project-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 350px), 1fr)); gap: 20px; }
.project-card { display: flex; flex-direction: column; gap: 18px; min-width: 0; padding: 24px; border: 1px solid var(--orero-line); border-radius: 16px; background: var(--orero-paper); box-shadow: 0 8px 28px #00000006; }
.project-card-heading { display: flex; align-items: center; gap: 14px; }
.project-card h3 { margin: 0; font-size: 1.2rem; font-weight: 600; overflow-wrap: anywhere; }
.project-description, .project-goal p { margin: 0; white-space: pre-wrap; overflow-wrap: anywhere; font-size: .9rem; line-height: 1.65; }
.project-description { color: var(--orero-muted); }
.project-goal { padding: 16px; border-radius: 10px; background: var(--theme-soft); }
.project-goal > span { display: block; margin-bottom: 8px; font-size: .67rem; letter-spacing: .13em; color: var(--theme-accent); }
.project-card-members summary { cursor: pointer; min-height: 40px; padding-top: 8px; font-size: .85rem; }
.project-member-links { display: grid; gap: 10px; padding: 12px 0; }
.project-card-actions { margin-top: auto; display: flex; flex-wrap: wrap; gap: 8px; padding-top: 16px; border-top: 1px solid var(--orero-line); }
.project-card-actions button { font-size: .8rem; min-height: 42px; }
.project-card-actions .project-delete { color: var(--theme-danger, #99462f); }
#project-dialog { width: min(1280px, calc(100vw - 40px)); max-height: calc(100dvh - 40px); padding: 0; }
#project-dialog > .employee-dialog-head { padding: 22px 28px; margin: 0; border-bottom: 1px solid var(--orero-line); flex-shrink: 0; }
#project-form { overflow: auto; min-height: 0; scroll-padding-bottom: 90px; }
.project-form-layout { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(300px, 1fr); }
.project-form-main, .project-form-side { padding: 26px 28px; min-width: 0; }
.project-form-side { background: var(--theme-soft); border-left: 1px solid var(--orero-line); }
.project-form-side h3 { margin-top: 0; }
#project-form label { font-size: .86rem; }
.project-form-main > label { display: grid; gap: 8px; margin-bottom: 20px; }
#project-form input:not([type="checkbox"]), #project-form textarea { width: 100%; min-width: 0; }
#project-form textarea { resize: vertical; padding: 12px; border: 1px solid var(--orero-line); border-radius: 8px; font: inherit; background: var(--orero-paper); color: var(--orero-ink); }
.project-photo-editor { display: flex; gap: 18px; align-items: start; }
.project-photo-editor > div:last-child { min-width: 0; }
.project-photo-editor .project-avatar { width: 80px; height: 80px; }
.project-form-actions { position: sticky; bottom: 0; padding: 18px 28px; display: flex; align-items: center; flex-wrap: wrap; gap: 12px; border-top: 1px solid var(--orero-line); background: var(--orero-paper); z-index: 2; }
@media(max-width: 760px) {
  #project-dialog { inset: 8px; width: calc(100vw - 16px); height: calc(100dvh - 16px); max-height: none; transform: none; }
  .project-form-layout { grid-template-columns: 1fr; }
  .project-form-main, .project-form-side { padding: 18px; }
  .project-form-side { border-left: 0; border-top: 1px solid var(--orero-line); }
  #project-dialog > .employee-dialog-head, .project-form-actions { padding: 18px; }
  .project-card { padding: 18px; }
  .project-photo-editor { flex-wrap: wrap; }
}