/* Decorative heading companions; no position overlays or extra controls. */
.ulom-section-heading { display: flex; align-items: center; gap: 10px; max-width: 100%; min-width: 0; }
.ulom-section-heading > .ulom-section-label { flex: 0 1 auto; min-width: 0; overflow-wrap: anywhere; }
.ulom-section-mascot { display: block; flex: 0 0 72px; width: 72px; height: 60px; max-width: 72px; overflow: visible; pointer-events: none; user-select: none; }
.ulom-section-mascot .ulom-mascot-soft { fill: var(--workflow-green-soft, #e8eedb); }
.ulom-section-mascot .ulom-mascot-yellow { fill: var(--workflow-yellow, #ebdda8); }
.ulom-section-mascot .ulom-mascot-body { fill: var(--workflow-green, #bfd398); stroke: var(--workflow-accent, #466527); stroke-width: 1.8; }
.ulom-section-mascot .ulom-mascot-eye { fill: var(--workflow-ink, #19243a); }
.ulom-section-mascot .ulom-mascot-smile { stroke: var(--workflow-ink, #19243a); stroke-width: 2.6; }
.ulom-section-mascot .ulom-mascot-hand { fill: var(--workflow-yellow, #ebdda8); stroke: var(--workflow-accent, #466527); stroke-width: 1.8; }
.ulom-section-mascot .ulom-mascot-wave-lines { stroke: var(--workflow-accent, #466527); stroke-width: 2.4; }
.ulom-section-mascot .ulom-mascot-shirt { fill: #fff; stroke: var(--workflow-ink, #19243a); stroke-width: 1.6; }
.ulom-section-mascot .ulom-mascot-shirt-seam { fill: none; stroke: var(--workflow-accent, #466527); stroke-width: 1.2; }
.ulom-section-mascot .ulom-mascot-swatch { stroke: var(--workflow-accent, #466527); stroke-width: 1.3; }
.ulom-section-mascot .ulom-mascot-swatch-back { fill: #fff; }
.ulom-section-mascot .ulom-mascot-swatch-middle { fill: var(--workflow-yellow, #ebdda8); }
.ulom-section-mascot .ulom-mascot-swatch-front { fill: var(--workflow-green-soft, #e8eedb); }
.ulom-section-mascot .ulom-mascot-swatch-weave { fill: none; stroke: var(--workflow-accent, #466527); stroke-width: .8; opacity: .45; }
.ulom-section-mascot.is-collar .ulom-mascot-wave-hand { transform-box: fill-box; transform-origin: 35% 95%; animation: ulom-mascot-wave 2.4s ease-in-out .2s 1; }
.ulom-section-mascot.is-fabric .ulom-mascot-character { transform-box: fill-box; transform-origin: 48% 80%; animation: ulom-mascot-nod 2.6s ease-in-out .3s 1; }
.ulom-section-mascot.is-method .ulom-mascot-reminder-hand { transform-box: fill-box; transform-origin: 35% 95%; animation: ulom-mascot-reminder 2.5s ease-in-out .2s 1; }
@keyframes ulom-mascot-wave { 0%, 100% { transform: rotate(0); } 24%, 60% { transform: rotate(-8deg); } 42%, 78% { transform: rotate(5deg); } }
@keyframes ulom-mascot-nod { 0%, 100% { transform: translateY(0) rotate(0); } 38% { transform: translateY(1px) rotate(3deg); } 67% { transform: translateY(0) rotate(-1deg); } }
@keyframes ulom-mascot-reminder { 0%, 100% { transform: rotate(0); } 30%, 68% { transform: rotate(-5deg); } 48% { transform: rotate(3deg); } }
@media (max-width: 380px) {
  .ulom-section-heading { gap: 6px; }
  .ulom-section-mascot { flex-basis: 60px; width: 60px; height: 50px; max-width: 60px; }
}
@media (prefers-reduced-motion: reduce) {
  .ulom-section-mascot.is-collar .ulom-mascot-wave-hand, .ulom-section-mascot.is-fabric .ulom-mascot-character, .ulom-section-mascot.is-method .ulom-mascot-reminder-hand { animation: none; transform: none; }
}
@media print { .ulom-section-mascot .ulom-mascot-wave-hand, .ulom-section-mascot .ulom-mascot-character, .ulom-section-mascot .ulom-mascot-reminder-hand { animation: none; transform: none; } }
