.cl-dialog {color:var(--text);background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:20px;margin:auto;width:min(640px,calc(100vw - 32px));max-height:85vh;overflow:auto;box-sizing:border-box;}
.cl-dialog::backdrop {background:rgba(0,0,0,.55);}
.cl-dialog header {display:flex;justify-content:space-between;align-items:center;gap:12px;}
.cl-dialog h2 {font-size:20px;}
.cl-dialog button {color:var(--text);background:var(--surface2);border:1px solid var(--border);border-radius:6px;padding:8px 12px;cursor:pointer;font:inherit;}
.cl-dialog button:disabled {opacity:.5;cursor:wait;}
.cl-dialog :focus-visible {outline:2px solid var(--accent);outline-offset:2px;}
.cl-dialog textarea,.cl-dialog input,.cl-dialog select {display:block;width:100%;box-sizing:border-box;border:1px solid var(--border);background:var(--surface2);color:var(--text);border-radius:6px;padding:8px;font:inherit;}
.cl-dialog label {display:block;margin:12px 0;}
.cl-dialog fieldset {min-width:0;border:1px solid var(--border);border-radius:6px;margin:12px 0;padding:12px;}
.cl-dialog legend {max-width:100%;overflow-wrap:anywhere;}
.cl-dialog p,.cl-dialog small {overflow-wrap:anywhere;}
.cl-dialog [role=alert] {color:var(--red);}
.cl-dialog a {color:var(--accent);}
.cl-feedback-list article {border-top:1px solid var(--border);padding:16px 0;}
.cl-feedback-list small {display:block;color:var(--text2);margin:4px 0;}
.cl-state {font-size:12px;border:1px solid var(--border);padding:2px 6px;border-radius:4px;}
.cl-verbatim {white-space:pre-wrap;}
.cl-timeline {width:min(820px,calc(100vw - 32px));}
.cl-timeline section {border-top:1px solid var(--border);margin-top:20px;padding-top:8px;}
.cl-checkin-card {padding:16px;border:1px solid var(--border);border-radius:8px;margin:12px 0;}
.cl-checkpoints {display:flex;flex-wrap:wrap;gap:12px;margin:12px 0;}
.cl-checkpoints article {flex:1;min-width:180px;border:1px solid var(--border);padding:10px;border-radius:6px;}
.cl-observation {border:1px solid var(--border);border-radius:6px;padding:12px;margin:12px 0;}
.cl-metrics {display:grid;grid-template-columns:minmax(70px,1fr) minmax(0,2fr);gap:6px;}
.cl-metrics dd {margin:0;overflow-wrap:anywhere;}
.cl-metric-input {border-bottom:1px solid var(--border);padding:4px 0;}
.cq-toolbar {display:flex;align-items:center;flex-wrap:wrap;gap:10px;margin:12px 0;}
.cq-toolbar h2 {margin-right:auto;}
.cq-toolbar [aria-pressed=true] {background:var(--accent);color:var(--bg);}
.cq-filters {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:18px 0;}
.cq-filters label {display:grid;gap:6px;}
.cq-filters input,.cq-filters select {width:100%;min-width:0;background:var(--surface);color:var(--text);border:1px solid var(--border);border-radius:6px;padding:8px;}
.cq-card {display:flex;flex-wrap:wrap;align-items:start;justify-content:space-between;gap:16px;}
.cq-card > div {flex:1;min-width:0;overflow-wrap:anywhere;}
.cq-card > button {flex-shrink:0;}
.cq-card > details {width:100%;min-width:0;overflow-wrap:anywhere;}
.cq-card summary {cursor:pointer;}
.cq-card h3 {margin:0 0 6px;}
.cq-card p {margin:6px 0;}
.cq-note {display:block;color:var(--text2);font-size:12px;overflow-wrap:anywhere;}
.cq-empty {padding:32px 16px;border:1px dashed var(--border);border-radius:8px;color:var(--text2);}
.cq-comparison {width:100%;table-layout:fixed;margin:12px 0 20px;border-collapse:collapse;}
.cq-comparison th,.cq-comparison td {padding:8px;border-bottom:1px solid var(--border);text-align:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
@media(max-width:600px){.cq-filters{grid-template-columns:1fr}.cq-card{flex-direction:column}.cq-card>button{min-height:44px}.cq-toolbar button{min-height:44px}}
.cl-dialog input[type=checkbox] {width:auto;display:inline-block;margin-left:8px;}
.rc-why {margin:0 0 20px;border-left:3px solid var(--accent);padding:4px 0 4px 14px;display:flex;align-items:start;gap:12px;}
.rc-why .rc-why-label {margin:0 0 6px;font-size:12px;color:var(--text2);}
.rc-why blockquote {margin:0;font-style:italic;line-height:1.5;overflow-wrap:anywhere;}
.rc-why > div {flex:1;min-width:0;}
.rc-feedback {font:inherit;font-size:22px;background:var(--surface);color:var(--text);border:1px solid var(--border);border-radius:6px;cursor:pointer;padding:4px 10px;}

.cq-comparison .cq-note{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cq-table-scroll{max-width:100%;min-width:0;overflow-x:auto;overscroll-behavior-x:contain}
.cq-table-scroll:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
.cq-comparison{min-width:560px}

/* Retention evidence stays readable in both shells without changing table rules. */
.retention-dialog{width:min(860px,94vw)}
.retention-body{display:flex;flex-direction:column;gap:12px;padding:16px;min-width:0}
.retention-body section,.retention-evidence{border:1px solid var(--border,#7776);border-radius:8px;padding:12px;min-width:0}
.retention-body img{max-width:100%;height:auto;max-height:70vh;object-fit:contain}
.retention-body label{display:flex;align-items:center;gap:8px}
.retention-body input:not([type=checkbox]),.retention-body select{max-width:100%;padding:8px;border:1px solid var(--border,#7776);border-radius:6px;color:inherit;background:transparent}
.retention-body p,.retention-body li{white-space:normal;overflow-wrap:anywhere}
.retention-body small{display:block;opacity:.8}
.retention-actions{display:flex;flex-wrap:wrap;gap:8px}
.retention-review-text { white-space: pre-wrap; overflow-wrap: anywhere; max-height: 24rem; overflow: auto; }
.retention-history-image { max-width: 100%; max-height: 36rem; object-fit: contain; }