.todo-page .interaction-status{display:none}
.todo-add-form{display:none;position:relative;margin:var(--space-16) 0}
.todo-add-border{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none;stroke:var(--color-teal-light)}
.is-editing .todo-add-form{display:block}
.todo-add-button,.todo-add-input{box-sizing:border-box;width:100%;min-height:48px;padding:var(--space-16);border:1.5px solid transparent;border-radius:var(--radius-container-nested);background:transparent;color:var(--ink);font:inherit;text-align:left}
.todo-add-button{color:var(--color-teal-light)}
.todo-add-input::placeholder{color:var(--color-teal-light);opacity:1}
.todo-add-input:focus,.todo-add-button:focus-visible{outline:none}
.todo-add-form:has(.todo-add-input:focus) .todo-add-border rect,.todo-add-form:has(.todo-add-button:focus-visible) .todo-add-border rect{stroke-dasharray:none}
.todo-list{margin:0 calc(-1 * var(--screen-gutter));padding:0;list-style:none;border-top:1px solid var(--divider-subtle-color)}
.todo-row{display:flex;align-items:center;gap:var(--space-16);padding:var(--space-16) var(--screen-gutter);border-bottom:1px solid var(--divider-subtle-color)}
.todo-title{flex:1;min-width:0;font-size:var(--body-md);line-height:var(--body-leading);overflow-wrap:anywhere}
.todo-complete{flex:0 0 40px;width:40px;height:40px;min-height:0;padding:var(--space-8);display:grid;place-items:center;background:transparent;color:var(--text-secondary);border-radius:50%;margin-right:calc(-1 * var(--space-8))}
.todo-complete svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.todo-complete>svg:not(.icon-feedback-rays) path{visibility:hidden}
.todo-complete[aria-checked=true] circle{fill:var(--color-teal-light);stroke:var(--color-teal-light)}
.todo-complete[aria-checked=true]>svg:not(.icon-feedback-rays) path{visibility:visible;stroke:white}
.todo-complete{position:relative;margin-right:0}
.todo-complete .icon-feedback-rays{inset:8px;width:24px;height:24px}
.todo-complete .icon-feedback-rays path{visibility:visible;fill:none;stroke:var(--color-teal-light);stroke-width:var(--icon-rays-stroke);stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1;opacity:0}
.todo-row.is-complete .todo-title{color:var(--text-secondary)}
.todo-title-text{background-image:linear-gradient(var(--color-teal-light),var(--color-teal-light));background-repeat:no-repeat;background-position:left 55%;background-size:0% 1.5px;box-decoration-break:slice;-webkit-box-decoration-break:slice}
.todo-row.is-complete .todo-title-text{background-size:100% 1.5px;transition:background-size var(--motion-lg) var(--motion-ease)}
@media(prefers-reduced-motion:reduce){.todo-row.is-complete .todo-title-text{transition:none}}
.todo-edit{background:var(--page-background-containers);color:var(--ink);border:1px solid var(--border-subtle-color);border-radius:var(--radius-container-nested);padding:var(--space-8) var(--space-12);min-height:0}
.todo-edit.cta-primary{background:var(--page-background-containers);color:var(--cta-primary-start);border-color:var(--cta-primary-start);box-shadow:none;border-radius:var(--radius-container-nested);padding:var(--space-8) var(--space-12)}
.todo-drag{flex:0 0 56px;width:56px;height:40px;min-height:0;padding:var(--space-8);background:transparent;color:var(--text-secondary);cursor:grab;touch-action:none;margin-right:calc(-1 * var(--space-8));border-radius:var(--radius-container-nested)}
.todo-drag span{font-size:24px;line-height:24px;display:block}
.todo-row.is-dragging{background:var(--page-background-containers)}
.todo-row.is-dragging .todo-drag{cursor:grabbing}
.todo-list{position:relative}
.todo-row.is-floating{position:fixed;z-index:40;box-sizing:border-box;background:var(--color-background-white);border-radius:var(--radius-container-nested);box-shadow:0 8px 24px rgb(5 22 46 / .18);transform:scale(1.015);transform-origin:center;user-select:none;will-change:top,transform;cursor:grabbing}
.todo-drag-placeholder{box-sizing:border-box;background:var(--background-subtle-light);border-bottom:1px solid var(--divider-subtle-color);list-style:none}
@media(prefers-reduced-motion:reduce){.todo-row.is-floating{transform:none}}



.is-editing .todo-row{touch-action:pan-y}
.todo-row.is-dragging{user-select:none}
.todo-drag .todo-grip{display:grid;grid-template-columns:repeat(2,3px);gap:3px;width:9px;margin:auto}
.todo-grip i{display:block;width:3px;height:3px;border-radius:50%;background:var(--companion-avatar-border)}
/* Only the grip captures dragging; row content retains native touch scrolling. */
.todo-row,.is-editing .todo-row{touch-action:pan-y}
.todo-drag{touch-action:none;cursor:grab;-webkit-touch-callout:none}
.todo-page .collection-section-heading{position:relative;z-index:auto}
.todo-page .collection-heading{z-index:10}
.todo-complete[hidden],.todo-drag[hidden]{display:none}
.todo-page .collection-heading{position:sticky;top:0;z-index:5;background:var(--page-background-default);margin-inline:calc(-1 * var(--screen-gutter));padding:var(--space-12) var(--screen-gutter)}
/* One vertical document scroller, including swipes begun on completion artwork. */
html.todo-document{overflow-x:clip;overflow-y:auto;touch-action:pan-y}
.todo-page{display:block;max-width:100%;overflow-x:clip;touch-action:pan-y}
.todo-page #surface{margin-block:0;min-width:0;box-sizing:border-box}
.todo-page #surface{
  min-height:max-content;
  padding-bottom:calc(var(--companion-avatar-size,100px) + var(--companion-avatar-offset,16px) + var(--navigation-height,76px) + var(--space-24));
}
.todo-title,.todo-title-text,.todo-complete{touch-action:pan-y}
.todo-complete svg,.todo-complete svg *{pointer-events:none}

.todo-completion-note{display:block;font-size:14px;color:var(--text-secondary,var(--ink));text-decoration:none;margin-top:4px}

/* Delegation remains visible; pink completion never means a queued handoff. */
.todo-row{position:relative}
.todo-row.handoff-staged .todo-title,.todo-row.handoff-staged .todo-complete{color:var(--rose-strong)}
.todo-row.handoff-assigned .todo-title,.todo-row.handoff-assigned .todo-complete{color:var(--rose-strong);opacity:1}
.todo-row.completed-by-monika .todo-complete[aria-checked=true] circle{fill:var(--rose-strong);stroke:var(--rose-strong)}
.todo-row.completed-by-monika .todo-title-text{background-image:linear-gradient(var(--rose-strong),var(--rose-strong))}
/* The opaque row slides over a flush action underneath it. */
.todo-row.has-handoff-swipe{display:block;padding:0;overflow:hidden;isolation:isolate;--handoff-width:128px}
.todo-swipe-content{position:relative;z-index:1;display:flex;align-items:center;gap:var(--space-16);padding:var(--space-16) var(--screen-gutter);width:100%;box-sizing:border-box;background:var(--page-background-default,#fff);touch-action:pan-y;transition:transform 220ms ease-out,box-shadow 220ms ease-out}
.todo-row.handoff-exposed .todo-swipe-content{box-shadow:5px 0 10px rgb(5 22 46 / .18)}
.todo-swipe-content{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
.todo-row.handoff-swiping .todo-swipe-content{transition:none;user-select:none}
.todo-handoff-action{position:absolute;inset:0 0 0 auto;z-index:0;display:flex;align-items:center;justify-content:center;width:var(--handoff-width);max-width:none;min-height:0;margin:0;padding:16px;box-sizing:border-box;border:0;border-radius:0;background:var(--rose-strong);color:white;text-align:center;font:inherit;line-height:1.25;box-shadow:none}
.todo-handoff-action[hidden],.is-editing .todo-handoff-action{display:none!important}
.is-editing .todo-swipe-content{transform:none!important;box-shadow:none!important}
@media(prefers-reduced-motion:reduce){.todo-swipe-content{transition:none}}
.todo-result-link{display:block;width:fit-content;font-size:14px;margin-top:4px}
/* A half-opacity band fades text left-to-right for 800 ms, then rests 1000 ms. */
.todo-row.handoff-assigned .todo-title-text{display:block;color:var(--rose-strong);background:none;-webkit-mask-image:linear-gradient(90deg,#000 42%,rgb(0 0 0 / .5) 50%,#000 58%);mask-image:linear-gradient(90deg,#000 42%,rgb(0 0 0 / .5) 50%,#000 58%);-webkit-mask-size:300% 100%;mask-size:300% 100%;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:100% 0;mask-position:100% 0;animation:todo-working-fade 1800ms infinite}
@keyframes todo-working-fade{0%{-webkit-mask-position:100% 0;mask-position:100% 0;animation-timing-function:ease-in-out}44.444444%,100%{-webkit-mask-position:0% 0;mask-position:0% 0}}
.todo-approval-sheet{position:fixed;inset:auto 0 0;margin:0 auto;width:min(100%,540px);box-sizing:border-box;max-height:75dvh;overflow:auto;border:0;border-radius:24px 24px 0 0;padding:24px 24px max(24px,env(safe-area-inset-bottom));background:var(--page-background-containers,#fff);color:var(--ink,#05162e)}
.todo-approval-sheet::backdrop{background:rgb(0 0 0 / .35)}
.todo-approval-body{white-space:pre-wrap;overflow-wrap:anywhere}
@media(prefers-reduced-motion:reduce){.todo-row.handoff-assigned .todo-title-text{animation:none;background:none;color:var(--rose-strong);-webkit-mask-image:none;mask-image:none}}
