.checklist-row { display: grid; grid-template-columns: 23px minmax(0,1fr) auto; align-items: center; column-gap: 13px; margin: 0; cursor: pointer; padding: 16px 0; }
.checklist-row > input[type=checkbox] { width: 21px; height: 21px; min-width: 21px; padding: 0; margin: 0; accent-color: var(--primary); cursor: pointer; }
.checklist-copy { min-width: 0; display: grid; gap: 3px; }
.checklist-name { display: block; color: var(--ink); font-size: 14px; line-height: 1.65; font-weight: 650; overflow-wrap: anywhere; word-break: keep-all; }
.checklist-description { display: block; color: var(--muted); font-size: 13px; line-height: 1.65; font-weight: 400; overflow-wrap: anywhere; word-break: keep-all; }
.checklist-state { color: var(--muted); font-size: 12px; font-weight: 450; white-space: nowrap; }
.checklist-row.done .checklist-state { color: var(--primary); font-weight: 650; }
.checklist-row.done .checklist-name { color: var(--primary); }
.checklist-tools { display: flex; gap: 16px; justify-content: space-between; align-items: center; margin-top: 9px; }
.checklist-tools p { margin: 0; font-size: 12px; }
.checklist-tools .text-button { flex: 0 0 auto; }
.checklist-empty { padding: 18px 0; font-size: 14px; }
.checklist-editor { width: min(640px,calc(100% - 28px)); max-width: 640px; }
.checklist-editor .section-title { margin-bottom: 12px; }
.checklist-editor > p { margin: 10px 0 20px; }
.checklist-settings-list { display: grid; gap: 12px; }
.checklist-setting { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: center; gap: 16px; border: 1px solid var(--line); background: var(--surface-soft); border-radius: 12px; padding: 16px; min-width: 0; }
.checklist-setting-copy { min-width: 0; }
.checklist-setting-copy strong { display: block; font-size: 14px; overflow-wrap: anywhere; }
.checklist-setting-copy p { margin: 3px 0 0; font-size: 12px; }
.checklist-setting-toggle { display: flex; align-items: center; gap: 8px; margin: 0; cursor: pointer; font-size: 12px; font-weight: 550; white-space: nowrap; }
.checklist-setting-toggle > input[type=checkbox] { width: 18px; height: 18px; min-width: 18px; margin: 0; padding: 0; accent-color: var(--primary); }
.checklist-setting-fields { min-width: 0; }
.checklist-setting-fields label { margin: 0 0 5px; font-size: 12px; }
.checklist-setting-fields input { margin: 0 0 10px; background: var(--surface); }
.checklist-setting-fields input:last-child { margin-bottom: 0; }
.checklist-add-panel { border-top: 1px solid var(--line); margin-top: 22px; padding-top: 18px; }
.checklist-add-panel h3 { margin: 0; }
.checklist-add-panel > .secondary { margin-top: 14px; }
.checklist-error { color: #963d55; font-size: 13px; margin: 15px 0 0; }
.checklist-error:empty { display: none; }
.checklist-editor-actions { justify-content: flex-end; padding-top: 18px; border-top: 1px solid var(--line); }
@media(max-width:520px) {
  .checklist-row { grid-template-columns: 22px minmax(0,1fr); gap: 4px 11px; }
  .checklist-row > input[type=checkbox] { grid-row: 1 / 3; align-self: center; }
  .checklist-state { grid-column: 2; white-space: normal; }
  .checklist-tools { align-items: flex-start; gap: 12px; }
  .checklist-setting { grid-template-columns: minmax(0,1fr); gap: 12px; padding: 14px; }
  .checklist-setting-toggle { padding-top: 9px; border-top: 1px solid var(--line); }
  .checklist-editor input { font-size: 16px; }
  .checklist-editor-actions > button { flex: 1; padding-inline: 10px; }
}