.deadline-page-header { margin-bottom: 18px; }
.deadline-rule { display: grid; grid-template-columns: 40px minmax(0, 1fr) auto; align-items: center; gap: 12px; margin-bottom: 15px; padding: 13px 16px; border: 1px solid #bedfd9; border-radius: 12px; color: #225d58; background: linear-gradient(90deg, #effaf8, #f8fcfb); }
.deadline-rule__icon { display: inline-flex; width: 38px; height: 38px; align-items: center; justify-content: center; border-radius: 10px; color: var(--primary); background: #dff3ef; }
.deadline-rule__icon svg { width: 18px; height: 18px; }
.deadline-rule > div { display: grid; }
.deadline-rule strong { color: #175b55; font-size: 12px; }
.deadline-rule span { font-size: 10px; }
.deadline-rule__total { padding: 5px 9px; border: 1px solid #c9e8e2; border-radius: 999px; color: #287068; background: #fff; font-weight: 750; white-space: nowrap; }
.deadline-stats { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 11px; margin-bottom: 15px; }
.deadline-stat { --tone: #7c8797; --tone-soft: #f2f4f7; position: relative; display: grid; min-height: 106px; padding: 15px 16px; overflow: hidden; border: 1px solid var(--line); border-radius: 13px; background: var(--surface); box-shadow: var(--shadow-xs); transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease; }
.deadline-stat::before { position: absolute; inset: 0 auto 0 0; width: 3px; background: var(--tone); content: ""; }
.deadline-stat::after { position: absolute; right: -24px; bottom: -34px; width: 80px; height: 80px; border-radius: 50%; background: var(--tone-soft); content: ""; }
.deadline-stat:hover, .deadline-stat.is-active { border-color: color-mix(in srgb, var(--tone) 42%, var(--line)); box-shadow: var(--shadow-sm); transform: translateY(-1px); }
.deadline-stat > span { color: var(--muted); font-size: 10px; font-weight: 750; text-transform: uppercase; }
.deadline-stat strong { color: var(--tone); font-size: 28px; line-height: 1.18; }
.deadline-stat small { color: var(--ink-soft); font-size: 10px; }
.deadline-stat--danger { --tone: var(--danger); --tone-soft: var(--danger-soft); }
.deadline-stat--warning { --tone: var(--warning); --tone-soft: var(--warning-soft); }
.deadline-stat--success { --tone: var(--success); --tone-soft: var(--success-soft); }
.deadline-stat--info { --tone: var(--info); --tone-soft: var(--info-soft); }
.deadline-stat--neutral { --tone: #778398; --tone-soft: #f0f2f6; }
.deadline-toolbar { margin-bottom: 15px; }
.deadline-filters { display: grid; grid-template-columns: minmax(260px, 1.35fr) repeat(3, minmax(155px, .72fr)) auto auto; align-items: end; }
.filter-chip b { display: inline-flex; min-width: 20px; height: 20px; align-items: center; justify-content: center; margin-left: 3px; padding: 0 6px; border-radius: 999px; background: rgb(18 135 125 / .1); font-size: 9px; }
.data-table--deadlines { min-width: 1050px; }
.data-table--deadlines th, .data-table--deadlines td { padding-inline: 11px; }
.data-table--deadlines .entity-link { min-width: 175px; }
.deadline-row { --row-tone: #98a2b3; }
.deadline-row--danger { --row-tone: var(--danger); }
.deadline-row--warning { --row-tone: var(--warning); }
.deadline-row--success { --row-tone: var(--success); }
.deadline-row--info { --row-tone: var(--info); }
.deadline-row td:first-child { position: relative; }
.deadline-row td:first-child::before { position: absolute; inset: 0 auto 0 0; width: 3px; background: var(--row-tone); content: ""; }
.deadline-badge { --badge-tone: #7c8797; --badge-soft: #f2f4f7; display: inline-grid; min-width: 138px; grid-template-columns: 8px 1fr; align-items: center; gap: 8px; padding: 7px 9px; border-radius: 9px; color: var(--badge-tone); background: var(--badge-soft); }
.deadline-badge > i { width: 8px; height: 8px; border-radius: 50%; background: var(--badge-tone); box-shadow: 0 0 0 3px color-mix(in srgb, var(--badge-tone) 13%, transparent); }
.deadline-badge > span { display: grid; }
.deadline-badge strong { font-size: 10px; }
.deadline-badge small { color: color-mix(in srgb, var(--badge-tone) 76%, #667085); font-size: 9px; white-space: nowrap; }
.deadline-badge--danger { --badge-tone: var(--danger); --badge-soft: var(--danger-soft); }
.deadline-badge--warning { --badge-tone: var(--warning); --badge-soft: var(--warning-soft); }
.deadline-badge--success { --badge-tone: var(--success); --badge-soft: var(--success-soft); }
.deadline-badge--info { --badge-tone: var(--info); --badge-soft: var(--info-soft); }
.deadline-status-form { display: flex; align-items: center; gap: 5px; }
.deadline-status-form select { width: 146px; height: 34px; padding: 5px 27px 5px 8px; border: 1px solid var(--line-strong); border-radius: 8px; color: var(--ink-soft); background: #fff; font-size: 10px; outline: none; }
.deadline-status-form select:focus { border-color: #55aaa3; box-shadow: 0 0 0 3px rgb(18 135 125 / .1); }
.deadline-status-form button { display: inline-flex; width: 32px; height: 32px; align-items: center; justify-content: center; padding: 0; border: 1px solid #b8ddd7; border-radius: 8px; color: var(--primary); background: var(--primary-soft); cursor: pointer; }
.deadline-status-form button:hover { color: #fff; background: var(--primary); }
.deadline-status-form button svg { width: 16px; height: 16px; }

@media (max-width: 1280px) {
    .deadline-stats { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .deadline-filters { grid-template-columns: 1fr 1fr 1fr; }
    .deadline-filters .search-field { grid-column: 1 / -1; }
}

@media (max-width: 760px) {
    .deadline-rule { grid-template-columns: 38px 1fr; }
    .deadline-rule__total { grid-column: 1 / -1; justify-self: start; }
    .deadline-stats { grid-template-columns: 1fr 1fr; }
    .deadline-stat { min-height: 96px; }
    .deadline-filters { grid-template-columns: 1fr; }
    .deadline-filters .search-field { grid-column: auto; }
}

@media (max-width: 420px) {
    .deadline-stats { grid-template-columns: 1fr; }
}