:root {
    --red: #A81A1A; /* Premium corporate crimson */
    --red-hover: #BF2424;
    --red2: #BF2424;
    --red-light: #FFF5F5;
    --red-mid: #FFD5D5;
    --black: #1E1E1E; /* Rich soft black */
    --gray-dark: #2D2D2D;
    --gray: #4A4A4A;
    --gray-light: #5F6878; /* WCAG AA on white and soft panels */
    --muted: #5F6368;
    --border: #E2E2DF; /* Light, elegant subtle borders */
    --bg: #F8F8F6; /* Premium light-warm background */
    --white: #FFFFFF;
    --green: #146B3A;
    --green-light: #EDF7F2;
    --amber: #A8500C;
    --amber-light: #FEF4E6;
    --blue: #14508A;
    --blue-light: #EAF0F8;
    --surface: #FFFFFF;
    --surface-soft: #FBFBF9;
    --surface-hover: #FDFDFD;
    --ink: #1E1E1E;
    --line: #EBEBE8;
    --line-soft: #F4F4F2;
    --field-bg: #FFFFFF;
    --focus-red: rgba(168, 26, 26, 0.08); /* Cohesive soft glow */
    --radius-sm: 0px; /* Sharp premium industrial edges */
    --radius-md: 0px;
    --fast: 150ms cubic-bezier(0.4, 0, 0.2, 1);
    --transition-smooth: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    --font-body: "PT Sans", Arial, sans-serif;
    --font-heading: "PT Sans", Arial, sans-serif;
    --font-display: "PT Sans Narrow", "PT Sans", Arial, sans-serif;
    --font-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;
    --text-xs: 12px;
    --text-sm: 13px;
    --text-md: 14px;
    --text-name: 15px;
    --text-lg: 18px;
    --text-xl: 22px;
    --text-2xl: 28px;
    --text-3xl: 34px;
    --text-metric: 36px;

    /* Elevation Shadows */
    --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.04);
    --shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.04), 0 2px 4px -1px rgba(0, 0, 0, 0.01);
    --shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.03), 0 4px 6px -2px rgba(0, 0, 0, 0.01);
    --shadow-premium: 0 8px 24px -4px rgba(0, 0, 0, 0.04), 0 4px 12px -2px rgba(0, 0, 0, 0.02);
}

.org-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 390px;
    gap: 16px;
    align-items: start;
}

.org-layout--single {
    grid-template-columns: minmax(0, 1fr);
}

.org-tree {
    list-style: none;
    margin: 0;
    padding: 0 0 0 18px;
}

.org-tree--root {
    padding-left: 0;
}

.org-node {
    margin: 6px 0;
}

.org-node details {
    border-left: 1px solid var(--line);
    padding-left: 10px;
}

.org-node summary {
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 42px;
    cursor: pointer;
}

.org-node__main {
    display: grid;
    min-width: 0;
}

.org-node__main strong,
.org-node__main small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.org-layout__side {
    display: grid;
    gap: 12px;
}

.org-department-create {
    display: grid;
    gap: 10px;
    padding: 10px;
    border: 1px solid var(--line);
    background: var(--surface-soft);
}

.org-department-create label,
.org-department-item label {
    display: grid;
    gap: 4px;
}

.org-department-create label span,
.org-department-item label span {
    color: var(--muted);
    font-size: 12px;
}

.org-department-create input,
.org-department-create select,
.org-department-item input,
.org-department-item select,
.org-people-table select {
    width: 100%;
}

.org-department-list {
    display: grid;
    gap: 10px;
}

.org-side-subhead {
    margin-top: 10px;
}

.org-department-item {
    display: grid;
    grid-template-columns: 70px minmax(0, 1fr);
    gap: 8px 10px;
    align-items: end;
    padding: 10px;
    border: 1px solid var(--line);
    background: var(--white);
}

.org-department-item--group {
    grid-template-columns: 70px minmax(0, 1fr);
}

.org-department-item__code {
    display: grid;
    align-content: start;
    gap: 6px;
}

.org-department-item__actions {
    grid-column: 1 / -1;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
}

.org-people-panel {
    margin-top: 16px;
}

.org-people-table-wrap {
    max-height: 68vh;
}

.org-people-table td:first-child {
    min-width: 260px;
}

.org-people-table td:first-child strong,
.org-people-table td:first-child small {
    display: block;
}

.org-people-table select {
    min-width: 220px;
}

.avatar--small {
    width: 28px;
    height: 28px;
    font-size: 12px;
    flex: 0 0 auto;
}

.resource-legend {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0 0 12px;
    color: var(--muted);
    font-size: 12px;
}

.resource-dot {
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    border: 1px solid var(--line);
}

.resource-dot--idle { background: #f3f3f1; }
.resource-dot--free { background: #dcefe5; }
.resource-dot--ok { background: #fff0bf; }
.resource-dot--over { background: #ffd7d7; }

.resource-table-wrap {
    height: clamp(420px, calc(100dvh - 300px), 78dvh);
    max-height: none;
}

.resource-table th:first-child,
.resource-table td:first-child {
    position: sticky;
    left: 0;
    z-index: 2;
    background: var(--surface);
}

.resource-person {
    min-width: 220px;
}

.resource-person strong,
.resource-person small {
    display: block;
}

.resource-cell {
    min-width: 132px;
    vertical-align: top;
}

.resource-cell summary {
    cursor: pointer;
    display: grid;
    gap: 2px;
}

.resource-cell--idle { background: #f7f7f4; }
.resource-cell--free { background: #eef8f2; }
.resource-cell--ok { background: #fff8dc; }
.resource-cell--over { background: #fff0f0; }

.resource-task-list {
    margin: 8px 0 0;
    padding: 0;
    list-style: none;
    display: grid;
    gap: 6px;
}

.resource-task-list li {
    display: grid;
    gap: 2px;
}

@media (max-width: 980px) {
    .org-layout {
        grid-template-columns: 1fr;
    }
}

* {
    box-sizing: border-box;
}

/* Global Premium Thin Scrollbars */
::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}
::-webkit-scrollbar-track {
    background: rgba(0, 0, 0, 0.01);
}
::-webkit-scrollbar-thumb {
    background: rgba(0, 0, 0, 0.12);
    border-radius: 0; /* Strict industrial edge */
    transition: var(--transition-smooth);
}
::-webkit-scrollbar-thumb:hover {
    background: var(--red);
}

html,
body {
    min-height: 100%;
}

body {
    margin: 0;
    background: var(--bg);
    color: var(--black);
    font-family: "PT Sans", Arial, sans-serif;
    font-size: 13px;
    line-height: 1.35;
}

a {
    color: inherit;
    text-decoration: none;
}

button,
input,
select,
textarea {
    font: inherit;
}

input,
select,
textarea {
    width: 100%;
    min-height: 34px;
    border: 1px solid var(--border);
    border-radius: 0; /* Keep sharp corporate corners */
    background: var(--white);
    color: var(--black);
    padding: 6px 8px;
    transition: var(--transition-smooth);
}

input:focus,
select:focus,
textarea:focus {
    border-color: var(--red);
    box-shadow: 0 0 0 3px var(--focus-red);
    outline: none;
}

textarea {
    resize: vertical;
}

label > span {
    display: block;
    margin-bottom: 4px;
    color: var(--gray);
    font-size: 13px;
}

.app-shell {
    display: grid;
    grid-template-columns: 220px minmax(0, 1fr);
    min-height: 100vh;
}

.sidebar {
    display: flex;
    flex-direction: column;
    background: var(--white);
    border-right: 1px solid var(--border);
}

.brand {
    display: flex;
    align-items: baseline;
    gap: 8px;
    padding: 14px 18px 12px;
    border-bottom: 3px solid var(--red);
    font-family: var(--font-display);
    letter-spacing: 0;
}

.brand__mark {
    color: var(--red);
    font-size: 30px;
    font-weight: 700;
}

.brand__text {
    color: var(--black);
    font-size: 12px;
    font-weight: 700;
}

.nav {
    padding: 14px 10px;
}

.nav__link,
.nav__group {
    display: block;
    padding: 8px 10px;
    border-left: 3px solid transparent;
}

.nav__link {
    color: var(--black);
    transition: var(--transition-smooth);
}

.nav__link:hover,
.nav__link.is-active {
    border-left-color: var(--red);
    background: var(--surface-soft);
}

.nav__group {
    margin-top: 12px;
    color: var(--muted);
    font-size: 12px;
    text-transform: uppercase;
}

.sidebar__footer {
    margin-top: auto;
    padding: 14px;
    border-top: 1px solid var(--border);
}

.user-mini {
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr);
    gap: 8px;
    align-items: center;
    margin-bottom: 10px;
}

.user-mini strong,
.user-mini span {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.user-mini span,
.muted,
.link-muted {
    color: var(--muted);
}

.main {
    min-width: 0;
    padding: 18px;
}

.topbar h1 {
    margin: 0;
    font-family: "PT Sans Narrow", "PT Sans", sans-serif;
    font-size: 34px;
    line-height: 1;
    letter-spacing: 0;
}

.topbar__line {
    width: 96px;
    height: 3px;
    margin-top: 8px;
    background: var(--red);
}

.topbar__meta,
.topbar__actions,
.toolbar__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
    justify-content: flex-end;
}

.topbar__actions,
.topbar__meta {
    flex: 0 0 auto;
}

.topbar__actions {
    gap: 6px;
}

.counter,
.pill {
    display: inline-flex;
    align-items: center;
    min-height: 24px;
    padding: 2px 8px;
    border: 1px solid var(--border);
    background: var(--white);
    color: var(--gray);
    font-size: 13px;
}

.pill--red {
    border-color: var(--red);
    color: var(--red);
}

.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 34px;
    padding: 7px 12px;
    border: 1px solid var(--border);
    border-radius: 0;
    background: var(--white);
    color: var(--black);
    cursor: pointer;
    white-space: nowrap;
    transition: var(--transition-smooth);
}

.btn:hover,
.btn.is-active {
    border-color: var(--red);
    color: var(--red);
    background: var(--surface-soft);
    box-shadow: var(--shadow-sm);
}

.btn:active {
    transform: translateY(1px);
}

.btn--red {
    border-color: var(--red);
    background: var(--red);
    color: var(--white);
}

.btn--red:hover {
    background: var(--red-hover);
    color: var(--white);
    box-shadow: var(--shadow-md);
}

.btn.is-disabled {
    cursor: default;
    color: var(--muted);
}

.alert {
    margin: 0 0 14px;
    padding: 10px 12px;
    border: 1px solid var(--border);
    background: var(--white);
    box-shadow: var(--shadow-sm);
    transition: var(--transition-smooth);
}

.alert--success {
    border-left: 3px solid var(--green);
}

.alert--error {
    border-left: 3px solid var(--red);
}

.admin-ajax-notice {
    margin-bottom: 10px;
}

.toolbar,
.project-head {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    margin-bottom: 14px;
}

.toolbar__title {
    font-weight: 700;
}

.filters {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
}

.filters select,
.filters input {
    width: auto;
    min-width: 145px;
}

.panel {
    margin-bottom: 14px;
    border: 1px solid var(--border);
    border-radius: 0; /* Keep strict sharp corners */
    background: var(--white);
    box-shadow: var(--shadow-sm);
    transition: var(--transition-smooth);
}

.panel:hover {
    box-shadow: var(--shadow-md);
}

.panel__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 12px;
    border-bottom: 3px solid var(--red);
    background: var(--surface-soft);
}

.panel__head h2,
.project-head h2 {
    margin: 0;
    font-family: "PT Sans Narrow", "PT Sans", sans-serif;
    font-size: 24px;
    letter-spacing: 0;
}

.table-wrap {
    overflow: auto;
}

.table-wrap--compact {
    max-height: 330px;
}

.data-table {
    width: 100%;
    border-collapse: collapse;
    min-width: 860px;
}

.data-table th,
.data-table td {
    padding: 8px 10px;
    border-bottom: 1px solid var(--border);
    text-align: left;
    vertical-align: top;
}

.data-table th {
    color: var(--gray);
    font-size: 12px;
    text-transform: uppercase;
    background: #fafafa;
}

.data-table td small {
    display: block;
    color: var(--muted);
}

.data-table--compact {
    min-width: 720px;
    font-size: 13px;
}

.data-table--compact th,
.data-table--compact td {
    padding: 6px 8px;
}

.clickable {
    cursor: pointer;
}

.clickable:hover {
    background: #fafafa;
}

.row-danger {
    background: #fff5f5;
}

.status {
    display: inline-flex;
    align-items: center;
    min-height: 22px;
    padding: 2px 7px;
    border: 1px solid var(--border);
    font-size: 12px;
    white-space: nowrap;
}

.status--done {
    border-color: var(--green);
    color: var(--green);
}

.status--overdue,
.status--blocked,
.status--pending_close {
    border-color: var(--red);
    color: var(--red);
}

.status--review {
    border-color: var(--amber);
    color: var(--amber);
}

.status--correction {
    border-color: #B35C00;
    color: #B35C00;
}

.status--in_progress {
    border-color: var(--blue);
    color: var(--blue);
}

.text-red {
    color: var(--red);
}

.progress {
    width: 100%;
    height: 7px;
    border: 1px solid var(--border);
    background: var(--white);
}

.progress span {
    display: block;
    height: 100%;
    background: var(--red);
}

.kanban {
    display: grid;
    grid-template-columns: repeat(5, minmax(210px, 1fr));
    gap: 10px;
    overflow-x: auto;
}

.kanban__column {
    min-height: 420px;
    border: 1px solid var(--border);
    background: var(--surface-soft);
    box-shadow: var(--shadow-sm);
    transition: var(--transition-smooth);
}

.kanban__column.is-drag-over {
    border-color: var(--red);
    background: var(--red-light);
}

.kanban__head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 9px 10px;
    border-bottom: 3px solid var(--red);
    background: var(--white);
}

.kanban__head h2 {
    margin: 0;
    font-size: 18px;
}

.task-card {
    margin: 8px;
    padding: 10px;
    border: 1px solid var(--border);
    background: var(--white);
    box-shadow: var(--shadow-sm);
    transition: var(--transition-smooth);
}

.task-card:hover {
    transform: translateY(-2px);
    box-shadow: var(--shadow-md);
    border-color: var(--red);
}

.task-card a strong,
.task-card a span {
    display: -webkit-box;
    overflow: hidden;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.task-card a span {
    margin-top: 4px;
    color: var(--muted);
    font-size: 13px;
}

.card-meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin: 8px 0;
}

.avatar {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border: 1px solid var(--red);
    color: var(--red);
    background: var(--white);
    font-size: 12px;
    font-weight: 700;
}

.avatar--small {
    width: 26px;
    height: 26px;
}

.form-stack,
.form-grid {
    padding: 14px;
}

.form-stack {
    display: grid;
    gap: 12px;
}

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

.form-grid .panel__head,
.form-grid__full {
    grid-column: 1 / -1;
}

.section-title {
    margin-top: 8px;
    padding-top: 10px;
    border-top: 1px solid var(--border);
    color: var(--red);
    font-family: "PT Sans Narrow", "PT Sans", sans-serif;
    font-size: 20px;
    font-weight: 700;
}

.guest {
    display: grid;
    place-items: center;
    min-height: 100vh;
    background: var(--bg);
}

.guest-card {
    width: min(420px, calc(100vw - 28px));
    border: 1px solid var(--border);
    background: var(--white);
}

.entry-home {
    display: grid;
    gap: 22px;
    padding: 22px;
}

.entry-home__head {
    display: grid;
    gap: 6px;
}

.entry-home__eyebrow {
    margin: 0;
    color: var(--red);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.entry-home__head h1 {
    margin: 0;
    font-family: var(--font-display);
    font-size: 34px;
    line-height: 1;
}

.entry-home__head p:not(.entry-home__eyebrow),
.entry-home__note {
    margin: 0;
    color: var(--gray-light);
    font-size: 13px;
    line-height: 1.45;
}

.entry-home__actions {
    display: grid;
    gap: 8px;
}

.entry-choice {
    display: grid;
    grid-template-columns: 30px minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
    min-height: 66px;
    padding: 10px 12px;
    border: 1px solid var(--border);
    border-left: 3px solid var(--black);
    background: var(--white);
    color: var(--black);
    text-decoration: none;
    transition: border-color var(--fast), background-color var(--fast);
}

.entry-choice:hover,
.entry-choice:focus-visible {
    border-color: var(--red);
    background: var(--red-light);
    outline: none;
}

.entry-choice--primary {
    border-left-color: var(--red);
}

.entry-choice__index {
    color: var(--gray-light);
    font-family: var(--font-mono);
    font-size: 11px;
}

.entry-choice strong,
.entry-choice small {
    display: block;
}

.entry-choice strong {
    font-size: 16px;
}

.entry-choice small {
    margin-top: 2px;
    color: var(--gray-light);
    font-size: 12px;
}

.entry-choice__arrow {
    color: var(--red);
    font-size: 20px;
}

.entry-home__note {
    padding-top: 12px;
    border-top: 1px solid var(--line);
    font-size: 12px;
}

.task-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 380px;
    gap: 14px;
    align-items: start;
}

.task-side {
    position: sticky;
    top: 14px;
}

.task-tags,
.integrations,
.tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding: 12px;
}

.task-tags span,
.tabs a {
    border: 1px solid var(--border);
    padding: 5px 8px;
    background: var(--white);
}

.tabs {
    padding: 0;
    margin-bottom: 14px;
}

.tabs a.is-active,
.tabs a:hover {
    border-color: var(--red);
    color: var(--red);
}

.detail-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0;
    margin: 0;
    border-top: 1px solid var(--border);
}

.detail-grid div {
    padding: 10px 12px;
    border-right: 1px solid var(--border);
    border-bottom: 1px solid var(--border);
}

.detail-grid dt {
    color: var(--muted);
    font-size: 12px;
}

.detail-grid dd {
    margin: 3px 0 0;
    font-weight: 700;
}

.smart-box,
.text-block,
.comments,
.history {
    padding: 12px;
}

.smart-box {
    display: grid;
    grid-template-columns: 160px minmax(0, 1fr);
    gap: 8px 12px;
}

.smart-box p {
    margin: 0;
}

.comment {
    padding: 10px 0;
    border-bottom: 1px solid var(--border);
}

.comment div {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    color: var(--muted);
}

.comment p {
    margin: 6px 0 0;
}

.comment-form {
    display: grid;
    gap: 8px;
    padding: 12px;
}

.history {
    display: grid;
    gap: 6px;
    color: var(--gray);
    font-size: 13px;
}

.activity-list {
    display: grid;
    gap: 10px;
}

.activity-item {
    display: grid;
    grid-template-columns: 96px minmax(0, 1fr);
    gap: 14px;
    padding: 12px 0;
    border-bottom: 1px solid var(--border);
}

.activity-list--compact .activity-item {
    grid-template-columns: 82px minmax(0, 1fr);
    padding: 10px 0;
}

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

.activity-item__time {
    color: var(--muted);
    font-size: 12px;
    line-height: 1.35;
}

.activity-item__time strong,
.activity-item__time span {
    display: block;
}

.activity-item__body {
    min-width: 0;
}

.activity-item__body > strong {
    display: block;
    color: var(--text);
}

.activity-item__body p {
    margin: 4px 0 0;
    color: var(--muted);
    white-space: pre-line;
}

.activity-item__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-bottom: 4px;
    color: var(--muted);
    font-size: 12px;
}

.activity-item__meta span,
.activity-item__meta a {
    color: var(--muted);
}

.shift {
    padding: 10px 12px;
    border-bottom: 1px solid var(--border);
}

.shift strong,
.shift span {
    display: block;
}

.project-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(270px, 1fr));
    gap: 12px;
}

.project-card {
    display: grid;
    gap: 9px;
    padding: 12px;
    border: 1px solid var(--border);
    border-top: 3px solid var(--project-color, var(--red));
    background: var(--white);
    box-shadow: var(--shadow-sm);
    transition: var(--transition-smooth);
}

.project-card:hover {
    transform: translateY(-2px);
    box-shadow: var(--shadow-md);
}

.project-card h2 {
    margin: 0;
    font-size: 20px;
}

.project-card p {
    min-height: 38px;
    margin: 0;
    color: var(--gray);
}

.project-card__top,
.project-card__meta {
    display: flex;
    justify-content: space-between;
    gap: 8px;
}

.project-card__meta {
    color: var(--muted);
    font-size: 13px;
}

.metric-row {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    gap: 10px;
    margin-bottom: 14px;
}

.metric {
    padding: 12px;
    border: 1px solid var(--border);
    background: var(--white);
}

.metric span {
    display: block;
    font-family: "PT Sans Narrow", "PT Sans", sans-serif;
    font-size: 36px;
    line-height: 1;
    color: var(--red);
}

.metric strong {
    display: block;
    margin-top: 6px;
    color: var(--gray);
}

.details-panel {
    padding: 0;
}

.details-panel summary {
    padding: 10px 12px;
    cursor: pointer;
    border-bottom: 3px solid var(--red);
    font-weight: 700;
}

.gantt-box {
    min-height: 420px;
    padding: 12px;
    overflow: auto;
}

.readiness {
    font-weight: 700;
}

.readiness--red,
.issue--open {
    color: var(--red);
}

.readiness--amber,
.issue--in_progress {
    color: var(--amber);
}

.readiness--green,
.issue--done {
    color: var(--green);
}

.dpr-grid {
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    gap: 12px;
}

.dpr-span-12 {
    grid-column: span 12;
}

.dpr-span-7 {
    grid-column: span 7;
}

.dpr-span-6 {
    grid-column: span 6;
}

.dpr-span-5 {
    grid-column: span 5;
}

.dpr-cards {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
    gap: 10px;
}

.dpr-card {
    padding: 10px;
    border: 1px solid var(--border);
    border-top: 4px solid var(--green);
    background: var(--white);
}

.dpr-card--red {
    border-top-color: var(--red);
}

.dpr-card--amber {
    border-top-color: var(--amber);
}

.dpr-card h2 {
    min-height: 42px;
    margin: 8px 0;
    font-size: 17px;
}

.dpr-card__head,
.dpr-card__meta {
    display: flex;
    justify-content: space-between;
    gap: 8px;
    color: var(--muted);
    font-size: 13px;
}

.dpr-card__number {
    font-family: "PT Sans Narrow", "PT Sans", sans-serif;
    font-size: 38px;
    line-height: 1;
    color: var(--red);
}

.checkbox-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(170px, 1fr));
    gap: 6px 12px;
}

.checkbox-grid label {
    display: flex;
    gap: 6px;
    align-items: center;
}

.checkbox-grid input,
input[type="checkbox"] {
    width: auto;
    min-height: auto;
}

.one-time-password {
    display: flex;
    gap: 10px;
    align-items: center;
    padding: 14px;
}

.one-time-password code {
    padding: 8px 10px;
    border: 1px solid var(--border);
    background: #fafafa;
    font-size: 18px;
}

.one-time-password--credential {
    display: grid;
    gap: 10px;
    align-items: stretch;
}

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

.credential-card {
    display: grid;
    grid-template-columns: minmax(180px, 1fr) auto minmax(360px, auto);
    gap: 10px;
    align-items: center;
    padding: 10px;
    border: 1px solid var(--border);
    background: var(--surface-soft);
}

.credential-card__main strong,
.credential-card__main span {
    display: block;
}

.credential-card__main span {
    color: var(--muted);
    font-size: 12px;
}

.credential-card__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    justify-content: flex-end;
}

.credential-card__body {
    display: none;
}

.status-pill {
    display: inline-flex;
    align-items: center;
    min-height: 26px;
    padding: 4px 8px;
    border: 1px solid var(--border);
    background: var(--surface-soft);
    color: var(--text);
    font-size: 12px;
    font-weight: 700;
    white-space: nowrap;
}

.status-pill--muted {
    color: var(--muted);
    background: #f7f7f7;
}

.admin-rate-form {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-width: 150px;
}

.admin-rate-form input {
    width: 96px;
    min-width: 0;
}

.data-table tr.is-inactive {
    color: var(--muted);
    background: #fafafa;
}

.data-table tr.is-saving {
    opacity: 0.65;
}

.admin-user-filterbar {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(180px, 100%), 1fr));
    gap: 10px;
    align-items: end;
    padding: 12px 14px 14px;
}

.admin-user-filterbar label {
    display: grid;
    gap: 4px;
    min-width: 0;
}

.admin-user-filterbar label span {
    color: var(--muted);
    font-size: 12px;
    font-weight: 700;
}

.admin-user-filterbar input,
.admin-user-filterbar select {
    width: 100%;
    min-width: 0;
}

.admin-user-filterbar__toggle {
    display: inline-flex !important;
    grid-template-columns: auto 1fr;
    gap: 8px !important;
    align-items: center;
    min-height: 38px;
    padding: 0 10px;
    border: 1px solid var(--border);
    background: var(--surface-soft);
}

.admin-user-filterbar__toggle input {
    width: auto;
}

.admin-user-filterbar__toggle span {
    color: var(--text) !important;
}

.admin-user-bulkbar {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: end;
    padding: 12px 14px 14px;
}

.admin-user-bulkbar label {
    display: grid;
    gap: 4px;
    min-width: 170px;
}

.admin-user-bulkbar label span {
    color: var(--muted);
    font-size: 12px;
    font-weight: 700;
}

.admin-user-bulkbar select {
    min-width: 170px;
}

.admin-user-bulkbar .btn {
    min-height: 38px;
}

.user-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    align-items: center;
}

.user-actions form {
    margin: 0;
}

@media (max-width: 980px) {
    .admin-user-filterbar {
        grid-template-columns: 1fr 1fr;
    }

    .credential-card {
        grid-template-columns: 1fr;
        align-items: stretch;
    }

    .credential-card__actions {
        justify-content: flex-start;
    }
}

.empty-state {
    padding: 24px;
}

@media (max-width: 1100px) {
    .task-layout {
        grid-template-columns: 1fr;
    }

    .task-side {
        position: static;
    }

    .dpr-span-7,
    .dpr-span-6,
    .dpr-span-5 {
        grid-column: span 12;
    }
}

@media (max-width: 820px) {
    .app-shell {
        grid-template-columns: 1fr;
    }

    .sidebar {
        position: static;
    }

    .nav {
        display: flex;
        overflow-x: auto;
        gap: 4px;
    }

    .nav__group,
    .sidebar__footer {
        display: none;
    }

    .topbar,
    .toolbar,
    .project-head {
        align-items: stretch;
        flex-direction: column;
    }

    .form-grid,
    .detail-grid {
        grid-template-columns: 1fr;
    }

    .kanban {
        grid-template-columns: repeat(5, 240px);
    }
}

@media print {
    .sidebar,
    .topbar__meta,
    .toolbar,
    .btn {
        display: none !important;
    }

    .app-shell {
        display: block;
    }

    .main {
        padding: 0;
    }
}

/* BCC-like working UI pass */

html,
body {
    height: 100%;
    min-height: 100%;
}

body {
    overflow: hidden;
    font-size: 13px;
    line-height: 1.5;
}

.app-shell {
    display: flex;
    height: 100vh;
    min-height: 0;
}

.sidebar {
    width: 220px;
    flex: 0 0 220px;
}

.brand {
    padding: 14px 18px 12px;
    align-items: flex-start;
}

.brand__mark {
    font-size: 28px;
    line-height: 1;
}

.brand__text {
    display: block;
    font-family: "PT Sans Narrow", "PT Sans", sans-serif;
    font-size: 12px;
    line-height: 1.15;
    letter-spacing: .04em;
}

.brand__sub {
    display: block;
    margin-top: 2px;
    color: var(--muted);
    font-size: 12px;
    line-height: 1;
    letter-spacing: .1em;
    text-transform: uppercase;
}

.nav {
    flex: 1;
    overflow-y: auto;
    padding: 10px 0;
}

.nav__group {
    margin: 0;
    padding: 10px 18px 4px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .1em;
}

.nav__link {
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 7px 18px;
    color: var(--gray);
    font-size: 13px;
}

.nav__link:hover {
    background: var(--bg);
    color: var(--black);
}

.nav__link.is-active {
    background: var(--red-light);
    color: var(--red);
    font-weight: 700;
}

.sidebar__footer {
    padding: 11px 18px;
}

.avatar {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    border: 0;
    background: var(--red);
    color: #fff;
    font-family: "PT Sans Narrow", "PT Sans", sans-serif;
}

.user-mini {
    grid-template-columns: 30px minmax(0, 1fr);
    gap: 9px;
    margin-bottom: 7px;
}

.user-mini strong {
    font-size: 12px;
}

.user-mini span,
.link-muted {
    font-size: 12px;
}

.main {
    flex: 1;
    display: flex;
    flex-direction: column;
    min-width: 0;
    min-height: 0;
    padding: 0;
}

.topbar h1 {
    flex: 1;
    font-size: 18px;
    line-height: 1;
}

.topbar__line {
    display: none;
}

.counter {
    min-height: 24px;
    padding: 3px 9px;
    border: 1px solid var(--border);
    background: var(--bg);
    color: var(--muted);
    font-size: 12px;
}

.content {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
}

.alert {
    margin: 8px 22px 0;
}

.btn,
.btn-outline,
.btn-red,
.btn--red {
    min-height: 28px;
    padding: 6px 14px;
    border-radius: 0;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .02em;
}

.btn-red,
.btn--red {
    border-color: var(--red);
    background: var(--red);
    color: #fff;
}

.btn-red:hover,
.btn--red:hover {
    background: #b01a1a;
    color: #fff;
}

.btn-outline {
    border: 1px solid var(--border);
    background: transparent;
    color: var(--gray);
}

.tasks-screen {
    display: flex;
    flex-direction: column;
    min-height: 100%;
}

.filterbar {
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    gap: 6px;
    padding: 8px 22px;
    border-bottom: 1px solid var(--border);
    background: var(--white);
    overflow-x: auto;
}

.filterbar select {
    width: auto;
    min-width: 88px;
    min-height: 27px;
    padding: 4px 26px 4px 10px;
    border: 1px solid var(--border);
    background-color: var(--bg);
    color: var(--gray);
    font-size: 12px;
    font-weight: 700;
    flex: 0 0 auto;
}

.filterbar .btn {
    min-height: 27px;
    padding: 4px 10px;
    font-size: 12px;
    flex: 0 0 auto;
}

.fsep {
    flex: 1;
    min-width: 12px;
}

.view-switch {
    display: inline-flex;
    border: 1px solid var(--border);
    flex: 0 0 auto;
}

.view-btn {
    display: inline-flex;
    align-items: center;
    min-height: 25px;
    padding: 4px 10px;
    background: var(--bg);
    color: var(--muted);
    font-size: 12px;
    font-weight: 700;
}

.view-btn.active {
    background: var(--black);
    color: #fff;
}

.overdue-banner {
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    gap: 12px;
    padding: 8px 22px;
    background: var(--red);
    color: #fff;
    font-size: 12px;
    font-weight: 700;
}

.overdue-action {
    margin-left: auto;
    padding: 4px 12px;
    background: #fff;
    color: var(--red);
    font-size: 12px;
    font-weight: 700;
}

.task-table {
    flex: 1;
    min-height: 0;
    overflow: auto;
    background: var(--white);
}

.tbl-head,
.task-row {
    display: grid;
    grid-template-columns: 28px minmax(260px, 1fr) 110px 80px 80px 90px 70px 72px;
}

.tbl-head {
    position: sticky;
    top: 0;
    z-index: 2;
    padding: 0 22px;
    border-bottom: 1px solid var(--border);
    background: var(--bg);
}

.th {
    padding: 7px 6px;
    color: #888888;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.task-row {
    align-items: center;
    min-height: 42px;
    padding: 0 22px;
    border-bottom: 1px solid #f0f0f0;
    background: var(--white);
    cursor: pointer;
    transition: background .1s;
}

.task-row:hover {
    background: #fafaf8;
}

.task-row.overdue-row {
    border-left: 3px solid var(--red);
    padding-left: 19px;
}

.chk {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 15px;
    height: 15px;
    border: 1px solid var(--border);
    color: var(--muted);
    font-size: 12px;
}

.task-info {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
    padding: 7px 0;
}

.task-name {
    overflow: hidden;
    color: #111111;
    font-size: 13px;
    font-weight: 700;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.task-meta {
    display: flex;
    align-items: center;
    gap: 6px;
    min-width: 0;
}

.tid {
    color: var(--muted);
    font-family: monospace;
    font-size: 12px;
}

.tag {
    flex: 0 0 auto;
    padding: 1px 6px;
    background: var(--blue-light);
    color: var(--blue);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .03em;
}

.tag-rd {
    background: #fcebeb;
    color: #791f1f;
}

.sub-hint {
    overflow: hidden;
    color: var(--muted);
    font-size: 12px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.tcol {
    min-width: 0;
    padding: 4px 6px;
    color: #2e2e2e;
    font-size: 12px;
}

.pill {
    display: inline-block;
    min-height: 0;
    padding: 2px 8px;
    border: 0;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.35;
}

.s-new {
    background: #f1f1ef;
    color: #555;
}

.s-work {
    background: var(--blue-light);
    color: var(--blue);
}

.s-review {
    background: var(--amber-light);
    color: var(--amber);
}

.s-done {
    background: var(--green-light);
    color: var(--green);
}

.s-block {
    background: #fcebeb;
    color: #791f1f;
}

.s-overdue {
    background: var(--red);
    color: #fff;
}

.s-pclose {
    background: var(--amber);
    color: #fff;
}

.pdot {
    display: inline-block;
    width: 7px;
    height: 7px;
    margin-right: 4px;
    border-radius: 50%;
}

.p-high {
    background: var(--red);
}

.p-mid {
    background: var(--amber);
}

.p-low {
    background: var(--muted);
}

.date-red {
    color: var(--red);
    font-weight: 700;
}

.mini-ava {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: var(--mini-ava-bg, var(--red));
    color: #fff;
    font-family: "PT Sans Narrow", "PT Sans", sans-serif;
    font-size: 12px;
    font-weight: 700;
}

.prog-wrap {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.prog-label {
    color: var(--muted);
    font-size: 12px;
}

.prog-bar {
    display: block;
    height: 4px;
    background: #e8e8e8;
}

.prog-fill {
    display: block;
    height: 100%;
    background: var(--red);
}

.prog-fill.done,
.prog-fill--done {
    background: var(--green);
}

.prog-fill.risk,
.prog-fill--mid {
    background: var(--amber);
}

.empty-state--table {
    display: grid;
    gap: 8px;
    padding: 38px 22px;
    border-bottom: 1px solid var(--border);
}

.empty-state--table strong {
    font-family: "PT Sans Narrow", "PT Sans", sans-serif;
    font-size: 22px;
}

.empty-state--table span {
    color: var(--muted);
}

.nav-badge {
    flex: 0 0 auto;
    margin-left: 0;
    padding: 1px 6px;
    border-radius: 2px;
    background: var(--red);
    color: #fff;
    font-size: 12px;
    font-weight: 700;
}

.kanban {
    padding: 12px 22px;
}

@media (max-width: 900px) {
    body {
        overflow: hidden;
    }

    .app-shell {
        display: flex;
        height: 100vh;
        min-height: 0;
    }

    .sidebar {
        width: 220px;
        flex: 0 0 220px;
    }

    .nav {
        display: block;
        overflow-y: auto;
    }

    .nav__group,
    .sidebar__footer {
        display: block;
    }

    .main {
        min-height: 0;
    }

    .topbar,
    .toolbar,
    .project-head {
        flex-direction: row;
        align-items: center;
    }

    .tbl-head,
    .task-row {
        grid-template-columns: 28px minmax(260px, 1fr) 110px 80px 80px 90px 70px 72px;
        min-width: 800px;
    }
}

/* Strict premium refinement */

body {
    color: var(--black);
    background: var(--bg);
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

input,
select,
textarea {
    border-color: var(--border);
    background: var(--field-bg);
    transition: border-color .12s ease, background-color .12s ease;
}

input:required,
select:required,
textarea:required {
    border-color: var(--red);
    background: #fffafa;
}

input:focus,
select:focus,
textarea:focus {
    outline: 2px solid rgba(204, 31, 31, .14);
    outline-offset: 0;
    border-color: var(--red);
    background: #fff;
}

label > span {
    color: var(--muted);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .07em;
    text-transform: uppercase;
}

.brand {
    background: #fff;
}

.brand__mark {
    color: var(--red);
}

.sidebar {
    border-right-color: var(--border);
    background: #fff;
}

.nav__link {
    min-height: 34px;
    color: #222222;
}

.nav__link.is-active {
    background: #fff4f4;
    color: var(--red);
}

.nav__link:hover {
    background: #f7f5f1;
}

.topbar h1 {
    font-size: 20px;
    font-weight: 700;
}

.counter {
    background: #f8f7f4;
    color: var(--gray);
}

.filterbar {
    gap: 7px;
    border-bottom-color: var(--border);
    background: #fff;
}

.filterbar select {
    min-height: 30px;
    border-color: #d4d0c8;
    background-color: #faf9f6;
    color: #2d2b28;
}

.filterbar select:hover {
    border-color: #a8a29a;
    background-color: #fff;
}

.btn,
.btn-outline,
.btn-red,
.btn--red {
    min-height: 30px;
    border-color: #c9c4bb;
}

.btn-outline:hover,
.btn:hover {
    border-color: var(--black);
    color: var(--black);
    background: #fff;
}

.btn-red,
.btn--red {
    border-color: var(--red);
}

.view-switch {
    border-color: #c9c4bb;
}

.view-btn {
    min-height: 28px;
    background: #f4f2ed;
    color: #625f59;
}

.view-btn.active {
    background: var(--black);
    color: #fff;
}

.overdue-banner {
    min-height: 42px;
    background: #c81818;
}

.overdue-action {
    border: 1px solid #fff;
}

.task-table {
    background: #fff;
}

.tbl-head {
    background: #f2f0eb;
}

.th {
    color: #888888;
    font-weight: 700;
}

.task-row {
    min-height: 48px;
    border-bottom-color: var(--line-soft);
}

.task-row:hover {
    background: #fbfaf7;
}

.task-row.overdue-row {
    background: #fffdfd;
}

.task-name {
    color: #111111;
    font-size: 13px;
    font-weight: 700;
}

.tag {
    border: 1px solid transparent;
    background: #eef3f8;
}

.tag-rd {
    border-color: #f2dddd;
    background: #fff3f3;
}

.pill {
    padding: 3px 8px;
}

.s-overdue {
    background: #c81818;
}

.mini-ava,
.avatar {
    background: #c81818;
}

.prog-bar {
    background: #dfdcd5;
}

.panel {
    border-color: var(--border);
    background: #fff;
}

.panel__head {
    min-height: 46px;
    border-bottom-color: var(--red);
    background: #fff;
}

.panel__head h2 {
    font-size: 20px;
}

.form-grid,
.form-stack {
    background: #fff;
}

.form-grid {
    gap: 14px 16px;
}

.section-title {
    margin-top: 12px;
    padding-top: 13px;
    border-top-color: var(--border);
    color: var(--black);
    font-size: 18px;
}

.section-title::before {
    content: "";
    display: inline-block;
    width: 28px;
    height: 3px;
    margin-right: 9px;
    vertical-align: middle;
    background: var(--red);
}

.detail-grid div {
    border-color: var(--line-soft);
}

.data-table th {
    background: #f2f0eb;
    color: #827d75;
}

.data-table td {
    border-bottom-color: var(--line-soft);
}

.guest-card {
    border-color: var(--border);
}

.task-passport {
    background: #fff;
}

.task-passport__head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    padding: 18px 20px 14px;
    border-bottom: 3px solid var(--red);
}

.task-passport__head h2 {
    margin: 2px 0 0;
    font-family: "PT Sans Narrow", "PT Sans", sans-serif;
    font-size: 28px;
    line-height: 1.05;
}

.task-code {
    color: var(--muted);
    font-family: monospace;
    font-size: 12px;
}

.task-passport__grid {
    display: grid;
    grid-template-columns: minmax(0, 1.4fr) 180px 180px;
    border-bottom: 1px solid var(--line-soft);
}

.task-passport__item {
    min-height: 86px;
    padding: 13px 16px;
    border-right: 1px solid var(--line-soft);
    border-bottom: 1px solid var(--line-soft);
}

.task-passport__item--wide {
    grid-column: span 1;
}

.task-passport__item span {
    display: block;
    margin-bottom: 5px;
    color: var(--muted);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .09em;
    text-transform: uppercase;
}

.task-passport__item strong,
.task-passport__item p {
    margin: 0;
    color: var(--black);
    font-size: 14px;
    line-height: 1.45;
}

.task-link {
    color: var(--red);
    font-weight: 700;
}

.task-stats {
    overflow: hidden;
}

.stat-ring {
    display: grid;
    gap: 4px;
    padding: 16px;
}

.stat-ring strong {
    font-family: "PT Sans Narrow", "PT Sans", sans-serif;
    font-size: 40px;
    line-height: 1;
}

.stat-ring span {
    color: var(--muted);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.stat-list {
    margin: 0;
    border-top: 1px solid var(--line-soft);
}

.stat-list div {
    display: flex;
    justify-content: space-between;
    gap: 10px;
    padding: 9px 14px;
    border-bottom: 1px solid var(--line-soft);
}

.stat-list dt {
    color: var(--muted);
    font-size: 12px;
}

.stat-list dd {
    margin: 0;
    font-weight: 700;
    text-align: right;
}

.scope-pill {
    display: inline-flex;
    align-items: center;
    min-height: 22px;
    padding: 2px 8px;
    background: #fcebeb;
    color: #791f1f;
    font-size: 12px;
    font-weight: 700;
}

.scope-pill--global {
    background: #f2f0eb;
    color: #504d48;
}

.nav-projects {
    display: grid;
    gap: 2px;
    padding: 2px 8px 8px 18px;
}

.nav-project {
    display: grid;
    grid-template-columns: minmax(0, 44px) minmax(0, 1fr) auto;
    align-items: center;
    gap: 7px;
    min-height: 30px;
    padding: 4px 8px;
    border-left: 2px solid transparent;
    color: var(--gray);
    font-size: 12px;
}

.nav-project:hover,
.nav-project.is-active {
    border-left-color: var(--red);
    background: #fbf5f5;
    color: var(--black);
}

.nav-project span {
    overflow: hidden;
    color: var(--red);
    font-family: monospace;
    font-weight: 700;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.nav-project small {
    overflow: hidden;
    color: var(--muted);
    text-overflow: ellipsis;
    white-space: nowrap;
}

.nav-project b {
    min-width: 18px;
    padding: 1px 5px;
    background: #f2f0eb;
    color: var(--gray);
    font-size: 12px;
    text-align: center;
}

.gantt-workspace {
    display: flex;
    flex-direction: column;
    height: calc(100vh - 176px);
    min-height: 640px;
    margin: 0 22px 22px;
    border: 1px solid var(--border);
    background: var(--white);
}

.gantt-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    min-height: 58px;
    padding: 10px 14px;
    border-bottom: 3px solid var(--red);
}

.gantt-toolbar__title {
    display: grid;
    gap: 3px;
}

.gantt-toolbar strong {
    font-family: "PT Sans Narrow", "PT Sans", sans-serif;
    font-size: 24px;
}

.gantt-toolbar span {
    color: var(--muted);
    font-size: 12px;
}

.gantt-view-controls {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    justify-content: flex-end;
}

.gantt-view-controls .btn {
    min-height: 32px;
    padding: 6px 10px;
}

.gantt-frame {
    display: grid;
    grid-template-columns: minmax(280px, 360px) minmax(0, 1fr);
    flex: 1;
    min-height: 0;
}

.gantt-frame--empty {
    grid-template-columns: minmax(0, 1fr);
}

.gantt-task-list {
    overflow: auto;
    border-right: 1px solid var(--line);
    background: var(--surface-soft);
}

.gantt-task-list__head,
.gantt-task-list__row {
    display: grid;
    align-content: center;
    gap: 3px;
    padding: 0 14px;
    border-bottom: 1px solid var(--line-soft);
}

.gantt-task-list__head {
    min-height: 112px;
    color: var(--gray);
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
}

.gantt-task-list__head small,
.gantt-task-list__row span {
    overflow: hidden;
    color: var(--muted);
    text-overflow: ellipsis;
    white-space: nowrap;
}

.gantt-task-list__row {
    min-height: 54px;
}

.gantt-task-list__row:hover {
    background: #fffafa;
    color: var(--red);
}

.gantt-task-list__row strong {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.gantt-scroll {
    flex: 1;
    min-height: 0;
    overflow: auto;
    background: #fff;
}

.gantt-box {
    min-width: 1320px;
    min-height: 100%;
    padding: 18px;
    overflow: visible;
}

.gantt-box .gantt-container,
.gantt-box svg {
    min-width: 1280px;
}

.gantt-box .bar-label {
    font-size: 13px;
    font-weight: 700;
}

.gantt-box .lower-text,
.gantt-box .upper-text {
    font-size: 12px;
}

.project-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(300px, 360px);
    gap: 16px;
    align-items: start;
    margin: 0 24px 24px;
}

.project-tabs {
    position: relative;
    z-index: 2;
    max-width: calc(100% - 48px);
}

.project-model-menu {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    align-items: center;
    margin: 0 24px 16px;
    padding: 14px 16px;
}

.project-model-menu > div:first-child {
    display: grid;
    gap: 4px;
    min-width: 0;
}

.project-model-menu strong {
    color: var(--gray-dark);
}

.project-model-menu span {
    color: var(--muted);
    font-size: 13px;
    line-height: 1.35;
}

.project-model-menu .actions-inline {
    justify-content: flex-end;
    flex-shrink: 0;
}

.project-models-panel {
    margin: 0 24px 24px;
    padding-bottom: 16px;
}

.project-layout--single {
    grid-template-columns: minmax(0, 1fr);
}

.project-layout.is-file-pane-collapsed {
    grid-template-columns: minmax(0, 1fr) 44px;
}

.project-main-column {
    min-width: 0;
}

.project-file-pane {
    position: sticky;
    top: 84px;
    z-index: 1;
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr);
    grid-template-rows: minmax(0, 1fr);
    height: calc(100vh - 108px);
    min-height: 520px;
    max-height: calc(100vh - 108px);
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: var(--radius-md);
    background: var(--surface);
}

.project-file-pane.is-collapsed {
    height: 280px;
    min-height: 280px;
}

.project-file-pane__toggle {
    display: grid;
    place-items: center;
    width: 44px;
    min-height: 0;
    height: 100%;
    padding: 10px 0;
    border: 0;
    border-right: 1px solid var(--line);
    background: var(--surface-soft);
    color: var(--red);
    cursor: pointer;
}

.project-file-pane__toggle span {
    writing-mode: vertical-rl;
    transform: rotate(180deg);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.project-file-pane__toggle:hover {
    background: #fffafa;
}

.project-file-pane.is-collapsed .project-file-pane__toggle {
    border-right: 0;
}

.project-file-pane.is-collapsed .project-file-pane__body {
    display: none;
}

.project-file-pane__body,
.project-file-section__body {
    min-width: 0;
    min-height: 0;
    overflow: auto;
}

.project-file-pane__head,
.project-file-section__head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
    padding: 14px 16px;
    border-bottom: 4px solid var(--red);
}

.project-file-pane__head span:first-child,
.project-file-section__head span:first-child {
    display: block;
    margin-bottom: 4px;
    color: var(--muted);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.project-file-pane__head h2,
.project-file-section__head h2 {
    margin: 0;
    font-family: "PT Sans Narrow", "PT Sans", sans-serif;
    font-size: 22px;
    line-height: 1.08;
}

.project-file-pane__root,
.project-file-section__root {
    display: block;
    width: 100%;
    min-width: 0;
    overflow: hidden;
    padding: 10px 16px;
    border-bottom: 1px solid var(--line-soft);
    color: var(--red);
    font-size: 12px;
    font-weight: 700;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-file-pane__root:hover,
.project-file-section__root:hover {
    background: #fffafa;
}

.project-file-pane__tree,
.project-file-section__tree {
    padding-bottom: 8px;
}

.project-tab-actions {
    flex: 1 1 720px;
    align-items: center;
    justify-content: flex-end;
}

.project-head--tab {
    align-items: flex-start;
    flex-wrap: wrap;
}

.project-head--tab > div:first-child {
    flex: 0 1 300px;
}

.csv-import-form {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    align-items: center;
    justify-content: flex-end;
}

.csv-import-form input[type="file"] {
    width: 190px;
    min-height: 34px;
    padding: 5px 7px;
    font-size: 12px;
}

.sheet-panel {
    overflow: hidden;
}

.sheet-wrap {
    max-height: calc(100vh - 290px);
}

.sheet-table {
    min-width: 1160px;
}

.sheet-table th,
.sheet-table td {
    min-width: 132px;
}

.sheet-table th:nth-child(3),
.sheet-table td:nth-child(3),
.sheet-table th:nth-child(8),
.sheet-table td:nth-child(8),
.sheet-table th:nth-child(9),
.sheet-table td:nth-child(9) {
    min-width: 220px;
}

.sheet-table td {
    vertical-align: middle;
}

.sheet-table input,
.sheet-table select,
.sheet-table textarea {
    min-height: 34px;
    padding: 6px 8px;
    border-color: transparent;
    background: transparent;
    box-shadow: inset 0 0 0 1px var(--line-soft);
}

.sheet-table textarea {
    min-height: 34px;
    resize: vertical;
}

.sheet-table input:focus,
.sheet-table select:focus,
.sheet-table textarea:focus {
    box-shadow: inset 0 0 0 1px var(--red);
}

.sheet-table__new-row td {
    background: #fffdf8;
}

.schedule-board {
    display: grid;
    grid-template-columns: repeat(5, minmax(220px, 1fr));
    gap: 12px;
    margin: 0 24px 16px;
    overflow-x: auto;
}

.schedule-board__column {
    min-height: 360px;
    border: 1px solid var(--line);
    border-radius: var(--radius-md);
    background: var(--surface-soft);
}

.schedule-board__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    min-height: 48px;
    padding: 10px 12px;
    border-bottom: 4px solid var(--red);
}

.schedule-board__head h2 {
    margin: 0;
    font-family: "PT Sans Narrow", "PT Sans", sans-serif;
    font-size: 20px;
}

.schedule-card {
    display: grid;
    gap: 5px;
    margin: 10px;
    padding: 12px;
    border: 1px solid var(--line-soft);
    border-radius: var(--radius-md);
    background: var(--surface);
}

.schedule-card--late {
    border-color: #efb0b0;
    background: #fff7f7;
}

.schedule-card span,
.schedule-card small {
    overflow: hidden;
    color: var(--muted);
    text-overflow: ellipsis;
    white-space: nowrap;
}

.task-links .integrations {
    display: grid;
    grid-template-columns: 1fr;
    align-items: stretch;
}

.task-links .btn {
    justify-content: flex-start;
}

.project-file-bar {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 0 24px 16px;
    padding: 10px 14px;
    border: 1px solid var(--line);
    border-left: 4px solid var(--red);
    border-radius: var(--radius-md);
    background: var(--surface);
}

.project-file-bar span,
.custom-field span {
    color: var(--muted);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.project-card__folder {
    overflow: hidden;
    color: var(--muted);
    font-size: 12px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.link-field,
.link-list {
    display: grid;
    gap: 8px;
}

.link-row {
    display: grid;
    grid-template-columns: minmax(120px, .45fr) minmax(220px, 1fr) auto;
    gap: 8px;
    align-items: center;
}

.custom-field-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 10px;
    padding: 14px 18px;
}

.custom-field {
    display: grid;
    gap: 7px;
    min-height: 70px;
    padding: 12px;
    border: 1px solid var(--line-soft);
    border-radius: var(--radius-md);
    background: var(--surface-soft);
}

.file-link-list {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.file-link {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    max-width: 100%;
    padding: 5px 9px;
    border: 1px solid #e6c8c8;
    border-radius: 2px;
    background: #fffafa;
    color: var(--red);
    font-size: 12px;
    font-weight: 700;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.file-link:hover {
    border-color: var(--red);
    background: #fff;
    transform: translateY(-1px);
}

.project-folder-map {
    margin: 0 24px 16px;
}

.folder-map__quick {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding: 14px 16px;
    border-bottom: 1px solid var(--line-soft);
    background: var(--surface-soft);
}

.folder-open-form {
    display: contents;
}

.folder-open-form button:disabled {
    cursor: progress;
    opacity: .72;
}

.folder-tree__link,
.project-file-pane__root,
.project-file-section__root {
    border: 0;
    background: transparent;
    text-align: left;
    font: inherit;
    cursor: pointer;
}

.file-link--button {
    font: inherit;
    color: inherit;
    cursor: pointer;
}

.project-file-pane__root-row,
.project-file-section__root-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px;
    align-items: stretch;
    padding: 0 16px 12px;
}

.folder-tree {
    display: grid;
    gap: 5px;
    margin: 0;
    padding: 12px 16px 12px 26px;
    list-style: none;
}

.folder-tree .folder-tree {
    padding: 5px 0 3px 18px;
    border-left: 1px solid var(--line-soft);
}

.folder-tree li {
    display: grid;
    gap: 4px;
}

.folder-tree__link {
    display: grid;
    grid-template-columns: minmax(190px, .42fr) minmax(0, 1fr);
    gap: 10px;
    align-items: center;
    min-height: 30px;
    padding: 5px 8px;
    border-radius: var(--radius-sm);
    background: transparent;
    color: inherit;
}

.folder-tree__link:hover {
    background: #fffafa;
    color: var(--red);
    transform: translateX(2px);
}

.folder-tree__link span {
    font-weight: 700;
}

.folder-tree__link small {
    overflow: hidden;
    color: var(--muted);
    font-size: 12px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.toolbar__actions form {
    display: contents;
}

/* Product UI polish pass */

::selection {
    background: #f7d6d6;
    color: var(--ink);
}

body {
    color: var(--ink);
    background: #f5f4f0;
}

a,
button,
.btn,
.nav__link,
.nav-project,
.view-btn,
.task-card,
.task-row,
.project-card,
.dpr-card,
.tabs a,
.data-table tr,
input,
select,
textarea {
    transition:
        background-color var(--fast),
        border-color var(--fast),
        color var(--fast),
        transform var(--fast),
        opacity var(--fast);
}

a:focus-visible,
button:focus-visible,
.btn:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
summary:focus-visible {
    outline: 2px solid var(--focus-red);
    outline-offset: 2px;
}

.sidebar {
    width: 232px;
    flex-basis: 232px;
    border-right-color: var(--line);
}

.brand:hover .brand__mark {
    transform: translateX(1px);
}

.brand__mark,
.brand__text {
    transition: transform var(--fast), color var(--fast);
}

.nav {
    padding: 12px 0;
}

.nav__group {
    padding: 12px 20px 5px;
}

.nav__link {
    position: relative;
    min-height: 36px;
    padding: 8px 20px;
    border-left-width: 4px;
}

.nav__link:hover {
    background: var(--surface-soft);
    color: var(--ink);
    transform: translateX(2px);
}

.nav__link.is-active {
    background: var(--surface-hover);
    color: var(--red);
}

.nav-projects {
    gap: 3px;
    padding: 4px 10px 10px 20px;
}

.nav-project {
    min-height: 34px;
    padding: 5px 8px;
    border-left-width: 3px;
    border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
}

.nav-project:hover {
    transform: translateX(2px);
}

.nav-project b {
    border-radius: 2px;
}

.sidebar__footer {
    border-top-color: var(--line);
    background: var(--surface-soft);
}

.topbar h1 {
    font-size: 22px;
}

.topbar__actions {
    gap: 8px;
}

.counter,
.pill,
.status,
.tag,
.scope-pill {
    border-radius: 2px;
}

.counter {
    min-height: 30px;
    padding: 5px 10px;
    background: var(--surface-soft);
}

.btn,
.btn-outline,
.btn-red,
.btn--red {
    min-height: 34px;
    padding: 7px 14px;
    border-radius: var(--radius-sm);
}

.btn:hover,
.btn-outline:hover {
    border-color: var(--red);
    color: var(--red);
    background: #fffafa;
    transform: translateY(-1px);
}

.btn-red:hover,
.btn--red:hover {
    border-color: #a91616;
    background: #a91616;
    transform: translateY(-1px);
}

.btn:active,
.btn-red:active,
.btn--red:active,
.view-btn:active {
    transform: translateY(0);
}

.content {
    background: #f5f4f0;
}

.content > .toolbar,
.content > .project-head,
.content > .project-grid,
.content > .metric-row,
.content > .dpr-grid,
.content > .schedule-board,
.content > .panel,
.content > form.panel,
.content > .tabs {
    margin-left: 24px;
    margin-right: 24px;
}

.content > .toolbar,
.content > .project-head {
    margin-top: 18px;
}

.toolbar,
.project-head {
    min-height: 44px;
}

.toolbar__title {
    font-family: "PT Sans Narrow", "PT Sans", sans-serif;
    font-size: 24px;
    line-height: 1;
}

.filters {
    gap: 10px;
}

input,
select,
textarea {
    min-height: 38px;
    padding: 8px 10px;
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
    background: var(--field-bg);
}

textarea {
    min-height: 84px;
}

input:hover,
select:hover,
textarea:hover {
    border-color: #aaa397;
    background: #fff;
}

input:required,
select:required,
textarea:required {
    border-color: var(--red);
    background: #fffafa;
}

input:focus,
select:focus,
textarea:focus {
    outline: 2px solid var(--focus-red);
    outline-offset: 1px;
    border-color: var(--red);
    background: #fff;
}

label {
    display: grid;
    gap: 6px;
}

.form-check {
    display: flex;
    align-items: center;
    gap: 8px;
}

.form-check input {
    width: 16px;
    height: 16px;
}

.form-check > span {
    font-size: 13px;
    letter-spacing: 0;
}

.form-choice-group {
    margin: 0;
    padding: 12px;
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
    background: var(--surface-muted);
    display: grid;
    gap: 10px;
}

.form-choice-group legend {
    padding: 0 4px;
    font-size: 12px;
    font-weight: 700;
    color: var(--text);
}

label > span {
    margin: 0;
    font-size: 12px;
    letter-spacing: .08em;
}

.field-hint {
    color: var(--muted);
    font-size: 12px;
}

.panel,
.project-card,
.dpr-card,
.kanban__column,
.task-card,
.metric,
.guest-card,
.gantt-workspace {
    border-color: var(--line);
    border-radius: var(--radius-md);
    background: var(--surface);
}

.panel,
.kanban__column,
.task-main,
.task-stats,
.gantt-workspace {
    overflow: hidden;
}

.panel__head,
.kanban__head,
.gantt-toolbar {
    min-height: 50px;
    padding: 12px 16px;
    border-bottom-width: 4px;
}

.panel__head h2,
.project-head h2,
.kanban__head h2,
.gantt-toolbar strong {
    font-size: 22px;
    line-height: 1.08;
}

.panel:hover,
.project-card:hover,
.dpr-card:hover,
.task-card:hover {
    border-color: #bdb6aa;
}

.project-card:hover,
.dpr-card:hover,
.task-card:hover {
    transform: translateY(-2px);
}

.form-grid,
.form-stack {
    gap: 16px;
    padding: 18px;
}

.section-title {
    margin-top: 18px;
    padding-top: 16px;
}

.tabs {
    gap: 6px;
    margin-top: 0;
    margin-bottom: 16px;
    padding: 0;
    overflow-x: auto;
}

.tabs a {
    min-height: 36px;
    padding: 8px 12px;
    border-color: var(--line);
    border-radius: var(--radius-sm);
    background: var(--surface);
    color: var(--gray);
    white-space: nowrap;
}

.tabs a:hover {
    background: #fffafa;
    transform: translateY(-1px);
}

.tabs a.is-active {
    border-color: var(--red);
    background: #fffafa;
    color: var(--red);
}

.filterbar {
    position: sticky;
    top: 0;
    z-index: 6;
    gap: 8px;
    padding: 10px 24px;
    border-bottom-color: var(--line);
}

.filterbar select,
.filterbar .btn {
    min-height: 34px;
    font-size: 12px;
}

.view-switch {
    border-radius: var(--radius-sm);
    overflow: hidden;
}

.view-btn {
    min-height: 32px;
    padding: 6px 12px;
}

.view-btn:not(.active):hover {
    background: #fff;
    color: var(--ink);
}

.overdue-banner {
    min-height: 44px;
    padding: 9px 24px;
}

.overdue-action {
    border-radius: var(--radius-sm);
}

.task-table {
    border-top: 1px solid var(--line-soft);
}

.tbl-head {
    padding: 0 24px;
    background: #efede7;
}

.task-row {
    min-height: 54px;
    padding: 0 24px;
}

.task-row:hover {
    background: #fffafa;
    transform: translateX(2px);
}

.task-row.overdue-row {
    border-left-width: 4px;
    padding-left: 20px;
}

.chk {
    border-radius: var(--radius-sm);
}

.task-name {
    color: #111111;
    font-size: 13px;
    font-weight: 700;
}

.task-meta {
    gap: 7px;
}

.tcol {
    color: #2e2e2e;
    font-size: 12px;
}

.prog-bar,
.progress {
    border-radius: 0;
    overflow: hidden;
}

.progress span,
.prog-fill {
    transition: width 260ms cubic-bezier(.2, .7, .2, 1), background-color var(--fast);
}

.kanban {
    gap: 14px;
    padding: 16px 24px;
}

.kanban__column {
    min-height: 500px;
    background: #fbfaf7;
}

.kanban__column.is-drag-over {
    border-color: var(--red);
    background: #fffafa;
}

.task-card {
    margin: 10px;
    padding: 12px;
    border-radius: var(--radius-md);
}

.data-table {
    border-collapse: separate;
    border-spacing: 0;
}

.data-table th {
    position: sticky;
    top: 0;
    z-index: 1;
    padding: 10px 12px;
    border-bottom-color: var(--line);
    background: #efede7;
}

.data-table td {
    padding: 10px 12px;
}

.data-table tbody tr:hover {
    background: #fffafa;
}

.row-danger {
    background: #fff7f7;
}

.project-grid {
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 14px;
}

.project-card {
    padding: 16px;
    border-top-width: 4px;
}

.project-card h2 {
    font-size: 22px;
}

.metric-row {
    gap: 12px;
}

.metric {
    padding: 14px 16px;
    border-top: 4px solid var(--red);
}

.metric span {
    font-size: 40px;
}

.dpr-grid {
    gap: 14px;
}

.dpr-cards {
    gap: 14px;
}

.dpr-card {
    padding: 14px;
    border-top-width: 4px;
}

.dpr-card__number {
    font-size: 42px;
}

.task-layout {
    grid-template-columns: minmax(0, 1fr) minmax(320px, 380px);
    gap: 18px;
    padding: 18px 24px 24px;
}

.task-side {
    top: 18px;
}

.task-passport__head {
    padding: 20px 22px 16px;
}

.task-passport__head h2 {
    max-width: 860px;
    font-size: 30px;
}

.task-passport__grid {
    grid-template-columns: minmax(240px, 1.35fr) minmax(160px, .8fr) minmax(160px, .8fr);
}

.task-passport__item {
    min-height: 92px;
    padding: 15px 18px;
}

.task-passport__item:hover {
    background: #fffdfd;
}

.task-tags {
    gap: 6px;
    padding: 12px 18px;
    background: var(--surface-soft);
}

.task-tags span {
    border-radius: 2px;
    background: #fff;
    font-size: 12px;
}

.integrations,
.comments,
.history,
.text-block,
.smart-box,
.comment-form {
    padding: 14px 18px;
}

.comment {
    padding: 12px 0;
}

.comment:hover {
    background: #fffdfd;
}

.stat-ring {
    padding: 18px;
}

.stat-list div {
    padding: 10px 16px;
}

.gantt-workspace {
    margin-left: 24px;
    margin-right: 24px;
}

.gantt-scroll {
    background: #fff;
}

@keyframes ui-enter {
    from {
        opacity: 0;
        transform: translateY(5px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.panel,
.project-card,
.dpr-card,
.task-card,
.metric,
.gantt-workspace {
    animation: ui-enter 180ms cubic-bezier(.2, .7, .2, 1) both;
}

@media (max-width: 1220px) {
    .task-layout {
        grid-template-columns: 1fr;
    }

    .project-layout,
    .project-layout.is-file-pane-collapsed {
        grid-template-columns: 1fr;
    }

    .project-file-pane {
        position: static;
        height: auto;
        max-height: none;
    }

    .task-side {
        position: static;
    }

    .task-passport__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .dpr-span-7,
    .dpr-span-6,
    .dpr-span-5 {
        grid-column: span 12;
    }
}

@media (max-width: 900px) {
    body {
        overflow: auto;
    }

    .app-shell {
        display: block;
        height: auto;
        min-height: 100vh;
    }

    .sidebar {
        position: sticky;
        top: 0;
        z-index: 30;
        width: 100%;
        border-right: 0;
        border-bottom: 1px solid var(--line);
    }

    .nav {
        display: flex;
        gap: 4px;
        padding: 8px 10px;
        overflow-x: auto;
    }

    .nav__group,
    .sidebar__footer,
    .nav-projects {
        display: none;
    }

    .nav__link {
        min-height: 34px;
        padding: 7px 10px;
        border-left: 0;
        border-bottom: 3px solid transparent;
        white-space: nowrap;
    }

    .nav__link:hover,
    .nav__link.is-active {
        transform: none;
        border-bottom-color: var(--red);
    }

    .main {
        display: block;
    }

    .topbar h1 {
        flex: 1 1 100%;
    }

    .topbar__actions,
    .topbar__meta {
        justify-content: flex-start;
    }

    .content {
        overflow: visible;
    }

    .content > .toolbar,
    .content > .project-head,
    .content > .project-grid,
    .content > .project-layout,
    .content > .metric-row,
    .content > .dpr-grid,
    .content > .schedule-board,
    .content > .panel,
    .content > form.panel,
    .content > .tabs,
    .task-layout,
    .gantt-workspace {
        margin-left: 14px;
        margin-right: 14px;
    }

    .filterbar {
        position: static;
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        padding: 10px 14px;
        overflow: visible;
    }

    .filterbar select {
        width: 100%;
        min-width: 0;
    }

    .filterbar .btn,
    .view-switch {
        width: 100%;
    }

    .filterbar .btn-red,
    .filterbar .btn--red {
        grid-column: 1 / -1;
    }

    .view-switch {
        display: grid;
        grid-template-columns: 1fr 1fr;
    }

    .view-btn {
        justify-content: center;
    }

    .fsep {
        display: none;
    }

    .task-layout {
        padding: 14px 0 18px;
    }

    .task-passport__grid,
    .form-grid,
    .detail-grid {
        grid-template-columns: 1fr;
    }

    .task-passport__item {
        min-height: 0;
        border-right: 0;
    }

    .tbl-head,
    .task-row {
        min-width: 840px;
    }

    .kanban {
        grid-template-columns: repeat(5, 260px);
        padding: 14px;
    }

    .schedule-board {
        grid-template-columns: repeat(5, 260px);
        margin-left: 14px;
        margin-right: 14px;
    }

    .dpr-grid {
        grid-template-columns: 1fr;
    }

    .dpr-span-12,
    .dpr-span-7,
    .dpr-span-6,
    .dpr-span-5 {
        grid-column: auto;
    }
}

@media (max-width: 560px) {
    .brand__text,
    .brand__sub {
        display: none;
    }

    .toolbar,
    .project-head,
    .panel__head,
    .gantt-toolbar {
        align-items: stretch;
        flex-direction: column;
    }

    .topbar__actions .btn,
    .toolbar__actions .btn,
    .filterbar .btn,
    .view-switch,
    .view-btn {
        width: 100%;
    }

    .filters,
    .filterbar {
        align-items: stretch;
        flex-direction: column;
    }

    .filters select,
    .filters input,
    .filterbar select {
        width: 100%;
    }

    .project-grid,
    .dpr-cards,
    .metric-row {
        grid-template-columns: 1fr;
    }
}

/* Final anti-orphan wrapping pass. Kept last to beat older repeated CSS sections. */
.topbar {
    flex-wrap: nowrap !important;
}

.topbar__title {
    display: grid;
    flex: 1 1 auto;
    min-width: 0;
    gap: 2px;
}

.topbar h1 {
    min-width: 0;
    overflow: hidden;
    flex-shrink: 1;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.topbar__subtitle {
    min-width: 0;
    margin: 0;
    overflow: hidden;
    color: var(--gray-light);
    font-size: 12px;
    line-height: 1.2;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.topbar__actions,
.topbar__meta {
    flex-shrink: 0;
    flex-wrap: nowrap !important;
}

.filterbar {
    display: flex;
    flex-wrap: nowrap !important;
    overflow-x: auto;
    scrollbar-width: none;
}

.filterbar::-webkit-scrollbar {
    display: none;
}

.tabs {
    flex-wrap: nowrap !important;
    overflow-x: auto;
    scrollbar-width: none;
}

.tabs::-webkit-scrollbar {
    display: none;
}

.task-info {
    min-width: 0;
}

.task-meta {
    flex-wrap: nowrap !important;
    overflow: hidden;
}

.task-meta .tid,
.task-meta .tag,
.task-meta .mini-ava,
.task-meta .sub-hint,
.task-meta .nav-badge {
    flex: 0 0 auto;
    white-space: nowrap;
}

.metric-row {
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
}

.project-contact-form {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr 90px;
    gap: 8px;
    padding: 12px;
    border-top: 1px solid var(--border);
    background: var(--surface-soft);
}

.project-contact-form .btn {
    width: 100%;
}

.project-contact-form {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr 100px;
    align-items: start;
    gap: 8px;
}

.project-contact-form input {
    min-height: 34px;
}

.project-contact-form .btn {
    width: 100%;
    height: 34px;
    min-height: 34px;
    align-self: start;
}

.contact-table .btn-ghost {
    color: var(--muted);
}

.contact-table .btn-ghost:hover {
    color: var(--red);
}

.nav-archive {
    display: block;
    margin-top: 6px;
    padding: 4px 8px;
    color: var(--muted);
    font-size: 12px;
    text-decoration: none;
}

.nav-archive:hover {
    color: var(--red);
}

.archive-banner {
    padding: 10px 12px;
    border-bottom: 3px solid var(--muted);
    background: var(--bg);
    color: var(--muted);
    font-size: 12px;
    font-weight: 700;
}

/* In-app user manual. */
.manual-link {
    display: block;
    min-height: 30px;
    padding: 6px 0;
    color: var(--muted);
    font-size: 12px;
    font-weight: 700;
}

.manual-link:hover,
.manual-link.is-active {
    color: var(--red);
}

.manual-page {
    display: grid;
    gap: 16px;
    max-width: 1120px;
}

.manual-lead {
    padding: 18px 20px;
    border-left: 4px solid var(--red);
    background: var(--surface);
}

.manual-lead h2,
.manual-section h2,
.manual-section h3 {
    margin: 0;
    font-family: "PT Sans Narrow", "PT Sans", sans-serif;
    letter-spacing: 0;
}

.manual-lead h2 {
    font-size: 28px;
}

.manual-lead p,
.manual-section p,
.manual-steps {
    margin: 8px 0 0;
}

.manual-toc {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.manual-toc a {
    min-height: 30px;
    padding: 6px 10px;
    border: 1px solid var(--border);
    background: var(--surface);
    color: var(--gray);
    font-size: 12px;
    font-weight: 700;
}

.manual-toc a:hover {
    border-color: var(--red);
    color: var(--red);
}

.manual-section {
    padding: 16px 18px;
    border: 1px solid var(--border);
    background: var(--surface);
}

.manual-section h2 {
    padding-bottom: 8px;
    border-bottom: 1px solid var(--line);
    font-size: 24px;
}

.manual-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    margin-top: 12px;
}

.manual-grid--wide {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.manual-grid article {
    min-height: 100%;
    padding: 12px;
    border-left: 3px solid var(--border);
    background: var(--surface-soft);
}

.manual-grid article h3 {
    font-size: 18px;
}

.manual-grid article p,
.manual-section > p,
.manual-steps {
    color: var(--gray);
}

.manual-steps {
    padding-left: 20px;
}

.manual-steps li + li {
    margin-top: 6px;
}

@media (max-width: 1100px) {
    .manual-grid--wide {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 680px) {
    .manual-grid,
    .manual-grid--wide {
        grid-template-columns: 1fr;
    }

    .manual-section {
        padding: 14px;
    }
}

/* Director dashboard manual positioning. */
.dpr-dashboard-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    flex: 0 0 auto;
}

.dpr-dashboard-actions .btn.is-active {
    border-color: var(--red);
    color: var(--red);
}

.dpr-director {
    position: relative;
}

.dpr-director.is-positioned {
    display: block;
}

.dpr-director.is-positioned .dpr-metrics {
    margin-bottom: 10px;
}

.dpr-director.is-reordering {
    background-image:
        linear-gradient(90deg, rgb(25 25 25 / 8%) 1px, transparent 1px),
        linear-gradient(rgb(25 25 25 / 8%) 1px, transparent 1px);
    background-position: 0 var(--dashboard-grid-top, 0);
    background-size: var(--dashboard-grid-step-x, 50%) var(--dashboard-grid-step-y, 290px);
}

.dpr-director [data-dashboard-widget] {
    position: relative;
}

.dpr-director.is-positioned [data-dashboard-widget] {
    display: flex;
    flex-direction: column;
    position: absolute;
    margin: 0;
    height: var(--dashboard-cell-height, 280px);
    transition: left .18s ease, top .18s ease, width .18s ease, height .18s ease;
}

.dpr-director.is-positioned .dpr-table-wrap {
    flex: 1 1 auto;
    max-height: none !important;
}

.dpr-director.is-positioned .dpr-table {
    height: 100%;
}

.dpr-matrix-filters {
    display: grid;
    grid-template-columns: minmax(160px, 1.2fr) minmax(120px, .8fr) minmax(160px, 1.2fr) minmax(130px, .8fr);
    gap: 8px;
    margin: 0 0 10px;
}

.dpr-matrix-filters label {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
}

.dpr-matrix-filters span {
    color: var(--muted);
    font-size: 12px;
}

.dpr-matrix-filters input,
.dpr-matrix-filters select {
    min-width: 0;
}

.dpr-window-grip,
.dpr-window-resize,
.dpr-window-span {
    position: absolute;
    bottom: -1px;
    display: none;
    width: 30px;
    height: 30px;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--border);
    background: var(--surface);
    color: var(--muted);
    touch-action: none;
    z-index: 4;
}

.dpr-window-grip {
    right: -1px;
    cursor: grab;
}

.dpr-window-span {
    right: 30px;
    font: inherit;
    font-size: 14px;
    font-weight: 700;
    line-height: 1;
    cursor: pointer;
}

.dpr-window-resize {
    right: 60px;
    font: inherit;
    font-size: 14px;
    font-weight: 700;
    line-height: 1;
    cursor: ns-resize;
}

.dpr-window-grip::before {
    content: "";
    width: 13px;
    height: 13px;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    box-shadow: 4px 4px 0 -2px currentColor, 8px 8px 0 -4px currentColor;
}

.dpr-director.is-reordering [data-dashboard-widget] {
    outline: 1px dashed var(--border);
    outline-offset: 3px;
}

.dpr-director.is-reordering .dpr-window-grip,
.dpr-director.is-reordering .dpr-window-resize,
.dpr-director.is-reordering .dpr-window-span {
    display: flex;
}

.dpr-director.is-reordering .dpr-window-grip:active {
    cursor: grabbing;
}

.dpr-director.is-reordering .dpr-window-span:disabled {
    opacity: .35;
    cursor: default;
}

.dpr-director.is-reordering [data-dashboard-widget].is-dashboard-merged .dpr-window-span {
    border-color: var(--red);
    color: var(--red);
}

.dpr-director.is-reordering .dpr-window-resize {
    border-color: var(--red);
    color: var(--red);
    background: #fff7f7;
    box-shadow: 0 2px 8px rgb(168 26 26 / 18%);
}

.dpr-director.is-reordering [data-dashboard-widget].is-dashboard-dragging {
    opacity: 0.88;
    outline-color: var(--red);
    box-shadow: 0 14px 32px rgb(0 0 0 / 16%);
    transition: none;
}

.dpr-director.is-dragging-widget {
    user-select: none;
}

.dpr-director.is-resizing-widget {
    user-select: none;
}

@media (max-width: 680px) {
    .dpr-dashboard-actions {
        width: 100%;
        justify-content: stretch;
    }

    .dpr-dashboard-actions .btn {
        flex: 1 1 0;
    }

    .dpr-matrix-filters {
        grid-template-columns: 1fr;
    }
}

/* Guided task tutorial. */
.tour-start {
    width: 100%;
    min-height: 34px;
    margin: 6px 0 8px;
    border: 1px solid var(--border);
    background: var(--surface);
    color: var(--text);
    font: inherit;
    font-size: 12px;
    font-weight: 700;
    cursor: pointer;
}

.tour-start:hover {
    border-color: var(--red);
    color: var(--red);
}

.task-tour,
.task-tour__shade,
.task-tour__focus,
.task-tour__card {
    position: fixed;
    z-index: 9000;
}

.task-tour__shade {
    inset: 0;
    background: rgba(16, 18, 22, 0.62);
}

.task-tour__focus {
    border: 2px solid var(--red);
    box-shadow: 0 0 0 9999px rgba(16, 18, 22, 0.18), 0 10px 30px rgba(0, 0, 0, 0.22);
    pointer-events: none;
}

.task-tour__card {
    max-width: calc(100vw - 32px);
    padding: 16px;
    border: 1px solid var(--border);
    border-top: 4px solid var(--red);
    background: var(--surface);
    color: var(--text);
    box-shadow: 0 18px 48px rgba(0, 0, 0, 0.28);
}

.task-tour__card--center {
    left: 50%;
    top: 50%;
    width: min(420px, calc(100vw - 32px));
    transform: translate(-50%, -50%);
}

.task-tour__eyebrow {
    margin-bottom: 8px;
    color: var(--muted);
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
}

.task-tour__card h2 {
    margin: 0 0 8px;
    font-size: 22px;
    line-height: 1.1;
}

.task-tour__card p {
    margin: 0;
    color: var(--muted);
    font-size: 14px;
    line-height: 1.45;
}

.task-tour__actions {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    margin-top: 16px;
}

.task-tour__actions .btn:disabled {
    cursor: default;
    opacity: 0.45;
}

@media (max-width: 640px) {
    .task-tour__card {
        left: 16px !important;
        right: 16px;
        top: auto !important;
        bottom: 16px;
        width: auto !important;
        transform: none;
    }

    .task-tour__actions {
        justify-content: stretch;
    }

    .task-tour__actions .btn {
        flex: 1 1 0;
    }
}

@media (max-width: 900px) {
    .topbar h1 {
        flex: 1 1 auto;
    }

    .filterbar {
        display: flex;
        grid-template-columns: none;
    }

    .filterbar select,
    .filterbar .btn,
    .view-switch {
        flex: 0 0 auto;
        width: auto;
    }

    .metric-row {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    }

    .project-contact-form {
        grid-template-columns: 1fr 1fr;
    }

    .project-contact-form .btn {
        grid-column: 1 / -1;
    }
}

@media (max-width: 560px) {
    .metric-row {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    .project-contact-form {
        grid-template-columns: 1fr;
    }
}

/* DPR director dashboard. */
.dpr-toolbar {
    align-items: center;
}

.dpr-filter {
    flex: 1 1 auto;
}

.dpr-filter select {
    min-width: 260px;
}

.dpr-director {
    gap: 10px;
}

.dpr-director .dpr-metrics {
    grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
    gap: 10px;
}

.dpr-director .dpr-metric {
    min-width: 0;
    padding: 12px 14px;
    border-radius: 2px;
}

.dpr-director .dpr-metric strong {
    font-size: 34px;
}

.dpr-director .dpr-metric span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.dpr-metric--projects {
    border-top-color: var(--blue);
}

.dpr-metric--projects strong {
    color: var(--blue);
}

.dpr-metric--approval {
    border-top-color: var(--amber);
}

.dpr-metric--approval strong {
    color: var(--amber);
}

.dpr-two-col {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 10px;
    align-items: start;
}

.dpr-stack {
    display: grid;
    min-width: 0;
    gap: 10px;
}

.dpr-block {
    min-width: 0;
    overflow: hidden;
}

.dpr-block__head {
    min-height: 34px;
    padding: 8px 10px;
    border-bottom: 2px solid var(--red);
}

.dpr-block__head h2 {
    overflow: hidden;
    font-family: "PT Sans", sans-serif;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .08em;
    line-height: 1.2;
    text-overflow: ellipsis;
    text-transform: uppercase;
    white-space: nowrap;
}

.dpr-block__head > span {
    min-width: 24px;
    justify-content: center;
}

.dpr-table-wrap {
    max-height: 188px;
    overflow: auto;
}

.dpr-table-wrap--wide {
    max-height: 220px;
}

.dpr-table {
    min-width: 100%;
    table-layout: fixed;
}

.dpr-table th {
    padding: 6px 8px;
    font-size: 12px;
    line-height: 1.2;
    overflow-wrap: anywhere;
    white-space: normal;
}

.dpr-table td {
    padding: 6px 8px;
    font-size: 12px;
    line-height: 1.25;
    overflow-wrap: anywhere;
}

.dpr-people-matrix {
    width: max-content;
    min-width: 100%;
    table-layout: auto;
}

.dpr-people-matrix .dpr-matrix-person {
    position: sticky;
    left: 0;
    z-index: 2;
    width: 190px;
    min-width: 190px;
    max-width: 190px;
    background: #fff;
    text-align: left;
    box-shadow: 1px 0 0 var(--line);
}

.dpr-people-matrix thead .dpr-matrix-person {
    z-index: 3;
    background: var(--gray-bg);
}

.dpr-matrix-person small,
.dpr-matrix-object small {
    display: block;
    margin-top: 2px;
    color: var(--gray-light);
    font-size: 11px;
    font-weight: 700;
}

.dpr-matrix-object {
    width: 156px;
    min-width: 156px;
    max-width: 156px;
    vertical-align: bottom;
}

.dpr-matrix-cell {
    min-width: 156px;
    vertical-align: top;
    border-left: 3px solid transparent;
    cursor: pointer;
}

.dpr-matrix-cell strong,
.dpr-matrix-cell span,
.dpr-matrix-cell small,
.dpr-matrix-cell em {
    display: block;
}

.dpr-matrix-cell strong {
    color: var(--ink);
    font-size: 12px;
}

.dpr-matrix-cell span {
    margin-top: 2px;
    color: var(--red);
    font-weight: 700;
}

.dpr-matrix-cell small {
    margin-top: 2px;
    color: var(--gray);
}

.dpr-matrix-cell em {
    margin-top: 3px;
    color: var(--gray-light);
    font-style: normal;
    font-weight: 700;
}

.dpr-matrix-cell--ok {
    background: #f7fbf8;
    border-left-color: var(--green);
}

.dpr-matrix-cell--warn {
    background: #fff8e6;
    border-left-color: var(--amber);
}

.dpr-matrix-cell--bad {
    background: #fff1f1;
    border-left-color: var(--red);
}

.dpr-matrix-empty {
    min-width: 156px;
    background: #fafafa;
}

.dpr-row-danger > td:first-child {
    border-left: 3px solid var(--red);
}

.dpr-row-warn > td:first-child {
    border-left: 3px solid var(--amber);
}

.dpr-empty-row td {
    color: var(--gray-light);
}

.dpr-empty {
    display: inline-flex;
    padding: 8px 0;
    color: var(--gray-light);
    font-weight: 700;
}

.dpr-state {
    display: inline-flex;
    align-items: center;
    min-height: 20px;
    padding: 1px 6px;
    border: 1px solid currentColor;
    border-radius: 2px;
    font-size: 12px;
    font-weight: 700;
    white-space: nowrap;
}

.dpr-state--green {
    color: var(--green);
}

.dpr-state--amber,
.metric-value--warn {
    color: var(--amber) !important;
    font-weight: 700;
}

.dpr-state--red {
    color: var(--red);
}

.dpr-load-bar {
    display: block;
    width: 108px;
    min-width: 108px;
}

.dpr-load-bar span {
    display: block;
}

@media (max-width: 1180px) {
    .dpr-director .dpr-metrics {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    }

    .dpr-two-col {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 680px) {
    .dpr-filter select {
        min-width: 190px;
    }

    .dpr-director .dpr-metrics {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    .dpr-director .dpr-metric strong {
        font-size: 28px;
    }
}

/* Anti-orphan wrapping pass: keep headers, filters, tabs and compact forms in one line. */
.topbar {
    flex-wrap: nowrap !important;
}

.topbar h1 {
    min-width: 0;
    overflow: hidden;
    flex-shrink: 1;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.topbar__actions,
.topbar__meta {
    flex-shrink: 0;
    flex-wrap: nowrap !important;
}

.filterbar {
    display: flex;
    flex-wrap: nowrap !important;
    overflow-x: auto;
    scrollbar-width: none;
}

.filterbar::-webkit-scrollbar {
    display: none;
}

.tabs {
    flex-wrap: nowrap !important;
    overflow-x: auto;
    scrollbar-width: none;
}

.tabs::-webkit-scrollbar {
    display: none;
}

.task-info {
    min-width: 0;
}

.task-meta {
    flex-wrap: nowrap !important;
    overflow: hidden;
}

.task-meta .tid,
.task-meta .tag,
.task-meta .mini-ava,
.task-meta .sub-hint,
.task-meta .nav-badge {
    flex: 0 0 auto;
    white-space: nowrap;
}

.metric-row {
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
}

.project-contact-form {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr 90px;
    gap: 8px;
    padding: 12px;
    border-top: 1px solid var(--border);
    background: var(--surface-soft);
}

.project-contact-form .btn {
    width: 100%;
}

@media (max-width: 900px) {
    .topbar h1 {
        flex: 1 1 auto;
    }

    .filterbar {
        display: flex;
        grid-template-columns: none;
    }

    .filterbar select,
    .filterbar .btn,
    .view-switch {
        flex: 0 0 auto;
        width: auto;
    }

    .metric-row {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    }

    .project-contact-form {
        grid-template-columns: 1fr 1fr;
    }

    .project-contact-form .btn {
        grid-column: 1 / -1;
    }
}

@media (max-width: 560px) {
    .metric-row {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    .project-contact-form {
        grid-template-columns: 1fr;
    }
}

/* Header red line is owned by the shell, so it cannot split between brand and topbar. */
@media (min-width: 901px) {
    :root {
        --shell-header-height: 56px;
    }

    .app-shell {
        position: relative;
    }

    .app-shell::before {
        content: "";
        display: block !important;
        position: fixed;
        top: calc(var(--shell-header-height) - 3px);
        left: 0;
        z-index: 80;
        width: 100vw;
        height: 3px;
        pointer-events: none;
        background: var(--red);
    }

    .brand {
        align-items: center;
        height: var(--shell-header-height);
        min-height: var(--shell-header-height);
        border-bottom: 0 !important;
    }

    .topbar {
        flex: 0 0 var(--shell-header-height);
        height: var(--shell-header-height);
        min-height: var(--shell-header-height);
        border-bottom: 0 !important;
    }
}

.project-roles {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 8px;
}

.project-roles span {
    display: inline-flex;
    gap: 4px;
    align-items: center;
    min-height: 20px;
    padding: 2px 8px;
    border-radius: 2px;
    background: var(--surface-soft);
    color: var(--muted);
    font-size: 12px;
    font-weight: 700;
}

.project-roles strong {
    color: var(--black);
}

.project-head__actions {
    display: flex;
    flex: 0 0 auto;
    flex-wrap: wrap;
    gap: 8px;
    justify-content: flex-end;
}

.contact-table {
    min-width: 780px;
}

.contact-table form {
    margin: 0;
}

.contact-table__new td {
    background: var(--surface-soft);
}

@media (max-width: 900px) {
    .app-shell::before {
        display: none !important;
    }

    .brand,
    .topbar {
        border-bottom: 0 !important;
    }
}

/* Project task page polish. Keep this at the end: older CSS layers redefine these controls. */
.btn,
.btn-outline,
.btn-red,
.btn--red {
    border-radius: 3px !important;
}

.topbar__actions .btn-red,
.topbar__actions .btn--red,
.toolbar .btn--red,
.toolbar .btn-red,
.task-template-actions .btn {
    border-radius: 4px !important;
}

.tabs {
    gap: 0;
    margin-bottom: 14px;
    padding: 0;
    border-bottom: 1px solid var(--border);
}

.tabs a {
    min-height: 0;
    margin-bottom: -1px;
    padding: 9px 16px;
    border: 0 !important;
    border-bottom: 3px solid transparent !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: var(--muted);
    font-size: 13px;
    font-weight: 400;
    transform: none !important;
}

.tabs a:hover {
    border-bottom-color: var(--border) !important;
    color: var(--black);
}

.tabs a.is-active {
    border-bottom-color: var(--red) !important;
    color: var(--black);
    font-weight: 700;
}

.task-template-panel .panel__head > .task-template-hint {
    min-height: 0;
    padding: 0;
    border: none;
    background: transparent;
    color: var(--muted);
    font-size: 12px;
    font-style: italic;
    font-weight: 400;
    letter-spacing: 0;
    text-transform: none;
}

.project-task-panel .panel__head > .task-count-badge {
    min-height: 0;
    padding: 2px 8px;
    border-radius: 10px;
    background: var(--red);
    color: var(--white);
    cursor: pointer;
    font-family: inherit;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.35;
}

.cell-empty {
    color: var(--muted);
}

.project-task-table {
    min-width: 1060px;
    table-layout: fixed;
}

.project-task-table__id {
    width: 68px;
}

.project-task-table__title {
    width: 400px;
}

.project-task-table__status {
    width: 120px;
}

.project-task-table__discipline {
    width: 105px;
}

.project-task-table__deadline {
    width: 105px;
}

.project-task-table__responsible {
    width: 160px;
}

.project-task-table__progress {
    width: 110px;
}

.project-task-title strong {
    display: block;
    padding-left: calc(var(--task-outline-level, 0) * 16px);
}

.project-task-title .subtask-note {
    display: inline-flex;
    margin-top: 5px;
    padding: 2px 7px;
    border-left: 3px solid var(--amber);
    background: var(--amber-light);
    color: #6A4308;
    font-size: 12px;
    font-weight: 700;
}

.project-task-table__subtask-row td:first-child {
    border-left: 4px solid var(--amber);
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 1ms !important;
        animation-iteration-count: 1 !important;
        scroll-behavior: auto !important;
        transition-duration: 1ms !important;
    }
}

@media (max-width: 900px) {
    .project-file-bar {
        margin-left: 14px;
        margin-right: 14px;
    }

    .project-layout {
        margin-left: 14px;
        margin-right: 14px;
    }

    .project-tabs {
        max-width: calc(100% - 28px);
    }

    .project-file-pane {
        grid-template-columns: 1fr;
        min-height: 0;
    }

    .project-file-pane__toggle {
        width: 100%;
        min-height: 38px;
        border-right: 0;
        border-bottom: 1px solid var(--line);
    }

    .project-file-pane__toggle span {
        writing-mode: horizontal-tb;
        transform: none;
    }

    .project-file-pane.is-collapsed {
        height: auto;
        min-height: 0;
    }

    .project-file-pane.is-collapsed .project-file-pane__toggle {
        border-bottom: 0;
    }

    .project-tab-actions,
    .csv-import-form {
        justify-content: flex-start;
    }

    .csv-import-form input[type="file"] {
        width: 100%;
    }

    .sheet-wrap {
        max-height: none;
    }

    .gantt-workspace {
        height: auto;
        min-height: 620px;
    }

    .gantt-frame {
        grid-template-columns: 1fr;
    }

    .gantt-task-list {
        max-height: 240px;
        border-right: 0;
        border-bottom: 1px solid var(--line);
    }

    .gantt-scroll {
        min-height: 500px;
    }

    .gantt-box {
        min-width: 1120px;
    }

    .project-folder-map {
        margin-left: 14px;
        margin-right: 14px;
    }

    .link-row {
        grid-template-columns: 1fr;
    }

    .folder-tree__link {
        grid-template-columns: 1fr;
        gap: 2px;
    }
}

.metric {
    padding: 10px 12px;
    border-top-width: 3px;
}

.metric span {
    font-size: 28px;
    color: #9f1f1f;
}

.metric strong {
    margin-top: 4px;
    font-size: 13px;
}

.dpr-card__number {
    font-size: 30px;
}

.stat-ring strong {
    font-size: 30px;
}

.task-passport__grid {
    grid-template-columns: minmax(280px, 1.45fr) minmax(170px, .8fr) minmax(170px, .8fr);
}

.task-passport__item--wide {
    grid-column: span 2;
}

.task-tags {
    background: #faf9f6;
}

.task-tags span,
.tag-from-me {
    border: 1px solid var(--line-soft, #ece8df);
    background: #fff;
    color: #5f5a52;
}

.task-tags .task-tag--custom,
.task-tag--custom {
    border: 1px solid var(--task-tag-color, #5B6472);
    background: #ffffff;
    color: var(--task-tag-color, #5B6472);
}

a.task-tag--custom {
    cursor: pointer;
}

a.task-tag--custom:hover {
    border-color: var(--task-tag-color, #5B6472);
    background: color-mix(in srgb, var(--task-tag-color, #5B6472) 8%, #ffffff);
    text-decoration: none;
}

.task-tags--inline,
.task-card__tags {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    margin-top: 6px;
    background: transparent;
}

.assigned-issues {
    margin: 14px 24px;
}

.task-template-panel {
    margin: 0 24px 14px;
}

.task-template-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding: 12px 16px;
}

.task-template-actions form {
    margin: 0;
}

.gantt-plan {
    height: calc(100vh - 180px);
    min-height: 660px;
}

.gantt-plan__scroll {
    flex: 1;
    min-height: 0;
    overflow: auto;
    background: #fff;
}

.gantt-plan__grid {
    display: grid;
    grid-template-columns: minmax(420px, 460px) var(--timeline-width);
    min-width: calc(440px + var(--timeline-width));
}

.gantt-plan__left {
    position: sticky;
    left: 0;
    z-index: 3;
    border-right: 1px solid var(--line, var(--border));
    background: #fbfaf7;
}

.gantt-plan__left-head,
.gantt-plan__left-row {
    display: grid;
    grid-template-columns: minmax(210px, 1fr) 72px 92px 52px;
    align-items: center;
    gap: 8px;
    min-height: var(--row-height);
    padding: 0 12px;
    border-bottom: 1px solid var(--line-soft, #eee8dc);
}

.gantt-plan__left-head {
    position: sticky;
    top: 0;
    z-index: 5;
    min-height: 78px;
    background: #efede7;
    color: var(--muted);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.gantt-plan__left-row {
    color: var(--gray);
    font-size: 12px;
}

.gantt-plan__left-row:hover {
    background: #fffafa;
}

.gantt-plan__left-row strong,
.gantt-plan__left-row span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.gantt-plan__left-row strong {
    color: var(--black);
    font-size: 13px;
    padding-left: calc(var(--task-outline-level, 0) * 14px);
}

.gantt-plan__timeline {
    position: relative;
}

.gantt-plan__scale {
    position: sticky;
    top: 0;
    z-index: 2;
    min-height: 78px;
    border-bottom: 1px solid var(--line, var(--border));
    background: #f8f7f3;
}

.gantt-plan__months {
    display: flex;
    height: 36px;
    border-bottom: 1px solid var(--line-soft, #eee8dc);
}

.gantt-plan__months span {
    display: flex;
    align-items: center;
    padding-left: 10px;
    border-right: 1px solid var(--line-soft, #eee8dc);
    color: var(--gray);
    font-size: 12px;
    font-weight: 700;
}

.gantt-plan__weeks {
    position: relative;
    height: 42px;
}

.gantt-plan__weeks span {
    position: absolute;
    top: 12px;
    color: var(--muted);
    font-size: 12px;
}

.gantt-plan__rows {
    position: relative;
    background-image: repeating-linear-gradient(
        to right,
        #fff 0,
        #fff 29px,
        #f0eee7 30px
    );
}

.gantt-plan__row {
    position: relative;
    height: var(--row-height);
    border-bottom: 1px solid var(--line-soft, #eee8dc);
}

.gantt-plan__today {
    position: absolute;
    top: 0;
    bottom: 0;
    width: 2px;
    background: var(--red);
    opacity: .7;
    z-index: 2;
}

.gantt-plan__links {
    position: absolute;
    inset: 0 auto auto 0;
    z-index: 1;
    overflow: visible;
    pointer-events: none;
}

.gantt-plan__link {
    fill: none;
    stroke: #6F7A8A;
    stroke-width: 1.25;
    stroke-linecap: round;
    stroke-linejoin: round;
    opacity: .46;
    vector-effect: non-scaling-stroke;
}

.gantt-plan__link-arrow path {
    fill: #6F7A8A;
}

.gantt-plan__bar {
    position: absolute;
    top: 13px;
    z-index: 3;
    display: flex;
    align-items: center;
    min-height: 26px;
    padding: 0 9px;
    border: 1px solid #9f1f1f;
    background:
        linear-gradient(90deg, rgba(204, 31, 31, .24) var(--progress), transparent var(--progress)),
        #fff;
    color: #4a1e1e;
    font-size: 12px;
    font-weight: 700;
    overflow: hidden;
}

.gantt-plan__bar:hover {
    border-color: var(--red);
    background:
        linear-gradient(90deg, rgba(204, 31, 31, .32) var(--progress), transparent var(--progress)),
        #fff7f7;
}

.gantt-plan__bar--late {
    border-color: var(--red);
    background:
        linear-gradient(90deg, rgba(204, 31, 31, .34) var(--progress), transparent var(--progress)),
        #fff1f1;
}

.gantt-plan__bar span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

@media (max-width: 1220px) {
    .task-passport__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .task-passport__item--wide {
        grid-column: span 2;
    }
}

@media (max-width: 900px) {
    .assigned-issues,
    .task-template-panel,
    .gantt-plan {
        margin-left: 14px;
        margin-right: 14px;
    }

    .task-passport__grid {
        grid-template-columns: 1fr;
    }

    .task-passport__item--wide {
        grid-column: auto;
    }

    .gantt-plan {
        height: auto;
        min-height: 620px;
    }
}

@media (max-width: 560px) {
    .task-passport__item--wide {
        grid-column: auto;
    }

    .task-template-actions {
        display: grid;
    }
}

/* Locia design-system pass */

html,
body {
    min-height: 100%;
}

body {
    margin: 0;
    overflow: hidden;
    background: var(--bg);
    color: var(--gray-dark);
    font-family: "PT Sans", Arial, sans-serif;
    font-size: 13px;
    line-height: 1.55;
    letter-spacing: 0;
}

*,
*::before,
*::after {
    box-sizing: border-box;
}

a {
    color: inherit;
    text-decoration: none;
}

button,
input,
select,
textarea {
    font: inherit;
}

h1,
h2 {
    margin: 0;
    color: var(--black);
    font-family: "PT Sans Narrow", "PT Sans", sans-serif;
    font-weight: 700;
    letter-spacing: 0;
}

h3 {
    margin: 0;
    color: var(--black);
    font-family: "PT Sans", Arial, sans-serif;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: 0;
}

.app-shell {
    display: flex;
    height: 100vh;
    min-height: 0;
}

.app-shell::before {
    display: none !important;
}

.sidebar {
    width: 216px;
    flex: 0 0 216px;
    border-right: 1px solid var(--border);
    background: var(--white);
}

.brand {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    padding: 13px 18px;
    border-bottom: 3px solid var(--red);
    background: var(--white);
}

.brand__mark {
    color: var(--red);
    font-family: "PT Sans Narrow", "PT Sans", sans-serif;
    font-size: 24px;
    font-weight: 700;
    line-height: 1;
}

.brand__text {
    display: block;
    color: var(--gray-light);
    font-family: "PT Sans", Arial, sans-serif;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.brand__sub {
    display: block;
    margin-top: 4px;
    color: var(--gray-light);
    font-size: 12px;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.nav {
    padding: 8px 0;
}

.nav__group {
    margin: 0;
    padding: 12px 20px 4px;
    color: #999999;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
}

.nav__link {
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 31px;
    padding: 7px 20px;
    border-left: 3px solid transparent;
    color: #222222;
    font-size: 13px;
    transition: background-color var(--fast), color var(--fast), border-color var(--fast);
}

.nav__link:hover {
    border-left-color: transparent;
    background: var(--bg);
    color: var(--black);
}

.nav__link.is-active {
    border-left-color: var(--red);
    background: var(--red-light);
    color: var(--red);
    font-weight: 700;
}

.global-search {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 34px;
    gap: 6px;
    padding: 10px 12px 8px;
}

.global-search input {
    min-width: 0;
    min-height: 34px;
    padding: 7px 10px;
    border: 1px solid #d9dce6;
    background: #fff;
    color: var(--black);
    font-size: 12px;
    font-weight: 600;
}

.global-search input:focus {
    border-color: var(--red);
    outline: none;
    box-shadow: 0 0 0 3px rgba(168, 26, 26, .10);
}

.global-search button {
    min-width: 34px;
    min-height: 34px;
    padding: 0;
    border: 1px solid var(--red);
    background: var(--red);
    color: #fff;
    font-size: 17px;
    font-weight: 800;
    line-height: 1;
}

.global-search button:hover {
    background: var(--red-hover);
}

.nav-projects {
    display: grid;
    gap: 1px;
    padding: 4px 8px 8px 17px;
}

.nav-project {
    display: grid;
    grid-template-columns: minmax(0, 44px) minmax(0, 1fr) auto;
    gap: 7px;
    align-items: center;
    min-height: 28px;
    padding: 4px 7px;
    border-left: 3px solid transparent;
    border-radius: 0;
    color: var(--gray);
}

.nav-project:hover,
.nav-project.is-active {
    border-left-color: var(--red);
    background: var(--red-light);
    color: var(--black);
}

.nav-project span {
    overflow: hidden;
    color: var(--red);
    font-family: monospace;
    font-size: 12px;
    font-weight: 700;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.nav-project small {
    overflow: hidden;
    color: var(--gray-dark);
    font-size: 12px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.nav-project b,
.nav-badge,
.counter {
    min-width: 18px;
    padding: 1px 6px;
    border-radius: 2px;
    background: var(--border);
    color: var(--gray);
    font-size: 12px;
    font-weight: 700;
    text-align: center;
}

.sidebar__footer {
    padding: 12px 20px;
    border-top: 1px solid var(--border);
    background: var(--white);
}

.user-mini {
    display: grid;
    grid-template-columns: 30px minmax(0, 1fr);
    gap: 8px;
    align-items: center;
    margin-bottom: 8px;
}

.avatar,
.mini-ava {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 26px;
    border: 0;
    border-radius: 50% !important;
    background: var(--mini-ava-bg, var(--red));
    color: var(--white);
    font-family: "PT Sans", Arial, sans-serif;
    font-size: 12px;
    font-weight: 700;
}

.avatar {
    width: 30px;
    height: 30px;
}

.user-mini strong,
.user-mini span {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.user-mini strong {
    color: var(--black);
    font-size: 12px;
}

.user-mini span,
.link-muted,
.muted {
    color: var(--gray-light);
    font-size: 12px;
}

.main {
    display: flex;
    flex: 1;
    flex-direction: column;
    min-width: 0;
    min-height: 0;
    padding: 0;
}

.topbar {
    position: relative;
    display: flex;
    flex: 0 0 48px;
    align-items: center;
    gap: 12px;
    height: 48px;
    margin: 0;
    padding: 0 24px;
    border-bottom: 3px solid var(--red);
    background: var(--white);
}

.topbar::after {
    content: none;
    display: none;
}

.topbar h1 {
    flex: 1;
    font-size: 18px;
    font-weight: 700;
    line-height: 1;
}

.topbar__actions,
.topbar__meta,
.toolbar__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
    justify-content: flex-end;
}

.topbar__meta {
    color: var(--gray-light);
    font-size: 12px;
}

.topbar__actions {
    min-width: 0;
    overflow-x: auto;
    scrollbar-width: none;
}

.topbar__actions::-webkit-scrollbar {
    display: none;
}

.topbar__actions .btn,
.topbar__actions form .btn {
    min-height: 32px;
    padding: 6px 11px;
    border-color: #C7D0DF;
    background: #FFFFFF;
    color: #2F3B52;
    font-size: 12px;
    font-weight: 800;
    box-shadow: 0 1px 2px rgba(17, 24, 39, .04);
}

.topbar__actions .btn:hover,
.topbar__actions form .btn:hover {
    border-color: #A81A1A;
    color: #A81A1A;
}

.topbar__actions .btn-red,
.topbar__actions .btn--red {
    border-color: var(--red);
    background: var(--red);
    color: #FFFFFF;
}

.topbar__actions .btn-red:hover,
.topbar__actions .btn--red:hover {
    border-color: var(--red-hover);
    background: var(--red-hover);
    color: #FFFFFF;
}

.topbar__meta .counter {
    min-height: 32px;
    padding: 6px 10px;
    border: 1px solid #C7D0DF;
    background: #FFFFFF;
    color: #2F3B52;
    font-size: 12px;
    font-weight: 800;
    box-shadow: 0 1px 2px rgba(17, 24, 39, .04);
}

.topbar__meta a.counter:hover {
    border-color: #A81A1A;
    color: #A81A1A;
}

.topbar__meta .counter--hot {
    border-color: #A81A1A;
    background: #FFF1F1;
    color: #A81A1A;
}

.notification-center {
    display: grid;
    gap: 16px;
}

.notification-list {
    display: grid;
    gap: 10px;
}

.notification-item {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 12px;
    align-items: center;
    padding: 12px;
    border: 1px solid var(--border);
    border-left: 4px solid #C7D0DF;
    background: var(--white);
}

.notification-item.is-unread {
    border-left-color: var(--red);
    background: #FFF9F9;
}

.notification-item__body {
    display: grid;
    gap: 6px;
    min-width: 0;
}

.notification-item__body p {
    margin: 0;
    color: var(--black);
    font-weight: 700;
}

.notification-item__body a {
    color: var(--red);
    font-size: 12px;
    font-weight: 800;
}

.notification-item__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    color: var(--gray-light);
    font-size: 12px;
    font-weight: 700;
}

.notification-item__meta span {
    padding: 2px 6px;
    border: 1px solid var(--border);
    background: var(--bg);
}

.notification-item__read {
    color: var(--gray-light);
    font-size: 12px;
    font-weight: 800;
}

.content {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    background: var(--bg);
}

.search-page {
    display: grid;
    gap: 18px;
    padding: 22px;
}

.search-page__form {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 10px;
    max-width: 920px;
}

.search-page__form input {
    min-height: 42px;
    font-size: 16px;
    font-weight: 700;
}

.search-summary {
    color: var(--gray-light);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.search-group {
    display: grid;
    gap: 10px;
    max-width: 980px;
}

.search-group h2 {
    font-size: 18px;
}

.search-results {
    display: grid;
    gap: 8px;
}

.search-result {
    display: grid;
    gap: 4px;
    padding: 12px 14px;
    border: 1px solid var(--line);
    background: #fff;
    box-shadow: var(--shadow-sm);
}

.search-result:hover {
    border-color: rgba(168, 26, 26, .28);
    background: #fffafa;
}

.search-result__type,
.search-result small {
    color: var(--gray-light);
    font-size: 12px;
    font-weight: 700;
}

.search-result__type {
    letter-spacing: .08em;
    text-transform: uppercase;
}

.search-result strong {
    color: var(--black);
    font-size: 15px;
    line-height: 1.25;
}

.project-summary-metrics {
    grid-template-columns: repeat(auto-fit, minmax(116px, 1fr)) !important;
    gap: 8px;
}

.project-summary-metrics .metric {
    min-height: 78px;
    padding: 10px 12px;
}

.project-summary-metrics a.metric {
    color: inherit;
    cursor: pointer;
    text-decoration: none;
}

.project-summary-metrics a.metric:hover {
    border-color: var(--red);
    background: var(--surface-soft);
    box-shadow: var(--shadow-sm);
    transform: translateY(-1px);
}

.project-summary-metrics .metric span {
    font-size: clamp(20px, 1.7vw, 24px);
    line-height: .98;
    white-space: nowrap;
}

.project-summary-metrics .metric strong {
    font-size: 12px;
    line-height: 1.2;
}

.project-control-panel {
    display: grid;
    gap: 14px;
}

.project-control-panel > .metric-row {
    margin: 0 var(--space-3, 12px);
}

.project-control-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(320px, 100%), 1fr));
    gap: 12px;
    box-sizing: border-box;
    padding: 0 var(--space-3, 12px);
}

.project-control-grid > div,
.project-control-risks {
    min-width: 0;
}

.project-control-grid h3,
.project-control-risks h3 {
    margin: 0 0 8px;
    color: var(--ui-text);
    font-family: var(--font-heading);
    font-size: var(--text-lg);
}

.project-control-grid .data-table {
    min-width: 0;
}

.project-control-grid .data-table th,
.project-control-grid .data-table td {
    white-space: normal;
    overflow-wrap: anywhere;
}

.process-control-grid {
    align-items: start;
}

.process-control-grid .table-wrap {
    width: 100%;
    min-width: 0;
}

.process-control-grid small {
    display: block;
    margin-top: 2px;
    color: var(--ui-muted);
    font-size: var(--text-xs);
    line-height: 1.25;
}

.process-control-bottlenecks {
    margin-top: -2px;
}

.project-control-risks ul {
    display: grid;
    gap: 8px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.project-control-risks {
    box-sizing: border-box;
    padding: 0 var(--space-3, 12px) var(--space-3, 12px);
}

.risk-item {
    display: grid;
    gap: 2px;
    padding: 10px 12px;
    border: 1px solid var(--ui-line);
    border-left-width: 3px;
    border-radius: var(--radius-sm);
    background: var(--ui-surface);
}

.risk-item--red {
    border-left-color: var(--red);
}

.risk-item--yellow {
    border-left-color: #b7791f;
}

.risk-item--green,
.metric--green {
    border-left-color: var(--green);
}

.metric--yellow {
    border-color: #d69e2e !important;
}

.metric--red {
    border-color: var(--red) !important;
}

.mail-settings-form {
    padding: 0 var(--space-4, 16px) var(--space-4, 16px);
}

.mail-template-subject {
    max-width: 420px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.mail-template-code,
.copy-code {
    font-family: var(--font-mono);
    font-size: var(--text-sm);
}

.mail-template-code {
    resize: vertical;
}

.mail-template-vars {
    display: grid;
    gap: 10px;
    padding: 0 var(--space-4, 16px) var(--space-4, 16px);
}

.copy-code {
    appearance: none;
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    padding: 2px 6px;
    border: 1px solid var(--ui-line);
    border-radius: var(--radius-sm);
    background: var(--ui-surface-soft);
    color: var(--ink);
    line-height: 1.35;
    cursor: pointer;
    user-select: all;
}

.motivation-control {
    display: grid;
    gap: 12px;
}

.motivation-bottlenecks {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(260px, 100%), 1fr));
    gap: 8px;
}

.motivation-bottleneck {
    display: grid;
    gap: 4px;
    padding: 10px 12px;
    border: 1px solid var(--line);
    background: var(--surface-soft);
}

.motivation-bottleneck span,
.motivation-bottleneck small {
    color: var(--muted);
    font-size: var(--text-sm);
}

.motivation-bottleneck strong {
    color: var(--ink);
    font-size: var(--text-name);
}

.motivation-bottleneck--danger {
    border-left: 3px solid var(--red);
}

.motivation-bottleneck--warning {
    border-left: 3px solid var(--amber);
}

.motivation-status {
    display: inline-flex;
    align-items: center;
    min-height: 26px;
    padding: 4px 8px;
    border: 1px solid var(--line);
    background: var(--surface-soft);
    color: var(--ink);
    font-size: var(--text-sm);
    font-weight: 700;
    white-space: nowrap;
}

.motivation-status--behind {
    border-color: var(--red-mid);
    background: var(--red-light);
    color: var(--red);
}

.motivation-status--risk {
    border-color: #E9C78F;
    background: var(--amber-light);
    color: var(--amber);
}

.motivation-status--ahead {
    border-color: #B7DEC8;
    background: var(--green-light);
    color: var(--green);
}

.motivation-control-table td:first-child {
    min-width: 210px;
}

.motivation-control-grids {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(440px, 100%), 1fr));
    gap: 12px;
}

.project-task-board-panel .panel__head,
.project-task-calendar-panel .panel__head {
    align-items: start;
}

.project-task-kanban {
    margin: 0;
    padding: 0;
    border: 0;
    background: transparent;
    box-shadow: none;
}

.project-task-filterbar {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(160px, 100%), 1fr));
    gap: 8px;
    align-items: end;
    margin: 12px 14px;
    padding: 10px;
    border: 1px solid var(--border);
    border-radius: 8px;
    background: var(--surface-soft);
}

.project-task-filterbar label {
    display: grid;
    gap: 4px;
    min-width: 0;
}

.project-task-filterbar label span {
    color: var(--muted);
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
}

.project-task-filterbar input,
.project-task-filterbar select {
    width: 100%;
    height: 34px;
    min-width: 0;
    border: 1px solid var(--border);
    border-radius: 6px;
    background: var(--white);
    font-size: 13px;
}

.project-task-filterbar input {
    padding: 5px 9px;
}

.project-task-filterbar__count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 42px;
    height: 34px;
    padding: 0 10px;
    border: 1px solid var(--border);
    border-radius: 6px;
    background: var(--white);
    color: var(--black);
    font-weight: 800;
}

.project-team-panel > summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 12px 14px;
    cursor: pointer;
    list-style: none;
}

.project-team-panel > summary::-webkit-details-marker {
    display: none;
}

.project-team-panel > summary > span:not(.details-toggle-label) {
    color: var(--black);
    font-size: 18px;
    font-weight: 800;
}

.project-team-panel > summary small {
    color: var(--muted);
    font-weight: 700;
}

.details-toggle-label {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 92px;
    height: 30px;
    padding: 0 10px;
    border: 1px solid var(--border);
    border-radius: 6px;
    background: var(--surface);
    color: var(--black);
    font-size: var(--text-xs);
    font-weight: 800;
    line-height: 1;
}

.details-toggle-label__open {
    display: none;
}

details[open] > summary .details-toggle-label__closed {
    display: none;
}

details[open] > summary .details-toggle-label__open {
    display: inline;
}

.project-team-panel[open] > summary {
    margin-bottom: 0;
    border-bottom: 1px solid var(--line);
}

.project-team-edit {
    display: grid;
    gap: 10px;
    margin-top: 12px;
}

.project-team-filterbar {
    grid-template-columns: minmax(220px, 1fr) auto auto;
}

.project-team-edit-table input[type="text"],
.project-team-edit-table input[type="number"],
.project-team-edit-table input[type="date"],
.project-team-edit-table input:not([type]) {
    width: 100%;
    min-width: 0;
    min-height: 32px;
    padding: 5px 8px;
    border: 1px solid var(--border);
    border-radius: 6px;
    background: var(--white);
}

.project-team-edit-table input[type="checkbox"] {
    min-height: auto;
}

.project-team-period {
    display: grid;
    grid-template-columns: minmax(120px, 1fr) minmax(120px, 1fr);
    gap: 6px;
}

.is-project-task-hidden {
    display: none !important;
}

.project-task-kanban .kanban__column {
    min-width: 220px;
}

.project-task-kanban .kanban__body {
    max-height: 520px;
    overflow: auto;
}

.project-task-kanban__hours {
    display: flex;
    flex-wrap: wrap;
    gap: 5px 8px;
    color: var(--muted);
    font-size: 12px;
}

.project-task-calendar {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: 1px;
    overflow: hidden;
    border: 1px solid var(--border);
    border-radius: 6px;
    background: var(--border);
}

.project-task-calendar__weekday,
.project-task-calendar__day {
    min-width: 0;
    background: var(--white);
}

.project-task-calendar__weekday {
    padding: 8px;
    color: var(--muted);
    font-size: 12px;
    font-weight: 700;
    text-align: center;
}

.project-task-calendar__day {
    min-height: 112px;
    padding: 7px;
}

.project-task-calendar__day.is-outside {
    background: var(--surface-soft);
    color: var(--muted);
}

.project-task-calendar__day.is-today {
    box-shadow: inset 0 0 0 2px var(--red);
}

.project-task-calendar__date {
    margin-bottom: 6px;
    color: var(--black);
    font-size: 12px;
    font-weight: 800;
}

.project-task-calendar__task,
.project-task-calendar__more {
    display: block;
    min-width: 0;
    margin-top: 4px;
    padding: 4px 6px;
    overflow: hidden;
    border-radius: 4px;
    background: var(--surface-soft);
    color: var(--black);
    font-size: 12px;
    line-height: 1.25;
    text-decoration: none;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-task-calendar__task:hover,
.project-task-calendar__more:hover {
    color: var(--red);
}

@media (max-width: 900px) {
    .project-task-filterbar {
        grid-template-columns: 1fr 1fr;
    }

    .project-task-filterbar label:first-child {
        grid-column: 1 / -1;
    }
}

@media (max-width: 560px) {
    .project-task-filterbar {
        grid-template-columns: 1fr;
    }
}

.status-border--new { border-left: 3px solid var(--gray); }
.status-border--in_progress { border-left: 3px solid var(--blue); }
.status-border--review,
.status-border--pending_close,
.status-border--correction { border-left: 3px solid var(--amber); }
.status-border--done { border-left: 3px solid var(--green); }
.status-border--blocked,
.status-border--overdue { border-left: 3px solid var(--red); }

.tag-subtask {
    display: inline-flex;
    align-items: center;
    max-width: 100%;
    padding: 2px 7px;
    border-left: 3px solid var(--amber);
    background: var(--amber-light);
    color: #6A4308;
    font-weight: 700;
}

.project-task-row--subtask {
    border-left: 4px solid var(--amber);
    background: #FFFCF4;
}

.task-card--subtask {
    border-left: 4px solid var(--amber);
}

.content > .toolbar,
.content > .project-head,
.content > .project-grid,
.content > .metric-row,
.content > .dpr-grid,
.content > .schedule-board,
.content > .panel,
.content > form.panel,
.content > .tabs {
    margin-left: 24px;
    margin-right: 24px;
}

.content > .toolbar,
.content > .project-head {
    margin-top: 16px;
}

.btn,
.btn-secondary,
.btn-outline {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 30px;
    padding: 6px 14px;
    border: 1px solid var(--border);
    border-radius: 2px;
    background: transparent;
    color: var(--gray);
    cursor: pointer;
    font-size: 12px;
    font-weight: 400;
    line-height: 1.2;
    white-space: nowrap;
    transition: background-color var(--fast), border-color var(--fast), color var(--fast);
}

.btn:hover,
.btn-secondary:hover,
.btn-outline:hover {
    border-color: var(--gray-dark);
    background: transparent;
    color: var(--black);
}

.btn-primary,
.btn-red,
.btn--red {
    border-color: var(--red);
    background: var(--red);
    color: var(--white);
    font-weight: 700;
}

.btn-primary:hover,
.btn-red:hover,
.btn--red:hover {
    border-color: var(--red-hover);
    background: var(--red-hover);
    color: var(--white);
}

.btn-ghost {
    min-height: 0;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--gray-light);
    font-weight: 400;
}

.btn-ghost:hover {
    color: var(--red);
}

.btn-success {
    border-color: var(--green);
    background: var(--green);
    color: var(--white);
}

.btn-warning {
    border-color: var(--amber);
    background: var(--amber);
    color: var(--white);
}

.btn-sm {
    min-height: 24px;
    padding: 4px 10px;
    font-size: 12px;
}

.btn-lg {
    min-height: 34px;
    padding: 9px 20px;
    font-size: 13px;
}

.btn.is-disabled,
.is-disabled {
    cursor: default;
    opacity: .4;
}

input,
select,
textarea {
    width: 100%;
    min-height: 34px;
    padding: 8px 10px;
    border: 1px solid var(--border);
    border-radius: 2px;
    background: var(--white);
    color: var(--gray-dark);
    font: 13px "PT Sans", Arial, sans-serif;
}

input:required,
select:required,
textarea:required {
    border-color: var(--border);
    background: var(--white);
}

input:focus,
select:focus,
textarea:focus {
    outline: none;
    border-color: var(--red);
    background: var(--white);
}

label {
    display: grid;
    gap: 5px;
}

label > span,
.custom-field span,
.project-file-bar span {
    margin: 0;
    color: #666666;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .07em;
    text-transform: uppercase;
}

textarea {
    min-height: 90px;
    resize: vertical;
}

.alert {
    margin: 8px 24px 0;
    padding: 10px 12px;
    border: 1px solid var(--border);
    border-left: 3px solid var(--green);
    border-radius: 3px;
    background: var(--white);
}

.alert--error {
    border-left-color: var(--red);
}

.toolbar,
.project-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 14px;
}

.filters,
.filterbar {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
}

.filters select,
.filters input,
.filterbar select {
    width: auto;
    min-width: 145px;
}

.panel,
.project-card,
.dpr-card,
.metric,
.task-card,
.kanban__column,
.guest-card,
.gantt-workspace,
.project-file-pane,
.schedule-board__column,
.custom-field {
    border: 1px solid var(--border);
    border-radius: 3px;
    background: var(--white);
    box-shadow: none;
}

.panel:hover,
.project-card:hover,
.dpr-card:hover,
.task-card:hover {
    border-color: var(--border);
    box-shadow: 0 1px 4px rgba(0, 0, 0, .07);
}

.panel__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    min-height: 40px;
    padding: 10px 12px;
    border-bottom: 2px solid var(--red);
    background: var(--white);
}

.panel__head h2,
.project-head h2 {
    margin: 0;
    color: var(--black);
    font-family: "PT Sans Narrow", "PT Sans", sans-serif;
    font-size: 16px;
    font-weight: 700;
    letter-spacing: 0;
}

.panel__head > span,
.dpr-section-count {
    display: inline-flex;
    align-items: center;
    min-height: 18px;
    padding: 1px 6px;
    border-radius: 2px;
    background: var(--border);
    color: var(--gray);
    font-size: 12px;
    font-weight: 700;
}

.data-table {
    width: 100%;
    min-width: 860px;
    border-collapse: collapse;
    border-spacing: 0;
}

.data-table th {
    position: sticky;
    top: 0;
    z-index: 1;
    padding: 8px 10px;
    border-bottom: 1px solid var(--border);
    background: var(--bg);
    color: #AAAAAA;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .08em;
    text-align: left;
    text-transform: uppercase;
    white-space: nowrap;
}

.data-table td {
    padding: 8px 10px;
    border-bottom: 1px solid #F5F5F5;
    color: var(--gray-dark);
    font-size: 12px;
    vertical-align: top;
}

.data-table tbody tr:hover,
.clickable:hover {
    background: #FAFAFA;
}

.table-wrap {
    overflow: auto;
}

.table-wrap--compact {
    max-height: 330px;
}

.row-danger {
    border-left: 3px solid var(--red);
    background: var(--white);
}

.status,
.pill {
    display: inline-flex;
    align-items: center;
    min-height: 0;
    padding: 2px 8px;
    border: 0;
    border-radius: 2px;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.35;
    white-space: nowrap;
}

.status--new,
.s-new {
    background: #F1EFE8;
    color: var(--gray);
}

.status--in_progress,
.s-work {
    background: var(--blue-light);
    color: var(--blue);
}

.status--review,
.s-review {
    background: var(--amber-light);
    color: var(--amber);
}

.status--correction,
.s-correction {
    background: #FFE5CC;
    color: #8A3F00;
}

.status--pending_close,
.s-pclose {
    border: 1px solid #F0C060;
    background: #FFF0CC;
    color: #7A4800;
}

.status--overdue,
.s-overdue {
    background: var(--red);
    color: var(--white);
}

.status--blocked,
.s-block {
    background: #FCEBEB;
    color: #791F1F;
}

.status--done,
.s-done {
    background: var(--green-light);
    color: var(--green);
}

.pill--red {
    background: var(--red);
    color: var(--white);
}

.tag,
.task-tag {
    display: inline-flex;
    align-items: center;
    min-height: 16px;
    padding: 1px 7px;
    border: 0;
    border-radius: 2px;
    background: #F0F0F0;
    color: #444444;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0;
    white-space: nowrap;
}

.task-tag--project,
.tag-rd,
.tag-рд {
    background: #FCEBEB;
    color: #791F1F;
}

.tag-ов {
    background: #E8F0FB;
    color: #1A4A8A;
}

.tag-вк {
    background: #E1F5EE;
    color: #0F5E46;
}

.tag-ар {
    background: #FAECE7;
    color: #612B13;
}

.tag-кр {
    background: #FAF0DA;
    color: #5A3806;
}

.tag-эом {
    background: #EEEDFE;
    color: #3C3489;
}

.tag-сс {
    background: #FFF0E8;
    color: #7A3010;
}

.tag-тх {
    background: #E8F8F0;
    color: #0A5E36;
}

.tag-пз {
    background: #F0F0F0;
    color: #444444;
}

.tag-пд {
    background: #F1EFE8;
    color: #444441;
}

.progress,
.prog-bar,
.project-progress__bar,
.workload-bar {
    display: block;
    width: 100%;
    height: 3px;
    overflow: hidden;
    border: 0;
    border-radius: 0;
    background: #F0F0F0;
}

.progress--wide {
    height: 5px;
}

.progress span,
.prog-fill,
.project-progress__bar span,
.workload-bar span {
    display: block;
    height: 100%;
    border-radius: 0;
    background: var(--red);
}

.progress-low,
.prog-fill.progress-low {
    background: var(--red);
}

.progress-mid,
.prog-fill.progress-mid,
.prog-fill--mid {
    background: var(--amber);
}

.progress-high,
.prog-fill.progress-high,
.prog-fill--done {
    background: var(--green);
}

.text-red,
.date-red,
.is-overdue,
.metric-value--bad {
    color: var(--red) !important;
    font-weight: 700;
}

.date-amber,
.is-today {
    color: var(--amber) !important;
    font-weight: 700;
}

.date-normal {
    color: var(--gray) !important;
    font-weight: 400;
}

.date-empty,
.progress-placeholder {
    color: var(--gray-light) !important;
    font-weight: 400;
}

.progress-placeholder {
    display: inline-flex;
    align-items: center;
    min-height: 3px;
    font-size: 12px;
    line-height: 1;
}

.progress-placeholder--large {
    font-size: 24px;
}

.metric-value--good {
    color: var(--green);
}

.pdot,
.priority-dot {
    display: inline-block;
    width: 7px;
    height: 7px;
    margin-right: 5px;
    border-radius: 50%;
    vertical-align: middle;
}

.p-high,
.priority-dot--high {
    background: var(--red);
}

.p-mid,
.priority-dot--mid {
    background: var(--amber);
}

.p-low,
.priority-dot--low {
    background: #AAAAAA;
}

.overdue-banner {
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: 40px;
    padding: 10px 24px;
    background: var(--red);
    color: var(--white);
    font-size: 13px;
    font-weight: 700;
}

.overdue-banner::before {
    content: "!";
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 16px;
    height: 16px;
    border: 1px solid var(--white);
    border-radius: 50%;
    color: var(--white);
    font-size: 12px;
    font-weight: 700;
}

.overdue-action {
    margin-left: auto;
    padding: 4px 12px;
    border-radius: 2px;
    background: var(--white);
    color: var(--red);
    font-size: 12px;
    font-weight: 700;
}

.filterbar {
    position: sticky;
    top: 0;
    z-index: 6;
    padding: 8px 24px;
    border-bottom: 1px solid var(--border);
    background: var(--white);
}

.filterbar select,
.filterbar .btn {
    min-height: 27px;
    font-size: 12px;
}

.view-switch {
    display: inline-flex;
    border: 1px solid var(--border);
    border-radius: 2px;
    overflow: hidden;
}

.view-btn {
    display: inline-flex;
    align-items: center;
    min-height: 25px;
    padding: 4px 10px;
    background: var(--bg);
    color: var(--gray-light);
    font-size: 12px;
    font-weight: 700;
}

.view-btn.active {
    background: var(--black);
    color: var(--white);
}

.task-table {
    flex: 1;
    min-height: 0;
    overflow: auto;
    background: var(--white);
}

.tbl-head,
.task-row {
    display: grid;
    grid-template-columns: 28px minmax(260px, 1fr) 110px 90px 90px 100px 70px 80px;
    align-items: center;
}

.tbl-head {
    position: sticky;
    top: 0;
    z-index: 4;
    padding: 0 24px;
    border-bottom: 1px solid var(--border);
    background: var(--bg);
}

.th {
    padding: 8px 6px;
    color: #888888;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.task-group {
    display: block;
}

.task-group__head {
    position: sticky;
    top: 37px;
    z-index: 1;
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 32px;
    padding: 7px 24px 7px 21px;
    border-left: 3px solid var(--border);
    border-bottom: 1px solid var(--border);
    background: #efefed;
    color: var(--gray-light);
    cursor: pointer;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .08em;
    list-style: none;
    text-transform: uppercase;
}

.task-group__head::-webkit-details-marker {
    display: none;
}

.task-group__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 16px;
    height: 16px;
    border-radius: 2px;
    background: var(--border);
    color: var(--gray);
    font-size: 12px;
    letter-spacing: 0;
}

.task-group__head b {
    margin-left: auto;
    padding: 1px 6px;
    border-radius: 2px;
    background: var(--border);
    color: var(--gray);
    font-size: 12px;
}

.task-group--red .task-group__icon {
    background: var(--red);
    color: var(--white);
}

.task-group--red .task-group__head,
.task-group--red .task-group-header {
    border-left-color: var(--red);
}

.task-group--amber .task-group__icon {
    background: var(--amber);
    color: var(--white);
}

.task-group--amber .task-group__head,
.task-group--amber .task-group-header {
    border-left-color: var(--amber);
}

.task-group--green .task-group__icon {
    background: var(--green);
    color: var(--white);
}

.task-group--green .task-group__head,
.task-group--green .task-group-header {
    border-left-color: var(--green);
}

.task-group--blue .task-group__icon {
    background: var(--blue);
    color: var(--white);
}

.task-group--blue .task-group__head,
.task-group--blue .task-group-header {
    border-left-color: var(--blue);
}

.task-group--gray .task-group__head,
.task-group--gray .task-group-header {
    border-left-color: var(--gray);
}

.task-row {
    min-height: 46px;
    padding: 0 24px;
    border-bottom: 1px solid #F0F0F0;
    background: var(--white);
    cursor: pointer;
    transition: background-color 80ms ease;
}

.task-row:hover {
    background: #FAFAFA;
}

.task-row.overdue-row {
    border-left: 3px solid var(--red);
    padding-left: 21px;
}

.task-row.review-row:not(.overdue-row) {
    border-left: 3px solid var(--amber);
    padding-left: 21px;
}

.chk {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 15px;
    height: 15px;
    border: 1px solid var(--border);
    border-radius: 2px;
    color: var(--gray-light);
    font-size: 12px;
}

.task-info {
    min-width: 0;
    padding: 6px 0;
}

.task-name {
    overflow: hidden;
    color: #111111;
    font-size: 13px;
    font-weight: 700;
    line-height: 1.3;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.task-meta {
    display: flex;
    align-items: center;
    gap: 6px;
    min-width: 0;
    margin-top: 3px;
}

.tid,
.task-code {
    color: var(--muted);
    font-family: monospace;
    font-size: 12px;
}

.task-code {
    font-size: 12px;
}

.sub-hint {
    overflow: hidden;
    color: var(--gray-light);
    font-size: 12px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.tcol {
    min-width: 0;
    padding: 4px 6px;
    color: #2e2e2e;
    font-size: 12px;
}

.task-hours {
    color: var(--gray-dark);
    font-family: monospace;
    font-size: 12px;
}

.prog-wrap {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.prog-wrap.is-empty {
    justify-content: center;
}

.prog-label {
    color: var(--gray-light);
    font-size: 12px;
}

.task-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 380px;
    gap: 14px;
    align-items: start;
    padding: 18px 24px 24px;
}

.task-side {
    position: sticky;
    top: 18px;
    display: grid;
    gap: 14px;
}

.task-main {
    overflow: hidden;
}

.task-work-window {
    position: relative;
    border: 2px solid var(--black);
    box-shadow: 0 12px 26px rgba(20, 24, 28, .10);
}

.task-work-window::before {
    content: "";
    position: absolute;
    inset: 38px auto 0 0;
    width: 5px;
    background: var(--red);
}

.task-work-window__bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    min-height: 38px;
    padding: 7px 16px 7px 18px;
    background: var(--black);
    color: var(--white);
}

.task-work-window__bar span,
.task-work-window__bar strong {
    min-width: 0;
    line-height: 1.25;
}

.task-work-window__bar span {
    color: var(--white);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .09em;
    text-transform: uppercase;
}

.task-work-window__bar strong {
    color: #D8DDE4;
    font-size: 12px;
    font-weight: 700;
    text-align: right;
}

.task-work-window__bar-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    min-width: 0;
}

.task-mail-chip {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 24px;
    padding: 0 9px;
    border: 1px solid rgba(255, 255, 255, .45);
    border-radius: 3px;
    color: var(--white);
    font-size: 12px;
    font-weight: 700;
    line-height: 1;
    text-transform: uppercase;
}

.task-mail-chip:hover {
    border-color: var(--white);
    background: var(--white);
    color: var(--black);
}

.task-passport {
    background: var(--white);
}

.task-passport__head {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 8px;
    padding: 16px 18px 14px;
    border-bottom: 0;
}

.task-passport__crumbs {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    color: var(--muted);
    font-size: 12px;
}

.task-passport__crumbs span + span::before {
    content: "→";
    margin-right: 6px;
}

.task-passport__idline {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
}

.task-passport__head h2 {
    max-width: 900px;
    margin: 0;
    color: var(--black);
    font-family: "PT Sans Narrow", "PT Sans", sans-serif;
    font-size: 24px;
    font-weight: 700;
    line-height: 1.25;
}

.task-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    padding: 0;
    background: transparent;
}

.task-tags span {
    border: 0;
    border-radius: 2px;
    font-size: 12px;
    font-weight: 700;
}

.task-tags .task-tag {
    background: #F0F0F0;
    color: #444444;
}

.task-tags .task-tag--project,
.task-tags .tag-rd,
.task-tags .tag-рд {
    background: #FCEBEB;
    color: #791F1F;
}

.task-tags .tag-ов {
    background: #E8F0FB;
    color: #1A4A8A;
}

.task-tags .tag-вк {
    background: #E1F5EE;
    color: #0F5E46;
}

.task-tags .tag-ар {
    background: #FAECE7;
    color: #612B13;
}

.task-tags .tag-кр {
    background: #FAF0DA;
    color: #5A3806;
}

.task-tags .tag-эом {
    background: #EEEDFE;
    color: #3C3489;
}

.task-tags .tag-сс {
    background: #FFF0E8;
    color: #7A3010;
}

.task-tags .tag-тх {
    background: #E8F8F0;
    color: #0A5E36;
}

.task-tags .tag-пз {
    background: #F0F0F0;
    color: #444444;
}

.task-tags .tag-пд {
    background: #F1EFE8;
    color: #444441;
}

.smart-card {
    margin: 0 18px 18px;
    overflow: hidden;
    border: 1px solid var(--border);
    border-radius: 3px;
    background: var(--white);
}

.smart-card__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 6px 12px;
    background: var(--black);
    color: var(--white);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
}

.smart-card__head small {
    color: #D8DDE4;
    font-size: 12px;
    font-weight: 700;
}

.smart-row {
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr);
    border-bottom: 1px solid #F0F0F0;
}

.smart-row:last-child {
    border-bottom: 0;
}

.smart-row__mark {
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--red);
    color: var(--white);
    font-family: "PT Sans Narrow", "PT Sans", sans-serif;
    font-size: 14px;
    font-weight: 700;
}

.smart-row--dependency .smart-row__mark {
    background: var(--amber);
}

.smart-row__body {
    padding: 8px 12px;
}

.smart-row__body span {
    display: block;
    margin-bottom: 3px;
    color: var(--muted);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .07em;
    text-transform: uppercase;
}

.smart-row__body p {
    margin: 0;
    color: var(--gray-dark);
    font-size: 13px;
    line-height: 1.45;
}

.task-primary-flow {
    display: grid;
    gap: 12px;
    margin: 0 18px 18px;
}

.task-primary-flow > .panel {
    margin-bottom: 0;
}

.task-exchange-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin: 0 18px 18px;
    padding: 10px 12px;
    border: 1px solid #D8DDE4;
    border-left: 5px solid var(--red);
    border-radius: 3px;
    background: #FAFAFA;
}

.task-exchange-actions__title {
    display: grid;
    gap: 2px;
    min-width: 0;
}

.task-exchange-actions__title strong {
    color: var(--black);
    font-family: "PT Sans Narrow", "PT Sans", sans-serif;
    font-size: 15px;
    font-weight: 700;
}

.task-exchange-actions__title span {
    overflow: hidden;
    color: var(--gray);
    font-size: 12px;
    font-weight: 700;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.task-exchange-actions__buttons {
    display: flex;
    flex: 0 0 auto;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 8px;
}

.task-fold {
    margin: 12px 18px 0;
    overflow: hidden;
    border: 1px solid var(--border);
    border-radius: 3px;
    background: var(--white);
}

.task-fold:last-child {
    margin-bottom: 18px;
}

.task-fold__summary {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 34px;
    padding: 8px 10px;
    cursor: pointer;
    list-style: none;
    background: #FAFAFA;
    color: var(--black);
    font-family: "PT Sans Narrow", "PT Sans", sans-serif;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.task-fold__summary::-webkit-details-marker {
    display: none;
}

.task-fold__summary::after {
    content: "Показать";
    margin-left: auto;
    color: var(--gray-light);
    font-family: "PT Sans", Arial, sans-serif;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0;
    text-transform: none;
}

.task-fold[open] > .task-fold__summary {
    border-bottom: 2px solid var(--red);
}

.task-fold[open] > .task-fold__summary::after {
    content: "Скрыть";
}

.task-fold__summary strong {
    display: inline-flex;
    align-items: center;
    min-height: 18px;
    padding: 1px 6px;
    border-radius: 2px;
    background: var(--border);
    color: var(--gray);
    font-family: "PT Sans", Arial, sans-serif;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0;
    text-transform: none;
}

.task-fold__body {
    min-width: 0;
}

.task-fold__body > .text-block,
.task-fold__body > .comments,
.task-fold__body > .history,
.task-fold__body > .comment-form {
    padding: 12px;
}

.task-fold__body > .custom-field-grid {
    padding: 12px;
}

.task-fold__actions {
    padding: 10px 12px 12px;
}

.task-panel-fold {
    overflow: hidden;
}

.task-panel-fold__summary {
    cursor: pointer;
    list-style: none;
}

.task-panel-fold__summary::-webkit-details-marker {
    display: none;
}

.task-panel-fold__summary::after {
    content: "";
    width: 7px;
    height: 7px;
    flex: 0 0 auto;
    border-right: 2px solid var(--gray-light);
    border-bottom: 2px solid var(--gray-light);
    transform: rotate(45deg);
    transition: transform var(--fast);
}

.task-panel-fold[open] > .task-panel-fold__summary::after {
    transform: rotate(225deg);
}

.task-link {
    color: var(--red);
    font-weight: 700;
}

.section-title {
    margin: 14px 18px 0;
    padding: 0 0 6px;
    border-top: 0;
    border-bottom: 2px solid var(--red);
    color: var(--black);
    font-family: "PT Sans Narrow", "PT Sans", sans-serif;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.section-title::before {
    display: none;
}

.text-block,
.comments,
.history,
.comment-form {
    padding: 12px 18px;
}

.stat-ring {
    display: grid;
    gap: 5px;
    padding: 16px;
}

.stat-ring strong {
    color: var(--black);
    font-family: "PT Sans Narrow", "PT Sans", sans-serif;
    font-size: 36px;
    font-weight: 700;
    line-height: 1;
}

.stat-ring span {
    color: var(--muted);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.stat-list {
    margin: 0;
    border-top: 1px solid #F0F0F0;
}

.stat-list div {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    padding: 8px 14px;
    border-bottom: 1px solid #F0F0F0;
}

.stat-list dt {
    color: var(--muted);
    font-size: 12px;
}

.stat-list dd {
    margin: 0;
    color: var(--black);
    font-size: 13px;
    font-weight: 700;
    text-align: right;
}

.issuance-list {
    display: grid;
    border-top: 1px solid var(--border);
}

.issuance-row {
    display: grid;
    grid-template-columns: minmax(86px, 1fr) 76px 82px minmax(0, 1.2fr);
    gap: 8px;
    align-items: center;
    padding: 8px 12px;
    border-bottom: 1px solid var(--border);
    font-size: 12px;
}

.issuance-row strong {
    color: var(--black);
}

.issuance-row span,
.issuance-row small {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.issuance-row small {
    color: var(--gray);
}

.issuance-status {
    color: var(--blue);
    font-weight: 700;
}

.issuance-status--remarks {
    color: var(--amber);
}

.issuance-status--accepted {
    color: var(--green);
}

.revision-list {
    display: grid;
    gap: 8px;
    padding: 10px 12px;
    border-top: 1px solid var(--border);
    background: #FAFBFC;
}
.revision-row {
    display: grid;
    grid-template-columns: 76px minmax(120px, 1fr);
    gap: 4px 10px;
    padding: 8px 10px;
    border: 1px solid var(--line-soft);
    border-radius: 6px;
    background: var(--white);
    font-size: 12px;
}
.revision-row strong {
    color: var(--red);
}
.revision-row span {
    color: var(--muted);
}
.revision-row p,
.revision-row small {
    grid-column: 1 / -1;
    margin: 0;
    line-height: 1.35;
    white-space: pre-line;
}
.revision-row small {
    color: var(--gray);
}

.task-approval {
    overflow: hidden;
}

.approval-stage {
    color: var(--muted);
    font-size: 12px;
    font-weight: 700;
}

.approval-stage--approved,
.approval-stage--issued {
    color: var(--green);
}

.approval-stage--review_lead,
.approval-stage--review_gip {
    color: var(--amber);
}

.approval-chain,
.approval-flow {
    display: flex;
    gap: 0;
    align-items: center;
    padding: 12px;
    border-top: 1px solid var(--border);
}

.approval-chain {
    overflow-x: auto;
    flex-wrap: nowrap;
}

.approval-flow {
    flex-wrap: wrap;
}

.approval-chain__arrow,
.approval-flow__arrow {
    align-self: center;
    padding: 0 6px;
    color: var(--muted);
    font-size: 18px;
    line-height: 1;
}

.approval-step {
    display: grid;
    width: auto;
    flex: 0 0 auto;
    gap: 2px;
    min-width: 0;
    padding: 8px 14px;
    border: 1px solid var(--border);
    border-radius: 3px;
    background: var(--bg);
    color: var(--muted);
}

.approval-step__mark {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--muted);
    font-size: 12px;
    font-weight: 700;
}

.approval-step strong {
    min-width: 0;
    color: inherit;
    font-size: 12px;
    white-space: nowrap;
}

.approval-step__icon {
    margin-right: 5px;
}

.approval-step small {
    min-width: 0;
    color: var(--muted);
    font-size: 12px;
    white-space: nowrap;
}

.approval-step--done {
    border-color: var(--green);
    background: var(--green-light);
    color: var(--green);
}

.approval-step--done .approval-step__mark {
    color: var(--green);
}

.approval-step--active,
.approval-step--current {
    border-color: var(--amber);
    background: var(--amber-light);
    color: var(--amber);
    font-weight: 700;
}

.approval-step--active .approval-step__mark,
.approval-step--current .approval-step__mark {
    color: var(--amber);
}

.approval-step--rejected {
    border-color: var(--red);
    background: #fff5f5;
    color: var(--red);
}

.approval-step--pending,
.approval-step--future {
    border-color: var(--border);
    background: var(--bg);
    color: var(--muted);
}

.approval-actions {
    display: grid;
    gap: 8px;
    padding: 0 12px 12px;
}

.approval-actions form {
    display: grid;
    gap: 8px;
}

.task-route-close-action {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin: 0 12px 12px;
    padding: 10px 12px;
    border: 1px solid var(--border);
    border-left: 4px solid var(--red);
    border-radius: 6px;
    background: var(--surface-soft);
}

.task-route-close-action div {
    display: grid;
    gap: 2px;
    min-width: 0;
}

.task-route-close-action strong {
    color: var(--black);
}

.task-route-close-action span {
    color: var(--muted);
    font-size: 12px;
    line-height: 1.35;
}

.approval-reject-form {
    padding-top: 8px;
    border-top: 1px solid var(--line-soft);
}

.approval-history {
    display: grid;
    gap: 6px;
    border-top: 1px solid var(--border);
    padding-top: 6px;
}

.approval-event {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    padding: 0 12px 6px;
    border-bottom: 1px solid var(--border);
    color: var(--gray);
    font-size: 12px;
}

.approval-event strong,
.approval-event small {
    min-width: 0;
}

.approval-event__date {
    color: var(--muted);
    font-family: monospace;
    font-size: 12px;
    white-space: nowrap;
}

.approval-event small {
    flex: 1 1 180px;
    color: var(--muted);
}

/* Длинный текст замечания — отдельной строкой на всю ширину, с переносом. */
.approval-event__comment {
    flex: 1 1 100%;
    white-space: normal;
    word-break: break-word;
    line-height: 1.4;
}

.approval-pill {
    display: inline-flex;
    align-items: center;
    min-height: 20px;
    padding: 1px 7px;
    border: 1px solid currentColor;
    border-radius: 2px;
    font-size: 12px;
    font-weight: 700;
    white-space: nowrap;
}

.approval-pill--green {
    color: var(--green);
}

.approval-pill--red {
    color: var(--red);
}

.approval-pill--blue {
    color: var(--blue);
}

.labor-approval-cell {
    display: grid;
    gap: 6px;
    min-width: 160px;
}

.labor-approval-cell small {
    color: var(--muted);
    font-size: 12px;
    line-height: 1.25;
}

.labor-approval-cell form {
    display: grid;
    gap: 5px;
}

.labor-approval-reject textarea {
    min-width: 150px;
}

.approval-count {
    display: inline-flex;
    min-width: 24px;
    justify-content: center;
    padding: 2px 7px;
    border-radius: 10px;
    background: var(--amber);
    color: var(--white);
    font-size: 12px;
    font-weight: 700;
}

.issuance-form {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 8px;
    padding: 12px;
    border-top: 1px solid var(--border);
}

.issuance-form__comment,
.issuance-form .btn {
    grid-column: 1 / -1;
}

.issuance-gate {
    margin: 0;
    padding: 10px 12px 12px;
    border-top: 1px solid var(--border);
    font-size: 12px;
}

.linked-list {
    display: grid;
    border-top: 1px solid var(--border);
}

.linked-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 10px;
    align-items: center;
    padding: 9px 12px;
    border-bottom: 1px solid var(--border);
    color: var(--gray);
}

.linked-row:hover {
    color: var(--red);
}

.linked-row strong,
.linked-row small {
    display: block;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
}

.linked-row strong {
    color: var(--black);
    font-size: 12px;
}

.linked-row small {
    color: var(--muted);
    font-size: 12px;
}

.linked-row form {
    margin: 0;
}

.task-issue-form {
    padding: 12px;
    border-top: 1px solid var(--border);
}

.task-id-list {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.task-blocked-icon {
    color: var(--amber);
    font-size: 13px;
    line-height: 1;
}

.integrations {
    display: grid;
    gap: 8px;
    padding: 12px;
}

.integration-row {
    display: grid;
    grid-template-columns: 20px minmax(0, 1fr);
    gap: 8px;
    align-items: center;
    min-height: 32px;
    color: var(--gray-dark);
}

.integration-row:hover {
    color: var(--red);
}

.integration-row.is-disabled:hover {
    color: var(--gray-dark);
}

.integration-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    border-radius: 3px;
    color: var(--white);
    font-size: 12px;
    font-weight: 700;
}

.integration-icon--msp {
    background: #712B13;
}

.integration-icon--folder {
    background: var(--gray);
}

.integration-row strong,
.integration-row small {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.integration-row strong {
    font-size: 12px;
}

.integration-row small {
    color: var(--gray-light);
    font-size: 12px;
}

.dpr-grid {
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    gap: 12px;
}

.dpr-span-12 {
    grid-column: span 12;
}

.dpr-span-7 {
    grid-column: span 7;
}

.dpr-span-6 {
    grid-column: span 6;
}

.dpr-span-5 {
    grid-column: span 5;
}

.dpr-metrics {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 12px;
}

.dpr-metric {
    display: block;
    padding: 14px 18px;
    border: 1px solid var(--border);
    border-top: 4px solid var(--black);
    border-radius: 3px;
    background: var(--white);
    color: inherit;
}

a.dpr-metric:hover {
    border-color: var(--gray);
    color: inherit;
}

.dpr-metric strong {
    display: block;
    color: var(--black);
    font-family: "PT Sans Narrow", "PT Sans", sans-serif;
    font-size: 38px;
    font-weight: 700;
    line-height: 1;
}

.dpr-metric span {
    display: block;
    margin-top: 4px;
    color: #AAAAAA;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.dpr-metric--overdue {
    border-top-color: var(--red);
}

.dpr-metric--overdue strong {
    color: var(--red);
}

.dpr-metric--waiting {
    border-top-color: var(--amber);
}

.dpr-metric--waiting strong {
    color: var(--amber);
}

.dpr-metric--closed {
    border-top-color: var(--green);
}

.dpr-metric--closed strong {
    color: var(--green);
}

.dpr-metric--id-blocked {
    border-top-color: var(--amber);
}

.dpr-metric--id-blocked strong {
    color: var(--amber);
}

.dpr-metric--issues {
    border-top-color: var(--red);
}

.dpr-metric--issues strong {
    color: var(--red);
}

.dpr-cards {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
    gap: 12px;
}

.dpr-card {
    display: grid;
    gap: 8px;
    padding: 16px;
    border-top: 4px solid var(--green);
}

.dpr-card--amber {
    border-top-color: var(--amber);
}

.dpr-card--red {
    border-top-color: var(--red);
}

.dpr-card__head {
    display: flex;
    justify-content: space-between;
    gap: 8px;
    color: #AAAAAA;
    font-size: 12px;
}

.dpr-card__head strong {
    color: #AAAAAA;
    font-family: monospace;
    font-size: 12px;
}

.dpr-card h2 {
    min-height: 0;
    margin: 0;
    color: var(--black);
    font-family: "PT Sans Narrow", "PT Sans", sans-serif;
    font-size: 15px;
    line-height: 1.25;
}

.dpr-card__number {
    display: none;
    font-size: 32px;
}

.project-progress {
    display: grid;
    gap: 5px;
    margin: 2px 0 0;
}

.project-progress__bar {
    height: 6px;
}

.project-progress__meta,
.dpr-card__meta {
    color: var(--gray-light);
    font-size: 12px;
}

.dpr-card__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 4px 8px;
}

.dpr-card__meta span + span::before {
    content: "·";
    margin-right: 8px;
    color: var(--gray-light);
}

.workload-cell {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 190px;
}

.workload-bar {
    width: 120px;
    height: 5px;
    flex: 0 0 120px;
}

.workload-fill--normal {
    background: var(--green) !important;
}

.workload-fill--high {
    background: var(--amber) !important;
}

.workload-fill--over {
    background: var(--red) !important;
}

.empty-state {
    display: grid;
    gap: 4px;
    justify-items: start;
    padding: 24px;
}

.empty-state--table {
    padding: 24px;
    border-bottom: 1px solid var(--border);
}

.empty-state--compact {
    padding: 18px 0;
}

.empty-state__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border: 1px solid #DDDDDD;
    border-radius: 3px;
    color: #DDDDDD;
    font-size: 20px;
    font-weight: 700;
}

.empty-state strong {
    margin-top: 8px;
    color: var(--muted);
    font-family: "PT Sans", Arial, sans-serif;
    font-size: 14px;
    font-weight: 700;
}

.empty-state span {
    color: var(--muted);
    font-size: 12px;
}

.task-card,
.project-card {
    border-radius: 3px;
}

.kanban {
    gap: 10px;
    padding: 12px 24px;
}

.kanban__head {
    min-height: 40px;
    padding: 9px 10px;
    border-bottom: 2px solid var(--red);
}

.kanban {
    position: relative;
}

.kanban__body {
    min-height: 420px;
    padding: 1px 0 10px;
}

.kanban__column.is-drag-over .kanban__body {
    background: #fffafa;
    outline: 1px dashed var(--red);
    outline-offset: -5px;
}

.kanban-placeholder {
    margin: 10px;
    border: 1px dashed var(--red);
    background: #fffafa;
}

.kanban-message {
    grid-column: 1 / -1;
    padding: 9px 12px;
    border: 1px solid var(--border);
    background: var(--white);
    color: var(--black);
    font-size: 12px;
    font-weight: 700;
}

.kanban-message--error {
    border-color: var(--red);
    color: var(--red);
}

.task-card {
    cursor: grab;
}

.task-card a {
    -webkit-user-drag: none;
}

.task-card.is-kanban-dragging {
    opacity: .45;
    cursor: grabbing;
    box-shadow: 0 12px 28px rgb(0 0 0 / 18%);
}

.task-card.is-kanban-saving {
    opacity: .72;
    cursor: progress;
}

.task-card.is-kanban-saved {
    border-color: var(--green);
}

.task-card__status {
    font-size: 12px;
    white-space: nowrap;
}

.project-grid,
.metric-row {
    gap: 12px;
}

.metric {
    padding: 14px 18px;
    border-top: 4px solid var(--red);
}

.metric span {
    color: var(--black);
    font-family: "PT Sans Narrow", "PT Sans", sans-serif;
    font-size: 38px;
    line-height: 1;
}

.metric strong {
    margin-top: 4px;
    color: #AAAAAA;
    font-size: 12px;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.comment {
    padding: 10px 0;
    border-bottom: 1px solid var(--border);
}

.comment div {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    color: var(--gray-light);
    font-size: 12px;
}

.comment p,
.history {
    margin: 0;
    color: var(--gray-dark);
}

.history {
    display: grid;
    gap: 6px;
    font-family: monospace;
    font-size: 12px;
}

.shift {
    padding: 10px 12px;
    border-bottom: 1px solid var(--border);
}

.scope-pill,
.file-link,
.tabs a,
.view-switch,
.project-file-pane,
.schedule-card,
.folder-tree__link,
.gantt-plan__bar {
    border-radius: 2px;
}

.progress,
.prog-bar,
.project-progress__bar,
.workload-bar {
    border-radius: 0 !important;
}

.btn:hover,
.btn-outline:hover,
.btn-red:hover,
.btn--red:hover,
.nav__link:hover,
.nav-project:hover,
.task-row:hover,
.tabs a:hover,
.folder-tree__link:hover {
    transform: none;
}

@media (max-width: 1220px) {
    .task-layout {
        grid-template-columns: 1fr;
    }

    .task-side {
        position: static;
    }

    .dpr-span-7,
    .dpr-span-6,
    .dpr-span-5 {
        grid-column: span 12;
    }
}

@media (max-width: 900px) {
    body {
        overflow: auto;
    }

    .app-shell {
        display: block;
        height: auto;
        min-height: 100vh;
    }

    .sidebar {
        position: sticky;
        top: 0;
        z-index: 30;
        width: 100%;
        border-right: 0;
        border-bottom: 1px solid var(--border);
    }

    .brand {
        padding: 13px 18px;
    }

    .nav {
        display: flex;
        gap: 4px;
        padding: 8px 10px;
        overflow-x: auto;
    }

    .nav__group,
    .sidebar__footer,
    .nav-projects {
        display: none;
    }

    .nav__link {
        min-height: 34px;
        padding: 7px 10px;
        border-left: 0;
        border-bottom: 3px solid transparent;
        white-space: nowrap;
    }

    .nav__link:hover,
    .nav__link.is-active {
        border-bottom-color: var(--red);
    }

    .main {
        display: block;
    }

    .topbar h1 {
        flex: 1 1 100%;
    }

    .content {
        overflow: visible;
    }

    .content > .toolbar,
    .content > .project-head,
    .content > .project-grid,
    .content > .project-layout,
    .content > .metric-row,
    .content > .dpr-grid,
    .content > .schedule-board,
    .content > .panel,
    .content > form.panel,
    .content > .tabs,
    .task-layout,
    .gantt-workspace {
        margin-left: 14px;
        margin-right: 14px;
    }

    .filterbar {
        position: static;
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        padding: 10px 14px;
    }

    .filterbar select,
    .filterbar .btn,
    .view-switch {
        width: 100%;
        min-width: 0;
    }

    .view-switch {
        display: grid;
        grid-template-columns: 1fr 1fr;
    }

    .fsep {
        display: none;
    }

    .task-layout {
        padding: 14px 0 18px;
    }

    .task-passport__head {
        padding: 14px;
    }

    .smart-card {
        margin: 0 14px 14px;
    }

    .task-fold {
        margin-right: 14px;
        margin-left: 14px;
    }

    .task-exchange-actions {
        align-items: stretch;
        flex-direction: column;
        margin: 0 14px 14px;
    }

    .task-exchange-actions__buttons .btn {
        flex: 1 1 150px;
        justify-content: center;
    }

    .tbl-head,
    .task-row {
        min-width: 840px;
    }

    .dpr-grid,
    .dpr-metrics {
        grid-template-columns: 1fr;
    }

    .dpr-span-12,
    .dpr-span-7,
    .dpr-span-6,
    .dpr-span-5 {
        grid-column: auto;
    }
}

@media (max-width: 560px) {
    .brand__text,
    .brand__sub {
        display: none;
    }

    .toolbar,
    .project-head,
    .panel__head {
        align-items: stretch;
        flex-direction: column;
    }

    .filters,
    .filterbar {
        grid-template-columns: 1fr;
    }

    .project-grid,
    .dpr-cards,
    .metric-row {
        grid-template-columns: 1fr;
    }
}

/* Final anti-orphan wrapping pass. Kept last to beat older repeated CSS sections. */
.topbar {
    flex-wrap: nowrap !important;
}

.topbar h1 {
    min-width: 0;
    overflow: hidden;
    flex-shrink: 1;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.topbar__actions,
.topbar__meta {
    flex-shrink: 0;
    flex-wrap: nowrap !important;
}

.filterbar {
    display: flex;
    flex-wrap: nowrap !important;
    overflow-x: auto;
    scrollbar-width: none;
}

.filterbar::-webkit-scrollbar {
    display: none;
}

.tabs {
    flex-wrap: nowrap !important;
    overflow-x: auto;
    scrollbar-width: none;
}

.tabs::-webkit-scrollbar {
    display: none;
}

.task-info {
    min-width: 0;
}

.task-meta {
    flex-wrap: nowrap !important;
    overflow: hidden;
}

.task-meta .tid,
.task-meta .tag,
.task-meta .mini-ava,
.task-meta .sub-hint,
.task-meta .nav-badge {
    flex: 0 0 auto;
    white-space: nowrap;
}

.metric-row {
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
}

.project-contact-form {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr 90px;
    gap: 8px;
    padding: 12px;
    border-top: 1px solid var(--border);
    background: var(--surface-soft);
}

.project-contact-form .btn {
    width: 100%;
}

@media (max-width: 900px) {
    .topbar h1 {
        flex: 1 1 auto;
    }

    .filterbar {
        display: flex;
        grid-template-columns: none;
    }

    .filterbar select,
    .filterbar .btn,
    .view-switch {
        flex: 0 0 auto;
        width: auto;
    }

    .metric-row {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    }

    .project-contact-form {
        grid-template-columns: 1fr 1fr;
    }

    .project-contact-form .btn {
        grid-column: 1 / -1;
    }
}

@media (max-width: 560px) {
    .metric-row {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    .project-contact-form {
        grid-template-columns: 1fr;
    }
}

/* Final DPR director overrides. Must stay after repeated global table rules. */
.dpr-director .dpr-metrics {
    grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
}

.dpr-director .dpr-table {
    width: 100%;
    min-width: 100% !important;
    table-layout: fixed;
}

.dpr-director .dpr-block__head {
    min-height: 34px;
    padding: 8px 10px;
}

.dpr-director .dpr-table th {
    padding: 6px 8px;
    font-size: 12px;
    line-height: 1.2;
    overflow-wrap: anywhere;
    white-space: normal;
}

.dpr-director .dpr-table td {
    padding: 6px 8px;
    font-size: 12px;
    line-height: 1.25;
    overflow-wrap: anywhere;
}

.dpr-director .dpr-table-wrap {
    max-height: 188px;
}

.dpr-director .dpr-table-wrap--wide {
    max-height: 220px;
}

.dpr-director .dpr-people-matrix-wrap {
    height: clamp(420px, calc(100dvh - 300px), 78dvh);
    max-height: none;
}

@media (max-width: 1180px) {
    .dpr-director .dpr-metrics {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    }

    .dpr-two-col {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 680px) {
    .dpr-director .dpr-metrics {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

/* Final contact-list overrides. */
.project-contact-form {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr 100px;
    align-items: start;
    gap: 8px;
}

.project-contact-form input {
    min-height: 34px;
}

.project-contact-form .btn {
    width: 100%;
    height: 34px;
    min-height: 34px;
    align-self: start;
}

.contact-table .btn-ghost {
    color: var(--muted);
}

.contact-table .btn-ghost:hover {
    color: var(--red);
}

@media (max-width: 900px) {
    .project-contact-form {
        grid-template-columns: 1fr 1fr;
    }

    .project-contact-form .btn {
        grid-column: 1 / -1;
    }
}

@media (max-width: 560px) {
    .project-contact-form {
        grid-template-columns: 1fr;
    }
}

/* Final archive-project overrides. */
.nav-archive {
    display: block;
    margin-top: 6px;
    padding: 4px 8px;
    color: var(--muted);
    font-size: 12px;
    text-decoration: none;
}

.nav-archive:hover {
    color: var(--red);
}

.archive-banner {
    padding: 10px 12px;
    border-bottom: 3px solid var(--muted);
    background: var(--bg);
    color: var(--muted);
    font-size: 12px;
    font-weight: 700;
}

/* Final manual/mobile footer override. Must stay after global mobile sidebar rules. */
@media (max-width: 900px) {
    .sidebar__footer {
        display: flex !important;
        gap: 6px;
        align-items: center;
        padding: 8px 10px;
        overflow-x: auto;
    }

    .sidebar__footer .user-mini {
        display: none;
    }

    .sidebar__footer .tour-start {
        flex: 0 0 auto;
        width: auto;
        margin: 0;
        padding: 7px 10px;
        white-space: nowrap;
    }

    .sidebar__footer .manual-link,
    .sidebar__footer .link-muted {
        flex: 0 0 auto;
        min-height: 34px;
        padding: 7px 10px;
        border: 1px solid var(--border);
        background: var(--surface);
        color: var(--gray);
        font-size: 12px;
        font-weight: 700;
        white-space: nowrap;
    }

    .sidebar__footer .manual-link:hover,
    .sidebar__footer .manual-link.is-active,
    .sidebar__footer .link-muted:hover {
        border-color: var(--red);
        color: var(--red);
    }
}

/* Final visual refinements kept late to resolve repeated legacy sections. */
.task-card,
.project-card,
.btn,
.nav__link,
.panel,
.kanban__column,
.view-switch,
.overdue-action,
.alert,
.dpr-card,
.dpr-metric,
.tour-start,
.manual-link,
input,
select,
textarea {
    border-radius: 0;
}

.task-card,
.project-card,
.btn,
.nav__link,
.nav-project,
.clickable,
.overdue-action,
.view-btn,
.dpr-card,
.dpr-metric,
.tour-start,
.manual-link,
.link-muted,
input,
select,
textarea {
    transition: var(--transition-smooth);
}

/* Softer overdue warning. */
.overdue-banner {
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: 38px;
    padding: 8px 18px;
    background: var(--red-light);
    color: var(--red);
    border-bottom: 1px solid var(--red-mid);
    font-size: 12.5px;
    font-weight: 700;
}

.overdue-banner::before {
    border-color: var(--red);
    color: var(--red);
}

.overdue-banner span {
    color: var(--red);
}

.overdue-banner strong {
    color: var(--red);
}

.overdue-action {
    background: var(--red);
    color: var(--white);
    border: 1px solid var(--red);
    border-radius: 0;
    padding: 3px 10px;
}

.overdue-action:hover {
    background: var(--red-hover);
    box-shadow: var(--shadow-sm);
}

/* Compact task filters. */
.filterbar {
    background: var(--surface-soft);
    border-bottom: 1px solid var(--border);
    padding: 6px 18px;
    gap: 8px;
    align-items: center;
}

.filterbar select {
    min-height: 28px;
    padding: 4px 8px;
    border: 1px solid var(--border);
    border-radius: 0;
    background: var(--white);
    color: var(--black);
    font-size: 12px;
}

.filterbar select:hover {
    border-color: var(--red);
    background: var(--white);
}

.filterbar select:focus {
    border-color: var(--red);
    box-shadow: 0 0 0 2px var(--focus-red);
    outline: none;
}

.filterbar .btn {
    min-height: 28px;
    padding: 4px 12px;
    font-size: 12px;
    font-weight: 700;
    border-radius: 0;
}

.filterbar .view-switch {
    border: 1px solid var(--border);
    border-radius: 0;
}

.view-btn {
    min-height: 26px;
    padding: 4px 12px;
    font-size: 12px;
    font-weight: 700;
    background: var(--white);
    color: var(--muted);
}

.view-btn:hover {
    color: var(--red);
    background: var(--surface-soft);
}

.view-btn.active {
    background: var(--red);
    color: var(--white);
}

/* Subtle card lifts after older reset rules. */
.task-card:hover,
.project-card:hover {
    transform: translateY(-2px);
    box-shadow: var(--shadow-md);
}

.nav-project:hover,
.nav-project.is-active {
    background: var(--red-light);
}

/* Shturman dashboard metrics. */
.dpr-director .dpr-metric {
    border-radius: 0;
    background: var(--white);
    border: 1px solid var(--border);
    box-shadow: var(--shadow-sm);
    padding: 12px 14px;
}

.dpr-director .dpr-metric:hover {
    transform: translateY(-2px);
    box-shadow: var(--shadow-md);
}

.dpr-director .dpr-metric strong {
    font-size: 32px;
    font-family: "PT Sans Narrow", sans-serif;
    color: var(--red);
    line-height: 1.1;
}

.dpr-director .dpr-metric span {
    font-size: 12px;
    color: var(--gray);
    text-transform: uppercase;
    letter-spacing: 0.03em;
    font-weight: 700;
}

/* Shturman dashboard cards. */
.dpr-card {
    border-radius: 0;
    box-shadow: var(--shadow-sm);
}

.dpr-card:hover {
    transform: translateY(-2px);
    box-shadow: var(--shadow-md);
}

/* Shturman widget headers. */
.dpr-director .dpr-block__head {
    background: var(--surface-soft);
    border-bottom: 2px solid var(--red);
    padding: 10px 14px;
}

.dpr-director .dpr-block__head h3,
.dpr-director .dpr-block__head h2 {
    font-family: "PT Sans Narrow", sans-serif;
    font-size: 18px;
    font-weight: 700;
    margin: 0;
    color: var(--black);
}

/* Global data tables. */
.data-table {
    border-collapse: collapse;
}

.data-table th {
    background: var(--surface-soft);
    color: var(--gray);
    font-weight: 700;
    font-size: 12px;
    letter-spacing: 0.04em;
    border-bottom: 2px solid var(--border);
    padding: 10px 12px;
}

.data-table td {
    border-bottom: 1px solid var(--line-soft);
    padding: 8px 10px;
}

.data-table tbody tr {
    transition: var(--transition-smooth);
}

.data-table tbody tr:hover {
    background: rgba(0, 0, 0, 0.015);
}

.data-table tr.is-table-filter-hidden {
    display: none;
}

.data-table-filter-row th {
    padding: 6px 8px;
    border-bottom: 1px solid var(--border);
    background: #fff;
}

.data-table-filter-row input,
.data-table-filter-row select {
    width: 100%;
    min-width: 96px;
    height: 30px;
    padding: 4px 7px;
    border: 1px solid var(--border);
    border-radius: 6px;
    background: var(--white);
    color: var(--black);
    font-size: 12px;
    line-height: 1.2;
    text-transform: none;
}

.data-table-filter-row input:focus,
.data-table-filter-row select:focus {
    border-color: var(--red);
    outline: none;
    box-shadow: 0 0 0 2px rgba(179, 36, 39, 0.12);
}

.data-table-filter-row__empty {
    min-width: 24px;
}

.data-table-filter-empty td {
    padding: 14px;
    color: var(--muted);
    text-align: center;
}

/* Form labels. */
label > span {
    font-weight: 700;
    color: var(--gray-dark);
    font-size: 12.5px;
}

/* Sidebar footer actions. */
.user-mini {
    border-bottom: 1px solid var(--border);
    padding-bottom: 10px;
    margin-bottom: 10px;
}

.tour-start {
    width: 100%;
    min-height: 30px;
    background: var(--surface-soft);
    border: 1px solid var(--border);
    border-radius: 0;
    color: var(--gray-dark);
    font-weight: 700;
    font-size: 12px;
    cursor: pointer;
    margin-bottom: 6px;
}

.tour-start:hover {
    background: var(--red);
    color: var(--white);
    border-color: var(--red);
    box-shadow: var(--shadow-sm);
}

.manual-link {
    display: block;
    padding: 6px 10px;
    color: var(--gray-dark);
    font-weight: 700;
    font-size: 12px;
    border: 1px dashed var(--border);
    margin-bottom: 6px;
    text-align: center;
}

.manual-link:hover,
.manual-link.is-active {
    border-style: solid;
    border-color: var(--red);
    color: var(--red);
    background: var(--red-light);
}

.link-muted {
    display: block;
    padding: 6px 10px;
    color: var(--muted);
    font-weight: 700;
    font-size: 12px;
    text-align: center;
}

.link-muted:hover {
    color: var(--red);
    background: var(--red-light);
}

.nav-menu {
    display: grid;
}

.nav-menu__summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 31px;
    padding: 7px 20px;
    border-left: 3px solid transparent;
    color: #222222;
    font-size: 13px;
    cursor: pointer;
    list-style: none;
    transition: background-color var(--fast), color var(--fast), border-color var(--fast);
}

.nav-menu__summary::-webkit-details-marker {
    display: none;
}

.nav-menu__summary::after {
    content: "+";
    color: var(--gray-light);
    font-size: 13px;
    font-weight: 700;
}

.nav-menu[open] .nav-menu__summary::after {
    content: "-";
}

.nav-menu__summary:hover,
.nav-menu.is-active .nav-menu__summary {
    border-left-color: var(--red);
    background: var(--red-light);
    color: var(--red);
    font-weight: 700;
}

.nav-menu__items {
    display: grid;
    padding: 2px 0 6px;
}

.nav-menu__items .nav__link {
    min-height: 28px;
    padding-left: 32px;
    font-size: 12px;
}


.task-commandbar {
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    gap: 8px;
    padding: 7px 18px;
    border-bottom: 1px solid var(--border);
    background: var(--white);
}

.task-commandbar__main {
    display: flex;
    flex: 1 1 auto;
    align-items: center;
    gap: 8px;
    min-width: 0;
}

.task-commandbar__hint {
    overflow: hidden;
    color: var(--gray-light);
    font-size: 12px;
    font-weight: 700;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.task-filter-toggle {
    flex: 0 0 auto;
}

.task-filter-chips {
    display: flex;
    gap: 5px;
    min-width: 0;
    overflow: hidden;
}

.task-filter-chip {
    flex: 0 0 auto;
    max-width: 160px;
    overflow: hidden;
    padding: 3px 7px;
    border: 1px solid var(--border);
    background: var(--surface-soft);
    color: var(--gray);
    font-size: 12px;
    font-weight: 700;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.task-tag-filter {
    flex: 0 0 auto;
    margin: 0;
}

.task-tag-filter select {
    width: 150px;
    min-height: 30px;
    padding: 4px 28px 4px 10px;
    border-color: var(--border);
    background-color: var(--surface);
    color: var(--gray-dark);
    font-size: 12px;
    font-weight: 700;
}

.task-tags-toggle {
    flex: 0 0 auto;
}

.task-tags-toggle.is-active {
    border-color: var(--red);
    background: var(--red);
    color: var(--white);
}

.task-tags-toggle.is-active:hover {
    background: var(--red-hover);
    color: var(--white);
}

.task-filter-panel {
    max-height: 0;
    padding-top: 0;
    padding-bottom: 0;
    border-bottom-color: transparent;
    opacity: 0;
    overflow: hidden;
    pointer-events: none;
    transform: translateY(-6px);
    transition: max-height .22s ease, opacity .16s ease, transform .22s ease, padding .22s ease, border-color .22s ease;
}

.task-filter-panel.is-open {
    max-height: 420px;
    padding-top: 6px;
    padding-bottom: 6px;
    border-bottom-color: var(--border);
    opacity: 1;
    overflow: visible;
    pointer-events: auto;
    transform: translateY(0);
}

.task-filter-actions {
    position: sticky;
    right: 0;
    z-index: 2;
    display: inline-flex;
    flex: 0 0 auto;
    gap: 6px;
    margin-left: auto;
    padding-left: 12px;
    background: linear-gradient(90deg, rgba(251, 251, 249, 0), var(--surface-soft) 16px);
}

@media (max-width: 560px) {
    .task-commandbar {
        gap: 6px;
        padding: 7px 10px;
        overflow-x: auto;
    }

    .task-commandbar__main {
        flex: 0 0 auto;
    }

    .task-filter-chips,
    .task-commandbar__hint {
        display: none;
    }

    .filterbar {
        align-items: center;
        flex-direction: row;
        flex-wrap: nowrap;
        overflow-x: auto;
    }

    .filterbar select,
    .filterbar .btn,
    .filterbar .view-switch,
    .task-tag-filter,
    .task-tags-toggle {
        flex: 0 0 auto;
        width: auto;
    }

    .task-tag-filter select {
        width: 136px;
    }

    .task-filter-actions {
        margin-left: 0;
        padding-left: 0;
        background: var(--surface-soft);
    }

    .sidebar__footer .tour-start {
        width: auto;
        margin: 0;
    }
}

@media (max-width: 900px) {
    .nav-menu {
        flex: 0 0 auto;
    }

    .nav-menu__summary {
        min-height: 34px;
        padding: 7px 10px;
        border-left: 0;
        border-bottom: 3px solid transparent;
        white-space: nowrap;
    }

    .nav-menu__summary:hover,
    .nav-menu.is-active .nav-menu__summary {
        border-bottom-color: var(--red);
        border-left-color: transparent;
    }

    .nav-menu__items {
        position: absolute;
        z-index: 40;
        min-width: 180px;
        padding: 4px;
        border: 1px solid var(--border);
        background: var(--white);
        box-shadow: var(--shadow-md);
    }

    .nav-menu__items .nav__link {
        padding: 7px 10px;
        border-left: 0;
        border-bottom: 0;
    }
}

/* Kanban card layout repair: keep dense meta inside narrow columns. */
.kanban {
    align-items: start;
    grid-template-columns: repeat(5, minmax(260px, 1fr));
}

.kanban__body {
    display: grid;
    gap: 10px;
    padding: 10px;
}

.kanban__body .task-card {
    min-width: 0;
    margin: 0;
    padding: 14px 16px;
    overflow: hidden;
}

.kanban__body .task-card a {
    display: block;
    min-width: 0;
}

.kanban__body .task-card a strong,
.kanban__body .task-card a span {
    max-width: 100%;
    word-break: break-word;
}

.kanban__body .card-meta {
    position: relative;
    justify-content: flex-start;
    flex-wrap: wrap;
    gap: 8px 10px;
    min-width: 0;
    min-height: 28px;
    margin: 12px 0 0;
    padding-right: 38px;
}

.kanban__body .card-meta > * {
    flex: 0 1 auto;
    max-width: 100%;
}

.kanban__body .task-card__status,
.kanban__body .tag-from-me {
    overflow: hidden;
    text-overflow: ellipsis;
}

.kanban__body .avatar {
    position: absolute;
    top: 0;
    right: 0;
    flex: 0 0 28px;
    width: 28px;
    height: 28px;
    margin-left: 0;
    font-size: 12px;
}

.kanban__body .pill {
    flex: 0 0 auto;
}

.kanban__body .task-card__tags {
    min-width: 0;
    margin-top: 10px;
    overflow: hidden;
}

.kanban__body .task-card__tags .task-tag {
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
}

.kanban__body .progress {
    margin-top: 10px;
}

.kanban__body .progress-placeholder {
    display: block;
    margin-top: 12px;
}

@media (max-width: 900px) {
    .kanban {
        grid-template-columns: repeat(5, minmax(240px, 1fr));
    }
}

/* Task detail side stats drawer. */
.task-layout {
    position: relative;
    transition: grid-template-columns .24s ease, column-gap .24s ease;
}

.task-layout.is-task-side-collapsed {
    grid-template-columns: minmax(0, 1fr) 0;
    column-gap: 0;
}

.task-side[hidden] {
    display: none;
}

.task-side {
    min-width: 0;
    overflow: hidden;
    opacity: 1;
    transform: translateX(0);
    transition: opacity .18s ease, transform .24s ease, visibility .24s ease;
}

.task-layout.is-task-side-collapsed .task-side {
    visibility: hidden;
    opacity: 0;
    pointer-events: none;
    transform: translateX(18px);
}

.task-side-toggle {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    flex: 0 0 auto;
    margin-left: auto;
    min-height: 26px;
    padding: 4px 10px;
    border: 1px solid rgba(255, 255, 255, .24);
    border-radius: 0;
    border-color: rgba(255, 255, 255, .28);
    background: rgba(255, 255, 255, .08);
    color: var(--white);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .06em;
    line-height: 1;
    text-transform: uppercase;
    cursor: pointer;
}

.task-side-toggle__icon {
    width: 13px;
    height: 10px;
    border: 1px solid currentColor;
    box-shadow: inset -4px 0 0 currentColor;
    opacity: .78;
}

.task-side-toggle:hover {
    border-color: var(--white);
    background: var(--white);
    color: var(--black);
}

@media (max-width: 620px) {
    .task-work-window__bar {
        flex-wrap: wrap;
    }

    .task-work-window__bar-actions {
        width: 100%;
        flex-wrap: wrap;
        justify-content: flex-start;
    }

    .task-side-toggle {
        width: 100%;
        margin-left: 0;
        justify-content: center;
    }
}

/* Shtab transition visual alignment: softer surfaces for a calmer migration. */
:root {
    --red: #B21E2B;
    --red-hover: #9E1824;
    --red2: #C12A36;
    --red-light: #FFF1F3;
    --red-mid: #F6D5DA;
    --black: #171E3A;
    --gray-dark: #27304B;
    --gray: #4A556F;
    --gray-light: #5F6878; /* WCAG AA on white and soft panels */
    --muted: #5F6368;
    --border: #E4E9F2;
    --bg: #F6F8FC;
    --surface: #FFFFFF;
    --surface-soft: #F8FAFD;
    --surface-hover: #F1F5FB;
    --ink: #171E3A;
    --line: #E9EEF5;
    --line-soft: #F2F5FA;
    --field-bg: #FFFFFF;
    --blue: #2563EB;
    --blue-light: #EEF5FF;
    --focus-red: rgba(178, 30, 43, .12);
    --radius-sm: 8px;
    --radius-md: 12px;
    --shadow-sm: 0 1px 2px rgba(23, 30, 58, .05);
    --shadow-md: 0 4px 6px -1px rgba(23, 30, 58, .07), 0 12px 34px -10px rgba(23, 30, 58, .14);
    --shadow-lg: 0 18px 46px -18px rgba(23, 30, 58, .22);
    --shadow-premium: 0 4px 6px -1px rgba(23, 30, 58, .07), 0 12px 40px -6px rgba(23, 30, 58, .12), 0 2px 4px rgba(23, 30, 58, .04);
}

body,
button,
input,
select,
textarea {
    font-family: "Inter", "PT Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

body {
    background: var(--bg);
    color: var(--black);
    font-size: 13px;
    line-height: 1.45;
}

::-webkit-scrollbar-thumb {
    border-radius: 999px;
    background: rgba(102, 112, 133, .28);
}

::-webkit-scrollbar-thumb:hover {
    background: rgba(178, 30, 43, .72);
}

.app-shell {
    background: var(--bg);
}

.sidebar {
    background: rgba(255, 255, 255, .96);
    border-right: 1px solid var(--border);
    box-shadow: 8px 0 30px rgba(23, 30, 58, .03);
}

.brand {
    align-items: center;
    margin: 12px;
    padding: 12px;
    border-bottom: 0;
    border-radius: 14px;
    background: var(--surface-soft);
    font-family: "Inter", "PT Sans", sans-serif;
}

.brand__mark {
    color: var(--black);
    font-family: "Inter", "PT Sans", sans-serif;
    font-size: 23px;
    font-weight: 750;
    letter-spacing: 0;
}

.brand__text,
.brand__sub {
    color: var(--muted);
    font-family: "Inter", "PT Sans", sans-serif;
    font-size: 12px;
    font-weight: 600;
}

.nav {
    padding: 4px 10px 12px;
}

.nav__group {
    margin: 14px 8px 6px;
    color: var(--gray-light);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .08em;
}

.nav__link,
.nav-menu__summary,
.nav-project {
    min-height: 34px;
    border-left: 0 !important;
    border-bottom: 0 !important;
    border-radius: 10px !important;
    color: var(--gray-dark);
    font-weight: 600;
}

.nav__link {
    padding: 8px 10px;
}

.nav__link:hover,
.nav__link.is-active,
.nav-menu__summary:hover,
.nav-menu.is-active .nav-menu__summary,
.nav-project:hover,
.nav-project.is-active {
    background: var(--surface-hover);
    color: var(--black);
    transform: none;
}

.nav__link.is-active,
.nav-menu.is-active .nav-menu__summary,
.nav-project.is-active {
    box-shadow: inset 3px 0 0 var(--red);
}

.nav-menu__summary {
    padding: 8px 10px;
}

.nav-menu__summary::after {
    color: var(--gray-light);
}

.nav-menu__items {
    gap: 2px;
    padding: 4px 0 6px 12px;
}

.nav-menu__items .nav__link {
    min-height: 30px;
    padding: 7px 10px;
}

.sidebar__footer {
    padding: 12px;
    border-top: 1px solid var(--line);
}

.user-mini {
    margin-bottom: 8px;
    padding: 8px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: var(--surface-soft);
}

.main {
    padding: 18px 20px;
}

.topbar h1,
.panel__head h2,
.project-head h2,
.kanban__head h2,
.task-passport__head h2,
.dpr-director .dpr-block__head h2,
.dpr-director .dpr-block__head h3,
.dpr-director .dpr-metric strong,
.metric span {
    font-family: "Inter", "PT Sans", sans-serif;
    letter-spacing: 0;
}

.topbar h1 {
    font-size: 28px;
    font-weight: 750;
    line-height: 1.14;
}

.topbar__line {
    width: 48px;
    height: 2px;
    border-radius: 999px;
    background: var(--red);
}

.panel,
.project-card,
.dpr-card,
.dpr-metric,
.metric,
.task-card,
.kanban__column,
.guest-card,
.gantt-workspace,
.project-file-pane,
.schedule-board__column,
.custom-field,
.details-panel,
.alert {
    border-color: var(--border);
    border-radius: 14px !important;
    background: var(--surface);
    box-shadow: var(--shadow-sm);
}

.panel:hover,
.project-card:hover,
.dpr-card:hover,
.dpr-metric:hover,
.task-card:hover {
    border-color: #D6DEEA;
    box-shadow: var(--shadow-md);
}

.panel__head,
.kanban__head,
.dpr-director .dpr-block__head {
    min-height: 42px;
    padding: 11px 14px;
    border-bottom: 1px solid var(--line);
    background: var(--surface);
}

.panel__head h2,
.project-head h2,
.kanban__head h2,
.dpr-director .dpr-block__head h2,
.dpr-director .dpr-block__head h3 {
    color: var(--black);
    font-size: 16px;
    font-weight: 700;
}

.btn,
.btn-outline,
.btn-red,
.btn--red,
.btn-primary,
.btn-secondary,
.btn-ghost,
.tour-start,
.manual-link,
.link-muted,
.overdue-action,
input,
select,
textarea,
.view-switch,
.view-btn,
.task-filter-chip,
.counter,
.pill,
.task-card__status,
.tag-from-me,
.task-tag,
.approval-pill,
.scope-pill,
.file-link,
.tabs a,
.folder-tree__link {
    border-radius: 9px !important;
}

.btn,
.btn-outline,
.btn-red,
.btn--red,
.btn-primary,
.btn-secondary {
    min-height: 34px;
    font-weight: 700;
}

.btn:hover,
.btn-outline:hover,
.btn-red:hover,
.btn--red:hover,
.btn-primary:hover,
.btn-secondary:hover,
.tour-start:hover,
.manual-link:hover,
.link-muted:hover {
    transform: translateY(-1px);
}

.btn--red,
.btn-red,
.btn-primary,
.view-btn.active,
.overdue-action {
    border-color: var(--red);
    background: var(--red);
    color: var(--white);
}

input,
select,
textarea {
    border-color: var(--border);
    background: var(--field-bg);
}

input:focus,
select:focus,
textarea:focus {
    border-color: var(--blue);
    box-shadow: 0 0 0 3px rgba(37, 99, 235, .12);
}

.filterbar,
.task-commandbar {
    border-bottom: 1px solid var(--line);
    background: rgba(248, 250, 253, .96);
}

.filterbar select,
.filterbar .btn,
.filterbar .view-switch,
.view-btn {
    min-height: 30px;
}

.view-switch {
    overflow: hidden;
    border-color: var(--border);
    background: var(--surface);
}

.view-btn {
    color: var(--gray);
    background: transparent;
}

.view-btn:hover {
    background: var(--surface-hover);
    color: var(--black);
}

.kanban {
    gap: 14px;
    padding: 14px 20px 20px;
}

.kanban__column {
    overflow: hidden;
    border-radius: 16px !important;
    background: var(--surface-soft);
}

.kanban__column.is-drag-over {
    border-color: rgba(37, 99, 235, .45);
    background: #F2F7FF;
}

.kanban__column.is-drag-over .kanban__body {
    background: #F2F7FF;
    outline-color: rgba(37, 99, 235, .35);
}

.kanban__head h2 {
    font-size: 19px;
    font-weight: 750;
}

.kanban__head-actions {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    flex: 0 0 auto;
}

.kanban__quick-create {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 8px;
    background: var(--red);
    color: #fff;
    font-size: 20px;
    line-height: 1;
    font-weight: 700;
    text-decoration: none;
}

.kanban__quick-create:hover {
    background: var(--red-dark);
    color: #fff;
}

.kanban__body {
    gap: 10px;
    padding: 10px;
}

.kanban__body .task-card {
    border-radius: 12px !important;
    padding: 14px;
    box-shadow: none;
}

.task-card:hover,
.project-card:hover {
    transform: translateY(-2px);
}

.task-card a strong {
    color: var(--black);
    font-size: 15px;
    font-weight: 700;
    line-height: 1.35;
}

.task-card a span {
    color: var(--muted);
    font-size: 12px;
}

.kanban__body .card-meta {
    gap: 7px 8px;
    padding-right: 38px;
}

.avatar {
    border-radius: 999px !important;
    border-color: rgba(178, 30, 43, .16);
    background: var(--red);
    color: var(--white);
}

.kanban__body .avatar {
    box-shadow: 0 4px 12px rgba(178, 30, 43, .18);
}

.progress,
.prog-bar,
.project-progress__bar,
.workload-bar {
    border-radius: 999px !important;
}

.progress {
    background: var(--line-soft);
}

.prog-bar,
.project-progress__bar span,
.workload-bar span {
    background: var(--red);
}

.data-table th {
    border-bottom: 1px solid var(--line);
    background: var(--surface-soft);
    color: var(--gray);
    font-size: 12px;
    letter-spacing: .02em;
}

.data-table tbody tr:hover {
    background: #F8FAFD;
}

.task-work-window {
    overflow: hidden;
    border: 1px solid var(--border);
    border-radius: 16px !important;
    box-shadow: var(--shadow-md);
}

.task-work-window::before {
    inset: 38px auto 0 0;
    width: 3px;
    background: var(--red);
}

.task-work-window__bar {
    background: var(--black);
}

.task-work-window__bar span,
.task-work-window__bar strong {
    font-family: "Inter", "PT Sans", sans-serif;
}

.task-side-toggle {
    border-radius: 9px !important;
}

.task-side .panel,
.task-side .dpr-card {
    border-radius: 14px !important;
}

.tour-start,
.manual-link,
.link-muted {
    border-style: solid;
    background: var(--surface-soft);
}

.manual-link:hover,
.manual-link.is-active,
.link-muted:hover,
.tour-start:hover {
    border-color: var(--border);
    background: var(--surface-hover);
    color: var(--black);
}

.dpr-director .dpr-metric strong {
    font-size: 30px;
    color: var(--black);
}

@media (max-width: 900px) {
    .brand {
        margin: 6px 8px;
        padding: 8px 10px;
    }

    .nav__link,
    .nav-menu__summary,
    .nav-project {
        border-radius: 9px !important;
    }

    .nav-menu__items {
        border-radius: 12px !important;
        box-shadow: var(--shadow-premium);
    }
}

/* Task detail softening for the same Shtab-like calm surface. */
.task-work-window::before {
    display: none;
}

.task-work-window__bar {
    border-bottom: 1px solid var(--line);
    background: var(--surface);
    color: var(--black);
}

.task-work-window__bar span {
    color: var(--black);
}

.task-work-window__bar strong {
    color: var(--muted);
}

.task-mail-chip {
    border-color: var(--border);
    background: var(--surface-soft);
    color: var(--black);
}

.task-mail-chip:hover {
    border-color: var(--red);
    background: var(--red);
    color: var(--white);
}

.task-side-toggle {
    border-color: var(--border);
    background: var(--surface-soft);
    color: var(--black);
}

.task-side-toggle:hover {
    border-color: #D6DEEA;
    background: var(--surface-hover);
    color: var(--black);
}

.task-passport__crumbs {
    color: var(--muted);
}

.task-passport__head h2 {
    font-size: 24px;
    font-weight: 750;
}

.task-tags span {
    border-radius: 8px !important;
}

.smart-card {
    border-color: var(--border);
    border-radius: 14px !important;
    background: var(--surface);
    box-shadow: var(--shadow-sm);
}

.smart-card__head {
    border-bottom: 1px solid var(--line);
    background: var(--surface-soft);
    color: var(--gray-dark);
    letter-spacing: .07em;
}

.smart-card__head small {
    color: var(--gray-light);
}

.smart-row {
    grid-template-columns: 44px minmax(0, 1fr);
    border-bottom-color: var(--line-soft);
    background: var(--surface);
}

.smart-row__mark {
    align-self: start;
    width: 24px;
    height: 24px;
    margin: 10px 0 0 12px;
    border-radius: 8px;
    background: var(--surface-hover);
    color: var(--gray);
    font-family: "Inter", "PT Sans", sans-serif;
    font-size: 12px;
}

.smart-row--dependency .smart-row__mark {
    background: var(--amber-light);
    color: var(--amber);
}

.smart-row__body {
    padding: 10px 14px 10px 0;
}

.smart-row__body span {
    color: var(--gray-light);
    letter-spacing: .06em;
}

.smart-row__body p {
    color: var(--gray-dark);
}

.task-exchange-actions,
.task-fold,
.task-panel-fold {
    border-color: var(--border);
    border-radius: 14px !important;
    background: var(--surface);
    box-shadow: var(--shadow-sm);
}

.task-exchange-actions {
    border-left-width: 1px;
}

.task-exchange-actions__title strong {
    font-family: "Inter", "PT Sans", sans-serif;
    font-size: 14px;
}

.task-fold__summary,
.task-panel-fold__summary {
    background: var(--surface);
}

/* Role model and sidebar repair. */
.brand {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr);
    gap: 2px;
    align-items: start;
    min-width: 0;
}

.brand__mark,
.brand__sub {
    display: block;
    min-width: 0;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.brand__sub {
    text-transform: none;
}

.nav-projects {
    display: grid;
    gap: 4px;
    margin: 4px 0 2px;
}

.nav-project {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 1px 8px;
    min-width: 0;
    padding: 8px 10px;
}

.nav-project span,
.nav-project small {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.nav-project small {
    grid-column: 1;
}

.nav-project b {
    grid-row: 1 / span 2;
    grid-column: 2;
    align-self: center;
}

.topbar {
    flex-wrap: wrap !important;
    min-width: 0;
    min-height: 48px;
    height: auto;
    row-gap: 6px;
}

.topbar__title {
    flex: 1 1 260px;
    min-width: 0;
}

.topbar h1,
.topbar__subtitle {
    max-width: 100%;
}

.topbar__actions,
.topbar__meta {
    flex: 0 1 auto;
    min-width: 0;
    flex-wrap: wrap !important;
}

.topbar__actions form {
    min-width: 0;
}

.role-model .data-table th,
.role-model .data-table td {
    vertical-align: top;
}

.role-model .data-table td:nth-child(2),
.role-model .data-table td:nth-child(3) {
    color: var(--gray);
}

.role-model code {
    display: inline-flex;
    padding: 2px 7px;
    border-radius: 8px;
    background: var(--surface-soft);
    color: var(--gray-dark);
}

@media (max-width: 720px) {
    .topbar {
        align-items: flex-start;
        padding-top: 8px;
        padding-bottom: 8px;
    }

    .topbar__title,
    .topbar__actions,
    .topbar__meta {
        flex-basis: 100%;
        justify-content: flex-start;
    }

    .topbar h1 {
        white-space: normal;
    }
}

/* Typography guard: product UI uses one readable family. Display/narrow type is
   allowed for brand accents only, never for names, tables, forms, or lists. */
.content,
.content input,
.content select,
.content textarea,
.content button,
.content .btn,
.content .panel,
.content .data-table,
.content .data-table th,
.content .data-table td,
.content .filterbar,
.content .workday-task,
.content .time-task-pick,
.content .note-card,
.content .people-search-result,
.content .search-result,
.content .project-role-card strong,
.content .project-member-role,
.content .dpr-table,
.content .dpr-table th,
.content .dpr-table td,
.content .dpr-matrix-person,
.content .dpr-matrix-cell {
    font-family: var(--font-body) !important;
}

.content h1,
.content h2,
.content h3,
.content h4,
.content .topbar h1,
.content .panel__head h2,
.content .project-passport-title h2,
.content .metric span,
.content .analytics-metric span {
    font-family: var(--font-heading) !important;
}

.content .project-role-card small,
.content .data-table th,
.content .form-grid label > span,
.content .form-stack label > span,
.content .project-task-filterbar label > span {
    font-family: var(--font-body) !important;
    letter-spacing: 0;
}

.topbar h1 {
    font-size: var(--work-title-size) !important;
}

.topbar__actions {
    gap: 10px !important;
}

.topbar__actions .btn.btn--red,
.topbar__actions .btn.btn-red {
    background: var(--white);
    color: var(--red);
    border-color: rgba(168, 26, 26, .38);
}

.topbar__actions .btn.btn--red:hover,
.topbar__actions .btn.btn-red:hover {
    background: var(--red-light);
    color: var(--red);
}

.nav-project.is-active,
.nav-project:hover {
    border-color: transparent !important;
    background: var(--red-light) !important;
    box-shadow: inset 3px 0 0 var(--red);
}

.data-table-filter-row th {
    background: var(--surface-soft) !important;
}

.data-table th {
    text-transform: none !important;
    font-weight: 800;
}

input[type="date"] {
    padding-right: 32px !important;
}

input[type="date"]::-webkit-calendar-picker-indicator {
    margin-right: 4px;
}

.project-passport-head .project-role-card {
    border: 0 !important;
    background: var(--surface-soft);
}

.project-passport-head .project-role-card--lead {
    background: #fff8f8;
    box-shadow: inset 3px 0 0 rgba(168, 26, 26, .52);
}

/* Lighter task list and fast task creation flow. */
.tasks-screen {
    background: var(--bg);
}

.task-queue {
    margin: 10px 20px 0;
    overflow: hidden;
}

.task-queue__summary {
    cursor: pointer;
}

.task-queue__summary::-webkit-details-marker {
    display: none;
}

.task-queue__summary::after {
    content: "Показать";
    margin-left: auto;
    color: var(--gray-light);
    font-size: 12px;
    font-weight: 700;
}

.task-queue[open] .task-queue__summary::after {
    content: "Скрыть";
}

.task-table--projects {
    display: grid;
    gap: 10px;
    padding: 14px 20px 22px;
    background: transparent;
    overflow: visible;
}

.project-task-group {
    min-width: 0;
    overflow: hidden;
    border: 1px solid var(--border);
    border-radius: 14px;
    background: var(--surface);
    box-shadow: var(--shadow-sm);
}

.project-task-group__head {
    display: grid;
    grid-template-columns: minmax(86px, auto) minmax(0, 1fr) auto;
    gap: 8px 12px;
    align-items: center;
    min-height: 46px;
    padding: 10px 14px;
    border-bottom: 1px solid var(--line);
    cursor: pointer;
    list-style: none;
}

.project-task-group__head::-webkit-details-marker {
    display: none;
}

.project-task-group__code {
    color: var(--red);
    font-size: 12px;
    font-weight: 800;
}

.project-task-group__title {
    min-width: 0;
    overflow: hidden;
    color: var(--black);
    font-weight: 700;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-task-group__meta {
    display: inline-flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 6px;
    color: var(--muted);
    font-size: 12px;
    font-weight: 700;
}

.project-task-group__meta b,
.project-task-group__meta em {
    font-style: normal;
}

.project-task-group__meta em {
    padding: 2px 6px;
    border-radius: 999px;
    background: var(--red-light);
    color: var(--red);
}

.project-task-list {
    display: grid;
}

.project-task-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(138px, 180px) 92px minmax(92px, 132px);
    gap: 10px;
    align-items: center;
    min-width: 0 !important;
    min-height: 58px;
    padding: 9px 14px;
    border-bottom: 1px solid var(--line-soft);
    background: var(--surface);
}

.project-task-row:last-child {
    border-bottom: 0;
}

.project-task-row:hover {
    background: var(--surface-soft);
}

.project-task-row__main {
    display: grid;
    gap: 5px;
    min-width: 0;
}

.project-task-row .task-name {
    min-width: 0;
    overflow: hidden;
    color: var(--black);
    font-size: 13px;
    font-weight: 750;
    line-height: 1.25;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-task-row .task-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    min-width: 0;
}

.project-task-row__people {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-width: 0;
    color: var(--gray);
    font-size: 12px;
    font-weight: 600;
}

.project-task-row__people span:last-child {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-task-row__date {
    justify-self: start;
    font-size: 12px;
    font-weight: 750;
}

.project-task-row__progress {
    min-width: 0;
}

.project-task-row--done {
    opacity: .72;
}

.project-task-done {
    border-top: 1px solid var(--line);
    background: var(--surface-soft);
}

.project-task-done > summary,
.project-task-empty {
    padding: 8px 14px;
    color: var(--muted);
    font-size: 12px;
    font-weight: 750;
    list-style: none;
}

.project-task-done > summary {
    cursor: pointer;
}

.project-task-done > summary::-webkit-details-marker {
    display: none;
}

.tag-blocked {
    background: var(--red-light);
    color: var(--red);
}

.task-create-form {
    display: grid;
    gap: 12px;
    max-width: 1040px;
    margin: 0 auto;
}

.task-form-card,
.task-form-fold {
    overflow: hidden;
}

.task-form-card:has(.participant-picker details[open]) {
    overflow: visible;
}

.task-form-head {
    align-items: start;
    border-bottom: 1px solid var(--line);
}

.task-form-head p {
    margin: 4px 0 0;
    color: var(--muted);
    font-size: 12px;
    font-weight: 500;
}

.task-form-quick,
.task-form-details {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    padding: 16px 18px 18px;
}

.task-form-section-title {
    display: flex;
    gap: 10px;
    align-items: baseline;
    justify-content: space-between;
    min-width: 0;
    margin-bottom: 10px;
}

.task-form-section-title span {
    color: var(--gray-dark);
    font-size: 12px;
    font-weight: 900;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.task-form-section-title b {
    min-width: 0;
    color: var(--muted);
    font-size: 12px;
    font-weight: 600;
    text-align: right;
}

.task-kind,
.task-form-composition {
    margin: 0 18px 18px;
    padding: 14px;
    border: 1px solid var(--line);
    border-radius: 12px !important;
    background: var(--surface-soft);
}

.task-kind-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
}

.task-create-form .task-kind-card {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 9px;
    align-items: start;
    min-width: 0;
    padding: 11px 12px;
    border: 1px solid var(--line);
    border-radius: 10px !important;
    background: var(--white);
    cursor: pointer;
    transition: border-color .18s ease, box-shadow .18s ease, background .18s ease;
}

.task-kind-card input[type="radio"] {
    width: 16px;
    height: 16px;
    min-height: auto;
    margin-top: 1px;
}

.task-create-form .task-kind-card:has(input:checked) {
    border-color: rgba(168, 26, 26, .42);
    background: #fffafa;
    box-shadow: 0 0 0 3px rgba(168, 26, 26, .08);
}

.task-create-form .task-kind-card > span {
    display: grid;
    gap: 3px;
    margin: 0;
    color: inherit;
    font-size: inherit;
    font-weight: inherit;
    letter-spacing: 0;
    text-transform: none;
}

.task-kind-card strong {
    color: var(--gray-900);
    font-size: 14px;
    line-height: 1.2;
}

.task-kind-card small {
    color: var(--muted);
    font-size: 12px;
    line-height: 1.25;
}

.task-kind-note {
    margin: 10px 0 0;
    color: var(--gray);
    font-size: 13px;
    line-height: 1.45;
}

.task-form-composition__grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}

.task-form-wide {
    grid-column: 1 / -1;
}

.task-project-context {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 5px 10px;
    align-content: start;
    align-items: center;
    min-width: 0;
    min-height: 38px;
    padding: 9px 10px;
    border: 1px solid var(--line);
    border-radius: 10px !important;
    background: var(--surface-soft);
}

.task-project-context > span {
    grid-column: 1 / -1;
    color: var(--gray-dark);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.task-project-context strong {
    min-width: 0;
    overflow: hidden;
    color: var(--gray-900);
    font-size: 14px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.task-project-context .btn {
    align-self: center;
    min-height: 30px;
    padding: 5px 9px;
}

.task-create-form label {
    display: grid;
    align-content: start;
}

.task-create-form label > span {
    margin-bottom: 5px;
    color: var(--gray-dark);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.task-create-form input,
.task-create-form select,
.task-create-form textarea {
    min-height: 38px;
    border-radius: 10px !important;
}

.task-create-form select[multiple] {
    min-height: 118px;
}

.participant-picker {
    position: relative;
    display: grid;
    align-content: start;
    min-width: 0;
}

.participant-picker > span {
    margin-bottom: 5px;
    color: var(--gray-dark);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.participant-picker details {
    position: relative;
}

.participant-picker summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 38px;
    padding: 8px 34px 8px 10px;
    border: 1px solid var(--line);
    border-radius: 10px !important;
    background: var(--white);
    color: var(--gray-900);
    font-size: 14px;
    cursor: pointer;
    list-style: none;
}

.participant-picker summary::-webkit-details-marker {
    display: none;
}

.participant-picker summary::after {
    content: "";
    position: absolute;
    right: 12px;
    top: 50%;
    width: 7px;
    height: 7px;
    border-right: 1.5px solid var(--gray-light);
    border-bottom: 1.5px solid var(--gray-light);
    transform: translateY(-65%) rotate(45deg);
}

.participant-picker details[open] summary {
    border-color: rgba(168, 26, 26, .32);
    box-shadow: 0 0 0 3px rgba(168, 26, 26, .08);
}

.participant-picker__menu {
    position: absolute;
    z-index: 20;
    top: calc(100% + 6px);
    left: 0;
    right: 0;
    display: grid;
    max-height: 260px;
    overflow: auto;
    padding: 6px;
    border: 1px solid var(--line);
    border-radius: 10px !important;
    background: var(--white);
    box-shadow: var(--shadow);
}

.task-create-form .participant-picker__menu label {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 8px;
    align-items: center;
    min-height: 34px;
    padding: 6px 8px;
    border-radius: 8px !important;
    cursor: pointer;
}

.task-create-form .participant-picker__menu label:hover {
    background: var(--surface-soft);
}

.participant-picker__menu input {
    min-height: auto;
}

.participant-picker__menu span {
    min-width: 0;
    overflow: hidden;
    color: var(--gray-900);
    font-size: 13px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.participant-picker__menu small {
    color: var(--muted);
    font-size: 12px;
}

.task-create-form textarea {
    min-height: 82px;
}

.field-hint {
    margin-top: 5px;
    color: var(--muted);
    font-size: 12px;
    line-height: 1.35;
}

.actions-inline {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    align-items: center;
}

.actions-inline form {
    margin: 0;
}

.code-inline {
    display: inline-block;
    max-width: 360px;
    color: var(--gray-dark);
    font-family: "SFMono-Regular", Consolas, "Liberation Mono", monospace;
    font-size: 12px;
    overflow-wrap: anywhere;
    white-space: normal;
}

.form-actions {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 8px;
}

.task-form-actions {
    display: flex;
    justify-content: flex-end;
    padding: 4px 0 0;
}

.task-form-actions .btn {
    min-width: 180px;
}

.task-form-fold__summary {
    cursor: pointer;
    list-style: none;
}

.task-form-fold__summary::-webkit-details-marker {
    display: none;
}

.task-form-fold__summary::after {
    content: "Развернуть";
    margin-left: auto;
    color: var(--gray-light);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.task-form-fold[open] .task-form-fold__summary::after {
    content: "Свернуть";
}

.task-custom-fields {
    display: grid;
    gap: 14px;
    padding: 16px 18px 18px;
}

.custom-field-group {
    display: grid;
    gap: 10px;
}

.custom-field-group__head {
    display: flex;
    gap: 12px;
    align-items: baseline;
    justify-content: space-between;
    padding-bottom: 7px;
    border-bottom: 1px solid var(--line);
}

.custom-field-group__head strong {
    color: var(--gray-900);
    font-size: 14px;
}

.custom-field-group__head span {
    color: var(--muted);
    font-size: 12px;
    text-align: right;
}

.custom-field-grid--form {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.task-create-form .custom-field-input > span {
    display: flex;
    gap: 6px;
    align-items: center;
    justify-content: space-between;
}

.task-create-form .custom-field-input em {
    color: var(--muted);
    font-size: 12px;
    font-style: normal;
    font-weight: 800;
}

.custom-bool {
    display: inline-flex;
    gap: 8px;
    align-items: center;
    min-height: 38px;
}

.custom-bool input {
    min-height: auto;
}

.task-create-form .link-field,
.task-create-form .link-row {
    display: grid;
    grid-template-columns: minmax(180px, .45fr) minmax(260px, 1fr) auto;
    gap: 8px;
    align-items: center;
}

.custom-bool b {
    color: var(--gray);
    font-size: 13px;
}

.tag-issuance {
    background: rgba(168, 26, 26, .08);
    color: var(--red);
}

.tag-delegation {
    background: rgba(37, 99, 235, .10);
    color: #1d4ed8;
}

.tag-bim-family {
    background: rgba(30, 142, 62, .10);
    color: #146c32;
}

.project-assistant {
    display: grid;
    gap: 18px;
}

.project-assistant__intro {
    display: grid;
    gap: 4px;
    padding: 20px 22px;
    border: 1px solid var(--line);
    border-radius: 14px !important;
    background: var(--white);
}

.project-assistant__intro span {
    color: var(--red);
    font-size: 12px;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.project-assistant__intro h2 {
    margin: 0;
    color: var(--gray-900);
    font-size: 26px;
    line-height: 1.15;
}

.assistant-group {
    display: grid;
    gap: 10px;
}

.assistant-group h3 {
    margin: 0;
    color: var(--gray-dark);
    font-size: 12px;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.assistant-action-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}

.assistant-action {
    display: grid;
    gap: 8px;
    min-width: 0;
    min-height: 138px;
    padding: 16px;
    border: 1px solid var(--line);
    border-radius: 14px !important;
    background: var(--white);
    color: inherit;
    text-decoration: none;
    transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}

.assistant-action:hover {
    border-color: rgba(168, 26, 26, .28);
    box-shadow: var(--shadow-md);
    transform: translateY(-1px);
}

.assistant-action b {
    justify-self: start;
    padding: 4px 7px;
    border-radius: 999px;
    background: var(--surface-soft);
    color: var(--red);
    font-size: 12px;
    font-weight: 900;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.assistant-action strong {
    color: var(--gray-900);
    font-size: 18px;
    line-height: 1.18;
}

.assistant-action small {
    color: var(--muted);
    font-size: 13px;
    line-height: 1.35;
}

.assistant-action.is-disabled {
    opacity: .55;
    pointer-events: none;
}

@media (max-width: 1100px) {
    .task-kind-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .assistant-action-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 900px) {
    .task-table--projects {
        padding: 10px;
    }

    .project-task-group__head {
        grid-template-columns: 1fr auto;
    }

    .project-task-group__title {
        grid-column: 1 / -1;
        grid-row: 2;
    }

    .project-task-row {
        grid-template-columns: minmax(0, 1fr);
        gap: 7px;
        align-items: start;
    }

    .project-task-row__people,
    .project-task-row__date,
    .project-task-row__progress {
        justify-self: stretch;
    }

    .task-form-quick,
    .task-form-details {
        grid-template-columns: 1fr;
        padding: 14px;
    }

    .task-form-composition__grid,
    .custom-field-grid--form {
        grid-template-columns: 1fr;
    }

    .task-kind,
    .task-form-composition {
        margin: 0 14px 14px;
    }

    .task-kind-grid {
        grid-template-columns: 1fr;
    }

    .assistant-action-grid {
        grid-template-columns: 1fr;
    }

    .task-form-section-title,
    .custom-field-group__head {
        display: grid;
        gap: 4px;
    }

    .task-form-section-title b,
    .custom-field-group__head span {
        text-align: left;
    }
}

/* Task quick drawer keeps editing inside the current work context. */
body.is-task-drawer-open {
    overflow: hidden;
}

.task-drawer {
    position: fixed;
    inset: 0;
    z-index: 4000;
    opacity: 0;
    pointer-events: none;
    transition: opacity 160ms ease;
}

.task-drawer.is-open {
    opacity: 1;
    pointer-events: auto;
}

.task-drawer__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(23, 30, 58, .28);
    backdrop-filter: blur(2px);
}

.task-drawer__panel {
    position: absolute;
    top: 0;
    right: 0;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    width: min(920px, calc(100vw - 44px));
    height: 100%;
    border-left: 1px solid var(--border);
    background: var(--bg);
    box-shadow: -22px 0 54px rgba(23, 30, 58, .2);
    transform: translateX(100%);
    transition: transform 220ms cubic-bezier(.2, .7, .2, 1);
}

.task-drawer.is-open .task-drawer__panel {
    transform: translateX(0);
}

.task-drawer__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    min-width: 0;
    min-height: 56px;
    padding: 10px 14px;
    border-bottom: 1px solid var(--line);
    background: rgba(255, 255, 255, .96);
}

.task-drawer__head div:first-child {
    display: grid;
    min-width: 0;
    gap: 2px;
}

.task-drawer__head span {
    color: var(--gray-light);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.task-drawer__head strong {
    min-width: 0;
    overflow: hidden;
    color: var(--black);
    font-size: 14px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.task-drawer__actions {
    display: inline-flex;
    flex: 0 0 auto;
    gap: 6px;
}

.task-drawer__frame {
    width: 100%;
    height: 100%;
    border: 0;
    background: var(--bg);
}

.task-drawer.is-loading .task-drawer__frame {
    opacity: .55;
}

.is-drawer-page {
    height: 100vh;
    overflow: hidden;
    background: var(--bg);
}

.is-drawer-page .app-shell {
    display: flex;
    height: 100vh;
    min-height: 0;
    overflow: hidden;
}

.is-drawer-page .sidebar {
    display: none !important;
}

.is-drawer-page .main {
    height: 100vh;
    min-height: 0;
    overflow: hidden;
    padding: 0;
}

.is-drawer-page .topbar {
    position: sticky;
    top: 0;
    z-index: 20;
    min-height: 54px;
    padding: 10px 12px;
    border-bottom: 1px solid var(--line);
    background: rgba(255, 255, 255, .96);
    backdrop-filter: blur(10px);
}

.is-drawer-page .topbar h1 {
    font-size: 18px;
    line-height: 1.2;
}

.is-drawer-page .topbar__subtitle,
.is-drawer-page .topbar__meta {
    display: none !important;
}

.is-drawer-page .content {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: 0;
}

.is-drawer-page .task-layout,
.is-drawer-page .task-layout.is-task-side-collapsed {
    grid-template-columns: minmax(0, 1fr);
    gap: 12px;
    padding: 12px;
}

.is-drawer-page .task-side,
.is-drawer-page .task-side-toggle {
    display: none !important;
}

.is-drawer-page .task-work-window {
    border-radius: 12px !important;
    box-shadow: none;
}

.is-drawer-page .task-work-window__bar {
    min-height: 38px;
}

.is-drawer-page .task-form-card,
.is-drawer-page .task-form-fold,
.is-drawer-page .task-exchange-actions,
.is-drawer-page .task-fold,
.is-drawer-page .smart-card {
    border-radius: 12px !important;
}

.is-drawer-page .task-kind-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.is-drawer-page .task-form-quick,
.is-drawer-page .task-form-details,
.is-drawer-page .task-form-composition__grid,
.is-drawer-page .custom-field-grid--form {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.is-drawer-page .task-form-wide,
.is-drawer-page .form-grid__full {
    grid-column: 1 / -1;
}

@media (max-width: 720px) {
    .task-drawer__panel {
        width: 100%;
    }

    .task-drawer__head {
        align-items: flex-start;
        flex-direction: column;
    }

    .task-drawer__actions {
        width: 100%;
    }

    .task-drawer__actions .btn {
        flex: 1 1 0;
    }

    .is-drawer-page .task-kind-grid,
    .is-drawer-page .task-form-quick,
    .is-drawer-page .task-form-details,
    .is-drawer-page .task-form-composition__grid,
    .is-drawer-page .custom-field-grid--form {
        grid-template-columns: 1fr;
    }
}

/* Workspace declutter pass: hide secondary dashboards until requested. */
.is-task-hub-page .topbar {
    display: none;
}

.is-task-hub-page .topbar__title {
    display: none;
}

.is-task-hub-page .topbar__meta .counter {
    border: 0;
    background: #F1F4FA;
    color: #59657C;
    box-shadow: none;
}

.is-task-hub-page .overdue-banner {
    min-height: 42px;
    padding: 8px 30px;
    border-top: 1px solid #F8D9DF;
    border-bottom: 1px solid #F2CCD4;
    background: #FFF8FA;
}

.is-task-hub-page .overdue-banner::before {
    display: none;
}

.is-task-hub-page .overdue-banner span {
    font-size: 13px;
    font-weight: 750;
}

.is-task-hub-page .overdue-banner strong {
    font-size: 14px;
}

.is-task-hub-page .task-commandbar {
    margin-top: 10px;
    border-top: 1px solid #E9EEF6;
}

.is-task-hub-page .task-queue {
    box-shadow: none;
}

.is-task-hub-page .task-table--projects {
    gap: 8px;
}

.is-task-hub-page .project-task-group {
    border-color: #E5EBF4;
    border-radius: 12px !important;
    box-shadow: none;
}

.is-task-hub-page .project-task-group__head {
    min-height: 42px;
    padding: 8px 14px;
    border-bottom-color: #EEF2F7;
}

.is-task-hub-page .project-task-group__code {
    color: #B91F2D;
    font-size: 12px;
}

.is-task-hub-page .project-task-group__title {
    color: #28324D;
    font-size: 13px;
}

.is-task-hub-page .project-task-row {
    grid-template-columns: minmax(460px, 1fr) minmax(146px, 176px) 112px minmax(72px, 100px);
    min-height: 56px;
    padding: 9px 14px;
    border-bottom-color: #EEF2F7;
}

.is-task-hub-page .task-row.overdue-row,
.is-task-hub-page .task-row.review-row:not(.overdue-row) {
    border-left-width: 2px;
}

.is-task-hub-page .project-task-row:hover {
    background: #FAFCFF;
}

.is-task-hub-page .project-task-row .task-name {
    color: #1D2742;
    font-family: "Inter", "PT Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.35;
}

.is-task-hub-page .project-task-row .task-meta {
    gap: 5px 10px;
    color: #77839A;
    font-family: "Inter", "PT Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    font-size: 12px;
    line-height: 1.35;
}

.is-task-hub-page .project-task-row .pill,
.is-task-hub-page .project-task-row .tag,
.is-task-hub-page .project-task-row .task-tag,
.is-task-hub-page .project-task-row .sub-hint,
.is-task-hub-page .project-task-row .nav-badge {
    min-height: auto;
    padding: 0;
    border: 0;
    border-radius: 0 !important;
    background: transparent !important;
    color: #77839A;
    font-size: 12px;
    font-weight: 500;
    line-height: 1.35;
}

.is-task-hub-page .project-task-row .pill {
    gap: 5px;
    font-weight: 700;
}

.is-task-hub-page .project-task-row .pill::before {
    content: "";
    width: 6px;
    height: 6px;
    border-radius: 999px;
    background: currentColor;
    opacity: .9;
}

.is-task-hub-page .project-task-row .pill.s-overdue,
.is-task-hub-page .project-task-row .tag-blocked {
    color: #B91F2D;
}

.is-task-hub-page .project-task-row .pill.s-review,
.is-task-hub-page .project-task-row .pill.s-pclose {
    color: #A8500C;
}

.is-task-hub-page .project-task-row .pill.s-work {
    color: #2563EB;
}

.is-task-hub-page .project-task-row .tag-from-me,
.is-task-hub-page .project-task-row .tag-assignment,
.is-task-hub-page .project-task-row .tag-issuance {
    background: #F5F7FA;
    color: #59657C;
}

.is-task-hub-page .project-task-row .tag-blocked {
    font-weight: 700;
}

.is-task-hub-page .project-task-row .task-tag[href]:hover {
    color: var(--task-tag-color, #59657C);
    text-decoration: underline;
    text-underline-offset: 2px;
}

.is-task-hub-page .project-task-row__date {
    font-family: "Inter", "PT Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    font-weight: 700;
}

.is-task-hub-page .project-task-row__people {
    color: #59657C;
    font-family: "Inter", "PT Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    font-size: 12px;
    font-weight: 600;
}

.is-task-hub-page .project-task-row__people .mini-ava {
    width: 24px;
    height: 24px;
    border: 1px solid #E2E8F2;
    background: #F3F6FA !important;
    color: #59657C;
    font-size: 12px;
    box-shadow: none;
}

.is-task-hub-page .project-task-row .prog-bar {
    height: 3px;
    background: #EEF2F7;
}

.is-task-hub-page .project-task-row .prog-label {
    color: #8A94AB;
    font-family: "Inter", "PT Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    font-size: 12px;
    font-weight: 500;
}

.is-task-hub-page .project-task-row .prog-fill {
    background: #AEB8C8 !important;
}

.is-task-hub-page .project-task-row.overdue-row .prog-fill {
    background: #B91F2D !important;
}

@media (max-width: 900px) {

    .is-task-hub-page .project-task-row {
        grid-template-columns: minmax(0, 1fr);
        gap: 7px;
        align-items: start;
    }

    .is-task-hub-page .project-task-row__people,
    .is-task-hub-page .project-task-row__date,
    .is-task-hub-page .project-task-row__progress {
        justify-self: stretch;
    }
}

/* Final contrast layer for navigation and action controls. */
.nav__group {
    color: #5B6473;
    font-weight: 800;
}

.nav__link,
.nav-menu__summary,
.nav-project {
    border: 1px solid transparent !important;
    background: transparent;
    color: #1F2937;
    font-weight: 750;
}

.nav__link:hover,
.nav__link.is-active,
.nav-menu__summary:hover,
.nav-menu.is-active .nav-menu__summary,
.nav-project:hover,
.nav-project.is-active {
    border-color: #D7DEE9 !important;
    background: #FFFFFF;
    color: #111827;
    box-shadow: 0 1px 2px rgba(17, 24, 39, .08);
}

.nav__link.is-active,
.nav-menu.is-active .nav-menu__summary,
.nav-project.is-active {
    border-color: #E7B8B8 !important;
    background: #FFF7F7;
    box-shadow: inset 3px 0 0 var(--red), 0 1px 2px rgba(17, 24, 39, .08);
}

.btn,
.btn-outline,
.btn-secondary,
.btn-ghost {
    border-color: #BFC8D6;
    background: #FFFFFF;
    color: #182235;
    font-weight: 800;
    box-shadow: 0 1px 2px rgba(17, 24, 39, .06);
}

.btn:hover,
.btn-outline:hover,
.btn-secondary:hover,
.btn-ghost:hover {
    border-color: var(--red);
    background: #FFF7F7;
    color: #8F1515;
    box-shadow: 0 2px 5px rgba(168, 26, 26, .12);
}

.btn--red,
.btn-red,
.btn-primary {
    border-color: var(--red);
    background: var(--red);
    color: #FFFFFF;
}

.btn--red:hover,
.btn-red:hover,
.btn-primary:hover {
    border-color: #8F1515;
    background: #8F1515;
    color: #FFFFFF;
}

.content > .tabs,
.tabs {
    gap: 6px;
    padding: 6px;
    border: 1px solid #D7DEE9;
    background: #F2F5F9;
}

.tabs a {
    min-height: 34px;
    border: 1px solid #C8D2E0 !important;
    border-bottom: 1px solid #C8D2E0 !important;
    border-radius: 9px !important;
    background: #FFFFFF !important;
    color: #182235 !important;
    font-weight: 800 !important;
    box-shadow: 0 1px 2px rgba(17, 24, 39, .05);
}

.tabs a:hover {
    border-color: var(--red) !important;
    border-bottom-color: var(--red) !important;
    background: #FFF7F7 !important;
    color: #8F1515 !important;
}

.tabs a.is-active {
    border-color: var(--red) !important;
    border-bottom-color: var(--red) !important;
    background: var(--red) !important;
    color: #FFFFFF !important;
    box-shadow: 0 2px 5px rgba(168, 26, 26, .18);
}

.analytics-module {
    display: grid;
    gap: 14px;
    margin-bottom: 16px;
}

.reports-workbench {
    display: grid;
    gap: 12px;
    margin-bottom: 16px;
}

.reports-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 16px;
    align-items: center;
    padding: 14px 16px;
    border-left: 4px solid var(--red);
}

.reports-hero__main {
    display: grid;
    gap: 4px;
}

.reports-hero__main h2 {
    margin: 0;
    color: var(--black);
    font-size: 24px;
    line-height: 1.1;
}

.reports-hero__main p {
    margin: 0;
    color: var(--muted);
}

.reports-hero__actions,
.reports-filter-actions,
.reports-export-card__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    justify-content: flex-end;
}

.reports-filter-panel {
    display: grid;
    gap: 10px;
    padding: 12px;
}

.reports-filter-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(220px, 100%), 1fr));
    gap: 10px;
    align-items: end;
}

.reports-filter-grid label {
    display: grid;
    gap: 5px;
    margin: 0;
}

.reports-filter-grid label span {
    color: var(--muted);
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
}

.reports-filter-grid select,
.reports-filter-grid input {
    width: 100%;
    min-height: 34px;
}

.reports-filter-actions {
    justify-content: flex-start;
}

.reports-fields {
    border-top: 1px solid var(--border);
    padding-top: 8px;
}

.reports-fields summary {
    cursor: pointer;
    color: var(--black);
    font-weight: 800;
}

.reports-fields .checkbox-grid {
    margin-top: 10px;
}

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

.reports-export-card {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 12px;
    align-items: center;
    min-height: 106px;
    padding: 14px;
    border: 1px solid var(--border);
    background: var(--white);
    box-shadow: var(--shadow-sm);
}

.reports-export-card--primary {
    border-color: rgba(168, 26, 26, .38);
    background: #FFF8F8;
}

.reports-export-card span,
.reports-export-card small {
    display: block;
    color: var(--muted);
}

.reports-export-card span {
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
}

.reports-export-card strong {
    display: block;
    margin-top: 3px;
    color: var(--black);
    font-size: 18px;
}

.reports-export-card small {
    margin-top: 5px;
    max-width: 360px;
    line-height: 1.35;
}

.analytics-head {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 12px;
}

.analytics-head h2 {
    margin: 2px 0 0;
    color: var(--black);
    font-size: 22px;
    line-height: 1.15;
}

.analytics-metrics {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 10px;
}

.analytics-metric {
    min-height: 92px;
    align-items: flex-start;
    justify-content: center;
    padding: 12px;
}

.analytics-metric span {
    color: #111827;
    font-size: 22px;
    font-weight: 800;
    line-height: 1.1;
}

.cost-estimate-create,
.cost-estimate-meta,
.cost-estimate-benchmark,
.cost-estimate-suggest,
.cost-item-add {
    margin-left: 24px;
    margin-right: 24px;
    margin-bottom: 16px;
}

.cost-estimate-create {
    grid-template-columns: repeat(4, minmax(180px, 1fr));
}

.cost-estimate-create .panel__head,
.cost-estimate-meta .panel__head,
.cost-estimate-benchmark .panel__head,
.cost-item-add .panel__head {
    grid-column: 1 / -1;
}

.cost-estimate-create label:last-of-type,
.cost-estimate-meta label:last-of-type {
    grid-column: span 2;
}

.cost-estimate-create__submit {
    justify-self: start;
    align-self: end;
}

.cost-item-grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(140px, 1fr));
    gap: 10px;
    padding: 14px;
}

.cost-item-grid label:nth-child(4),
.cost-item-grid label:nth-child(15),
.cost-item-grid label:nth-child(24),
.cost-item-grid label:nth-child(25) {
    grid-column: span 2;
}

.cost-item-grid button {
    align-self: end;
}

.cost-estimate-basis {
    display: grid;
    grid-template-columns: repeat(3, minmax(160px, 1fr));
    gap: 10px;
    padding: 14px;
}

.cost-estimate-basis div {
    display: grid;
    gap: 4px;
    min-height: 58px;
    padding: 10px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--surface-soft);
}

.cost-estimate-basis span {
    color: var(--muted);
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
}

.cost-estimate-basis strong {
    color: var(--black);
}

.cost-estimate-basis--benchmark {
    grid-template-columns: repeat(6, minmax(130px, 1fr));
}

.cost-benchmark-formula {
    display: grid;
    grid-template-columns: minmax(180px, .32fr) minmax(0, .68fr);
    gap: 12px;
    padding: 0 14px 14px;
}

.cost-benchmark-verdict,
.cost-benchmark-lines,
.cost-benchmark-empty {
    border: 1px solid var(--line);
    background: var(--surface-soft);
}

.cost-benchmark-verdict {
    display: grid;
    gap: 4px;
    align-content: center;
    padding: 12px;
}

.cost-benchmark-verdict strong {
    color: var(--red);
    font-size: 26px;
    line-height: 1;
}

.cost-benchmark-verdict span,
.cost-benchmark-empty span {
    color: var(--muted);
}

.cost-benchmark-lines {
    display: grid;
    gap: 7px;
    padding: 12px;
}

.cost-benchmark-lines code {
    display: block;
    white-space: normal;
    color: var(--black);
    font-family: "PT Sans", Arial, sans-serif;
    font-size: 12px;
}

.cost-benchmark-lines small {
    color: var(--muted);
}

.cost-benchmark-empty {
    display: grid;
    gap: 4px;
    margin: 14px;
    padding: 12px;
}

.cost-estimate-suggest form {
    padding: 0 14px 14px;
}

.cost-estimate-suggest .form-grid--compact,
.cost-passport-fold .form-grid--compact,
.cost-sections-fold .form-grid--compact {
    gap: 10px;
}

.cost-estimate-suggest textarea,
.cost-passport-fold textarea,
.cost-sections-fold textarea {
    min-height: 56px;
}

.cost-passport-fold,
.cost-sections-fold {
    margin-left: 24px;
    margin-right: 24px;
    margin-bottom: 12px;
}

.cost-passport-fold .task-fold__body,
.cost-sections-fold .task-fold__body {
    padding: 12px 14px 14px;
}

.cost-estimate-table {
    min-width: 2200px;
}

.cost-estimate-table th,
.cost-estimate-table td {
    min-width: 120px;
    vertical-align: top;
}

.cost-estimate-table th:nth-child(3),
.cost-estimate-table td:nth-child(3),
.cost-estimate-table th:nth-child(4),
.cost-estimate-table td:nth-child(4),
.cost-estimate-table th:nth-child(6),
.cost-estimate-table td:nth-child(6) {
    min-width: 260px;
}

.cost-estimate-table input,
.cost-estimate-table select,
.cost-estimate-table textarea {
    width: 100%;
    min-height: 32px;
    margin-bottom: 5px;
    padding: 6px 8px;
    font-size: 12px;
}

.cost-estimate-table textarea {
    min-height: 56px;
    resize: vertical;
}

.cost-row-actions {
    min-width: 130px;
}

.cost-row-actions form {
    margin-top: 6px;
}

@media (max-width: 900px) {
    .cost-estimate-create,
    .cost-estimate-meta,
    .cost-estimate-benchmark,
    .cost-estimate-suggest,
    .cost-item-add,
    .cost-passport-fold,
    .cost-sections-fold {
        margin-left: 14px;
        margin-right: 14px;
    }

    .cost-estimate-create,
    .cost-estimate-basis,
    .cost-benchmark-formula,
    .cost-item-grid {
        grid-template-columns: 1fr;
    }

    .cost-estimate-create label:last-of-type,
    .cost-estimate-meta label:last-of-type,
    .cost-item-grid label:nth-child(4),
    .cost-item-grid label:nth-child(15),
    .cost-item-grid label:nth-child(24),
    .cost-item-grid label:nth-child(25) {
        grid-column: auto;
    }
}

.analytics-metric strong,
.analytics-metric small {
    display: block;
}

.analytics-metric small {
    margin-top: 3px;
    color: #667085;
    font-size: 12px;
}

.analytics-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(320px, .65fr);
    gap: 14px;
    align-items: start;
}

.analytics-panel--wide {
    grid-row: span 2;
}

.people-report-stack {
    grid-template-columns: minmax(0, 1fr);
}

.people-report-stack .analytics-panel--wide {
    grid-row: auto;
}

.people-drilldown .analytics-metric strong {
    color: var(--black);
}

.people-team-summary {
    margin-bottom: 14px;
}

.people-team-summary > summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 12px 14px;
    cursor: pointer;
    list-style: none;
}

.people-team-summary > summary::-webkit-details-marker {
    display: none;
}

.people-team-summary > summary span {
    color: #182235;
    font-size: 18px;
    font-weight: 800;
}

.people-team-summary > summary small {
    color: #667085;
    font-weight: 700;
}

.people-team-summary[open] > summary {
    margin-bottom: 0;
    border-bottom: 1px solid var(--line);
}

.people-search-results {
    display: grid;
    gap: 8px;
    padding: 10px 12px;
    border: 1px solid var(--line);
    background: var(--surface-soft);
}

.people-search-results__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.people-search-results__head strong {
    color: var(--black);
}

.people-search-results__head span {
    color: var(--muted);
    font-size: 12px;
    font-weight: 700;
}

.people-search-results__list {
    display: grid;
    max-height: 260px;
    overflow: auto;
    border: 1px solid var(--line-soft);
    background: var(--surface);
}

.people-search-result {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(80px, auto);
    gap: 12px;
    align-items: center;
    padding: 9px 10px;
    border-bottom: 1px solid var(--line-soft);
    color: var(--black);
}

.people-search-result:last-child {
    border-bottom: 0;
}

.people-search-result:hover,
.people-search-result.is-current {
    background: var(--red-light);
}

.people-search-result strong,
.people-search-result span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.people-search-result span {
    color: var(--muted);
    font-size: 12px;
    font-weight: 700;
    text-align: right;
}

.analytics-table td strong,
.analytics-table td small {
    display: block;
}

.analytics-table td small {
    max-width: 320px;
    margin-top: 2px;
    color: #667085;
}

.competency-matrix__name-column {
    min-width: 420px;
}

.competency-matrix__item {
    display: grid;
    gap: 8px;
    min-width: 380px;
    max-width: 560px;
    font-family: var(--font-body);
    line-height: 1.35;
}

.competency-matrix__item > strong {
    color: var(--black);
    font-size: var(--text-md);
}

.competency-matrix__item > p {
    margin: 0;
    color: var(--muted);
    font-size: var(--text-sm);
}

.competency-matrix__levels {
    display: grid;
    gap: 6px;
}

.competency-matrix__level {
    display: grid;
    gap: 2px;
    padding: 7px 8px;
    border: 1px solid var(--line-soft);
    border-radius: var(--radius-sm);
    background: var(--surface-soft);
}

.competency-matrix__level span {
    color: var(--black);
    font-size: var(--text-xs);
    font-weight: 800;
}

.competency-matrix__level em {
    color: var(--ink);
    font-family: var(--font-body);
    font-size: var(--text-xs);
    font-style: normal;
}

.competency-matrix__value {
    text-align: center;
    vertical-align: top;
    font-weight: 800;
}

.analytics-list {
    display: grid;
    gap: 8px;
    padding: 12px;
}

.analytics-row,
.analytics-risk {
    display: grid;
    gap: 6px;
    padding: 9px 10px;
    border: 1px solid #E3E9F2;
    border-radius: 9px;
    background: #FFFFFF;
}

.analytics-row {
    grid-template-columns: minmax(0, 1fr) auto auto;
    align-items: center;
}

.analytics-row--bar {
    grid-template-columns: minmax(0, 1fr) auto;
}

.analytics-row strong,
.analytics-risk strong {
    color: #182235;
}

.analytics-row small,
.analytics-risk small {
    display: block;
    color: #667085;
}

.analytics-risk {
    border-left: 3px solid var(--red);
}

.risk-kind {
    color: #8F1515;
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
}

.analytics-bar {
    width: 100%;
    height: 7px;
    overflow: hidden;
    border-radius: 999px;
    background: #EEF2F7;
}

.analytics-bar span {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: var(--red);
}

.cell-danger {
    color: #A81A1A;
    font-weight: 800;
}

.cell-warning {
    color: #8A5A00;
    font-weight: 800;
}

@media (max-width: 1180px) {
    .analytics-metrics {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .analytics-grid {
        grid-template-columns: 1fr;
    }

    .analytics-panel--wide {
        grid-row: auto;
    }
}

.time-metrics {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
    gap: 10px;
    margin-bottom: 14px;
}

.time-day-grid {
    display: grid;
    grid-template-columns: repeat(7, minmax(118px, 1fr));
    gap: 8px;
    padding: 12px;
}

.time-day {
    display: grid;
    gap: 4px;
    min-height: 58px;
    padding: 9px 10px;
    border: 1px solid var(--border);
    background: var(--white);
}

.time-day:hover,
.time-day.is-active {
    border-color: var(--red);
    box-shadow: var(--shadow-sm);
}

.time-day span {
    color: var(--muted);
}

.time-day--ok {
    border-left: 3px solid var(--green);
}

.time-day--under {
    border-left: 3px solid var(--amber);
}

.time-day--overtime {
    border-left: 3px solid var(--blue);
}

.time-batch-form {
    display: grid;
    grid-template-columns: 140px minmax(170px, 220px) minmax(190px, 240px);
    gap: 12px;
    padding: 14px;
}

.time-task-pick {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 8px;
    max-height: 260px;
    overflow: auto;
    padding: 2px;
}

.time-task-pick label {
    display: grid;
    grid-template-columns: 18px minmax(0, 1fr);
    gap: 8px;
    align-items: start;
    min-height: 58px;
    padding: 8px;
    border: 1px solid var(--border);
    background: var(--surface-soft);
}

.time-task-pick input {
    width: 16px;
    min-height: 16px;
    margin-top: 2px;
}

.time-task-pick strong,
.time-task-pick small {
    display: block;
}

.time-task-pick small {
    color: var(--muted);
}

.time-batch-actions {
    grid-column: 1 / -1;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.time-table {
    min-width: 1180px;
}

.time-table th small {
    display: block;
    color: var(--muted);
    font-weight: 400;
    text-transform: none;
}

.time-table td:nth-child(n+3),
.time-table th:nth-child(n+3) {
    width: 82px;
    text-align: right;
}

.time-table input {
    min-width: 58px;
    text-align: right;
}

.time-table select {
    min-width: 126px;
}

.time-row--category td {
    background: #fafafa;
}

.time-week-comment {
    padding: 12px 14px;
    border-top: 1px solid var(--border);
}

.task-time-form {
    display: grid;
    grid-template-columns: 1fr 90px;
    gap: 8px;
    padding: 10px 12px 12px;
    border-top: 1px solid var(--border);
}

.task-time-form label,
.task-time-form .btn {
    min-width: 0;
}

.task-time-form__date,
.task-time-form__phase,
.task-time-form__week {
    grid-column: 1 / -1;
}

.party-inputs {
    display: grid;
    grid-template-columns: minmax(130px, 1fr);
    gap: 6px;
    min-width: 190px;
}

.party-inputs select,
.party-inputs input {
    min-width: 0;
}

@media (max-width: 900px) {
    .time-day-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .time-batch-form {
        grid-template-columns: 1fr;
    }
}

.version-badge {
    width: 100%;
    border: 1px solid var(--border);
    background: #fff;
    color: var(--muted);
    font-size: 12px;
    font-weight: 700;
    text-align: left;
    padding: 7px 8px;
    border-radius: 2px;
    cursor: pointer;
}

.version-badge:hover {
    color: var(--accent);
    border-color: var(--accent);
}

.release-notes {
    position: fixed;
    inset: 0;
    z-index: 1200;
    display: none;
}

.release-notes.is-open {
    display: block;
}

.release-notes__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(20, 20, 20, .35);
}

.release-notes__panel {
    position: absolute;
    right: 24px;
    bottom: 24px;
    width: min(520px, calc(100vw - 32px));
    max-height: calc(100vh - 48px);
    overflow: auto;
    background: #fff;
    border: 1px solid var(--border);
    border-top: 3px solid var(--accent);
    border-radius: 3px;
    box-shadow: var(--shadow-lg);
    padding: 18px;
}

.release-notes__head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 12px;
    margin-bottom: 12px;
}

.release-notes__head span {
    display: block;
    color: var(--muted);
    font-size: 12px;
    font-weight: 700;
}

.release-notes__head h2 {
    margin: 2px 0 0;
    font-size: 22px;
}

.release-notes__list {
    margin: 0;
    padding-left: 18px;
}

.release-notes__list li + li {
    margin-top: 8px;
}

.workday-metrics .metric small {
    display: block;
    color: var(--muted);
    font-size: 12px;
    font-weight: 600;
    margin-top: 4px;
}

.workday-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
    margin-bottom: 14px;
}

.workday-panel {
    min-width: 0;
}

.workday-list {
    display: grid;
    gap: 10px;
}

.workday-list > .muted {
    margin: 0;
    padding: 12px 14px 14px;
    color: var(--muted);
    line-height: 1.35;
}

.workday-task {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px 10px;
    align-items: center;
    padding: 10px;
    border: 1px solid var(--border);
    border-radius: 4px;
    background: #fff;
}

.workday-task strong,
.workday-task small {
    display: block;
    min-width: 0;
}

.workday-task small {
    color: var(--muted);
    margin-top: 3px;
}

.workday-task__project {
    display: inline-flex;
    max-width: 100%;
    margin-top: 5px;
    padding: 2px 7px;
    border-radius: 4px;
    background: #FCEBEB;
    color: #791F1F;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.25;
}

.workday-reject,
.workday-time {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px;
}

.workday-time {
    grid-template-columns: 90px auto;
    justify-content: end;
}

.workday-load .filterbar {
    margin: 0;
}

.cost-action-cell {
    min-width: 230px;
}

.cost-action-cell > small {
    display: block;
    color: var(--muted);
    margin-bottom: 8px;
}

.cost-inline-action {
    display: grid;
    grid-template-columns: 80px minmax(120px, 1fr) auto;
    gap: 6px;
    margin-top: 6px;
}

.cost-inline-action input {
    min-width: 0;
}

@media (max-width: 1100px) {
    .workday-grid {
        grid-template-columns: 1fr;
    }

    .cost-inline-action {
        grid-template-columns: 1fr;
    }
}

/* Регламент работы в Лоции (/manual/regulation) */
.regulation-head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 16px;
    flex-wrap: wrap;
}
.regulation-head__actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}
.regulation-clauses {
    list-style: none;
    margin: 0;
    padding: 0;
    counter-reset: none;
}
.regulation-clauses li {
    display: flex;
    gap: 10px;
    padding: 8px 0;
    border-bottom: 1px solid var(--line, #e2e2df);
    line-height: 1.5;
}
.regulation-clauses li:last-child {
    border-bottom: none;
}
.regulation-clauses__no {
    flex: 0 0 auto;
    min-width: 42px;
    font-weight: 600;
    color: var(--gray, #6B7488);
    font-variant-numeric: tabular-nums;
}
.regulation-section {
    break-inside: avoid;
}
@media print {
    .nav, .sidebar, .topbar, .regulation-head__actions, .manual-toc { display: none !important; }
    .regulation-page { padding: 0; }
    .regulation-section { page-break-inside: avoid; }
}

/* Ссылки на пункты регламента из задачи + кликабельный номер пункта */
.approval-regulation {
    margin: 8px 0 0;
    padding: 0 12px;
    font-size: 12px;
}
.approval-regulation a {
    color: var(--gray, #6B7488);
    text-decoration: underline;
    text-underline-offset: 2px;
}
a.regulation-clauses__no {
    text-decoration: none;
    cursor: pointer;
}
a.regulation-clauses__no:hover {
    text-decoration: underline;
}
.regulation-clauses li:target {
    background: rgba(168, 26, 26, 0.06);
    border-radius: 6px;
}

/* =============================================================================
   Личные заметки
   ============================================================================= */
.notes-screen {
    display: grid;
    gap: var(--space-4, 24px);
}
.notes-filter {
    align-items: end;
}
.notes-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    gap: var(--space-4, 24px);
}
.note-card {
    display: flex;
    min-height: 190px;
    flex-direction: column;
    justify-content: space-between;
    border: 1px solid var(--border, #E1E4EA);
    border-radius: 8px;
    background: #FFF8D6;
    box-shadow: var(--shadow-sm, 0 1px 3px rgba(15, 23, 42, 0.08));
}
.note-card--blue { background: #EAF2FF; }
.note-card--green { background: #EAF7EF; }
.note-card--red { background: #FFECEC; }
.note-card--gray { background: #F3F5F8; }
.note-card__main {
    display: grid;
    gap: 12px;
    padding: 18px;
    color: inherit;
    text-decoration: none;
}
.note-card__head {
    display: flex;
    gap: 10px;
    align-items: flex-start;
    justify-content: space-between;
}
.note-card__head strong {
    font-size: 16px;
    line-height: 1.3;
}
.note-card__head span {
    flex: 0 0 auto;
    padding: 3px 7px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.75);
    color: var(--muted, #6B7488);
    font-size: 11px;
}
.note-card p {
    margin: 0;
    color: var(--text, #1F2937);
    line-height: 1.45;
    white-space: pre-line;
}
.note-card__foot {
    display: flex;
    min-height: 48px;
    gap: 10px;
    align-items: center;
    justify-content: space-between;
    padding: 10px 18px 14px;
    border-top: 1px solid rgba(15, 23, 42, 0.08);
}
.note-card__foot small {
    color: var(--muted, #6B7488);
}
.notes-editor {
    display: grid;
    gap: var(--space-4, 24px);
}
.note-editor-card,
.note-actions-stack .card {
    display: grid;
    gap: 16px;
}
.note-editor-card textarea {
    min-height: 320px;
    resize: vertical;
    line-height: 1.5;
}
.note-actions-stack {
    display: grid;
    gap: var(--space-4, 24px);
}
.note-actions-stack h2 {
    margin: 0;
    font-size: 18px;
}
.note-actions-stack form {
    display: grid;
    gap: 14px;
}
.checkbox-line {
    flex-direction: row;
    align-items: center;
    gap: 8px;
}
@media (max-width: 900px) {
    .note-editor-card textarea {
        min-height: 240px;
    }
}

.task-atlas-context {
    display: flex;
    gap: 10px;
    align-items: center;
    justify-content: space-between;
    margin-top: 12px;
    padding: 10px 12px;
    border: 1px solid rgba(168, 26, 26, 0.22);
    border-radius: 6px;
    background: rgba(168, 26, 26, 0.06);
    color: var(--black, #1F2937);
}
.task-atlas-context strong {
    color: var(--red, #A81A1A);
}
.task-atlas-context span {
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.task-atlas-links {
    overflow: hidden;
}
.atlas-ref-list {
    display: grid;
    border-top: 1px solid var(--border);
}
.atlas-ref-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    border-bottom: 1px solid var(--border);
    color: inherit;
    text-decoration: none;
}
.atlas-ref-row:hover {
    background: rgba(168, 26, 26, 0.05);
}
.atlas-ref-row > a:first-child {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(120px, 0.7fr);
    gap: 10px;
    color: inherit;
    text-decoration: none;
}
.atlas-ref-row strong,
.atlas-ref-row span {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.atlas-ref-row span {
    color: var(--muted);
    font-size: 12px;
}

/* =============================================================================
   ФИНАЛЬНЫЙ СЛОЙ: адаптив + доступность (issue #5/#6).
   Помещён в самый конец намеренно — по конвенции файла последний слой с
   !important решает конфликты предыдущих волн CSS. Срабатывает только на узких
   экранах (≤900/≤640px) и для :focus-visible — десктоп ≥1200px (рабочие АРМ)
   не затрагивается.
   ============================================================================= */

/* --- #6 Доступность: видимое кольцо фокуса с клавиатуры (мышь не трогаем) --- */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible,
.btn:focus-visible,
.btn-outline:focus-visible,
.btn-red:focus-visible,
.btn--red:focus-visible,
.nav__link:focus-visible {
    outline: 2px solid var(--red, #A81A1A) !important;
    outline-offset: 2px !important;
    border-radius: 2px;
}

/* Ссылка «к содержимому» для скринридеров/клавиатуры: видна только при фокусе */
.skip-link {
    position: fixed;
    top: 8px;
    left: 8px;
    z-index: 200;
    padding: 8px 14px;
    background: var(--red, #A81A1A);
    color: #fff;
    border-radius: 3px;
    text-decoration: none;
    transform: translateY(-200%);
    transition: transform 0.15s ease;
}
.skip-link:focus {
    transform: translateY(0);
}

.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

/* --- #5 Адаптив: решаем конфликт двух ≤900px слоёв в пользу скроллируемого
   документа (вторая стратегия — fixed-height flex с body{overflow:hidden} —
   ломала прокрутку на узких экранах). --- */
@media (max-width: 900px) {
    html,
    body {
        overflow-x: hidden !important;
        overflow-y: auto !important;
        height: auto !important;
    }

    .app-shell {
        display: block !important;
        height: auto !important;
        min-height: 100vh !important;
    }

    .main {
        display: block !important;
    }

    /* Доски/таблицы прокручиваются ВНУТРИ себя, а не растягивают страницу */
    .kanban,
    .schedule-board,
    .table-scroll,
    .data-table-wrap {
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch;
    }

    /* Картинки/preformatted не выламывают вёрстку */
    img,
    pre {
        max-width: 100% !important;
        height: auto;
    }
}

/* Узкие телефоны: колонки канбана становятся «свайпаемыми» во всю ширину */
@media (max-width: 640px) {
    .kanban {
        grid-auto-columns: 86vw;
        grid-template-columns: none !important;
        grid-auto-flow: column;
        scroll-snap-type: x mandatory;
    }
    .kanban__column {
        scroll-snap-align: start;
    }
    .content {
        padding-left: 12px !important;
        padding-right: 12px !important;
    }
}

/* =============================================================================
   Поиск в выпадающих списках (комбобокс над нативным <select>).
   Нативный select скрыт (display:none) и остаётся источником значения формы.
   ============================================================================= */
.combo { position: relative; }
.combo__input {
    width: 100%;
    box-sizing: border-box;
    cursor: text;
}
.combo__list {
    position: absolute;
    top: calc(100% + 2px);
    left: 0;
    right: 0;
    z-index: 90;
    max-height: 260px;
    overflow-y: auto;
    background: #fff;
    border: 1px solid var(--border, #d9d9d9);
    border-radius: 3px;
    box-shadow: var(--shadow-md, 0 4px 16px rgba(0,0,0,.12));
}
.combo__opt {
    padding: 7px 10px;
    font-size: 13px;
    line-height: 1.3;
    cursor: pointer;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.combo__opt:hover,
.combo__opt.is-active { background: var(--focus-red, rgba(168,26,26,.08)); }
.combo__opt.is-selected { font-weight: 700; }
.combo__empty {
    padding: 8px 10px;
    font-size: 12px;
    color: var(--muted, #6B7488);
}

/* Фильтр-строка в чекбоксных мультивыборах (наблюдатели/соавторы) — единый поиск */
.picker-filter {
    position: sticky;
    top: 0;
    z-index: 1;
    width: 100%;
    box-sizing: border-box;
    margin-bottom: 4px;
    padding: 6px 8px;
    border: 1px solid var(--border, #d9d9d9);
    border-radius: 3px;
    font-size: 13px;
    background: #fff;
}

.admin-user-inline-input {
    min-width: 92px;
    min-height: 30px;
    padding: 4px 6px;
    font-size: 12px;
}

.admin-user-inline-input--wide {
    min-width: 150px;
}

.admin-user-email-edit {
    display: flex;
    align-items: center;
    gap: 6px;
    min-width: 210px;
}

.admin-user-email-edit .admin-user-inline-input {
    flex: 1 1 auto;
    min-width: 0;
}

.org-status-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
    margin-bottom: 14px;
}

.org-status-card {
    padding: 12px;
    border: 1px solid var(--border);
    background: var(--white);
    box-shadow: var(--shadow-sm);
}

.org-status-card span {
    display: block;
    color: var(--muted);
    font-size: 12px;
}

.org-status-card strong {
    display: block;
    margin-top: 4px;
    color: var(--black);
    font-size: 22px;
    line-height: 1;
}

.org-status-card--warn {
    border-color: rgba(168, 26, 26, .35);
    background: #fffafa;
}

.org-setup-notice {
    display: grid;
    grid-template-columns: minmax(0, 1.5fr) minmax(260px, .9fr) auto;
    align-items: center;
    gap: 16px;
    padding: 14px;
}

.org-setup-notice h2 {
    margin: 0 0 4px;
}

.org-setup-notice p,
.org-setup-notice ol {
    margin: 0;
}

.org-setup-notice--compact {
    grid-template-columns: minmax(0, 1fr) auto;
}

/* UI invariants: content screens are vertical, typography is role-based. */
body,
input,
select,
textarea,
button {
    font-family: var(--font-body);
    font-size: var(--text-sm);
}

code,
pre,
.code-inline,
.task-code,
.nav-project span {
    font-family: var(--font-mono);
}

.topbar h1,
.guest-card h1,
.panel__head h2,
.project-head h2,
.task-passport__head h2,
.section-title,
.kanban__head h2,
.manual-content h1,
.manual-content h2,
.manual-content h3 {
    font-family: var(--font-heading);
    letter-spacing: 0;
}

.topbar h1 {
    font-size: var(--text-3xl);
}

.panel__head h2,
.project-head h2,
.task-panel-fold__summary h2,
.project-file-pane__summary strong,
.project-file-section__summary strong,
.project-models-summary span:first-child,
.org-layout__summary span,
.task-fold__summary span {
    font-size: var(--text-xl);
    line-height: 1.08;
}

.task-passport__head h2,
.guest-card h1 {
    font-size: var(--text-2xl);
}

.project-summary-metrics .metric span,
.stat-ring strong,
.org-status-card strong {
    font-family: var(--font-heading);
    font-size: var(--text-metric);
    letter-spacing: 0;
}

.metric strong,
.analytics-metric strong {
    color: var(--black);
}

.analytics-metrics {
    grid-template-columns: repeat(auto-fit, minmax(142px, 1fr));
}

.analytics-metric {
    min-height: 0;
    justify-content: flex-start;
}

.analytics-metric span {
    font-family: var(--font-body);
    font-size: var(--text-xl);
    line-height: 1;
    overflow-wrap: anywhere;
}

.analytics-metric strong {
    margin-top: 6px;
    font-size: var(--text-sm);
    line-height: 1.2;
}

.analytics-metric small {
    font-size: var(--text-xs);
    line-height: 1.25;
}

.data-table th,
.form-grid label > span,
.form-stack label > span,
.task-time-form label > span,
.project-task-filterbar label > span,
.org-search-bar label > span,
.muted,
small {
    font-size: var(--text-xs);
}

.data-table td,
.task-card,
.linked-row,
.comment,
.history,
.project-file-pane__root,
.project-file-section__root,
.folder-map__quick,
.org-tree,
.analytics-table {
    font-size: var(--text-sm);
}

.btn,
.status,
.tag,
.task-tag,
.file-link {
    font-size: var(--text-xs);
}

.task-detail-stack,
.project-detail-stack,
.org-layout,
.analytics-grid,
.task-layout,
.project-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 14px;
    align-items: start;
}

.task-detail-stack,
.project-detail-stack {
    margin: 0 24px 24px;
}

.task-detail-stack > .task-main,
.project-detail-stack > .project-main-column {
    min-width: 0;
}

.task-detail-secondary {
    display: grid;
    min-width: 0;
    gap: 14px;
}

.task-side,
.task-side-toggle,
.project-file-pane__toggle {
    display: none !important;
}

.project-file-pane,
.project-file-section {
    position: static !important;
    z-index: auto;
    display: block;
    width: auto;
    height: auto;
    min-height: 0;
    max-height: none;
    overflow: visible;
    margin: 0;
}

.project-file-pane__summary,
.project-file-section__summary,
.project-models-summary,
.details-panel__summary,
.org-layout__summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 14px 16px;
    cursor: pointer;
    list-style: none;
}

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

.project-file-pane__summary span,
.project-file-section__summary span,
.project-models-summary span + span,
.org-layout__summary strong {
    color: var(--muted);
    font-size: var(--text-xs);
}

.project-file-pane__summary small,
.project-file-section__summary small {
    margin-left: auto;
    color: var(--muted);
}

.project-file-pane__body,
.project-file-section__body,
.project-models-panel__body {
    min-width: 0;
    min-height: 0;
    overflow: visible;
}

.project-model-folder-form {
    padding: 14px;
    border-top: 1px solid var(--line-soft);
}

.project-model-folder-head {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: flex-start;
    padding: 12px 14px;
    border-top: 1px solid var(--line-soft);
    background: var(--surface-soft);
}

.project-model-folder-head > div:first-child {
    display: grid;
    gap: 6px;
    min-width: 0;
}

.project-model-folder-head .code-inline {
    max-width: min(760px, 100%);
    overflow-wrap: anywhere;
}

.project-model-frag-note,
.project-model-legacy {
    margin: 12px 14px 0;
}

.project-model-frag-note {
    display: grid;
    gap: 4px;
    padding: 10px 12px;
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
    background: var(--surface-soft);
}

.project-model-frag-note span {
    color: var(--muted);
    font-size: var(--text-sm);
}

.project-model-legacy {
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
    background: var(--surface);
}

.project-model-legacy > summary {
    padding: 10px 12px;
    cursor: pointer;
    font-weight: 700;
}

.project-model-legacy > .form-grid {
    padding: 12px;
}

.status-chip {
    display: inline-flex;
    align-items: center;
    min-height: 24px;
    padding: 3px 8px;
    border: 1px solid var(--line);
    border-radius: 999px;
    font-size: var(--text-xs);
    font-weight: 700;
    line-height: 1.2;
    white-space: nowrap;
}

.status-chip--done {
    color: var(--green);
    border-color: color-mix(in srgb, var(--green) 38%, var(--line));
    background: var(--green-light);
}

.status-chip--pending {
    color: var(--amber);
    border-color: color-mix(in srgb, var(--amber) 38%, var(--line));
    background: var(--amber-light);
}

.project-file-pane__head,
.project-file-section__head {
    border-top: 1px solid var(--line-soft);
}

.project-file-pane__root-row,
.project-file-section__root-row,
.folder-map__quick,
.project-file-pane__tree,
.project-file-section__tree {
    padding-left: 16px;
    padding-right: 16px;
}

.analytics-panel--wide {
    grid-row: auto;
}

.is-drawer-page .task-detail-stack,
.is-drawer-page .task-layout,
.is-drawer-page .task-layout.is-task-side-collapsed {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 12px;
    margin: 0;
    padding: 12px;
}

.is-drawer-page .task-detail-secondary {
    display: none !important;
}

@media (max-width: 760px) {
    .task-detail-stack,
    .project-detail-stack {
        margin: 0 12px 18px;
    }

    .topbar h1 {
        font-size: var(--text-2xl);
    }

    .project-summary-metrics .metric span,
    .stat-ring strong,
    .org-status-card strong {
        font-size: var(--text-2xl);
    }
}

/* UI Kit acceptance rescue: real workstations often run browser zoom with a
   persistent left sidebar. Let controls wrap inside their own sections instead
   of forcing the whole page to overflow or clipping headings/subtitles. */
:root {
    --work-gutter-x: 12px;
    --work-gutter-y: 12px;
    --work-title-size: 30px;
    --work-section-title-size: 22px;
    --work-card-title-size: 14px;
}

.topbar {
    flex: 0 0 auto !important;
    height: auto !important;
    min-height: 64px !important;
    flex-wrap: wrap !important;
    align-items: flex-start !important;
    gap: 8px 14px !important;
    padding: 14px var(--work-gutter-x) 10px !important;
}

.topbar__title {
    flex: 1 1 420px;
    min-width: min(100%, 320px);
}

.topbar h1 {
    display: block;
    max-width: 100%;
    margin: 0;
    overflow: visible;
    color: var(--black);
    font-family: var(--font-heading);
    font-size: var(--work-title-size) !important;
    font-weight: 800;
    line-height: 1.02;
    text-overflow: clip;
    white-space: normal !important;
    word-break: normal;
    overflow-wrap: anywhere;
}

.topbar__subtitle {
    max-width: 920px;
    margin-top: 3px;
    overflow: visible;
    color: var(--muted);
    font-size: var(--text-sm);
    line-height: 1.25;
    white-space: normal;
}

.topbar__actions,
.topbar__meta {
    flex: 0 1 auto;
    min-width: 0;
    max-width: 100%;
    flex-wrap: wrap !important;
    overflow: visible !important;
    justify-content: flex-end;
}

.topbar__actions .btn,
.topbar__actions form .btn,
.topbar__meta .counter {
    flex: 0 0 auto;
    min-height: 34px;
    max-width: 220px;
    white-space: normal;
    text-align: center;
}

.content {
    min-width: 0;
    padding-top: var(--work-gutter-y) !important;
    overflow-x: clip;
}

.content > .toolbar,
.content > .project-head,
.content > .project-grid,
.content > .metric-row,
.content > .time-metrics,
.content > .workday-grid,
.content > .notes-screen,
.content > .dpr-grid,
.content > .schedule-board,
.content > .panel,
.content > form.panel,
.content > .tabs,
.content > .task-detail-stack,
.content > .project-detail-stack,
.content > .analytics-grid,
.content > .org-layout,
.content > .cost-layout,
.content > .estimates-layout {
    margin-left: var(--work-gutter-x) !important;
    margin-right: var(--work-gutter-x) !important;
}

.content > .toolbar,
.content > .project-head {
    margin-top: var(--work-gutter-y) !important;
}

.content > .panel,
.content > form.panel,
.content > .metric-row,
.content > .time-metrics,
.content > .workday-grid,
.content > .notes-screen,
.content > .project-grid,
.content > .dpr-grid,
.content > .schedule-board,
.content > .analytics-grid,
.content > .org-layout,
.content > .cost-layout,
.content > .estimates-layout,
.content > .toolbar,
.content > .tabs {
    min-width: 0;
}

.panel {
    min-width: 0;
}

.panel > p.muted {
    margin: 0;
    padding: 12px 14px 14px;
    line-height: 1.35;
}

.panel > .filterbar {
    padding: 12px 14px 14px;
}

.panel > .empty-state--compact,
.activity-list > .empty-state--compact,
.task-panel-fold > .empty-state--compact,
.approval-history > .empty-state--compact,
.project-file-section__body > .empty-state--compact,
.project-models-panel__body > .empty-state--compact {
    padding: 14px;
}

.panel > .activity-list,
.details-panel > .activity-list {
    padding: 8px 14px 14px;
}

.project-task-board-panel > .project-task-kanban {
    margin: 0 14px 14px;
}

.project-passport-head {
    display: grid !important;
    grid-template-columns: minmax(260px, .8fr) minmax(0, 1.6fr);
    align-items: stretch !important;
    gap: 12px !important;
    padding: 14px !important;
    border: 1px solid var(--line);
    border-radius: var(--radius-md);
    background: var(--surface);
    box-shadow: var(--shadow-sm);
}

.project-passport-title {
    display: grid;
    align-content: start;
    gap: 4px;
    min-width: 0;
}

.project-eyebrow {
    color: var(--muted);
    font-size: var(--text-sm);
    line-height: 1.2;
    overflow-wrap: anywhere;
}

.project-passport-title h2 {
    margin: 0;
    font-size: var(--text-2xl) !important;
    line-height: 1.06;
}

.project-passport-title p {
    margin: 0;
    color: var(--ink);
    font-family: var(--font-body);
    font-size: var(--text-lg);
    font-weight: 700;
    line-height: 1.15;
    overflow-wrap: anywhere;
}

.project-roles {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(180px, 100%), 1fr));
    gap: 8px;
    min-width: 0;
}

.project-role-card {
    display: grid;
    align-content: start;
    gap: 4px;
    min-width: 0;
    padding: 10px 12px;
    border: 0;
    border-radius: var(--radius-sm);
    background: var(--surface-soft);
}

.project-passport-head .project-role-card {
    display: grid;
    gap: 4px;
    align-items: start;
    min-height: 58px;
    padding: 10px 12px;
    color: var(--black);
    font-size: var(--text-sm);
}

.project-passport-head .project-role-card small {
    display: block;
    color: var(--muted);
    font-family: var(--font-heading);
    font-size: var(--text-xs);
    font-weight: 800;
    line-height: 1;
    text-transform: uppercase;
}

.project-passport-head .project-role-card strong {
    display: block;
    color: var(--black);
    font-family: var(--font-body);
    font-size: var(--text-md);
    font-weight: 700;
    line-height: 1.25;
    overflow-wrap: anywhere;
}

.project-passport-head .project-role-card--lead strong {
    font-size: var(--text-name);
    font-weight: 800;
}

.project-role-card--lead {
    box-shadow: inset 3px 0 0 rgba(168, 26, 26, .52);
    background: #fff8f8;
}

.project-role-card--wide {
    grid-column: span 2;
}

.project-member-role {
    display: inline-flex;
    max-width: 100%;
    padding: 4px 8px;
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
    background: var(--surface-soft);
    color: var(--black);
    font-weight: 800;
    line-height: 1.15;
    overflow-wrap: anywhere;
}

.content .data-table td strong,
.content .workday-task strong,
.content .time-task-pick strong,
.content .note-card__head strong,
.content .people-search-result strong,
.content .user-mini strong,
.content .search-result strong,
.content .dpr-matrix-person,
.content .dpr-matrix-cell strong {
    font-family: var(--font-body);
}

.project-team-edit-table tr.is-project-role-member td {
    background: #fffafa;
}

.project-team-edit-table tr.is-project-role-member td:first-child {
    border-left: 3px solid var(--red);
}

.project-team-edit-table td:nth-child(2) strong,
.project-team-edit-table td:nth-child(3) input,
.project-team-edit-table td:nth-child(6) input {
    font-size: var(--text-sm);
}

.project-team-edit-table td:nth-child(3) input {
    min-width: 170px;
    font-weight: 700;
}

.org-empty-message {
    margin: 0;
    padding: 12px 14px;
    color: var(--muted);
}

.panel__head {
    min-width: 0;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: 8px 12px;
}

.panel__head:has(.filterbar) {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    align-items: stretch;
}

.panel__head > div {
    min-width: 0;
}

.panel__head .filterbar {
    width: 100%;
}

.panel__head h2,
.project-head h2,
.toolbar__title,
.task-passport__head h2,
.gantt-toolbar strong {
    max-width: 100%;
    font-family: var(--font-heading);
    font-size: var(--work-section-title-size) !important;
    line-height: 1.08;
    overflow-wrap: anywhere;
}

.metric-row,
.time-metrics {
    grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)) !important;
}

.metric {
    min-width: 0;
}

.metric span {
    font-family: var(--font-heading);
    font-size: 30px !important;
    line-height: 1;
    overflow-wrap: anywhere;
}

@media (max-width: 980px) {
    .project-passport-head {
        grid-template-columns: minmax(0, 1fr);
    }

    .project-role-card--wide {
        grid-column: auto;
    }
}

.metric strong,
.metric small {
    overflow-wrap: anywhere;
}

.filterbar {
    display: flex;
    flex-wrap: wrap !important;
    gap: 8px;
    overflow: visible !important;
    scrollbar-width: auto;
}

.filterbar label {
    flex: 1 1 180px;
    min-width: 160px;
    max-width: 100%;
}

.filterbar input,
.filterbar select {
    width: 100%;
    min-width: 0;
}

.filterbar .btn,
.filterbar .view-switch {
    flex: 0 0 auto;
}

.tabs {
    flex-wrap: wrap !important;
    overflow: visible !important;
    scrollbar-width: auto;
}

.task-meta {
    flex-wrap: wrap !important;
    overflow: visible;
    row-gap: 4px;
}

.task-meta .sub-hint {
    flex: 1 1 180px;
    min-width: 0;
    white-space: normal;
}

.workday-grid {
    grid-template-columns: repeat(auto-fit, minmax(360px, 1fr));
}

.workday-task {
    grid-template-columns: minmax(0, 1fr);
    align-items: start;
}

.workday-task > div,
.workday-task form,
.workday-task a.btn {
    min-width: 0;
}

.workday-task strong,
.workday-task a,
.workday-task small,
.workday-task__project,
.time-task-pick strong,
.time-task-pick small,
.note-card__head strong,
.data-table td strong,
.data-table td small {
    max-width: 100%;
    white-space: normal;
    overflow-wrap: anywhere;
}

.workday-task > form:not(.workday-reject):not(.workday-time),
.workday-task > a.btn {
    justify-self: start;
}

.workday-reject,
.workday-time {
    grid-template-columns: minmax(0, 1fr) auto;
    justify-content: stretch;
}

.workday-time {
    grid-template-columns: minmax(80px, 110px) auto auto auto;
    justify-content: start;
    align-items: center;
    flex-wrap: wrap;
}

.time-day-grid {
    grid-template-columns: repeat(auto-fit, minmax(138px, 1fr));
}

.time-batch-form {
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
}

.time-task-pick {
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
}

.notes-filter label {
    flex-basis: 220px;
}

.notes-filter label:first-child {
    flex-basis: 280px;
}

.table-wrap {
    max-width: 100%;
    overflow-x: auto;
}

.data-table {
    max-width: 100%;
}

@media (min-width: 901px) {
    :root {
        --shell-header-height: 64px;
    }

    .brand {
        height: var(--shell-header-height);
        min-height: var(--shell-header-height);
    }

    .app-shell::before {
        top: calc(var(--shell-header-height) - 3px);
    }
}

@media (max-width: 1180px) {
    :root {
        --work-gutter-x: 10px;
        --work-title-size: 28px;
        --work-section-title-size: 20px;
    }

    .topbar__actions,
    .topbar__meta {
        justify-content: flex-start;
    }
}

@media (max-width: 720px) {
    :root {
        --work-gutter-x: 8px;
        --work-gutter-y: 8px;
        --work-title-size: 24px;
        --work-section-title-size: 18px;
    }

    .topbar {
        padding: 12px var(--work-gutter-x) 8px !important;
    }

    .workday-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .workday-time,
    .workday-reject {
        grid-template-columns: minmax(0, 1fr);
    }

    .filterbar label,
    .filterbar .btn,
    .filterbar .view-switch {
        flex: 1 1 100%;
        width: 100%;
    }
}

@media (max-width: 900px) {
    .app-shell {
        display: block !important;
        min-width: 0;
        height: auto;
        overflow-x: hidden;
    }

    .sidebar {
        position: static !important;
        width: 100% !important;
        max-width: 100%;
        flex: none !important;
        overflow: hidden;
        border-right: 0;
        border-bottom: 1px solid var(--border);
    }

    .nav {
        display: flex !important;
        flex-wrap: nowrap !important;
        gap: 6px;
        max-width: 100%;
        overflow-x: auto !important;
        overflow-y: hidden;
        padding: 6px 8px;
    }

    .nav__group,
    .nav-projects,
    .sidebar__footer {
        display: none !important;
    }

    .nav__link,
    .nav-menu,
    .nav-menu__summary {
        flex: 0 0 auto;
        width: auto;
        max-width: 190px;
        white-space: nowrap;
    }

    .nav-menu__items {
        display: none !important;
    }
}

/* DPR/Shturman compatibility: older dashboard rules are intentionally strong
   because widgets can be rearranged. Keep the data matrix, but force the
   screen back onto the shared UI Kit rhythm and prevent edge-hugging text. */
.content > .dpr-toolbar {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr);
    align-items: stretch !important;
    gap: 10px !important;
    max-width: none;
    padding: 12px 14px !important;
    border: 1px solid var(--line);
    border-radius: var(--radius-md);
    background: var(--surface);
    box-shadow: var(--shadow-sm);
}

.content > .dpr-toolbar .dpr-filter {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(min(190px, 100%), 1fr));
    width: 100%;
    min-width: 0;
    gap: 8px;
    padding: 0 !important;
}

.content > .dpr-toolbar .dpr-filter select,
.content > .dpr-toolbar .dpr-filter input {
    min-width: 0 !important;
    width: 100%;
}

.content > .dpr-toolbar .dpr-filter .btn {
    width: 100%;
    min-width: 0;
}

.dpr-dashboard-actions {
    display: flex !important;
    flex-wrap: wrap;
    justify-content: flex-start;
    gap: 8px;
    min-width: 0;
}

.dpr-dashboard-actions .btn {
    flex: 0 1 auto;
    min-width: 0;
    max-width: 240px;
    white-space: normal;
}

.content > .dpr-grid,
.dpr-director,
.dpr-director.is-positioned {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    align-items: start;
    gap: 12px !important;
    max-width: none !important;
    min-width: 0;
}

.dpr-director .dpr-span-12,
.dpr-director .dpr-span-7,
.dpr-director .dpr-span-6,
.dpr-director .dpr-span-5,
.dpr-director [data-dashboard-widget] {
    grid-column: 1 / -1 !important;
    min-width: 0;
}

.dpr-director .dpr-metrics,
.dpr-director.is-positioned .dpr-metrics {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)) !important;
    gap: 10px !important;
    min-width: 0;
}

.dpr-director .dpr-metric {
    min-width: 0 !important;
    min-height: 88px !important;
    padding: 14px !important;
}

.dpr-director .dpr-metric strong {
    font-size: 28px !important;
    line-height: 1 !important;
}

.dpr-director .dpr-metric span {
    max-width: 100%;
    font-size: var(--text-sm) !important;
    line-height: 1.1 !important;
    white-space: normal !important;
    overflow-wrap: anywhere;
}

.dpr-block {
    min-width: 0;
    overflow: hidden;
}

.dpr-director .dpr-block__head {
    display: flex !important;
    flex-wrap: wrap;
    align-items: center !important;
    gap: 8px 10px !important;
    padding: 12px 14px !important;
    min-width: 0;
}

.dpr-director .dpr-block__head h2,
.dpr-director .dpr-block__head h3 {
    flex: 1 1 280px;
    min-width: 0;
    max-width: 100%;
    margin: 0;
    font-size: var(--work-section-title-size) !important;
    line-height: 1.08 !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
    overflow-wrap: anywhere;
}

.dpr-director .dpr-block__head > span {
    flex: 0 0 auto;
    margin-left: 0;
    padding: 2px 8px;
    border-radius: var(--radius-sm);
    background: var(--surface-soft);
    color: var(--muted);
    font-family: var(--font-heading);
    font-size: var(--text-sm);
}

.dpr-window-grip,
.dpr-window-resize,
.dpr-window-span {
    flex: 0 0 28px;
}

.dpr-matrix-filters {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(min(180px, 100%), 1fr)) !important;
    gap: 10px !important;
    padding: 12px 14px !important;
    border-top: 1px solid var(--line-soft);
    background: var(--surface-soft);
}

.dpr-matrix-filters label {
    min-width: 0;
}

.dpr-matrix-filters input,
.dpr-matrix-filters select {
    min-width: 0;
    width: 100%;
}

.dpr-director .dpr-table-wrap,
.dpr-director .dpr-table-wrap--wide,
.dpr-director .dpr-people-matrix-wrap {
    width: calc(100% - 28px) !important;
    max-width: calc(100% - 28px) !important;
    margin: 0 14px 14px !important;
    overflow-x: auto !important;
}

.dpr-director .dpr-table {
    width: max-content;
    min-width: 100%;
    table-layout: auto;
}

.dpr-director .dpr-table th,
.dpr-director .dpr-table td {
    max-width: 320px;
    padding: 9px 10px !important;
    font-size: var(--text-sm) !important;
    line-height: 1.2 !important;
    white-space: normal;
    overflow-wrap: anywhere;
    vertical-align: top;
}

.dpr-people-matrix .dpr-matrix-person,
.dpr-people-matrix thead .dpr-matrix-person {
    min-width: 170px;
    max-width: 220px;
}

.dpr-matrix-object {
    min-width: 160px;
    max-width: 220px;
}

.dpr-matrix-cell strong,
.dpr-matrix-cell span,
.dpr-matrix-cell small,
.dpr-matrix-cell em,
.dpr-matrix-person small,
.dpr-matrix-object small {
    max-width: 100%;
    white-space: normal;
    overflow-wrap: anywhere;
}

@media (max-width: 720px) {
    .content > .dpr-toolbar .dpr-filter {
        grid-template-columns: minmax(0, 1fr);
    }

    .dpr-director .dpr-metrics,
    .dpr-director.is-positioned .dpr-metrics {
        grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)) !important;
    }

    .dpr-dashboard-actions .btn {
        flex: 1 1 100%;
        max-width: none;
    }
}

/* Final UI Kit guard after legacy dashboard layers. */
.nav-project.is-active,
.nav-project:hover {
    border-color: transparent !important;
    background: var(--red-light) !important;
    box-shadow: inset 3px 0 0 var(--red) !important;
}

.topbar h1 {
    font-size: var(--work-title-size) !important;
}

.topbar__actions {
    gap: 10px !important;
}

.topbar__actions .btn.btn--red,
.topbar__actions .btn.btn-red {
    background: var(--white) !important;
    color: var(--red) !important;
    border-color: rgba(168, 26, 26, .38) !important;
}

.topbar__actions .btn.btn--red:hover,
.topbar__actions .btn.btn-red:hover {
    background: var(--red-light) !important;
    color: var(--red) !important;
}

.data-table-filter-row th {
    background: var(--surface-soft) !important;
}

.data-table th {
    text-transform: none !important;
    font-weight: 800;
}

.project-passport-head .project-role-card {
    border: 0 !important;
    background: var(--surface-soft);
}

.project-passport-head .project-role-card--lead {
    background: #fff8f8;
    box-shadow: inset 3px 0 0 rgba(168, 26, 26, .52);
}

/* Absolute final density pass for core work screens. */
.workday-metrics.metric-row,
.time-metrics {
    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)) !important;
    gap: 8px !important;
    margin-bottom: 10px !important;
}

.workday-metrics .metric,
.time-metrics .metric {
    min-height: 66px !important;
    padding: 12px 14px !important;
    align-content: center !important;
    gap: 3px !important;
}

.workday-metrics .metric span,
.time-metrics .metric span {
    font-size: 28px !important;
    line-height: .95 !important;
}

.workday-metrics .metric strong,
.workday-metrics .metric small,
.time-metrics .metric strong,
.time-metrics .metric small {
    font-size: var(--text-xs) !important;
    line-height: 1.15 !important;
}

.workday-grid {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 8px !important;
    margin-bottom: 10px !important;
}

.workday-panel .panel__head {
    min-height: 0 !important;
    padding: 10px 12px !important;
}

.workday-panel .panel__head h2 {
    font-size: 20px !important;
    line-height: 1.1 !important;
}

.workday-list {
    gap: 0 !important;
}

.workday-task {
    grid-template-columns: minmax(0, 1fr) auto !important;
    min-height: 0 !important;
    padding: 8px 12px !important;
    gap: 6px 10px !important;
    border: 0 !important;
    border-top: 1px solid var(--line-soft) !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

.workday-task:first-child {
    border-top: 0 !important;
}

.workday-reject,
.workday-time {
    grid-column: 1 / -1;
    display: grid !important;
    gap: 6px !important;
    justify-content: stretch !important;
}

.workday-reject {
    grid-template-columns: minmax(0, 1fr) auto !important;
}

.workday-time {
    grid-template-columns: 82px repeat(3, auto) !important;
    justify-content: start !important;
    align-items: center !important;
}

.time-day-grid {
    grid-template-columns: repeat(7, minmax(112px, 1fr)) !important;
    gap: 0 !important;
    padding: 0 !important;
    border-top: 1px solid var(--line-soft) !important;
}

.time-day {
    min-height: 48px !important;
    padding: 8px 10px !important;
    border: 0 !important;
    border-right: 1px solid var(--line-soft) !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

.time-day:last-child {
    border-right: 0 !important;
}

.time-day.is-active {
    box-shadow: inset 0 0 0 1px var(--red) !important;
}

.time-batch-form {
    grid-template-columns: 180px minmax(180px, 220px) minmax(210px, 260px) !important;
    gap: 10px !important;
    padding: 12px !important;
}

.time-task-pick {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)) !important;
    gap: 6px !important;
    max-height: 178px !important;
    padding: 0 !important;
}

.time-task-pick label {
    min-height: 0 !important;
    padding: 7px 8px !important;
    border-radius: var(--radius-sm) !important;
}

.task-table--projects {
    gap: 6px !important;
    padding: 8px 0 14px !important;
}

.project-task-group {
    border-radius: var(--radius-sm) !important;
    box-shadow: none !important;
}

.project-task-group__head {
    min-height: 34px !important;
    padding: 7px 10px !important;
    gap: 6px 10px !important;
}

.project-task-row,
.is-task-hub-page .project-task-row {
    grid-template-columns: minmax(340px, 1fr) minmax(120px, 160px) 92px 72px !important;
    min-height: 0 !important;
    padding: 7px 10px !important;
    gap: 8px !important;
    font-family: var(--font-body) !important;
}

.project-task-row .task-name,
.is-task-hub-page .project-task-row .task-name {
    font-family: var(--font-body) !important;
    font-size: var(--text-sm) !important;
    line-height: 1.18 !important;
}

.project-task-row__main {
    gap: 3px !important;
}

@media (max-width: 1180px) {
    .time-day-grid {
        grid-template-columns: repeat(auto-fit, minmax(132px, 1fr)) !important;
    }

    .project-task-row,
    .is-task-hub-page .project-task-row {
        grid-template-columns: minmax(0, 1fr) minmax(110px, 150px) 84px !important;
    }

    .project-task-row__progress {
        display: none !important;
    }
}

@media (max-width: 720px) {
    .workday-metrics.metric-row,
    .time-metrics {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    .workday-task,
    .workday-time,
    .workday-reject,
    .time-batch-form,
    .project-task-row,
    .is-task-hub-page .project-task-row {
        grid-template-columns: minmax(0, 1fr) !important;
    }
}

.task-table--projects:has(> .empty-state--table:only-child) {
    flex: 0 0 auto !important;
    min-height: 0 !important;
    overflow: visible !important;
}

.task-table--projects > .empty-state--table {
    min-height: 0 !important;
    padding: 24px 12px !important;
    border: 0 !important;
    box-shadow: none !important;
}

/* Absolute final UI consistency pass: typography, surfaces, controls. */
:root {
    --ui-bg: #F4F6F9;
    --ui-surface: #FFFFFF;
    --ui-surface-soft: #F7F9FC;
    --ui-line: #DDE3EC;
    --ui-line-soft: #EEF2F6;
    --ui-text: #172033;
    --ui-muted: #5E6878;
    --ui-control-border: #CBD4E1;
    --ui-control-hover: #F8FAFD;
}

body,
button,
input,
select,
textarea,
.nav,
.sidebar,
.topbar,
.content,
.panel,
.data-table,
.task-card,
.project-card,
.project-task-row,
.workday-task,
.time-task-pick,
.dpr-director {
    font-family: var(--font-body) !important;
    color: var(--ui-text);
}

.topbar h1,
.panel__head h2,
.project-head h2,
.task-passport__head h2,
.toolbar__title,
.section-title,
.metric span,
.metric strong,
.data-table th,
.nav__group,
.brand__mark,
.brand__text {
    font-family: var(--font-heading) !important;
    letter-spacing: 0 !important;
}

body,
.main,
.content {
    background: var(--ui-bg) !important;
}

.topbar {
    background: var(--ui-surface) !important;
    border-bottom: 1px solid var(--ui-line-soft) !important;
}

.topbar h1 {
    color: var(--ui-text) !important;
    font-size: var(--work-title-size) !important;
    line-height: 1.08 !important;
}

.topbar__meta,
.muted,
.link-muted,
small,
.panel__head > span,
.task-commandbar__hint {
    color: var(--ui-muted) !important;
}

.sidebar {
    background: var(--ui-surface) !important;
    border-right: 1px solid var(--ui-line) !important;
}

.brand {
    background: var(--ui-surface) !important;
    border-bottom: 1px solid var(--ui-line) !important;
}

.nav__link,
.nav-menu__summary,
.nav-project {
    border: 1px solid transparent !important;
    border-left: 3px solid transparent !important;
    background: transparent !important;
    color: var(--ui-text) !important;
}

.nav__link:hover,
.nav__link.is-active,
.nav-menu[open] > .nav-menu__summary,
.nav-project:hover,
.nav-project.is-active {
    border-color: var(--ui-line) !important;
    border-left-color: var(--red) !important;
    background: var(--red-light) !important;
    color: var(--ui-text) !important;
    box-shadow: none !important;
}

.panel,
.metric,
.task-card,
.project-card,
.project-task-group,
.workday-panel,
.time-days,
.time-breakdown,
.task-commandbar,
.task-queue,
.details-panel,
.guest-card,
.dpr-block,
.dpr-director .dpr-block,
.content > .dpr-toolbar {
    border: 1px solid var(--ui-line) !important;
    border-radius: var(--radius-sm) !important;
    background: var(--ui-surface) !important;
    box-shadow: none !important;
}

.panel__head,
.project-task-group__head,
.task-queue__summary,
.data-table thead th,
.tbl-head,
.data-table-filter-row th,
.dpr-director .dpr-block__head {
    border-color: var(--ui-line-soft) !important;
    background: var(--ui-surface-soft) !important;
}

.panel__head h2,
.project-task-group__title,
.task-name,
.workday-task strong,
.data-table td strong,
.project-role-card strong,
.user-mini strong,
.nav__link,
.btn {
    color: var(--ui-text) !important;
}

input,
select,
textarea,
.combo__input,
.search-input {
    min-height: 34px !important;
    border: 1px solid var(--ui-control-border) !important;
    border-radius: var(--radius-sm) !important;
    background: var(--ui-surface) !important;
    color: var(--ui-text) !important;
    box-shadow: none !important;
}

input::placeholder,
textarea::placeholder {
    color: #7A8494 !important;
}

input:focus,
select:focus,
textarea:focus,
.combo.is-open .combo__input {
    border-color: var(--red) !important;
    box-shadow: 0 0 0 3px rgba(168, 26, 26, .10) !important;
    outline: none !important;
}

.btn,
.btn-outline,
.view-btn,
.task-filter-toggle,
.task-tags-toggle,
.topbar__actions .btn,
.filterbar .btn,
button.btn,
a.btn {
    min-height: 34px !important;
    border: 1px solid var(--ui-control-border) !important;
    border-radius: var(--radius-sm) !important;
    background: var(--ui-surface) !important;
    color: var(--ui-text) !important;
    box-shadow: none !important;
    font-family: var(--font-body) !important;
    font-size: var(--text-sm) !important;
    font-weight: 800 !important;
    line-height: 1.1 !important;
    text-transform: none !important;
}

.btn:hover,
.btn-outline:hover,
.view-btn:hover,
.task-filter-toggle:hover,
.task-tags-toggle:hover {
    border-color: #AEB9C8 !important;
    background: var(--ui-control-hover) !important;
    color: var(--ui-text) !important;
    transform: none !important;
}

.btn-red,
.btn--red,
button.btn-red,
button.btn--red,
a.btn-red,
a.btn--red,
.view-btn.active {
    border-color: var(--red) !important;
    background: var(--red) !important;
    color: var(--white) !important;
}

.btn-red:hover,
.btn--red:hover,
button.btn-red:hover,
button.btn--red:hover,
a.btn-red:hover,
a.btn--red:hover,
.view-btn.active:hover {
    border-color: var(--red-hover) !important;
    background: var(--red-hover) !important;
    color: var(--white) !important;
}

.btn-sm {
    min-height: 30px !important;
    padding: 5px 10px !important;
    font-size: var(--text-xs) !important;
}

.time-days .panel__head {
    align-items: flex-end !important;
    gap: 12px !important;
}

.time-week-nav {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: flex-end !important;
    justify-content: flex-end !important;
    gap: 8px !important;
    margin-left: auto !important;
}

.time-calendar-form {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: flex-end !important;
    gap: 8px !important;
}

.time-calendar-form label {
    display: grid !important;
    gap: 4px !important;
    min-width: 164px !important;
}

.time-calendar-form label > span {
    color: var(--ui-muted) !important;
    font-family: var(--font-body) !important;
    font-size: var(--text-xs) !important;
    font-weight: 800 !important;
    line-height: 1.1 !important;
    text-transform: uppercase !important;
}

.time-calendar-form input[type="date"] {
    min-height: 30px !important;
    padding: 5px 10px !important;
}

.view-switch {
    display: inline-flex;
    gap: 0 !important;
    overflow: hidden;
    border: 1px solid var(--ui-control-border) !important;
    border-radius: var(--radius-sm) !important;
    background: var(--ui-surface) !important;
}

.view-switch .view-btn {
    border: 0 !important;
    border-right: 1px solid var(--ui-control-border) !important;
}

.view-switch .view-btn:last-child {
    border-right: 0 !important;
}

.data-table,
.dpr-table {
    border-color: var(--ui-line) !important;
    background: var(--ui-surface) !important;
}

.data-table th,
.data-table td,
.dpr-table th,
.dpr-table td {
    border-color: var(--ui-line-soft) !important;
    background: transparent !important;
    color: var(--ui-text) !important;
    font-family: var(--font-body) !important;
    font-size: var(--text-sm) !important;
    line-height: 1.22 !important;
}

.data-table th,
.dpr-table th {
    background: var(--ui-surface-soft) !important;
    color: #3E4A5D !important;
    font-weight: 800 !important;
}

.data-table tr:hover td,
.task-row:hover,
.project-task-row:hover {
    background: var(--ui-control-hover) !important;
}

.metric {
    min-height: 66px !important;
    padding: 12px 14px !important;
}

.metric span {
    color: var(--ui-text) !important;
    font-size: 28px !important;
    line-height: .95 !important;
}

.metric strong {
    color: var(--ui-text) !important;
    font-size: var(--text-xs) !important;
    line-height: 1.15 !important;
}

.metric small {
    color: var(--ui-muted) !important;
    font-size: var(--text-xs) !important;
    line-height: 1.15 !important;
}

.pill,
.tag,
.badge,
.project-task-group__meta em,
.task-filter-chip {
    border: 1px solid var(--ui-line) !important;
    border-radius: var(--radius-sm) !important;
    background: var(--ui-surface-soft) !important;
    color: var(--ui-text) !important;
    font-family: var(--font-body) !important;
    font-size: var(--text-xs) !important;
}

.empty-state,
.project-task-empty,
.org-empty-message {
    background: var(--ui-surface) !important;
    color: var(--ui-muted) !important;
}

/* Final repair for task picking and kanban density. */
.time-task-pick {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 0 !important;
    max-height: 220px !important;
    padding: 0 !important;
    border: 1px solid var(--ui-line) !important;
    background: var(--ui-surface) !important;
}

.time-task-pick label {
    display: grid !important;
    grid-template-columns: 22px minmax(0, 1fr) !important;
    align-items: start !important;
    min-height: 40px !important;
    padding: 8px 10px !important;
    border: 0 !important;
    border-bottom: 1px solid var(--ui-line-soft) !important;
    background: var(--ui-surface) !important;
}

.time-task-pick label:last-child {
    border-bottom: 0 !important;
}

.time-task-pick input[type="checkbox"] {
    width: 16px !important;
    height: 16px !important;
    min-height: 16px !important;
    margin-top: 1px !important;
}

.time-task-pick strong,
.time-task-pick small {
    font-family: var(--font-body) !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
}

.time-task-pick strong {
    color: var(--ui-text) !important;
    font-size: var(--text-sm) !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
}

.time-task-pick small {
    margin-top: 2px !important;
    color: var(--ui-muted) !important;
    font-size: var(--text-xs) !important;
    font-weight: 600 !important;
    line-height: 1.2 !important;
}

.kanban {
    gap: 8px !important;
    padding: 8px 0 14px !important;
}

.kanban__column {
    border: 1px solid var(--ui-line) !important;
    border-radius: var(--radius-sm) !important;
    background: var(--ui-surface) !important;
    box-shadow: none !important;
}

.kanban__head {
    min-height: 42px !important;
    padding: 8px 10px !important;
    border-bottom: 1px solid var(--ui-line-soft) !important;
    background: var(--ui-surface-soft) !important;
}

.kanban__head h2 {
    color: var(--ui-text) !important;
    font-family: var(--font-heading) !important;
    font-size: 20px !important;
    font-weight: 800 !important;
    line-height: 1.1 !important;
    letter-spacing: 0 !important;
}

.kanban__head-actions {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--ui-muted) !important;
    font-size: var(--text-sm) !important;
    font-weight: 700 !important;
}

.kanban__quick-create {
    display: none !important;
}

.kanban__body {
    display: grid !important;
    gap: 6px !important;
    padding: 8px !important;
}

.task-card {
    margin: 0 !important;
    padding: 10px !important;
    border: 1px solid var(--ui-line) !important;
    border-radius: var(--radius-sm) !important;
    background: var(--ui-surface) !important;
    box-shadow: none !important;
    transform: none !important;
}

.task-card:hover {
    border-color: #B8C2D1 !important;
    background: var(--ui-control-hover) !important;
    box-shadow: none !important;
    transform: none !important;
}

.task-card a strong,
.task-card a span,
.task-card .card-meta,
.task-card .tag,
.task-card .status,
.task-card .pill {
    font-family: var(--font-body) !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
}

.task-card a strong {
    color: var(--ui-text) !important;
    font-size: var(--text-md) !important;
    font-weight: 800 !important;
    line-height: 1.2 !important;
}

.task-card a span,
.task-card .card-meta {
    color: var(--ui-muted) !important;
    font-size: var(--text-sm) !important;
    line-height: 1.25 !important;
}

.task-card .card-meta {
    justify-content: flex-start !important;
    gap: 6px !important;
    margin: 8px 0 0 !important;
}

.task-card .tag,
.task-card .status,
.task-card .pill {
    padding: 2px 6px !important;
    border: 1px solid var(--ui-line) !important;
    background: var(--ui-surface-soft) !important;
    color: var(--ui-text) !important;
    font-size: var(--text-xs) !important;
    font-weight: 700 !important;
}

.task-card .avatar,
.task-card .avatar--small {
    width: 24px !important;
    height: 24px !important;
    border: 1px solid var(--red) !important;
    background: var(--red) !important;
    color: var(--white) !important;
    font-size: 11px !important;
}

/* Entity pickers, matrix grid and contrast guard. */
:root {
    --ui-muted: #4E5969;
    --ui-muted-strong: #354155;
    --ui-line: #D3DBE7;
    --ui-line-soft: #E5EAF2;
}

.muted,
.topbar__meta,
.panel__head > span,
small,
.people-search-result span,
.search-result small,
.task-card__meta,
.task-card small,
.time-task-pick small,
.competency-matrix__item p,
.competency-matrix__level em {
    color: var(--ui-muted) !important;
}

.dpr-matrix-filters {
    align-items: start !important;
    grid-template-columns: repeat(auto-fit, minmax(min(260px, 100%), 1fr)) !important;
}

.dpr-picker {
    display: grid;
    gap: 8px;
    min-width: 0;
}

.dpr-picker label {
    display: grid;
    gap: 6px;
}

.dpr-picker__results.people-search-results {
    min-height: 0;
    max-height: 260px;
    margin: 0;
    padding: 0;
    overflow: hidden;
    border: 1px solid var(--ui-line) !important;
    border-radius: var(--radius-sm) !important;
    background: var(--ui-surface) !important;
    box-shadow: none !important;
}

.dpr-picker__results .people-search-results__head {
    min-height: 34px;
    padding: 8px 10px;
    border-bottom: 1px solid var(--ui-line-soft);
    background: var(--ui-surface-soft);
}

.dpr-picker__results .people-search-results__list {
    max-height: 205px;
    overflow: auto;
}

.dpr-picker__results .people-search-result {
    width: 100%;
    display: grid;
    gap: 2px;
    min-height: 38px;
    padding: 8px 10px;
    border: 0;
    border-bottom: 1px solid var(--ui-line-soft);
    border-radius: 0;
    background: var(--ui-surface);
    color: var(--ui-text);
    text-align: left;
    cursor: pointer;
}

.dpr-picker__results .people-search-result:last-child {
    border-bottom: 0;
}

.dpr-picker__results .people-search-result:hover,
.dpr-picker__results .people-search-result.is-current {
    background: var(--ui-control-hover);
}

.dpr-picker__results .people-search-result strong {
    color: var(--ui-text) !important;
    font-family: var(--font-body) !important;
    font-size: var(--text-sm) !important;
    font-weight: 700 !important;
    line-height: 1.15 !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
}

.dpr-picker__results .people-search-result span {
    color: var(--ui-muted) !important;
    font-size: var(--text-xs) !important;
    font-weight: 600 !important;
    line-height: 1.15 !important;
}

.dpr-picker__empty {
    margin: 0;
    padding: 10px;
}

.dpr-director .dpr-people-matrix {
    border-collapse: separate !important;
    border-spacing: 0 !important;
    border: 1px solid var(--ui-line) !important;
}

.dpr-director .dpr-people-matrix th,
.dpr-director .dpr-people-matrix td {
    border-right: 1px solid var(--ui-line) !important;
    border-bottom: 1px solid var(--ui-line) !important;
}

.dpr-director .dpr-people-matrix tr > :last-child {
    border-right: 0 !important;
}

.dpr-director .dpr-people-matrix tbody tr:last-child > th,
.dpr-director .dpr-people-matrix tbody tr:last-child > td {
    border-bottom: 0 !important;
}

.dpr-director .dpr-people-matrix .dpr-matrix-person {
    background: var(--ui-surface-soft) !important;
}

.dpr-director .dpr-people-matrix .dpr-matrix-empty {
    background: #FAFBFD !important;
}

.dpr-director .dpr-matrix-cell {
    background: var(--ui-surface) !important;
}

.dpr-director .dpr-matrix-cell--warn {
    background: #FFF8E8 !important;
}

.dpr-director .dpr-matrix-cell--bad {
    background: #FFF1F1 !important;
}

.dpr-matrix-cell strong,
.dpr-matrix-person,
.dpr-matrix-object {
    color: var(--ui-text) !important;
    font-family: var(--font-body) !important;
    letter-spacing: 0 !important;
}

.dpr-matrix-cell span,
.dpr-matrix-cell small,
.dpr-matrix-cell em,
.dpr-matrix-person small,
.dpr-matrix-object small {
    color: var(--ui-muted-strong) !important;
    font-family: var(--font-body) !important;
}

.competency-matrix__details {
    margin-top: 8px;
}

.competency-matrix__details summary {
    display: inline-flex;
    align-items: center;
    min-height: 30px;
    padding: 5px 9px;
    border: 1px solid var(--ui-line);
    border-radius: var(--radius-sm);
    background: var(--ui-surface-soft);
    color: var(--ui-text);
    font-family: var(--font-body);
    font-size: var(--text-xs);
    font-weight: 800;
    cursor: pointer;
}

.competency-matrix__details p {
    margin: 8px 0 0;
}

.competency-matrix__details .competency-matrix__levels {
    margin-top: 8px;
}

.logout-form {
    margin: 0;
}

.logout-form .link-muted {
    width: 100%;
    border: 1px solid var(--ui-line);
    background: var(--ui-surface);
    cursor: pointer;
    font: inherit;
}

form[aria-busy="true"] button[type="submit"].is-disabled,
form[aria-busy="true"] input[type="submit"].is-disabled {
    cursor: wait;
    opacity: .68;
}

/* Public demo mask: blue theme and neutral brand, active only in DEMO_MODE. */
body.is-demo-theme {
    --red: #1F5FBF;
    --red-hover: #174A96;
    --red2: #2563EB;
    --red-light: #EFF6FF;
    --red-mid: #CFE0FF;
    --focus-red: rgba(31, 95, 191, .12);
    --blue: #1F5FBF;
    --blue-light: #EFF6FF;
    --ui-bg: #F4F7FB;
    --ui-surface: #FFFFFF;
    --ui-surface-soft: #F7FAFF;
    --ui-control-hover: #EEF5FF;
    --ui-control-border: #C7D7EE;
    --ui-line: #CED8E6;
    --ui-line-soft: #E4EAF3;
}

body.is-demo-theme input:focus,
body.is-demo-theme select:focus,
body.is-demo-theme textarea:focus,
body.is-demo-theme .combo.is-open .combo__input {
    box-shadow: 0 0 0 3px rgba(31, 95, 191, .12) !important;
}

body.is-demo-theme .brand__mark,
body.is-demo-theme .brand__text {
    color: var(--red) !important;
}

body.is-demo-theme .avatar,
body.is-demo-theme .mini-ava,
body.is-demo-theme .task-card .avatar,
body.is-demo-theme .task-card .avatar--small {
    border-color: var(--red) !important;
    background: var(--red) !important;
    color: var(--white) !important;
}

body.is-demo-theme .alert--error,
body.is-demo-theme .overdue-banner,
body.is-demo-theme .danger-zone {
    border-color: #D0D7E2 !important;
    background: #F7FAFF !important;
}

/* Task overview acceptance layer: reuse project metrics and dense task rows. */
.is-task-hub-page .task-day-metrics {
    margin: 8px 0 0 !important;
    grid-template-columns: repeat(auto-fit, minmax(104px, 1fr)) !important;
    gap: 6px !important;
}

.is-task-hub-page .task-day-metrics .metric {
    min-height: 54px !important;
    padding: 8px 10px !important;
}

.is-task-hub-page .task-day-metrics .metric span {
    font-size: var(--text-xl) !important;
    line-height: 1 !important;
}

.is-task-hub-page .task-day-metrics .metric strong {
    font-size: var(--text-xs) !important;
    line-height: 1.15 !important;
}

.is-task-hub-page .task-table--projects {
    display: flex !important;
    flex-direction: column !important;
    gap: 4px !important;
    padding: 8px 0 14px !important;
}

.task-table--projects {
    display: flex !important;
    flex-direction: column !important;
    gap: 4px !important;
}

.is-task-hub-page .project-task-group {
    height: auto !important;
    max-height: fit-content !important;
    overflow: hidden !important;
    border: 1px solid var(--ui-line) !important;
    border-radius: var(--radius-sm) !important;
    background: var(--ui-surface) !important;
    box-shadow: none !important;
}

.task-table--projects .project-task-group {
    height: auto !important;
    max-height: fit-content !important;
}

.is-task-hub-page .project-task-group__head {
    display: grid !important;
    grid-template-columns: minmax(90px, auto) minmax(0, 1fr) auto !important;
    gap: 6px 10px !important;
    align-items: center !important;
    min-height: 32px !important;
    padding: 5px 9px !important;
    border-bottom: 1px solid var(--ui-line-soft) !important;
    background: var(--ui-surface-soft) !important;
}

.is-task-hub-page .project-task-group__code,
.is-task-hub-page .project-task-group__title,
.is-task-hub-page .project-task-group__meta,
.is-task-hub-page .project-task-group__meta b,
.is-task-hub-page .project-task-group__meta em {
    font-family: var(--font-body) !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
}

.is-task-hub-page .project-task-group__code {
    color: var(--red) !important;
    font-size: var(--text-xs) !important;
    font-weight: 800 !important;
}

.is-task-hub-page .project-task-group__title {
    color: var(--ui-text) !important;
    font-size: var(--text-sm) !important;
    font-weight: 700 !important;
}

.is-task-hub-page .project-task-group__meta {
    justify-self: end !important;
    display: inline-flex !important;
    gap: 5px !important;
    align-items: center !important;
    color: var(--ui-muted) !important;
    font-size: var(--text-xs) !important;
    font-weight: 700 !important;
    white-space: nowrap !important;
}

.is-task-hub-page .project-task-group__meta em {
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    color: var(--red) !important;
    font-style: normal !important;
}

.is-task-hub-page .project-task-list {
    display: grid !important;
    gap: 0 !important;
}

.is-task-hub-page .project-task-list__filters {
    display: grid !important;
    grid-template-columns: minmax(280px, 1.6fr) 128px 112px minmax(150px, .9fr) minmax(150px, .9fr) 88px auto auto !important;
    gap: 6px 8px !important;
    align-items: end !important;
    margin: 8px 0 !important;
    padding: 8px 10px !important;
    border: 1px solid var(--ui-line) !important;
    border-radius: var(--radius-sm) !important;
    background: var(--ui-surface-soft) !important;
}

.is-task-hub-page .project-task-list__filters label {
    display: grid !important;
    gap: 3px !important;
    min-width: 0 !important;
    margin: 0 !important;
    color: var(--ui-muted) !important;
    font-family: var(--font-body) !important;
    font-size: var(--text-xs) !important;
    font-weight: 800 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
}

.is-task-hub-page .project-task-list__filters input,
.is-task-hub-page .project-task-list__filters select {
    width: 100% !important;
    min-height: 30px !important;
    padding: 5px 8px !important;
    border: 1px solid var(--ui-line) !important;
    border-radius: var(--radius-sm) !important;
    background: var(--ui-surface) !important;
    color: var(--ui-text) !important;
    font-family: var(--font-body) !important;
    font-size: var(--text-xs) !important;
    font-weight: 700 !important;
}

.is-task-hub-page .project-task-list__filters .btn {
    min-height: 30px !important;
    align-self: end !important;
    white-space: nowrap !important;
}

.is-task-hub-page .project-task-list__filters-count {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 34px !important;
    min-height: 30px !important;
    align-self: end !important;
    border: 1px solid var(--ui-line) !important;
    border-radius: var(--radius-sm) !important;
    background: var(--ui-surface) !important;
    color: var(--ui-muted-strong) !important;
    font-family: var(--font-body) !important;
    font-size: var(--text-xs) !important;
    font-weight: 800 !important;
}

.is-task-hub-page .project-task-list__head {
    display: grid !important;
    grid-template-columns: minmax(280px, 1.6fr) 128px 112px minmax(150px, .9fr) minmax(150px, .9fr) 88px !important;
    gap: 6px 12px !important;
    align-items: center !important;
    min-height: 28px !important;
    padding: 5px 9px !important;
    border-bottom: 1px solid var(--ui-line-soft) !important;
    background: var(--ui-surface-soft) !important;
    color: var(--ui-muted) !important;
    font-family: var(--font-body) !important;
    font-size: var(--text-xs) !important;
    font-weight: 800 !important;
}

.is-task-hub-page .project-task-row {
    display: grid !important;
    grid-template-columns: minmax(280px, 1.6fr) 128px 112px minmax(150px, .9fr) minmax(150px, .9fr) 88px !important;
    gap: 6px 12px !important;
    align-items: center !important;
    min-height: 44px !important;
    padding: 6px 9px !important;
    border: 0 !important;
    border-bottom: 1px solid var(--ui-line-soft) !important;
    border-radius: 0 !important;
    background: var(--ui-surface) !important;
    box-shadow: none !important;
    font-family: var(--font-body) !important;
}

.is-task-hub-page .project-task-row:last-child {
    border-bottom: 0 !important;
}

.is-task-hub-page .project-task-row.overdue-row,
.is-task-hub-page .project-task-row.review-row:not(.overdue-row) {
    border-left: 3px solid var(--red) !important;
    padding-left: 6px !important;
}

.is-task-hub-page .project-task-row.review-row:not(.overdue-row) {
    border-left-color: var(--amber) !important;
}

.is-task-hub-page .project-task-row:hover {
    background: var(--ui-control-hover) !important;
}

.is-task-hub-page .project-task-row.is-task-register-hidden {
    display: none !important;
}

.is-task-hub-page .project-task-row__main {
    display: grid !important;
    gap: 2px !important;
    min-width: 0 !important;
}

.is-task-hub-page .project-task-row .task-name {
    overflow: hidden !important;
    color: var(--ui-text) !important;
    font-family: var(--font-body) !important;
    font-size: var(--text-sm) !important;
    font-weight: 800 !important;
    line-height: 1.18 !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

.is-task-hub-page .project-task-row .task-meta {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 2px 8px !important;
    color: var(--ui-muted) !important;
    font-family: var(--font-body) !important;
    font-size: var(--text-xs) !important;
    line-height: 1.15 !important;
}

.is-task-hub-page .project-task-row__status,
.is-task-hub-page .project-task-row__type,
.is-task-hub-page .project-task-row__section {
    min-width: 0 !important;
    font-family: var(--font-body) !important;
}

.is-task-hub-page .task-status-chip,
.is-task-hub-page .task-type-chip {
    display: inline-flex !important;
    align-items: center !important;
    max-width: 100% !important;
    min-height: 22px !important;
    padding: 3px 7px !important;
    border: 1px solid transparent !important;
    border-radius: var(--radius-sm) !important;
    font-family: var(--font-body) !important;
    font-size: var(--text-xs) !important;
    font-weight: 800 !important;
    line-height: 1.1 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

.is-task-hub-page .task-status-chip.s-new {
    border-color: var(--ui-line) !important;
    background: var(--ui-surface-soft) !important;
    color: var(--ui-muted-strong) !important;
}

.is-task-hub-page .task-status-chip.s-work {
    border-color: color-mix(in srgb, var(--blue) 24%, var(--ui-surface)) !important;
    background: var(--blue-light) !important;
    color: var(--blue) !important;
}

.is-task-hub-page .task-status-chip.s-review,
.is-task-hub-page .task-status-chip.s-pclose,
.is-task-hub-page .task-status-chip.s-correction {
    border-color: color-mix(in srgb, var(--amber) 32%, var(--ui-surface)) !important;
    background: var(--amber-light) !important;
    color: var(--amber) !important;
}

.is-task-hub-page .task-status-chip.s-overdue,
.is-task-hub-page .task-status-chip.s-block {
    border-color: var(--red) !important;
    background: var(--red-light) !important;
    color: var(--red) !important;
}

.is-task-hub-page .task-status-chip.s-done {
    border-color: color-mix(in srgb, var(--green) 24%, var(--ui-surface)) !important;
    background: var(--green-light) !important;
    color: var(--green) !important;
}

.is-task-hub-page .task-type-chip {
    border-color: var(--ui-line) !important;
    background: var(--ui-surface-soft) !important;
    color: var(--ui-muted-strong) !important;
}

.is-task-hub-page .task-type-chip--assignment,
.is-task-hub-page .task-type-chip--issuance {
    border-color: color-mix(in srgb, var(--blue) 24%, var(--ui-surface)) !important;
    background: var(--blue-light) !important;
    color: var(--blue) !important;
}

.is-task-hub-page .task-type-chip--bim_family_request {
    border-color: color-mix(in srgb, var(--green) 24%, var(--ui-surface)) !important;
    background: var(--green-light) !important;
    color: var(--green) !important;
}

.is-task-hub-page .task-type-chip--review,
.is-task-hub-page .task-type-chip--labor_estimate {
    border-color: color-mix(in srgb, var(--amber) 32%, var(--ui-surface)) !important;
    background: var(--amber-light) !important;
    color: var(--amber) !important;
}

.is-task-hub-page .project-task-row__section {
    display: grid !important;
    gap: 1px !important;
    color: var(--ui-text) !important;
    font-size: var(--text-xs) !important;
    font-weight: 700 !important;
    line-height: 1.15 !important;
}

.is-task-hub-page .project-task-row__section .section-code {
    display: inline-flex !important;
    width: fit-content !important;
    min-height: 18px !important;
    align-items: center !important;
    padding: 1px 5px !important;
    border: 1px solid var(--ui-line) !important;
    border-radius: var(--radius-sm) !important;
    background: var(--ui-surface-soft) !important;
    color: var(--ui-muted-strong) !important;
    font-size: var(--text-xs) !important;
    font-weight: 800 !important;
}

.is-task-hub-page .project-task-row__section small {
    overflow: hidden !important;
    color: var(--ui-muted) !important;
    font-size: var(--text-xs) !important;
    font-weight: 600 !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

.is-task-hub-page .project-task-row .pill,
.is-task-hub-page .project-task-row .tag,
.is-task-hub-page .project-task-row .task-tag,
.is-task-hub-page .project-task-row .sub-hint,
.is-task-hub-page .project-task-row .nav-badge {
    min-height: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: var(--ui-muted-strong) !important;
    font-family: var(--font-body) !important;
    font-size: var(--text-xs) !important;
    font-weight: 700 !important;
    line-height: 1.15 !important;
}

.is-task-hub-page .project-task-row .pill::before {
    width: 5px !important;
    height: 5px !important;
}

.is-task-hub-page .project-task-row__people {
    display: inline-flex !important;
    gap: 6px !important;
    align-items: center !important;
    min-width: 0 !important;
    color: var(--ui-muted-strong) !important;
    font-family: var(--font-body) !important;
    font-size: var(--text-xs) !important;
    font-weight: 700 !important;
}

.is-task-hub-page .project-task-row__people .mini-ava {
    width: 20px !important;
    height: 20px !important;
    flex: 0 0 20px !important;
    border: 1px solid var(--ui-line) !important;
    background: var(--ui-surface-soft) !important;
    color: var(--ui-text) !important;
    font-size: 10px !important;
    box-shadow: none !important;
}

.is-task-hub-page .project-task-row__date {
    justify-self: start !important;
    color: var(--ui-muted-strong) !important;
    font-family: var(--font-body) !important;
    font-size: var(--text-xs) !important;
    font-weight: 800 !important;
    white-space: nowrap !important;
}

.is-task-hub-page .project-task-row__date.date-red {
    color: var(--red) !important;
}

.is-task-hub-page .project-task-row__date.date-amber {
    color: var(--amber) !important;
}

.is-task-hub-page .project-task-row__progress {
    display: none !important;
}

.is-task-hub-page .project-task-done {
    border-top: 1px solid var(--ui-line-soft) !important;
    background: var(--ui-surface-soft) !important;
}

.is-task-hub-page .project-task-done > summary,
.is-task-hub-page .project-task-empty,
.is-task-hub-page .project-task-register-empty {
    min-height: 30px !important;
    padding: 6px 9px !important;
    color: var(--ui-muted) !important;
    font-family: var(--font-body) !important;
    font-size: var(--text-xs) !important;
    font-weight: 800 !important;
}

.is-task-hub-page .kanban {
    gap: 6px !important;
    padding: 8px 0 14px !important;
}

.is-task-hub-page .kanban__column {
    min-height: 0 !important;
}

.is-task-hub-page .kanban__head {
    min-height: 36px !important;
    padding: 6px 9px !important;
}

.is-task-hub-page .kanban__head h2 {
    font-size: var(--text-lg) !important;
    line-height: 1.1 !important;
}

.is-task-hub-page .kanban__body {
    min-height: 42px !important;
    padding: 6px !important;
}

.is-task-hub-page .task-card {
    padding: 8px !important;
}

.is-task-hub-page .task-card a strong {
    font-size: var(--text-sm) !important;
    line-height: 1.2 !important;
}

/* Task drawer invariant: plan/fact must stay visible in the top task passport. */
.task-fact-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0;
    margin: 4px 0 0;
    padding: 0;
    overflow: hidden;
    border: 1px solid var(--ui-line, var(--line));
    border-radius: var(--radius-sm);
    background: var(--ui-surface, var(--surface));
    color: var(--ui-text, var(--black));
    list-style: none;
}

.task-people-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    width: 100%;
    margin: 10px 0 8px;
}

.task-person-card {
    display: grid;
    gap: 8px;
    min-width: 0;
    padding: 10px;
    border-radius: var(--radius-sm);
    background: var(--ui-surface, var(--surface));
    box-shadow:
        0 0 0 1px rgba(0, 0, 0, .06),
        0 1px 2px -1px rgba(0, 0, 0, .06),
        0 2px 4px 0 rgba(0, 0, 0, .04);
}

.task-person-card--primary {
    background: color-mix(in srgb, var(--ui-accent, var(--red)) 5%, #ffffff);
    box-shadow:
        0 0 0 1px color-mix(in srgb, var(--ui-accent, var(--red)) 20%, rgba(0, 0, 0, .06)),
        0 1px 2px -1px rgba(0, 0, 0, .06),
        0 2px 4px 0 rgba(0, 0, 0, .04);
}

.task-person-card--work {
    grid-column: 1 / -1;
}

.task-person-card__label {
    color: var(--ui-muted, var(--muted));
    font-family: var(--font-body);
    font-size: var(--text-xs);
    font-weight: 800;
    letter-spacing: .04em;
    line-height: 1.1;
    text-transform: uppercase;
}

.task-person-card__body {
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr);
    gap: 8px;
    align-items: center;
    min-width: 0;
}

.task-person-card__list {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    min-width: 0;
}

.task-person-card__chip {
    display: inline-flex;
    align-items: center;
    min-width: 0;
    max-width: 100%;
    min-height: 28px;
    gap: 6px;
    padding: 3px 8px 3px 4px;
    border-radius: 999px;
    background: var(--ui-surface-soft, var(--surface-soft));
    color: var(--ui-text, var(--black));
    font-family: var(--font-body);
    font-size: var(--text-xs);
    font-weight: 700;
    line-height: 1.15;
}

.task-person-card__chip > span:last-child {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.task-person-card__date {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 72px;
    height: 28px;
    padding: 0 8px;
    border-radius: var(--radius-xs);
    background: var(--ui-surface-soft, var(--surface-soft));
    color: var(--ui-text, var(--black));
    font-family: var(--font-body);
    font-size: var(--text-xs);
    font-variant-numeric: tabular-nums;
    font-weight: 800;
    line-height: 1;
    white-space: nowrap;
}

.task-person-card__date.date-red {
    background: color-mix(in srgb, var(--red) 10%, #ffffff);
    color: var(--red);
}

.task-person-card__date.date-amber {
    background: color-mix(in srgb, #B7791F 12%, #ffffff);
    color: #8A4B09;
}

.task-person-card__date.date-empty {
    color: var(--ui-muted, var(--muted));
}

.task-person-card .mini-ava {
    width: 28px;
    height: 28px;
    font-family: var(--font-body);
    font-size: var(--text-xs);
    font-weight: 800;
    font-variant-numeric: tabular-nums;
}

.task-person-card strong,
.task-person-card small,
.task-person-card p {
    min-width: 0;
    font-family: var(--font-body);
    letter-spacing: 0;
}

.task-person-card strong {
    display: block;
    overflow: hidden;
    color: var(--ui-text, var(--black));
    font-size: var(--text-sm);
    font-weight: 800;
    line-height: 1.2;
    text-overflow: ellipsis;
    text-wrap: pretty;
}

.task-person-card--hours strong {
    font-size: var(--text-xl);
    font-variant-numeric: tabular-nums;
}

.task-person-card strong.task-person-card__date {
    display: inline-flex;
    width: fit-content;
    max-width: 100%;
    overflow: visible;
    font-size: var(--text-sm);
    text-overflow: clip;
}

.task-person-card small,
.task-person-card p {
    display: block;
    margin: 2px 0 0;
    overflow-wrap: anywhere;
    color: var(--ui-muted, var(--muted));
    font-size: var(--text-xs);
    font-weight: 600;
    line-height: 1.25;
}

.task-fact-strip div {
    min-width: 0;
    min-height: 54px;
    padding: 9px 11px;
    border-right: 1px solid var(--ui-line-soft, var(--line-soft));
}

.task-fact-strip div:last-child {
    border-right: 0;
}

.task-fact-strip dt {
    margin: 0 0 3px;
    color: var(--ui-muted, var(--muted));
    font-family: var(--font-body);
    font-size: var(--text-xs);
    font-weight: 800;
    letter-spacing: .04em;
    line-height: 1.1;
    text-transform: uppercase;
}

.task-fact-strip dd {
    margin: 0;
    overflow: hidden;
    color: var(--ui-text, var(--black));
    font-family: var(--font-body);
    font-size: var(--text-lg);
    font-variant-numeric: tabular-nums;
    font-weight: 800;
    letter-spacing: 0;
    line-height: 1.15;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.is-drawer-page .task-fact-strip {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.is-drawer-page .task-people-grid {
    grid-template-columns: minmax(0, 1fr);
    width: 100%;
    max-width: none;
}

.is-drawer-page .task-passport__head > .task-tags,
.is-drawer-page .task-passport__head > .task-fact-strip {
    width: 100%;
    max-width: none;
}

.is-drawer-page .task-person-card {
    padding: 9px;
}

.is-drawer-page .task-person-card__body {
    grid-template-columns: 26px minmax(0, 1fr);
}

.is-drawer-page .task-person-card .mini-ava {
    width: 26px;
    height: 26px;
}

.is-drawer-page .task-fact-strip div:nth-child(2n) {
    border-right: 0;
}

.is-drawer-page .task-fact-strip div:nth-child(n + 3) {
    border-top: 1px solid var(--ui-line-soft, var(--line-soft));
}

.project-settings-panel {
    margin: 0 24px 14px;
}

.project-settings-panel__body {
    display: grid;
    gap: 12px;
    padding: 12px;
    border-top: 1px solid var(--ui-line-soft, var(--line-soft));
    background: var(--ui-surface-soft, var(--surface-soft));
}

.project-settings-panel__body > .panel,
.project-settings-panel__body > details.panel {
    margin: 0;
    box-shadow: none;
}

.project-visible-models .btn--red {
    background: var(--red);
    color: var(--white);
}

.project-models-summary .details-toggle-label,
.project-settings-panel .details-toggle-label {
    flex: 0 0 auto;
}

@media (max-width: 720px) {
    .task-fact-strip {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .task-fact-strip div:nth-child(2n) {
        border-right: 0;
    }

    .task-fact-strip div:nth-child(n + 3) {
        border-top: 1px solid var(--ui-line-soft, var(--line-soft));
    }

    .project-settings-panel {
        margin-right: 12px;
        margin-left: 12px;
    }
}

@media (max-width: 980px) {

    .is-task-hub-page .project-task-row,
    .is-task-hub-page .project-task-group__head,
    .is-task-hub-page .project-task-list__filters {
        grid-template-columns: minmax(0, 1fr) !important;
    }

    .is-task-hub-page .project-task-list__head {
        display: none !important;
    }

    .is-task-hub-page .project-task-row__status,
    .is-task-hub-page .project-task-row__type,
    .is-task-hub-page .project-task-row__section {
        justify-self: start !important;
    }

    .is-task-hub-page .project-task-group__meta,
    .is-task-hub-page .project-task-row__people,
    .is-task-hub-page .project-task-row__date {
        justify-self: start !important;
    }
}

@media (max-width: 760px) {
    input,
    select,
    textarea {
        font-size: 16px !important;
    }

    :root body button,
    :root body a.btn {
        min-width: 40px !important;
        min-height: 40px !important;
    }

    .time-days .panel__head {
        align-items: stretch !important;
    }

    .time-week-nav,
    .time-calendar-form,
    .time-calendar-form label {
        width: 100% !important;
        justify-content: stretch !important;
        margin-left: 0 !important;
    }

    .time-week-nav .btn,
    .time-week-nav .pill,
    .time-calendar-form button,
    .time-calendar-form input[type="date"] {
        width: 100% !important;
    }

    .time-week-nav .pill {
        justify-content: center !important;
        text-align: center !important;
    }
}
