#tasks .task-section>h2:has(.tag-section-toggle){padding:0}
.tag-section-toggle{display:flex;align-items:center;gap:8px;width:100%;min-height:38px;padding:10px 12px;border:0;border-radius:0;background:transparent;color:inherit;text-align:left;font-size:inherit;font-weight:inherit}
.tag-section-toggle:hover{background:#6653b708}
.tag-section-toggle>.section-tag-dot{display:block;width:10px;height:10px;min-width:10px;border-radius:50%;background:var(--tag-edge,var(--tag-ink))}
.tag-section-toggle>.ui-icon{width:16px;height:16px}
.tag-section-count{margin-left:auto;font-size:11px;color:#94879f;font-weight:400}
.tag-section-toggle::after{content:'⌄';font-size:18px;line-height:1;transition:transform .18s ease;color:#94879f}
.tag-section-toggle[aria-expanded=true]::after{transform:rotate(180deg)}
.tag-section-toggle:focus-visible{outline:2px solid #a08be5;outline-offset:-2px}
@media(prefers-reduced-motion:reduce){.tag-section-toggle::after{transition:none}}
/* Expand controls stay visually clear after a touch; retain keyboard focus. */
#tasks .tag-section-expand{background:transparent;-webkit-tap-highlight-color:transparent}
#tasks .tag-section-expand:is(:hover,:active,:focus){background:transparent;box-shadow:none}
#tasks .tag-section-expand:focus:not(:focus-visible){outline:none}
#tasks .tag-section-expand:focus-visible{outline:2px solid #a08be5;outline-offset:-4px;border-radius:12px}
@media(hover:none),(pointer:coarse){#tasks .tag-section-toggle:is(:hover,:active){background:transparent;-webkit-tap-highlight-color:transparent}}
