.qspd { min-height: 100%; display: grid; align-content: start; gap: 12px; color: #173852; }
.qspd-breadcrumb { display: flex; align-items: center; flex-wrap: wrap; gap: 7px; min-height: 32px; margin: 0 0 -2px; padding: 7px 10px; border: 1px solid #d9e5ee; border-radius: 8px; background: #f7fbfe; color: #597083; font-size: 12px; }
.qspd-breadcrumb b { color: #9bb0bf; font-weight: 500; }
.qspd-breadcrumb span[aria-current="page"] { color: #173f5f; font-weight: 700; }
.qs-contract-context { min-width: 0; width: 100%; }
.qs-contract-context-state { min-height: 300px; display: grid; place-content: center; gap: 8px; padding: 28px; border: 1px solid #d6e3ed; border-radius: 10px; background: #fbfdff; color: #587186; text-align: center; }
.qs-contract-context-state strong { color: #173f5f; font-size: 17px; }
.qs-contract-context-state.error { border-color: #e2c7c7; background: #fffafa; color: #8a3d3d; }
.qs-contract-context-state button { justify-self: center; margin-top: 8px; }
.qspd-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; padding-bottom: 12px; border-bottom: 1px solid #d9e5ee; }
.qspd-header h3 { margin: 3px 0 4px; color: #123e61; font-size: 20px; }
.qspd-header p { margin: 0; color: #6b8092; }
.qspd-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 7px; max-width: 520px; }
.qspd-draft { flex-basis: 100%; padding: 7px 10px; border: 1px solid #dcbd78; border-radius: 8px; text-align: center; color: #6f5011; background: #fff8e7; font-size: 12px; font-weight: 850; letter-spacing: .02em; }
.qspd-evidence { display: grid; grid-template-columns: auto 1fr; gap: 12px; padding: 11px 13px; border: 1px solid #a9ccbf; border-radius: 9px; color: #315f55; background: #f2faf6; line-height: 1.55; }
.qspd-evidence strong { color: #1e6557; }
.qspd-meta { display: grid !important; grid-template-columns: repeat(4, minmax(150px, 1fr)) !important; gap: 0 !important; margin: 0 !important; border: 1px solid #d8e4ed; border-radius: 10px; overflow: hidden; background: #fbfdff; }
.qspd-meta > div { min-width: 0; padding: 10px 12px; border-right: 1px solid #e1eaf1; border-bottom: 1px solid #e1eaf1; }
.qspd-meta dt { margin-bottom: 4px; color: #688096; font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: .05em; }
.qspd-meta dd { margin: 0; overflow-wrap: anywhere; color: #163c5b; font-weight: 700; }
.qspd-summary-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.qspd-summary-grid article { min-height: 150px; max-height: 250px; overflow: auto; padding: 13px; border: 1px solid #d6e3ed; border-radius: 10px; background: #fbfdff; }
.qspd-summary-grid article:nth-child(2) { border-color: #c8d8ae; background: #fbfdf6; }
.qspd-summary-grid article:nth-child(3) { border-color: #d7cbe9; background: #fcfaff; }
.qspd h4 { margin: 0 0 9px; color: #173f5f; font-size: 15px; }
.qspd h5 { margin: 11px 0 4px; color: #245878; font-size: 13px; }
.qspd p { margin: 0 0 7px; line-height: 1.55; }
.qspd ul { margin: 5px 0 8px; padding-left: 19px; }
.qspd li { margin: 3px 0; line-height: 1.45; }
.qspd-block { min-width: 0; padding: 12px; border: 1px solid #d2e0ea; border-radius: 10px; background: #fff; }
.qspd-title { display: flex; align-items: flex-end; justify-content: space-between; gap: 12px; margin-bottom: 8px; }
.qspd-title h4 { margin: 2px 0 0; }
.qspd-title > span { color: #71879a; font-size: 11px; }
.qspd-table { width: 100%; overflow: auto; border: 1px solid #dce6ed; border-radius: 8px; }
.qspd-table table { min-width: 980px; }
.qspd-table.risk table { min-width: 1180px; }
.qspd-table th { position: static; white-space: normal; }
.qspd-table td { line-height: 1.45; }
.qspd-table td > span { display: block; margin-top: 4px; color: #6d8295; font-size: 11px; }
.qspd-table td .qspd-status { display: inline-flex; }
.qspd-table .mono { overflow-wrap: anywhere; font-family: Consolas, "Cascadia Mono", monospace; }
.qspd-stat-grid { display: grid; grid-template-columns: repeat(4, minmax(110px, 1fr)); gap: 8px; }
.qspd-stat-grid > div { display: grid; gap: 2px; padding: 10px 12px; border: 1px solid #d8e5ed; border-radius: 8px; background: #f7fbfd; }
.qspd-stat-grid strong { color: #174d70; font-size: 20px; }
.qspd-stat-grid span { color: #6d8395; font-size: 11px; }
.qspd-stat-grid .pending { border-color: #ead19b; background: #fff9e9; }
.qspd-stat-grid .pending strong { color: #8a6117; }
.qspd-stat-grid .risk { border-color: #e8bdc1; background: #fff7f7; }
.qspd-stat-grid .risk strong { color: #9a3038; }
.qspd-activity { display: grid; gap: 10px; }
.qspd-activity-list { display: grid; gap: 6px; margin: 0 !important; padding: 0 !important; list-style: none; }
.qspd-activity-list li { display: grid; grid-template-columns: minmax(110px, .55fr) minmax(260px, 2fr) auto; align-items: center; gap: 10px; margin: 0; padding: 8px 10px; border: 1px solid #e0e9f0; border-radius: 8px; background: #fbfdff; }
.qspd-activity-date, .qspd-activity-main { display: grid; min-width: 0; gap: 2px; }
.qspd-activity-date span, .qspd-activity-main span { overflow: hidden; color: #708697; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.qspd-activity-main strong { overflow: hidden; color: #244b66; text-overflow: ellipsis; white-space: nowrap; }
.qspd-layer-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; padding-top: 2px; }
.qspd-layer-actions > span { margin-left: auto; color: #6d8395; font-size: 11px; }
.qspd-page { min-height: calc(100vh - 320px); }
.qspd-timeline-filters { display: grid; grid-template-columns: minmax(260px, 2fr) minmax(170px, 1fr) minmax(170px, 1fr) auto; align-items: end; gap: 9px; padding: 11px; border: 1px solid #d5e2eb; border-radius: 10px; background: #f8fbfd; }
.qspd-timeline-filters label { display: grid; gap: 4px; color: #557189; font-size: 11px; font-weight: 800; }
.qspd-filter-result { min-width: 112px; display: grid; gap: 1px; padding: 8px 10px; border-radius: 8px; color: #fff; background: #23796f; text-align: center; }
.qspd-filter-result strong { font-size: 18px; }
.qspd-filter-result span { font-size: 10px; }
.qspd-timeline-table { min-height: 520px; background: #fff; }
.qspd-timeline-table table { min-width: 1280px; }
.qspd-pagination { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 9px 11px; border: 1px solid #d9e5ed; border-radius: 9px; color: #61798c; background: #f8fbfd; font-size: 12px; }
.qspd-pagination > div { display: flex; gap: 7px; }
.qspd-risk-stats { margin-bottom: 1px; }
.qspd-status { display: inline-flex; align-items: center; width: fit-content; padding: 3px 7px; border-radius: 999px; color: #7a5a1c; background: #fff2cc; font-size: 10px; font-weight: 800; }
.qspd-status.ok { color: #17634f; background: #dff4ea; }
.qspd-status.danger { color: #8d2730; background: #fde5e6; }
.qspd-risk { display: inline-flex; min-width: 52px; justify-content: center; padding: 5px 8px; border-radius: 7px; color: #755717; background: #fff0c5; font-weight: 850; }
.qspd-risk.low { color: #17634f; background: #dff4ea; }
.qspd-risk.medium { color: #865810; background: #fff0c5; }
.qspd-risk.high { color: #8d2730; background: #fde0e2; }
.qspd-narrative { border: 1px solid #d4c9e5; border-radius: 10px; overflow: hidden; background: #fcfaff; }
.qspd-narrative summary { padding: 11px 13px; cursor: pointer; color: #554273; font-weight: 800; }
.qspd-narrative > div { max-height: 420px; overflow: auto; padding: 4px 14px 14px; }
.qspd-review-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.qspd-review-grid > section { min-height: 170px; padding: 13px; border: 1px solid #d7e3ec; border-radius: 10px; background: #fbfdff; }
.qspd-checklist, .qspd-history { display: grid; gap: 7px; margin: 0 !important; padding: 0 !important; list-style: none; }
.qspd-checklist li { display: grid; grid-template-columns: auto 1fr; align-items: center; gap: 8px; margin: 0; padding: 7px 8px; border-radius: 7px; background: #f1f6fa; }
.qspd-history li { display: grid; gap: 2px; margin: 0; padding: 8px; border-radius: 7px; background: #f1f6fa; }
.qspd-history li span, .qspd-history li.muted { color: #6d8396; font-size: 11px; }
.qspd-danger-zone { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 10px 12px; border: 1px solid #e9c7ca; border-radius: 10px; background: #fff8f8; }
.qspd-danger-zone > div { display: grid; gap: 2px; }
.qspd-danger-zone span { color: #87585c; font-size: 11px; }
@media (max-width: 1180px) { .qspd-meta { grid-template-columns: repeat(2, minmax(160px, 1fr)) !important; } .qspd-timeline-filters { grid-template-columns: repeat(2, minmax(190px, 1fr)); } }
@media (max-width: 1100px) { .qspd-header { display: grid; } .qspd-actions { justify-content: flex-start; max-width: none; } .qspd-review-grid { grid-template-columns: 1fr; } .qspd-summary-grid { grid-template-columns: 1fr; } .qspd-summary-grid article { min-height: 130px; } }
@media (max-width: 850px) { .qspd-stat-grid { grid-template-columns: repeat(2, minmax(120px, 1fr)); } .qspd-activity-list li { grid-template-columns: 1fr auto; } .qspd-activity-main { grid-column: 1 / -1; grid-row: 2; } .qspd-layer-actions > span { flex-basis: 100%; margin-left: 0; } }
@media (max-width: 700px) { .qspd-meta { grid-template-columns: 1fr !important; } .qspd-evidence { grid-template-columns: 1fr; } .qspd-danger-zone { align-items: stretch; flex-direction: column; } }
