/* Coordinator test page (.cot-*). Layout only: colours, sizes and radii come from tokens and the shared components. */
.st-page.cot-page [hidden] { display: none; }
.cot-text { font-size: var(--text-base); line-height: 1.7; color: var(--color-text-secondary); }
.cot-facts { list-style: disc; display: grid; gap: var(--space-2); padding-left: var(--space-5); margin: var(--space-4) 0; color: var(--color-text-secondary); line-height: 1.6; }
.cot-actions { display: flex; flex-wrap: wrap; gap: var(--space-3); margin-top: var(--space-4); }
.cot-error.is-visible { display: block; }
.cot-score { font-size: var(--text-h3); font-weight: 700; color: var(--color-text); margin: var(--space-3) 0; }
.cot-progress { display: grid; gap: var(--space-2); margin-bottom: var(--space-4); }
.cot-progress-text { font-size: var(--text-sm); font-weight: 600; color: var(--color-text-secondary); }
.cot-bar { width: 100%; height: var(--space-2); accent-color: var(--color-primary); }
.cot-question { line-height: 1.4; margin-bottom: var(--space-4); }
.cot-options { display: grid; gap: var(--space-3); }
.cot-option { display: flex; align-items: flex-start; gap: var(--space-3); padding: var(--space-4); min-height: var(--space-9); border: 1px solid var(--color-border); border-radius: var(--radius-form); background: var(--pt-field); cursor: pointer; }
.cot-option:hover { border-color: var(--color-border-strong); }
.cot-option.is-selected { border-color: var(--color-primary); }
.cot-option input { margin-top: var(--space-1); accent-color: var(--color-primary); flex-shrink: 0; }
.cot-option span { font-size: var(--text-base); line-height: 1.5; color: var(--color-text); }
.cot-code { font-size: var(--text-h2); font-weight: 700; letter-spacing: 0.08em; text-align: center; padding: var(--space-5) var(--space-4); margin: var(--space-4) 0; border: 1px dashed var(--color-border-strong); border-radius: var(--radius-form); background: var(--pt-field); color: var(--color-text); overflow-wrap: anywhere; user-select: all; }
.cot-note { min-height: var(--space-5); margin-top: var(--space-3); font-size: var(--text-sm); color: var(--color-text-secondary); }
.cot-note:empty { min-height: 0; margin-top: 0; }
@media (max-width: 480px) { .cot-actions .btn { flex: 1 1 100%; } .cot-code { font-size: var(--text-xl); } }
.cot-brand { display: inline-flex; align-self: start; justify-self: start; }
.cot-brand img { display: block; height: var(--space-5); width: auto; }