/* Site / 152-FZ compliance checklist — scoped under .checklist, on site tokens. */
.checklist { max-width: 860px; display: grid; gap: 1.5rem; }
.checklist__intro { color: var(--text-2); font-size: var(--fs-sm); border-left: 2px solid var(--green); padding-left: 1rem; }

/* --- profile selector (site type + modifiers) --- */
.cl-profile { display: grid; gap: 1rem; border: 1px solid var(--line); border-radius: 14px; background: var(--ink-2); padding: 1.1rem 1.2rem; }
.cl-profile fieldset { border: 0; margin: 0; padding: 0; display: grid; gap: 0.6rem; }
.cl-profile legend { padding: 0; font-size: var(--fs-sm); font-weight: 600; color: var(--text); }
.cl-types { display: grid; gap: 0.6rem; }
.cl-types__opts { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.cl-type { display: grid; gap: 0.15rem; flex: 1 1 200px; min-height: 44px; padding: 0.6rem 0.85rem; border: 1px solid var(--line); border-radius: 12px; background: var(--ink); cursor: pointer; transition: border-color var(--t-fast), background var(--t-fast); }
.cl-type:has(input:checked) { border-color: var(--green); background: var(--green-soft); }
.cl-type:has(input:focus-visible) { outline: 2px solid var(--green-bright); outline-offset: 2px; }
.cl-type input { position: absolute; opacity: 0; pointer-events: none; }
.cl-type__name { font-weight: 600; color: var(--text); font-size: var(--fs-sm); }
.cl-type__hint { color: var(--text-3); font-size: var(--fs-xs); }

.cl-mods__opts { display: flex; flex-wrap: wrap; gap: 0.4rem; }
.cl-mod { display: inline-flex; align-items: center; gap: 0.45rem; min-height: 40px; padding: 0.4rem 0.75rem; border: 1px solid var(--line); border-radius: 10px; background: var(--ink); cursor: pointer; font-size: var(--fs-sm); color: var(--text-2); transition: border-color var(--t-fast), background var(--t-fast); }
.cl-mod input { accent-color: var(--green); width: 16px; height: 16px; }
.cl-mod:has(input:checked) { border-color: var(--green); background: var(--green-soft); color: var(--text); }
.cl-mod:has(input:focus-visible) { outline: 2px solid var(--green-bright); outline-offset: 2px; }
.cl-mod:has(input:disabled) { opacity: 0.45; cursor: not-allowed; }
.cl-mods__note { color: var(--text-3); font-size: var(--fs-xs); margin: 0; }

.cl-hidden-note { color: var(--text-3); font-size: var(--fs-xs); margin: 0; }

/* --- sections + items (same as ai-fz) --- */
.cl-section { border: 0; margin: 0; padding: 0; display: grid; gap: 0.75rem; }
.cl-section[hidden] { display: none; }
.cl-section > legend { padding: 0; margin: 1.25rem 0 0.5rem; font-size: var(--fs-h3); font-weight: 600; color: var(--text); }

.cl-item { border: 1px solid var(--line); border-radius: 12px; background: var(--ink-1); padding: 1rem 1.1rem; display: grid; gap: 0.75rem; }
.cl-item[hidden] { display: none; }
.cl-item__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; }
.cl-item__q { margin: 0; color: var(--text); font-weight: 500; }
.cl-item__cond { display: block; margin-top: 0.25rem; font-size: var(--fs-xs); color: var(--text-3); font-weight: 400; }

.cl-badge { flex: none; font-family: var(--mono); font-size: var(--fs-xs); padding: 0.2rem 0.55rem; border-radius: 999px; border: 1px solid var(--line-2); color: var(--text-3); white-space: nowrap; }
.cl-badge.is-ok   { color: var(--green-bright); border-color: var(--green); background: var(--green-soft); }
.cl-badge.is-warn { color: #e0a23d; border-color: #e0a23d; }
.cl-badge.is-bad  { color: #e0533d; border-color: #e0533d; }
.cl-badge.is-na, .cl-badge.is-todo { color: var(--text-3); }

.cl-item__answers { display: flex; flex-wrap: wrap; gap: 0.4rem; }
.cl-opt { display: inline-flex; align-items: center; gap: 0.4rem; min-height: 40px; padding: 0.4rem 0.75rem; border: 1px solid var(--line); border-radius: 10px; background: var(--ink); cursor: pointer; font-size: var(--fs-sm); color: var(--text-2); transition: border-color var(--t-fast), background var(--t-fast); }
.cl-opt input { accent-color: var(--green); width: 16px; height: 16px; }
.cl-opt:has(input:checked) { border-color: var(--green); background: var(--green-soft); color: var(--text); }
.cl-opt:has(input:focus-visible) { outline: 2px solid var(--green-bright); outline-offset: 2px; }

.cl-item__more summary { cursor: pointer; font-size: var(--fs-sm); color: var(--text-3); }
.cl-item__more[open] summary { margin-bottom: 0.5rem; }
.cl-item__more p { color: var(--text-2); font-size: var(--fs-sm); margin: 0.4rem 0; }
.cl-item__rec { color: var(--text) !important; }
.cl-item__src { margin: 0.5rem 0 0; padding-left: 1.1rem; display: grid; gap: 0.25rem; }
.cl-item__src a { font-size: var(--fs-xs); }

/* --- result panel (same as ai-fz) --- */
.cl-result { border: 1px solid var(--line); border-radius: 14px; background: var(--ink-2); padding: 1.25rem; display: grid; gap: 1rem; }
.cl-result__level { font-size: var(--fs-h3); font-weight: 700; margin: 0; }
.cl-result__level.is-high { color: #e0533d; }
.cl-result__level.is-medium { color: #e0a23d; }
.cl-result__level.is-low { color: var(--green-bright); }
.cl-result__counts { margin: 0; color: var(--text-3); font-size: var(--fs-sm); font-family: var(--mono); }
.cl-result h3 { font-size: 1.0625rem; margin: 0.25rem 0 0; color: var(--text); }
.cl-result ul { margin: 0.25rem 0 0; padding-left: 1.25rem; display: grid; gap: 0.35rem; }
.cl-result li { color: var(--text-2); font-size: var(--fs-sm); }
.cl-result__fines li { color: var(--text); }
.cl-result__actions { margin: 0.25rem 0 0; padding-left: 1.5rem; list-style: decimal; }
.cl-result__actions li { margin-top: 0.35rem; }
.cl-result__actions li::marker { color: var(--green-bright); font-family: var(--mono); font-size: var(--fs-xs); }

.cl-cta { justify-self: start; }
.cl-actions { display: flex; flex-wrap: wrap; gap: 0.5rem; }

@media (max-width: 520px) {
  .cl-item__head { flex-direction: column-reverse; align-items: flex-start; }
}