.changes-panel{margin:16px 0;padding:14px 18px;min-width:0}
.changes-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.changes-heading h2{margin:0;font-size:18px}.changes-heading p{margin:4px 0 0}
.changes-controls{display:flex;align-items:end;gap:8px;flex-wrap:wrap}.changes-controls label{display:grid;gap:4px;font-size:11px;color:var(--muted,#a8b8b8)}
.changes-controls select,.changes-controls button{min-height:36px}.changes-panel p{overflow-wrap:anywhere}
.changes-summary{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0}.changes-summary span{padding:7px 10px;background:#182727;border:1px solid #304444;border-radius:7px;font-size:12px}
.changes-summary strong{color:#75edc6;margin-right:5px}.changes-panel details>summary{cursor:pointer;padding:8px 0;color:#c7d8d6}
.changes-list{display:grid;gap:8px;margin:8px 0}.change-row{display:grid;grid-template-columns:155px minmax(0,1fr) auto;gap:12px;padding:12px;background:#121f20;border:1px solid #2b3b3e;border-radius:8px}
.change-row h3{font-size:14px;margin:0 0 5px;overflow-wrap:anywhere}.change-row p{margin:4px 0;font-size:12px;color:#b6c9c7}.change-kind{font-size:12px;color:#75edc6}.change-row[data-kind=quiet] .change-kind,.change-row[data-kind=uncertain] .change-kind{color:#d6bf8c}
.change-actions{display:flex;gap:6px;align-items:start;flex-wrap:wrap}.change-actions button{font-size:12px;padding:7px 10px;min-height:34px}
#changes-status{margin:8px 0;font-size:12px;color:#c1d1d0}#changes-status[data-warning=true]{color:#e2c38e}#changes-scope{font-size:12px;color:#a7bdbb}
.changes-note{font-size:12px;color:#a7bdbb}.changes-panel [hidden]{display:none!important}
@media(max-width:680px){.changes-panel{padding:12px;margin:12px 0}.changes-heading{align-items:start}.changes-controls{width:100%}.change-row{grid-template-columns:minmax(0,1fr);gap:6px}.change-actions{justify-content:start}.changes-summary{display:grid;grid-template-columns:1fr 1fr}.changes-summary span{padding:7px;font-size:11px}}

.changes-controls input,.changes-controls select{max-width:100%;min-width:0;min-height:36px}.changes-controls label{max-width:100%}.changes-controls{align-items:end}.changes-heading>div:first-child{flex-basis:100%}
@media(max-width:680px){.changes-controls label{flex:1 1 160px}.changes-controls label:has(input[type=datetime-local]){flex-basis:100%}.changes-controls input,.changes-controls select{width:100%}}