/* rehearse module styles — AG4. Linked, never injected: a script-created
   <style> is still a <style> to the CSP and style-src-elem 'self' would refuse
   it (see mod-watchlists.css for the same note and the same reason).

   Colour tokens only, and only the ones the five themes define for themselves:
   --dim for secondary text (5.62 to 6.91 across the themes — --dim2 is the
   hairline token and fails 4.5:1 on every one of them), --warn for a named
   absence, --pos for a satisfied condition. Every control here carries the
   24x24 floor WCAG 2.2 2.5.8 asks for, stated rather than inherited, because
   the two findings AG1 shipped were both controls that had never been
   measured. */
.rh-card { background:var(--card,var(--bg)); border:1px solid var(--line); padding:14px; margin-top:14px; }
  .rh-title { font-size:12px; font-weight:700; letter-spacing:1.2px; text-transform:uppercase; }
  .rh-sub { font-size:11px; color:var(--dim); margin:6px 0 10px; line-height:1.6; }
  .rh-row { display:flex; gap:8px; align-items:center; flex-wrap:wrap; }
  .rh-row select, .rh-row input { background:var(--panel); border:1px solid var(--line); color:var(--fg);
    font-family:inherit; font-size:12px; padding:6px 8px; min-height:28px; }
  .rh-row input { width:130px; text-transform:uppercase; }
  .rh-btn { background:none; border:1px solid var(--line); color:var(--fg); cursor:pointer;
    font-family:inherit; font-size:11px; padding:6px 12px; min-width:24px; min-height:28px; }
  .rh-btn:hover { border-color:var(--fg); }
  .rh-btn[disabled] { color:var(--dim); cursor:progress; }
  .rh-btn--go { border-color:var(--accent); }

  .rh-badge-row { display:flex; gap:8px; align-items:baseline; flex-wrap:wrap; margin-top:12px; }
  .rh-note { font-size:10px; color:var(--dim); line-height:1.6; flex:1; min-width:200px; }
  .rh-assembled { margin-top:8px; }
  .rh-line { font-size:11px; color:var(--fg); line-height:1.6; margin-top:4px; }
  .rh-dim { color:var(--dim); }
  .rh-warn { color:var(--warn); }
  .rh-ok { color:var(--pos); }
  .rh-refused { font-size:11px; color:var(--warn); line-height:1.6; border:1px dashed var(--warn);
    padding:10px; margin-top:12px; }

  .rh-split { font-size:11px; color:var(--dim); line-height:1.6; margin:12px 0 6px;
    border-top:1px solid var(--line); padding-top:10px; }
  /* The two segments are laid out side by side and NEVER summed. The gap
     between them is deliberate: AF2 gave WalkForward no combined summary, and
     a layout that ran the two into one block would invite one back. */
  .rh-segs { display:flex; gap:14px; flex-wrap:wrap; }
  .rh-seg { flex:1; min-width:240px; }
  .rh-seg-h { font-size:11px; font-weight:700; letter-spacing:1px; text-transform:uppercase;
    margin-top:10px; }
  .rh-seg-sub { font-size:10px; color:var(--dim); margin-top:2px; }
  .rh-tbl { width:100%; border-collapse:collapse; font-size:11px; margin-top:6px; }
  .rh-tbl td { padding:4px 6px; border-bottom:1px solid var(--line);
    font-variant-numeric:tabular-nums; }
  .rh-tbl td.num { text-align:right; }
  .rh-overfit { margin-top:12px; border-top:1px solid var(--line); padding-top:10px; }

  .rh-sweep { margin-top:14px; border-top:1px solid var(--line); padding-top:10px; }
  .rh-axis { margin-top:10px; }
  .rh-axis-h { font-size:11px; font-weight:700; }
  /* The author's own setting is MARKED, not ranked. There is deliberately no
     rule here that colours a cell by how it scored: a grid that shades its
     best cell green has recommended one, which is the thing AF4 refuses to
     do. */
  .rh-grid tr.rh-centre td { border-left:2px solid var(--accent); }
  .rh-tag { font-size:9px; letter-spacing:.5px; text-transform:uppercase; color:var(--dim); }
  .rh-ladder:not(:empty) { margin-top:14px; border-top:1px solid var(--line); padding-top:10px; }

  @media (max-width: 640px) {
    .rh-row select, .rh-row input, .rh-btn { flex:1 1 100%; }
    .rh-row input { width:auto; }
  }