/* Collaborating-physician screens (Supervision area): My reviews, one review, one chart, the supervisor's overview. Colors come from the theme tokens, so light and dark follow; meaning is always in words too. */
.cp-alert { border: 1px solid var(--color-danger-text); background: var(--color-danger-bg, var(--color-surface-2)); color: var(--color-danger-text); border-radius: var(--radius-md); padding: var(--space-3); margin: 0 0 var(--space-4); }
.cp-bar { width: 100%; max-width: 28rem; height: .7rem; accent-color: var(--color-accent); margin: .25rem 0 var(--space-3); }
.cp-notes { white-space: pre-wrap; overflow-wrap: anywhere; margin: .25rem 0 0; }
.cp-statement { border-left: 3px solid var(--color-accent); padding-left: var(--space-3); margin: 0 0 var(--space-3); }
.cp-viewonly { border: 1px solid var(--color-border); background: var(--color-surface-2); border-radius: var(--radius-md); padding: var(--space-3); margin: 0 0 var(--space-4); }
.cp-lines { display: grid; gap: var(--space-3); margin: 0; }
.cp-lines > div { display: grid; grid-template-columns: minmax(0, 1fr); gap: .15rem; }
.cp-lines dt { font-weight: 600; overflow-wrap: anywhere; }
.cp-lines dd { margin: 0; white-space: pre-wrap; overflow-wrap: anywhere; }
@media (min-width: 48rem) { .cp-lines > div { grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); gap: var(--space-4); } }
.cp-choices { border: 1px solid var(--color-border); border-radius: var(--radius-md); padding: var(--space-3); margin: 0 0 var(--space-3); display: grid; gap: var(--space-3); }
.cp-choices legend { padding: 0 .4rem; font-weight: 600; }
.cp-choice { display: grid; gap: .1rem; }
.cp-choice label, .cp-check { display: flex; gap: .5rem; align-items: center; }
.cp-choice input, .cp-check input { width: 1.2rem; height: 1.2rem; flex: 0 0 auto; }
.cp-page textarea { width: 100%; max-width: 100%; min-height: 8rem; font: inherit; color: inherit; background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--radius-md); padding: var(--space-2); }
.cp-page textarea:focus-visible, .cp-page input:focus-visible { outline: 3px solid var(--color-focus); outline-offset: 2px; }
.cp-tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr)); gap: var(--space-3); }
.cp-tiles > div { border: 1px solid var(--color-border); border-radius: var(--radius-md); padding: var(--space-3); display: grid; gap: .2rem; }
.cp-tiles dd { font-size: 1.6rem; font-weight: 700; margin: 0; }
.cp-page .rt-actions { display: flex; flex-wrap: wrap; gap: .6rem .8rem; align-items: flex-end; }
.cp-page .pager { align-items: center; }
.cp-page .facts .code, .cp-page .data-table .code { white-space: normal; overflow-wrap: anywhere; word-break: break-all; }       /* a SHA-256 is sixty-four characters: it wraps rather than pushing the page sideways */