/* Operational component owner. Studio previews are deliberately not the app.
   Brand, department identity and semantic status colours are independent roles. */
.app-shell {
  --ui-gap: var(--wp-layout-gap, 18px);
  --ui-radius: var(--wp-radius, 15px);
  --ui-card: var(--wp-card-background, var(--surface));
  --ui-shadow: var(--wp-shadow, 0 4px 14px #0000000b);
  --ui-row: var(--wp-row-pad, 13px);
}
.app-shell > .app-main > .content {
  width: 100%; max-width: none; margin: 0;
  padding: clamp(20px, 2.5vw, 38px) clamp(20px, 2.5vw, 48px) 36px;
}
.app-shell > .app-main > .content--reading { max-width: 1700px; margin-inline: auto; }
.app-shell > .sidebar .nav-link { min-height: 42px; gap: 10px; font-weight: 500; font-size: calc(13px * var(--wp-text-scale, 1)); }
.app-shell > .sidebar .nav-icon { width: 24px; height: 24px; flex-basis: 24px; }
.app-shell > .sidebar .nav-icon svg { width: 19px; height: 19px; }
html[data-wp-icons=fine] .sidebar .nav-icon svg { stroke-width: 1.5; }
html[data-wp-icons=minimal] .sidebar .nav-icon svg { stroke-width: 1.9; }
.app-shell > .sidebar .nav-link.active { background: var(--sidebar-selected); color: var(--sidebar-selected-ink, var(--sidebar-text)); border-color: transparent; box-shadow: none; }
.app-shell > .sidebar .nav-link:hover { background: var(--sidebar-hover); color: var(--sidebar-selected-ink, var(--sidebar-text)); }
.app-shell > .sidebar .nav-link:is(.active, [aria-current="page"], :hover) .nav-icon { color: inherit; }
.app-shell > .sidebar .navigation-group-label { margin: 0 10px 6px; font-size: calc(10px * var(--wp-text-scale,1)); letter-spacing: .1em; font-weight: 600; }
.app-shell > .sidebar .sidebar-footer { gap: 11px; align-items: center; }
.sidebar-identity-avatar { display: grid; place-items: center; flex: 0 0 34px; width: 34px; height: 34px; border-radius: 50%; background: var(--sidebar-raised,var(--sidebar-hover)); color: var(--sidebar-text); font-size: 12px; font-weight: 600; }
.sidebar-identity-copy { display: grid; gap: 3px; min-width: 0; }
.sidebar-identity-copy strong { font-size: calc(12px * var(--wp-text-scale,1)); font-weight: 600; overflow-wrap: anywhere; }
.sidebar-identity-copy small { font-size: calc(11px * var(--wp-text-scale,1)); }
@media(min-width:821px) {
  .app-shell > .sidebar { display: flex; flex-direction: column; overflow: hidden; }
  .app-shell > .sidebar > .sidebar-brand, .app-shell > .sidebar > .sidebar-footer { flex-shrink: 0; }
  .app-shell > .sidebar > nav { flex: 1; min-height: 0; align-content: start; overflow-y: auto; overscroll-behavior: contain; padding-block: 2px 14px; scrollbar-width: thin; scrollbar-color: var(--sidebar-muted) transparent; }
  .app-shell > .sidebar :is(.navigation-group,.navigation-group-links) { align-content: start; }
  .app-shell > .sidebar .nav-link { flex-shrink: 0; }
  .app-shell > .sidebar .navigation-group + .navigation-group { margin-top: 16px; padding-top: 0; border-top: 0; }
}
.app-shell > .app-main > .topbar { min-height: 64px; padding-inline: clamp(20px, 2.5vw, 48px); background: var(--surface); }
.content .page-stack { gap: var(--ui-gap); min-width: 0; }
.content .page-header { align-items: center; gap: 18px; padding-block: 4px; }
.content .page-header h1 { font-size: calc(clamp(26px, 2.1vw, 34px) * var(--wp-text-scale,1)); font-weight: 600; line-height: 1.2; letter-spacing: -.035em; color: inherit; overflow-wrap: anywhere; }
.content .page-header .page-description { max-width: 72ch; font-size: calc(13px * var(--wp-text-scale, 1)); line-height: 1.55; }
html[data-wp-coverage=immersive] .content .page-header :is(.eyebrow, .page-description) { color: var(--wp-heading-muted); }
.content .page-header .page-actions { max-width: 60%; gap: 8px; }
.content .page-actions .button { min-height: 38px; }
.content :is(.card, .panel, .people-card, .people-person-summary, .people-schedule, .runway-day, .dashboard-collaboration-summary) { background: var(--ui-card); border-color: var(--line); border-radius: var(--ui-radius); box-shadow: var(--ui-shadow); color: var(--ink); }
.content :is(.card-header, .calendar-toolbar, .people-schedule-toolbar) { background: var(--surface); color: var(--ink); border-color: var(--line); padding: 16px 20px; }
.content .card-header { min-height: 58px; align-items: center; border-radius: var(--ui-radius) var(--ui-radius) 0 0; }
.content .card-header :is(h2,h3) { color: inherit; font-weight: 600; font-size: calc(16px * var(--wp-text-scale, 1)); }
.content :is(.card-body, .panel-body) { padding: 18px 20px; }
.content :is(.button, .input, .select, .textarea) { font-family: inherit; }
.content .button { font-weight: 600; line-height: 1.25; min-height: 36px; }
.content :is(.button.secondary, .button.quiet) { background: var(--surface); color: var(--ink); border-color: var(--wp-control-line, var(--line-strong)); }
.content .button.quiet { background: transparent; border-color: transparent; }
.content :is(.button.secondary, .button.quiet):hover:not(:disabled) { background: var(--surface-hover); }
.content .button-sm { min-height: 32px; }
.content :is(.input, .select, .textarea) { background: var(--surface); color: var(--ink); border-color: var(--wp-control-line, var(--line-strong)); border-radius: 9px; }
.content :is(input,textarea)::placeholder { color: var(--ink-faint); opacity: 1; }
.content :is(.filter-bar, .people-filter-form, .runway-filter-bar, .runway-date-toolbar) { padding: 14px 18px; gap: 12px; border: 1px solid var(--line); border-radius: var(--ui-radius); background: var(--surface); color: var(--ink); }
.content :is(.field label, .field-help, .form-help) { line-height: 1.5; }
.content .table th, .content .leave-table th { color: var(--ink-soft); background: var(--surface-raised); font-weight: 600; }
.content .table tbody tr:hover { background: var(--surface-hover); }
.content :is(.table, .leave-table) :is(th,td) { border-color: var(--line); padding-block: var(--ui-row); }
.content .empty-state { background: var(--surface); border-color: var(--line); color: var(--ink-soft); padding: 24px; border-radius: var(--ui-radius); }
.content .empty-state p { max-width: 70ch; margin-inline: auto; line-height: 1.6; }
.modal-dialog, .meeting-request-overlay { background: var(--surface); color: var(--ink); border-color: var(--line); }
.modal-header, .modal-footer { background: var(--surface); border-color: var(--line); }
.modal-body :is(.input,.select,.textarea) { background: var(--surface-raised); color: var(--ink); border-color: var(--wp-control-line,var(--line-strong)); }

/* Composed Dashboard: actual task counts, existing actions and bounded reads. */
.content .dashboard-page { max-width: 1900px; width: 100%; margin-inline: auto; }
.content .workspace-hero { position: relative; overflow: hidden; padding: clamp(22px, 2vw, 28px); border-radius: calc(var(--ui-radius) + 2px); border: 1px solid var(--line); background: var(--wp-hero-background, linear-gradient(120deg,#651126,#982039)); color: var(--wp-hero-ink,#ffffff); }
.content .workspace-hero::after { content: ''; position: absolute; width: 360px; height: 360px; right: -30px; top: -170px; border: 1px solid currentColor; border-radius: 50%; opacity: .06; box-shadow: 0 0 0 32px currentColor, 0 0 0 76px currentColor; pointer-events: none; }
.content .workspace-hero > * { position: relative; z-index: 1; }
.content .workspace-hero .page-header { padding: 0; border: 0; background: none; color: inherit; }
.content .workspace-hero .page-header h1 { font-size: calc(clamp(26px, 2.2vw, 32px) * var(--wp-text-scale,1)); max-width: 30ch; }
.content .workspace-hero :is(.eyebrow,.page-description) { color: var(--wp-hero-muted,#f3e8eb); }
.content .workspace-hero .page-actions .appearance-entry { width: 44px; height: 44px; min-width: 44px; border-radius: 50%; background: transparent; color: inherit; border-color: currentColor; padding: 10px; }
.content .workspace-hero-footer { display: flex; gap: 16px; align-items: center; justify-content: space-between; flex-wrap: wrap; margin-top: 22px; font-size: calc(12px * var(--wp-text-scale,1)); }
.content .workspace-hero-footer .button { background: transparent; color: inherit; border-color: currentColor; }
.content .dashboard-summary--cards { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: var(--ui-gap); }
.content .dashboard-summary--cards .dashboard-summary-button { display: grid; align-content: start; justify-content: stretch; text-align: left; gap: 5px; min-height: 124px; padding: 20px; border: 1px solid var(--line); border-top: 2px solid var(--brand); border-radius: var(--ui-radius); background: var(--wp-summary-background,var(--surface)); color: var(--wp-summary-ink,var(--ink)); box-shadow: var(--ui-shadow); }
.content .dashboard-summary--cards .dashboard-summary-button :is(span,strong) { color: inherit; }
.content .dashboard-summary--cards .dashboard-summary-label { font-size: calc(13px * var(--wp-text-scale,1)); font-weight: 500; }
.content .dashboard-summary--cards .dashboard-summary-count { font-size: calc(32px * var(--wp-text-scale,1)); line-height: 1.1; font-weight: 600; letter-spacing: -.04em; }
.content .dashboard-summary--cards .dashboard-summary-detail { display: block; font-size: calc(12px * var(--wp-text-scale,1)); font-weight: 400; }
.content .dashboard-layout { display: grid; grid-template-columns: minmax(0,1.35fr) minmax(0,1fr); gap: var(--ui-gap); align-items: start; }
.content .workspace-hero-date { margin: 0 0 12px; font-size: calc(11px * var(--wp-text-scale,1)); font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--wp-hero-muted,#f3e8eb); }
.content .dashboard-overview .workspace-hero-footer { margin-top: 18px; }
.content .dashboard-attention-signals { display: flex; flex-wrap: wrap; gap: 8px; }
.content .dashboard-capture { margin: 0; padding: 12px 20px; border: 0; border-top: 1px solid var(--line); border-radius: 0; background: var(--surface); gap: 10px; }
.content .dashboard-capture .daily-new-input { min-height: 38px; font-size: calc(13px * var(--wp-text-scale,1)); }
.content .dashboard-today-content { overflow: hidden; border-radius: 0 0 var(--ui-radius) var(--ui-radius); }
.content .dashboard-today-more { margin: 0 20px 12px; }
.content .dashboard-today-content > .empty-state { margin: 16px 20px; }
.content .dashboard-calendar-day { padding: 0 20px; }
.content .dashboard-calendar-day h3 { margin: 0; padding-top: 16px; font-size: calc(11px * var(--wp-text-scale,1)); text-transform: uppercase; letter-spacing: .06em; color: var(--ink-soft); }
.content .dashboard-calendar-day .dashboard-calendar-item { grid-template-columns: 92px minmax(0,1fr) auto; padding: 12px 10px; border-color: var(--line); background: var(--surface); }
.content .dashboard-calendar-day:last-child .dashboard-calendar-item:last-child { border-bottom: 0; }
.content .dashboard-calendar-item-main { min-width: 0; }
.content .dashboard-calendar-item-main strong { overflow-wrap: anywhere; white-space: normal; overflow: visible; text-overflow: clip; }
.content :is(.dashboard-calendar-item-time,.dashboard-calendar-item-kind) { color: var(--ink-soft); font-size: calc(11px * var(--wp-text-scale,1)); }
.content .dashboard-next-tasks, .content .dashboard-outlook-rows { padding-inline: 20px; }
.content .dashboard-next-task { display: grid; grid-template-columns: 28px minmax(0,1fr) auto; align-items: center; gap: 9px; padding-block: 18px; border-bottom: 1px solid var(--line); min-height: 76px; }
.content .dashboard-next-task:last-child, .content .dashboard-outlook-row:last-child { border-bottom: 0; }
.content .dashboard-next-task-completion { width: 28px; height: 28px; display: grid; place-items: center; cursor: pointer; }
.content .dashboard-next-task-check { appearance: none; display: grid; place-content: center; margin: 0; width: 18px; height: 18px; border: 1.5px solid var(--wp-control-line,var(--line-strong)); border-radius: 50%; background: var(--surface); color: var(--ink); cursor: pointer; }
.content .dashboard-next-task-check::after { content: ''; width: 9px; height: 5px; border-left: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: translateY(-1px) rotate(-45deg); opacity: 0; }
.content .dashboard-next-task-check:checked { background: var(--ink); color: var(--surface); border-color: var(--ink); }
.content .dashboard-next-task-check:checked::after { opacity: 1; }
.content .dashboard-next-task-check:focus-visible { outline: 2px solid var(--ink); outline-offset: 3px; }
.content .dashboard-next-task-check:disabled { cursor: default; opacity: .55; }
.content .dashboard-next-task-feedback { grid-column: 2 / -1; font-size: calc(11px * var(--wp-text-scale,1)); color: var(--ink-soft); }
.content .dashboard-next-task > .daily-edit-conflict { grid-column: 1 / -1; }
.content .dashboard-next-task-copy { display: grid; min-width: 0; gap: 5px; }
.content .dashboard-next-task-copy .task-title-button { text-align: left; font-size: calc(14px * var(--wp-text-scale,1)); font-weight: 600; line-height: 1.45; overflow-wrap: anywhere; }
.content .dashboard-next-task-copy > span, .content .dashboard-next-task-due { font-size: calc(12px * var(--wp-text-scale,1)); line-height: 1.5; color: var(--ink-soft); }
.content .dashboard-next-task-due { text-align: right; max-width: 19ch; }
.content .dashboard-outlook-row { display: flex; align-items: center; justify-content: space-between; gap: 14px; min-height: 76px; padding-block: 18px; border-bottom: 1px solid var(--line); }
.content .dashboard-outlook-row > div { display: grid; gap: 5px; min-width: 0; }
.content .dashboard-outlook-row strong { font-size: calc(14px * var(--wp-text-scale,1)); font-weight: 600; line-height: 1.45; overflow-wrap: anywhere; }
.content .dashboard-outlook-row div > span { font-size: calc(12px * var(--wp-text-scale,1)); line-height: 1.5; color: var(--ink-soft); }
.content .dashboard-outlook-status { padding: 5px 8px; border-radius: 6px; font-size: calc(11px * var(--wp-text-scale,1)); font-weight: 600; background: var(--surface-raised); color: var(--ink-soft); text-align: center; }
.content .dashboard-outlook-status.is-covered { background: var(--wp-success-soft); color: var(--wp-success-ink); }
.content .dashboard-outlook-status:is(.is-at_risk,.is-warning) { background: var(--wp-warning-soft); color: var(--wp-warning-ink); }
.content .dashboard-outlook-status.is-critical { background: var(--wp-danger-soft); color: var(--wp-danger-ink); }
.content .dashboard-planning-alternative, .content .dashboard-outlook-loading { padding: 22px 20px; margin: 0; font-size: calc(13px * var(--wp-text-scale,1)); line-height: 1.6; }
.content .dashboard-planning-alternative p { color: var(--ink-soft); }
.content .dashboard-support-grid { display: grid; grid-template-columns: minmax(0,1.35fr) minmax(0,1fr); gap: var(--ui-gap); align-items: start; }
.content .dashboard-support-grid .dashboard-upcoming-list { padding: 12px 20px; }
.content .dashboard-support-grid .dashboard-collaboration-summary { border: 0; border-radius: 0 0 var(--ui-radius) var(--ui-radius); box-shadow: none; }
.content .dashboard-collaboration-summary-copy { gap: 10px; line-height: 1.6; }
.content :is(.dashboard-task-group-header,.dashboard-group-heading,.daily-section-heading), .content .dashboard-task-group > header { background: var(--surface-raised); color: var(--ink); border-color: var(--line); padding: 12px 20px; }
.content :is(.dashboard-task-group-header,.dashboard-group-heading,.daily-section-heading) :is(h2,h3,span,strong) { color: inherit; }
.content .dashboard-task-group h3 { color: var(--ink); }
.content :is(.daily-task-row,.task-row,.series-summary,.dashboard-series-row) { background: var(--surface); border-color: var(--line); padding-block: var(--ui-row); }
.content :is(.daily-task-row,.task-row,.series-summary,.dashboard-series-row):hover { background: var(--surface-hover); }
.content .dashboard-collaboration-summary { padding: 18px 20px; }

/* Calendar retains its specialised geometry and department identity colours. */
.content :is(.calendar,.agenda,.calendar-feed) { border-color: var(--line); border-radius: var(--ui-radius); background: var(--surface); color: var(--ink); }
.content .calendar-toolbar { gap: 12px; flex-wrap: wrap; }
.content .calendar-toolbar-actions { gap: 6px; flex-wrap: wrap; }
.content .team-calendar-staff-layer-toggle { min-inline-size: 174px; }
.content :is(.weekday-header,.week-day-header,.feed-agenda-heading) { background: var(--surface-raised); color: var(--ink-soft); border-color: var(--line); }
.content :is(.day-cell,.feed-week-day,.feed-day,.agenda-group) { border-color: var(--line); }
.content .team-calendar-staff-preview-heading { font-weight: 500; border-radius: 6px; line-height: 1.4; }
.content .calendar-legend { background: var(--surface); color: var(--ink-soft); border-color: var(--line); }
/* Never set --team-calendar-department-colour here: it belongs to the server
   department record, across all modes, filters and staff layer states. */
.content .team-calendar-department-swatch { background: var(--team-calendar-department-colour,#707780); outline: 1px solid var(--line); outline-offset: 1px; }
.content .team-calendar-staff-avatar { outline: 1px solid var(--line-strong); outline-offset: 0; }

/* Runway remains an absence board reached from Team Calendar, not a nav item. */
.content .runway-page { width: 100%; max-width: 1900px; margin-inline: auto; }
.content .runway-board { display: grid; gap: var(--ui-gap); }
.content .runway-day-heading { padding: 16px 20px; background: var(--surface-raised); color: var(--ink); border-color: var(--line); border-radius: var(--ui-radius) var(--ui-radius) 0 0; }
.content .runway-day-heading h2 { font-size: calc(18px * var(--wp-text-scale,1)); font-weight: 600; }
.content .runway-day-count { color: var(--ink-soft); font-weight: 500; }
.content .runway-departments { padding: 18px 20px; gap: 16px; }
.content .runway-department { background: var(--surface); border-color: var(--line); }
.content :is(.runway-employee,.runway-person) { padding-block: 8px; line-height: 1.5; }
.content .runway-clear { padding-inline: 20px; color: var(--ink-soft); }

/* Identity cards: predictable proportions and readable status/action footer. */
.content .people-page { width: 100%; max-width: 1900px; }
.content .people-list { grid-template-columns: repeat(auto-fit,minmax(min(100%,310px),1fr)); gap: var(--ui-gap); align-items: stretch; }
.content .people-card { display: flex; flex-direction: column; gap: 16px; padding: 22px; }
.content .people-card-heading { flex-direction: column; gap: 14px; }
.content .people-card-identity { align-items: flex-start; width: 100%; gap: 14px; }
.content .people-avatar { width: 50px; height: 50px; background: var(--surface-raised); color: var(--ink); font-size: calc(15px * var(--wp-text-scale,1)); }
.content .people-card-name h2 { font-weight: 600; font-size: calc(18px * var(--wp-text-scale,1)); line-height: 1.3; }
.content .people-card-name p { font-size: calc(13px * var(--wp-text-scale,1)); }
.content .people-status { max-width: 100%; white-space: normal; text-align: left; font-weight: 500; }
.content .workforce-department-label > span { overflow: visible; text-overflow: clip; white-space: normal; }
.content .people-card-actions { margin-top: auto; border-top: 1px solid var(--line); padding-top: 16px; gap: 8px; }
.content .people-card-next { min-height: 0; }
.content .people-health-summary { background: var(--amber-soft); color: var(--wp-warning-ink); }

/* Real functional subgroup cards; unknown evidence never becomes green. */
.content .staffing-coverage-group-rows { display: grid; grid-template-columns: repeat(auto-fit,minmax(min(100%,340px),1fr)); gap: var(--ui-gap); }
.content .staffing-coverage-group-row { display: flex; flex-direction: column; min-width: 0; padding: 22px; gap: 18px; background: var(--ui-card); box-shadow: var(--ui-shadow); border-radius: var(--ui-radius); }
.content .staffing-coverage-group-main { width: 100%; gap: 9px; }
.content .staffing-coverage-group-heading { justify-content: space-between; align-items: flex-start; }
.content .staffing-coverage-group-heading strong { font-weight: 600; font-size: calc(17px * var(--wp-text-scale,1)); }
.content .staffing-coverage-group-count { font-size: calc(15px * var(--wp-text-scale,1)); }
.content .staffing-coverage-group-actions { margin-top: auto; width: 100%; border-top: 1px solid var(--line); padding-top: 14px; justify-content: flex-start; }
.content .staffing-coverage-group-trend { display: grid; grid-template-columns: repeat(7,minmax(0,1fr)); gap: 5px; }
.content .staffing-coverage-group-trend:empty { display: none; }
.content .staffing-coverage-trend-day { display: grid; place-items: center; min-height: 26px; border: 1px solid var(--line); border-bottom: 3px solid var(--line-strong); border-radius: 4px; background: var(--surface); color: var(--ink-soft); font: inherit; font-size: calc(11px * var(--wp-text-scale,1)); }
.content .staffing-coverage-trend-day.is-covered { border-bottom-color: var(--wp-success); }
.content .staffing-coverage-trend-day:is(.is-at_risk,.is-warning) { border-bottom-color: var(--wp-warning); }
.content .staffing-coverage-trend-day.is-critical { border-bottom-color: var(--wp-danger); }
.content .staffing-planning-group { padding: 18px; border: 1px solid var(--line); border-radius: var(--ui-radius); background: var(--surface); }
.content .staffing-planning-group h3 { margin-top: 0; font-size: calc(16px * var(--wp-text-scale,1)); }
.content .staffing-planning-days { gap: 8px; }

/* Chat uses the remaining workspace; bubbles keep their readable measure. */
.app-shell > .app-main > .content--chat-workspace { overflow: hidden; padding-block: 18px; }
.content .chat-page { max-width: none; height: 100%; min-height: 0; gap: 12px; }
.content .chat-layout { grid-template-columns: clamp(260px,22vw,340px) minmax(0,1fr); border: 1px solid var(--line); border-radius: var(--ui-radius); background: var(--surface); box-shadow: var(--ui-shadow); min-height: 0; }
.content .chat-list-pane { background: var(--surface-raised); border-color: var(--line); }
.content :is(.chat-list-header,.chat-detail-header) { background: var(--surface); border-color: var(--line); padding: 16px 20px; }
.content .chat-conversation-row { min-height: 74px; padding: 12px; gap: 12px; font-weight: 400; }
.content .chat-conversation-row.is-selected { background: var(--brand-soft); color: var(--ink); border-color: var(--line); }
.content .chat-message-list { background: var(--wp-chat-background,var(--surface)); padding: 22px clamp(16px,2vw,32px); gap: 14px; }
.content .chat-thread { width: 100%; min-width: 0; gap: 10px; }
.content .chat-message { margin: 0; max-width: min(680px,86%); padding: 13px 16px; background: var(--surface); color: var(--ink); border: 1px solid var(--line); border-radius: 14px; box-shadow: none; }
.content .chat-message.is-own { background: var(--wp-chat-own,var(--brand-soft)); justify-self: end; }
.content .chat-message-header { color: var(--ink-soft); gap: 8px; }
.content .chat-message-body { font-size: calc(14px * var(--wp-text-scale,1)); line-height: 1.55; }
.content .chat-composer { padding: 14px 20px; background: var(--surface); border-color: var(--line); }
.content .chat-composer-media-panel { background: var(--surface); color: var(--ink); border-color: var(--line); border-radius: 12px; }
.content :is(.chat-gif-result,.chat-sticker-result) { background: var(--surface-raised); border-color: var(--line); }

/* Consistent HR, leave, notes, document and finance surfaces without reflowing
   the reporting chart's measured cards or connector canvas. */
.content :is(.hr-workspace,.hr-insights) { max-width: 1700px; width: 100%; }
.content :is(.hr-action-row,.note-card,.document-card,.invoice-intelligence-card,.leave-policy-version,.leave-segment) { background: var(--surface); color: var(--ink); border-color: var(--line); border-radius: var(--ui-radius); }
.content :is(.hr-workspace-tabs,.hr-insight-context) { background: var(--surface-raised); color: var(--ink-soft); border-color: var(--line); }
.content .hr-workspace-disclosure { background: var(--surface); border-color: var(--line); }
.content .hr-insights .card > .hr-action-list { padding: 18px 20px; }
.content .leave-summary { background: var(--ui-card); color: var(--ink); border-color: var(--line); border-radius: var(--ui-radius); }
.content :is(.leave-heading p,.leave-footnote,.leave-employee p,.leave-metric span) { color: var(--ink-soft); }
.content :is(.leave-footnote,.leave-metric) { border-color: var(--line); }
.content .leave-metric:first-child { border-color: var(--brand); }
.content .leave-warning { background: var(--amber-soft); color: var(--wp-warning-ink,var(--amber)); }
.content .company-structure-card { background: var(--surface); color: var(--ink); border-color: var(--line); }
.content .company-structure-card :is(strong,span,p) { color: inherit; }
.content .company-structure-card--vacancy { background: var(--wp-warning-soft,var(--amber-soft)); }

@media(min-width:2100px) { .content .people-list { grid-template-columns: repeat(4,minmax(0,1fr)); } }
@media(max-width:1100px) { .content .dashboard-layout, .content .dashboard-support-grid { grid-template-columns: minmax(0,1fr); } .content .page-header .page-actions { max-width: 100%; } }
@media(max-width:820px) {
  .content .chat-layout { grid-template-columns: minmax(0,1fr); }
  .content .chat-layout.has-active-conversation .chat-list-pane { display: none; }
  .app-shell > .app-main > .content { padding: 18px 16px 28px; }
  .app-shell > .app-main > .content--chat-workspace { padding-bottom: 16px; }
}
@media(max-width:640px) {
  .content .page-header { align-items: flex-start; flex-direction: column; }
  .content .page-header .page-actions { justify-content: flex-start; }
  .content .workspace-hero .page-header { flex-direction: row; }
  .content .workspace-hero .page-header h1 { font-size: calc(26px * var(--wp-text-scale,1)); }
  .content .dashboard-summary--cards { grid-template-columns: minmax(0,1fr); }
  .content .dashboard-summary--cards .dashboard-summary-button { padding: 15px; min-height: 118px; }
  .content .people-list,.content .staffing-coverage-group-rows { grid-template-columns: minmax(0,1fr); }
  .content .chat-message { max-width: 94%; }
  .content :is(.chat-list-header,.chat-detail-header,.chat-composer) { padding-inline: 14px; }
  .content .dashboard-next-task { grid-template-columns: 28px minmax(0,1fr); }
  .content .dashboard-next-task-due { grid-column: 2; text-align: left; max-width: none; }
  .content .dashboard-calendar-day .dashboard-calendar-item { grid-template-columns: 80px minmax(0,1fr); }
  .content .dashboard-calendar-item-kind { grid-column: 2; }
  .content .dashboard-outlook-row { flex-wrap: wrap; }
}
@media(prefers-reduced-motion:reduce) {
  .content * { scroll-behavior: auto; }
  .content .dashboard-summary--cards .dashboard-summary-button { transition: none; }
}
@media(forced-colors:active) { .content .workspace-hero::after { display: none; } .content .workspace-hero { background: Canvas; color: CanvasText; } }
@media print { .app-shell > .app-main > .content { max-width: none; padding: 0; } .content .workspace-hero { background: white; color: black; } }
/* Notification presentation is intentionally independent of theme composition. */
.notification-presentation-form{padding:20px;gap:16px;align-items:start}
.notification-presentation-form p{margin:0;line-height:1.5}
.notification-presentation-form .button-row{display:flex;gap:8px;flex-wrap:wrap}
.staffing-compact-people,.staffing-recipient-options{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:8px;max-height:240px;overflow:auto;padding:4px}
.staffing-compact-people .check-field,.staffing-recipient-choice{padding:10px;border:1px solid var(--line);border-radius:10px;background:var(--surface)}
.staffing-coverage-group-form{display:grid;gap:18px;align-content:start}
.staffing-coverage-group-form [hidden]{display:none!important}
.staffing-coverage-group-form .stack{display:grid;gap:10px;align-content:start}
.staffing-coverage-group-form :is(h3,p){margin:0;line-height:1.5}
.staffing-coverage-group-form .form-grid{gap:12px;align-items:start}
.staffing-coverage-group-form .field-help{color:var(--ink-soft)}
.staffing-recipient-chips{display:flex;gap:6px;flex-wrap:wrap}.staffing-preview-day{display:grid;grid-template-columns:minmax(110px,1fr) 100px 2fr;gap:12px;padding:8px 0;border-bottom:1px solid var(--line)}
body .in-app-notification-tray,body .notification-entry-summary{position:fixed;top:auto;bottom:20px;left:auto;right:20px;width:min(380px,calc(100% - 40px));max-height:calc(100vh - 100px);z-index:1500}
body .staffing-availability-reduction-row{display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:10px;padding:12px;border:1px solid var(--line);border-radius:var(--radius,14px)}
@media(max-width:560px){body .staffing-availability-reduction-row{grid-template-columns:1fr auto}body .staffing-availability-reduction-row>span{grid-column:1/-1}}
body .in-app-notification-tray{display:flex;flex-direction:column;gap:10px;overflow:visible;bottom:var(--notification-stack-offset,20px)}
body[data-notification-position="bottom-left"] .in-app-notification-tray,body[data-notification-position="bottom-left"] .notification-entry-summary{left:20px;right:auto}
body[data-notification-position="top-right"] .in-app-notification-tray,body[data-notification-position="top-right"] .notification-entry-summary{top:82px;bottom:auto}
body[data-notification-position="top-left"] .in-app-notification-tray,body[data-notification-position="top-left"] .notification-entry-summary{top:82px;bottom:auto;left:20px;right:auto}
body[data-notification-position^="top"] .in-app-notification-tray{top:calc(62px + var(--notification-stack-offset,20px))}
body[data-notification-size="comfortable"] .in-app-notification-tray{width:min(440px,calc(100% - 40px))}
body .in-app-notification-overlay,body .notification-entry-summary{border:1px solid var(--line);border-radius:14px;background:var(--surface);color:var(--ink);box-shadow:0 10px 34px #0003;padding:14px;animation:wp-notice-enter .18s ease-out}
body .in-app-notification-overlay-copy p,body .notification-entry-summary p{color:var(--ink);line-height:1.45;margin:5px 0}
body .in-app-notification-overlay-copy small{color:var(--ink-soft);font-size:calc(11px * var(--wp-text-scale,1))}
body .in-app-notification-overlay{font-size:calc(13px * var(--wp-text-scale,1))}
body .notification-entry-summary{overflow:auto;font-size:calc(13px * var(--wp-text-scale,1));grid-template-columns:30px minmax(0,1fr) 24px;gap:8px 10px;padding:12px;max-height:min(340px,calc(100dvh - 100px));width:min(360px,calc(100% - 40px))}
body .notification-entry-summary-mark{width:30px;height:30px;grid-row:1;background:var(--surface-raised);border-color:var(--line)}
body .notification-entry-summary-copy strong{color:var(--ink);font-size:1em;line-height:1.35}
body .notification-entry-summary-copy>p{font-size:.92em;color:var(--ink-soft);margin:3px 0 0}
body .notification-entry-summary-actions{grid-column:2;gap:0}
.notification-entry-previews{display:grid;gap:0;margin-top:8px}
.notification-entry-preview{display:grid;gap:2px;width:100%;text-align:left;padding:7px 0;border:0;border-top:1px solid var(--line);background:transparent;color:var(--ink);font:inherit;cursor:pointer;min-width:0}
.notification-entry-preview :is(strong,span){display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.notification-entry-preview span{font-size:.9em;color:var(--ink-soft)}
.notification-entry-preview:hover{background:var(--surface-hover)}
.notification-entry-preview:focus-visible,.notification-entry-dismiss:focus-visible{outline:2px solid var(--wp-focus,var(--brand));outline-offset:2px}
.notification-entry-dismiss{grid-column:3;grid-row:1;align-self:start;display:grid;place-items:center;width:24px;height:24px;border:0;border-radius:6px;background:transparent;color:var(--ink-soft);font-size:20px;cursor:pointer;padding:0}
.notification-entry-dismiss:hover{background:var(--surface-hover);color:var(--ink)}
@keyframes wp-notice-enter{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){body .in-app-notification-overlay,body .notification-entry-summary{animation:none}}
/* Vertical reflow is independent of horizontal entrance/exit and clocks. */
body .in-app-notification-tray{display:block;height:0;max-height:none}
body .in-app-notification-overlay{position:absolute;right:0;bottom:var(--notification-slot-offset,0px);transition:top 220ms cubic-bezier(.22,.7,.25,1),bottom 220ms cubic-bezier(.22,.7,.25,1);width:100%;grid-template-columns:36px minmax(0,1fr) 24px;gap:10px;padding:14px;border-left-width:1px;border-radius:var(--radius,14px);background:var(--surface);animation:wp-banner-in 200ms cubic-bezier(.22,.7,.25,1) both;--banner-direction:calc(100% + 32px)}
body[data-notification-position$="left"] .in-app-notification-overlay{--banner-direction:calc(-100% - 32px)}
body[data-notification-position^="top"] .in-app-notification-overlay{top:var(--notification-slot-offset,0px);bottom:auto}
body .in-app-notification-tray.is-scroll-stack{height:var(--notification-scroll-height);max-height:var(--notification-scroll-height);display:flex;flex-direction:column-reverse;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;pointer-events:auto}
body .in-app-notification-tray.is-scroll-stack .in-app-notification-overlay{position:relative;top:auto;bottom:auto;flex:0 0 auto;transition:none}
body .in-app-notification-overlay-mark{width:36px;height:36px;grid-row:1;background:var(--surface-raised);border-color:var(--line)}
body .in-app-notification-overlay-copy strong{white-space:normal;overflow-wrap:anywhere;color:var(--ink);font-size:1em;line-height:1.35}
body .in-app-notification-overlay-copy p{font-size:1em;-webkit-line-clamp:3;overflow-wrap:anywhere}
body .in-app-notification-overlay-actions{grid-column:3;grid-row:1;align-self:start}
body .in-app-notification-overlay-actions .button{width:24px;min-height:24px;padding:0;border:0;background:transparent;color:var(--ink-soft);font-size:20px;line-height:1}
body .in-app-notification-overlay.is-exiting{animation:wp-banner-out 180ms ease-in both;pointer-events:none}
body .in-app-notification-overlay.is-pending{transition:none}
@keyframes wp-banner-in{from{opacity:0;transform:translateX(var(--banner-direction))}to{opacity:1;transform:translateX(0)}}
@keyframes wp-banner-out{from{opacity:1;transform:translateX(0)}to{opacity:0;transform:translateX(var(--banner-direction))}}
@media(prefers-reduced-motion:reduce){body .in-app-notification-overlay,body .in-app-notification-overlay.is-exiting{animation:none;transition:none}}
@media(max-width:640px){
 .staffing-preview-day{grid-template-columns:1fr 1fr}.staffing-preview-day small{grid-column:1/-1}
 body .in-app-notification-tray,body .notification-entry-summary{right:16px;width:min(360px,calc(100% - 32px));max-height:calc(100dvh - 100px)}
 body[data-notification-size="comfortable"] .in-app-notification-tray{width:min(440px,calc(100% - 32px))}
 body[data-notification-position="bottom-left"] .in-app-notification-tray,body[data-notification-position="bottom-left"] .notification-entry-summary,body[data-notification-position="top-left"] .in-app-notification-tray,body[data-notification-position="top-left"] .notification-entry-summary{left:16px;right:auto}
 body .in-app-notification-tray{bottom:var(--notification-stack-offset,16px)}body .notification-entry-summary{bottom:16px}
 body[data-notification-position^="top"] .in-app-notification-tray{top:calc(60px + var(--notification-stack-offset,16px));bottom:auto}
 body[data-notification-position^="top"] .notification-entry-summary{top:76px;bottom:auto}
}