/* One visual/state contract for existing original-task completion controls. */
:root { --task-check-size: 24px; }
.check-button { box-sizing: border-box; display: inline-grid; place-items: center; flex: 0 0 var(--task-check-size); width: var(--task-check-size); min-width: var(--task-check-size); height: var(--task-check-size); margin: 0; padding: 0; border: 2px solid var(--border, #2a3035); border-radius: 3px; background: var(--canvas, #0b0d0e); color: var(--success, #7cff6b); font-family: "JetBrains Mono", ui-monospace, SFMono-Regular, Consolas, monospace; font-size: 14px; font-weight: 900; line-height: 1; cursor: pointer; }
.check-button:hover:not(:disabled) { border-color: var(--accent, #7cff6b); }
.check-button:focus-visible { outline: 2px solid var(--focus-ring, #b7ffb0); outline-offset: 2px; }
button.check-button:disabled, input.check-button:disabled { cursor: not-allowed; opacity: .45; }
input.check-button[type="checkbox"] { appearance: none; }
input.check-button[type="checkbox"]:checked::after { content: "✓"; }
.execution-stack-check:has(input:checked) > span { color: var(--text-muted, #8a9299); text-decoration: line-through; }
.execution-stack-card .todo-text { position: relative; }
.completed .todo-text { color: var(--text-muted, #8a9299); }
.completed .todo-text::after { position: absolute; top: 50%; right: 0; left: 0; height: 2px; background: currentColor; content: ""; opacity: .85; transform: scaleX(1); transform-origin: left center; }
@media (max-width: 720px), (pointer: coarse) {
  :root { --task-check-size: 18px; }
}