Controls are thumb-sized on touch screens, and labels wrap

Under (pointer: coarse) only, so desktop keeps daisyUI's sizes: buttons, tabs, inputs and selects are 44px tall and
icon buttons and tabs 44px wide; extra small buttons and the badges that act are 36px with a transparent ::after that
gives them a 44px hit area, and the rows of reactions and hashtags leave 8px between them so those areas don't overlap.
Checkboxes and radios are 24px, toggles 28, range thumbs 28, and a toggle's or checkbox's label at least 44px tall. At
every width, the label of a checkbox, radio or toggle now wraps: daisyUI's .label never does, and long ones (Groups,
the profile editor, Settings) ran past a phone's edge.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01LsXgEaXee4GCU1hwYgPJXw

Components/Content.razor

@@ -182,7 +182,7 @@
 					@* the reactions stand outside the content warning: they are not what it hides *@
 					@if (status.EmojiReactions.Count > 0)
 					{
-						<div class="flex flex-wrap gap-1" data-reactions>
+						<div class="flex flex-wrap gap-1 pointer-coarse:gap-2" data-reactions>
 							@foreach (var reaction in status.EmojiReactions)
 							{
 								<DButton Size="DSize.Xs" Active="reaction.Me" Disabled="@(IsDefaultDisabled || isActing || Compact || Post.Located)"
@@ -694,7 +694,7 @@
 
 		@if (status.Tags.Count > 0)
 		{
-			<div class="flex flex-wrap gap-1">
+			<div class="flex flex-wrap gap-1 pointer-coarse:gap-2">
 				@foreach (var tag in status.Tags)
 				{
 					<button type="button" class="badge badge-soft badge-sm" @onclick="() => OnTag.InvokeAsync(tag.Name)">#@tag.Name</button>