.section-header { --section-control-size:40px; }
.section-header.section-header .section-header-button { flex:0 0 var(--section-control-size); width:var(--section-control-size); height:var(--section-control-size); display:grid; place-items:center; padding:0; border:1px solid var(--line); border-radius:50%; background:var(--hover); color:var(--text); cursor:pointer; transform:none; transition:background .18s ease; }
.section-header.section-header .section-header-button :is(.ui-icon,svg) { width:18px; height:18px; }
.section-header .section-header-button:focus-visible { outline:2px solid var(--accent); outline-offset:3px; }
.section-header .section-header-button:active { opacity:.7; }
@media(min-width:761px) { .section-header.section-header .section-header-button { border:0; background:transparent; box-shadow:none; } .section-header.section-header .section-header-button :is(.ui-icon,svg) { width:21px; height:21px; } }
@media(max-width:760px) { .section-header { --section-control-size:44px; } }
@media(hover:hover) and (pointer:fine) { .section-header.section-header .section-header-button:hover { background:var(--hover); transform:none; } }
@media(prefers-reduced-motion:reduce) { .section-header .section-header-button { transition:none; } }