/* Stoneware compatibility primitives used by the original Skork Tasks vertical slice. */
.tasks-page {
  display: grid;
  gap: var(--fs-page-gap);
  flex: 1 1 auto;
  width: 100%;
  min-width: 0;
}

.tasks-page .card {
  background: var(--rw-color-surface);
  border: 1px solid var(--rw-color-border-subtle);
  border-radius: var(--rw-radius-lg);
  box-shadow: var(--rw-shadow-sm);
}

.tasks-page .label {
  display: inline-block;
  margin-bottom: 6px;
  color: var(--rw-color-text);
  font-weight: 600;
}

.tasks-page .fs-field > .label {
  margin-bottom: 0;
}

.tasks-page .is-hidden,
.tasks-page [hidden] {
  display: none !important;
}

.tasks-page .heading--underlined {
  margin: 0;
}

.tasks-page .page-heading--with-nav-icon {
  display: inline-flex;
  align-items: center;
  gap: 10px;
}

.tasks-page .page-heading__nav-icon {
  width: 26px;
  height: 26px;
}

.tasks-page .nomenclature-requests__toolbar {
  display: grid;
  gap: 12px;
}

.tasks-page .nomenclature-requests__quick-actions,
.tasks-page .nomenclature-requests__quick-status {
  display: flex;
  align-items: center;
}

.tasks-page .nomenclature-requests__quick-actions {
  justify-content: flex-start;
  gap: 10px;
  flex-wrap: wrap;
}

.tasks-page .nomenclature-requests__quick-status {
  gap: 8px;
}

.tasks-page .nomenclature-requests__quick-status .label {
  margin: 0;
  white-space: nowrap;
}

.tasks-page {
  display: grid;
  gap: var(--fs-page-gap);
}

/* Final task list override: keep cards compact after responsive rules. */
.tasks-panel-list .tasks-list-head {
  display: none;
}

.tasks-panel-list .tasks-card__summary {
  grid-template-columns: minmax(0, 1fr) minmax(150px, 210px) auto;
  grid-template-areas:
    "main progress actions"
    "assignee progress actions"
    "effort progress actions";
  gap: 7px 12px;
  align-items: center;
  padding: 10px 12px;
}

.tasks-panel-list .tasks-card__main {
  grid-area: main;
  padding: 0;
}

.tasks-panel-list .tasks-card__type-panel {
  display: none;
}

.tasks-panel-list .tasks-card__assignee-panel {
  grid-area: assignee;
}

.tasks-panel-list .tasks-card__effort-panel {
  grid-area: effort;
}

.tasks-panel-list .tasks-card__assignee-panel,
.tasks-panel-list .tasks-card__effort-panel {
  display: flex;
  align-items: center;
  gap: 7px;
  min-height: 0;
  padding: 0;
  border: 0;
}

.tasks-panel-list .tasks-card__progress-panel {
  grid-area: progress;
  min-height: 0;
  padding: 0 0 0 12px;
  border-top: 0;
  border-left: 1px dashed color-mix(in srgb, var(--task-card-border) 72%, var(--border));
}

.tasks-panel-list .tasks-card__actions {
  grid-area: actions;
  grid-column: auto;
  grid-row: auto;
  align-self: center;
  justify-content: flex-end;
  width: 76px;
  padding-left: 8px;
  border-left: 1px dashed color-mix(in srgb, var(--task-card-border) 72%, var(--border));
}

@media (max-width: 760px) {
  .tasks-panel-list .tasks-card__summary {
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas:
      "main actions"
      "assignee assignee"
      "effort effort"
      "progress progress";
  }

  .tasks-panel-list .tasks-card__progress-panel {
    padding: 8px 0 0;
    border-left: 0;
    border-top: 1px dashed color-mix(in srgb, var(--task-card-border) 72%, var(--border));
  }

  .tasks-panel-list .tasks-card__actions {
    width: auto;
    border-left: 0;
    padding-left: 0;
  }

}

/* Redwood migration: task list page. */
.tasks-page--redwood {
  gap: var(--rw-space-3);
}

.tasks-page--redwood .card {
  box-shadow: var(--rw-shadow-sm);
}

.tasks-page--redwood .nomenclature-requests__header {
  min-height: 60px;
  padding: var(--rw-space-3) var(--rw-space-4);
}

.tasks-page--redwood .heading--underlined {
  color: var(--rw-color-text);
  border: 0;
  font-size: 20px;
  font-weight: 700;
}

.tasks-page--redwood .page-heading__nav-icon {
  width: 24px;
  height: 24px;
}

.tasks-page--redwood .tasks-status-toolbar {
  padding: var(--rw-space-3);
}

.tasks-page--redwood .tasks-filter-panel {
  margin-bottom: var(--rw-space-3);
  overflow: hidden;
  background: var(--rw-color-surface-subtle);
  border: 1px solid var(--rw-color-border-subtle);
  border-radius: var(--rw-radius-md);
}

.tasks-page--redwood .tasks-filter-panel__summary {
  min-height: 42px;
  padding: 9px var(--rw-space-3);
  color: var(--rw-color-text);
  background: transparent;
  border: 0;
  border-radius: 0;
  font-size: 13px;
  font-weight: 700;
}

.tasks-page--redwood .tasks-filter-panel[open] .tasks-filter-panel__summary {
  border-bottom: 1px solid var(--rw-color-border-subtle);
}

.tasks-page--redwood .tasks-filter-panel__grid,
.tasks-page--redwood .tasks-filter-panel__folder-grid {
  padding: var(--rw-space-3);
}

.tasks-page--redwood .nomenclature-requests__quick-actions {
  align-items: end;
}

.tasks-page--redwood .tasks-panel-list {
  padding: var(--rw-space-3);
  background: var(--rw-color-surface-subtle);
}

.tasks-page--redwood .tasks-list,
.tasks-page--redwood .tasks-group__items {
  gap: var(--rw-space-2);
}

.tasks-page--redwood .tasks-group__header {
  top: 7px;
  padding: 8px var(--rw-space-3);
  color: var(--rw-color-text);
  background: rgba(255, 255, 255, 0.96);
  border-color: var(--rw-color-border);
  border-radius: var(--rw-radius-md);
  box-shadow: var(--rw-shadow-sm);
  backdrop-filter: blur(10px);
}

.tasks-page--redwood .tasks-card {
  --task-card-bg: var(--rw-color-surface);
  --task-card-body-bg: var(--rw-color-surface);
  --task-card-border: var(--rw-color-border-subtle);
  border: 1px solid var(--rw-color-border-subtle);
  border-left: 4px solid var(--task-card-accent);
  border-radius: var(--rw-radius-md);
  background: var(--rw-color-surface);
  box-shadow: var(--rw-shadow-sm);
}

.tasks-page--redwood .tasks-card--forming,
/*
 * Status is carried by the accent edge and the badge, never by tinting the
 * whole row. Rows of pink and green drown the data they are meant to describe.
 */
.tasks-page--redwood .tasks-card {
  --task-card-bg: var(--fs-color-surface);
  --task-card-body-bg: var(--fs-color-surface);
  --task-card-border: var(--fs-color-border-subtle);
}

.tasks-page--redwood .tasks-card--cancelled {
  --task-card-accent: var(--fs-color-text-muted);
  --task-card-color: var(--fs-color-text-secondary);
}

.tasks-page--redwood .tasks-card--active {
  --task-card-accent: var(--fs-color-primary);
  --task-card-color: var(--fs-color-primary-text);
}

.tasks-page--redwood .tasks-card--completed {
  --task-card-accent: var(--fs-color-success);
  --task-card-color: var(--fs-color-success-text);
}

.tasks-page--redwood .tasks-card--overdue {
  --task-card-accent: var(--fs-color-danger);
  --task-card-color: var(--fs-color-danger-text);
}

.tasks-page--redwood .tasks-card__summary,
.tasks-page--redwood .tasks-card__details {
  background: var(--rw-color-surface);
}

.tasks-page--redwood .tasks-card__summary {
  padding: 11px var(--rw-space-3);
}

.tasks-page--redwood .tasks-card__inner-panel,
.tasks-page--redwood .tasks-card__actions,
.tasks-page--redwood .tasks-card__progress-panel {
  border-color: var(--rw-color-border-subtle);
}

.tasks-page--redwood .tasks-card__details {
  border-color: var(--rw-color-border-subtle);
}

.tasks-page--redwood .tasks-card-target {
  border-color: var(--rw-color-border-subtle);
}

@media (max-width: 760px) {

  .tasks-page--redwood .tasks-panel-list {
    padding: var(--rw-space-2);
  }
}

#taskDetailsPage > .nomenclature-request-form-header {
  position: sticky;
  top: 8px;
  z-index: 30;
  overflow: visible;
}

.tasks-header-save-error {
  max-width: 340px;
  margin: 0;
  font-size: 11px;
}

.tasks-add-target-action {
  flex: 0 0 auto;
  justify-self: end;
}

.tasks-type-badge {
  display: inline-flex;
  align-items: center;
  min-height: 36px;
  padding: 7px 11px;
  border: 1px solid var(--fs-color-primary-line);
  border-radius: 999px;
  background: var(--fs-color-primary-subtle);
  color: var(--brand-blue-dark);
  font-size: 12px;
  font-weight: 700;
  line-height: 1.2;
  white-space: nowrap;
}

.tasks-create-form {
  gap: 18px;
}

.tasks-create-general-grid {
  display: grid;
  grid-template-columns: minmax(0, 2fr) minmax(220px, 1fr);
  gap: 12px;
  align-items: start;
}

.tasks-create-general-grid--ordered {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.tasks-create-general-grid--ordered .nomenclature-modal__field:has(#taskTitle) {
  grid-column: 1 / -1;
  order: 1;
}

.tasks-create-general-grid--ordered .nomenclature-modal__field:has(#taskStartDate) {
  order: 2;
}

.tasks-create-general-grid--ordered .nomenclature-modal__field:has(#taskDeadline) {
  order: 3;
}

.tasks-create-general-grid--ordered .nomenclature-modal__field:has(#taskAssignee) {
  grid-column: 1 / -1;
  order: 4;
}

.tasks-create-general-grid--ordered .tasks-create-description-field {
  grid-column: 1 / -1;
  order: 5;
}

.tasks-create-general-grid--ordered .nomenclature-modal__field:has(#taskTotalEffortLegacy) {
  display: none;
}

.tasks-create-general-grid .nomenclature-modal__field {
  align-self: start;
}

.tasks-create-description-field {
  grid-column: 1 / -1;
}

.tasks-create-description-field textarea {
  min-height: 76px;
  resize: vertical;
}

.tasks-page .nomenclature-modal__section-head {
  align-items: center;
  justify-content: space-between;
}

.tasks-status-toolbar {
  display: grid;
  gap: 12px;
  padding: 10px 12px;
}

.tasks-filter-panel {
  display: grid;
  gap: 10px;
  padding: 10px;
  border: 1px solid color-mix(in srgb, var(--brand-blue) 14%, var(--border));
  border-radius: 12px;
  background: color-mix(in srgb, var(--brand-blue) 3%, #fff);
}

.tasks-filter-panel__summary {
  cursor: pointer;
  color: color-mix(in srgb, var(--brand-blue) 68%, var(--brand-dark));
  font-size: 11px;
  line-height: 1.25;
  font-weight: 600;
  list-style: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  width: 100%;
  min-height: 26px;
  padding: 0;
  border: 0;
  background: transparent;
  text-transform: uppercase;
}

.tasks-filter-panel__summary::-webkit-details-marker {
  display: none;
}

.tasks-filter-panel__chevron {
  position: relative;
  width: 16px;
  height: 16px;
  flex: 0 0 16px;
}

.tasks-filter-panel__chevron::before {
  position: absolute;
  top: 3px;
  left: 4px;
  content: "";
  width: 7px;
  height: 7px;
  border-right: 1.5px solid var(--fs-color-primary);
  border-bottom: 1.5px solid var(--fs-color-primary);
  transform: rotate(45deg);
  transition: transform 0.15s ease, top 0.15s ease;
}

.tasks-filter-panel[open] .tasks-filter-panel__chevron::before {
  top: 6px;
  transform: rotate(225deg);
}

.tasks-filter-panel__grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(150px, 1fr));
  gap: 10px;
  padding: 10px 0 0;
}

.tasks-filter-panel__folder-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  padding-top: 10px;
}

.tasks-filter-folder-button {
  width: auto;
  min-height: 32px;
}

.hierarchy-selection-control__button.tasks-target-hierarchy-button,
.hierarchy-selection-control__button.tasks-edit-hierarchy-button,
.hierarchy-selection-control__button.tasks-filter-folder-button {
  width: auto;
  min-height: 32px;
}

.tasks-filter-folder-button.is-loading .price-list__hierarchy-button-icon {
  width: 16px;
  height: 16px;
  border: 2px solid var(--fs-color-primary-line);
  border-top-color: var(--brand-blue);
  border-radius: 999px;
  background: transparent;
  animation: tasksHierarchySpin 0.8s linear infinite;
}

.tasks-filter-folder-button.is-loading .price-list__hierarchy-button-icon::before {
  content: none;
}

#tasksFilterHierarchyModal .price-list__hierarchy-dialog {
  grid-template-rows: auto auto auto minmax(0, 1fr) auto;
}

#taskHierarchyModal .tasks-hierarchy-selected,
#taskEditHierarchyModal .tasks-hierarchy-selected,
#tasksFilterHierarchyModal .tasks-hierarchy-selected {
  display: block;
  max-height: 0;
  padding: 0;
  border: 0;
}

#taskHierarchyModal .tasks-hierarchy-selected:not(:empty),
#taskEditHierarchyModal .tasks-hierarchy-selected:not(:empty),
#tasksFilterHierarchyModal .tasks-hierarchy-selected:not(:empty) {
  max-height: 150px;
  padding: 10px 14px;
  border-bottom: 1px solid var(--border);
}

#tasksFilterHierarchyModal .tasks-hierarchy-search {
  position: relative;
  z-index: 1;
  margin: 0;
}

#tasksFilterHierarchyModal .price-list__hierarchy-tree {
  min-height: 0;
}

#tasksFilterHierarchyModal .price-list__hierarchy-footer {
  gap: 8px;
}

#tasksFilterHierarchyModal .tasks-hierarchy-clear-action {
  flex: 0 0 auto;
}

.tasks-filter-field {
  display: grid;
  gap: 5px;
  min-width: 0;
}

.tasks-status-filter-wrap {
  min-width: 0;
  flex: 0 1 330px;
}

.tasks-status-control {
  flex: 1 1 190px;
  min-width: 190px;
}

.tasks-panel-list {
  overflow: visible;
}

.tasks-list-head {
  display: grid;
  grid-template-columns: minmax(260px, 1fr) minmax(150px, 0.5fr) minmax(86px, 0.32fr) minmax(160px, 0.58fr) 92px;
  gap: 0;
  align-items: center;
  padding: 8px 10px;
  border: 1px solid color-mix(in srgb, var(--brand-blue) 14%, var(--border));
  border-radius: 10px;
  background: color-mix(in srgb, var(--brand-blue) 9%, #fff);
  color: color-mix(in srgb, var(--brand-blue) 65%, var(--brand-dark));
  font-size: 10.5px;
  font-weight: 600;
  line-height: 1.15;
  text-transform: uppercase;
}

.tasks-list-head > div {
  min-width: 0;
  padding: 0 12px;
  border-left: 1px dashed color-mix(in srgb, var(--brand-blue) 18%, var(--border));
}

.tasks-list-head > div:first-child {
  padding-left: 2px;
  border-left: 0;
}

.tasks-list-head > div:last-child {
  text-align: center;
}

.tasks-list {
  display: grid;
  gap: 8px;
}

.tasks-group {
  display: grid;
  gap: 8px;
}

.tasks-group + .tasks-group {
  margin-top: 14px;
}

.tasks-group__header {
  position: sticky;
  top: 0;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 8px 11px;
  border: 1px solid color-mix(in srgb, var(--brand-blue) 16%, var(--border));
  border-radius: 9px;
  background: color-mix(in srgb, var(--brand-blue) 5%, #fff);
  color: var(--brand-blue-dark);
}

.tasks-group__header span {
  min-width: 24px;
  padding: 2px 7px;
  border-radius: 999px;
  background: var(--fs-color-surface);
  text-align: center;
  font-size: 12px;
}

.tasks-group__items {
  display: grid;
  gap: 8px;
}

.tasks-priority {
  display: inline-flex;
  align-items: center;
  min-height: 22px;
  padding: 3px 8px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 600;
}

.tasks-priority--low {
  background: var(--fs-color-success-subtle);
  color: var(--fs-color-success);
}

.tasks-priority--normal {
  background: var(--fs-color-border-subtle);
  color: var(--fs-color-primary);
}

.tasks-priority--high {
  background: var(--fs-color-danger-subtle);
  color: var(--fs-color-danger);
}

/*
 * Every row is white. Status is carried by the left edge and the badge, never by
 * filling the row: a list where each record has its own background reads as four
 * unrelated lists, and the fill outweighs the data it is supposed to qualify.
 * Only the accent and the text colour change per status.
 */
.tasks-card {
  --task-card-bg: var(--fs-color-surface);
  --task-card-body-bg: var(--fs-color-surface);
  --task-card-border: var(--fs-color-border-subtle);
  --task-card-color: var(--fs-color-primary);
  --task-card-accent: var(--fs-color-primary);
  display: grid;
  position: relative;
  min-width: 0;
  padding: 0;
  border-color: var(--task-card-border);
  background: var(--task-card-body-bg);
  color: inherit;
  overflow: hidden;
}

.tasks-card--forming,
.tasks-card--cancelled {
  --task-card-color: var(--fs-color-text-secondary);
  --task-card-accent: var(--fs-color-text-muted);
}

.tasks-card--active {
  --task-card-color: var(--fs-color-primary-text);
  --task-card-accent: var(--fs-color-primary);
}

.tasks-card--completed {
  --task-card-color: var(--fs-color-success-text);
  --task-card-accent: var(--fs-color-success);
}

.tasks-card--overdue {
  --task-card-color: var(--fs-color-danger-text);
  --task-card-accent: var(--fs-color-danger);
}

.tasks-card__summary {
  display: grid;
  grid-template-columns: minmax(260px, 1fr) minmax(150px, 0.5fr) minmax(86px, 0.32fr) minmax(160px, 0.58fr) 92px;
  gap: 0;
  align-items: center;
  padding: 9px 10px;
  list-style: none;
  cursor: default;
  background: var(--task-card-bg);
}

.tasks-list-head > div:nth-child(2),
.tasks-card__type-panel {
  display: none;
}

.tasks-card__summary::-webkit-details-marker {
  display: none;
}

.tasks-card__main,
.tasks-card__inner-panel,
.tasks-card__meta-item,
.tasks-card-target {
  min-width: 0;
}

.tasks-card__main {
  display: grid;
  gap: 6px;
  padding: 2px 12px 2px 2px;
}

.tasks-card__number-line {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.tasks-card__code {
  color: var(--task-card-color);
  font-size: 13px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}

.tasks-card__created {
  color: var(--brand-muted);
  font-size: 11px;
  line-height: 1.2;
  font-weight: 600;
}

.tasks-card__inner-panel {
  display: grid;
  gap: 4px;
  align-content: center;
  min-height: 46px;
  padding: 2px 12px;
  border-left: 1px dashed color-mix(in srgb, var(--task-card-border) 72%, var(--border));
}

.tasks-card__inner-panel > span,
.tasks-card__meta-item span {
  color: var(--brand-muted);
  font-size: 10.5px;
  line-height: 1.15;
  font-weight: 600;
  text-transform: uppercase;
}

.tasks-card__inner-panel strong,
.tasks-card__meta-item strong {
  color: var(--brand-dark);
  font-size: 12px;
  line-height: 1.25;
  font-weight: 700;
  overflow-wrap: anywhere;
}

.tasks-card__actions {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  flex-wrap: nowrap;
  padding-left: 10px;
  border-left: 1px dashed color-mix(in srgb, var(--task-card-border) 72%, var(--border));
}

.tasks-card[open] .nomenclature-request-card__toggle-button span {
  transform: rotate(225deg) translate(-2px, -2px);
}

.tasks-card__details {
  display: grid;
  gap: 12px;
  padding: 10px 62px 12px 12px;
  border-top: 1px solid var(--task-card-border);
  background: var(--task-card-body-bg);
}

.tasks-card__meta-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0 16px;
  padding: 2px 0 10px;
  border-bottom: 1px dashed color-mix(in srgb, var(--task-card-border) 70%, var(--border));
}

.tasks-card__meta-item {
  display: grid;
  gap: 3px;
  padding: 6px 0;
}

.tasks-card__title {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.tasks-card__title strong {
  color: var(--task-card-color);
  font-size: 14px;
  font-weight: 700;
  line-height: 1.22;
  overflow-wrap: anywhere;
}

.tasks-card__title span {
  color: var(--brand-muted);
  font-size: 11px;
  line-height: 1.2;
  font-weight: 600;
}

.tasks-card__title > span {
  display: none;
}

.tasks-card__type-badge {
  border-color: color-mix(in srgb, var(--task-card-accent) 28%, var(--fs-color-primary-line));
  background: color-mix(in srgb, var(--task-card-accent) 10%, #fff);
  color: var(--task-card-color);
}

.tasks-card__details-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 0.55fr);
  gap: 9px;
  align-items: start;
  padding-top: 7px;
  border-top: 1px solid color-mix(in srgb, var(--brand-blue) 10%, var(--border));
}

.tasks-card__targets {
  display: grid;
  gap: 8px;
}

.tasks-card-target {
  display: grid;
  gap: 7px;
  padding: 10px 0 0;
  border-top: 1px dashed color-mix(in srgb, var(--task-card-border) 70%, var(--border));
}

.tasks-card-target:first-child {
  padding-top: 0;
  border-top: 0;
}

.tasks-card-target__progress,
.tasks-detail-target__progress {
  width: min(100%, 320px);
  min-width: 0;
  margin-left: auto;
}

.tasks-card-target__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 8px;
  flex-wrap: wrap;
}

.tasks-card-target__head strong {
  color: var(--task-card-color);
  font-size: 13px;
  line-height: 1.25;
  font-weight: 700;
}

.tasks-card-target__head span {
  color: var(--brand-muted);
  font-size: 11px;
  line-height: 1.25;
  font-weight: 600;
}

.tasks-card-target__grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0 14px;
}

.tasks-card__details-main {
  display: grid;
  gap: 6px;
  min-width: 0;
}

.tasks-progress,
.tasks-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.tasks-tag {
  display: inline-flex;
  max-width: 260px;
  padding: 3px 8px;
  border: 1px solid color-mix(in srgb, var(--brand-blue) 16%, var(--border));
  border-radius: 7px;
  background: color-mix(in srgb, var(--brand-blue) 5%, #fff);
  color: var(--brand-dark);
  font-size: 10.5px;
  font-weight: 600;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tasks-tag--progress {
  background: var(--fs-color-primary-subtle);
  border-color: var(--fs-color-primary-line);
  color: var(--fs-color-primary-hover);
}

.tasks-progress-bar {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.tasks-card__progress-panel .tasks-progress-bar {
  align-content: center;
  min-height: 24px;
}

.tasks-progress-bar__head,
.tasks-progress-bar__meta {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  color: var(--brand-muted);
  font-size: 10.5px;
  line-height: 1.2;
  font-weight: 600;
}

.tasks-progress-bar__head strong {
  color: var(--brand-blue-dark);
  font-size: 11.5px;
}

.tasks-progress-bar__track {
  display: block;
  width: 100%;
  height: 7px;
  padding: 0;
  overflow: hidden;
  border: 1px solid var(--fs-color-primary-line);
  border-radius: 999px;
  background: var(--fs-color-border-subtle);
  appearance: none;
  -webkit-appearance: none;
}

.tasks-progress-bar__track::-webkit-progress-bar {
  border-radius: inherit;
  background: var(--fs-color-border-subtle);
}

.tasks-progress-bar__track::-webkit-progress-value {
  border-radius: inherit;
  background: var(--task-card-accent);
}

.tasks-progress-bar__track::-moz-progress-bar {
  border-radius: inherit;
  background: var(--task-card-accent);
}

.tasks-card--completed .tasks-progress-bar__track,
.tasks-page[data-task-status="COMPLETED"] .tasks-progress-bar__track {
  --task-card-accent: var(--rw-color-success, var(--fs-color-success));
  background: var(--rw-color-success, var(--fs-color-success));
}

.tasks-card--overdue .tasks-progress-bar__track,
.tasks-page[data-task-status="OVERDUE"] .tasks-progress-bar__track {
  --task-card-accent: var(--rw-color-danger, var(--fs-color-danger));
  background: var(--rw-color-danger, var(--fs-color-danger));
}

.tasks-progress-bar__meta {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tasks-type-picker {
  display: grid;
  gap: 14px;
  padding: 16px;
}

.tasks-type-card {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 12px;
  align-items: center;
  width: 100%;
  padding: 14px;
  border: 1px solid color-mix(in srgb, var(--brand-blue) 20%, var(--border));
  border-radius: 12px;
  background: var(--fs-color-surface);
  color: var(--brand-dark);
  cursor: pointer;
  text-align: left;
  text-decoration: none;
}

.tasks-type-card.is-selected {
  border-color: var(--brand-blue);
  box-shadow: 0 8px 22px rgba(0, 91, 187, 0.12);
}

.tasks-type-card:hover {
  background: var(--fs-color-surface-subtle);
  box-shadow: 0 10px 24px rgba(0, 91, 187, 0.14);
}

.tasks-type-card:focus-visible {
  outline: 3px solid color-mix(in srgb, var(--brand-blue) 28%, transparent);
  outline-offset: 2px;
}

.tasks-type-card__icon {
  width: 42px;
  height: 42px;
  border-radius: 999px;
  border: 1px solid var(--fs-color-primary-line);
  background: var(--fs-color-primary-subtle);
  position: relative;
}

.tasks-type-card__icon::before {
  content: "";
  position: absolute;
  inset: 10px;
  background: url("/stoneware/icons/task/cart.svg") center / contain no-repeat;
  filter: invert(28%) sepia(97%) saturate(1938%) hue-rotate(201deg) brightness(91%) contrast(96%);
}

.tasks-type-card strong {
  display: block;
  color: var(--brand-blue-dark);
  font-size: 16px;
  line-height: 1.25;
}

.tasks-type-card small,
.tasks-section-note,
.tasks-verification-note p {
  color: var(--brand-muted);
  font-size: 12px;
  line-height: 1.35;
  font-weight: 700;
}

.tasks-create-form[hidden],
.tasks-type-picker[hidden] {
  display: none;
}

.tasks-targets {
  display: grid;
  gap: 10px;
}

.tasks-target {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  gap: 10px;
  padding: 10px;
  border: 1px solid color-mix(in srgb, var(--brand-blue) 16%, var(--border));
  border-radius: 10px;
  background: color-mix(in srgb, var(--brand-blue) 5%, #fff);
  box-shadow: 0 6px 18px rgba(15, 23, 42, 0.04);
}

.tasks-target__head {
  display: grid;
  align-content: start;
  justify-items: center;
  gap: 7px;
  padding-top: 1px;
}

.tasks-target__number {
  display: inline-grid;
  place-items: center;
  width: 30px;
  height: 30px;
  border: 1px solid var(--fs-color-primary-line);
  border-radius: 999px;
  background: var(--fs-color-primary-subtle);
  color: var(--brand-blue-dark);
  font-size: 13px;
  font-weight: 700;
  line-height: 1;
}

.tasks-target__body {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 10px;
  align-items: start;
  min-width: 0;
}

.tasks-target__criteria {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  align-self: start;
  min-width: 0;
  padding: 0;
  border: 0;
  background: transparent;
}

.tasks-target__criteria .nomenclature-modal__field {
  min-width: 0;
  padding: 9px;
  border: 1px solid color-mix(in srgb, var(--brand-blue) 12%, var(--border));
  border-radius: 10px;
  background: var(--fs-color-surface);
}

.tasks-target__criteria .nomenclature-modal__field:last-child {
  border-bottom: 1px solid color-mix(in srgb, var(--brand-blue) 12%, var(--border));
}

.tasks-target .nomenclature-modal__field {
  min-width: 0;
}

.tasks-target__body > .nomenclature-modal__field {
  padding: 9px;
  border: 1px solid color-mix(in srgb, var(--brand-blue) 12%, var(--border));
  border-radius: 10px;
  background: var(--fs-color-surface);
}

.tasks-target__field--wide {
  grid-column: 1 / -1;
}

.tasks-target .fs-field input:not([type="hidden"]),
.tasks-target .fs-field select {
  min-height: 40px;
  height: 40px;
}

.tasks-target .fs-field textarea {
  height: auto;
}

.tasks-target .nomenclature-modal__search {
  position: relative;
  display: block;
}

.tasks-target .nomenclature-modal__search input:not([type="hidden"]) {
  width: 100%;
  padding-right: 44px;
}

.tasks-search-button {
  position: absolute;
  top: 50%;
  right: 8px;
  width: 32px;
  height: 32px;
  min-width: 32px;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--brand-blue);
  transform: translateY(-50%);
}

.tasks-search-button::before {
  content: "";
  width: 18px;
  height: 18px;
  display: block;
  margin: auto;
  background: url("/stoneware/icons/task/search.svg") center / contain no-repeat;
  filter: invert(28%) sepia(97%) saturate(1938%) hue-rotate(201deg) brightness(91%) contrast(96%);
}

.tasks-target-hierarchy-button {
  min-width: 0;
  max-width: 100%;
  min-height: 40px;
  height: 40px;
}

.tasks-target-hierarchy-button span:last-child {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tasks-target-hierarchy-button.is-loading .price-list__hierarchy-button-icon {
  width: 16px;
  height: 16px;
  border: 2px solid var(--fs-color-primary-line);
  border-top-color: var(--brand-blue);
  border-radius: 999px;
  background: transparent;
  animation: tasksHierarchySpin 0.8s linear infinite;
}

.tasks-target-hierarchy-button.is-loading .price-list__hierarchy-button-icon::before {
  content: none;
}

@keyframes tasksHierarchySpin {
  to {
    transform: rotate(360deg);
  }
}

.tasks-hierarchy-button {
  min-height: 40px;
  width: 100%;
  border: 1px solid color-mix(in srgb, var(--brand-blue) 18%, var(--border));
  border-radius: 10px;
  background: var(--fs-color-surface);
  color: var(--brand-blue-dark);
  font-size: 13px;
  font-weight: 700;
  padding: 8px 12px;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 8px;
  text-align: left;
}

.tasks-hierarchy-button:disabled {
  opacity: 0.55;
  cursor: not-allowed;
}

.tasks-hierarchy-button.is-loading .price-list__hierarchy-button-icon,
.tasks-edit-hierarchy-button.is-loading .price-list__hierarchy-button-icon {
  width: 16px;
  height: 16px;
  border: 2px solid var(--fs-color-primary-line);
  border-top-color: var(--brand-blue);
  border-radius: 999px;
  background: transparent;
  animation: tasksHierarchySpin 0.8s linear infinite;
}

.tasks-hierarchy-button.is-loading .price-list__hierarchy-button-icon::before,
.tasks-edit-hierarchy-button.is-loading .price-list__hierarchy-button-icon::before {
  content: none;
}

.tasks-hierarchy-button span:last-child {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* Drawn folder: the border is the outline, so it takes the solid warning tone. */
.tasks-hierarchy-button__icon,
.tasks-hierarchy-folder {
  width: 16px;
  height: 12px;
  flex: 0 0 auto;
  border-radius: 2px;
  background: var(--fs-color-warning-subtle);
  border: 1px solid var(--fs-color-warning);
  position: relative;
}

.tasks-hierarchy-button__icon::before,
.tasks-hierarchy-folder::before {
  content: "";
  position: absolute;
  left: 1px;
  top: -4px;
  width: 8px;
  height: 5px;
  border-radius: 2px 2px 0 0;
  background: var(--fs-color-warning-subtle);
  border: 1px solid var(--fs-color-warning);
  border-bottom: 0;
}

.tasks-hierarchy-modal {
  position: fixed;
  inset: 0;
  z-index: 1200;
  background: rgba(15, 23, 42, 0.46);
  display: grid;
  place-items: center;
  padding: 18px;
}

.tasks-hierarchy-dialog {
  width: min(720px, 100%);
  max-height: min(760px, calc(100vh - 36px));
  background: var(--fs-color-surface);
  border: 1px solid var(--border);
  border-radius: 12px;
  box-shadow: 0 24px 70px rgba(15, 23, 42, 0.22);
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  overflow: hidden;
  outline: none;
}

#taskHierarchyModal .price-list__hierarchy-dialog,
#taskEditHierarchyModal .price-list__hierarchy-dialog {
  grid-template-rows: auto auto auto minmax(0, 1fr) auto;
}

.tasks-hierarchy-header,
.tasks-hierarchy-footer {
  padding: 12px 14px;
  border-bottom: 1px solid var(--border);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.tasks-hierarchy-footer {
  border-top: 1px solid var(--border);
  border-bottom: 0;
  justify-content: flex-end;
}

.tasks-hierarchy-header div {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.tasks-hierarchy-header strong {
  color: var(--brand-dark);
  font-size: 15px;
  line-height: 1.2;
}

.tasks-hierarchy-header span {
  color: var(--brand-muted);
  font-size: 12px;
  font-weight: 700;
}

.tasks-hierarchy-search {
  padding: 10px 14px;
  border-bottom: 1px solid var(--border);
  background: color-mix(in srgb, var(--brand-blue) 4%, #fff);
}

.tasks-hierarchy-selected {
  display: none;
  max-height: 150px;
  overflow: auto;
  padding: 10px 14px;
  border-bottom: 1px solid var(--border);
  background: var(--fs-color-surface);
}

.tasks-hierarchy-selected:not(:empty) {
  display: block;
}

.tasks-hierarchy-selected .tasks-selection-tree {
  padding: 7px 9px;
  border-radius: 8px;
  background: color-mix(in srgb, var(--brand-blue) 4%, #fff);
}

.tasks-hierarchy-search input {
  width: 100%;
  min-height: 38px;
}

.tasks-hierarchy-close {
  position: relative;
  width: 32px;
  height: 32px;
}

.tasks-hierarchy-close::before {
  content: "";
  width: 18px;
  height: 18px;
  display: block;
  margin: auto;
  background: url("/stoneware/icons/task/x-circle.svg") center / contain no-repeat;
  opacity: 0.78;
}

.tasks-hierarchy-tree,
.tasks-hierarchy-children {
  list-style: none;
  margin: 0;
  padding: 0;
}

.tasks-hierarchy-tree {
  overflow: auto;
  padding: 10px;
}

.tasks-hierarchy-node {
  display: grid;
  gap: 4px;
}

.tasks-hierarchy-row {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  gap: 6px;
  align-items: center;
  padding-left: 0;
}
.price-list__hierarchy-row[data-level="0"],
.tasks-hierarchy-row[data-level="0"] {
  padding-left: 0px;
}

.price-list__hierarchy-row[data-level="1"],
.tasks-hierarchy-row[data-level="1"] {
  padding-left: 18px;
}

.price-list__hierarchy-row[data-level="2"],
.tasks-hierarchy-row[data-level="2"] {
  padding-left: 36px;
}

.price-list__hierarchy-row[data-level="3"],
.tasks-hierarchy-row[data-level="3"] {
  padding-left: 54px;
}

.price-list__hierarchy-row[data-level="4"],
.tasks-hierarchy-row[data-level="4"] {
  padding-left: 72px;
}

.price-list__hierarchy-row[data-level="5"],
.tasks-hierarchy-row[data-level="5"] {
  padding-left: 90px;
}

.price-list__hierarchy-row[data-level="6"],
.tasks-hierarchy-row[data-level="6"] {
  padding-left: 108px;
}

.price-list__hierarchy-row[data-level="7"],
.tasks-hierarchy-row[data-level="7"] {
  padding-left: 126px;
}

.price-list__hierarchy-row[data-level="8"],
.tasks-hierarchy-row[data-level="8"] {
  padding-left: 144px;
}

.price-list__hierarchy-row[data-level="9"],
.tasks-hierarchy-row[data-level="9"] {
  padding-left: 162px;
}

.price-list__hierarchy-row[data-level="10"],
.tasks-hierarchy-row[data-level="10"] {
  padding-left: 180px;
}

.tasks-hierarchy-toggle {
  width: 26px;
  height: 26px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--fs-color-surface);
  color: var(--brand-blue);
  font-weight: 700;
  cursor: pointer;
}

.tasks-hierarchy-toggle:disabled {
  opacity: 0;
  cursor: default;
}

.tasks-hierarchy-select {
  min-height: 34px;
  border: 1px solid transparent;
  border-radius: 8px;
  background: transparent;
  color: var(--brand-dark);
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
  padding: 7px 8px;
  text-align: left;
  cursor: pointer;
}

.tasks-hierarchy-select--all {
  grid-template-columns: auto minmax(0, 1fr);
  margin-bottom: 6px;
}

.tasks-hierarchy-select:hover {
  border-color: color-mix(in srgb, var(--brand-blue) 20%, var(--border));
  background: color-mix(in srgb, var(--brand-blue) 5%, #fff);
}

.tasks-hierarchy-text,
.tasks-hierarchy-select span:nth-child(2) {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 13px;
  font-weight: 700;
}

.tasks-hierarchy-count {
  min-width: 28px;
  padding: 2px 6px;
  border-radius: 999px;
  background: var(--fs-color-primary-subtle);
  color: var(--fs-color-primary-hover);
  font-size: 11px;
  font-weight: 600;
  text-align: center;
}

.tasks-error {
  padding: 10px 12px;
  border: 1px solid var(--fs-color-danger-line);
  border-radius: 8px;
  background: var(--fs-color-danger-subtle);
  color: var(--fs-color-danger-hover);
  font-size: 13px;
  font-weight: 700;
}

.nomenclature-form-page .label.tasks-label--box {
  --field-icon: url("/stoneware/icons/task/box.svg");
}

.nomenclature-form-page .label.tasks-label--text {
  --field-icon: url("/stoneware/icons/task/text.svg");
}

.nomenclature-form-page .label.tasks-label--tag {
  --field-icon: url("/stoneware/icons/task/tag.svg");
}

.nomenclature-form-page .label.tasks-label--partner {
  --field-icon: url("/stoneware/icons/task/partner.svg");
}

.nomenclature-form-page .label.tasks-label--quantity {
  --field-icon: url("/stoneware/icons/task/quantity.svg");
}

.nomenclature-form-page .label.tasks-label--cash {
  --field-icon: url("/stoneware/icons/task/cash.svg");
}

.nomenclature-form-page .label.tasks-label--deadline {
  --field-icon: url("/stoneware/icons/task/calendar-clock.svg");
}

.nomenclature-form-page .label.tasks-label--status {
  --field-icon: url("/stoneware/icons/task/status-check.svg");
}

.nomenclature-form-page .label.tasks-label--comment {
  --field-icon: url("/stoneware/icons/task/comment.svg");
}

.nomenclature-form-page .label.tasks-label--group {
  --field-icon: url("/stoneware/icons/task/list-plus.svg");
}

.nomenclature-form-page .label.tasks-label--effort {
  --field-icon: url("/stoneware/icons/task/ruler.svg");
}

.tasks-readonly-input {
  background: color-mix(in srgb, var(--brand-blue) 5%, #fff);
  color: var(--brand-blue-dark);
  font-weight: 700;
}

.nomenclature-form-page.tasks-page .label[for]::before,
.nomenclature-form-page.tasks-page .label[class*="tasks-label--"]::before {
  content: "";
  display: inline-block;
  width: 15px;
  height: 15px;
  margin-right: 6px;
  vertical-align: -2px;
  background: var(--field-icon, url("/stoneware/icons/task/info.svg")) center / contain no-repeat;
  filter: invert(28%) sepia(97%) saturate(1938%) hue-rotate(201deg) brightness(91%) contrast(96%);
}

.nomenclature-form-page .tasks-target .label {
  display: block;
}

.nomenclature-form-page .label[for="taskTitle"] {
  --field-icon: url("/stoneware/icons/task/text.svg");
}

.nomenclature-form-page .label[for="taskAssignee"] {
  --field-icon: url("/stoneware/icons/task/user.svg");
}

.nomenclature-form-page .label[for="taskStartDate"] {
  --field-icon: url("/stoneware/icons/task/calendar-add.svg");
}

.nomenclature-form-page .label[for="taskDeadline"] {
  --field-icon: url("/stoneware/icons/task/calendar-clock.svg");
}

.nomenclature-form-page .label[for="taskTotalEffort"] {
  --field-icon: url("/stoneware/icons/task/ruler.svg");
}

.nomenclature-form-page .label[for="taskDescription"] {
  --field-icon: url("/stoneware/icons/task/comment.svg");
}

.tasks-readonly-field {
  min-width: 0;
}

.tasks-readonly-field--wide {
  grid-column: 1 / -1;
}

.tasks-readonly-value {
  display: flex;
  align-items: center;
  min-height: 40px;
  padding: 9px 12px;
  border: 1px solid color-mix(in srgb, var(--brand-blue) 14%, var(--border));
  border-radius: 10px;
  background: var(--fs-color-surface-subtle);
  color: var(--brand-dark);
  font-size: 13px;
  font-weight: 700;
  line-height: 1.3;
  overflow-wrap: anywhere;
}

.tasks-readonly-value--multiline {
  align-items: flex-start;
  min-height: 76px;
  white-space: pre-wrap;
}

.tasks-readonly-value--wrap {
  align-items: flex-start;
  height: auto;
  white-space: normal;
  overflow-wrap: anywhere;
}

.tasks-selection-tree {
  display: block;
  align-items: initial;
  height: auto;
  padding: 8px 10px;
  white-space: normal;
}

.tasks-selection-tree--empty {
  color: var(--brand-muted);
}

.tasks-selection-tree__list,
.tasks-selection-tree ul {
  display: grid;
  gap: 4px;
  list-style: none;
  margin: 0;
  padding: 0;
}

.tasks-selection-tree ul ul {
  margin-top: 4px;
  padding-left: 18px;
  border-left: 1px dashed color-mix(in srgb, var(--brand-blue) 24%, var(--border));
}

.tasks-selection-tree__node {
  min-width: 0;
}

.tasks-selection-tree details {
  min-width: 0;
}

.tasks-selection-tree summary {
  display: flex;
  align-items: center;
  gap: 7px;
  min-width: 0;
  min-height: 24px;
  color: var(--brand-blue-dark);
  font-size: 13px;
  font-weight: 700;
  line-height: 1.25;
  cursor: pointer;
  list-style: none;
}

.tasks-selection-tree summary::-webkit-details-marker {
  display: none;
}

.tasks-selection-tree summary span:last-child,
.tasks-selection-tree__node--leaf span:last-child {
  min-width: 0;
  overflow-wrap: anywhere;
}

.tasks-selection-tree__branch-icon,
.tasks-selection-tree__leaf-icon {
  flex: 0 0 auto;
}

.tasks-selection-tree__branch-icon {
  position: relative;
  width: 15px;
  height: 11px;
  border: 1px solid var(--fs-color-warning);
  border-radius: 2px;
  background: var(--fs-color-warning-subtle);
}

.tasks-selection-tree__branch-icon::before {
  content: "";
  position: absolute;
  left: 1px;
  top: -4px;
  width: 8px;
  height: 5px;
  border: 1px solid var(--fs-color-warning);
  border-bottom: 0;
  border-radius: 2px 2px 0 0;
  background: var(--fs-color-warning-subtle);
}

.tasks-selection-tree__node--leaf {
  display: flex;
  align-items: center;
  gap: 7px;
  min-height: 24px;
  color: var(--brand-dark);
  font-size: 13px;
  font-weight: 700;
  line-height: 1.25;
}

.tasks-selection-tree__leaf-icon {
  width: 8px;
  height: 8px;
  margin-left: 4px;
  border: 1px solid color-mix(in srgb, var(--brand-blue) 28%, var(--border));
  border-radius: 999px;
  background: color-mix(in srgb, var(--brand-blue) 22%, #fff);
}

.tasks-readonly-value.nomenclature-badge {
  display: inline-flex;
  justify-self: start;
  min-height: 30px;
  padding: 6px 12px;
  border-radius: 8px;
}

.tasks-details,
.tasks-panel {
  display: grid;
  gap: 12px;
  padding: 16px;
}

.tasks-detail-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 14px;
  align-items: start;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--fs-color-border-subtle);
}

.tasks-detail-hero__main {
  display: grid;
  gap: 7px;
  min-width: 0;
}

.tasks-detail-hero__number {
  color: var(--brand-blue-dark);
  font-size: 13px;
  font-weight: 700;
}

.tasks-detail-hero h2 {
  margin: 0;
  color: var(--brand-dark);
  font-size: 22px;
  line-height: 1.2;
  overflow-wrap: anywhere;
}

.tasks-detail-hero p {
  margin: 0;
  color: var(--fs-color-text-secondary);
  font-size: 14px;
  line-height: 1.45;
  max-width: 860px;
}

.tasks-detail-hero__meta {
  display: grid;
  justify-items: end;
  gap: 8px;
}

.tasks-detail-date {
  display: grid;
  justify-items: end;
  gap: 2px;
  padding: 8px 10px;
  border: 1px solid color-mix(in srgb, var(--brand-blue) 16%, var(--border));
  border-radius: 8px;
  background: color-mix(in srgb, var(--brand-blue) 4%, #fff);
}

.tasks-detail-date span,
.tasks-detail-summary__item span,
.tasks-detail-target__meta span {
  color: var(--brand-muted);
  font-size: 11px;
  line-height: 1.2;
  font-weight: 600;
}

.tasks-detail-date strong,
.tasks-detail-summary__item strong,
.tasks-detail-target__meta strong {
  color: var(--brand-dark);
  font-size: 13px;
  line-height: 1.25;
  font-weight: 700;
  overflow-wrap: anywhere;
}

.tasks-detail-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.tasks-detail-summary__item {
  --detail-icon-color: var(--fs-color-primary);
  --detail-icon-bg: var(--fs-color-primary-subtle);
  --detail-icon-border: var(--fs-color-primary-line);
  --detail-icon: url("/stoneware/icons/task/user.svg");
  position: relative;
  display: grid;
  gap: 4px;
  min-height: 62px;
  padding: 10px 12px 10px 54px;
  border: 1px solid var(--detail-icon-border);
  border-radius: 8px;
  background: color-mix(in srgb, var(--detail-icon-color) 5%, #fff);
}

.tasks-detail-summary__item::before,
.tasks-detail-summary__item::after {
  content: "";
  position: absolute;
}

.tasks-detail-summary__item::before {
  left: 12px;
  top: 13px;
  width: 30px;
  height: 30px;
  border-radius: 999px;
  border: 1px solid var(--detail-icon-border);
  background: var(--detail-icon-bg);
}

.tasks-detail-summary__item::after {
  left: 20px;
  top: 21px;
  width: 14px;
  height: 14px;
  background: var(--detail-icon-color);
  -webkit-mask: var(--detail-icon) center / contain no-repeat;
  mask: var(--detail-icon) center / contain no-repeat;
}

.tasks-detail-summary__item--quantity {
  --detail-icon-color: var(--fs-color-primary);
  --detail-icon-bg: var(--fs-color-primary-subtle);
  --detail-icon-border: var(--fs-color-primary-line);
  --detail-icon: url("/stoneware/icons/task/quantity.svg");
}

.tasks-detail-summary__item--amount {
  --detail-icon-color: var(--fs-color-success);
  --detail-icon-bg: var(--fs-color-success-subtle);
  --detail-icon-border: var(--fs-color-success-line);
  --detail-icon: url("/stoneware/icons/task/cash.svg");
}

.tasks-detail-section {
  display: grid;
  gap: 10px;
}

.tasks-edit-form {
  display: grid;
  gap: 12px;
  padding: 0;
  border: 0;
  background: transparent;
}

.tasks-form-section-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  min-width: 0;
}

#taskCreateForm .nomenclature-modal__section > .nomenclature-modal__section-title:has(+ .tasks-form-section-head) {
  display: none;
}

.tasks-form-head-fields {
  display: grid;
  grid-template-columns: minmax(140px, 170px) minmax(150px, 180px);
  gap: 10px;
  align-items: start;
  min-width: 0;
}

.tasks-form-head-field {
  min-width: 0;
  padding: 8px 9px;
  border: 1px solid color-mix(in srgb, var(--brand-blue) 14%, var(--border));
  border-radius: 9px;
  background: var(--fs-color-surface);
}

.tasks-form-head-field input {
  min-height: 36px;
}

.tasks-edit-layout {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  min-width: 0;
}

.tasks-form-block {
  display: grid;
  gap: 9px;
  min-width: 0;
  padding: 10px;
  border: 1px solid color-mix(in srgb, var(--brand-blue) 14%, var(--border));
  border-radius: 10px;
  background: color-mix(in srgb, var(--brand-blue) 3%, #fff);
}

.tasks-form-two-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.tasks-edit-form .fs-field textarea {
  min-height: 72px;
  resize: vertical;
}

.tasks-comment-form {
  display: grid;
  gap: 10px;
  padding: 10px;
  border: 1px solid color-mix(in srgb, var(--brand-blue) 14%, var(--border));
  border-radius: 10px;
  background: color-mix(in srgb, var(--brand-blue) 4%, #fff);
}

.tasks-comment-form .fs-field textarea {
  min-height: 76px;
  resize: vertical;
}

.tasks-comments-list {
  display: grid;
  gap: 8px;
}

.tasks-edit-form__actions {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.tasks-edit-form__actions .btn {
  flex: 0 0 auto;
  width: auto;
  max-width: max-content;
  padding-left: 18px;
  padding-right: 18px;
}

.tasks-edit-form__actions .tasks-error {
  flex: 1 1 260px;
}

.tasks-edit-quick-fields {
  display: grid;
  grid-template-columns: minmax(220px, 1.4fr) minmax(150px, 0.65fr) minmax(110px, 0.45fr);
  gap: 10px;
  align-items: end;
  padding: 10px;
  border: 1px solid color-mix(in srgb, var(--brand-blue) 18%, var(--border));
  border-radius: 11px;
  background: color-mix(in srgb, #fff 96%, var(--brand-blue));
}

.tasks-edit-main-fields,
.tasks-edit-dates {
  display: grid;
  gap: 11px;
  min-width: 0;
}

.tasks-edit-dates {
  padding: 12px;
  border: 1px solid var(--border);
  border-radius: 11px;
  background: var(--fs-color-surface);
}

.tasks-edit-main-fields .fs-field textarea {
  min-height: 118px;
}

.tasks-edit-targets-section .tasks-detail-targets {
  gap: 12px;
}

.tasks-edit-targets-section .tasks-detail-target {
  padding: 0;
  gap: 0;
  grid-template-columns: minmax(0, 1fr);
  overflow: hidden;
  background: var(--fs-color-surface);
}

.tasks-edit-targets-section .tasks-target__head {
  grid-template-columns: auto minmax(0, 1fr);
  align-content: center;
  justify-items: stretch;
  padding: 9px 11px;
  border-bottom: 1px solid var(--border);
  background: color-mix(in srgb, var(--brand-blue) 4%, #fff);
}

.tasks-edit-targets-section .tasks-target__body {
  padding: 11px;
}

.tasks-edit-targets-section .tasks-target__criteria {
  gap: 10px;
}

.tasks-edit-targets-section .tasks-target__criteria > label:has(.hierarchy-selection-control) {
  grid-column: auto;
}

.tasks-edit-targets-section .hierarchy-selection-control {
  height: 100%;
  border-color: var(--rw-color-border-subtle, var(--border));
  background: var(--rw-color-surface-subtle, var(--fs-color-surface-subtle));
}

.tasks-section-hint {
  color: var(--rw-color-text-secondary);
  font-size: 11px;
  font-weight: 700;
}

.tasks-edit-columns {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(300px, 0.65fr);
  gap: 12px;
  align-items: start;
}

.tasks-edit-side {
  display: grid;
  gap: 12px;
}

.tasks-edit-panel {
  display: grid;
  gap: 11px;
  padding: 13px;
  border: 1px solid var(--border);
  border-radius: 11px;
  background: var(--fs-color-surface);
}

.tasks-form-three-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.tasks-edit-targets-section {
  padding-top: 6px;
  border-top: 1px solid var(--border);
}

.tasks-target__summary-title {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--brand-dark);
  font-weight: 700;
}

@media (max-width: 980px) {
  .tasks-edit-quick-fields {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .tasks-edit-assignee-field {
    grid-column: 1 / -1;
  }

  .tasks-edit-columns,
  .tasks-form-three-grid {
    grid-template-columns: minmax(0, 1fr);
  }
}

@media (max-width: 560px) {
  .tasks-edit-quick-fields,
  .tasks-form-two-grid,
  .tasks-edit-targets-section .tasks-target__criteria {
    grid-template-columns: minmax(0, 1fr);
  }

}

.tasks-detail-targets {
  display: grid;
  gap: 10px;
}

.tasks-detail-target {
  display: grid;
  gap: 10px;
  padding: 10px;
  border: 1px solid color-mix(in srgb, var(--brand-blue) 18%, var(--border));
  border-radius: 10px;
  background: color-mix(in srgb, var(--brand-blue) 3%, #fff);
}

.tasks-detail-target__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  color: var(--brand-blue-dark);
  font-size: 14px;
}

.tasks-detail-target__grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.tasks-detail-target__meta {
  display: grid;
  gap: 3px;
  min-width: 0;
  padding: 8px 10px;
  border: 1px dashed color-mix(in srgb, var(--brand-blue) 18%, var(--border));
  border-radius: 8px;
  background: var(--fs-color-surface);
}

.tasks-detail-verification {
  padding: 10px;
  border: 1px solid var(--fs-color-primary-line);
  border-radius: 10px;
  background: var(--fs-color-border-subtle);
}

.tasks-detail-verification p {
  margin: 0;
  color: var(--fs-color-primary-hover);
  font-size: 13px;
  line-height: 1.35;
  font-weight: 700;
}

.tasks-record {
  display: grid;
  gap: 6px;
  padding: 9px 10px;
  border: 1px solid color-mix(in srgb, var(--brand-blue) 16%, var(--border));
  border-radius: 10px;
  background: var(--fs-color-surface);
}

/* Compact task list layout mirrors current request cards: content, progress, actions. */
.tasks-panel-list .tasks-list-head {
  display: none;
}

.tasks-list {
  gap: 10px;
}

.tasks-card__summary {
  grid-template-columns: minmax(0, 1fr) minmax(160px, 220px) 92px;
  grid-template-areas:
    "main progress actions"
    "assignee progress actions"
    "effort progress actions";
  gap: 8px 12px;
  align-items: center;
  padding: 10px 12px;
}

.tasks-card__main {
  grid-area: main;
  padding: 0;
}

.tasks-card__type-panel {
  display: none;
}

.tasks-card__assignee-panel {
  grid-area: assignee;
}

.tasks-card__effort-panel {
  grid-area: effort;
}

.tasks-card__assignee-panel,
.tasks-card__effort-panel {
  display: flex;
  align-items: center;
  gap: 7px;
  min-height: 0;
  padding: 0;
  border-left: 0;
}

.tasks-card__assignee-panel > span,
.tasks-card__effort-panel > span {
  flex: 0 0 auto;
  font-size: var(--fs-text-xs);
}

.tasks-card__assignee-panel strong,
.tasks-card__effort-panel strong {
  font-size: 12px;
}

.tasks-card__progress-panel {
  grid-area: progress;
  min-height: 0;
  padding: 0 0 0 12px;
  border-left: 1px dashed color-mix(in srgb, var(--task-card-border) 72%, var(--border));
}

.tasks-card__actions {
  grid-area: actions;
  align-self: stretch;
  justify-content: flex-end;
  padding-left: 12px;
}

.tasks-card__number-line {
  gap: 6px;
}

.tasks-card__title {
  gap: 0;
}

.tasks-card__title strong {
  font-size: 14px;
  line-height: 1.25;
}

.tasks-card__type-badge {
  border-color: color-mix(in srgb, var(--task-card-accent) 30%, var(--fs-color-primary-line));
  background: color-mix(in srgb, var(--task-card-accent) 11%, #fff);
  color: var(--task-card-color);
}

.tasks-card__details {
  padding: 12px;
}

@media (max-width: 1120px) {
  .tasks-filter-panel__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .tasks-list-head {
    display: none;
  }

  .tasks-card__summary {
    grid-template-columns: minmax(0, 1.2fr) minmax(140px, 0.56fr) minmax(112px, 0.42fr) minmax(150px, 0.68fr) 88px;
  }

  .tasks-card__progress-panel {
    grid-column: 1 / 5;
  }

  .tasks-card__actions {
    grid-column: 5;
    grid-row: 1 / 3;
    align-self: center;
  }

  .tasks-card__progress-panel {
    border-left: 0;
    border-top: 1px dashed color-mix(in srgb, var(--task-card-border) 72%, var(--border));
    padding-top: 9px;
  }
}

@media (max-width: 900px) {

  .tasks-list-head {
    display: none;
  }

  .tasks-panel-list {
    overflow-x: visible;
  }

  .tasks-filter-panel__grid,
  .tasks-filter-panel__folder-grid,
  .tasks-card__summary,
  .tasks-card__details-row,
  .tasks-card__meta-grid,
  .tasks-card-target__grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .tasks-card__summary {
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas:
      "main actions"
      "assignee assignee"
      "effort effort"
      "progress progress";
    gap: 8px;
    align-items: start;
    padding: 9px;
  }

  .tasks-card__main {
    grid-area: main;
    padding: 0;
  }

  .tasks-card__assignee-panel {
    grid-area: assignee;
  }

  .tasks-card__effort-panel {
    grid-area: effort;
  }

  .tasks-card__progress-panel {
    grid-area: progress;
    grid-column: auto;
  }

  .tasks-card__actions {
    grid-area: actions;
    grid-column: auto;
    grid-row: auto;
    align-self: start;
    justify-content: flex-end;
    gap: 5px;
    border: 0;
    padding: 0;
  }

  .tasks-card__inner-panel {
    min-height: 0;
    border-left: 0;
    border-top: 1px dashed color-mix(in srgb, var(--task-card-border) 72%, var(--border));
    padding: 8px 0 0;
  }

  .tasks-card__type-panel,
  .tasks-card__assignee-panel,
  .tasks-card__effort-panel {
    grid-template-columns: 92px minmax(0, 1fr);
    align-items: center;
  }

  .tasks-card__inner-panel > span,
  .tasks-card__meta-item span {
    font-size: var(--fs-text-xs);
  }

  .tasks-card__inner-panel strong,
  .tasks-card__meta-item strong {
    font-size: 12px;
  }

  .tasks-card__number-line {
    gap: 6px;
  }

  .tasks-card__created {
    flex: 1 1 100%;
  }

  .tasks-card__title strong {
    font-size: 13px;
    line-height: 1.2;
  }

  .tasks-card__title span {
    font-size: 10.5px;
    line-height: 1.2;
  }

  .tasks-progress-bar__head,
  .tasks-progress-bar__meta {
    font-size: var(--fs-text-xs);
  }

  .tasks-card__details {
    padding: 8px;
  }

  .tasks-card__meta-grid {
    gap: 0;
  }

  .tasks-card__meta-item {
    padding: 6px 0;
    border-bottom: 1px dashed color-mix(in srgb, var(--task-card-border) 55%, transparent);
  }

  .tasks-card__meta-item:last-child {
    border-bottom: 0;
  }

  .tasks-status-filter-wrap {
    min-width: 0;
    width: 100%;
  }

  .tasks-status-toolbar {
    padding: 10px;
  }

  .tasks-filter-panel__summary {
    min-height: 36px;
    padding: 8px 10px;
  }

  .tasks-filter-panel__grid {
    gap: 8px;
    padding: 0;
  }

  .tasks-panel-list {
    padding: 8px;
  }

  .tasks-card {
    border-radius: 10px;
  }

  .tasks-detail-hero,
  .tasks-detail-summary,
  .tasks-detail-target__grid,
  .tasks-create-general-grid,
  .tasks-create-general-grid--ordered,
  .tasks-edit-layout,
  .tasks-form-two-grid,
  .tasks-target,
  .tasks-target__body,
  .tasks-target__criteria {
    grid-template-columns: minmax(0, 1fr);
  }

  .tasks-form-section-head {
    display: grid;
  }

  .tasks-form-head-fields {
    grid-template-columns: minmax(0, 1fr);
    width: 100%;
  }

  .tasks-detail-hero__meta,
  .tasks-detail-date {
    justify-items: start;
  }

  .tasks-target__head {
    grid-template-columns: auto auto;
    justify-content: space-between;
    justify-items: start;
  }
}

/* Final task list override: keep cards compact after all responsive rules. */
.tasks-panel-list .tasks-list-head {
  display: none;
}

.tasks-panel-list .tasks-card__summary {
  grid-template-columns: minmax(0, 1fr) minmax(150px, 210px) auto;
  grid-template-areas:
    "main progress actions"
    "assignee progress actions"
    "effort progress actions";
  gap: 7px 12px;
  align-items: center;
  padding: 10px 12px;
}

.tasks-panel-list .tasks-card__main {
  grid-area: main;
  padding: 0;
}

.tasks-panel-list .tasks-card__type-panel {
  display: none;
}

.tasks-panel-list .tasks-card__assignee-panel {
  grid-area: assignee;
}

.tasks-panel-list .tasks-card__effort-panel {
  grid-area: effort;
}

.tasks-panel-list .tasks-card__assignee-panel,
.tasks-panel-list .tasks-card__effort-panel {
  display: flex;
  align-items: center;
  gap: 7px;
  min-height: 0;
  padding: 0;
  border: 0;
}

.tasks-panel-list .tasks-card__progress-panel {
  grid-area: progress;
  grid-column: auto;
  min-height: 0;
  padding: 0 0 0 12px;
  border-top: 0;
  border-left: 1px dashed color-mix(in srgb, var(--task-card-border) 72%, var(--border));
}

.tasks-panel-list .tasks-card__actions {
  grid-area: actions;
  grid-column: auto;
  grid-row: auto;
  align-self: center;
  justify-content: flex-end;
  width: 76px;
  padding-left: 8px;
  border-left: 1px dashed color-mix(in srgb, var(--task-card-border) 72%, var(--border));
}

@media (max-width: 760px) {
  .tasks-panel-list .tasks-card__summary {
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas:
      "main actions"
      "assignee assignee"
      "effort effort"
      "progress progress";
  }

  .tasks-panel-list .tasks-card__progress-panel {
    padding: 8px 0 0;
    border-left: 0;
    border-top: 1px dashed color-mix(in srgb, var(--task-card-border) 72%, var(--border));
  }

  .tasks-panel-list .tasks-card__actions {
    width: auto;
    border-left: 0;
    padding-left: 0;
  }

}

.tasks-page {
  gap: var(--fs-page-gap);
}

.tasks-page > .card,
.tasks-page .nomenclature-form-page__card {
  border-color: var(--rw-color-border-subtle);
  border-radius: var(--rw-radius-lg);
  box-shadow: none;
}

.tasks-page > .nomenclature-requests__header {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 56px;
  padding: 9px 12px;
  background: var(--rw-color-surface);
  border-radius: var(--rw-radius-md);
}

.tasks-page > .nomenclature-requests__header .heading--underlined {
  display: flex;
  flex: 1 1 auto;
  align-items: center;
  gap: 8px;
  min-width: 0;
  width: auto;
  color: var(--rw-color-text);
  border: 0;
  font-size: 18px;
  font-weight: 700;
  line-height: 1.25;
}

.tasks-page > .nomenclature-requests__header .heading--underlined span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tasks-page > .nomenclature-requests__header .page-heading__nav-icon {
  width: 22px;
  height: 22px;
}

.tasks-page > .nomenclature-requests__header .nomenclature-badge {
  flex: 0 0 auto;
}

.tasks-page > .nomenclature-requests__header .nomenclature-requests__header-actions {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 8px;
}

#taskDetailsPage > .nomenclature-request-form-header {
  border-color: color-mix(in srgb, var(--rw-color-primary) 16%, var(--rw-color-border-subtle));
  background: color-mix(in srgb, var(--rw-color-surface) 94%, var(--rw-palette-27));
  box-shadow: none;
  isolation: isolate;
}

.tasks-page .colored-select__button {
  border-radius: var(--rw-radius-md);
}

.tasks-page .nomenclature-modal__section,
.tasks-page .tasks-edit-panel,
.tasks-page .tasks-form-head-field,
.tasks-page .tasks-target,
.tasks-page .tasks-detail-target,
.tasks-page .tasks-selection-control,
.tasks-page .hierarchy-picker-selection {
  border-color: var(--rw-color-border-subtle);
  border-radius: var(--rw-radius-md);
}

.tasks-page .tasks-edit-panel,
.tasks-page .tasks-form-head-field {
  background: var(--rw-color-surface-subtle);
}

.tasks-page .tasks-create-form,
.tasks-page .tasks-details {
  padding: 12px;
  background: var(--rw-color-surface);
}

.tasks-page .tasks-target,
.tasks-page .tasks-detail-target {
  background: var(--rw-color-surface);
  box-shadow: none;
}

.tasks-page .tasks-target__head,
.tasks-page .tasks-detail-target__head {
  background: var(--rw-color-surface-subtle);
  border-radius: var(--rw-radius-sm) var(--rw-radius-sm) 0 0;
}

#taskCreateForm {
  display: grid;
  gap: 0;
  padding: 18px;
}

#taskCreateForm .tasks-create-main-panel {
  padding: 0 0 18px;
  background: transparent;
  border: 0;
  border-bottom: 1px solid var(--rw-color-border-subtle);
  border-radius: 0;
}

#taskCreateForm .tasks-edit-targets-section {
  padding: 18px 0 0;
  background: transparent;
  border: 0;
  border-radius: 0;
}

#taskCreateForm .tasks-form-head-fields {
  gap: 12px;
}

#taskCreateForm .tasks-form-head-field {
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: 0;
}

#taskCreateForm .tasks-create-general-grid {
  gap: 12px;
}

#taskCreateForm .nomenclature-modal__field--required > .label::after {
  color: var(--rw-color-danger);
}

#taskCreateForm .nomenclature-modal__field--required .colored-select__button,
#taskCreateForm .nomenclature-modal__field--required.is-filled .colored-select__button {
  color: var(--rw-color-text);
  background: var(--fs-color-surface-subtle);
  border-color: var(--rw-color-border);
  box-shadow: none;
}

#taskCreateForm .fs-field input:not([type="hidden"]),
#taskCreateForm .fs-field select,
#taskCreateForm .fs-field textarea,
#taskCreateForm .colored-select__button {
  min-height: 42px;
  color: var(--rw-color-text);
  background: var(--fs-color-surface-subtle);
}

#taskCreateForm .fs-field textarea {
  min-height: 88px;
  resize: vertical;
}

#taskCreateForm .fs-field input:not([type="hidden"]):hover,
#taskCreateForm .fs-field select:hover,
#taskCreateForm .fs-field textarea:hover,
#taskCreateForm .colored-select__button:hover {
  border-color: color-mix(in srgb, var(--rw-color-primary) 30%, var(--rw-color-border));
}

#taskCreateForm .nomenclature-modal__field--required input:not([type="hidden"]):focus,
#taskCreateForm .nomenclature-modal__field--required textarea:focus,
#taskCreateForm .nomenclature-modal__field--required .colored-select.is-open .colored-select__button,
#taskCreateForm .fs-field input:not([type="hidden"]):focus,
#taskCreateForm .fs-field select:focus,
#taskCreateForm .fs-field textarea:focus {
  background: var(--rw-color-surface);
  border-color: var(--rw-color-primary);
  box-shadow: var(--rw-focus-ring);
}

#taskCreateForm .fs-field input:not([type="hidden"]):user-invalid,
#taskCreateForm .fs-field select:user-invalid,
#taskCreateForm .fs-field textarea:user-invalid,
#taskCreateForm .fs-field input:not([type="hidden"]).is-invalid,
#taskCreateForm .fs-field select.is-invalid,
#taskCreateForm .fs-field textarea.is-invalid {
  background: var(--rw-color-danger-subtle);
  border-color: var(--rw-color-danger);
  box-shadow: none;
}

#taskCreateForm .tasks-target {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 0;
  padding: 0;
  overflow: hidden;
  background: var(--rw-color-surface);
  border: 1px solid var(--rw-color-border);
  border-radius: var(--rw-radius-md);
  box-shadow: none;
}

#taskCreateForm .tasks-target__head {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 9px;
  padding: 9px 12px;
  background: var(--rw-color-surface-subtle);
  border-bottom: 1px solid var(--rw-color-border-subtle);
  border-radius: 0;
}

#taskCreateForm .tasks-target__number {
  width: 28px;
  height: 28px;
  color: var(--rw-color-primary-hover);
  background: var(--rw-color-primary-subtle);
  border-color: transparent;
  border-radius: var(--rw-radius-sm);
}

#taskCreateForm .tasks-target__caption {
  color: var(--rw-color-text);
  font-size: 13px;
  font-weight: 700;
}

#taskCreateForm .tasks-target__remove {
  margin-left: auto;
}

#taskCreateForm .tasks-target__body {
  gap: 12px;
  padding: 14px;
}

#taskCreateForm .tasks-target__criteria {
  gap: 12px;
}

#taskCreateForm .tasks-target__body > .nomenclature-modal__field,
#taskCreateForm .tasks-target__criteria > .nomenclature-modal__field {
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: 0;
}

#taskCreateForm .tasks-target .fs-field input:not([type="hidden"]),
#taskCreateForm .tasks-target .fs-field select {
  height: 42px;
}

#taskCreateForm .tasks-target .fs-field textarea {
  height: auto;
}

#taskCreateForm .nomenclature-modal__actions {
  margin-top: 18px;
  padding-top: 14px;
  border-top: 1px solid var(--rw-color-border-subtle);
}

#taskDetailsPage .tasks-details {
  padding: 16px;
}

#taskEditForm {
  gap: 18px;
}

#taskEditForm .tasks-edit-quick-fields {
  gap: 12px;
  padding: 12px;
  background: var(--rw-color-surface-subtle);
  border: 1px solid var(--rw-color-border-subtle);
  border-radius: var(--rw-radius-md);
}

#taskEditForm .tasks-edit-columns {
  gap: 16px;
}

#taskEditForm .tasks-edit-main-fields,
#taskEditForm .tasks-edit-side {
  gap: 12px;
}

#taskEditForm .fs-field input:not([type="hidden"]),
#taskEditForm .fs-field select,
#taskEditForm .fs-field textarea,
#taskEditForm .colored-select__button {
  min-height: 42px;
  color: var(--rw-color-text);
  background: var(--fs-color-surface-subtle);
}

#taskEditForm .fs-field input:not([type="hidden"]):hover,
#taskEditForm .fs-field select:hover,
#taskEditForm .fs-field textarea:hover,
#taskEditForm .colored-select__button:hover {
  border-color: color-mix(in srgb, var(--rw-color-primary) 30%, var(--rw-color-border));
}

#taskEditForm .fs-field input:not([type="hidden"]):focus,
#taskEditForm .fs-field select:focus,
#taskEditForm .fs-field textarea:focus,
#taskEditForm .colored-select.is-open .colored-select__button {
  background: var(--rw-color-surface);
  border-color: var(--rw-color-primary);
  box-shadow: var(--rw-focus-ring);
}

#taskEditForm .tasks-edit-dates {
  padding: 12px;
  background: var(--rw-color-surface-subtle);
  border-color: var(--rw-color-border-subtle);
  border-radius: var(--rw-radius-md);
}

#taskEditForm .tasks-edit-targets-section {
  padding-top: 18px;
  border-color: var(--rw-color-border-subtle);
}

#taskEditForm .tasks-detail-target {
  overflow: hidden;
  background: var(--rw-color-surface);
  border: 1px solid var(--rw-color-border);
  border-radius: var(--rw-radius-md);
  box-shadow: none;
}

#taskEditForm .tasks-target__head {
  padding: 10px 12px;
  background: var(--rw-color-surface-subtle);
  border-color: var(--rw-color-border-subtle);
}

#taskEditForm .tasks-target__body {
  gap: 12px;
  padding: 14px;
}

#taskEditForm .tasks-target__body > .nomenclature-modal__field,
#taskEditForm .tasks-target__criteria > .nomenclature-modal__field {
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: 0;
}

.tasks-page--redwood .tasks-card {
  transition: border-color 0.14s ease, box-shadow 0.14s ease;
}

.tasks-page--redwood .tasks-card:hover {
  border-color: var(--rw-color-border);
  box-shadow: none;
}

@media (max-width: 760px) {
  #taskCreateForm {
    padding: 12px;
  }

  #taskCreateForm .tasks-form-section-head,
  #taskCreateForm .tasks-form-head-fields,
  #taskCreateForm .tasks-create-general-grid,
  #taskCreateForm .tasks-target__criteria {
    grid-template-columns: minmax(0, 1fr);
  }

  #taskCreateForm .tasks-form-head-fields {
    width: 100%;
  }

  #taskCreateForm .tasks-target__body {
    padding: 12px;
  }

  #taskDetailsPage .tasks-details {
    padding: 10px;
  }

  #taskEditForm .tasks-edit-quick-fields,
  #taskEditForm .tasks-edit-dates,
  #taskEditForm .tasks-target__body {
    padding: 10px;
  }
}

/* Task list details separate operational facts from system-maintained timestamps for faster scanning. */
.tasks-page--redwood .tasks-card__summary {
  grid-template-columns: minmax(0, 1fr) minmax(170px, 220px) 92px;
  grid-template-areas:
    "main progress actions"
    "assignee progress actions";
}

.tasks-page--redwood .tasks-card__effort-badge {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  min-height: 22px;
  padding: 3px 8px;
  border: 1px solid color-mix(in srgb, var(--rw-palette-12) 34%, var(--rw-color-border-subtle));
  border-radius: 999px;
  background: color-mix(in srgb, var(--rw-palette-27) 38%, white);
  color: var(--rw-palette-42);
  font-size: 11px;
  line-height: 1;
  font-weight: 600;
}

.tasks-page--redwood .tasks-card__effort-badge img,
.tasks-page--redwood .tasks-card__assignee-panel img {
  width: 15px;
  height: 15px;
  opacity: 0.72;
}

.tasks-page--redwood .tasks-card__assignee-panel {
  display: grid;
  grid-template-columns: 18px auto minmax(0, 1fr);
  gap: 7px;
}

.tasks-page--redwood .tasks-card__overview {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  align-items: stretch;
}

.tasks-page--redwood .tasks-card__info-panel {
  display: grid;
  gap: 7px;
  align-content: start;
  min-width: 0;
  padding: 10px;
  border: 1px solid var(--rw-color-border-subtle);
  border-radius: var(--rw-radius-sm);
  background: var(--rw-color-surface-subtle);
}

.tasks-page--redwood .tasks-card__info-title {
  display: flex;
  align-items: center;
  gap: 7px;
  min-height: 22px;
  padding: 0 2px 4px;
  border-bottom: 1px solid var(--rw-color-border-subtle);
  color: var(--rw-color-text-secondary);
  font-size: var(--fs-text-xs);
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.tasks-page--redwood .tasks-card__info-title img {
  width: 16px;
  height: 16px;
  opacity: 0.68;
}

.tasks-page--redwood .tasks-card__info-items {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.tasks-page--redwood .tasks-card__info-panel .tasks-card__meta-item {
  grid-template-columns: 24px minmax(0, 1fr);
  padding: 6px 7px;
  border: 0;
  background: transparent;
}

.tasks-page--redwood .tasks-card__info-panel .tasks-card__meta-item > img {
  width: 16px;
  height: 16px;
  padding: 4px;
  background: var(--rw-color-surface);
}

.tasks-page--redwood .tasks-card__info-panel--dates {
  border-color: color-mix(in srgb, var(--rw-color-primary) 22%, var(--rw-color-border-subtle));
  background: color-mix(in srgb, var(--rw-color-primary-subtle) 22%, white);
}

.tasks-page--redwood .tasks-card__info-panel--system {
  background: color-mix(in srgb, var(--rw-color-surface-subtle) 86%, var(--rw-palette-27));
}

.tasks-page--redwood .tasks-card__panel-empty {
  padding: 8px;
  color: var(--rw-color-text-secondary);
  font-size: 11px;
}

.tasks-page--redwood .tasks-card__business-info {
  display: grid;
  gap: 10px;
  min-width: 0;
}

.tasks-page--redwood .tasks-card__date-strip,
.tasks-page--redwood .tasks-card__metric-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.tasks-page--redwood .tasks-card__meta-item {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  gap: 8px;
  align-items: center;
  min-width: 0;
  padding: 8px 10px;
  border: 1px solid var(--rw-color-border-subtle);
  border-radius: var(--rw-radius-sm);
  background: var(--rw-color-surface);
}

.tasks-page--redwood .tasks-card__meta-item > img {
  width: 18px;
  height: 18px;
  padding: 5px;
  border-radius: 8px;
  box-sizing: content-box;
  background: var(--rw-color-primary-subtle);
  opacity: 0.76;
}

.tasks-page--redwood .tasks-card__meta-item > div {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.tasks-page--redwood .tasks-card__meta-item--date {
  border-color: color-mix(in srgb, var(--rw-color-primary) 24%, var(--rw-color-border-subtle));
  background: color-mix(in srgb, var(--rw-color-primary-subtle) 34%, white);
}

.tasks-page--redwood .tasks-card__meta-item--date > img {
  background: var(--rw-color-surface);
}

.tasks-page--redwood .tasks-card__system-panel {
  display: grid;
  gap: 7px;
  align-content: start;
  padding: 10px;
  border: 1px solid var(--rw-color-border-subtle);
  border-radius: var(--rw-radius-sm);
  background: var(--rw-color-surface-subtle);
}

.tasks-page--redwood .tasks-card__system-title {
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 0 2px 4px;
  color: var(--rw-color-text-secondary);
  font-size: var(--fs-text-xs);
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.tasks-page--redwood .tasks-card__system-title img {
  width: 16px;
  height: 16px;
  opacity: 0.65;
}

.tasks-page--redwood .tasks-card__meta-item--system {
  grid-template-columns: 24px minmax(0, 1fr);
  padding: 6px 7px;
  border: 0;
  background: transparent;
}

.tasks-page--redwood .tasks-card__meta-item--system > img {
  width: 16px;
  height: 16px;
  padding: 4px;
  background: var(--rw-color-surface);
}

.tasks-page--redwood .tasks-card-target {
  gap: 8px;
  padding: 10px;
  border: 1px solid var(--rw-color-border-subtle);
  border-radius: var(--rw-radius-sm);
  background: var(--rw-color-surface);
}

.tasks-page--redwood .tasks-card-target:first-child {
  padding-top: 10px;
  border-top: 1px solid var(--rw-color-border-subtle);
}

.tasks-page--redwood .tasks-card-target__head {
  align-items: center;
}

.tasks-page--redwood .tasks-card-target__identity {
  display: flex;
  align-items: center;
  gap: 9px;
  min-width: 0;
}

.tasks-page--redwood .tasks-card-target__index {
  display: inline-grid;
  place-items: center;
  flex: 0 0 28px;
  width: 28px;
  height: 28px;
  border-radius: 9px;
  background: color-mix(in srgb, var(--rw-palette-27) 54%, white);
  color: var(--rw-palette-42);
  font-size: 12px;
  font-weight: 700;
}

.tasks-page--redwood .tasks-card-target__head strong {
  color: var(--rw-palette-42);
  font-size: 14px;
}

.tasks-page--redwood .tasks-card-target__progress {
  flex: 0 1 320px;
  margin-left: auto;
}

.tasks-page--redwood .tasks-card-target__grid {
  gap: 8px;
}

.tasks-page--redwood .tasks-card-target__content {
  display: grid;
  grid-template-columns: minmax(220px, 0.8fr) minmax(0, 1.4fr);
  gap: 10px;
  min-width: 0;
}

.tasks-page--redwood .tasks-card-target__content .tasks-card__info-panel {
  padding: 9px;
  background: var(--rw-color-surface-subtle);
}

.tasks-page--redwood .tasks-card-target__comments,
.tasks-page--redwood .tasks-card__comments {
  min-width: 0;
}

.tasks-page--redwood .tasks-card__details {
  gap: 8px;
}

.tasks-page--redwood .tasks-card__comments {
  margin-top: 0;
}

.tasks-page--redwood .tasks-card-target__comments {
  padding-top: 0;
}

.tasks-page--redwood .tasks-card__comments .comments-component__section,
.tasks-page--redwood .tasks-card-target__comments .comments-component__section {
  border-radius: 2px;
}

.tasks-page--redwood .tasks-card-target__grid .tasks-card__meta-item {
  align-items: start;
  padding: 8px;
  background: var(--rw-color-surface-subtle);
}

.tasks-page--redwood .tasks-card__meta-item--selection {
  grid-column: span 2;
}

@media (max-width: 980px) {
  .tasks-page--redwood .tasks-card__overview {
    grid-template-columns: minmax(0, 1fr);
  }

  .tasks-page--redwood .tasks-card-target__content {
    grid-template-columns: minmax(0, 1fr);
  }

  .tasks-page--redwood .tasks-card__system-panel {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .tasks-page--redwood .tasks-card__system-title {
    grid-column: 1 / -1;
  }
}

@media (max-width: 700px) {
  .tasks-page--redwood .tasks-card__summary {
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas:
      "main actions"
      "assignee assignee"
      "progress progress";
  }

  .tasks-page--redwood .tasks-card__date-strip,
  .tasks-page--redwood .tasks-card__metric-grid,
  .tasks-page--redwood .tasks-card__system-panel {
    grid-template-columns: minmax(0, 1fr);
  }

  .tasks-page--redwood .tasks-card__system-title {
    grid-column: auto;
  }

  .tasks-page--redwood .tasks-card-target__head {
    align-items: flex-start;
    flex-direction: column;
  }

  .tasks-page--redwood .tasks-card-target__progress {
    flex: 0 0 auto;
    width: 100%;
    margin-left: 0;
  }

  .tasks-page--redwood .tasks-card__meta-item--selection {
    grid-column: auto;
  }
}

.tasks-page--redwood .tasks-panel-list {
  padding: 10px;
  background: var(--rw-color-surface-subtle);
  border-radius: var(--rw-radius-md);
}

.tasks-page--redwood .tasks-status-toolbar {
  gap: 8px;
  padding: 8px 10px;
}

.tasks-page--redwood .tasks-filter-panel {
  gap: 0;
  margin-bottom: 0;
  padding: 0;
  background: var(--fs-color-panel-filter);
}

.tasks-page--redwood .tasks-filter-panel__summary {
  min-height: 36px;
  padding: 5px 10px;
}

.tasks-page--redwood .tasks-filter-panel__grid,
.tasks-page--redwood .tasks-filter-panel__folder-grid {
  padding: 10px;
}

.tasks-page--redwood .tasks-filter-panel__folder-grid {
  padding-top: 0;
}

.tasks-page--redwood .tasks-filter-panel .fs-field input,
.tasks-page--redwood .tasks-filter-panel .fs-field select {
  min-height: var(--rw-control-height);
  color: var(--rw-color-text);
  background-color: var(--fs-color-field);
  border: 1px solid var(--rw-color-border);
  border-radius: var(--rw-radius-sm);
}

.tasks-page--redwood .tasks-filter-panel .fs-field select {
  padding-right: 38px;
  appearance: none;
  background-image: url("/stoneware/icons/chevron.svg");
  background-repeat: no-repeat;
  background-position: right 12px center;
  background-size: 16px;
}

.tasks-page--redwood .tasks-filter-panel .fs-field input:hover,
.tasks-page--redwood .tasks-filter-panel .fs-field select:hover {
  border-color: color-mix(in srgb, var(--rw-color-primary) 32%, var(--rw-color-border));
}

.tasks-page--redwood .tasks-filter-panel .fs-field input:focus,
.tasks-page--redwood .tasks-filter-panel .fs-field select:focus {
  border-color: var(--rw-color-primary);
  box-shadow: var(--rw-focus-ring);
}

.tasks-page--redwood .nomenclature-requests__quick-actions {
  min-height: 36px;
}

.tasks-page--redwood .tasks-group__header {
  border-radius: var(--rw-radius-sm);
}

.tasks-page--redwood .tasks-card {
  --task-card-bg: var(--rw-color-surface);
  --task-card-body-bg: var(--rw-color-surface);
  --task-card-border: var(--rw-color-border-subtle);
  border: 1px solid var(--rw-color-border-subtle);
  border-left: 1px solid var(--rw-color-border-subtle);
  border-radius: var(--rw-radius-sm);
  box-shadow: none;
}

.tasks-page--redwood .tasks-card--forming,
.tasks-page--redwood .tasks-card--cancelled {
  --task-card-color: var(--fs-color-text-secondary);
  --task-card-accent: var(--fs-color-text-muted);
}

.tasks-page--redwood .tasks-card--active {
  --task-card-color: var(--fs-color-primary-text);
  --task-card-accent: var(--fs-color-primary);
}

.tasks-page--redwood .tasks-card--completed {
  --task-card-color: var(--fs-color-success-text);
  --task-card-accent: var(--fs-color-success);
}

.tasks-page--redwood .tasks-card--overdue {
  --task-card-color: var(--fs-color-danger-text);
  --task-card-accent: var(--fs-color-danger);
}

.tasks-page--redwood .tasks-priority--low {
  color: var(--rw-palette-34);
  background: var(--rw-color-success-subtle);
}

.tasks-page--redwood .tasks-priority--normal {
  color: var(--rw-color-primary-hover);
  background: var(--rw-color-primary-subtle);
}

.tasks-page--redwood .tasks-priority--high {
  color: var(--rw-palette-39);
  background: var(--rw-color-danger-subtle);
}

.tasks-page--redwood .tasks-card__summary,
.tasks-page--redwood .tasks-card__details {
  background: var(--task-card-bg);
}

.tasks-page--redwood .tasks-card__details {
  background: var(--task-card-body-bg);
}

.tasks-page--redwood .tasks-card__inner-panel,
.tasks-page--redwood .tasks-card__actions,
.tasks-page--redwood .tasks-card__progress-panel,
.tasks-page--redwood .tasks-card__details,
.tasks-page--redwood .tasks-card-target {
  border-color: var(--rw-color-border-subtle);
}

.tasks-page .tasks-target,
.tasks-page .tasks-detail-target,
.tasks-page--redwood .tasks-card-target {
  background-color: var(--rw-color-surface);
  background-image:
    linear-gradient(rgba(255, 255, 255, 0.62), rgba(255, 255, 255, 0.62)),
    url("/stoneware/backgrounds/shapes-background.png"),
    linear-gradient(var(--rw-color-surface), var(--rw-color-surface));
  background-position: center;
  background-repeat: no-repeat, repeat, no-repeat;
  background-size: 100% 100%, 526px 526px, 100% 100%;
}

.tasks-page .tasks-detail-hero {
  border-color: var(--rw-color-border-subtle);
}

.tasks-page .tasks-detail-date {
  border-color: var(--rw-color-border-subtle);
  border-radius: var(--rw-radius-sm);
  background: var(--rw-color-surface-subtle);
}

.tasks-page .tasks-detail-summary {
  gap: 1px;
  overflow: hidden;
  border: 1px solid var(--rw-color-border-subtle);
  border-radius: var(--rw-radius-sm);
  background: var(--rw-color-border-subtle);
}

.tasks-page .tasks-detail-summary__item {
  --detail-icon-color: var(--rw-color-primary);
  --detail-icon-bg: var(--rw-color-primary-subtle);
  --detail-icon-border: transparent;
  min-height: 60px;
  background: var(--rw-color-surface-subtle);
  border: 0;
  border-radius: 0;
}

.tasks-page .tasks-detail-summary__item--quantity {
  --detail-icon-color: var(--rw-color-info);
  --detail-icon-bg: var(--rw-color-info-subtle);
}

.tasks-page .tasks-detail-summary__item--amount {
  --detail-icon-color: var(--rw-color-success);
  --detail-icon-bg: var(--rw-color-success-subtle);
}

@media (max-width: 760px) {

  .tasks-page > .nomenclature-requests__header {
    align-items: flex-start;
    flex-wrap: wrap;
  }

  .tasks-page > .nomenclature-requests__header .heading--underlined {
    flex-basis: calc(100% - 44px);
  }

  .tasks-page > .nomenclature-requests__header .heading--underlined span {
    white-space: normal;
  }

  .tasks-page > .nomenclature-requests__header .nomenclature-requests__header-actions {
    width: 100%;
    justify-content: flex-start;
    gap: 6px;
    overflow-x: auto;
    padding-bottom: 2px;
    scrollbar-width: thin;
  }

  .tasks-page > .nomenclature-requests__header .nomenclature-requests__header-actions > * {
    flex: 0 0 auto;
  }

  .tasks-page--redwood .tasks-card__overview {
    gap: 8px;
  }

  .tasks-page--redwood .tasks-card__info-panel {
    gap: 5px;
    padding: 8px;
  }

  .tasks-page--redwood .tasks-card__info-items {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 4px;
  }

  .tasks-page--redwood .tasks-card__info-panel .tasks-card__meta-item {
    grid-template-columns: 20px minmax(0, 1fr);
    gap: 5px;
    padding: 5px;
  }

  .tasks-page--redwood .tasks-card__info-panel .tasks-card__meta-item > img {
    width: 14px;
    height: 14px;
    padding: 3px;
  }

  .tasks-page--redwood .tasks-card-target {
    gap: 7px;
    padding: 8px;
  }

  .tasks-page--redwood .tasks-card-target__identity {
    align-items: flex-start;
  }

  .tasks-page--redwood .tasks-card-target__head strong {
    line-height: 1.25;
  }

  .tasks-page .tasks-detail-summary {
    grid-template-columns: minmax(0, 1fr);
  }
}

#taskDetailsPage > .nomenclature-request-form-header {
  padding-block: 8px;
  border-top: 1px solid var(--rw-color-border-subtle);
}

.tasks-page .tasks-dialog-close {
  position: static;
  flex: 0 0 auto;
  margin: 0;
}

.tasks-page--redwood .tasks-panel-list {
  padding: 12px;
  background: var(--rw-color-surface);
}

.tasks-page--redwood .tasks-card {
  border-left: 2px solid color-mix(in srgb, var(--task-card-accent) 68%, var(--rw-color-border));
  overflow: clip;
  background: var(--rw-color-surface);
}

.tasks-page--redwood .tasks-card__title strong {
  color: var(--rw-color-text);
}

.tasks-page--redwood .tasks-card__code {
  color: var(--task-card-color);
}

.tasks-page--redwood .tasks-card__details {
  border-top-color: color-mix(in srgb, var(--task-card-accent) 18%, var(--rw-color-border-subtle));
}

.tasks-page .tasks-card__toggle-action > .action-button__icon {
  transform: rotate(-90deg);
  transition: transform 0.14s ease;
}

.tasks-page .tasks-card[open] .tasks-card__toggle-action > .action-button__icon {
  transform: rotate(90deg);
}

#taskDetailsPage .tasks-details {
  border: 1px solid var(--rw-color-border-subtle);
  border-radius: var(--rw-radius-md);
  box-shadow: none;
}

#taskEditForm .tasks-edit-main-fields {
  padding: 12px;
  border: 1px solid var(--rw-color-border-subtle);
  border-radius: var(--rw-radius-md);
  background: var(--rw-color-surface-subtle);
}

#taskEditForm .tasks-edit-targets-section > .nomenclature-modal__section-head {
  position: sticky;
  top: 68px;
  z-index: 3;
  padding: 8px 0;
  background: color-mix(in srgb, var(--rw-color-surface) 92%, transparent);
  backdrop-filter: blur(8px);
}

#taskEditForm .tasks-detail-target {
  border-left: 1px solid var(--rw-color-border-subtle);
}

#taskEditForm .tasks-target__head {
  background: color-mix(in srgb, var(--rw-palette-27) 44%, var(--rw-color-surface));
}

.tasks-page .tasks-target,
.tasks-page .tasks-detail-target,
.tasks-page--redwood .tasks-card-target {
  background-position: 0 0, 0 0, 0 0;
}

@media (max-width: 760px) {
  .tasks-page--redwood .tasks-panel-list {
    padding: 6px;
  }

  .tasks-page--redwood .tasks-list,
  .tasks-page--redwood .tasks-group__items {
    gap: 7px;
  }

  .tasks-page--redwood .tasks-card {
    border-left-width: 2px;
  }

  #taskEditForm .tasks-edit-main-fields,
  #taskEditForm .tasks-edit-dates,
  #taskEditForm .tasks-edit-quick-fields {
    padding: 10px;
  }

  #taskEditForm .tasks-edit-targets-section > .nomenclature-modal__section-head {
    top: 60px;
  }
}

.tasks-page--redwood > .nomenclature-requests__header .heading--underlined,
.tasks-page--redwood .tasks-filter-panel__summary,
.tasks-page--redwood .tasks-card__title strong,
.tasks-page--redwood .tasks-card__assignee-panel strong,
.tasks-page--redwood .tasks-card__effort-panel strong {
  font-weight: 600;
}

.tasks-page--redwood .tasks-card__effort-badge,
.tasks-page--redwood .tasks-card__info-title,
.tasks-page--redwood .tasks-card__meta-item span,
.tasks-page--redwood .tasks-card__progress-panel {
  font-weight: 600;
}

/* Canonical Stoneware list page. Legacy task form selectors remain below this boundary only for form parity. */
.tasks-page > .nomenclature-requests__header {
  padding: 4px 14px;
}

.tasks-page .tasks-status-toolbar .fs-panel__body {
  display: grid;
  gap: 12px;
}

.tasks-page .tasks-filter-panel,
.tasks-page .tasks-filter-panel__grid,
.tasks-page .tasks-filter-panel__folder-grid {
  background: transparent;
}

.tasks-page .tasks-filter-panel__grid {
  padding: 0;
}

.tasks-page .tasks-filter-panel__folder-grid {
  margin-top: 12px;
  padding: 0;
}

.tasks-page .nomenclature-requests__quick-actions {
  justify-content: flex-end;
  padding: 0;
}

.tasks-page .tasks-panel-list {
  padding: 0;
  overflow: hidden;
}

.tasks-page .tasks-list,
.tasks-page .tasks-group__items {
  gap: 0;
}

.tasks-page .tasks-list-head,
.tasks-page .tasks-card__summary {
  grid-template-columns:
    minmax(250px, 2fr)
    minmax(150px, 1fr)
    minmax(130px, 0.8fr)
    minmax(150px, 1fr)
    minmax(130px, 0.9fr)
    92px;
}

.tasks-page .tasks-list-head {
  padding: 8px 16px;
}

.tasks-page .tasks-card {
  margin: 0;
  overflow: hidden;
  background: var(--fs-color-surface);
  border: 0;
  border-bottom: 1px solid var(--fs-color-border-subtle);
  border-radius: 0;
  box-shadow: none;
}

.tasks-page .tasks-card:last-child {
  border-bottom: 0;
}

.tasks-page .tasks-card__summary {
  display: grid;
  align-items: center;
  min-height: 70px;
  padding: 9px 16px;
  border: 0;
  list-style: none;
}

.tasks-page .tasks-card__main,
.tasks-page .tasks-card__inner-panel,
.tasks-page .tasks-card__actions {
  min-width: 0;
  padding: 0;
  background: transparent;
  border: 0;
}

.tasks-page .tasks-card__main {
  display: grid;
  gap: 3px;
}

.tasks-page .tasks-card__assignee-panel > img,
.tasks-page .tasks-card__inner-panel > span:first-child {
  display: none;
}

.tasks-page .tasks-card__actions {
  display: flex;
  align-items: center;
}

.tasks-page .tasks-card__inner-panel {
  display: grid;
  align-content: center;
  gap: 4px;
}

.tasks-page .tasks-card__inner-panel > span:first-child {
  color: var(--fs-color-text-muted);
  font-size: var(--fs-text-xs);
}

.tasks-page .tasks-card__status-panel {
  justify-items: start;
}

.tasks-page .tasks-card__progress-panel .tasks-progress-bar__head {
  display: none;
}

.tasks-page .tasks-card__updated-panel strong {
  color: var(--fs-color-text-secondary);
  font-size: var(--fs-text-sm);
  font-weight: 500;
}

.tasks-page .tasks-card__actions {
  justify-content: flex-end;
}

/*
 * An opened task is a selected row: the summary takes the selection colour and
 * the body its quiet member, so the whole record reads as one highlighted thing
 * in the same blue as the active navigation item.
 */
.tasks-page .tasks-card[open] > .tasks-card__summary {
  background: var(--fs-color-selected);
  color: var(--fs-color-selected-text);
}

.tasks-page .tasks-card__details {
  padding: 14px 16px 16px;
  background: var(--fs-color-selected-subtle);
  border-top: 1px solid var(--fs-color-border-subtle);
}

@media (max-width: 1120px) {
  .tasks-page .tasks-list-head,
  .tasks-page .tasks-card__summary {
    grid-template-columns: minmax(220px, 2fr) minmax(140px, 1fr) minmax(120px, 0.8fr) 150px 92px;
  }

  .tasks-page .tasks-list-head > :nth-child(5),
  .tasks-page .tasks-card__updated-panel {
    display: none;
  }
}

@media (max-width: 760px) {
  .tasks-page .tasks-list-head {
    display: none;
  }

  .tasks-page .tasks-card__summary {
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 10px;
    padding: 12px;
  }

  .tasks-page .tasks-card__assignee-panel,
  .tasks-page .tasks-card__status-panel,
  .tasks-page .tasks-card__progress-panel,
  .tasks-page .tasks-card__updated-panel {
    grid-column: 1 / -1;
  }

  .tasks-page .tasks-card__actions {
    grid-column: 2;
    grid-row: 1;
  }
}