/* Task detail: summary first, comparable changes, secondary audit details. */
#detail{width:min(920px,calc(100vw - 48px));max-height:92dvh;border:1px solid #d8dce1;border-radius:8px;box-shadow:0 24px 80px #10182026;color:#20252b}
#detail::backdrop{background:#17212e66}
#detail .dialog-head{position:sticky;top:0;z-index:2;background:#fff;padding:20px 28px;border-bottom:1px solid #e4e7eb;align-items:flex-start}
#detail .dialog-head h2{font-size:19px;line-height:1.5;padding-top:3px;overflow-wrap:anywhere}
#close-detail{flex:none;font-size:13px;padding:6px 13px;border-color:#d5d9df;border-radius:5px}
#detail-body{padding:24px 28px 28px;font-size:14px;line-height:1.7}
#detail-body h3{font-size:14px;line-height:1.5;margin:0 0 10px;font-weight:650}
#detail-body h4{font-size:14px;line-height:1.6}
#detail-body>section:not(.task-summary):not(.task-requirements){margin:24px 0}
.task-meta{display:flex;align-items:center;gap:12px;flex-wrap:wrap;font-size:12px;color:#525b66;margin-bottom:24px}
.task-meta .badge{border-radius:4px;padding:3px 9px;color:#252a30;background:#f1f3f5;border-color:#d8dde2;font-weight:600}
.task-meta .badge[data-status="done"]::before{content:'✓';margin-right:6px}
.task-permission{margin-left:auto}
#detail .task-summary{padding:0;margin:0 0 24px;border:0;background:none}
#detail .result-heading{justify-content:flex-start;flex-direction:row;align-items:center;gap:10px;margin-bottom:12px}
#detail .result-heading h3{margin:0;font-size:16px}
#detail .result-heading .badge{border:0;background:#f0f2f4;color:#57606b;border-radius:4px;font-size:11px}
#detail .result-overview{margin:0 0 20px;font-size:14px;line-height:1.85;color:#414a55}
#detail .change-card{margin:14px 0 0;padding:0;border:1px solid #dde2e7;border-radius:6px;overflow:hidden}
#detail .change-card h4{margin:0;padding:12px 16px;background:#f7f8fa;border-bottom:1px solid #e3e7eb;font-size:13px;font-weight:650}
#detail .change-card dl{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
#detail .change-card dl>div{display:block;min-width:0;padding:16px 18px}
#detail .change-card dt{font-size:11px;color:#69727d;margin-bottom:8px}
#detail .change-card dd{font-size:14px;line-height:1.75;margin:0;overflow-wrap:anywhere}
#detail .change-before{background:#fafbfc;color:#68717b}
#detail .change-after{border-left:1px solid #e3e7eb;color:#202a36}
#detail .change-after dt{color:#253b52;font-weight:600}
.result-next{margin-top:18px;border-left:2px solid #b4beca;padding:2px 0 2px 14px;color:#505b68;font-size:13px}
.result-next strong{font-size:12px;color:#283440}
#detail .result-next p{margin:3px 0 0}
#detail .result-links{gap:10px;margin:18px 0 12px}
#detail .result-links:empty{display:none}
#detail .result-links a,#detail .result-links button{display:inline-flex;align-items:center;padding:7px 11px;border:1px solid #d7dde3;border-radius:5px;background:white;color:#26394d;font-size:12px;line-height:1.5;text-decoration:none;overflow-wrap:anywhere;max-width:100%}
#detail .result-links a:hover,#detail .result-links button:hover{background:#f3f5f7;border-color:#a4b0be}
#detail a:focus-visible,#detail summary:focus-visible{outline:2px solid #183e68;outline-offset:3px}
#detail .task-summary>.muted{font-size:11px;color:#67717e}
.task-requirements{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px 28px;margin:24px 0;padding:22px 0;border-top:1px solid #e2e6ea;border-bottom:1px solid #e2e6ea}
#detail .task-requirements h3{font-size:12px;color:#596370;margin-bottom:7px}
#detail .task-requirements p{font-size:13px;margin:0}
.requirement-note{grid-column:1/-1}
.detail-fold{border-bottom:1px solid #e2e6ea;margin:0}
.detail-fold>summary{display:flex;align-items:center;gap:9px;cursor:pointer;list-style:none;padding:16px 0;font-size:13px;font-weight:600}
.detail-fold>summary::-webkit-details-marker{display:none}
.detail-fold>summary::before{content:'›';font-size:18px;font-weight:400;line-height:1;width:12px;text-align:center;color:#69737f;transform-origin:center}
.detail-fold[open]>summary::before{transform:rotate(90deg)}
.detail-fold>summary>span{font-size:11px;font-weight:400;color:#6b7480;margin-left:auto}
.fold-content{padding:0 0 18px 21px;min-width:0;overflow-wrap:anywhere}
#detail .fold-content.history{margin:0;border:0;padding-top:0}
.evidence-list>article{padding:12px 0;border-top:1px solid #eceef1}
.evidence-list>article:first-child{border:0;padding-top:0}
.evidence-list button{font-size:12px;text-align:left;overflow-wrap:anywhere;max-width:100%}
.evidence-list small{display:block;color:#6b7480;font-size:11px;margin-top:6px}
#detail .technical-proof{margin:6px 0 0;font-size:11px}
#detail .actions{margin:20px 0;gap:8px}
#detail .actions:empty{display:none}
#detail .actions button{font-size:12px;border-color:#d5dbe2;border-radius:5px}
#detail .event{border-color:#d3dae2}
#detail .event>strong{font-size:13px}
#detail .event summary{font-size:12px;cursor:pointer}
#detail .fields{gap:4px 20px}
#detail .fields label{font-size:12px}
@media(max-width:600px){
 #detail{width:calc(100vw - 16px);max-height:96dvh;border-radius:6px}
 #detail .dialog-head{padding:16px;gap:12px}
 #detail .dialog-head h2{font-size:16px}
 #detail-body{padding:18px 16px 24px}
 .task-meta{gap:8px;margin-bottom:20px}
 .task-permission{margin-left:0}
 #detail .change-card dl,.task-requirements{grid-template-columns:minmax(0,1fr)}
 #detail .change-card dl>div{padding:12px 14px}
 #detail .change-after{border-left:0;border-top:1px solid #e3e7eb}
 #detail .change-card h4{padding:11px 14px}
 .task-requirements{gap:18px;padding:18px 0}
 .fold-content{padding-left:0}
}
