/* Claude vs Rules page and Paper-book badges (ai-review.js). Uses the app's theme variables. */
.cvr-tab{position:fixed;right:0;top:calc(50% + 90px);z-index:44;writing-mode:vertical-rl;padding:12px 7px;border:1px solid var(--line-2);border-right:0;
  border-radius:var(--radius-sm) 0 0 var(--radius-sm);background:var(--surface-2);color:var(--ink-2);font:500 12.5px var(--font-ui);letter-spacing:.04em;cursor:pointer}
.cvr-tab:hover{color:var(--accent);border-color:var(--accent)}
.cvr{position:fixed;inset:0;z-index:46;background:var(--bg);overflow-y:auto;display:none;font:14px/1.5 var(--font-ui);color:var(--ink)}
.cvr.open{display:block}
.cvr-in{max-width:1180px;margin:0 auto;padding:20px max(16px,env(safe-area-inset-right,0px)) 60px max(16px,env(safe-area-inset-left,0px));display:flex;flex-direction:column;gap:18px}
.cvr-head{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.cvr-head h2{font:600 24px var(--font-display);margin:0;flex:1;min-width:220px}
.cvr-head small{display:block;color:var(--muted);font:12.5px var(--font-ui)}
.cvr-btn{background:none;border:1px solid var(--line-2);color:var(--ink-2);border-radius:var(--radius-sm);padding:5px 10px;font:12.5px var(--font-ui);cursor:pointer}
.cvr-btn:hover{color:var(--ink);border-color:var(--ink-2)}
.cvr-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:10px}
.cvr-card{background:var(--surface);border:1px solid var(--line-2);border-radius:var(--radius);padding:10px 12px;display:flex;flex-direction:column;gap:2px;min-width:0}
.cvr-card small{color:var(--muted);font-size:12px}
.cvr-card b{font:600 21px var(--font-display);font-variant-numeric:tabular-nums}
.cvr-sec{background:var(--surface);border:1px solid var(--line-2);border-radius:var(--radius);padding:12px 14px;display:flex;flex-direction:column;gap:10px;min-width:0}
.cvr-sec h3{margin:0;font:600 15px var(--font-ui)}
.cvr-sec p{margin:0;color:var(--ink-2);font-size:13px;max-width:80ch}
.cvr-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:14px}
.cvr-tw{overflow-x:auto}
.cvr table{border-collapse:collapse;width:100%;font-size:12.8px;font-variant-numeric:tabular-nums}
.cvr th,.cvr td{padding:6px 8px;border-bottom:1px solid var(--line);text-align:right;white-space:nowrap;vertical-align:top}
.cvr th{color:var(--muted);font:500 11px var(--font-mono);text-transform:uppercase;letter-spacing:.04em}
.cvr th:first-child,.cvr td:first-child,.cvr td.l,.cvr th.l{text-align:left}
.cvr tr.rv{cursor:pointer}
.cvr tr.rv:hover td{background:var(--surface-2)}
.cvr tr.det td{background:var(--surface-2);white-space:normal;text-align:left}
.cvr .pos{color:var(--up-text)} .cvr .neg{color:var(--down-text)} .cvr .mut{color:var(--muted)}
.cvr-pill{display:inline-block;font:600 11px var(--font-mono);padding:1px 7px;border-radius:99px;border:1px solid currentColor;white-space:nowrap}
.v-take,.v-long,.v-hold{color:var(--up-text)} .v-skip,.v-avoid{color:var(--down-text)} .v-short{color:var(--serious)} .v-smaller{color:var(--warn)} .v-wait{color:var(--muted)}
.cvr-det{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:14px;padding:6px 2px}
.cvr-det h4{margin:0 0 4px;font:600 13px var(--font-ui)}
.cvr-det ul{margin:0;padding-left:18px;font-size:12.8px;display:flex;flex-direction:column;gap:3px}
.cvr-det a{color:var(--accent)}
.cvr-chips{display:flex;flex-wrap:wrap;gap:6px;font-size:12px}
.cvr-chips span{border:1px solid var(--line-2);border-radius:5px;padding:1px 7px;background:var(--surface)}
.cvr svg{width:100%;height:auto;display:block}
.cvr-note{color:var(--muted);font-size:12px}
.cvr-badge{margin-left:8px;font:600 10.5px var(--font-mono);padding:1px 6px;border-radius:99px;border:1px solid currentColor;cursor:pointer;white-space:nowrap;vertical-align:middle}
.cvr input[type=date]{background:var(--surface-2);color:var(--ink);border:1px solid var(--line-2);border-radius:var(--radius-sm);padding:3px 6px;font:12.5px var(--font-ui)}
