.ui11-progress { display: grid; gap: 14px; color: var(--ink); }
.ui11-kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; padding: 20px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); box-shadow: var(--shadow); }
.ui11-kpi { min-width: 0; min-height: 82px; display: flex; align-items: center; gap: 14px; padding: 14px 16px; border: 1px solid #cfe0ef; border-radius: 11px; background: linear-gradient(135deg, #f8fbff, #eef6ff); }
.ui11-kpi.is-green { border-color: #bee5d2; background: linear-gradient(135deg, #f2fcf7, #e9f9f1); }.ui11-kpi > span { width: 44px; height: 44px; display: grid; place-items: center; flex: 0 0 44px; border-radius: 50%; background: #e5f0ff; color: #1768df; }.ui11-kpi.is-green > span { background: #dff5e9; color: #11935a; }.ui11-kpi svg { width: 25px; height: 25px; }.ui11-kpi div { min-width: 0; display: grid; grid-template-columns: 1fr auto; align-items: baseline; column-gap: 10px; }.ui11-kpi small { color: #243a5b; font-size: 13px; font-weight: 700; }.ui11-kpi strong { color: #0b4dc2; font-size: 21px; line-height: 1.2; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.ui11-kpi.is-green strong { color: #087d3d; }.ui11-kpi em { grid-column: 1 / -1; margin-top: 6px; color: #087d3d; font-size: 13px; font-style: normal; }
.ui11-columns { display: grid; grid-template-columns: minmax(0, 1.13fr) minmax(430px, .9fr); gap: 14px; align-items: stretch; }
.ui11-card { min-width: 0; min-height: 455px; padding: 22px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); box-shadow: var(--shadow); }.ui11-card h2 { margin: 0; color: #0b2149; font-size: 17px; line-height: 1.3; }
.ui11-timeline { position: relative; display: grid; gap: 14px; margin: 18px 0 18px; padding-left: 70px; }.ui11-timeline::before { position: absolute; top: 27px; bottom: 27px; left: 34px; width: 2px; background: #d8e1ec; content: ''; }.ui11-step { position: relative; min-height: 58px; display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 14px; padding: 10px 20px; border: 1px solid #ccd8e5; border-radius: 17px; background: #fafcff; }.ui11-node { position: absolute; z-index: 1; left: -60px; width: 38px; height: 38px; display: grid; place-items: center; border: 6px solid #f0f4f8; border-radius: 50%; background: #e4eaf2; color: #15294b; font-size: 16px; font-weight: 800; box-sizing: content-box; }.ui11-node svg { width: 21px; height: 21px; }.ui11-step.is-done { border-color: #b9e2cd; background: linear-gradient(90deg, #f4fcf7, #edf9f3); }.ui11-step.is-done .ui11-node { border-color: #e6f7ee; background: #16a066; color: #fff; }.ui11-step.is-current .ui11-node { border-color: #e8f1ff; background: #1768e8; color: #fff; }.ui11-step b, .ui11-step small { display: block; }.ui11-step b { font-size: 15px; }.ui11-step small { margin-top: 5px; color: #233a5e; font-size: 13px; overflow-wrap: anywhere; }.ui11-step em { padding: 6px 12px; border: 1px solid #d8e0e8; border-radius: 999px; color: #40506a; font-size: 12px; font-style: normal; white-space: nowrap; }.ui11-step.is-done em { border-color: #c7ead8; background: #ddf5e8; color: #087c3e; }
.ui11-total { padding: 2px 10px 0; }.ui11-total > div:first-child { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; }.ui11-total b { color: #0b2149; font-size: 15px; }.ui11-total strong { color: #07883f; font-size: 20px; }.ui11-progress-track { height: 15px; overflow: hidden; border-radius: 999px; background: #dce3ec; }.ui11-progress-track i { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #16aa7a, #16a365); transition: width .2s ease; }
.ui11-card-head { min-height: 42px; display: flex; align-items: center; justify-content: space-between; gap: 14px; padding-bottom: 16px; }.ui11-card-head > div { display: flex; gap: 9px; }.ui11-card-head .button { min-height: 38px; gap: 7px; color: #075de1; }.ui11-card-head .button svg { width: 18px; height: 18px; }.ui11-card-head [data-action="capture"] svg:empty { display: none; }.ui11-card-head [data-action="capture"]::before { content: '▣'; font-size: 17px; }
.ui11-file-table { border-top: 1px solid #e1e7ef; }.ui11-file-head, .ui11-file-row { display: grid; grid-template-columns: minmax(210px, 1.45fr) minmax(135px, .85fr) minmax(140px, 1fr) 40px; align-items: center; column-gap: 12px; }.ui11-file-head { min-height: 44px; color: #233a5e; font-size: 12px; font-weight: 700; }.ui11-file-row { min-height: 55px; border-top: 1px solid #e1e7ef; font-size: 13px; }.ui11-file-name { min-width: 0; display: flex; align-items: center; gap: 10px; }.ui11-file-name > b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.ui11-file-name .file-icon, .ui11-file-name .evidence-thumbnail { width: 24px; height: 27px; display: grid; place-items: center; flex: 0 0 24px; border-radius: 3px; object-fit: cover; color: #1872e8; background: #eef5ff; cursor: pointer; }.ui11-file-name svg { width: 18px; height: 18px; }.ui11-file-row time, .ui11-file-row > span { min-width: 0; overflow: hidden; color: #162b50; text-overflow: ellipsis; white-space: nowrap; }.ui11-file-menu { display: flex; justify-content: flex-end; align-items: center; gap: 3px; }.ui11-file-menu > a, .ui11-file-menu > button:not(.icon-button), .ui11-file-menu > small { display: none; }.ui11-file-menu .icon-button { width: 30px; height: 30px; border: 0; }.ui11-file-menu .icon-button svg:empty::after { content: '⋮'; }.ui11-file-menu > span { font-size: 22px; }.ui11-file-empty { min-height: 190px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; color: #687a93; text-align: center; }.ui11-file-empty svg { width: 36px; height: 36px; color: #8aa2bd; }.ui11-file-footer { min-height: 50px; display: flex; align-items: center; justify-content: space-between; gap: 12px; border-top: 1px solid #e1e7ef; color: #263a59; font-size: 13px; }.ui11-file-footer > div { display: flex; gap: 7px; }.pagination-page { min-width: 34px; height: 34px; border: 1px solid var(--line); border-radius: 7px; background: #fff; color: #24405f; }.pagination-page.active { border-color: #1768e8; background: #1768e8; color: #fff; }
.ui11-banner { min-height: 52px; display: flex; align-items: center; gap: 14px; padding: 11px 16px; border: 1px solid #53c999; border-radius: 10px; background: #e9faf3; color: #153a2d; font-size: 14px; }.ui11-banner svg { width: 23px; height: 23px; flex: 0 0 23px; padding: 4px; border-radius: 50%; background: #159d62; color: #fff; }.ui11-banner svg:empty { display: none; }.ui11-banner.is-executing::before { width: 23px; height: 23px; display: grid; place-items: center; flex: 0 0 23px; border-radius: 50%; background: #159d62; color: #fff; content: 'i'; font-weight: 800; }.ui11-banner.is-warning { border-color: #edcd79; background: #fff8e7; }.ui11-banner.is-warning svg { background: #e69a13; }.ui11-banner.is-completed { border-color: #73c99c; }
.ui11-update-panel:not([hidden]) ~ .ui11-latest { display: none; }
[data-ui11-legacy] { display: none; }
.ui11-title-actions { display: flex; align-items: center; justify-content: space-between; gap: 14px; }.ui11-title-actions .button { min-height: 36px; }.ui11-title-actions .button:disabled, .ui11-card-head .button:disabled { opacity: .55; cursor: not-allowed; }
.ui11-update-panel { margin: 14px 0; padding: 14px; border: 1px solid #c9dff0; border-radius: 10px; background: #f8fbff; }.ui11-update-panel[hidden] { display: none; }.ui11-update-panel h3 { margin: 0 0 10px; font-size: 14px; }.ui11-update-panel textarea { width: 100%; box-sizing: border-box; resize: vertical; border: 1px solid var(--line); border-radius: 8px; padding: 10px 11px; font: inherit; }.milestones { display: flex; gap: 7px; margin-bottom: 10px; flex-wrap: wrap; }.milestone { min-width: 46px; padding: 7px 9px; border: 1px solid var(--line); border-radius: 7px; background: #fff; color: #40506a; font-weight: 700; }.milestone.active { border-color: #1768e8; background: #1768e8; color: #fff; }.progress-actions { display: flex; justify-content: flex-end; margin-top: 10px; }.progress-validation { margin: 7px 0 0; color: var(--danger); font-size: 12px; }
.ui11-timeline-card { position: relative; }.ui11-latest { min-width: 0; min-height: 58px; display: flex; align-items: center; justify-content: space-between; gap: 14px; margin: 14px 0 4px; padding: 10px 12px; border: 1px solid #dce6f0; border-radius: 9px; background: #f8fbfd; }.ui11-latest > div { min-width: 0; flex: 1; }.ui11-latest > div > b { display: block; margin-bottom: 3px; color: #203754; font-size: 13px; }.ui11-latest [data-role="latest"] { min-width: 0; }.ui11-latest .latest-copy { margin: 0; overflow: hidden; color: #52637a; font-size: 12px; line-height: 1.4; text-overflow: ellipsis; white-space: nowrap; }.ui11-latest .latest-meta { display: none; }.ui11-latest .button { min-height: 34px; padding: 6px 10px; color: #1260c9; font-size: 12px; white-space: nowrap; }
.ui11-step p { margin: 5px 0 0; color: #52637a; font-size: 13px; line-height: 1.45; overflow-wrap: anywhere; }.history-empty { color: #687a93; font-size: 12px; }
.ui11-supplement-card { min-height: 0; padding: 18px 20px; }
.ui11-supplement-card h2 { margin: 0 0 10px; color: #0b2149; font-size: 15px; }
.ui11-supplement-card p { margin: 0 0 8px; color: #40516a; font-size: 13px; line-height: 1.5; }
.ui11-supplement-card > small { display: inline-flex; margin-right: 10px; padding: 4px 8px; border-radius: 999px; background: var(--warning-soft); color: var(--warning); font-size: 11px; font-weight: 700; }
.ui11-supplement-card .supplement-empty { min-height: 62px; display: flex; align-items: center; justify-content: center; gap: 9px; border: 1px dashed #cbd7e4; border-radius: 8px; background: #fafcfe; color: #6c7c91; font-size: 13px; }
.ui11-supplement-card .supplement-empty svg { width: 21px; height: 21px; }
.ui11-file-menu { position: relative; justify-self: end; }.ui11-file-menu > summary { width: 30px; height: 30px; display: grid; place-items: center; border-radius: 6px; cursor: pointer; font-size: 21px; list-style: none; }.ui11-file-menu > summary::-webkit-details-marker { display: none; }.ui11-file-menu > summary:hover { background: #eef4fa; }.ui11-file-menu > div { position: absolute; z-index: 5; top: 31px; right: 0; min-width: 145px; display: grid; padding: 5px; border: 1px solid var(--line); border-radius: 8px; background: #fff; box-shadow: 0 10px 24px rgba(15,35,60,.16); }.ui11-file-menu > div button { padding: 8px 10px; border: 0; border-radius: 5px; background: transparent; color: #243a5b; text-align: left; }.ui11-file-menu > div button:hover:not(:disabled) { background: #eef5fd; }.ui11-file-menu > div button:disabled { color: #a5afbc; cursor: not-allowed; }
.image-viewer[hidden] { display: none; }.image-viewer { position: fixed; inset: 0; z-index: 1000; display: grid; grid-template-columns: 56px minmax(0, 1fr) 56px; align-items: center; gap: 12px; padding: 48px; background: rgba(0,0,0,.85); }.image-viewer img { display: block; max-width: 100%; max-height: calc(100vh - 96px); margin: auto; object-fit: contain; }.viewer-close, .viewer-prev, .viewer-next { border: 0; background: transparent; color: #fff; font-size: 34px; }.viewer-close { position: absolute; top: 14px; right: 20px; }.viewer-prev:disabled, .viewer-next:disabled { opacity: .25; }.image-viewer a { position: absolute; right: 24px; bottom: 18px; color: #fff; }
.ui11-file-menu > summary svg { width: 18px; height: 18px; }
.ui11-card-head [data-action="capture"]::before { display: none; }
@media (max-width: 1180px) { .ui11-kpis { grid-template-columns: repeat(2, 1fr); }.ui11-columns { grid-template-columns: 1fr; }.ui11-card { min-height: auto; } }
@media (max-width: 700px) { .ui11-kpis { grid-template-columns: 1fr; padding: 12px; }.ui11-card { padding: 16px; }.ui11-file-head { display: none; }.ui11-file-row { grid-template-columns: minmax(0, 1fr) 32px; padding: 10px 0; }.ui11-file-row time, .ui11-file-row > span { grid-column: 1; }.ui11-file-menu { grid-column: 2; grid-row: 1 / 3; }.ui11-card-head { align-items: flex-start; flex-direction: column; }.ui11-step { grid-template-columns: 1fr; }.ui11-step em { justify-self: start; }.ui11-timeline { padding-left: 58px; }.ui11-node { left: -52px; }.image-viewer { grid-template-columns: 40px minmax(0, 1fr) 40px; padding: 44px 8px; } }