.project-gate-card {
    overflow: visible;
    min-width: 0;
}

.project-execution-plan-tool-form,
.project-execution-plan-options {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.75rem 1rem;
}

.project-execution-plan-tool-form {
    justify-content: space-between;
}

.project-execution-plan-tool-options {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem 1rem;
}

.project-execution-plan-options-card .section-title {
    gap: 1rem;
}

.project-execution-plan-card {
    display: grid;
    gap: 0.9rem;
}

.project-execution-plan-kpis {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 1rem;
}

.project-execution-plan-table-wrap {
    width: 100%;
    overflow-x: auto;
}

.project-execution-plan-table-wrap > .table {
    min-width: 720px;
}

.project-execution-plan-test-table {
    table-layout: fixed;
}

.project-execution-plan-test-table th:first-child,
.project-execution-plan-test-table td:first-child {
    width: 4.25rem;
    text-align: center;
}

.project-execution-plan-test-table th:nth-child(2),
.project-execution-plan-test-table td:nth-child(2) {
    width: 12rem;
}

.project-execution-plan-functional-test-table th:first-child,
.project-execution-plan-functional-test-table td:first-child {
    width: 7.5rem;
}

.project-execution-plan-functional-test-table th:nth-child(2),
.project-execution-plan-functional-test-table td:nth-child(2),
.project-execution-plan-functional-test-table th:nth-child(3),
.project-execution-plan-functional-test-table td:nth-child(3) {
    width: 7rem;
}

.project-execution-plan-test-check {
    display: inline-block;
    position: relative;
    width: 1rem;
    height: 1rem;
    border: 1px solid #9eb6d0;
    border-radius: 3px;
    background: #fff;
    vertical-align: middle;
}

.project-execution-plan-test-check.is-checked::after {
    content: "";
    position: absolute;
    left: 0.27rem;
    top: 0.08rem;
    width: 0.32rem;
    height: 0.58rem;
    border: solid #0c355d;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}

.project-execution-plan-pdf-modal {
    z-index: 180;
}

.project-execution-plan-pdf-modal-card {
    width: min(420px, 92vw);
}

.project-execution-plan-pdf-modal-card .modal-body {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 1rem;
}

.project-execution-plan-pdf-spinner {
    width: 2.3rem;
    height: 2.3rem;
    border: 3px solid #d9e7f5;
    border-top-color: #0c355d;
    border-radius: 50%;
    animation: projectExecutionPlanPdfSpin 0.8s linear infinite;
}

body.project-execution-plan-pdf-busy {
    cursor: wait;
}

body.project-execution-plan-pdf-busy [data-execution-plan-pdf-download] {
    pointer-events: none;
    opacity: 0.72;
}

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

.project-execution-plan-subtitle {
    margin: 0.25rem 0 0;
    color: #0c355d;
    font-size: 1rem;
    font-weight: 700;
}

.project-execution-plan-duration-key {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem 0.85rem;
    color: #4b6385;
    font-size: 0.82rem;
    font-weight: 700;
}

.project-execution-plan-duration-key span {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
}

.project-execution-plan-duration-key i {
    width: 0.85rem;
    height: 0.85rem;
    border-radius: 3px;
    border: 1px solid #cbd5e1;
}

.project-execution-plan-duration-key .is-phase {
    background: #5b7c99;
    border-color: #36566f;
}

.project-execution-plan-duration-key .is-work {
    background: #1c7ed6;
    border-color: #0b5fa8;
}

.project-execution-plan-duration-key .is-slot {
    background: #e8f3ff;
    border-color: #93c5fd;
}

.project-execution-plan-duration-key .is-gate {
    background: #fff7ed;
    border-color: #fdba74;
}

.project-execution-plan-duration-scroll {
    max-width: 100%;
    overflow-x: auto;
    overflow-y: visible;
    padding: 0.75rem 0.75rem 0.95rem;
    border: 1px solid #d9e2ec;
    border-radius: 8px;
    background: #fff;
}

body.project-execution-plan-pdf-render {
    background: #fff;
}

body.project-execution-plan-pdf-render,
body.project-execution-plan-pdf-render * {
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
}

body.project-execution-plan-pdf-render .topbar,
body.project-execution-plan-pdf-render .sidebar,
body.project-execution-plan-pdf-render .project-execution-plan-options-card,
body.project-execution-plan-pdf-render .page-actions {
    display: none !important;
}

body.project-execution-plan-pdf-render .shell {
    display: block;
}

body.project-execution-plan-pdf-render .page.page-wide {
    max-width: none;
    width: 1680px;
    padding: 1.25rem;
}

body.project-execution-plan-pdf-render .project-execution-plan-card {
    break-inside: avoid;
    box-shadow: none;
}

body.project-execution-plan-pdf-render .project-execution-plan-pdf-avoid-break:not(.project-execution-plan-table-wrap),
body.project-execution-plan-pdf-render .project-execution-plan-component h4,
body.project-execution-plan-pdf-render .project-execution-plan-component h5,
body.project-execution-plan-pdf-render .project-execution-plan-card table thead,
body.project-execution-plan-pdf-render .project-execution-plan-card table tr,
body.project-execution-plan-pdf-render .project-execution-plan-table-wrap tr,
body.project-execution-plan-pdf-render .project-execution-plan-list li {
    break-inside: avoid;
    page-break-inside: avoid;
}

body.project-execution-plan-pdf-render .project-execution-plan-duration-scroll {
    overflow: visible;
    box-shadow: none;
}

body.project-execution-plan-pdf-render .project-execution-plan-duration-month span,
body.project-execution-plan-pdf-render .project-execution-plan-duration-block::before,
body.project-execution-plan-pdf-render .project-execution-plan-duration-block-label {
    box-shadow: none !important;
    filter: none !important;
}

body.project-execution-plan-pdf-render .project-execution-plan-duration-month span {
    position: static;
}

body.project-execution-plan-pdf-render .project-execution-plan-duration-block::before,
body.project-execution-plan-pdf-render .project-execution-plan-duration-block-label {
    border-radius: 4px;
}

body.project-execution-plan-pdf-render .project-execution-plan-duration-block-label {
    --duration-label-border: #d9e2ec;
    --duration-label-left-border: var(--duration-label-border);
    border: 0 !important;
    padding: calc(0.28rem + 1px) calc(0.4rem + 1px);
    background:
        linear-gradient(var(--duration-label-border), var(--duration-label-border)) top / 100% 1px no-repeat,
        linear-gradient(var(--duration-label-border), var(--duration-label-border)) bottom / 100% 1px no-repeat,
        linear-gradient(var(--duration-label-left-border), var(--duration-label-left-border)) left / 1px 100% no-repeat,
        linear-gradient(var(--duration-label-border), var(--duration-label-border)) right / 1px 100% no-repeat,
        #fff;
}

body.project-execution-plan-pdf-render .project-execution-plan-duration-block.is-phase .project-execution-plan-duration-block-label {
    --duration-label-border: var(--phase-soft-border);
    --duration-label-left-border: var(--phase-border);
}

body.project-execution-plan-pdf-render .project-execution-plan-duration-block.is-work .project-execution-plan-duration-block-label {
    --duration-label-border: #93c5fd;
    --duration-label-left-border: #0b5fa8;
}

body.project-execution-plan-pdf-render .project-execution-plan-duration-block.is-slot .project-execution-plan-duration-block-label {
    --duration-label-border: #bfdbfe;
    --duration-label-left-border: #60a5fa;
}

body.project-execution-plan-pdf-render .project-execution-plan-duration-block.is-gate .project-execution-plan-duration-block-label {
    --duration-label-border: #bfdbfe;
    --duration-label-left-border: #60a5fa;
}

body.project-execution-plan-pdf-render .project-execution-plan-duration-block.is-gate.is-overdue .project-execution-plan-duration-block-label {
    --duration-label-border: #fca5a5;
    --duration-label-left-border: #dc2626;
}

body.project-execution-plan-pdf-render .project-execution-plan-duration-block.is-gate.is-due-soon .project-execution-plan-duration-block-label {
    --duration-label-border: #fdba74;
    --duration-label-left-border: #f97316;
}

body.project-execution-plan-pdf-render .project-execution-plan-duration-block.is-gate.is-done .project-execution-plan-duration-block-label {
    --duration-label-border: #86efac;
    --duration-label-left-border: #22c55e;
}

.project-execution-plan-duration-scroll.is-gatekeeping-compact {
    width: min(820px, 100%);
}

.project-execution-plan-duration-board {
    --duration-lane-header-height: 1.9rem;
    display: grid;
    grid-template-columns: 5.8rem minmax(1320px, 1fr);
    gap: 0.7rem;
    min-width: 1450px;
}

.project-execution-plan-duration-board.is-gatekeeping-compact {
    --gatekeeping-content-offset: 1.2rem;
    grid-template-columns: 7.1rem minmax(520px, 1fr);
    width: min(780px, 100%);
    min-width: 720px;
}

.project-execution-plan-duration-axis,
.project-execution-plan-duration-canvas {
    position: relative;
    height: calc(var(--timeline-height) + var(--duration-lane-header-height));
    min-height: calc(34rem + var(--duration-lane-header-height));
}

.project-execution-plan-duration-axis {
    border-right: 2px solid #dbe7f5;
    background: linear-gradient(90deg, transparent calc(100% - 1px), #fff calc(100% - 1px));
}

.project-execution-plan-duration-board.is-gatekeeping-compact .project-execution-plan-duration-axis {
    display: block;
}

.project-execution-plan-duration-board.is-gatekeeping-compact .project-execution-plan-duration-axis,
.project-execution-plan-duration-board.is-gatekeeping-compact .project-execution-plan-duration-canvas {
    height: calc(var(--timeline-height) + var(--duration-lane-header-height) + var(--gatekeeping-content-offset));
    min-height: calc(16rem + var(--duration-lane-header-height) + var(--gatekeeping-content-offset));
}

.project-execution-plan-duration-board.is-gatekeeping-compact .project-execution-plan-duration-month,
.project-execution-plan-duration-board.is-gatekeeping-compact .project-execution-plan-duration-grid-line,
.project-execution-plan-duration-board.is-gatekeeping-compact .project-execution-plan-duration-block,
.project-execution-plan-duration-board.is-gatekeeping-compact .project-execution-plan-duration-today {
    transform: translateY(calc(var(--duration-lane-header-height) + var(--gatekeeping-content-offset)));
}

.project-execution-plan-duration-board.is-gatekeeping-compact .project-execution-plan-duration-month span {
    top: 0.45rem;
    padding: 0.22rem 0.42rem;
    font-size: 0.68rem;
    text-transform: none;
}

.project-execution-plan-duration-month {
    position: absolute;
    right: 0.65rem;
    left: 0;
    border-top: 1px solid #d8e6f7;
    transform: translateY(var(--duration-lane-header-height));
}

.project-execution-plan-duration-month span {
    position: sticky;
    top: 0.65rem;
    display: inline-flex;
    max-width: 100%;
    padding: 0.25rem 0.45rem;
    border: 1px solid #d8e6f7;
    border-radius: 999px;
    background: #eef6ff;
    color: #0c355d;
    font-size: 0.72rem;
    font-weight: 800;
    text-transform: capitalize;
}

.project-execution-plan-duration-canvas {
    display: grid;
    gap: 0.65rem;
}

.project-execution-plan-duration-board.is-gatekeeping-compact .project-execution-plan-duration-canvas {
    min-height: calc(var(--timeline-height) + var(--duration-lane-header-height) + var(--gatekeeping-content-offset));
    grid-template-columns: minmax(520px, 1fr);
}

.project-execution-plan-duration-canvas.has-2-lanes {
    grid-template-columns: minmax(520px, 1fr) minmax(520px, 1fr);
}

.project-execution-plan-duration-canvas.has-3-lanes {
    grid-template-columns: minmax(370px, 0.95fr) minmax(520px, 1.25fr) minmax(360px, 0.95fr);
}

.project-execution-plan-duration-canvas.has-4-lanes {
    grid-template-columns: minmax(330px, 0.95fr) minmax(390px, 1.12fr) minmax(280px, 0.9fr) minmax(320px, 0.95fr);
}

.project-execution-plan-duration-grid-line {
    position: absolute;
    right: 0;
    left: 0;
    z-index: 0;
    border-top: 1px solid #e5edf6;
    transform: translateY(var(--duration-lane-header-height));
    pointer-events: none;
}

.project-execution-plan-duration-today {
    position: absolute;
    right: 0;
    left: 0;
    z-index: 4;
    height: 0;
    border-top: 2px solid #c63030;
    transform: translateY(var(--duration-lane-header-height));
    pointer-events: none;
}

.project-execution-plan-duration-today span {
    position: absolute;
    top: -0.8rem;
    right: 0.4rem;
    padding: 0.12rem 0.45rem;
    border-radius: 999px;
    background: #c63030;
    color: #fff;
    font-size: 0.68rem;
    font-weight: 800;
}

.project-execution-plan-duration-lane {
    position: relative;
    z-index: 1;
    min-width: 0;
    height: 100%;
    border: 1px solid #d9e2ec;
    border-radius: 8px;
    background: rgba(248, 251, 255, 0.74);
    overflow: hidden;
}

.project-execution-plan-duration-lane.is-phases {
    background: #f8fbff;
}

.project-execution-plan-duration-lane.is-work-items {
    background: #f6fbff;
}

.project-execution-plan-duration-lane.is-planning {
    background: #f6fbff;
}

.project-execution-plan-duration-lane.is-gates {
    background: #fffaf5;
}

.project-execution-plan-duration-lane.is-gatekeeping-compact {
    background: #fffdf9;
}

.project-execution-plan-duration-lane-title {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    z-index: 3;
    min-height: var(--duration-lane-header-height);
    padding: 0.4rem 0.55rem;
    border-bottom: 1px solid #d9e2ec;
    background: rgba(247, 251, 255, 0.96);
    color: #0c355d;
    font-size: 0.78rem;
    font-weight: 800;
}

.project-execution-plan-duration-empty {
    padding: calc(var(--duration-lane-header-height) + 2.6rem) 0.55rem 0;
}

.project-execution-plan-duration-block {
    position: absolute;
    z-index: 2;
    right: 0;
    left: 0;
    min-height: 1.25rem;
    transform: translateY(var(--duration-lane-header-height));
    overflow: visible;
    pointer-events: none;
}

.project-execution-plan-duration-block:hover {
    z-index: 5;
}

.project-execution-plan-duration-block::before {
    content: "";
    position: absolute;
    top: var(--bar-top, 0);
    left: var(--bar-left, 0.65rem);
    width: var(--bar-width, 0.8rem);
    height: var(--bar-height, 100%);
    min-height: 1.25rem;
    border: 1px solid #cbd5e1;
    border-radius: 5px;
    background: #fff;
    box-shadow: 0 4px 10px rgba(20, 47, 82, 0.1);
}

.project-execution-plan-duration-block-label {
    position: absolute;
    top: var(--label-shift, 0);
    right: 0.45rem;
    left: var(--label-left, 2.5rem);
    display: grid;
    gap: 0.12rem;
    max-width: 22rem;
    padding: 0.28rem 0.4rem;
    border: 1px solid #d9e2ec;
    border-radius: 6px;
    background: rgba(255, 255, 255, 0.94);
    box-shadow: 0 8px 16px rgba(20, 47, 82, 0.08);
    pointer-events: auto;
}

.project-execution-plan-duration-lane.is-gatekeeping-compact .project-execution-plan-duration-block-label {
    max-width: 34rem;
}

.project-execution-plan-duration-block-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.4rem;
    min-width: 0;
}

.project-execution-plan-duration-block-head strong {
    min-width: 0;
    color: #0c1f3d;
    font-size: 0.78rem;
    line-height: 1.15;
    overflow: hidden;
    word-break: normal;
    overflow-wrap: normal;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.project-execution-plan-duration-block-head span {
    flex: 0 0 auto;
    padding: 0.08rem 0.32rem;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.68);
    color: inherit;
    font-size: 0.68rem;
    font-weight: 800;
    white-space: nowrap;
}

.project-execution-plan-duration-block-subtitle,
.project-execution-plan-duration-block-detail,
.project-execution-plan-duration-block-items {
    color: #38516f;
    font-size: 0.68rem;
    line-height: 1.2;
}

.project-execution-plan-duration-block-subtitle,
.project-execution-plan-duration-block-detail {
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
}

.project-execution-plan-duration-block-items {
    display: grid;
    gap: 0.16rem;
    margin: 0;
    padding: 0;
    list-style: none;
    max-height: 4.2rem;
    overflow: hidden;
}

.project-execution-plan-duration-block-items li {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.project-execution-plan-duration-block.is-phase {
    --phase-bar: #5b7c99;
    --phase-border: #36566f;
    --phase-soft-border: #b8cad8;
    --phase-text: #16364e;
    color: var(--phase-text);
}

.project-execution-plan-duration-block.is-phase::before {
    border-color: var(--phase-border);
    background: var(--phase-bar);
}

.project-execution-plan-duration-block.is-phase .project-execution-plan-duration-block-label {
    border-color: var(--phase-soft-border);
    border-left-color: var(--phase-border);
}

.project-execution-plan-duration-block.is-phase strong {
    color: var(--phase-text);
}

.project-execution-plan-duration-block.is-phase-tone-1 {
    --phase-bar: #5b7c99;
    --phase-border: #36566f;
    --phase-soft-border: #b8cad8;
    --phase-text: #16364e;
}

.project-execution-plan-duration-block.is-phase-tone-2 {
    --phase-bar: #4f8a83;
    --phase-border: #2f665f;
    --phase-soft-border: #b3d4cf;
    --phase-text: #16423d;
}

.project-execution-plan-duration-block.is-phase-tone-3 {
    --phase-bar: #7967a8;
    --phase-border: #594783;
    --phase-soft-border: #cbc1e3;
    --phase-text: #352a58;
}

.project-execution-plan-duration-block.is-phase-tone-4 {
    --phase-bar: #667f4a;
    --phase-border: #465e2f;
    --phase-soft-border: #c4d3b3;
    --phase-text: #2e3f1f;
}

.project-execution-plan-duration-block.is-phase-tone-5 {
    --phase-bar: #8a6f4b;
    --phase-border: #654f31;
    --phase-soft-border: #d7c8ae;
    --phase-text: #49351f;
}

.project-execution-plan-duration-block.is-phase-tone-6 {
    --phase-bar: #4f769f;
    --phase-border: #31587e;
    --phase-soft-border: #b6cbe0;
    --phase-text: #1f3b58;
}

.project-execution-plan-duration-block.is-phase-tone-7 {
    --phase-bar: #8b657f;
    --phase-border: #68475e;
    --phase-soft-border: #d4c0ce;
    --phase-text: #4a2f42;
}

.project-execution-plan-duration-block.is-phase-tone-8 {
    --phase-bar: #5d7d65;
    --phase-border: #3f5d46;
    --phase-soft-border: #b9d1c0;
    --phase-text: #294330;
}

.project-execution-plan-duration-block.is-work {
    color: #fff;
}

.project-execution-plan-duration-block.is-work::before {
    border-color: #0b5fa8;
    background: #1c7ed6;
}

.project-execution-plan-duration-block.is-work .project-execution-plan-duration-block-label {
    border-color: #93c5fd;
    border-left-color: #0b5fa8;
}

.project-execution-plan-duration-block.is-work strong {
    color: #0c355d;
}

.project-execution-plan-duration-block.is-work.is-complete::before {
    border-color: #15803d;
    background: #22a55a;
}

.project-execution-plan-duration-block.is-slot::before {
    border-color: #93c5fd;
    background: #e8f3ff;
}

.project-execution-plan-duration-block.is-slot .project-execution-plan-duration-block-label {
    border-color: #bfdbfe;
    border-left-color: #60a5fa;
}

.project-execution-plan-duration-block.is-gate::before {
    border-color: #bfdbfe;
    background: #eff6ff;
}

.project-execution-plan-duration-block.is-gate {
    color: #1d4ed8;
}

.project-execution-plan-duration-block.is-gate .project-execution-plan-duration-block-label {
    border-color: #bfdbfe;
    border-left-color: #60a5fa;
}

.project-execution-plan-duration-block.is-gate strong {
    color: #0f172a;
}

.project-execution-plan-duration-block.is-gate.is-overdue::before {
    border-color: #fca5a5;
    background: #fff1f2;
}

.project-execution-plan-duration-block.is-gate.is-overdue {
    color: #991b1b;
}

.project-execution-plan-duration-block.is-gate.is-overdue .project-execution-plan-duration-block-label {
    border-color: #fca5a5;
    border-left-color: #dc2626;
}

.project-execution-plan-duration-block.is-gate.is-due-soon::before {
    border-color: #fdba74;
    background: #fff7ed;
}

.project-execution-plan-duration-block.is-gate.is-due-soon {
    color: #9a3412;
}

.project-execution-plan-duration-block.is-gate.is-due-soon .project-execution-plan-duration-block-label {
    border-color: #fdba74;
    border-left-color: #f97316;
}

.project-execution-plan-duration-block.is-gate.is-done::before {
    border-color: #86efac;
    background: #f0fdf4;
}

.project-execution-plan-duration-block.is-gate.is-done {
    color: #166534;
}

.project-execution-plan-duration-block.is-gate.is-done .project-execution-plan-duration-block-label {
    border-color: #86efac;
    border-left-color: #22c55e;
}

.project-execution-plan-duration-block.is-gate.is-open::before {
    border-color: #bfdbfe;
    background: #eff6ff;
}

.project-execution-plan-duration-block.is-gate.is-open {
    color: #1d4ed8;
}

.project-execution-plan-duration-block.is-gate.is-empty::before {
    border-color: #d9e2ec;
    background: #f8fafc;
}

.project-execution-plan-duration-block.is-gate.is-empty {
    color: #4b6385;
}

@media (max-width: 760px) {
    .project-execution-plan-duration-board {
        grid-template-columns: 4.9rem minmax(1180px, 1fr);
        min-width: 1260px;
    }
}

.project-execution-plan-detail-row > td {
    background: #f8fafc;
}

.project-execution-plan-nested-table {
    margin: 0;
    background: #fff;
}

.project-execution-plan-sds-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
    align-items: start;
}

.project-execution-plan-list {
    margin: 0;
    padding-left: 1.1rem;
}

.project-execution-plan-text {
    color: #24364b;
    white-space: pre-wrap;
}

.project-execution-plan-component {
    display: grid;
    gap: 0.65rem;
    padding: 0.9rem;
    border: 1px solid #d9e2ec;
    border-radius: 8px;
    background: #fff;
}

.project-execution-plan-component + .project-execution-plan-component {
    margin-top: 1rem;
}

.project-execution-plan-component h4,
.project-execution-plan-component h5 {
    margin: 0;
    color: #0c355d;
}

.project-gate-card .section-title {
    align-items: flex-start;
    gap: 1rem;
}

.project-gate-card [data-open-project-gate-modal] {
    background: var(--accent);
    color: #fff;
}

.project-gate-card [data-open-project-gate-modal]:hover,
.project-gate-card [data-open-project-gate-modal]:focus,
.project-gate-card [data-open-project-gate-modal]:focus-visible {
    background: var(--accent-strong);
    color: #fff;
}

.project-gate-summary {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
    margin-top: 0.45rem;
}

.project-gate-chip {
    display: inline-flex;
    align-items: center;
    min-height: 1.65rem;
    padding: 0.2rem 0.55rem;
    border: 1px solid #dbe5ef;
    border-radius: 999px;
    background: #f8fafc;
    color: #334155;
    font-size: 0.78rem;
    font-weight: 700;
}

.project-gate-chip.is-overdue,
.project-gate-attention-row.is-overdue .project-gate-attention-state {
    border-color: #fecaca;
    background: #fff1f2;
    color: #991b1b;
}

.project-gate-chip.is-due-soon,
.project-gate-attention-row.is-due-soon .project-gate-attention-state {
    border-color: #fed7aa;
    background: #fff7ed;
    color: #9a3412;
}

.project-plan-period-card {
    display: grid;
    gap: 0.85rem;
}

.project-gate-card .project-plan-period-head {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 0;
}

.project-plan-period-title {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.65rem;
    min-width: 0;
}

.project-plan-period-alert {
    justify-self: center;
}

.project-plan-period-date {
    justify-self: end;
    color: #64748b;
    font-size: 0.82rem;
    font-weight: 600;
    text-align: right;
}

.project-gate-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 1rem;
    align-items: start;
}

.project-gate-main {
    display: contents;
}

.project-gate-main,
.project-gate-detail,
.project-gate-timeline-card,
.project-gate-attention {
    min-width: 0;
}

.project-gate-timeline-card,
.project-gate-attention,
.project-gate-detail {
    border: 1px solid #dbe5ef;
    border-radius: 8px;
    background: #fff;
}

.project-gate-timeline-card {
    order: 1;
    max-width: 100%;
    overflow: hidden;
    padding: 0.9rem 1rem 1.15rem;
}

.project-gate-timeline-head,
.project-gate-detail-head,
.project-gate-column-head,
.project-gate-attention-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
}

.project-gate-timeline-head strong,
.project-gate-subtitle,
.project-gate-detail h3,
.project-gate-column-head strong {
    color: #0f172a;
}

.project-gate-timeline-head span,
.project-gate-detail-head span,
.project-gate-reference,
.project-gate-reference small {
    color: #64748b;
    font-size: 0.82rem;
}

.project-gate-timeline-scroll {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    overflow-x: auto;
    overflow-y: hidden;
    padding-bottom: 0.25rem;
}

.project-gate-axis {
    position: relative;
    min-width: 100%;
    height: 7.1rem;
    margin-top: 0.8rem;
    border-top: 1px solid #dbe5ef;
}

.project-gate-axis::before {
    content: "";
    position: absolute;
    right: 0;
    left: 0;
    top: 3.1rem;
    z-index: 0;
    height: 0.3rem;
    border-radius: 999px;
    background: #e2e8f0;
}

.project-gate-phase-range {
    position: absolute;
    top: 3.1rem;
    z-index: 1;
    height: 0.3rem;
    border-radius: 999px;
    background: #64748b;
}

.project-gate-axis-tick {
    position: absolute;
    top: 0;
    transform: translateX(-50%);
    width: 3.5rem;
    height: 3.1rem;
    color: #64748b;
    font-size: 0.72rem;
    text-transform: lowercase;
    pointer-events: none;
}

.project-gate-axis-tick span {
    position: absolute;
    top: 0.95rem;
    left: 50%;
    width: 1px;
    height: 2.15rem;
    background: #dbe5ef;
}

.project-gate-axis-tick em {
    position: absolute;
    top: 0.05rem;
    left: 50%;
    transform: translateX(-50%);
    font-style: normal;
}

.project-gate-marker {
    position: absolute;
    top: 2.3rem;
    z-index: 2;
    transform: translateX(-50%);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.35rem;
    width: 8.25rem;
    color: #334155;
    text-decoration: none;
    text-align: center;
}

.project-gate-marker span {
    display: grid;
    place-items: center;
    width: 1.55rem;
    height: 1.55rem;
    border: 2px solid #cbd5e1;
    border-radius: 999px;
    background: #fff;
    font-size: 0.68rem;
    font-weight: 800;
    line-height: 1;
}

.project-gate-marker em {
    display: block;
    width: 8.25rem;
    height: 1.65rem;
    color: #475569;
    font-style: normal;
    line-height: 1.15;
}

.project-gate-marker em strong {
    display: -webkit-box;
    color: #334155;
    font-size: 0.68rem;
    font-weight: 800;
    overflow: hidden;
    overflow-wrap: anywhere;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.project-gate-marker.is-selected span {
    box-shadow: 0 0 0 3px #93c5fd;
}

.project-gate-marker.is-done span {
    box-shadow: 0 0 0 3px #4ade80;
}

.project-gate-marker.is-due-soon span {
    box-shadow: 0 0 0 3px #fb923c;
}

.project-gate-marker.is-overdue span {
    box-shadow: 0 0 0 3px #f87171;
}

.project-gate-marker.is-done span,
.project-gate-column-head .is-done {
    border-color: #86efac;
    background: #f0fdf4;
    color: #166534;
}

.project-gate-marker.is-due-soon span,
.project-gate-column-head .is-due-soon {
    border-color: #fdba74;
    background: #fff7ed;
    color: #9a3412;
}

.project-gate-marker.is-overdue span,
.project-gate-column-head .is-overdue {
    border-color: #fca5a5;
    background: #fff1f2;
    color: #991b1b;
}

.project-gate-marker.is-open span,
.project-gate-column-head .is-open {
    border-color: #bfdbfe;
    background: #eff6ff;
    color: #1d4ed8;
}

.project-gate-marker.is-empty span,
.project-gate-column-head .is-empty {
    border-color: #cbd5e1;
    background: #f8fafc;
    color: #64748b;
}

.project-gate-phase-list {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-top: 0.9rem;
}

.project-gate-phase-pill {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.45rem 0.65rem;
    border: 1px solid #dbe5ef;
    border-radius: 999px;
    background: #f8fafc;
    color: #334155;
    text-decoration: none;
}

.project-gate-phase-pill.is-selected {
    border-color: #93c5fd;
    background: #eff6ff;
    color: #1d4ed8;
}

.project-gate-phase-pill small {
    color: #64748b;
    font-weight: 700;
}

.project-gate-attention {
    order: 3;
    margin-top: 0.9rem;
    padding: 0.85rem;
}

.project-gate-subtitle {
    margin-bottom: 0.6rem;
    font-weight: 800;
}

.project-gate-attention-row {
    padding: 0.55rem 0;
    border-top: 1px solid #eef2f7;
    color: #334155;
    text-decoration: none;
}

.project-gate-attention-row:first-of-type {
    border-top: 0;
}

.project-gate-attention-row strong {
    flex: 1 1 auto;
    min-width: 0;
    color: #0f172a;
}

.project-gate-attention-state {
    flex: 0 0 auto;
    min-width: 4.5rem;
    padding: 0.18rem 0.45rem;
    border: 1px solid #dbe5ef;
    border-radius: 999px;
    font-size: 0.72rem;
    font-weight: 800;
    text-align: center;
}

.project-gate-detail {
    order: 2;
    padding: 1rem;
}

.project-gate-detail-panel {
    display: none;
}

.project-gate-detail-panel.is-active {
    display: block;
}

.project-gate-detail h3 {
    margin: 0;
    font-size: 1rem;
}

.project-gate-detail-head {
    align-items: flex-start;
    padding-bottom: 0.8rem;
    border-bottom: 1px solid #eef2f7;
}

.project-gate-columns {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 1.75rem;
    margin-top: 1.1rem;
}

.project-gate-column {
    min-width: 0;
    padding: 0.95rem;
    border: 1px solid #dbe5ef;
    border-radius: 8px;
    background: #f8fafc;
}

.project-gate-column-head {
    margin-bottom: 0.75rem;
    padding-bottom: 0.65rem;
    border-bottom: 1px solid #e2e8f0;
}

.project-gate-column-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 0.5rem;
}

.project-gate-column-head span {
    padding: 0.18rem 0.45rem;
    border: 1px solid #dbe5ef;
    border-radius: 999px;
    font-size: 0.72rem;
    font-weight: 800;
}

.project-gate-column-add {
    white-space: nowrap;
}

.project-gate-items {
    display: grid;
    gap: 0.55rem;
}

.project-gate-column .project-gate-items > .helper {
    padding: 0.75rem 0.85rem;
    border: 1px dashed #cbd5e1;
    border-radius: 8px;
    background: #fff;
}

.project-gate-item {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.75rem;
    padding: 0.7rem;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    background: #fff;
}

.project-gate-item-main {
    min-width: 0;
}

.project-gate-item-title {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    min-width: 0;
}

.project-gate-item-title strong {
    min-width: 0;
    color: #0f172a;
    font-size: 0.88rem;
    overflow-wrap: anywhere;
}

.project-gate-item-check {
    flex: 0 0 auto;
    width: 0.75rem;
    height: 0.75rem;
    border: 2px solid #cbd5e1;
    border-radius: 999px;
    background: #fff;
}

.project-gate-item.is-item-done .project-gate-item-check {
    border-color: #22c55e;
    background: #22c55e;
}

.project-gate-item.is-item-progress .project-gate-item-check {
    border-color: #f59e0b;
    background: #fef3c7;
}

.project-gate-item p {
    margin: 0.25rem 0 0;
    color: #475569;
    font-size: 0.82rem;
    line-height: 1.35;
    overflow-wrap: anywhere;
}

.project-gate-reference {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    margin-top: 0.45rem;
}

.project-gate-reference span {
    padding: 0.16rem 0.42rem;
    border-radius: 999px;
    background: #f1f5f9;
}

.project-gate-reference.is-done span {
    background: #dcfce7;
    color: #166534;
}

.project-gate-reference.is-open span {
    background: #dbeafe;
    color: #1d4ed8;
}

.project-gate-reference small {
    align-self: center;
}

.project-gate-item-controls {
    display: flex;
    align-items: flex-start;
    gap: 0.4rem;
}

.project-gate-inline-form {
    margin: 0;
}

.project-gate-inline-form.is-saving .project-gate-inline-select {
    opacity: 0.65;
}

.project-gate-inline-select {
    min-width: 6.6rem;
    max-width: 11rem;
    height: 2rem;
    padding: 0.25rem 0.5rem;
    border: 1px solid #cbd5e1;
    border-radius: 6px;
    background: #fff;
    color: #334155;
    font-size: 0.78rem;
}

.project-gate-reference-select {
    min-width: 10rem;
}

.project-gate-template-list {
    display: grid;
    gap: 0.6rem;
}

.project-gate-template-list-editor-modal {
    width: min(820px, calc(100vw - 48px));
    max-width: 820px;
}

.project-gate-template-save-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.6rem;
    align-items: center;
}

.project-gate-template-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.75rem;
    padding: 0.75rem;
    border: 1px solid #dbe5f1;
    border-radius: 8px;
    background: #fff;
}

.project-gate-template-row strong,
.project-gate-template-row span,
.project-gate-template-row p,
.project-gate-template-editor-item strong,
.project-gate-template-editor-item p {
    display: block;
}

.project-gate-template-row strong,
.project-gate-template-editor-item strong {
    color: #0f172a;
    font-size: 0.9rem;
}

.project-gate-template-row span {
    margin-top: 0.1rem;
    color: #64748b;
    font-size: 0.78rem;
    font-weight: 700;
}

.project-gate-template-row p,
.project-gate-template-editor-item p {
    margin: 0.25rem 0 0;
    color: #475569;
    font-size: 0.82rem;
    line-height: 1.35;
    overflow-wrap: anywhere;
}

.project-gate-template-actions {
    display: flex;
    align-items: center;
    gap: 0.4rem;
}

.project-gate-template-editor-items {
    display: grid;
    gap: 0.55rem;
}

.project-gate-template-editor-item {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.75rem;
    align-items: start;
    padding: 0.65rem 0;
    border-top: 1px solid #e2e8f0;
}

.project-gate-template-add-item-row {
    display: flex;
    justify-content: flex-end;
    padding-top: 0.65rem;
    border-top: 1px solid #e2e8f0;
}

.project-gate-template-save-state {
    min-height: 1.1rem;
}

.project-gate-template-save-actions button,
.project-gate-template-row button,
.project-gate-template-editor-item button,
.project-gate-template-add-item-row button {
    white-space: nowrap;
}

@media (max-width: 760px) {
    .project-gate-template-list-editor-modal {
        width: min(100vw - 24px, 640px);
    }

    .project-gate-template-row,
    .project-gate-template-editor-item {
        grid-template-columns: 1fr;
    }

    .project-gate-template-actions {
        justify-content: flex-start;
    }

    .project-gate-template-add-item-row {
        justify-content: flex-start;
    }
}

@media (max-width: 760px) {
    .project-gate-columns {
        grid-template-columns: 1fr;
        gap: 0.9rem;
    }
}

@media (max-width: 760px) {
    .project-gate-card .section-title,
    .project-gate-attention-row,
    .project-gate-item,
    .project-gate-item-controls {
        align-items: stretch;
    }

    .project-gate-card .project-plan-period-head {
        grid-template-columns: 1fr;
        justify-items: start;
    }

    .project-plan-period-alert,
    .project-plan-period-date {
        justify-self: start;
        text-align: left;
    }

    .project-gate-item {
        grid-template-columns: 1fr;
    }

    .project-gate-item-controls {
        flex-wrap: wrap;
    }

    .project-gate-column-head {
        align-items: flex-start;
    }

    .project-gate-column-actions {
        justify-content: flex-start;
    }

    .project-gate-axis {
        margin-right: 1rem;
        margin-left: 1rem;
    }
}
