/* Administration → Content review (Pages/Admin/ContentReview/*) and the owner's review banner (Shared/ModerationBanner) */
.cr {
    --cr-line: var(--rz-border-color, #E2E6EC);
    --cr-muted: var(--rz-text-secondary-color, #4B5565);
    --cr-card: var(--rz-base-background-color, #fff);
    --cr-ok: #1E6B3A; --cr-ok-bg: #E6F6EE; --cr-ok-line: #7CC4A0;
    --cr-warn: #8A4B08; --cr-warn-bg: #FFF4DE; --cr-warn-line: #EBB75B;
    --cr-bad: #9B1C1C; --cr-bad-bg: #FDECEC; --cr-bad-line: #E9A1A1;
    padding: 1rem; display: flex; flex-direction: column; gap: 1rem; max-width: 1480px;
}
.cr__head { display: flex; justify-content: space-between; align-items: flex-end; gap: 1rem; flex-wrap: wrap; }
.cr__head h1 { font-size: 1.5rem; margin: 0; }
.cr__head-side { display: flex; flex-wrap: wrap; gap: 0.5rem; align-items: center; }
.cr__crumb { font-size: 0.78rem; color: var(--cr-muted); }
.cr__muted { color: var(--cr-muted); margin: 0; }
.cr__small { font-size: 0.8rem; }
.cr__gap { flex: 1; }
.cr__problem { color: var(--cr-bad); margin: 0; }
.cr-sr { position: absolute; left: -9999px; }
.cr-label { display: block; font-size: 0.72rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.04em; color: var(--cr-muted); margin: 0.25rem 0; }
.cr-link { background: none; border: 0; padding: 0; color: var(--rz-primary); cursor: pointer; font: inherit; font-size: 0.85rem; text-align: left; }
.cr-link:hover { text-decoration: underline; }
.cr-empty { padding: 2rem; text-align: center; color: var(--cr-muted); }
.cr-note { padding: 0.6rem 0.9rem; border: 1px solid #B6D4F2; background: #EEF5FC; border-radius: 6px; font-size: 0.88rem; }
.cr-note--warn { border-color: var(--cr-warn-line); background: var(--cr-warn-bg); }
.cr-grid2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
@media (max-width: 900px) { .cr-grid2 { grid-template-columns: 1fr; } }

/* Tones: words and colour (states differ by text too) */
.cr-tone--ok { color: var(--cr-ok); }
.cr-tone--warn { color: var(--cr-warn); }
.cr-tone--bad { color: var(--cr-bad); }
.cr-fill--ok, .cr-bar__fill.cr-fill--ok { background: #3D8B57; }
.cr-fill--warn, .cr-bar__fill.cr-fill--warn { background: #C46A1C; }
.cr-fill--bad, .cr-bar__fill.cr-fill--bad { background: #C23B34; }
.cr-tag { display: inline-flex; align-items: center; min-height: 1.4rem; padding: 0.05rem 0.6rem; border-radius: 999px; font-size: 0.76rem; font-weight: 500; border: 1px solid #C9D0D9; background: #F4F6F8; color: #2B3440; white-space: nowrap; }
.cr-tag--ok { border-color: var(--cr-ok-line); background: var(--cr-ok-bg); color: var(--cr-ok); }
.cr-tag--warn { border-color: var(--cr-warn-line); background: var(--cr-warn-bg); color: var(--cr-warn); }
.cr-tag--bad { border-color: var(--cr-bad-line); background: var(--cr-bad-bg); color: var(--cr-bad); }
.cr-pill { display: inline-flex; align-items: center; gap: 0.5rem; font-size: 0.82rem; padding: 0.3rem 0.75rem; border-radius: 999px; border: 1px solid; }
.cr-pill--ok { background: var(--cr-ok-bg); color: var(--cr-ok); border-color: var(--cr-ok-line); }
.cr-pill--bad { background: var(--cr-bad-bg); color: var(--cr-bad); border-color: var(--cr-bad-line); }
.cr-pill__dot { width: 8px; height: 8px; border-radius: 999px; background: currentColor; }

/* Cards and numbers */
.cr-card { border: 1px solid var(--cr-line); border-radius: 6px; background: var(--cr-card); padding: 1rem; display: flex; flex-direction: column; gap: 0.75rem; min-width: 0; }
.cr-card h2, .cr-card h3 { font-size: 1rem; margin: 0; }
.cr-card--warn { background: var(--cr-warn-bg); border-color: var(--cr-warn-line); }
.cr-card--warn h2 { color: var(--cr-warn); font-size: 0.9rem; }
.cr-card--warn p { margin: 0; font-size: 0.85rem; }
.cr-card__head { display: flex; justify-content: space-between; align-items: center; gap: 0.75rem; flex-wrap: wrap; }
.cr-kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 1rem; }
.cr-kpi { border: 1px solid var(--cr-line); border-radius: 6px; background: var(--cr-card); padding: 0.9rem 1rem; display: flex; flex-direction: column; gap: 0.15rem; }
.cr-kpi--warn { border-color: var(--cr-warn-line); }
.cr-kpi__label, .cr-kpi__sub { font-size: 0.78rem; color: var(--cr-muted); }
.cr-kpi__value { font-size: 1.75rem; line-height: 2.2rem; font-weight: 600; }
.cr-kpi__value--ok { color: var(--cr-ok); }
.cr-kpi__value--warn { color: var(--cr-warn); }
.cr-kpi__value--bad { color: var(--cr-bad); }

/* List + side */
.cr-main { display: flex; flex-wrap: wrap; gap: 1rem; align-items: flex-start; }
.cr-list { flex: 999 1 720px; padding: 0; gap: 0; }
.cr-side { flex: 1 1 290px; min-width: 0; display: flex; flex-direction: column; gap: 1rem; }
.cr-list__bar { display: flex; justify-content: space-between; align-items: center; gap: 1rem; flex-wrap: wrap; padding: 0.75rem 1rem; border-bottom: 1px solid var(--cr-line); }
.cr-list__foot { padding: 0.75rem 1rem; }
.cr-table { overflow-x: auto; }
.cr-row { display: grid; grid-template-columns: minmax(230px, 2.6fr) 82px repeat(4, 74px) 52px minmax(150px, 1.3fr) 82px; align-items: center; gap: 0.25rem; padding: 0.55rem 1rem; border-bottom: 1px solid var(--cr-line); min-width: 980px; font-size: 0.88rem; }
.cr-row--head { font-size: 0.74rem; font-weight: 600; color: var(--cr-muted); padding-top: 0.45rem; padding-bottom: 0.45rem; }
.cr-row:not(.cr-row--head):hover { background: #F7F9FB; }
.cr-ad { display: flex; align-items: center; gap: 0.75rem; min-width: 0; }
.cr-ad__text { display: flex; flex-direction: column; min-width: 0; }
.cr-ad__text b { font-weight: 500; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cr-thumb { width: 56px; height: 40px; flex: none; border-radius: 4px; object-fit: cover; background: #E2E4E9; }
.cr-thumb--hidden { filter: blur(8px); }
.cr-thumb--none { display: inline-flex; align-items: center; justify-content: center; font-size: 0.62rem; color: var(--cr-muted); }
.cr-score { display: flex; flex-direction: column; gap: 0.2rem; width: 62px; }
.cr-score__value { font-size: 0.82rem; font-weight: 600; }
.cr-bar { display: block; height: 4px; border-radius: 999px; background: #E2E4E9; overflow: hidden; }
.cr-bar--thick { height: 6px; }
.cr-bar__fill { display: block; height: 100%; border-radius: 999px; background: #2A6480; }
.cr-risk { font-size: 1rem; font-weight: 700; }
.cr-reason { display: flex; flex-direction: column; gap: 0.25rem; }
.cr-reason__line { display: flex; justify-content: space-between; gap: 0.5rem; font-size: 0.84rem; }
.cr-model { display: flex; justify-content: space-between; align-items: center; gap: 0.5rem; font-size: 0.84rem; }

/* One check */
.cr-detail { display: flex; flex-direction: column; gap: 1rem; }
.cr-detail__head { display: flex; justify-content: space-between; align-items: flex-end; gap: 1rem; flex-wrap: wrap; }
.cr-detail__head > div { display: flex; flex-direction: column; gap: 0.35rem; }
.cr-detail__title { display: flex; align-items: center; gap: 0.75rem; flex-wrap: wrap; }
.cr-detail__title h2 { font-size: 1.4rem; margin: 0; }
.cr-detail__grid { display: grid; grid-template-columns: minmax(250px, 300px) minmax(0, 1fr) minmax(260px, 320px); gap: 1rem; align-items: start; }
@media (max-width: 1100px) { .cr-detail__grid { grid-template-columns: 1fr; } }
.cr-detail__side { display: flex; flex-direction: column; gap: 1rem; min-width: 0; }
.cr-detail__models { border-top: 1px solid var(--cr-line); padding-top: 0.6rem; }
.cr-verdict { display: flex; align-items: center; gap: 0.9rem; padding: 0.75rem; border-radius: 6px; font-size: 0.84rem; line-height: 1.35; }
.cr-verdict--ok { background: var(--cr-ok-bg); }
.cr-verdict--warn { background: var(--cr-warn-bg); }
.cr-verdict--bad { background: var(--cr-bad-bg); }
.cr-verdict__ring { flex: none; width: 3.5rem; height: 3.5rem; border-radius: 999px; border: 5px solid currentColor; display: inline-flex; align-items: center; justify-content: center; font-weight: 700; font-size: 1.15rem; }
.cr-verdict--ok .cr-verdict__ring { color: var(--cr-ok); }
.cr-verdict--warn .cr-verdict__ring { color: var(--cr-warn); }
.cr-verdict--bad .cr-verdict__ring { color: var(--cr-bad); }
.cr-cat { display: flex; flex-direction: column; gap: 0.25rem; }
.cr-cat__line { display: flex; justify-content: space-between; font-size: 0.88rem; font-weight: 600; }
.cr-legend { display: inline-flex; gap: 0.5rem; font-size: 0.75rem; }
.cr-mark { padding: 0 0.2rem; border-radius: 3px; }
.cr-mark--removed { background: var(--cr-bad-bg); color: var(--cr-bad); text-decoration: line-through; }
.cr-mark--flagged { background: #FAE0CE; color: var(--cr-warn); }
.cr-text { display: flex; flex-direction: column; gap: 0.25rem; }
.cr-text__body { margin: 0; font-size: 0.9rem; line-height: 1.6; white-space: pre-wrap; overflow-wrap: anywhere; }
.cr-after { margin-top: 0.25rem; padding: 0.5rem 0.75rem; border-radius: 6px; background: #F2F3F5; }
.cr-photos { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 0.75rem; }
.cr-photo { margin: 0; display: flex; flex-direction: column; gap: 0.3rem; }
.cr-photo__frame { position: relative; aspect-ratio: 4 / 3; border-radius: 4px; overflow: hidden; background: #E2E4E9; }
.cr-photo__frame img { width: 100%; height: 100%; object-fit: cover; display: block; }
.cr-photo__img--hidden { filter: blur(18px); }
.cr-photo--flagged .cr-photo__frame { outline: 2px solid #C46A1C; outline-offset: -2px; }
.cr-photo__score { position: absolute; top: 6px; right: 6px; padding: 0 0.45rem; border-radius: 999px; background: #fff; font-size: 0.72rem; font-weight: 700; }
.cr-history { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 0.6rem; font-size: 0.84rem; }
.cr-history li { display: flex; gap: 0.6rem; }
.cr-dot { flex: none; width: 8px; height: 8px; margin-top: 0.35rem; border-radius: 999px; background: #6F7687; }
.cr-dot--ok { background: #3D8B57; }
.cr-dot--warn { background: #C46A1C; }
.cr-dot--bad { background: #C23B34; }

/* Policy */
.cr-policy { display: flex; flex-direction: column; gap: 1rem; }
.cr-policy__bar { display: flex; align-items: center; gap: 1rem; flex-wrap: wrap; }
.cr-limits { display: flex; height: 10px; border-radius: 999px; overflow: hidden; }
.cr-limits__part { display: block; height: 100%; }
.cr-limits__words { display: flex; justify-content: space-between; }
.cr-rules { display: flex; flex-direction: column; }
.cr-rule { display: grid; grid-template-columns: minmax(0, 1fr) 210px 150px; gap: 1rem; align-items: center; padding: 0.55rem 0; border-top: 1px solid var(--cr-line); }
.cr-rule > span:first-child { display: flex; flex-direction: column; gap: 0.1rem; }
.cr-rule--head { border-top: 0; font-size: 0.74rem; font-weight: 600; color: var(--cr-muted); padding-top: 0; }
@media (max-width: 700px) { .cr-rule { grid-template-columns: 1fr; gap: 0.4rem; } .cr-rule--head { display: none; } }
.cr-try { display: flex; flex-direction: column; gap: 0.35rem; padding: 0.75rem; border-radius: 6px; background: #F2F3F5; }
.cr-try__head { display: flex; align-items: center; gap: 0.75rem; }

/* The owner's banner on a record that is not published yet */
.cr-banner { display: flex; gap: 0.9rem; align-items: flex-start; padding: 0.85rem 1rem; border-radius: 8px; border: 1px solid; margin-bottom: 1rem; }
.cr-banner--warn { background: #FFF4DE; border-color: #EBB75B; color: #5C3A06; }
.cr-banner--bad { background: #FDECEC; border-color: #E9A1A1; color: #6E1414; }
.cr-banner--info { background: #EEF5FC; border-color: #B6D4F2; color: #1E3A5F; }
.cr-banner__icon { font-size: 1.4rem; flex: none; }
.cr-banner__text { display: flex; flex-direction: column; gap: 0.2rem; font-size: 0.9rem; }
.cr-banner__text b { font-size: 0.98rem; }
